:root{--shell-bg: #0b0b12;--shell-panel: #14141f;--shell-border: #2a2a3a;--shell-text: #e8e8f0;--shell-muted: #9a9ab0;--shell-accent: #5b8cff;--shell-ok: #4ade80;--shell-warn: #fbbf24;--shell-err: #f87171;--shell-font: "IBM Plex Sans", "Source Sans 3", "Segoe UI", sans-serif;--shell-mono: "IBM Plex Mono", "Source Code Pro", ui-monospace, monospace}html,body{margin:0;padding:0;height:100%;background:var(--shell-bg);color:var(--shell-text);font-family:var(--shell-font);overflow:hidden}#root{width:100%;height:100%}.shell{width:100%;height:100%;display:grid;grid-template-rows:auto 1fr auto;background:radial-gradient(1200px 600px at 10% -10%,#1a2440 0%,transparent 55%),radial-gradient(900px 500px at 90% 110%,#201828 0%,transparent 50%),var(--shell-bg)}.shell-top{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 14px;border-bottom:1px solid var(--shell-border);background:#14141fd9;backdrop-filter:blur(6px)}.brand{display:flex;flex-direction:column;gap:2px;min-width:0}.brand-name{font-size:14px;font-weight:600;letter-spacing:.02em}.brand-sub{font-size:11px;color:var(--shell-muted)}.shell-nav{display:flex;gap:4px;flex-wrap:wrap}.shell-nav button{appearance:none;border:1px solid transparent;background:transparent;color:var(--shell-muted);font:inherit;font-size:12px;padding:6px 10px;border-radius:6px;cursor:pointer}.shell-nav button[aria-current=page],.shell-nav button:hover{color:var(--shell-text);border-color:var(--shell-border);background:#ffffff0a}.account-chip{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--shell-muted)}.account-chip strong{color:var(--shell-text);font-weight:600}.account-chip button{appearance:none;border:1px solid var(--shell-border);background:#5b8cff1f;color:var(--shell-text);font:inherit;font-size:12px;padding:5px 10px;border-radius:6px;cursor:pointer}.shell-main{position:relative;z-index:0;min-height:0;display:flex;align-items:center;justify-content:center;padding:12px}#canvas-wrap{position:relative;width:min(100%,calc((100vh - 110px)*1.666));max-width:100%;aspect-ratio:5 / 3;border:1px solid var(--shell-border);border-radius:8px;overflow:hidden;box-shadow:0 12px 40px #00000059}canvas#game{width:100%;height:100%;display:block;background:#11111c;image-rendering:pixelated}#status{position:absolute;top:8px;left:8px;font-size:12px;opacity:.85;font-family:var(--shell-mono)}#hud{position:absolute;top:28px;left:8px;right:8px;font-size:12px;font-family:var(--shell-mono);color:var(--shell-text);pointer-events:none;text-shadow:0 1px 2px #000;line-height:1.35;max-width:calc(100% - 16px)}#win{display:none;position:absolute;inset:0;align-items:center;justify-content:center;font-size:22px;font-weight:600;letter-spacing:.02em;background:#08120c9e;color:var(--shell-ok);pointer-events:none;font-family:var(--shell-font)}#win.show{display:flex}#net{position:absolute;bottom:8px;left:8px;right:8px;font-size:11px;opacity:.75;font-family:var(--shell-mono)}#error{position:absolute;inset:0;display:none;align-items:center;justify-content:center;text-align:center;padding:24px;background:#140000d9}#error.show{display:flex}.bridge-banner{position:absolute;top:8px;right:8px;max-width:55%;font-size:11px;font-family:var(--shell-mono);padding:6px 8px;border-radius:6px;background:#14141fe6;border:1px solid var(--shell-border);color:var(--shell-warn)}.bridge-banner[data-ok=true]{color:var(--shell-ok)}.shell-drawer{position:relative;z-index:2;border-top:1px solid var(--shell-border);background:var(--shell-panel);padding:10px 14px;display:grid;grid-template-columns:1fr 1fr;gap:12px;max-height:28vh;overflow:auto}.panel h2{margin:0 0 6px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--shell-muted)}.panel p{margin:0;font-size:12px;color:var(--shell-text);line-height:1.45}.panel .muted{color:var(--shell-muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:720px){.shell-top{flex-wrap:wrap}.shell-drawer{grid-template-columns:1fr;max-height:34vh}.brand-sub{display:none}}