:root{color-scheme:dark;font-family:Segoe UI,system-ui,sans-serif;background:#0b1013;color:#ece8d9}*{box-sizing:border-box}body{margin:0}main{padding:18px 24px;min-width:810px;max-width:100%;margin:auto}header{display:flex;justify-content:space-between;gap:30px;align-items:center;border-bottom:1px solid #29343a;padding-bottom:12px}.brand{font-size:22px;letter-spacing:.17em;color:#f3bd7a;font-weight:700;text-decoration:none}.brand small{display:block;font-size:9px;letter-spacing:.12em;color:#a5adae;margin-top:4px}.toolbar{display:flex;gap:8px}button,.button{font:inherit;background:#202b2e;border:1px solid #52605d;border-radius:5px;color:#eae9db;padding:9px 14px;cursor:pointer;font-size:12px}button:hover,button:focus-visible,.button:hover{background:#3a4c4c;outline:2px solid #e8b16b;outline-offset:2px}.primary{background:#d6a46a;color:#191c1b;font-weight:700}button:disabled{opacity:.4;cursor:default}a{color:#ebbf86}.hud{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:14px 0;max-width:100%}.eyebrow{font:10px monospace;letter-spacing:.12em;color:#cba775}h1{font-size:20px;margin:5px 0 0}.meters{display:flex;gap:18px;font:12px monospace;flex-wrap:wrap}#hp{color:#f5ac97}#shield{color:#9ecad6}#boss{color:#eab5ac}#viewport{position:relative;width:fit-content;margin:auto;border:1px solid #3b4948;background:#101b20;box-shadow:0 12px 60px #0006}canvas{display:block;image-rendering:pixelated}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#142026;min-width:768px;min-height:480px}#toast{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);max-width:90%;width:max-content;background:#141a1de8;color:#ffdaa6;border:1px solid #6e5a3e;padding:12px 20px;font-size:14px;pointer-events:none;opacity:0;transition:opacity .2s}#toast.visible{opacity:1}footer,.statusline{display:flex;justify-content:space-between;align-items:center;gap:18px;font-size:11px;color:#9aabaa;margin-top:12px}.statusline{justify-content:flex-start;color:#81928f}.statusline a{margin-left:auto}.overlay{position:fixed;inset:0;display:grid;place-items:center;background:#0c1218ed;z-index:10}.panel{width:min(630px,92vw);padding:50px;border:1px solid #78613f;background:linear-gradient(135deg,#1e2c31,#141b21);box-shadow:0 0 0 6px #263132}.panel h2{font:36px Georgia,serif;margin:25px 0;color:#f2d9b5}.panel p{white-space:pre-line;line-height:1.8;color:#c9d1cc;font-size:17px}.panel .hint{font-size:11px;color:#a4a798}.panel button{margin:6px 8px 6px 0}dialog{border:1px solid #6f654e;background:#1c292d;color:#ede6d4;max-width:740px;width:90vw;border-radius:8px;padding:28px}dialog::backdrop{background:#080e13d9}dialog p{line-height:1.6;color:#bfc9c4}.menu-stack{display:grid;gap:12px}#items{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0;max-height:55vh;overflow:auto}.item{display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px;border:1px solid #40504c}.item img{width:64px;height:64px;image-rendering:pixelated}.item button{width:100%}.item span{font-size:11px;text-align:center}.hidden{display:none!important}#fps{font-family:monospace;white-space:nowrap}#ending button{display:block;margin-top:20px}

button:focus,a:focus,label.button:focus{outline:3px solid #a8faff;outline-offset:4px;box-shadow:0 0 10px #64edff,0 0 22px #64edff88;border-color:#e6ffff!important} .controller-hint{color:#a8faff;font-size:13px;margin-top:20px} .item:focus-within{background:#23434b;border-color:#a8faff}

.hud .meters{display:none}

/* Schermo intero: via l'interfaccia di pagina, resta solo il gioco centrato sul nero. */
.immersive,.immersive body{background:#000}
.immersive main{padding:0;margin:0;min-width:0;max-width:none;width:100%;height:100vh;display:grid;place-items:center}
.immersive header,.immersive .hud,.immersive footer,.immersive .statusline{display:none}
.immersive #viewport{border:0;box-shadow:none}
