:root{--wood-1: #4a3520;--wood-2: #6b4a2c;--wood-3: #8a6236;--parch: #f0e0bb;--parch-2: #dcc79a;--gold: #f5c542;--gold-dark: #b98d1c;--green: #59b93a;--green-dark: #2f7a1e;--red: #d8463a;--red-dark: #96271f;--ink: #33230f;--panel-shadow: 0 -7px 0 rgba(0, 0, 0, .45), 0 -3px 0 rgba(255, 220, 160, .14) inset, 0 -14px 30px rgba(0, 0, 0, .35);--font: "Baloo 2", "Fredoka", "Trebuchet MS", "Segoe UI", system-ui, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;background:#10180f;font-family:var(--font);color:#fff;user-select:none;touch-action:none}#app{position:fixed;inset:0}#world{position:absolute;inset:0;width:100%;height:100%;display:block}#hud{position:absolute;top:0;left:0;right:0;padding:10px 12px;display:flex;align-items:flex-start;justify-content:space-between;pointer-events:none;gap:10px}.hud-left,.hud-right{display:flex;flex-direction:column;gap:6px;pointer-events:auto}.hud-right{align-items:flex-end}.res{display:flex;align-items:center;gap:7px;background:linear-gradient(180deg,#1c160ceb,#0c0a06eb);border:2px solid rgba(0,0,0,.45);border-radius:999px;padding:3px 12px 3px 4px;min-width:132px;box-shadow:0 3px #00000059}.res b{font-size:15px;font-weight:800;letter-spacing:.2px;text-shadow:0 2px 0 rgba(0,0,0,.6)}.res svg{flex:none;filter:drop-shadow(0 2px 0 rgba(0,0,0,.45))}.pill{display:flex;align-items:center;gap:6px;background:#14100ad9;border:2px solid rgba(0,0,0,.4);border-radius:999px;padding:4px 12px;font-weight:800;font-size:14px;box-shadow:0 3px #0000004d}.chip{background:#14100ad9;border:2px solid rgba(0,0,0,.4);border-radius:16px;padding:6px 10px;font-weight:800;font-size:13px;box-shadow:0 3px #0000004d}#dock{position:absolute;right:14px;bottom:16px;display:flex;flex-direction:column;gap:12px;align-items:flex-end}.dock-row{display:flex;gap:12px}.btn{font-family:var(--font);font-weight:800;font-size:15px;color:#fff;border:none;border-radius:18px;padding:13px 20px;cursor:pointer;text-transform:uppercase;letter-spacing:.6px;text-shadow:0 2px 0 rgba(0,0,0,.35);box-shadow:0 5px #0006,0 8px 14px #00000059;transition:transform .06s,box-shadow .06s,filter .12s;display:flex;align-items:center;gap:8px}.btn:active{transform:translateY(4px);box-shadow:0 1px #0006}.btn.green{background:linear-gradient(180deg,#74d451,var(--green-dark))}.btn.red{background:linear-gradient(180deg,#f0695c,var(--red-dark))}.btn.gold{background:linear-gradient(180deg,#ffd968,var(--gold-dark));color:var(--ink);text-shadow:0 1px 0 rgba(255,255,255,.4)}.btn.blue{background:linear-gradient(180deg,#6aa9e8,#2b5c9c)}.btn.ghost{background:linear-gradient(180deg,#6a5c48,#3d3325)}.btn:disabled{filter:grayscale(.7) brightness(.75);cursor:default}.btn .badge{background:#d8463a;color:#fff;border-radius:999px;font-size:12px;padding:1px 7px;box-shadow:0 2px #0006}.big-attack{width:104px;height:104px;border-radius:50%;font-size:19px;justify-content:center;text-align:center;padding:0;line-height:1.05;flex-direction:column;gap:2px}#overlay{position:absolute;inset:0;display:none;align-items:flex-end;justify-content:center;background:#060a0673}#overlay.open{display:flex}.sheet{width:min(760px,100%);max-height:78vh;overflow-y:auto;background:repeating-linear-gradient(180deg,#00000017 0 1px,#ffe2aa0d 1px 2px,#0000 2px 38px),linear-gradient(180deg,#8f6733,#6d4a24 34%,#452f18);border:3px solid rgba(0,0,0,.55);border-radius:22px 22px 0 0;box-shadow:var(--panel-shadow);padding:14px 16px 22px;animation:rise .18s ease-out;position:relative}.sheet:before{content:"";position:absolute;left:0;right:0;top:0;height:6px;border-radius:20px 20px 0 0;background:linear-gradient(180deg,#f5d67a,#b98d1c);box-shadow:0 2px #00000059}.sheet h2{color:#ffeec2;text-shadow:0 2px 0 rgba(0,0,0,.6)}.card{background:linear-gradient(180deg,#ffe2aa29,#0000004d);border:2px solid rgba(0,0,0,.4);border-radius:14px;padding:9px 11px;margin-bottom:8px;cursor:pointer;transition:transform .08s,background .12s}.card .name{color:#fff3d6}@keyframes rise{0%{transform:translateY(28px);opacity:.4}}.sheet h2{margin:2px 0 10px;font-size:21px;text-align:center;text-shadow:0 2px 0 rgba(0,0,0,.5)}.sheet h3{margin:14px 0 6px;font-size:15px;color:var(--gold);text-transform:uppercase;letter-spacing:1px}.sheet-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.close{background:#00000059;border:2px solid rgba(0,0,0,.4);color:#fff;border-radius:12px;width:34px;height:34px;font-size:17px;font-weight:900;cursor:pointer;font-family:var(--font)}.card{display:flex;gap:10px;align-items:center;background:linear-gradient(180deg,#fff0c81f,#00000038);border:2px solid rgba(0,0,0,.35);border-radius:14px;padding:9px 11px;margin-bottom:8px;cursor:pointer;transition:transform .08s,background .12s}.card:hover{background:linear-gradient(180deg,#fff0c838,#0003);transform:translate(2px)}.card.locked{opacity:.45;cursor:not-allowed}.scout{width:92px;height:92px;flex:none;border-radius:10px;border:2px solid rgba(0,0,0,.45);box-shadow:0 3px #0000004d;image-rendering:auto}.card .thumb{width:76px;height:76px;flex:none;border-radius:12px;background:radial-gradient(circle at 50% 35%,#fff0c838,#00000073);border:2px solid rgba(0,0,0,.4);display:grid;place-items:center;overflow:hidden;position:relative}.card .thumb img{width:118%;height:118%;object-fit:contain;filter:drop-shadow(0 3px 2px rgba(0,0,0,.45))}.badge-count{position:absolute;top:2px;left:2px;background:#14100ae6;border:1.5px solid rgba(255,224,140,.55);border-radius:8px;color:#ffe08a;font-size:11px;font-weight:900;padding:0 5px}.train-btn{flex:none;padding:10px 16px;font-size:13px;border-radius:14px}.card .thumb img{width:100%;height:100%;object-fit:contain;image-rendering:auto}.card .body{flex:1;min-width:0}.card .body .name{font-weight:800;font-size:15px}.card .body .desc{font-size:12px;opacity:.8;line-height:1.25}.cost{display:inline-flex;align-items:center;gap:4px;font-weight:800;font-size:13px;color:#ffe08a}.cost.gold{color:#ffd34d}.cost.intel{color:#ef8ae0}.cost.black{color:#a48cf5}.cost.no{color:#ff8b7d}.cost.ok{color:#9be36a}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.stat{display:flex;justify-content:space-between;font-size:13px;padding:3px 0;border-bottom:1px dashed rgba(255,255,255,.14)}.stat b{color:var(--gold)}#overlay.select{align-items:center;background:radial-gradient(circle at 50% 30%,#2b3d26,#0d1209 70%)}.faction-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}.select-wrap{width:min(1180px,96vw);margin:0 auto;max-height:94vh;overflow-y:auto}.faction-card{background:linear-gradient(180deg,#fff0c81a,#00000059);border:3px solid rgba(0,0,0,.5);border-radius:18px;padding:14px;cursor:pointer;text-align:center;transition:transform .1s,border-color .15s}.faction-card:hover{transform:translateY(-3px)}.faction-card.picked{border-color:var(--gold);box-shadow:0 0 0 3px #f5c54259,0 10px 20px #00000080}.faction-card .emblem{width:78px;height:78px;margin:0 auto 6px}.faction-card .fname{font-size:20px;font-weight:900;letter-spacing:.5px}.faction-card .native{font-size:12px;opacity:.75;margin-bottom:6px}.faction-card .doc{font-size:12.5px;line-height:1.35;opacity:.92;min-height:62px}.faction-card .uniq{margin-top:7px;font-size:12px;font-weight:800;color:var(--gold)}.statbar{display:flex;align-items:center;gap:6px;font-size:11px;margin-top:3px}.statbar .track{flex:1;height:8px;border-radius:999px;background:#00000080;overflow:hidden}.statbar .fill{display:block;height:100%;border-radius:999px}#battlebar{position:absolute;left:0;right:0;bottom:0;display:none;gap:8px;padding:10px 12px 14px;background:linear-gradient(180deg,transparent,rgba(10,14,8,.85) 40%);overflow-x:auto;justify-content:center}#battlebar.open{display:flex}.troop-chip{min-width:74px;background:#14100ae6;border:2px solid rgba(0,0,0,.5);border-radius:12px;padding:4px;text-align:center;cursor:pointer;font-size:11px;font-weight:800}.troop-chip.picked{border-color:var(--gold);box-shadow:0 0 0 2px #f5c54266}.troop-chip img{width:46px;height:46px;object-fit:contain;display:block;margin:0 auto}.troop-chip .n{color:var(--gold)}.battle-top{position:absolute;top:66px;left:12px;right:12px;display:none;justify-content:space-between;pointer-events:none}.battle-top.open{display:flex}.timer{background:#14100ad9;border:2px solid rgba(0,0,0,.5);border-radius:12px;padding:6px 14px;font-weight:900;font-size:20px}.loot-line{display:flex;gap:10px;align-items:center;background:#14100ad9;border:2px solid rgba(0,0,0,.5);border-radius:12px;padding:6px 12px;font-weight:800}#toast{position:absolute;left:50%;top:96px;transform:translate(-50%);display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:none}.toast{background:#14100aeb;border:2px solid rgba(0,0,0,.45);border-radius:12px;padding:8px 16px;font-weight:800;font-size:14px;animation:toastIn .18s ease-out}@keyframes toastIn{0%{transform:translateY(-8px);opacity:0}}.src{font-size:10.5px;opacity:.55;text-decoration:underline;cursor:pointer}.result-stars{font-size:40px;letter-spacing:6px;text-align:center;color:var(--gold);text-shadow:0 3px 0 rgba(0,0,0,.5)}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}.progress-page{max-width:900px;margin:0 auto;padding:24px;font-family:var(--font);color:#e9e4d8}#battleops{position:absolute;left:0;right:0;bottom:108px;display:none;gap:8px;padding:0 12px;overflow-x:auto;justify-content:center;pointer-events:none}#battleops.open{display:flex}.op{pointer-events:auto;font-family:var(--font);font-weight:800;font-size:12px;color:#fff;background:linear-gradient(180deg,#7b5cc4,#422a80);border:2px solid rgba(0,0,0,.5);border-radius:12px;padding:7px 12px;cursor:pointer;display:flex;flex-direction:column;gap:2px;text-shadow:0 1px 0 rgba(0,0,0,.5);box-shadow:0 4px #00000073}.op:hover:not(:disabled){filter:brightness(1.12)}.op:disabled{filter:grayscale(.8) brightness(.7);cursor:default}.op.used{opacity:.4}.op-cost{display:flex;align-items:center;gap:3px;font-size:11px;color:#f0c9ff}