*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font:15px/1.4 var(--body);-webkit-tap-highlight-color:transparent}
#gl{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}
#err{position:fixed;left:8px;right:8px;top:8px;z-index:99;color:#fff;background:#b3261e;border-radius:8px;padding:0;font:12px/1.3 monospace;white-space:pre-wrap}
#err:not(:empty){padding:8px}
body.wallpaper #ui,body.wallpaper #labels{display:none}
#labels .tag{position:fixed;z-index:3;background:var(--card-glass);color:var(--ink);padding:3px 10px;border-radius:12px;font:600 12px var(--head);backdrop-filter:blur(6px);pointer-events:none}
.top{position:fixed;z-index:5;top:calc(10px + env(safe-area-inset-top));left:12px;right:12px;display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start;justify-content:space-between;pointer-events:none}
@media (max-width:700px){.pill{padding:6px 11px;font-size:12px}.dock{padding:11px 11px 9px}.quest{margin-top:8px;padding:8px 10px}.quest h3{font-size:15px}.prog{display:none}#labels .tag{top:92px!important}}
.pill{pointer-events:auto;background:var(--card-glass);color:var(--ink);border:1px solid var(--line);border-radius:999px;padding:7px 14px;font:500 13px var(--body);backdrop-filter:blur(8px);box-shadow:var(--shadow)}
button.pill{cursor:pointer}button.pill:hover{border-color:var(--sky)}button.pill.on{background:var(--sky);color:var(--on-sky);border-color:var(--sky)}
.row{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.card{background:var(--card-glass);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);backdrop-filter:blur(10px);color:var(--ink)}
.dock{position:fixed;z-index:5;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));max-width:520px;margin:0 auto;padding:14px 14px 12px}
.who{display:flex;gap:10px;align-items:flex-start}
.av{flex:none;width:38px;height:38px;border-radius:50%;background:var(--sun);color:var(--on-sun);display:grid;place-items:center;font:600 17px var(--head)}
.say{font-size:15px}.say small{display:block;color:var(--ink2);font-size:12px;margin-top:2px}
.quest{margin-top:10px;padding:10px 12px;border-radius:var(--r-sm);background:var(--bg);border:1px solid var(--line)}
.quest h3{margin:0 0 4px;font:600 16px var(--head)}.quest p{margin:2px 0;color:var(--ink2);font-size:13px}.quest b{color:var(--ink);font-weight:600}
.chips{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}.chip{border-radius:999px;padding:2px 9px;font:600 11px var(--head);background:var(--bg2);color:var(--ink2)}
.chip.sun{background:var(--sun);color:var(--on-sun)}.chip.green{background:var(--meadow);color:var(--on-meadow)}
.btns{display:flex;gap:8px;margin-top:10px}
.btn{flex:1;border:0;border-radius:var(--r-sm);padding:10px 12px;font:600 14px var(--head);cursor:pointer;background:var(--bg2);color:var(--ink)}
.btn.main{background:var(--sun);color:var(--on-sun)}.btn.blue{background:var(--sky);color:var(--on-sky)}.btn:hover{filter:brightness(1.04)}.btn:active{transform:translateY(1px)}
.prog{display:flex;gap:10px;margin-top:10px}.prog div{flex:1}.prog label{display:block;font:600 10px var(--head);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}
.bar{height:6px;border-radius:3px;background:var(--bg2);overflow:hidden;margin-top:3px}.bar i{display:block;height:100%;background:var(--meadow);border-radius:3px;transition:width .8s ease}
.pop{position:fixed;z-index:8;top:calc(54px + env(safe-area-inset-top));right:12px;width:min(300px,calc(100vw - 24px));padding:12px}
.pop h4{margin:0 0 8px;font:600 14px var(--head)}.pop label.opt{display:flex;gap:8px;align-items:center;padding:7px 4px;cursor:pointer;border-radius:8px}.pop label.opt:hover{background:var(--bg2)}
.pop input[type=range]{width:100%;accent-color:var(--sky)}.pop select{width:100%;padding:6px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--ink)}
.sheet{position:fixed;z-index:9;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));max-width:520px;margin:0 auto;padding:16px}
.sheet textarea{width:100%;min-height:84px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--bg);color:var(--ink);padding:10px;font:15px var(--body);resize:vertical}
.toast{position:fixed;z-index:10;left:50%;top:38%;transform:translate(-50%,0);width:min(340px,calc(100vw - 32px));padding:16px;text-align:center;animation:rise .5s ease both}
.toast .t{font:600 11px var(--head);letter-spacing:.1em;text-transform:uppercase;color:var(--ink2)}.toast .m{font:600 17px var(--head);margin:6px 0 12px}
@keyframes rise{from{opacity:0;transform:translate(-50%,16px)}to{opacity:1;transform:translate(-50%,0)}}
@media (prefers-reduced-motion:reduce){.toast{animation:none}.bar i{transition:none}}
[hidden]{display:none!important}

.ctl{position:fixed;z-index:5;right:12px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:8px}.ctl .pill{text-align:center;padding:8px 12px}
@media (max-width:700px){.ctl{top:auto;bottom:calc(214px + env(safe-area-inset-bottom));transform:none;flex-direction:row;right:12px}}

/* Linus's dialogue (the quest card, the reward, Night Watch): a still, dark blue-grey card, never a floating pop-up that moves (Robyn 2026-11-02) */
.dock,.sheet,.toast{--card-glass:#2b3a55;--ink:#f6efd9;--ink2:#b5c2da;--line:rgba(246,239,217,.16);--bg:#34466a;--bg2:#3f5379;background:#2b3a55;backdrop-filter:none;box-shadow:0 4px 18px rgba(10,18,36,.35);color:#f6efd9}
.dock .quest{background:#34466a}.dock .btn,.sheet .btn,.toast .btn{background:#3f5379;color:#f6efd9}.dock .btn.main,.sheet .btn.main{background:var(--sun);color:var(--on-sun)}.toast .btn.blue{background:var(--sky);color:var(--on-sky)}
.dock .chip,.toast .chip{background:#3f5379;color:#d8e0f0}.dock .chip.sun{background:var(--sun);color:var(--on-sun)}.dock .chip.green{background:var(--meadow);color:var(--on-meadow)}
.dock .bar{background:#3f5379}.sheet textarea{background:#34466a;color:#f6efd9;border-color:rgba(246,239,217,.2)}
.toast{animation:none;transform:translate(-50%,0)}

.lctl{position:fixed;z-index:5;left:12px;top:50%;transform:translateY(-50%)}.vbar{position:fixed;z-index:6;left:12px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:8px}
@media (max-width:700px){.vbar{top:auto;bottom:calc(16px + env(safe-area-inset-bottom));left:12px;right:12px;transform:none;flex-direction:row;justify-content:center}}
