:root{--bg: #1b1712;--panel: rgba(30, 25, 20, .92);--text: #f3ead8;--dim: #b5a88f;--gold: #f2c14e;--team-a: #4f8cff;--team-b: #e8673c}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font:600 16px/1.3 system-ui,sans-serif;touch-action:none;-webkit-user-select:none;user-select:none}#game{position:fixed;top:0;right:0;bottom:0;left:0}#hud{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}#hud>*{pointer-events:auto}#timeline{position:absolute;top:8px;left:8px;right:8px;display:flex;gap:6px;overflow:hidden;pointer-events:none}.chip{flex:none;padding:4px 8px;border-radius:6px;background:var(--panel);border-left:4px solid;font-size:13px;white-space:nowrap}.chip.A{border-color:var(--team-a)}.chip.B{border-color:var(--team-b)}.chip.now{outline:2px solid var(--gold)}#banner{position:absolute;top:44px;left:50%;transform:translate(-50%);padding:6px 14px;border-radius:999px;background:var(--panel);font-size:15px;white-space:nowrap;pointer-events:none}#banner:empty{display:none}#panel{position:absolute;left:0;right:0;bottom:0;display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;justify-content:space-between;padding:10px;background:linear-gradient(transparent,#0009)}#card:empty{display:none}#card{background:var(--panel);border-radius:10px;padding:8px 12px;min-width:220px;border-left:5px solid var(--dim)}#card.A{border-color:var(--team-a)}#card.B{border-color:var(--team-b)}#card .name{font-size:18px}#card .cls{color:var(--dim);font-size:13px}#card .bar{height:8px;background:#3a322a;border-radius:4px;margin:6px 0 4px;overflow:hidden}#card .bar>div{height:100%;background:#6cc04a}#card .stats{color:var(--dim);font-size:13px;font-variant-numeric:tabular-nums}#buttons{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}#buttons button{min-width:64px;min-height:48px;padding:0 16px;border:0;border-radius:10px;font:inherit;font-size:16px;background:#3a322a;color:var(--text);box-shadow:0 3px #120f0c;cursor:pointer}#buttons button.primary{background:var(--gold);color:#1b1712}#buttons button:active{transform:translateY(2px);box-shadow:0 1px #120f0c}.btn-wrap{display:inline-flex}.btn-wrap button:disabled{pointer-events:none}#buttons button:disabled{opacity:.55;cursor:default}#buttons button small{display:block;font-size:11px;font-weight:500}#buttons .dirs{display:grid;grid-template-columns:repeat(2,56px);gap:6px}#buttons .dirs button{min-width:0;padding:0;font-size:22px}#result{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-content:center;gap:16px;text-align:center;background:#000000a6}#result[hidden]{display:none}#result h1{margin:0;font-size:48px;color:var(--gold)}#result button{justify-self:center;min-height:52px;padding:0 28px;border:0;border-radius:10px;background:var(--gold);font:inherit;font-size:18px}#menu{position:fixed;top:0;right:0;bottom:0;left:0;overflow-y:auto;touch-action:pan-y;background:radial-gradient(ellipse at 50% -10%,#3a2f22 0%,var(--bg) 60%)}#menu[hidden]{display:none}.menu-main{min-height:100%;display:grid;place-content:center;gap:14px;padding:24px}.title{margin:0 0 18px;font-size:clamp(48px,12vw,88px);letter-spacing:-.03em;color:var(--gold);text-align:center}.menu-btn{min-width:260px;min-height:60px;border:0;border-radius:12px;font:inherit;font-size:20px;cursor:pointer;background:#3a322a;color:var(--text);box-shadow:0 4px #120f0c}.menu-btn.primary{background:var(--gold);color:#1b1712}.menu-btn:active,.roster-item:active,.class-pick button:active{transform:translateY(2px)}.barracks{max-width:980px;margin:0 auto;padding:16px;display:grid;grid-template-columns:280px 1fr;gap:16px}.barracks header{grid-column:1 / -1;display:flex;align-items:center;gap:16px}.barracks h2{margin:0;font-size:24px}.back{min-height:44px;padding:0 14px;border:0;border-radius:10px;background:#3a322a;color:var(--text);font:inherit;cursor:pointer}.roster{display:flex;flex-direction:column;gap:6px}.roster-item{display:flex;justify-content:space-between;align-items:center;min-height:52px;padding:0 14px;border:0;border-left:5px solid var(--team-a);border-radius:10px;background:var(--panel);color:var(--text);font:inherit;cursor:pointer;text-align:left}.roster-item.sel{outline:2px solid var(--gold)}.roster-item .rn{font-size:18px}.roster-item .rc{color:var(--dim);font-size:14px}.detail{background:var(--panel);border-radius:12px;padding:16px 20px}.detail h3{margin:0 0 8px;font-size:32px}.detail .label{margin:16px 0 6px;color:var(--dim);font-size:13px;text-transform:uppercase;letter-spacing:.08em}.class-pick{display:flex;flex-wrap:wrap;gap:8px}.class-pick button{min-height:44px;padding:0 16px;border:0;border-radius:10px;background:#3a322a;color:var(--text);font:inherit;cursor:pointer}.class-pick button.sel{background:var(--gold);color:#1b1712}.stats{border-collapse:collapse;font-variant-numeric:tabular-nums}.stats th{text-align:left;font-weight:500;color:var(--dim);padding:3px 24px 3px 0}.stats td{text-align:right;font-size:18px}.abilities{margin:0;padding-left:18px;color:var(--dim)}.abilities b{color:var(--text)}@media(max-width:640px){.barracks{grid-template-columns:1fr}.roster{flex-direction:row;overflow-x:auto;padding:3px}.roster-item{flex:none;flex-direction:column;justify-content:center;min-width:110px}}.tray{display:flex;flex-wrap:wrap;gap:6px;flex-basis:100%;justify-content:flex-end}.tray-item{display:flex;flex-direction:column;justify-content:center;min-height:48px;padding:4px 12px;border-radius:10px;background:var(--panel);border-left:4px solid var(--team-a);cursor:grab;touch-action:none}.tray-item small{color:var(--dim);font-size:12px}.tray-empty{color:var(--dim);align-self:center}.drag-ghost{position:fixed;left:0;top:0;z-index:10;pointer-events:none;margin:-72px 0 0 -40px;padding:10px 14px;border-radius:10px;background:var(--team-a);color:#fff;box-shadow:0 6px 16px #00000080}.drag-ghost[hidden]{display:none}.map-list{grid-column:1 / -1;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px}.map-list .roster-item{flex-direction:column;align-items:flex-start;justify-content:center;min-height:64px}#editor{position:fixed;top:0;right:0;bottom:0;width:360px;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:14px;background:var(--panel);border-left:1px solid #3a322a}#editor[hidden]{display:none}#editor header{display:flex;align-items:center;gap:12px}#editor h2{margin:0;font-size:22px}#editor section{display:flex;flex-direction:column;gap:8px}#editor label{display:flex;flex-direction:column;gap:4px;flex:1;color:var(--dim);font-size:13px}#editor input,#editor select{min-height:40px;padding:0 10px;border:1px solid #4a4036;border-radius:8px;background:#2a231d;color:var(--text);font:inherit;width:100%}#editor button{min-height:42px;padding:0 12px;border:0;border-radius:9px;background:#3a322a;color:var(--text);font:inherit;cursor:pointer}#editor button.primary,#editor button.sel{background:var(--gold);color:#1b1712}#editor button:disabled{opacity:.55;cursor:default}#editor button.primary:disabled{background:#3a322a;color:var(--text)}.ed-row{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end}.ed-row select{flex:1}.ed-label{color:var(--dim);font-size:13px;text-transform:uppercase;letter-spacing:.08em}.ed-tools{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.ed-status{padding:8px 12px;border-radius:8px;font-size:14px}.ed-status.ok{background:#6cc04a26}.ed-status.bad{background:#f2c14e26}.ed-status ul{margin:0;padding-left:18px}@media(max-width:799px){#editor{top:auto;left:0;width:auto;height:45vh;border-left:0;border-top:1px solid #3a322a}}#rotate{position:fixed;top:44px;right:10px;display:flex;gap:6px}#rotate[hidden]{display:none}#rotate button{width:48px;height:48px;border:0;border-radius:10px;background:var(--panel);color:var(--text);font-size:24px;cursor:pointer;box-shadow:0 3px #120f0c}#rotate button:active{transform:translateY(2px);box-shadow:0 1px #120f0c}body.editing #rotate{top:12px;left:12px;right:auto}.class-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}.class-card{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-height:76px;padding:8px 12px;border:0;border-radius:10px;background:#3a322a;color:var(--text);font:inherit;text-align:left;cursor:pointer}.class-card .cn{font-size:16px}.class-card .cl{color:var(--dim);font-size:13px}.class-card.sel{outline:2px solid var(--gold);cursor:default}.class-card.locked{background:#2a231d;cursor:default}.class-card.locked .cn{color:var(--dim)}.class-card .req{color:var(--dim);font-size:12px;font-weight:500}.xpbar{width:100%;height:6px;background:#1b1712;border-radius:3px;overflow:hidden}.xpbar>span{display:block;height:100%;background:var(--gold)}.class-pick button small{display:block;font-size:11px;font-weight:500;opacity:.8}.hint{margin:0;color:var(--dim)}.xp-report{margin:0;padding:0;list-style:none;font-size:18px;color:var(--text)}.xp-report li{margin:4px 0}