:root{--paper:#e8edeb;--ink:#26302e;--muted:#65736e;--accent:#d95835;--line:#c9d1cc;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden;overscroll-behavior:none}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button{touch-action:manipulation}#world{position:fixed;width:100%;height:100%;inset:0;touch-action:none;outline:none}header{position:fixed;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:calc(24px + env(safe-area-inset-top)) 36px 0;pointer-events:none}.wordmark{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font-size:22px;font-weight:600;letter-spacing:-1px;pointer-events:auto}.period{color:var(--accent)}.header-actions{display:flex;gap:12px;pointer-events:auto}.icon-button{width:42px;height:42px;border:1px solid var(--line);background:#e8edebaa;backdrop-filter:blur(8px);display:grid;place-items:center;border-radius:50%;padding:11px}.icon-button:hover{background:#fff8;border-color:var(--ink)}.icon-button svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.hud{position:fixed;top:calc(109px + env(safe-area-inset-top));left:36px;right:36px;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}.eyebrow{font-size:12px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1.7px;color:var(--muted)}h1{font-size:clamp(22px,3vw,36px);font-weight:400;letter-spacing:-1.3px;margin:9px 0}.metrics{display:flex;align-items:center;gap:27px}.metrics button{pointer-events:auto}.time{display:flex;flex-direction:column;gap:7px}.time #timer{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:28px;letter-spacing:-1.5px;font-variant-numeric:tabular-nums}.time.urgent #timer{color:var(--accent)}.shards{display:flex;gap:9px;padding:10px 0}.shard{width:11px;height:11px;transform:rotate(45deg);border:1.5px solid #9ca9a3;transition:background .2s,border-color .2s}.shard.collected{background:var(--accent);border-color:var(--accent);box-shadow:0 0 15px #d9583533}.hint{position:fixed;bottom:calc(100px + env(safe-area-inset-bottom));left:20px;right:20px;text-align:center;color:var(--muted);font-size:14px;pointer-events:none;transition:opacity .4s;text-wrap:balance}footer{position:fixed;bottom:0;left:0;right:0;padding:18px 36px calc(28px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:28px;pointer-events:none}.control-note{display:flex;gap:12px;align-items:center;font-size:12px;letter-spacing:1px;color:var(--muted);white-space:nowrap}.key{font-size:21px;color:var(--ink)}.journey{height:2px;max-width:280px;flex:1;background:#bac6be;margin:0 auto}.journey span{display:block;height:100%;width:0;background:var(--accent);transition:width .25s}.overlay{position:fixed;inset:0;display:grid;place-items:center;padding:24px;background:#e8edeb77;backdrop-filter:blur(12px);z-index:10}.overlay[hidden]{display:none}.panel{width:min(100%,430px);max-height:90dvh;overflow:auto;position:relative;padding:44px 34px 32px;background:#f5f7f4;border:1px solid #fff;border-radius:6px;box-shadow:0 20px 100px #26302e16}.panel-close{position:absolute;right:15px;top:15px;border:0;background:none}.panel h2{font-size:38px;line-height:1.1;letter-spacing:-1.5px;font-weight:400;margin:20px 0 16px}.panel p{font-size:16px;line-height:1.6;color:var(--muted)}.panel .eyebrow{color:var(--accent)}.primary,.secondary{display:block;width:100%;border-radius:3px;padding:15px 18px;font-size:15px;text-align:center;border:1px solid var(--ink);margin-top:12px}.primary{background:var(--ink);color:#f5f7f4}.primary:hover{background:#3a4943}.secondary{background:none;border-color:var(--line)}.level-button{width:100%;padding:18px 0;display:flex;justify-content:space-between;gap:12px;align-items:center;border:0;border-bottom:1px solid var(--line);background:none;text-align:left;font-size:16px}.level-button:hover{color:var(--accent)}.level-button span:first-child{color:var(--muted);font-family:ui-monospace,monospace;font-size:12px}.level-button b{font-weight:400;flex:1}.level-button em{font-size:13px;font-style:normal;color:var(--accent)}.result-stats{display:flex;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:24px 0;gap:36px;padding:20px 0}.result-stats strong{display:block;font-size:25px;font-weight:400;margin-top:8px}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}@media(max-width:600px){header{padding:calc(18px + env(safe-area-inset-top)) 20px 0}.wordmark{font-size:20px;gap:9px}.header-actions{gap:8px}.icon-button{width:38px;height:38px;padding:10px}.hud{top:calc(97px + env(safe-area-inset-top));left:21px;right:21px;display:block}.level-info h1{font-size:28px}.metrics{margin-top:23px;gap:23px;align-items:center}.time{flex-direction:row;align-items:center;gap:14px}.time .eyebrow{font-size:11px;letter-spacing:1px}.time #timer{font-size:23px}.metrics #restart{margin-left:auto;width:34px;height:34px;padding:9px}.shards{gap:8px}.shard{width:9px;height:9px}footer{padding:18px 22px calc(23px + env(safe-area-inset-bottom));gap:20px}.control-note{font-size:11px;letter-spacing:.5px;gap:9px}.journey{max-width:100px}.hint{font-size:13px;bottom:calc(80px + env(safe-area-inset-bottom));left:30px;right:30px}.panel{padding:42px 26px 26px}}@media(max-height:500px){.hud{top:80px}.level-info h1{font-size:22px}.metrics{margin-top:0}.hud{display:flex}.time .eyebrow{display:none}.hint{bottom:56px}footer{padding-bottom:12px}header{padding-top:12px}.panel{max-height:94dvh}}
footer{background:linear-gradient(0deg,#26302eeb,transparent)}footer .control-note{color:#c1cbc5}footer .key{color:#f4f7f2}footer .journey{background:#76847c77}.hint{left:50%;right:auto;transform:translateX(-50%);width:max-content;max-width:calc(100% - 40px);padding:10px 18px;border:1px solid #ffffff15;border-radius:30px;background:#26302ee6;color:#edf1ec;backdrop-filter:blur(8px)}
body{background:var(--paper)}.icon-button{background:color-mix(in srgb,var(--paper) 80%,transparent)}.wordmark{color:var(--ink)}.panel{background:var(--panel,#f5f7f4);border-color:var(--line)}.primary{background:var(--ink);color:var(--paper)}.night .primary:hover{background:#b9d6d1}.night .overlay{background:#040b1180}.night .icon-button:hover{background:#ffffff15}.night .panel{box-shadow:0 20px 100px #0006}.night .shard{border-color:#77948f}.night .shard.collected{border-color:var(--accent);background:var(--accent);box-shadow:0 0 15px color-mix(in srgb,var(--accent) 30%,transparent)}.level-scroll{max-height:46dvh;overflow:auto;overscroll-behavior:contain;margin:0 -12px;padding:0 12px;scrollbar-width:thin;scrollbar-color:var(--line) transparent}.region-label{font-size:11px;font-family:ui-monospace,monospace;font-weight:400;letter-spacing:1.5px;color:var(--muted);margin:23px 0 6px}.region-label:first-child{margin-top:4px}.level-button[aria-current]{color:var(--accent)}.panel:has(.level-scroll){overflow:hidden;max-height:calc(100dvh - 30px);padding-top:32px}.panel:has(.level-scroll) h2{font-size:31px;margin:14px 0 22px}.panel .instructions{font-size:13px;line-height:1.5;margin:17px 0 10px}.menu-heading{padding-right:13px}.menu-heading .eyebrow{font-size:11px;letter-spacing:1px}.panel-close{z-index:2}@media(max-height:500px){.level-scroll{max-height:34dvh}.panel:has(.level-scroll){padding:20px 28px}.panel:has(.level-scroll) h2{font-size:24px;margin:6px 0 10px}.panel .instructions{display:none}.panel:has(.level-scroll) .secondary{padding:10px}}
header{z-index:2}header:before{content:"";position:fixed;inset:0 0 auto;height:220px;background:linear-gradient(var(--paper),color-mix(in srgb,var(--paper) 92%,transparent) 45%,transparent);z-index:-1;pointer-events:none}.hud{z-index:3}.hint,footer{z-index:3}@media(max-width:600px){header:before{height:290px}}@media(max-height:500px){header:before{height:150px}}
