:root{--ui:#fff8ea;--ink:#3b2f3a;--accent:#c4503f;--bg:#f3ead8}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);margin:0;font-family:Pixelify Sans,ui-rounded,PingFang SC,system-ui,sans-serif;overflow:hidden}#view{image-rendering:pixelated;position:fixed;inset:0}#minimap{border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink);background:var(--ui);border-radius:10px;position:fixed;top:12px;right:12px}.loading{text-align:center;place-items:center;height:100%;display:grid}.hud{background:var(--ui);border:3px solid var(--ink);min-width:240px;box-shadow:0 4px 0 var(--ink);border-radius:12px;gap:4px;padding:10px 14px;display:grid;position:fixed;top:12px;left:12px}.hud b{align-items:center;gap:6px;font-size:18px;display:flex}.hud span{opacity:.8;font-size:13px}.bar{border:2px solid var(--ink);border-radius:6px;height:8px;overflow:hidden}.bar i{background:var(--accent);height:100%;display:block}.dot{border:2px solid var(--ink);vertical-align:-1px;border-radius:50%;flex:none;width:12px;height:12px;margin-right:6px;display:inline-block}.palettes{gap:6px;display:flex;position:fixed;top:12px;left:50%;transform:translate(-50%)}button{font:inherit;color:var(--ink);background:var(--ui);border:3px solid var(--ink);box-shadow:0 3px 0 var(--ink);cursor:pointer;text-align:left;border-radius:10px;padding:6px 12px}button:hover{transform:translateY(-1px)}button:active{box-shadow:0 1px 0 var(--ink);transform:translateY(2px)}.palettes button.on{background:var(--accent);color:var(--ui)}.prompt{background:var(--ui);border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink);white-space:nowrap;border-radius:12px;align-items:center;gap:4px;padding:10px 16px;display:flex;position:fixed;bottom:64px;left:50%;transform:translate(-50%)}kbd{font:inherit;border:2px solid var(--ink);border-radius:5px;margin:0 4px;padding:0 5px}.panel{pointer-events:none;place-items:center;display:grid;position:fixed;inset:0}.card{pointer-events:auto;background:var(--ui);border:3px solid var(--ink);width:min(460px,100vw - 32px);max-height:calc(100vh - 140px);box-shadow:0 6px 0 var(--ink);border-radius:16px;gap:8px;padding:18px;display:grid;overflow:auto}.card h1,.card h2{margin:0 0 4px;font-size:22px}.card p{margin:0;font-size:14px;line-height:1.5}.card .fine{opacity:.65;font-size:11px}.card button{grid-template-columns:auto 1fr;align-items:center;display:grid}.card button small{opacity:.7;grid-column:2;font-size:12px}.list{gap:6px;display:grid}.card button.resume{background:var(--accent);color:var(--ui)}.scale{border:3px solid var(--ink);border-radius:10px;grid-template-columns:auto 1fr auto;align-items:center;gap:4px 10px;padding:8px 12px;font-size:14px;display:grid}.scale input{accent-color:var(--accent);width:100%}.scale small{opacity:.7;grid-column:1/-1;font-size:12px}.hints{background:var(--ui);border:2px solid var(--ink);white-space:nowrap;border-radius:8px;padding:4px 12px;font-size:12px;position:fixed;bottom:12px;left:50%;transform:translate(-50%)}@media (width<=700px){#minimap{width:150px!important;height:auto!important}.hints{display:none}.palettes{top:auto;bottom:12px}}[hidden]{display:none!important}