:root{color-scheme:dark;--bg:#101a20;--panel:#16262d;--line:#30474c;--text:#e2e5d8;--muted:#99aca7;--mint:#a4cbbc}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:13px/1.55 system-ui,-apple-system,sans-serif}button,select,textarea{font:inherit}button,select{color:inherit;background:#192c33;border:1px solid #3b5356;padding:8px 11px;border-radius:3px}button{cursor:pointer}button:hover{background:#2a444b}button:disabled{opacity:.45;cursor:default}button[aria-pressed=true]{background:var(--mint);color:#162a2d;border-color:var(--mint)}button:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid #b1d2bb;outline-offset:3px}a{color:inherit;text-decoration:none}header{height:72px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-weight:700;font-size:20px;letter-spacing:.17em}.brand small{font-size:9px;color:var(--muted);font-weight:500;margin-left:24px}header nav{display:flex;gap:22px;font-size:11px;color:var(--muted)}main{max-width:1580px;margin:auto;padding:28px 4vw}.intro{display:flex;align-items:end;justify-content:space-between;margin-bottom:23px}.eyebrow{font-size:9px;letter-spacing:.16em;color:var(--mint);margin:0 0 8px}h1{font-size:36px;letter-spacing:-.04em;font-weight:450;margin:0;line-height:1.15}.intro>p{color:var(--muted);font-size:12px;margin:0}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 225px;gap:24px}.toolbar{display:flex;align-items:center;gap:9px;padding:9px 12px;background:var(--panel);border:1px solid var(--line)}.toolbar strong{font-size:12px;font-weight:500;margin-right:auto}#framing{font-size:10px;color:var(--muted)}.toolbar button{padding:4px 8px;font-size:11px}#stage{position:relative;aspect-ratio:16/9;background:#13232d;outline:none;overflow:hidden;border:1px solid var(--line);border-top:0}#stage:focus{border-color:#79998d}#game{display:block;width:100%;height:100%;image-rendering:pixelated}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#142730;z-index:5}.scene-label{position:absolute;left:19px;top:16px;display:flex;flex-direction:column;gap:4px;pointer-events:none;text-shadow:0 1px 3px #001017}#context{font-size:10px;letter-spacing:.15em}.scene-label small{font-size:9px;color:#c2cfc6}.resolution{position:absolute;bottom:13px;right:15px;font-size:8px;letter-spacing:.16em;color:#a8beb5}#interact{position:absolute;left:50%;bottom:25px;transform:translateX(-50%);background:#12252def;border-color:#98b9aa;display:flex;align-items:center;gap:10px;white-space:nowrap;font-size:11px}kbd{font:10px monospace;background:#253a41;border:1px solid #466060;border-radius:3px;padding:2px 5px;color:#d5e3d9}#toast{position:absolute;left:8%;right:8%;bottom:70px;text-align:center;pointer-events:none;font-size:12px;color:#f0e8cb;text-shadow:0 1px 3px #071317;background:#122630ed;border-radius:4px;padding:12px;transition:opacity .2s}#toast:empty{opacity:0}.controls{display:flex;align-items:center;gap:13px;padding:12px 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:10px}.controls button{background:none;border:0;padding:2px;color:var(--muted);font-size:10px}.visit{display:flex;align-items:center;gap:8px;margin-top:14px}.visit label{font-size:8px;letter-spacing:.14em;margin-right:3px;color:var(--mint)}.visit select{flex:1;min-width:100px}.visit button{font-size:11px;white-space:nowrap}.touch{display:flex;gap:6px;margin-top:12px}.touch button{padding:5px 13px}aside section{padding-bottom:21px;margin-bottom:21px;border-bottom:1px solid var(--line)}aside .segmented{display:flex;gap:5px}aside .segmented button{flex:1}aside button{width:100%;text-align:left;margin:3px 0;font-size:11px}.help{color:var(--muted);font-size:11px;line-height:1.7;margin:12px 0}.service{padding:13px;background:#192c32;border:1px solid var(--line);margin-top:14px}.service strong{font-size:12px;letter-spacing:.14em}.service>span{display:block;font-size:10px;color:var(--mint);margin-top:4px}.service ul{list-style:none;margin:12px 0;padding:0;font-size:10px;line-height:2;color:var(--muted)}.service li.done{color:#add2aa}.service p{font-size:9px;color:var(--muted);margin:7px 0 0}.service button{font-size:10px}textarea{width:100%;background:#13252c;border:1px solid #385354;color:var(--text);padding:10px;resize:vertical;font-size:11px;border-radius:3px}#saved{font-size:9px;color:var(--muted)}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin-top:20px;padding-top:18px;font-size:10px;color:var(--muted)}dialog{background:#14262e;color:var(--text);border:1px solid #526f69;max-width:880px;width:92%;max-height:92vh;border-radius:6px;padding:24px}dialog::backdrop{background:#030b11c9}.map-heading{display:flex;align-items:center;justify-content:space-between}h2{font-size:26px;font-weight:450;letter-spacing:-.03em;margin:0}#map-canvas{width:100%;display:block;margin-top:18px}#map-places{display:flex;flex-wrap:wrap;gap:7px}#map-places button{font-size:11px}.expanded main{padding:0}.expanded header,.expanded .intro,.expanded aside,.expanded footer,.expanded .controls,.expanded .visit,.expanded .touch{display:none}.expanded .workspace{display:block}.expanded .play-area{position:fixed;inset:0;background:#101a20;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:20}.expanded .toolbar{width:100%;position:absolute;top:0;z-index:2}.expanded #stage{width:min(100vw,calc((100vh - 45px)*16/9));margin-top:45px;max-height:calc(100vh - 45px)}[hidden]{display:none!important}@media(max-width:1000px){.workspace{grid-template-columns:1fr}aside{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.brand small{display:none}.intro{gap:18px}.controls{justify-content:space-between}}@media(max-width:620px){header{height:62px}header nav a:last-child{display:none}.intro{display:block}.intro>p{margin-top:12px}h1{font-size:30px}main{padding:23px 3vw}.toolbar #framing{display:none}.scene-label{left:10px;top:8px}.scene-label small{display:none}#context{font-size:8px}#interact{font-size:9px;bottom:11px;padding:5px 8px}#toast{font-size:10px;padding:7px;bottom:45px}.controls{gap:6px;flex-wrap:wrap}.visit{flex-wrap:wrap}.visit label{display:none}.visit select{width:100%;flex:auto}.visit button{flex:1}aside{grid-template-columns:1fr}.touch{justify-content:center}footer{display:block}footer span{display:block}#map-canvas{margin-top:10px}dialog{padding:14px}.resolution{font-size:6px;bottom:5px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* Keep the town in view while using the longer exploration sidebar. */
@media(min-width:1001px){.play-area{position:sticky;top:12px;align-self:start}.workspace{align-items:start}}