@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
.online-status{margin-top:16px;padding:14px 18px;border:1px solid #c9ae77;border-radius:8px;background:#1b3933;color:#f2e9d7;font-size:14px;line-height:1.5}.online-status #invitePanel{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.online-status input{flex:1;min-width:160px;padding:8px;background:#102724;border:1px solid #879f8f;border-radius:5px;color:#fff}.online-status button{padding:8px 12px;border:1px solid #c9ae77;border-radius:5px;background:#dfc17f;color:#1b3028;font-weight:700}
.roll-button{width:100%;margin-top:14px;padding:11px 13px;border:1px solid #e5c77f;border-radius:6px;background:#d8b975;color:#19312a;font-weight:700;display:flex;justify-content:space-between;align-items:center}.roll-button:hover:not(:disabled){background:#f0d18d}.roll-button:disabled,.end-button:disabled{opacity:.5;cursor:not-allowed}.card:disabled{opacity:.55;cursor:not-allowed;transform:none}
.setup-dialog{width:min(440px,calc(100% - 32px));border:1px solid #a5a77c;border-radius:14px;padding:36px;color:#e7eee8;background:radial-gradient(circle at top,#355045,#1c322d 80%);box-shadow:0 30px 100px #000a}.setup-dialog::backdrop{background:#071511d9}.setup-dialog h2{font:700 30px 'Space Grotesk',sans-serif;margin:10px 0}.setup-dialog p{font-size:14px;line-height:1.6;color:#bfd0c3;margin:0 0 26px}.setup-dialog label{display:block;font-size:12px;font-weight:700;letter-spacing:.05em;color:#ebd29a;margin-bottom:9px}.setup-dialog select{width:100%;padding:13px;background:#29443b;border:1px solid #758d73;border-radius:6px;color:#fff;font:600 15px 'DM Sans',sans-serif}.setup-actions{display:flex;gap:10px;margin-top:26px}.setup-actions .end-button{flex:1}.setup-cancel{padding:12px 17px;border:1px solid #708779;border-radius:6px;background:#29443b;color:#e4eee7}.setup-cancel:hover{background:#3a594d}
.setup-dialog label:not(:first-child){margin-top:16px}
.setup-dialog{max-height:calc(100vh - 32px);overflow:auto}
.battle-effects{position:absolute;inset:0;pointer-events:none;z-index:2}.effect-toast{position:absolute;top:4%;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 40px);padding:10px 16px;border:1px solid #dfc684;border-radius:7px;background:#17322fea;color:#f7eacf;text-align:center;font-size:13px;font-weight:700;line-height:1.4;box-shadow:0 8px 25px #0007;animation:effect-appear .25s ease-out}.effect-toast.hit{border-color:#f2a48d;color:#ffe1d8}.effect-toast.shield{border-color:#a8c9e6;color:#e2f3ff}.effect-float{position:absolute;transform:translate(-50%,-50%);color:#ffe1d2;text-shadow:0 2px 8px #112;font:700 20px 'Space Grotesk',sans-serif;animation:effect-float .9s ease-out forwards}.effect-float.item{color:#f6d588}.effect-float.shield{color:#b9dfff}.hex .unit-used{font:700 11px 'DM Sans',sans-serif;fill:#ffe2a5;stroke:#152e2a;stroke-width:3;paint-order:stroke fill;text-anchor:middle;pointer-events:none}.hex.effect-hit polygon{stroke:#faac91;stroke-width:4;filter:brightness(1.55)}.hex.effect-shield polygon{stroke:#b5dffe;stroke-width:4;filter:brightness(1.25)}.hex.effect-item polygon{stroke:#f5d78d;stroke-width:4;filter:brightness(1.3)}.hex.effect-lunge polygon{animation:effect-attack .38s ease-out}.hex.effect-lunge .unit-disc,.hex.effect-lunge .unit-icon{animation:effect-lunge .38s ease-out}@keyframes effect-appear{from{opacity:0;transform:translate(-50%,-8px)}to{opacity:1;transform:translate(-50%,0)}}@keyframes effect-float{from{opacity:0;transform:translate(-50%,-25%)}30%{opacity:1}to{opacity:0;transform:translate(-50%,-165%)}}@keyframes effect-lunge{50%{transform:translate(var(--lunge-x),var(--lunge-y))}}@keyframes effect-attack{50%{filter:brightness(1.4)}}@media(prefers-reduced-motion:reduce){.effect-toast,.effect-float,.hex.effect-lunge polygon,.hex.effect-lunge .unit-disc,.hex.effect-lunge .unit-icon{animation:none!important}.effect-float{opacity:1}}
.board-wrap.isometric:before{border:0;background:radial-gradient(ellipse,#061b1680 0,transparent 68%);transform:scaleY(.66)}.board-wrap.isometric .hex .tile-bottom{fill:#102a27;stroke:none}.board-wrap.isometric .hex .tile-side{stroke:none;fill:#24473d}.board-wrap.isometric .hex .tile-side.side-left{fill:#19372f}.board-wrap.isometric .hex.home-blue .tile-side{fill:#274d5b}.board-wrap.isometric .hex.home-red .tile-side{fill:#593d37}.board-wrap.isometric .hex .tile-top{fill:#426e60;stroke:#86a798;stroke-width:1.5}.board-wrap.isometric .hex.alt .tile-top{fill:#3a6558}.board-wrap.isometric .hex.home-blue .tile-top{fill:#456d79}.board-wrap.isometric .hex.home-red .tile-top{fill:#795f55}.board-wrap.isometric .hex.valid .tile-top{fill:#658267;stroke:#efd78e;stroke-width:2.5}.board-wrap.isometric .hex:hover .tile-top{fill:#6a8d77;stroke:#eed490;stroke-width:2.5}.board-wrap.isometric .hex.selected-tile .tile-top{stroke:#ffdc8d;stroke-width:3.5}.board-wrap.isometric .hex.effect-hit .tile-top{stroke:#ffb59b;filter:brightness(1.55)}.board-wrap.isometric .hex.effect-shield .tile-top{stroke:#b6e0ff;filter:brightness(1.3)}.board-wrap.isometric .hex.effect-item .tile-top{stroke:#f9df99;filter:brightness(1.35)}.tile-content .unit-shadow{fill:#0d251e;opacity:.65}.tile-content .unit-icon{fill:#fff}.tile-content .item-bg{fill:#dfc286;opacity:.28}.tile-content .coord{fill:#c5d3bb;opacity:.52}.top-actions #viewButton .view-icon{margin-left:8px;color:#e6c982}@media(max-width:650px){.top-actions{gap:8px}.top-actions #viewButton .view-label{display:none}.top-actions #viewButton .view-icon{display:inline;margin-left:0;font-size:22px}}
:root{font-family:'DM Sans',sans-serif;color:#e9eee7;background:#0e201f;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% -15%,#24423e 0,transparent 47%),#0e201f;min-height:100vh}button{font:inherit;cursor:pointer}button:focus-visible,.hex:focus-visible{outline:3px solid #e6c982;outline-offset:3px}.app{max-width:1600px;margin:auto;padding:0 32px}.masthead{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff16}.brand{display:flex;align-items:center;gap:15px}.brand-mark{font-size:57px;line-height:1;color:#e3be74}.eyebrow,.section-title,.player-label,.page-footer{font-size:11px;letter-spacing:.18em;font-weight:700}.eyebrow{color:#c9ae77}.brand h1{font-family:'Space Grotesk',sans-serif;font-size:28px;letter-spacing:.12em;line-height:1;margin:6px 0 0}.top-actions{display:flex;gap:22px}.text-button{border:0;color:#d3ddd6;background:none;padding:10px 0;font-size:13px}.text-button span{color:#c9ae77;margin-left:8px}.text-button:hover{color:#f5d797}.layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:24px;padding-top:25px}.arena-panel{background:#142c29;border:1px solid #ffffff17;border-radius:12px;overflow:hidden;align-self:start;box-shadow:0 20px 70px #0003}.scorebar{height:107px;display:flex;align-items:center;justify-content:space-between;padding:20px 35px;border-bottom:1px solid #ffffff16;background:#ffffff04}.score-side{min-width:170px}.score-side.red{text-align:right}.score-side.blue .player-label{color:#8dbbe2}.score-side.red .player-label{color:#e99d88}.score-number{font-family:'Space Grotesk',sans-serif;font-size:32px;font-weight:700;margin-top:7px;line-height:1}.score-number small{font:500 12px 'DM Sans',sans-serif;color:#91a9a1;margin-left:5px}.turn-center{text-align:center}.turn-center #turnLabel{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:700;margin:5px 0}.small-muted{color:#8da49d;font-size:12px}.board-scroll{overflow-x:auto;background:radial-gradient(ellipse at 50% 48%,#30554c 0%,#213d37 58%,#1a332f 100%);scrollbar-color:#688b78 transparent}.board-wrap{min-width:700px;max-width:1060px;margin:auto;position:relative}.board-wrap:before{content:"";position:absolute;inset:24px;pointer-events:none;border:1px solid #ffffff0d;border-radius:50%}#board{display:block;width:100%;height:auto}.board-footer{min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 30px;border-top:1px solid #ffffff16;color:#9eb6ac;font-size:11px}.board-footer strong{color:#e0c184}.legend-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.blue-dot{background:#8ebce0}.red-dot{background:#eaa08c}.sidebar{display:flex;flex-direction:column;gap:14px}.sidebar>section{border:1px solid #ffffff19;border-radius:10px;background:#172e2b;padding:20px}.section-title{display:flex;align-items:center;justify-content:space-between;color:#a9bbad}.mini-badge{background:#33544b;border:1px solid #597568;border-radius:5px;padding:3px 6px;color:#e7d4a3}.turn-card{background:linear-gradient(135deg,#264439,#19322e)!important}.turn-card h2{font-family:'Space Grotesk',sans-serif;font-size:24px;margin:13px 0 3px}.turn-card p{font-size:13px;color:#b6c7bc;margin:0}.action-pips{display:flex;gap:6px;margin:15px 0 19px}.action-pips i{width:34px;height:5px;background:#e4c17b;border-radius:5px}.action-pips i.spent{background:#577067}.end-button{width:100%;padding:12px 16px;background:#dbba78;border:1px solid #edcf93;border-radius:6px;color:#182b27;font-weight:700;text-align:left;display:flex;justify-content:space-between;align-items:center;transition:background .15s}.end-button:hover{background:#f1d494}.hand-section{min-height:295px}.section-hint{font-size:12px;color:#8fa9a0;margin:9px 0 14px}.hand{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.card{position:relative;text-align:left;border:1px solid #536c61;border-radius:7px;background:#29453d;color:#eaf0e8;padding:10px;min-height:82px;transition:transform .15s,border-color .15s,background .15s}.card:hover{transform:translateY(-2px);border-color:#d7bb7c}.card.selected{border-color:#f0d28c;background:#3e5846;box-shadow:0 0 0 1px #e4c77a}.card .card-top{display:flex;justify-content:space-between;align-items:center}.card .symbol{font-size:23px;line-height:1}.card .card-kind{font-size:9px;letter-spacing:.13em;color:#b5cbb7;text-transform:uppercase}.card strong{display:block;font-size:12px;margin-top:9px}.card .stats{font-size:10px;color:#b0c7b8;margin-top:4px}.card.supply{background:#394133}.card.terrain{background:#35413b}.detail-content{font-size:13px;line-height:1.55;color:#c2d1c6;margin-top:13px;min-height:36px}.detail-content strong{color:#f0d69d}.log{margin-top:12px;max-height:114px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;color:#afc2b7;font-size:11px;line-height:1.4}.log div{border-left:2px solid #628172;padding-left:9px}.log div:first-child{border-color:#dfbd79;color:#e7eee6}.page-footer{padding:25px 0 32px;text-align:center;color:#718d82;font-size:9px}.page-footer span{padding:0 10px;color:#d4b676}.hex{cursor:pointer}.hex polygon{stroke:#668377;stroke-width:1.6;fill:#35584e;transition:fill .15s,stroke .15s}.hex.alt polygon{fill:#305249}.hex.home-blue polygon{fill:#355d62}.hex.home-red polygon{fill:#62534c}.hex:hover polygon{fill:#4f7563;stroke:#e8d18f;stroke-width:2.5}.hex.valid polygon{fill:#537356;stroke:#e3cd88;stroke-width:2.5}.hex.valid:hover polygon{fill:#748968}.hex.selected-tile polygon{stroke:#ffdb89;stroke-width:3.5}.hex .coord{font:500 10px 'DM Sans',sans-serif;fill:#a5b9a7;opacity:.34;pointer-events:none}.hex.valid .coord{opacity:0}.hex .item-icon{font-size:29px;text-anchor:middle;dominant-baseline:central;pointer-events:none}.hex .item-bg{fill:#d6bd80;opacity:.2;pointer-events:none}.hex .unit-disc{stroke-width:3;pointer-events:none}.hex .unit-disc.blue{fill:#37627d;stroke:#9cc9e7}.hex .unit-disc.red{fill:#945949;stroke:#f0ab95}.hex .unit-icon{text-anchor:middle;dominant-baseline:central;font-size:25px;pointer-events:none}.hex .unit-hp{font:700 10px 'DM Sans',sans-serif;fill:#fff;text-anchor:middle;pointer-events:none}.hex .unit-status{font:700 12px 'DM Sans',sans-serif;fill:#ffde91;text-anchor:middle;pointer-events:none}.hex .glow{fill:none;stroke:#e6d088;stroke-width:2;stroke-dasharray:4 4;pointer-events:none}.overlay{position:fixed;inset:0;z-index:10;background:#081714e8;display:grid;place-items:center;padding:20px}.hidden{display:none!important}.modal{width:min(100%,430px);padding:42px;text-align:center;border:1px solid #9b9b7060;border-radius:14px;background:radial-gradient(circle at top,#355045,#1c322d 75%);box-shadow:0 30px 100px #0009}.modal-emblem{color:#d8b976;font-size:62px;line-height:1;margin-bottom:16px}.modal h2,.rules-dialog h2{font-family:'Space Grotesk',sans-serif;font-size:32px;margin:10px 0}.modal p{color:#b5c9bd;font-size:14px;line-height:1.6;margin:12px 0 30px}.rules-dialog{width:min(690px,calc(100% - 32px));max-height:calc(100vh - 40px);overflow:auto;border:1px solid #61776a;border-radius:13px;padding:30px;color:#e7eee8;background:#1b332e;box-shadow:0 30px 100px #000a}.rules-dialog::backdrop{background:#071511c9}.rules-header{display:flex;justify-content:space-between;align-items:center}.close-button{background:none;border:0;color:#f2d28b;font-size:30px;line-height:1}.rules-dialog>p,.rules-dialog .rules-grid p{font-size:13px;line-height:1.65;color:#bcd0c1}.rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:24px 0}.rules-grid>div{background:#29433b;padding:16px;border-radius:6px}.rules-grid h3{font-size:12px;letter-spacing:.08em;color:#e9ca88;margin:0 0 8px}.rules-grid p{margin:0}.rules-foot{border-top:1px solid #ffffff20;padding-top:17px}@media(max-width:1100px){.layout{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:1fr 1fr}.log-section{grid-column:span 2}.hand-section{grid-row:span 2}.board-wrap{max-width:1000px}}@media(max-width:650px){.app{padding:0 12px}.masthead{height:76px}.brand-mark{font-size:41px}.brand h1{font-size:19px}.brand .eyebrow{font-size:8px}.top-actions{gap:10px}.text-button{font-size:11px}.text-button span{display:none}.layout{padding-top:12px;gap:12px}.scorebar{height:92px;padding:12px}.score-side{min-width:0}.player-label{font-size:8px;letter-spacing:.05em}.score-number{font-size:24px}.score-number small{font-size:9px;display:block;margin:4px 0 0}.turn-center #turnLabel{font-size:14px}.turn-center .eyebrow{font-size:8px}.board-footer{padding:10px 12px;flex-wrap:wrap;font-size:10px}.sidebar{display:flex}.sidebar>section{padding:16px}.hand-section{min-height:0}.rules-grid{grid-template-columns:1fr}.page-footer{font-size:8px;line-height:1.7}}