:root{--ink:#1d1b2a;--paper:#fbf6e9;--paper-2:#f1e9d4;--muted:#6b6578;--accent:#f2b632;--blue:#3d7be0;--pixel:"Pixelify Sans", ui-monospace, monospace;--body:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--gutter:max(12px, env(safe-area-inset-left));--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{height:100%;font-family:var(--body);color:var(--ink);-webkit-font-smoothing:antialiased;overscroll-behavior:none;background:#0a1026;margin:0;overflow:hidden}#scene{image-rendering:pixelated;touch-action:none;cursor:grab;display:block;position:fixed;inset:0 auto auto 0}#scene.dragging{cursor:grabbing}#scene.hovering{cursor:pointer}#ui{pointer-events:none;position:fixed;inset:0}#ui>*{pointer-events:auto}.panel{background:var(--paper);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}button{font:inherit;color:inherit}.btn{background:var(--paper);border:2px solid var(--ink);min-width:40px;height:40px;box-shadow:2px 2px 0 var(--ink);font-family:var(--pixel);cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;gap:6px;padding:0 10px;font-size:15px;transition:transform 60ms step-end,box-shadow 60ms step-end;display:inline-flex}.btn:hover{background:#fff}.btn:active,.btn[aria-pressed=true]{box-shadow:0 0 0 var(--ink);transform:translate(2px,2px)}.btn[aria-pressed=true]{background:var(--accent)}.btn:focus-visible{outline:2px dashed var(--blue);outline-offset:2px}.btn svg{shape-rendering:crispedges;flex:none;width:18px;height:18px}.btn.icon{width:40px;padding:0}.brand{top:max(12px, env(safe-area-inset-top));left:var(--gutter);align-items:stretch;gap:0;display:flex;position:absolute}.brand h1{font-family:var(--pixel);letter-spacing:.5px;background:var(--ink);color:var(--paper);margin:0;padding:6px 12px 4px;font-size:22px;font-weight:700;line-height:1.2}.brand h1 span{color:var(--accent)}.clock{font-family:var(--pixel);cursor:pointer;white-space:nowrap;background:0 0;border:0;align-items:center;gap:8px;padding:0 12px;font-size:15px;display:flex}.clock:hover{background:#fff}.clock .sun{shape-rendering:crispedges;width:18px;height:18px}.clock small{color:var(--muted);font-size:13px}.clock .ff{color:#c0392b}.top-right{top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));gap:8px;display:flex;position:absolute}.tools{left:var(--gutter);bottom:max(48px, calc(env(safe-area-inset-bottom) + 40px));box-shadow:none;background:0 0;border:0;flex-direction:column;gap:6px;padding:0;display:flex;position:absolute}.layers{left:50%;bottom:max(40px, calc(env(safe-area-inset-bottom) + 32px));max-width:calc(100vw - 2 * var(--gutter) - 60px);flex-direction:column;align-items:center;gap:8px;display:flex;position:absolute;transform:translate(-50%)}.layer-bar .btn{white-space:nowrap;flex:none}.layer-bar{scrollbar-width:none;gap:6px;padding:0 4px 4px 0;display:flex;overflow-x:auto}.layer-bar::-webkit-scrollbar{display:none}.legend{max-width:420px;padding:8px 10px;font-size:12px}.legend p{color:var(--muted);margin:0 0 6px;line-height:1.35}.legend .swatches{flex-wrap:wrap;gap:4px 12px;display:flex}.legend .swatches span{font-family:var(--pixel);align-items:center;gap:5px;font-size:13px;display:inline-flex}.legend .swatches i{border:2px solid var(--ink);width:12px;height:12px;display:inline-block}.legend .ramp{border:2px solid var(--ink);height:12px}.legend .ramp-labels{font-family:var(--pixel);justify-content:space-between;margin-top:3px;font-size:12px;display:flex}.credit{right:max(12px, env(safe-area-inset-right));bottom:max(8px, env(safe-area-inset-bottom));color:#ffffffd9;text-shadow:1px 1px #000000b3;font-size:11px;font-family:var(--pixel);letter-spacing:.2px;position:absolute}.credit a{color:inherit}.credit button{color:inherit;cursor:pointer;font:inherit;background:0 0;border:0;padding:0;text-decoration:underline}.pop{z-index:5;width:min(320px,100vw - 24px);padding:12px;position:absolute}.pop[hidden]{display:none}.pop h3{font-family:var(--pixel);margin:0 0 8px;font-size:16px}.share-pop{top:64px;right:max(12px, env(safe-area-inset-right))}.share-grid{grid-template-columns:1fr 1fr;gap:6px;display:grid}.share-grid .btn{justify-content:flex-start;font-size:14px}.share-grid .btn.wide{grid-column:span 2;justify-content:center}.time-pop{top:64px;left:var(--gutter)}.time-pop input[type=range]{width:100%;accent-color:var(--ink)}.time-row{flex-wrap:wrap;gap:6px;margin-top:8px;display:flex}.time-pop p{color:var(--muted);margin:0 0 6px;font-size:13px}.info{top:72px;right:max(12px, env(safe-area-inset-right));width:min(340px,100vw - 24px);max-height:calc(100vh - 150px);padding:0;position:absolute;overflow:auto}.info[hidden]{display:none}.info header{background:var(--ink);color:var(--paper);justify-content:space-between;align-items:flex-start;gap:8px;padding:10px 10px 8px 12px;display:flex}.info header h2{font-family:var(--pixel);margin:0;font-size:19px;line-height:1.15}.info header .kicker{font-family:var(--pixel);color:var(--accent);text-transform:uppercase;letter-spacing:.6px;margin-bottom:2px;font-size:12px;display:block}.info header .btn{width:28px;min-width:28px;height:28px;box-shadow:none;border-color:var(--paper);color:var(--paper);background:0 0}.info .thumb{aspect-ratio:16/9;object-fit:cover;border-bottom:2px solid var(--ink);image-rendering:auto;background:var(--paper-2);width:100%;display:block}.info .body{padding:10px 12px 12px;font-size:14px;line-height:1.45}.info .tagline{margin:0 0 8px;font-weight:600}.info .extract{color:#3a3546;margin:8px 0}.info dl{grid-template-columns:auto 1fr;gap:3px 12px;margin:8px 0;font-size:13px;display:grid}.info dt{font-family:var(--pixel);color:var(--muted)}.info dd{font-variant-numeric:tabular-nums;margin:0}.info .meter{vertical-align:middle;gap:2px;margin-right:6px;display:inline-flex}.info .meter i{border:1px solid var(--ink);background:#fff;width:8px;height:10px;display:inline-block}.info .meter i.on{background:#ff2e88}.info .complaint{background:var(--paper-2);border:2px dashed #c8bc9c;margin:10px 0 0;padding:8px 10px;font-size:13px}.info .complaint b{font-family:var(--pixel);font-weight:600}.info a{color:var(--blue)}.info a.btn{color:var(--ink);text-decoration:none}.info .links{flex-wrap:wrap;gap:6px;margin-top:10px;display:flex}.info .links .btn{height:34px;font-size:14px}.tooltip{font-family:var(--pixel);background:var(--ink);color:var(--paper);white-space:nowrap;padding:3px 8px;font-size:14px;position:absolute;transform:translate(-50%,-100%);pointer-events:none!important}.tooltip[hidden]{display:none}dialog.about{border:2px solid var(--ink);width:min(560px,100vw - 24px);max-height:calc(100vh - 48px);box-shadow:4px 4px 0 var(--ink);background:var(--paper);color:var(--ink);padding:0}dialog.about::backdrop{background:#0a10268c}.about header{background:var(--ink);color:var(--paper);justify-content:space-between;align-items:center;padding:10px 12px;display:flex;position:sticky;top:0}.about header h2{font-family:var(--pixel);margin:0;font-size:20px}.about header .btn{width:30px;min-width:30px;height:30px;box-shadow:none;border-color:var(--paper);color:var(--paper);background:0 0}.about .content{padding:14px 18px 18px;font-size:15px;line-height:1.55}.about h3{font-family:var(--pixel);margin:18px 0 6px;font-size:16px}.about p{margin:0 0 10px}.about ul{margin:0 0 10px;padding-left:18px}.about li{margin-bottom:4px}.about .note{background:var(--paper-2);border-left:4px solid var(--accent);padding:8px 12px}.about kbd{font-family:var(--pixel);border:1.5px solid var(--ink);background:#fff;padding:0 5px;font-size:13px}.about .made{border-top:2px dashed #c8bc9c;align-items:center;gap:10px;margin-top:16px;padding-top:12px;display:flex}.loading{color:var(--paper);z-index:20;font-family:var(--pixel);background:#0a1026;place-items:center;transition:opacity .4s steps(4,end);display:grid;position:fixed;inset:0}.loading.done{opacity:0;pointer-events:none!important}.loading .box{text-align:center;width:min(360px,80vw)}.loading h1{margin:0 0 18px;font-size:34px}.loading h1 span{color:var(--accent)}.loading .bar{border:2px solid var(--paper);height:18px;padding:2px}.loading .bar div{background:repeating-linear-gradient(90deg, var(--accent) 0 10px, transparent 10px 12px);width:0;height:100%;transition:width .15s steps(6,end)}.loading p{opacity:.85;min-height:1.4em;margin:12px 0 0;font-size:15px}.loading .err{color:#ff8a7a}@media (max-width:640px){.brand h1{padding:6px 8px 4px;font-size:18px}.clock small{display:none}.tools{top:70px;bottom:auto}.tools .btn{width:36px;min-width:36px;height:36px}.layers{bottom:max(46px, calc(env(safe-area-inset-bottom) + 40px));max-width:calc(100vw - 24px)}.layer-bar .btn{height:36px;padding:0 8px;font-size:14px}.legend{max-width:calc(100vw - 24px)}.info{width:100%;max-height:58vh;box-shadow:0 -3px 0 var(--ink);border-bottom:0;border-left:0;border-right:0;inset:auto 0 0}.credit{text-align:center;font-size:10px;left:12px;right:12px}}@media (prefers-reduced-motion:reduce){.btn,.loading,.loading .bar div{transition:none}}
