:root{color-scheme:light;--ground:#f4f1e9;--ink:#171614;--pitch:16px;background:var(--ground);color:var(--ink)}body{margin:0;overflow:hidden}main{position:relative;display:grid;place-items:center;width:100%;height:100svh;min-height:260px;overflow:hidden}.wrapper{--diameter:min(1000px,calc(100vw - 24px),calc(100svh - 100px));width:var(--diameter);height:var(--diameter);box-shadow:0 0 calc(30px * var(--pattern-scale,1)) calc(10px * var(--pattern-scale,1)) #00000023;visibility:hidden}.wrapper,.wrapper div{display:block;width:100%;height:100%;border-radius:50%;transform:rotate(20deg);background-image:repeating-linear-gradient(transparent,transparent calc(var(--pitch) - var(--stripe,0px)),black calc(var(--pitch) - var(--stripe,0px)),black var(--pitch));animation:120s rot linear infinite;animation-play-state:paused}.wrapper{width:var(--diameter);height:var(--diameter)}.ready .wrapper{visibility:visible}@keyframes rot{0%{transform:rotate(20deg)}100%{transform:rotate(380deg)}}#status{position:absolute;top:48%;left:22px;right:22px;margin:0;text-align:center;font:11px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;color:#5c564b}#status:empty{display:none}.study-key{position:fixed;z-index:10;left:25px;right:25px;bottom:18px;display:flex;align-items:center;gap:12px;color:#484239;font:10px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.015em;pointer-events:none}.study-key span{margin-right:auto;max-width:calc(100% - 110px)}button{font:inherit;color:inherit;border:0;background:transparent;cursor:pointer;min-width:44px;min-height:44px;padding:10px;pointer-events:auto}.study-key button{background:#f4f1e9e8;border-radius:50%}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible{outline:2px solid #655546;outline-offset:3px}dialog{box-sizing:border-box;width:min(500px,calc(100vw - 36px));max-height:87svh;overflow:auto;padding:34px;border:0;background:var(--ground);color:#24201c;box-shadow:0 12px 80px #0002;font:16px/1.6 Georgia,serif}dialog::backdrop{background:#f4f1e9bb;backdrop-filter:blur(5px)}dialog h1{font-size:34px;font-weight:400;line-height:1.1;letter-spacing:-.035em;margin:0 0 24px}dialog p{margin:0 0 20px}.source-note{font-size:13px;line-height:1.6;color:#514a40}table{border-collapse:collapse;width:100%;font:11px/1.8 ui-monospace,SFMono-Regular,Consolas,monospace;margin:24px 0 26px;font-variant-numeric:tabular-nums}caption{font-size:9px;line-height:1.5;text-align:left;margin-bottom:10px;color:#675c4c}th,td{text-align:right;padding:2px 0;font-weight:400}th:first-child{text-align:left}thead{color:#675c4c}tfoot th,tfoot td{border-top:1px solid #675c4c40;padding-top:7px}dialog .signature{margin-top:26px;font:11px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace}dialog a{color:inherit;text-underline-offset:.2em}dialog button{font:11px ui-monospace,SFMono-Regular,Consolas,monospace;padding-left:0;text-align:left}@media(max-width:500px){.study-key{left:16px;right:12px;bottom:12px;gap:3px;font-size:9px}.wrapper{--diameter:min(1000px,calc(100vw - 24px),calc(100svh - 100px))}dialog{padding:28px;font-size:15px}}@media(prefers-reduced-motion:reduce){dialog::backdrop{backdrop-filter:none}}

dialog .caption-close{position:absolute;right:10px;top:10px;font:24px/1 Arial,sans-serif;padding:6px;text-align:center}

main{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}

/* Reserve the controls without cropping any of the eight circular layers. */
main{height:calc(100svh - 76px);min-height:0}