html:has(.game),html:has(.game) body{background:#1c1713;height:100%;overflow:hidden}.game{--paper:var(--color-bg,#f5f1ea);--paper-2:var(--color-surface,#ece2d3);--line:var(--color-border,#d9cab3);--ink:var(--color-text,#3b2a20);--ink-soft:var(--color-text-muted,#7a6552);--ease:cubic-bezier(.22, .8, .24, 1);font-family:var(--font-body,system-ui, sans-serif);-webkit-user-select:none;user-select:none;position:fixed;inset:0;overflow:hidden}.game canvas{touch-action:none;width:100%;height:100%;position:absolute;inset:0}.labels{pointer-events:none;position:absolute;inset:0;overflow:hidden}.zone-label{width:max-content;max-width:min(320px,100vw - 32px);font-family:var(--font-display,serif);letter-spacing:.01em;text-align:center;color:var(--ink);background:var(--paper);will-change:transform;opacity:0;visibility:hidden;transition:opacity .18s var(--ease), visibility .18s;border-radius:18px;justify-content:center;align-items:center;gap:8px;padding:7px 14px;font-size:15px;font-weight:500;line-height:1.2;display:flex;position:absolute;top:0;left:0;box-shadow:inset 0 1px #ffffffb3,0 6px 18px #28180a47,0 0 0 1px #3b2a201f}.zone-label.visible{opacity:1;visibility:visible}.edge-arrow{z-index:2;color:#f5f1ea;cursor:pointer;opacity:0;visibility:hidden;pointer-events:none;width:44px;height:44px;transition:opacity .22s var(--ease), visibility .22s, background .12s;background:#14110e8c;border:0;border-radius:50%;place-items:center;padding:0;display:grid;position:absolute;top:50%;transform:translateY(-50%);box-shadow:0 0 0 1px #ffffff2e}.edge-arrow.left{left:max(14px,1.5vw)}.edge-arrow.right{right:max(14px,1.5vw)}.edge-arrow.visible{opacity:1;visibility:visible;pointer-events:auto}.edge-arrow.visible.end{opacity:.35}.edge-arrow:hover{background:#14110ed1}.edge-arrow:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.edge-arrow.bump.left{animation:edge-bump-left .32s var(--ease)}.edge-arrow.bump.right{animation:edge-bump-right .32s var(--ease)}@keyframes edge-bump-left{0%,to{transform:translateY(-50%)}30%{transform:translate(-7px,-50%)}60%{transform:translate(2px,-50%)}}@keyframes edge-bump-right{0%,to{transform:translateY(-50%)}30%{transform:translate(7px,-50%)}60%{transform:translate(-2px,-50%)}}.hint{--pulse:.5;pointer-events:none;width:max-content;max-width:calc(100vw - 32px);margin:0;position:absolute;top:0;left:0}.hint-body{opacity:0;align-items:center;display:flex}.toast{letter-spacing:.01em;color:var(--paper);backdrop-filter:blur(6px);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .24s var(--ease), transform .24s var(--ease);background:#241a12c7;border-radius:999px;margin:0;padding:8px 16px;font-size:14px;font-weight:500;position:absolute;bottom:22px;left:50%;transform:translate(-50%,6px)}.toast.show{opacity:1;transform:translate(-50%)}.hint-shade{min-width:0;filter:drop-shadow(0 calc(3px + var(--pulse) * 3px) calc(4px + var(--pulse) * 4px) #0e080480) drop-shadow(0 0 calc(var(--pulse) * 12px) #ffe4aa4d);flex:0 auto;display:block}.hint.above .hint-body{flex-direction:column;align-items:flex-start}.hint-paper{--tilt:-2.5deg;font-family:var(--font-hand,cursive);text-align:left;color:var(--ink);background-blend-mode:normal, normal, multiply;transform:rotate(calc(var(--tilt) + (var(--pulse) - .5) * 1.2deg)) scale(calc(1 + var(--pulse) * .03));background-color:#fffbee;background-image:linear-gradient(90deg,#0000 27px,#be584e80 27px 28.5px,#0000 28.5px),linear-gradient(#0000 23px,#56749e52 23px),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='200'%3E%3Cfilter id='c' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='turbulence' baseFrequency='0.022 0.03' numOctaves='3' seed='11'/%3E%3CfeDiffuseLighting surfaceScale='4.5' lighting-color='%23fff'%3E%3CfeDistantLight azimuth='235' elevation='70'/%3E%3C/feDiffuseLighting%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23c)'/%3E%3C/svg%3E");background-position:0 0,0 12px,0 0;background-repeat:no-repeat,repeat-y,repeat;background-size:auto,100% 24px,320px 200px;padding:12px 20px 10px 36px;font-size:22px;font-weight:600;line-height:24px;display:block;position:relative}.hint.above .hint-paper{--tilt:1.5deg}.hint-paper .scribble{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 8' preserveAspectRatio='none'%3E%3Cpath d='M1 5 C 18 1, 34 7, 52 3 S 84 5, 99 2' fill='none' stroke='%233b2a20' stroke-width='1.8' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") 0 100%/100% 8px no-repeat;padding-bottom:2px}.hint-arrow{fill:none;stroke:#fffaf0;filter:drop-shadow(0 0 calc(3px + var(--pulse) * 5px) #ffe4aaf2);stroke-width:2.6px;stroke-linecap:round;stroke-linejoin:round;flex:none;display:none;overflow:visible}.hint-arrow path{stroke-dasharray:1;stroke-dashoffset:1px}.hint:not(.above) .hint-arrow.side{width:52px;height:30px;transform:translateX(calc(var(--pulse) * 4px));margin-left:2px;display:block}.hint.above .hint-arrow.down{width:30px;height:52px;margin-top:2px;margin-left:calc(var(--ax,40px) - 15px);transform:translateY(calc(var(--pulse) * 4px));display:block}.hint.shown .hint-body{animation:.7s cubic-bezier(.3,1.5,.5,1) both hint-toss}.hint.shown .hint-arrow path{animation:.6s ease-out .65s forwards hint-draw}.hint.shown.gone .hint-body{animation:.38s ease-in both hint-leave}@keyframes hint-toss{0%{opacity:0;transform:translateY(-14px)rotate(-8deg)scale(.6)}to{opacity:1;transform:none}}@keyframes hint-draw{to{stroke-dashoffset:0}}@keyframes hint-leave{0%{opacity:1;transform:none}to{opacity:0;transform:translateY(12px)rotate(4deg)scale(.92)}}.backdrop{cursor:zoom-out;background:0 0;position:absolute;inset:0}.panel{z-index:2;overscroll-behavior:contain;color:var(--ink);background:var(--paper);-webkit-user-select:text;user-select:text;opacity:0;transition:transform .46s var(--ease), opacity .26s ease;flex-direction:column;display:flex;position:absolute;overflow:auto;box-shadow:0 24px 60px #1e100661,0 0 0 1px #3b2a201a}.panel[hidden]{display:none}.panel.open{opacity:1;transform:none}.panel[data-side=right],.panel[data-side=left]{border-radius:18px;width:min(460px,42vw);max-height:calc(100% - 48px);top:50%}.panel[data-side=right]{right:max(24px,3vw);transform:translate(36px,-50%)}.panel[data-side=left]{left:max(24px,3vw);transform:translate(-36px,-50%)}.panel[data-side=right].open,.panel[data-side=left].open{transform:translateY(-50%)}.panel[data-side=bottom]{max-height:50%;transition:transform .46s var(--ease), opacity .26s ease, max-height .32s var(--ease);border-radius:18px;bottom:8px;left:8px;right:8px;transform:translateY(40px)}.panel[data-side=bottom].expanded{max-height:calc(100% - 64px)}.grip{cursor:pointer;background:0 0;border:0;flex:none;width:100%;height:22px;padding:0;display:none}.grip span{background:var(--line);border-radius:999px;width:40px;height:4px;margin:8px auto 0;display:block}.panel[data-side=bottom] .grip{display:block}.close{z-index:2;width:34px;height:34px;color:var(--ink);background:color-mix(in srgb, var(--paper) 86%, transparent);cursor:pointer;border:0;border-radius:50%;place-items:center;padding:0;transition:background .15s;display:grid;position:absolute;top:14px;right:14px;box-shadow:0 0 0 1px #3b2a2024}.close:hover{background:var(--paper-2)}.close:focus-visible,.btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.body{gap:12px;padding:20px 22px 22px;display:grid}.head{align-items:flex-start;gap:14px;padding-right:34px;display:flex}.head[hidden],.logo[hidden]{display:none}.logo{object-fit:cover;background:var(--paper-2);width:52px;height:52px;box-shadow:0 0 0 1px var(--line);border-radius:12px;flex:none}.head-text{gap:4px;min-width:0;display:grid}.kicker{letter-spacing:.09em;text-transform:uppercase;color:var(--ink);margin:0;font-size:12px;font-weight:600}.panel h2{font-family:var(--font-display,serif);letter-spacing:-.01em;color:var(--ink);margin:0;font-size:clamp(24px,2.2vw,30px);font-weight:500;line-height:1.12}.role{color:var(--ink-soft);margin:0;font-size:15px;font-weight:500}.summary{color:var(--ink);margin:2px 0 0;font-size:15.5px;line-height:1.55}.bullets{gap:9px;margin:2px 0 0;padding:0;list-style:none;display:grid}.bullets[hidden]{display:none}.bullets li{color:var(--ink);padding-left:16px;font-size:14.5px;line-height:1.5;position:relative}.bullets li:before{content:"";background:var(--ink);border-radius:50%;width:6px;height:6px;position:absolute;top:.62em;left:1px}.tags{flex-wrap:wrap;gap:6px;margin:4px 0 0;padding:0;list-style:none;display:flex}.tags[hidden]{display:none}.tag{color:var(--ink-soft);background:var(--paper-2);border-radius:999px;padding:3px 10px;font-size:12.5px;font-weight:500}.actions{flex-wrap:wrap;gap:8px;margin-top:10px;display:flex}.btn{appearance:none;font:inherit;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:10px 16px;font-size:14.5px;font-weight:600;transition:background .15s,box-shadow .15s,transform .15s}.btn:hover{background:var(--paper-2)}.btn.primary{color:var(--paper);background:var(--ink);box-shadow:none}.btn.primary:hover{background:color-mix(in srgb, var(--ink) 82%, #fff);transform:translateY(-1px)}.panel[data-variant=link]{width:auto;max-height:none;box-shadow:none;background:0 0;border-radius:0;inset:max(14px,2vh) max(18px,2vw) auto auto;overflow:visible;transform:none}.panel[data-variant=link] .grip,.panel[data-variant=link] .close,.panel[data-variant=link] .head,.panel[data-variant=link] .logo,.panel[data-variant=link] .summary,.panel[data-variant=link] .bullets,.panel[data-variant=link] .tags{display:none}.panel[data-variant=link] .body{padding:0;display:block}.panel[data-variant=link] .actions{margin:0}.panel[data-variant=link] .btn{color:#f5f1ea;box-shadow:none;text-underline-offset:4px;text-shadow:0 1px 8px #000000a6;background:0 0;padding:8px 6px;font-size:14px;font-weight:500;text-decoration:underline}.panel[data-variant=link] .btn:hover{color:#fff;background:0 0;transform:none}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.fallback{background:var(--paper);color:var(--ink);z-index:-1;align-content:center;justify-items:center;gap:12px;font-size:18px;display:none;position:absolute;inset:0}.fallback a{color:var(--color-accent,#8a5a35)}.game.no-webgl .fallback{display:grid}.game.ready .fallback{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;display:grid;inset:auto;overflow:hidden}@media (prefers-reduced-motion:reduce){.hint.shown .hint-body,.hint.shown.gone .hint-body{opacity:1;transition:opacity .12s;animation:none}.hint.shown.gone .hint-body{opacity:0}.hint-arrow path,.hint.shown .hint-arrow path{stroke-dashoffset:0;animation:none}.panel,.toast,.zone-label{transition:opacity .12s}.panel[data-side]{transform:none}.panel[data-side=right],.panel[data-side=left]{transform:translateY(-50%)}.edge-arrow.bump{animation:none}}.intro{--film:#0c0a09;--hole:#080706;--amber:#e8a33d;--backdrop:#18130f;z-index:50;background-color:var(--backdrop);--spin:720deg;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.07 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E"),radial-gradient(85% 78% at 42% 38%,#251e18 0%,#1e1914 28%,#18130f 58%,#100d0a 100%);background-size:160px 160px,100% 100%;place-items:center;display:grid;position:absolute;inset:0}.intro[hidden]{display:none}.intro-reel{--band:2cqw;--gap:.8cqw;--tongue:4cqw;--u:.084cqw;--stage-h:calc(var(--u) * 166.8);--film-top:calc(var(--u) * 17.6);--slit:calc(var(--u) * 79);--film-w:calc(100cqw - var(--slit));--frame-w:calc((var(--film-w) - var(--gap) - .6cqw - var(--tongue) - var(--n) * var(--gap)) / var(--n));--film-h:calc(2 * var(--band) + var(--frame-w) * .75);--far:120cqw;width:clamp(min(300px,100vw - 32px),90vw,960px);position:relative;container-type:inline-size}.intro-stage{height:var(--stage-h);position:relative}.intro-gate{z-index:2;left:var(--slit);top:var(--film-top);width:var(--film-w);position:absolute;overflow:hidden}.intro-gate:after{content:"";pointer-events:none;background:linear-gradient(90deg,#0009,#00000038 1.8cqw,#0000 4.5cqw);position:absolute;inset:0}.intro-strip{box-sizing:border-box;grid-template-columns:repeat(var(--n), minmax(0, 1fr)) var(--tongue);column-gap:var(--gap);width:100%;padding:var(--band) 0 var(--band) calc(var(--gap) + .6cqw);--tip:2.4cqw;--m:.25cqw;--h:.6cqw;--solid:linear-gradient(var(--film), var(--film));--holes:repeating-linear-gradient(90deg, var(--film) 0 .4cqw, transparent .4cqw 1.5cqw, var(--film) 1.5cqw 1.9cqw);background:var(--solid) 0 calc(var(--m) + var(--h)) / calc(100% - var(--tip)) calc(100% - 2 * (var(--m) + var(--h))) no-repeat, var(--solid) 0 0 / calc(100% - var(--tip)) var(--m) no-repeat, var(--holes) 0 var(--m) / calc(100% - var(--tip)) var(--h) no-repeat, var(--solid) 0 100% / calc(100% - var(--tip)) var(--m) no-repeat, var(--holes) 0 calc(100% - var(--m)) / calc(100% - var(--tip)) var(--h) no-repeat;will-change:transform;align-items:center;display:grid;position:relative;transform:translate(-100%)}.intro-shadow-gate{z-index:1;left:var(--slit);top:calc(var(--film-top) - 3cqw);width:calc(var(--film-w) + 3cqw);height:calc(var(--film-h) + 6cqw);pointer-events:none;position:absolute;overflow:hidden}.intro-film-shadow{top:3cqw;left:calc(var(--far) * -1);width:var(--film-w);height:var(--film-h);box-shadow:calc(var(--far) + .55cqw) .75cqw 1.1cqw #00000080;will-change:transform;position:absolute;transform:translate(-100%)}.intro-tongue{align-self:stretch}.intro-tip{width:var(--tip);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' preserveAspectRatio='none'%3E%3Cpolygon points='0,0 10,2 10,8 0,10' fill='%230c0a09'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat;position:absolute;top:0;bottom:0;right:0}.intro-frame{margin:0;position:relative}.intro-window{aspect-ratio:4/3;background:var(--hole);display:block;position:relative;overflow:hidden}.intro-window img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.intro-window img.colour{opacity:0;will-change:opacity}.intro-frame.portrait .intro-window img{width:75%;height:133.333%;inset:50% auto auto 50%;transform:translate(-50%,-50%)rotate(-90deg)}.intro-frame.coloured .intro-window img.colour{opacity:1;transition:opacity .7s}.intro-num{z-index:0;color:var(--amber);opacity:.85;margin-top:.2cqw;font:600 1.1cqw/1 system-ui,sans-serif;position:absolute;top:100%;left:.2cqw}.intro-bar{background:#00000052;border-radius:99px;height:.6cqw;margin-top:-.1cqw;position:absolute;top:100%;left:0;right:0;overflow:hidden;box-shadow:inset 0 .1cqw .15cqw #0000008c,0 .1cqw #ffeed21f}.intro-bar-fill{border-radius:inherit;background:linear-gradient(#f6b957, var(--amber) 55%, #cc8828);transform-origin:0;will-change:transform;position:absolute;inset:0;transform:scaleX(0);box-shadow:inset 0 .08cqw #fff4d699}.intro-roll{z-index:3;left:calc(var(--u) * -4);width:calc(var(--u) * 90);aspect-ratio:var(--aspect);position:absolute;bottom:0}.can-art{width:100%;height:100%;display:block;overflow:visible}.can-knob{left:50%;top:var(--knob-top);width:var(--knob-w);aspect-ratio:var(--knob-ar);position:absolute;overflow:hidden;transform:translate(-50%,-50%)}.can-disc{width:calc(var(--frames) * 100%);will-change:transform;background-repeat:no-repeat;background-size:100% 100%;height:100%;display:block}.intro.leaving{opacity:0;pointer-events:none;transition:opacity .4s .45s}.intro.leaving .intro-reel{transition:transform .6s cubic-bezier(.55,0,.9,.6);transform:translate(115vw)}@media (prefers-reduced-motion:reduce){.intro{--spin:0deg!important}.intro-frame.coloured .intro-window img.colour{transition-duration:.2s}.intro.leaving{transition-delay:0s}.intro.leaving .intro-reel{transition:none;transform:none}}
