@import "https://fonts.googleapis.com/css2?family=IM+Fell+English:ital@0;1&family=Special+Elite&display=swap";:root{--hud-bg:#201a14d1;--hud-border:#c4a35a66;--accent:#c4a35a;--accent-warm:#c4783a;--hp:#a8543a;--energy:#6a8a6a;--crystal:#6b5b8c;--text:#e8dcc8;--muted:#a09078;--danger:#8b2e2e;--ok:#6a8a6a;--panel:#1c1610f0;--parchment:#d4c4a0;--ink:#1c1814;--font:"IM Fell English", "Times New Roman", serif;--font-ui:"Special Elite", "Courier New", monospace}#ui-root{pointer-events:none;font-family:var(--font-ui);color:var(--text);z-index:10;-webkit-user-select:none;user-select:none;position:absolute;inset:0}#ui-root .interactive{pointer-events:auto}#hud{padding:16px 20px;display:none;position:absolute;inset:0}#hud.visible{display:block}.hud-top{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.stat-stack{flex-direction:column;gap:8px;min-width:200px;display:flex}.stat-row{align-items:center;gap:10px;display:flex}.stat-label{background:var(--hud-bg);border:1px solid var(--hud-border);border-radius:4px;place-items:center;width:28px;height:28px;font-size:13px;display:grid;box-shadow:0 3px #00000073,inset 0 0 12px #00000040}.bar-track{background:#0c0a08bf;border:1px solid #c4a35a40;border-radius:2px;flex:1;height:12px;position:relative;overflow:hidden;box-shadow:inset 0 1px 3px #00000080}.bar-fill{border-radius:1px;height:100%;transition:width .12s ease-out;position:relative}.bar-fill.hp{background:linear-gradient(#c46848,#8b2e2e);box-shadow:0 0 8px #a8543a66}.bar-fill.energy{background:linear-gradient(#8aaa7a,#4a6a48);box-shadow:0 0 8px #6a8a6a59}.bar-fill.dash{background:linear-gradient(#c4a35a,#8a7038)}.currency-pill{background:var(--hud-bg);border:1px solid var(--hud-border);letter-spacing:.04em;color:var(--parchment);border-radius:3px;align-items:center;gap:8px;padding:7px 14px;font-size:14px;font-weight:400;display:flex;box-shadow:0 3px #0006}.currency-pill .gem{background:linear-gradient(135deg,#a090c0,#6b5b8c);border-radius:1px;width:12px;height:12px;transform:rotate(45deg);box-shadow:0 0 8px #6b5b8c80}.minimap-wrap{background:var(--hud-bg);border:1px solid var(--hud-border);border-radius:4px;width:140px;height:140px;position:relative;overflow:hidden;box-shadow:0 4px #0006,inset 0 0 20px #00000059}#minimap{filter:sepia(.35)contrast(.95)brightness(.9);width:100%;height:100%;display:block}.hint-bar{background:var(--hud-bg);border:1px solid var(--hud-border);color:var(--muted);white-space:nowrap;font-size:12px;font-family:var(--font-ui);border-radius:3px;padding:8px 18px;position:absolute;bottom:22px;left:50%;transform:translate(-50%);box-shadow:0 3px #00000059}.hint-bar kbd{color:var(--parchment);background:#00000059;border:1px solid #c4a35a4d;border-radius:2px;margin:0 2px;padding:1px 6px;font-family:inherit;font-size:11px;display:inline-block}.toast{background:var(--panel);border:1px solid var(--accent);font-family:var(--font);color:var(--parchment);opacity:0;pointer-events:none;border-radius:3px;padding:12px 24px;font-size:18px;transition:opacity .25s,transform .25s;position:absolute;top:22%;left:50%;transform:translate(-50%);box-shadow:0 0 24px #00000080,0 4px #0006}.toast.show{opacity:1;transform:translate(-50%)translateY(0)}.boss-bar-wrap{flex-direction:column;align-items:center;gap:6px;width:min(420px,70vw);display:none;position:absolute;top:18px;left:50%;transform:translate(-50%)}.boss-bar-wrap.visible{display:flex}.boss-name{font-family:var(--font);letter-spacing:.12em;text-transform:uppercase;color:#c48888;text-shadow:0 0 12px #8b2e2e99;font-size:15px;font-style:italic}.boss-bar-track{background:#000000a6;border:1px solid #a8543a73;border-radius:2px;width:100%;height:10px;overflow:hidden}.boss-bar-fill{background:linear-gradient(#a84838,#5c1818);width:100%;height:100%;transition:width .15s;box-shadow:0 0 10px #8b2e2e73}.overlay{pointer-events:auto;background:radial-gradient(#282018e0,#0c0a08f5);justify-content:center;align-items:center;display:none;position:absolute;inset:0}.overlay.visible{display:flex}.panel{text-align:center;background:linear-gradient(160deg,#30261cf7,#16120efa);border:1px solid #c4a35a59;border-radius:4px;width:min(480px,92vw);padding:36px 32px;box-shadow:inset 0 0 0 1px #00000080,0 16px 40px #0000008c,0 0 60px #503c1e1f}.logo{font-family:var(--font);letter-spacing:.02em;color:var(--parchment);text-shadow:0 2px #00000080,0 0 20px #c4a35a33;margin-bottom:6px;font-size:clamp(28px,5vw,40px);font-style:italic}.tagline{color:var(--muted);font-size:14px;line-height:1.55;font-family:var(--font);margin-bottom:28px;font-style:italic}.btn-row{flex-direction:column;gap:10px;margin-top:8px;display:flex}.btn{appearance:none;color:var(--parchment);font-family:var(--font-ui);letter-spacing:.06em;cursor:pointer;background:linear-gradient(#5a46288c,#281e12bf);border:1px solid #c4a35a73;border-radius:3px;padding:13px 20px;font-size:15px;font-weight:400;transition:transform .12s,box-shadow .12s,border-color .12s;box-shadow:0 3px #00000073}.btn:hover{border-color:#c4a35abf;transform:translateY(-1px);box-shadow:0 5px #0006,0 0 16px #c4a35a26}.btn:active{transform:translateY(1px);box-shadow:0 1px #0006}.btn.secondary{background:#00000040;border-color:#a090784d;padding:11px 18px;font-size:13px}.btn.danger{background:linear-gradient(#78281e80,#3c100cb3);border-color:#a8543a73}.controls-help{text-align:left;color:var(--muted);font-size:12px;line-height:1.7;font-family:var(--font-ui);border-top:1px solid #c4a35a26;margin-top:22px;padding-top:18px}.controls-help strong{color:var(--parchment)}.stat-line{color:var(--muted);font-size:15px;font-family:var(--font);margin:8px 0}.stat-line span{color:var(--accent);font-weight:400}#shop-overlay .panel{width:min(560px,94vw)}.shop-grid{text-align:left;grid-template-columns:1fr;gap:10px;margin:18px 0;display:grid}.shop-item{background:#00000047;border:1px solid #c4a35a2e;border-radius:3px;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;display:flex}.shop-item.owned{opacity:.5}.shop-item-info h4{font-size:14px;font-family:var(--font);color:var(--parchment);margin-bottom:2px}.shop-item-info p{color:var(--muted);font-size:12px}.shop-price{color:#a898c8;white-space:nowrap;font-weight:400;font-family:var(--font-ui);align-items:center;gap:6px;display:flex}.shop-item .btn{flex-shrink:0;padding:8px 14px;font-size:12px}.damage-flash{opacity:0;pointer-events:none;background:radial-gradient(#0000 35%,#50100c66);transition:opacity 80ms;position:absolute;inset:0}.damage-flash.on{opacity:1}
