@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Marcellus&display=swap');
:root{--bg:#0b111a;--panel:#111a25;--panel2:#182330;--line:#2b3a49;--text:#f3eee4;--muted:#9da9b3;--gold:#e9b949;--cyan:#4ecdc4;--danger:#ff6b6b;--shadow:0 20px 60px #0008}
*{box-sizing:border-box;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}html,body{margin:0;min-height:100%;background:radial-gradient(circle at 50% -30%,#24344a 0,#0b111a 48%);color:var(--text);font-family:'DM Sans',sans-serif}button,select,input{font:inherit}button{cursor:pointer}h1,h2{font-family:'Marcellus',serif;font-weight:400;margin:0}.hidden{display:none!important}
.topbar{height:78px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 28px;border-bottom:1px solid #ffffff12;background:#0d141ef2;backdrop-filter:blur(14px);position:relative;z-index:5}.brand{display:flex;gap:12px;align-items:center}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border:1px solid #e9b94966;color:var(--gold);font-size:24px;transform:rotate(45deg);background:#e9b9490d}.brand h1{font-size:1.1rem;letter-spacing:.06em}.brand p{margin:3px 0 0;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.18em}.round-pill{display:flex;align-items:center;gap:10px;padding:8px 16px;border:1px solid var(--line);border-radius:99px;color:var(--muted);font-size:.72rem;letter-spacing:.14em}.round-pill strong{font-size:1rem;color:var(--text)}.header-actions{justify-self:end;display:flex;gap:10px}.icon-btn,.text-btn,.close-btn{border:1px solid var(--line);background:#ffffff08;color:var(--text);border-radius:8px;min-height:38px}.icon-btn{width:38px}.text-btn{padding:0 14px}
.turn-flow{height:76px;display:flex;align-items:center;justify-content:center;gap:14px;padding:10px 24px;background:#111a25;border-bottom:1px solid #ffffff12;position:relative;z-index:4}.turn-flow>i{color:#4a5b69;font-size:1.4rem;font-style:normal}.flow-step{min-width:160px;display:flex;align-items:center;gap:10px;padding:8px 12px;border:1px solid transparent;border-radius:10px;color:#667582;transition:.25s}.flow-step>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid #43515d;font-weight:800}.flow-step b,.flow-step small{display:block}.flow-step b{font-size:.84rem}.flow-step small{font-size:.7rem;margin-top:2px}.flow-step.active{color:var(--text);border-color:#e9b94966;background:#e9b9490e;box-shadow:0 0 25px #e9b94910}.flow-step.active>span{background:var(--gold);border-color:var(--gold);color:#171207}.flow-step.done{color:#9db5b0}.flow-step.done>span{border-color:var(--cyan);color:var(--cyan)}
.game-shell{height:calc(100vh - 154px);min-height:650px;display:grid;grid-template-columns:230px minmax(520px,1fr) 320px;gap:1px;background:#ffffff0a}.panel{background:#0f1722;padding:22px}.eyebrow{font-size:.75rem;letter-spacing:.16em;color:#aeb8c1;font-weight:700}.players{margin-top:16px;display:grid;gap:8px}.player{padding:12px;border:1px solid transparent;border-radius:10px;background:#ffffff05;transition:.2s}.player.active{border-color:var(--pc);box-shadow:inset 3px 0 var(--pc);background:#ffffff0a}.player.eliminated{opacity:.36;filter:grayscale(1)}.player-top{display:flex;align-items:center;gap:9px}.player-color{width:10px;height:10px;border-radius:2px;background:var(--pc);box-shadow:0 0 12px var(--pc)}.player-name{font-size:.9rem;font-weight:700;flex:1}.turn-badge{font-size:.62rem;letter-spacing:.1em;color:var(--pc)}.player-stats{display:flex;gap:14px;margin-top:7px;color:var(--muted);font-size:.78rem}.player-stats strong{color:var(--text)}.regions-card{margin-top:28px}.region-row{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:8px;margin-top:12px;font-size:.85rem;color:var(--muted)}.region-swatch{height:7px;border-radius:5px;background:var(--rc)}.region-row strong{color:var(--gold);font-size:.78rem}
.map-wrap{position:relative;overflow:hidden;background:radial-gradient(ellipse at center,#1b2a39 0,#0c141e 67%);padding:20px 24px 12px}.map-wrap:before{content:'';position:absolute;inset:0;opacity:.1;background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(circle,#000,transparent 75%)}.map-head{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:start}.map-head h2{font-size:1.35rem;margin-top:5px}.reinforcements{text-align:right;padding:8px 13px;border:1px solid #e9b94955;border-radius:8px;background:#e9b9490a}.reinforcements span{display:block;font-size:.62rem;letter-spacing:.14em;color:var(--gold)}.reinforcements strong{font-size:1.25rem;color:#ffe28a}.map-guide{position:absolute;z-index:3;top:76px;left:50%;transform:translateX(-50%);display:grid;grid-template-columns:32px auto;column-gap:10px;align-items:center;min-width:390px;padding:10px 14px;border:1px solid #ffffff1a;border-radius:12px;background:#0a121bed;box-shadow:0 12px 30px #0007;pointer-events:none}.map-guide>span{grid-row:1/3;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--gold);color:#151109;font-weight:900}.map-guide strong{font-size:.85rem}.map-guide small{color:var(--muted);font-size:.72rem;margin-top:2px}#map{position:relative;width:100%;height:calc(100% - 74px);min-height:470px;filter:drop-shadow(0 18px 30px #0008)}.sea-ring{fill:none;stroke:#8bd6df12;stroke-width:1}.connection{stroke:#a8c3d17d;stroke-width:4;stroke-dasharray:7 7;pointer-events:none}.connection.cross{stroke:#f0c85a9c;stroke-width:5}.region-label{fill:#dbe4e72b;font-family:'Marcellus',serif;font-size:23px;letter-spacing:3px;text-anchor:middle;pointer-events:none}.territory-shape{fill:color-mix(in srgb,var(--owner) 32%,#111a24);stroke:var(--region);stroke-width:3;transition:.2s;cursor:pointer}.territory:hover .territory-shape,.territory:focus .territory-shape{fill:color-mix(in srgb,var(--owner) 52%,#182534);stroke:#fff;stroke-width:4}.territory.owned .territory-shape{stroke:var(--owner);filter:drop-shadow(0 0 7px color-mix(in srgb,var(--owner) 45%,transparent))}.territory.owned:not(.selected) .territory-shape{animation:ownedBreath 2.8s ease-in-out infinite}@keyframes ownedBreath{50%{stroke-width:4}}.territory.selected .territory-shape{stroke:#fff4bf;stroke-width:6;filter:drop-shadow(0 0 14px var(--owner))}.territory.target .territory-shape{stroke:var(--danger);stroke-width:5;stroke-dasharray:9 5;animation:pulse 1.1s infinite}.territory-label{fill:#fff;text-anchor:middle;font-size:13px;font-weight:700;pointer-events:none;paint-order:stroke;stroke:#081018;stroke-width:4px;stroke-linejoin:round}.territory-region{fill:#bcc8cf;text-anchor:middle;font-size:9px;font-weight:700;letter-spacing:1px;pointer-events:none}.army-disc{fill:#071019;stroke:var(--owner);stroke-width:4;pointer-events:none}.army-count{fill:white;text-anchor:middle;font-size:19px;font-weight:800;pointer-events:none}.army-icon{fill:var(--owner);pointer-events:none}.map-legend{position:absolute;bottom:12px;left:28px;display:flex;gap:18px;color:var(--muted);font-size:.72rem}.dot{display:inline-block;width:8px;height:8px;margin-right:6px;border-radius:50%}.dot.selectable{background:var(--cyan)}.dot.target{border:2px solid var(--danger)}.line{display:inline-block;width:20px;border-top:1px dashed #9eb6c4;margin:0 6px 2px 0}@keyframes pulse{50%{opacity:.58}}
.right-panel{display:flex;flex-direction:column;gap:22px;overflow:auto}.order-card{padding-bottom:20px;border-bottom:1px solid var(--line)}.order-card h2{font-size:1.4rem;margin:8px 0}.order-card>p{font-size:.93rem;line-height:1.55;color:var(--muted);margin:0 0 14px}.turn-status{padding:10px 12px;border-left:3px solid var(--gold);background:#e9b9490b;border-radius:0 8px 8px 0;font-size:.82rem;line-height:1.45;margin-bottom:12px}.turn-status strong{color:var(--gold)}.cards-box{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;background:#ffffff06;border:1px solid var(--line);border-radius:9px;margin:10px 0;font-size:.82rem}.cards-box button{border:1px solid #e9b94966;background:#e9b94911;color:#f4cb63;border-radius:7px;padding:7px 9px;font-weight:700}.cards-box button:disabled{opacity:.35;cursor:not-allowed}.selection-info{display:grid;gap:8px;margin:10px 0}.selection-item{display:flex;justify-content:space-between;background:#ffffff08;border:1px solid var(--line);padding:10px;border-radius:8px;font-size:.82rem}.selection-item strong{color:var(--gold)}.battle-result{min-height:0;font-size:.85rem;margin:10px 0}.action-controls{display:grid;gap:10px}.action-controls label{font-size:.84rem;color:var(--muted)}input[type=range]{width:100%;accent-color:var(--gold)}.dice-choice{display:flex;gap:7px}.dice-choice button{flex:1;border:1px solid var(--line);background:#ffffff08;color:var(--text);border-radius:7px;padding:9px}.dice-choice button.active{border-color:var(--gold);color:var(--gold);background:#e9b94912}.must-attack{display:block;color:#ffd878;font-size:.78rem;font-weight:700;margin-top:8px}.primary-btn{width:100%;border:0;border-radius:8px;background:linear-gradient(135deg,#e5ae38,#f0ca68);color:#171207;font-weight:800;padding:12px 16px;margin-top:12px;box-shadow:0 8px 25px #e9b94922}.primary-btn:hover{filter:brightness(1.08)}.primary-btn:disabled{opacity:.4;cursor:not-allowed}.secondary-btn{width:100%;border:1px solid var(--line);border-radius:8px;background:#ffffff09;color:var(--text);padding:10px;font-weight:600}.chronicle{min-height:160px}.log{display:grid;gap:12px;margin-top:15px}.log-item{display:grid;grid-template-columns:7px 1fr;gap:9px;color:var(--muted);font-size:.78rem;line-height:1.4}.log-dot{width:6px;height:6px;border-radius:50%;background:var(--lc);margin-top:4px}
.modal-backdrop{position:fixed;z-index:20;inset:0;background:#05090edb;backdrop-filter:blur(10px);display:grid;place-items:center;padding:20px}.modal-backdrop.hidden{display:none}.modal{width:min(520px,100%);position:relative;background:linear-gradient(145deg,#172331,#0d151f);border:1px solid #ffffff1a;border-radius:16px;box-shadow:var(--shadow);padding:34px}.start-card{text-align:center}.crest{margin:0 auto 18px;width:66px;height:66px;display:grid;place-items:center;font-size:34px;color:var(--gold);border:1px solid #e9b94955;transform:rotate(45deg);background:#e9b9490b}.start-card h2{font-size:2.5rem;margin:9px 0}.start-card>p:not(.eyebrow):not(.autosave){color:var(--muted);line-height:1.55}.setup-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;text-align:left;margin:25px 0 10px}.setup-grid label{color:var(--muted);font-size:.82rem}.setup-grid select{width:100%;margin-top:7px;background:#0e1721;color:var(--text);border:1px solid var(--line);border-radius:8px;padding:11px}.large{padding:15px}.continue-btn{border:0;background:none;color:var(--gold);margin-top:13px;text-decoration:underline}.autosave{font-size:.72rem;color:#77848e;margin-top:18px}.rules-card h2{font-size:1.8rem;margin:8px 0 20px}.rules-card ol{padding-left:20px;color:var(--muted);line-height:1.6}.rules-card li{margin-bottom:11px}.rules-card b{color:var(--text)}.close-btn{position:absolute;right:16px;top:16px;width:34px;font-size:1.4rem}.dice-card{width:min(620px,100%);text-align:center}.dice-card h2{font-size:1.75rem;margin:8px 0}.battle-route{color:var(--muted);margin:6px 0 22px}.dice-arena{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;padding:20px;border:1px solid var(--line);border-radius:12px;background:#080e15}.dice-arena>div>span{display:block;font-size:.72rem;letter-spacing:.14em;color:var(--muted);margin-bottom:12px}.versus{font-family:'Marcellus',serif;color:var(--gold)}.big-dice{display:flex;justify-content:center;gap:9px;min-height:58px}.big-die{display:grid;place-items:center;width:54px;height:54px;border-radius:10px;background:#f0f4f4;color:#111923;font-size:1.45rem;font-weight:900;box-shadow:0 8px 18px #0006}.big-dice.defender .big-die{background:#ff786d;color:#fff}.big-die.rolling{animation:diceRoll .16s linear infinite}@keyframes diceRoll{0%{transform:rotate(-8deg) scale(.94)}50%{transform:rotate(9deg) scale(1.08)}100%{transform:rotate(-8deg) scale(.94)}}.comparison{margin:18px 0 0;display:grid;gap:8px}.compare-row{display:flex;justify-content:center;gap:9px;align-items:center;font-size:.9rem}.compare-row b{color:var(--gold)}.battle-summary{padding:12px;border-radius:9px;background:#ffffff08;font-size:.92rem;line-height:1.45}.hidden-control{visibility:hidden}.hidden-control.visible{visibility:visible}.toast{position:fixed;z-index:30;left:50%;bottom:30px;transform:translate(-50%,30px);opacity:0;padding:11px 17px;background:#edf3ef;color:#14201a;border-radius:8px;font-weight:700;font-size:.85rem;transition:.25s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}.victory{padding:18px;border:1px solid #e9b94955;border-radius:10px;text-align:center;background:#e9b9490a}.victory h3{font-family:'Marcellus',serif;font-size:1.45rem;margin:0 0 6px}.victory p{color:var(--muted);font-size:.82rem}
@media(max-width:1100px){.flow-step{min-width:0}.flow-step small{display:none}.game-shell{grid-template-columns:190px minmax(480px,1fr) 290px}.panel{padding:16px}.brand p{display:none}}
@media(max-width:820px){.topbar{height:66px;padding:0 14px;grid-template-columns:1fr auto}.round-pill{display:none}.brand h1{font-size:.9rem}.turn-flow{height:64px;gap:4px;padding:7px}.turn-flow>i{display:none}.flow-step{padding:6px;justify-content:center}.flow-step>span{width:28px;height:28px}.flow-step div{display:none}.game-shell{height:auto;min-height:calc(100vh - 130px);display:flex;flex-direction:column}.map-wrap{order:1;min-height:640px;padding:18px 12px}.right-panel{order:2}.left-panel{order:3}.left-panel,.right-panel{overflow:visible}.players{grid-template-columns:repeat(2,1fr)}.regions-card{display:none}#map{min-height:500px}.map-guide{top:72px;min-width:340px}.map-legend{left:14px}.right-panel{display:grid;grid-template-columns:1fr 1fr}.setup-grid{grid-template-columns:1fr}.start-card h2{font-size:2rem}}
@media(max-width:560px){.header-actions .text-btn{font-size:0;width:38px;padding:0}.header-actions .text-btn:after{content:'↻';font-size:1.2rem}.map-wrap{min-height:570px}.map-head h2{font-size:1.08rem}.reinforcements{padding:6px 9px}#map{min-height:445px}.map-guide{min-width:calc(100% - 24px);top:70px}.map-guide small{display:none}.map-legend{display:none}.right-panel{display:flex}.players{grid-template-columns:1fr 1fr}.modal{padding:26px 20px}.territory-label{font-size:10px}.dice-arena{gap:8px;padding:14px}.big-die{width:42px;height:42px}.big-dice{gap:5px}}

/* Map clarity, variants and terrain mode */
.map-toolbar{position:absolute;z-index:4;top:18px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:6px 8px;background:#08111bd9;border:1px solid #ffffff17;border-radius:9px}.map-toolbar>span:first-child{font-size:.78rem;font-weight:800;color:#dbe5e8;white-space:nowrap}.map-toolbar button{border:1px solid #3a4c5b;background:#172431;color:#b9c8cf;border-radius:6px;padding:5px 8px;font-size:.7rem}.map-toolbar button:hover{border-color:var(--gold);color:var(--gold)}.mode-badge{padding:4px 7px;border-radius:5px;background:#4ecdc417;color:#6fe4dc;font-size:.62rem;font-weight:900;letter-spacing:.09em}.connection{opacity:.07;transition:opacity .2s,stroke-width .2s}.connection.visible,.connection.show-all{opacity:1}.territory.dimmed{opacity:.3}.territory{transition:opacity .2s,filter .2s}.terrain-mark{font-size:14px;text-anchor:middle;fill:var(--terrain);paint-order:stroke;stroke:#071019;stroke-width:3px;pointer-events:none}.unit-mark{font-size:14px;text-anchor:middle;fill:var(--unit);pointer-events:none}.map-tooltip{position:absolute;z-index:8;pointer-events:none;min-width:210px;padding:11px 13px;border:1px solid #ffffff20;border-radius:9px;background:#07101af2;box-shadow:0 14px 35px #0009;font-size:.78rem;line-height:1.5}.map-tooltip b{display:block;font-size:.9rem;color:#fff}.map-tooltip .tip-row{display:flex;justify-content:space-between;gap:15px;color:var(--muted)}.map-tooltip .tip-row strong{color:var(--text)}.map-tooltip .tip-adj{margin-top:6px;padding-top:6px;border-top:1px solid #ffffff12;color:#91a6b0}.terrain-panel{padding:11px;border:1px solid #ffffff14;border-radius:9px;background:#09131e;margin:10px 0}.terrain-panel h3{font-family:'DM Sans',sans-serif;font-size:.78rem;margin:0 0 8px;color:#dce6e8}.unit-wheel{display:flex;align-items:center;justify-content:center;gap:5px;font-size:.68rem;color:var(--muted);margin-bottom:9px}.unit-wheel b{padding:5px 6px;border:1px solid #ffffff17;border-radius:5px;color:var(--text)}.unit-selector{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.unit-selector button{border:1px solid var(--line);background:#ffffff07;color:var(--muted);padding:7px 4px;border-radius:6px;font-size:.68rem}.unit-selector button.active{color:var(--unit-color);border-color:var(--unit-color);background:color-mix(in srgb,var(--unit-color) 12%,transparent)}.bonus-note{font-size:.7rem;color:#c9d3d7;line-height:1.45;margin-top:8px}.start-card{width:min(760px,100%)}.setup-section{border:0;padding:0;margin:17px 0;text-align:left}.setup-section legend{font-size:.72rem;font-weight:800;letter-spacing:.14em;color:#aeb8c1;margin-bottom:8px}.map-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.rules-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.option-card{position:relative;display:block;padding:11px;border:1px solid var(--line);border-radius:9px;background:#ffffff05;cursor:pointer;transition:.2s}.option-card:hover{border-color:#758897;transform:translateY(-2px)}.option-card.active{border-color:var(--gold);background:#e9b9490b;box-shadow:0 0 18px #e9b9490d}.option-card input{position:absolute;opacity:0}.option-card b,.option-card small{display:block}.option-card b{font-size:.8rem;color:var(--text)}.option-card small{font-size:.68rem;color:var(--muted);margin-top:4px;line-height:1.35}.ai-card{width:min(600px,100%)}.ai-card h2{font-size:1.75rem;margin:8px 0 18px}.ai-summary{display:grid;gap:10px}.ai-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.ai-kpi{padding:12px;border:1px solid var(--line);border-radius:8px;background:#ffffff06;text-align:center}.ai-kpi strong,.ai-kpi span{display:block}.ai-kpi strong{font-size:1.35rem;color:var(--gold)}.ai-kpi span{font-size:.68rem;color:var(--muted);margin-top:3px}.ai-battle{display:flex;justify-content:space-between;gap:12px;padding:9px;border-left:3px solid #ff786d;background:#ff786d0b;font-size:.76rem}.ai-battle span:last-child{color:var(--muted)}
@media(max-width:820px){.map-toolbar{top:16px;left:auto;right:12px;transform:none}.map-toolbar>span:first-child{display:none}.map-guide{top:78px}.map-options{grid-template-columns:1fr}.start-card{max-height:calc(100vh - 30px);overflow:auto}}
@media(max-width:560px){.map-toolbar button{display:none}.rules-options{grid-template-columns:1fr}.ai-kpis{grid-template-columns:repeat(3,1fr)}.map-tooltip{display:none}}
.region-label{font-size:16px;letter-spacing:2px;text-anchor:start;fill:#dbe4e75c}.big-die small{font-size:.58rem;line-height:1;color:#087d70;margin-top:-12px}
.rules-card{max-height:calc(100vh - 32px);overflow:auto}