@property --grid-flash{syntax:"<color>";inherits:false;initial-value:#f04ff0}@property --grid-glow{syntax:"<color>";inherits:false;initial-value:#001287}@property --grid-tint{syntax:"<color>";inherits:false;initial-value:#9a8cff}.cursor-grid{z-index:3;pointer-events:none;--grid-tint:oklch(from var(--color-blue) .703 calc(c * .56) calc(h + 20));--grid-glow:oklch(from var(--color-blue) .297 calc(c * .63) calc(h - 2));--grid-flash:var(--color-pink);width:100%;height:100%;position:absolute;inset:0}
.page-win{background:0 0;border:0;width:min(100vw - 2.5rem,92rem);max-width:none;height:calc(100svh - 2.5rem);max-height:none;margin:auto;padding:0;overflow:visible}.page-win[open]{animation:page-pop .2s var(--ease-slam)}@keyframes page-pop{0%{opacity:0;scale:.96}}.page-win::backdrop{background:#ffffffb8}.page-sheet{border:4px solid var(--color-band);background:var(--color-paper);height:100%;color:var(--color-band);grid-template-rows:auto minmax(0,1fr);display:grid;overflow:hidden}.page-top{border-bottom:4px solid var(--color-band);background:var(--color-blue);height:3.5rem;color:var(--color-on-blue);align-items:center;gap:.75rem;padding-inline:1rem .5rem;display:flex}.page-star{width:1.5rem;color:var(--color-volt);flex:none}.page-name{font-family:var(--font-pixel);font-size:1.375rem;line-height:1}.page-glyphs{color:var(--color-volt);font-family:var(--font-sans);letter-spacing:.04em;align-self:flex-start;margin-top:.75rem;font-size:.75rem;font-weight:700}.page-checks{align-items:flex-start;height:1.25rem;margin-left:auto;display:flex}.page-checks .oug-micro{height:100%}.page-pink{background:var(--color-volt);width:.625rem;height:.625rem}.page-close{background:var(--color-paper);width:2.5rem;height:2.5rem;color:var(--color-band);transition:background-color var(--duration-fast) var(--ease-out);place-items:center;margin-left:.5rem;display:grid}.page-close:hover{background:var(--color-volt);color:var(--color-on-volt)}.page-body{overscroll-behavior:contain;scrollbar-width:none;min-height:0;padding:1.5rem;overflow-y:auto}.page-body:has(.sheet-micro-bottom){padding-bottom:0}@media (max-width:767px){.page-win{width:calc(100vw - 1rem);height:calc(100svh - 1rem)}.page-glyphs,.page-checks{display:none}.page-close{margin-left:auto}.page-body{padding-inline:1rem}}@media (prefers-reduced-motion:reduce){.page-win[open]{animation:none}}
.micro{--gutter:1.5rem;--ink:oklch(from var(--color-blue) min(l, .55) c h);--mute:#d4d4d4;color:var(--ink);pointer-events:none;-webkit-user-select:none;user-select:none;align-items:center;gap:1.25rem;display:flex;overflow:hidden;-webkit-mask-image:url(/assets/micro/grain.png);mask-image:url(/assets/micro/grain.png);-webkit-mask-size:160px;mask-size:160px}.micro-band{height:5.75rem;padding:.75rem var(--gutter);flex-wrap:wrap;justify-content:space-between;row-gap:2rem}.micro-spine{background:var(--ink);color:#fff;width:1.75rem;font-family:var(--font-pixel);letter-spacing:.08em;writing-mode:vertical-rl;flex:none;align-self:stretch;place-items:center;font-size:.625rem;display:grid}.micro-word{font-family:var(--font-sans);letter-spacing:-.06em;flex:none;padding-right:1.25rem;font-size:4.5rem;line-height:.75}.micro-pill{background-color:var(--ink);border-radius:999px;flex:none;width:11rem;height:3.75rem;position:relative;overflow:hidden}.micro-pill:after{content:"";background:var(--color-band);-webkit-mask:var(--dots) center / cover no-repeat;mask:var(--dots) center / cover no-repeat;position:absolute;inset:0}.micro-lines{font-family:var(--font-sans);flex:none;gap:.25rem;font-size:.8125rem;line-height:1.15;display:grid}.micro-lines>span:last-child{padding-left:2.5rem}.micro-lines sup,.micro-readout-top{font-family:var(--font-pixel);font-size:.625rem}.micro-lines sup{margin-left:.125rem}.micro-readout{flex:none;gap:.375rem;width:9rem;display:grid}.micro-readout-top{justify-content:space-between;font-size:.75rem;display:flex}.micro-track{background:var(--ink);height:2px;margin-inline:.375rem;position:relative}.micro-track:before,.micro-track:after{content:"";border-radius:50%;width:.75rem;height:.75rem;position:absolute;top:50%;translate:-50% -50%}.micro-track:before{background:var(--ink);left:0}.micro-track:after{box-shadow:inset 0 0 0 2px var(--ink);background:#fff;left:100%}.micro-checks{flex:none;gap:.375rem;height:3.25rem;display:grid}.micro-checks .oug-micro{height:1.4375rem}.micro-grey{color:var(--mute)}.micro-star{font-family:var(--font-sans);flex:none;font-size:1.5rem;font-weight:700;line-height:1}.micro-word{position:relative}.micro-word-star{width:1.5rem;color:var(--color-volt);position:absolute;top:-.75rem;right:0}.micro-pair{flex:none;height:3.5rem;display:flex}.micro-pair .oug-micro{--oug-micro-stroke:2.5;height:100%}.micro-pair .oug-micro+.oug-micro{margin-left:-1.25rem}.micro-next{pointer-events:auto}.micro-next .oug-micro{transition:translate var(--duration-fast) var(--ease-out)}.micro-next:hover .oug-micro{translate:.375rem}.micro-next:hover .oug-micro+.oug-micro{translate:.75rem}.micro-next:focus-visible{outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:2px}.micro-morse{height:.75rem;margin-inline:var(--gutter);gap:1.25rem}.micro-morse-word{flex:none;align-items:center;gap:.75rem;display:flex}.micro-morse-letter{gap:.25rem;display:flex}.micro-morse-letter>span{background:var(--ink);height:4px}.micro-morse-letter>[data-mark=dot]{width:4px}.micro-morse-letter>[data-mark=dash]{width:1.125rem}.micro-slash{background:var(--ink);width:4px;height:.75rem;transform:skew(-30deg)}.micro-handle{font-family:var(--font-sans);flex:none;gap:.125rem;font-size:.8125rem;line-height:1.15;display:grid}.micro-handle>span:last-child{padding-left:1.5rem}@container band (max-width:1400px){.micro-lines{display:none}}@container band (max-width:1150px){.micro-readout{display:none}}@container band (max-width:950px){.micro-checks,.micro-handle>span:last-child{display:none}}@container band (max-width:750px){.micro-band{height:4.5rem}.micro-word{font-size:3.25rem}.micro-pill{width:6rem;height:2.5rem}.micro-star,.micro-pair{display:none}}@container band (max-width:480px){.micro-handle{display:none}}@media (max-width:767px){.micro{--gutter:1rem}}.sheet-micro{margin-inline:-1.5rem;display:grid;container:band/inline-size}@media (max-width:767px){.sheet-micro{margin-inline:-1rem}}.sheet-micro-top{margin-top:-.75rem;margin-bottom:1.25rem}.work-sheet .sheet-micro-top{margin-bottom:1rem}.sheet-micro-bottom{margin-top:2.5rem}.sheet-micro-end{padding-bottom:1.5rem}.work-sheet{grid-template-rows:auto minmax(0,1fr) auto;height:100%;display:grid}.work-sheet .sheet-micro-bottom{margin-top:1.5rem}
.loader{--gutter:calc(min(15vw, 17svh) + 4rem);--type-ink:#fff;z-index:90;background:var(--color-blue);color:#fff;pointer-events:none;animation:loader-out .18s var(--ease-out) 1.58s forwards;position:fixed;inset:0;overflow:hidden}.loader:after{content:"";opacity:0;background:#fff;animation:80ms linear 1.5s forwards loader-flash;position:absolute;inset:0}@keyframes loader-out{to{opacity:0;visibility:hidden}}@keyframes loader-flash{to{opacity:1}}.loader-type{animation:loader-rise .45s var(--ease-out) backwards}@keyframes loader-rise{0%{clip-path:inset(100% 0 0);translate:0 -2rem}to{clip-path:inset(0)}}.loader .loader-micro{display:flex}.loader-micro{animation:loader-reveal .4s var(--ease-out) .1s backwards}.loader-mark{top:4.5rem;right:var(--edge,2rem);bottom:2rem;left:var(--gutter);grid-template-columns:min(46rem,66vw);place-content:center;gap:1.25rem;display:grid;position:absolute}.loader-logo{animation:loader-reveal .45s var(--ease-in-out) 50ms backwards}@keyframes loader-reveal{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}.loader-bar{background:var(--color-volt);transform-origin:0;height:.875rem;animation:loader-fill .75s var(--ease-in-out) 50ms backwards, loader-blink .12s steps(1) .8s 3}.loader-status{font-family:var(--font-pixel);font-size:clamp(1rem,1.4vw,1.375rem);line-height:1;display:grid}.loader-status>*{grid-area:1/1}.loader-busy{animation:1ms .8s forwards loader-swap}.loader-dots{animation:.45s steps(4,jump-none) infinite loader-dots;display:inline-block}.loader-done{color:var(--color-volt);visibility:hidden;animation:1ms .8s forwards loader-show,.12s step-end .8s 3 loader-blink}@keyframes loader-blink{50%{opacity:0}}@keyframes loader-dots{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}@keyframes loader-swap{to{visibility:hidden}}@keyframes loader-show{to{visibility:visible}}@keyframes loader-fill{0%{transform:scaleX(0)}}@media (max-width:767px){.loader{--gutter:calc(min(15vw, 17svh) + 1.5rem)}.loader .poster-type{justify-content:center}.loader .loader-micro{left:var(--gutter);gap:.75rem}.loader-micro .micro-readout,.loader-micro .micro-pair{display:none}.loader-mark{bottom:1rem;right:1rem}}@media (prefers-reduced-motion:reduce){.loader{display:none}}
