:root{--bg: #070a10;--panel: #11161f;--panel-2: #1a2230;--edge: #2a3548;--ink: #eaf2ff;--muted: #8aa0bf;--hot: #ff7a59;--coin: #ffd24a;--safe: #3ad6c0;font-family:Segoe UI,system-ui,sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:radial-gradient(900px 600px at 50% -10%,#0e1626 0%,var(--bg) 60%);color:var(--ink);display:flex;justify-content:center;-webkit-font-smoothing:antialiased;overflow:hidden;touch-action:none;user-select:none}#app{width:min(460px,100vw);height:100vh;padding:8px 8px 12px;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;gap:8px;margin-bottom:6px}.title{font-weight:800;letter-spacing:.4px;font-size:18px}.title .k{color:var(--safe)}.spacer{flex:1}button{font:inherit;cursor:pointer;color:var(--ink);background:var(--panel-2);border:1px solid var(--edge);border-radius:9px;padding:6px 10px;transition:transform .06s,background .15s}button:hover:not(:disabled){background:#243049}button:active:not(:disabled){transform:translateY(1px)}button.primary{background:linear-gradient(180deg,#ff7a59,#e0521c);border-color:#ffa37e;color:#2a0f06;font-weight:700}.icon-btn{padding:6px 9px}.seg{display:inline-flex;border:1px solid var(--edge);border-radius:9px;overflow:hidden}.seg button{border:0;border-radius:0;padding:6px 11px;font-size:13px;background:transparent}.seg button.on{background:var(--panel-2);color:#fff;font-weight:700}.seg button+button{border-left:1px solid var(--edge)}.hud{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--muted);margin-bottom:6px;min-height:22px}.hud .score{font-size:20px;font-weight:800;color:var(--ink)}.hud .unit{color:var(--muted);margin-left:2px}.hud .coins{color:var(--coin);font-weight:700}.hud .shield{color:#7aa8ff;font-weight:700}.hud .fuel{color:#5ce6a0;font-weight:700;display:inline-flex;align-items:center;gap:5px}.hud .fuel.on{text-shadow:0 0 8px #5ce6a0}.hud .fuelbar{display:inline-block;width:46px;height:7px;border-radius:4px;background:#143226;border:1px solid #245a44;overflow:hidden}.hud .fuelbar i{display:block;height:100%;background:#5ce6a0;transition:width .08s linear}.stage{position:relative;flex:1;display:flex;align-items:center;justify-content:center;min-height:0}canvas{width:100%;height:auto;max-height:100%;aspect-ratio:460 / 640;background:#0a0d14;border:1px solid var(--edge);border-radius:12px;display:block;touch-action:none}.hint{text-align:center;color:var(--muted);font-size:12px;margin-top:6px}.hint b{color:var(--ink)}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#06090eb8;backdrop-filter:blur(3px);border-radius:12px;z-index:5}.modal{width:min(360px,90%);background:var(--panel);border:1px solid var(--edge);border-radius:14px;padding:18px 18px 16px;box-shadow:0 18px 60px #00000080}.modal h2{margin:0 0 4px;font-size:22px}.modal h3{margin:12px 0 4px;font-size:14px;color:var(--safe)}.modal p{margin:0 0 8px;color:var(--muted)}.modal ul{margin:4px 0;padding-left:18px;color:var(--muted);font-size:13px}.modal ul li{margin:3px 0}.modal b{color:var(--ink)}.stat-line{font-size:15px;color:var(--muted);margin:3px 0}.stat-line b{color:var(--ink);font-size:17px}.help-content{max-height:56vh;overflow-y:auto}.row{display:flex;gap:8px;margin-top:14px}.row button{flex:1;padding:9px}
