:root{color-scheme:dark;--bg:#111318;--panel:#1b1e25;--ink:#ecebe6;--muted:#a9adb8;--line:#343946;--accent:#ffcf6b}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.4 system-ui,sans-serif}
header{display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center;padding:.6rem 1rem;border-bottom:1px solid var(--line)}
header span{color:var(--muted)}.models{margin-left:auto;display:flex;gap:.3rem}
button{font:inherit;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:.3rem .7rem;cursor:pointer}
button[aria-pressed=true]{background:var(--accent);color:#1a1404;border-color:var(--accent)}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
main{padding:.8rem 1rem;display:grid;gap:.8rem}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}@media (max-width:760px){.pair{grid-template-columns:1fr}}
figure{margin:0}figure img{width:100%;display:block;border-radius:6px;aspect-ratio:3/2;object-fit:cover;background:var(--panel)}
figcaption{color:var(--muted);font-size:.85rem;margin-top:.25rem}
.world{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:.5rem}
.views{display:flex;gap:.3rem}.bar{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin-bottom:.4rem}#status{color:var(--muted);font-size:.85rem}
#view{width:100%;aspect-ratio:3/2;display:block;border-radius:6px;background:#05070b;touch-action:none}
nav{color:var(--muted)}nav a{color:var(--accent)}nav [aria-current]{color:var(--ink)}
figure canvas{width:100%;aspect-ratio:3/2;display:block;border-radius:6px;background:#05070b;touch-action:none}
main>.bar{margin-top:-.2rem}