:root{--bg:#1e1c2b;--fg:#e8dcbc;--muted:#a29384;--panel:#141320c7}html,body{background:var(--bg);height:100%;color:var(--fg);margin:0;font:12px/1.4 ui-monospace,SF Mono,Menlo,Consolas,monospace;overflow:hidden}canvas#view{width:100vw;height:100vh;image-rendering:pixelated;cursor:grab;display:block}canvas#view.fixed{width:auto;height:auto}.hud,.help,.attribution{background:var(--panel);pointer-events:none;white-space:pre;border-radius:4px;padding:6px 8px;position:fixed}.hud{top:8px;left:8px}.hud.error{white-space:pre-wrap;pointer-events:auto;color:#ffb4a0;max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);overflow:auto}.help{color:var(--muted);white-space:normal;max-width:calc(50vw - 28px);bottom:8px;left:8px}.attribution{max-width:calc(50vw - 28px);color:var(--muted);white-space:normal;text-align:right;bottom:8px;right:8px}.attribution button{pointer-events:auto;font:inherit;color:var(--fg);border:1px solid var(--muted);cursor:pointer;background:0 0;border-radius:3px;padding:0 6px}.modal{background:var(--panel);border:1px solid var(--muted);white-space:normal;border-radius:6px;max-width:min(640px,100vw - 32px);max-height:calc(100vh - 32px);padding:12px 16px;position:fixed;top:50%;left:50%;overflow:auto;transform:translate(-50%,-50%)}.modal h2{margin:0 0 8px;font-size:14px}.modal a{color:var(--fg)}.modal .license,.modal .muted{color:var(--muted)}.layers{background:var(--panel);color:var(--fg);border-radius:4px;flex-direction:column;gap:2px;padding:6px 8px;display:flex;position:fixed;top:8px;right:8px}.layers label{cursor:pointer}.layers .sub{color:var(--muted);padding-left:16px}.hidden{display:none}@media (width<=600px){.help{display:none}}
