:root{--ink:#eef3ee;--ink-dim:#a9b6ad;--panel:#0f1512c7;--line:#ffffff1f;--accent:#7fd1ff;color:var(--ink);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;font-size:14px}*{box-sizing:border-box}html,body{background:linear-gradient(#9fc4e6 0%,#d6e6f0 55%,#e9eee8 100%);height:100%;margin:0;overflow:hidden}#scene{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}#labels{pointer-events:none;position:fixed;inset:0;overflow:hidden}.panel{background:var(--panel);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:14px;gap:14px;width:248px;padding:16px;display:grid;position:fixed;top:16px;left:16px}.panel h1{letter-spacing:-.01em;margin:0;font-size:17px;font-weight:650}.panel header p{color:var(--ink-dim);font-variant-numeric:tabular-nums;margin:4px 0 0;font-size:12px}.slider{gap:6px;display:grid}.slider span{color:var(--ink-dim);justify-content:space-between;font-size:12px;display:flex}.slider output{color:var(--ink);font-variant-numeric:tabular-nums}.slider input{width:100%;accent-color:var(--accent);margin:0}.layers{border:0;grid-template-columns:1fr 1fr;gap:6px 10px;margin:0;padding:0;display:grid}.layers legend{color:var(--ink-dim);margin-bottom:8px;padding:0;font-size:12px}.layers label{cursor:pointer;align-items:center;gap:7px;min-height:24px;display:flex}.layers input{accent-color:var(--accent);margin:0}.swatch{border-radius:3px;flex:none;width:10px;height:10px}.row{grid-template-columns:repeat(3,auto);gap:6px;display:grid}.row button{padding:7px 6px;font-size:13px}button{font:inherit;color:var(--ink);border:1px solid var(--line);cursor:pointer;background:#ffffff14;border-radius:8px;padding:7px 10px;transition:background .15s}button:hover{background:#ffffff29}button[aria-pressed=true]{background:#7fd1ff40;border-color:#7fd1ff8c}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button:disabled{opacity:.5;cursor:default}.walk{background:#7fd1ff29;border-color:#7fd1ff66;font-weight:600}.walk:hover{background:#7fd1ff47}.walking .panel .slider,.walking .panel .layers,.walking .panel .readout{display:none}.walking .hint{color:#fff;text-shadow:0 1px 3px #000000e6;font-size:12px}.readout{border-top:1px solid var(--line);gap:6px;margin:0;padding-top:12px;display:grid}.readout div{justify-content:space-between;gap:12px;display:flex}.readout dt{color:var(--ink-dim);font-size:12px}.readout dd{font-variant-numeric:tabular-nums;margin:0}.label{color:#fff;text-shadow:0 1px 3px #000000d9;white-space:nowrap;justify-items:center;font-size:12px;font-weight:600;display:grid}.label:after{content:"";background:#ffffffd9;width:1.5px;height:34px;margin-top:3px;box-shadow:0 0 3px #0009}.label small{opacity:.85;font-weight:500}.label.waterfall span{text-shadow:none;background:#0b6fb8;border-radius:999px;padding:4px 9px;box-shadow:0 2px 8px #00000059}.label.waterfall:after{background:#0b6fb8;width:2px;height:46px}.compass{background:var(--panel);border:1px solid var(--line);border-radius:50%;place-items:start center;width:44px;height:44px;font-size:11px;font-weight:700;display:grid;position:fixed;top:16px;right:16px}.compass span{color:#ff8a7a;margin-top:4px}.compass:after{content:"";background:var(--ink-dim);border-radius:1px;width:2px;height:14px;margin-left:-1px;position:absolute;top:19px;left:50%}.hint,.credits{color:#141e19cc;text-shadow:0 0 6px #ffffffb3;margin:0;font-size:11px;position:fixed;bottom:12px}.hint{left:16px}.credits{text-align:right;max-width:60vw;right:16px}.stick{touch-action:none;background:#0f151273;border:1px solid #ffffff59;border-radius:50%;place-items:center;width:112px;height:112px;display:none;position:fixed;bottom:56px;left:24px}.stick i{pointer-events:none;background:#fffc;border-radius:50%;width:46px;height:46px}@media (pointer:coarse){.walking .stick{display:grid}}.loading{color:#24332b;background:#dfe9ee;place-items:center;font-size:14px;transition:opacity .4s;display:grid;position:fixed;inset:0}.loading.done{opacity:0;pointer-events:none}@media (width<=640px){.panel{gap:10px;width:auto;padding:12px;top:8px;left:8px;right:8px}.layers{grid-template-columns:repeat(3,1fr)}.readout,.hint,.walking .panel header p{display:none}.walking .hint{display:block;bottom:48px;left:8px;right:8px}.compass{top:auto;bottom:40px;right:8px}.credits{text-align:left;max-width:none;left:8px;right:8px}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}
