@import"https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700;800&family=Playfair+Display:ital,wght@0,600;1,600&family=Roboto+Mono:wght@400;600&family=Inter:wght@400;500;600;700&display=swap";:root{--bg-dark: #121418;--panel-bg: rgba(22, 26, 33, .92);--panel-border: #443c2c;--gold-accent: #d4af37;--gold-glow: rgba(212, 175, 55, .4);--french-blue: #1e50a2;--french-light: #4682b4;--coalition-green: #255836;--coalition-white: #e8e8e8;--danger-red: #c62828;--warning-amber: #f57f17;--success-green: #2e7d32;--text-main: #e2d9c8;--text-dim: #9e9687;--font-serif: "Cinzel", "Playfair Display", "Georgia", serif;--font-sans: "Inter", system-ui, sans-serif;--font-mono: "Roboto Mono", monospace}*{box-sizing:border-box;margin:0;padding:0;user-select:none}html,body{width:100%;height:100%;overflow:hidden;background-color:var(--bg-dark);color:var(--text-main);font-family:var(--font-sans)}#app{width:100vw;height:100vh;position:relative;display:flex;flex-direction:column}#canvas-container{flex:1;width:100%;height:100%;position:absolute;top:0;left:0;z-index:1;cursor:grab}#canvas-container.grabbing{cursor:grabbing}#game-canvas{width:100%;height:100%;display:block}#hud-top{position:absolute;top:0;left:0;width:100%;z-index:10;pointer-events:none}.hud-topbar{pointer-events:auto;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(180deg,rgba(14,17,22,.96) 0%,rgba(14,17,22,.82) 85%,transparent 100%);border-bottom:2px solid var(--panel-border);padding:10px 24px 14px;box-shadow:0 4px 20px #0009}.hud-left{display:flex;flex-direction:column;gap:2px}.campaign-title .battle-name{font-family:var(--font-serif);font-size:19px;font-weight:800;letter-spacing:1.5px;color:var(--gold-accent);text-shadow:0 0 10px var(--gold-glow)}.campaign-title .battle-date{font-size:11px;color:var(--text-dim);margin-left:8px;font-style:italic}.turn-box{display:flex;align-items:center;gap:12px;font-size:12px}.turn-num{font-family:var(--font-mono);font-weight:700;color:#fff;background:#ffffff14;padding:2px 8px;border-radius:4px;border:1px solid rgba(255,255,255,.15)}.time-of-day{color:#c7b299;font-style:italic}.wasm-pill{display:inline-flex;align-items:center;gap:6px;background:#102818e6;border:1px solid #2ecc71;padding:3px 8px;border-radius:12px;font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.5px;color:#4ade80;box-shadow:0 0 10px #2ecc714d;cursor:help;user-select:none}.wasm-dot{width:6px;height:6px;border-radius:50%;background:#2ecc71;box-shadow:0 0 6px #2ecc71;animation:pulse-wasm 2s infinite ease-in-out}@keyframes pulse-wasm{0%,to{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.85)}}.scoreboard{display:flex;align-items:center;gap:18px}.score-card{display:flex;align-items:center;gap:10px;background:#00000073;padding:6px 14px;border-radius:6px;border:1px solid var(--panel-border)}.score-card.french{border-left:4px solid var(--french-blue)}.score-card.coalition{border-right:4px solid var(--coalition-green)}.score-data{display:flex;flex-direction:column}.score-data.text-right{text-align:right}.faction-title{font-family:var(--font-serif);font-size:11px;letter-spacing:1px;color:var(--text-dim)}.vp-points{font-family:var(--font-mono);font-size:20px;font-weight:800;color:var(--gold-accent)}.obj-held{font-size:10px;color:#8da4b8}.phase-indicator{padding:6px 16px;border-radius:20px;font-family:var(--font-serif);font-size:11px;font-weight:700;letter-spacing:1.2px;box-shadow:0 0 12px #00000080}.phase-indicator.french-active{background:linear-gradient(135deg,#1e50a2,#0d2857);border:1px solid #6ea8fe;color:#fff}.phase-indicator.coalition-active{background:linear-gradient(135deg,#255836,#112a1a);border:1px solid #75b798;color:#d1e7dd}.hud-right.controls{display:flex;align-items:center;gap:8px}.btn-hud{background:#1e242ed9;border:1px solid var(--panel-border);color:var(--text-main);padding:6px 12px;border-radius:5px;font-size:12px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .2s ease}.btn-hud:hover{background:#323c4bf2;border-color:var(--gold-accent);color:#fff;transform:translateY(-1px)}.btn-hud.active{background:var(--gold-accent);color:#111;font-weight:700;border-color:#fff;box-shadow:0 0 10px var(--gold-glow)}.btn-end-turn{background:linear-gradient(135deg,#d4af37,#aa820a);color:#111;border:1px solid #fff;padding:8px 18px;font-family:var(--font-serif);font-size:13px;font-weight:800;letter-spacing:1px;border-radius:6px;cursor:pointer;box-shadow:0 2px 10px #d4af3766;transition:all .2s ease}.btn-end-turn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 15px #d4af37b3}.btn-end-turn:disabled{background:#333;color:#777;border-color:#444;cursor:not-allowed;box-shadow:none}#unit-card-container{position:absolute;bottom:20px;left:20px;width:340px;z-index:10;pointer-events:auto}.empty-dossier{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:8px;padding:16px;box-shadow:0 6px 24px #000000b3;backdrop-filter:blur(8px)}.empty-dossier .dossier-title{font-family:var(--font-serif);font-size:13px;font-weight:700;color:var(--gold-accent);letter-spacing:1px;margin-bottom:8px}.empty-dossier .hint-text{font-size:12px;color:var(--text-dim);line-height:1.5;margin-bottom:12px}.quick-shortcuts{display:flex;flex-wrap:wrap;gap:6px}.quick-shortcuts .badge{font-size:10px;font-family:var(--font-mono);background:#ffffff14;padding:3px 6px;border-radius:4px;color:#bdc8d4}.unit-dossier{background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:8px;padding:16px;box-shadow:0 8px 30px #000000bf;backdrop-filter:blur(10px)}.unit-dossier.french-theme{border-top:4px solid var(--french-blue)}.unit-dossier.coalition-theme{border-top:4px solid var(--coalition-green)}.dossier-header{display:flex;align-items:center;gap:12px;margin-bottom:14px}.unit-identity .unit-name{font-family:var(--font-serif);font-size:15px;font-weight:700;color:#fff}.unit-identity .faction-tag{font-size:11px;color:var(--text-dim)}.stat-gauges{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}.stat-row .stat-meta{display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:600;margin-bottom:4px}.stat-meta .label{color:var(--text-dim)}.stat-meta .value{font-family:var(--font-mono);color:#fff}.gauge-track{width:100%;height:7px;background:#0009;border-radius:4px;overflow:hidden;border:1px solid rgba(255,255,255,.1)}.gauge-fill{height:100%;transition:width .3s ease}.hp-bar{background:linear-gradient(90deg,#4caf50,#81c784)}.badge{padding:2px 7px;border-radius:4px;font-size:10px;font-weight:700;letter-spacing:.5px}.badge-confident{background:#2e7d324d;color:#a5d6a7;border:1px solid #2e7d32}.badge-shaken{background:#f57f174d;color:#ffe082;border:1px solid #f57f17}.badge-routed{background:#c6282866;color:#ff8a80;border:1px solid #c62828}.badge-supplied{background:#2196f340;color:#90caf9;border:1px solid #1976d2}.badge-oos{background:#d32f2f59;color:#ffab91;border:1px solid #d32f2f}.tactical-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;background:#0000004d;padding:8px;border-radius:6px;border:1px solid rgba(255,255,255,.06);margin-bottom:12px}.tac-item{display:flex;flex-direction:column;align-items:center;text-align:center}.tac-item .tac-label{font-size:9px;color:var(--text-dim);letter-spacing:.5px}.tac-item .tac-val{font-family:var(--font-mono);font-size:13px;font-weight:700;color:#fff}.moves-active{color:#4096ff!important}.moves-spent{color:#777!important}.facing-control{display:flex;justify-content:space-between;align-items:center;background:#ffffff0a;padding:6px 10px;border-radius:6px}.facing-label{font-size:11px;color:var(--text-dim)}.facing-label strong{color:var(--gold-accent)}.facing-buttons{display:flex;gap:6px}.btn-tac{background:#2d3746d9;border:1px solid var(--panel-border);color:#fff;padding:3px 8px;border-radius:4px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s}.btn-tac:hover{background:var(--gold-accent);color:#111}#battle-log-container{position:absolute;bottom:20px;right:20px;width:360px;z-index:10;pointer-events:auto}.log-panel{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:8px;box-shadow:0 8px 30px #000000bf;backdrop-filter:blur(10px);overflow:hidden}.log-header{display:flex;justify-content:space-between;align-items:center;background:#0e1116d9;padding:8px 12px;border-bottom:1px solid var(--panel-border)}.log-header .title{font-family:var(--font-serif);font-size:11px;font-weight:700;letter-spacing:1px;color:var(--gold-accent)}.log-header .count{font-size:10px;color:var(--text-dim)}.log-body{max-height:180px;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:6px;font-family:var(--font-sans);font-size:11px;line-height:1.4}.log-entry{padding:4px 6px;border-radius:4px;background:#ffffff08}.log-entry .bullet{color:var(--gold-accent);margin-right:4px}.tag-victory{background:#4caf5033;color:#c8e6c9;border-left:3px solid #4caf50;font-weight:700}.tag-defeat{background:#f4433633;color:#ffcdd2;border-left:3px solid #f44336;font-weight:700}.tag-combat{color:#ffe0b2}.tag-supply{color:#bbdefb}.tag-rally{color:#c8e6c9}.tag-ai{color:#d1c4e9}#combat-preview-container{position:absolute;top:90px;left:50%;transform:translate(-50%);width:480px;z-index:20;display:none;pointer-events:auto}.combat-preview-panel{background:#12161cf5;border:2px solid var(--gold-accent);border-radius:8px;padding:18px;box-shadow:0 10px 40px #000000d9;backdrop-filter:blur(12px)}.preview-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--panel-border);padding-bottom:10px;margin-bottom:12px}.preview-header h4{font-family:var(--font-serif);font-size:13px;color:var(--gold-accent);letter-spacing:1px}.flank-badge{font-size:10px;font-weight:800;padding:3px 8px;border-radius:4px;letter-spacing:.5px}.flank-badge.rear{background:#d32f2f;color:#fff}.flank-badge.flank{background:#f57f17;color:#fff}.flank-badge.front{background:#ffffff1a;color:#ccc}.combatants-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.combatant{display:flex;flex-direction:column;width:42%}.combatant.attacker{border-left:3px solid var(--french-blue);padding-left:8px}.combatant.defender{border-right:3px solid var(--coalition-green);padding-right:8px;text-align:right}.combatant .role{font-size:9px;color:var(--text-dim)}.combatant .name{font-size:13px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.combatant .stat{font-size:10px;color:#adb5bd}.vs-badge{font-family:var(--font-serif);font-size:14px;font-weight:800;color:var(--gold-accent)}.prediction-results{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}.pred-box{background:#0006;padding:10px;border-radius:6px;border:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;align-items:center;text-align:center}.pred-box .label{font-size:10px;color:var(--text-dim);margin-bottom:4px}.pred-box .pred-num{font-family:var(--font-mono);font-size:18px;font-weight:800}.damage-num{color:#ff5252}.pred-box .subtext{font-size:10px;color:#90a4ae;margin-top:2px}.counter-val.warning{font-size:12px;font-weight:700;color:#ffb74d}.counter-val.safe{font-size:11px;color:#81c784}.tactical-modifiers{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}.prev-mod{font-size:10px;padding:2px 8px;border-radius:4px}.prev-mod.terrain{background:#8d6e634d;color:#d7ccc8;border:1px solid #8d6e63}.prev-mod.river{background:#2196f34d;color:#bbdefb;border:1px solid #2196f3}.action-buttons{display:flex;gap:10px}.btn-attack-fire{flex:2;background:linear-gradient(135deg,#d32f2f,#8e0000);color:#fff;border:1px solid #ff7961;padding:10px;font-family:var(--font-serif);font-size:13px;font-weight:800;letter-spacing:1px;border-radius:6px;cursor:pointer;box-shadow:0 4px 15px #d32f2f66;transition:all .2s}.btn-attack-fire:hover{transform:translateY(-2px);box-shadow:0 6px 20px #d32f2fb3}.btn-cancel{flex:1;background:#3c3c3c99;color:#ccc;border:1px solid #555;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer}.btn-cancel:hover{background:#505050cc;color:#fff}#modal-container{position:absolute;top:0;left:0;width:100vw;height:100vh;z-index:50;display:none;pointer-events:auto}.modal-backdrop{width:100%;height:100%;background:#000c;display:flex;justify-content:center;align-items:center;backdrop-filter:blur(8px)}.modal-card{background:var(--panel-bg);border:2px solid var(--gold-accent);border-radius:10px;box-shadow:0 15px 50px #000000e6;max-width:680px;width:90%;max-height:85vh;display:flex;flex-direction:column}.modal-header{display:flex;justify-content:space-between;align-items:center;background:#0e1116e6;padding:16px 24px;border-bottom:2px solid var(--panel-border)}.modal-header h2{font-family:var(--font-serif);font-size:18px;letter-spacing:1.5px;color:var(--gold-accent)}.modal-close{background:none;border:none;color:#bbb;font-size:20px;cursor:pointer}.modal-body{padding:24px;overflow-y:auto;line-height:1.6}.briefing-lead{font-size:14px;color:#fff;margin-bottom:20px;border-left:3px solid var(--gold-accent);padding-left:12px;font-style:italic}.rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}.rule-box{background:#00000059;padding:14px;border-radius:6px;border:1px solid var(--panel-border)}.rule-box h4{font-family:var(--font-serif);font-size:12px;color:var(--gold-accent);margin-bottom:8px}.rule-box p{font-size:12px;color:var(--text-dim);margin-bottom:6px}.rule-box ul{padding-left:18px;font-size:11px;color:#ddd}.rule-box li{margin-bottom:4px}.controls-summary{background:#d4af371a;border:1px solid var(--panel-border);padding:10px 14px;border-radius:6px;font-size:12px;color:var(--gold-accent)}.modal-footer{padding:16px 24px;background:#0e1116e6;border-top:1px solid var(--panel-border);display:flex;justify-content:flex-end}.btn-imperial{background:linear-gradient(135deg,#d4af37,#997509);color:#111;border:1px solid #fff;padding:12px 24px;font-family:var(--font-serif);font-size:14px;font-weight:800;letter-spacing:1.5px;border-radius:6px;cursor:pointer;box-shadow:0 4px 15px #d4af3780;transition:all .2s}.btn-imperial:hover{transform:translateY(-2px);box-shadow:0 6px 25px #d4af37cc}.gameover-card .victory-reason{font-size:15px;color:#fff;text-align:center;margin-bottom:24px;padding:14px;border-radius:6px;background:#0006}.final-scores{display:flex;justify-content:space-around;align-items:center;margin-bottom:20px}.score-pillar{text-align:center;padding:16px 24px;border-radius:8px;background:#00000080}.score-pillar.french{border:2px solid var(--french-blue)}.score-pillar.coalition{border:2px solid var(--coalition-green)}.score-pillar h3{font-family:var(--font-serif);font-size:13px;color:var(--text-dim);margin-bottom:8px}.score-pillar .score-big{font-family:var(--font-mono);font-size:32px;font-weight:800;color:var(--gold-accent)}.vs-divider{font-family:var(--font-serif);font-size:12px;color:var(--text-dim)}