:root{color-scheme:dark;--bg:#101919;--panel:#192323;--line:#34403b;--gold:#d7ba75;--muted:#9eaaa2;--ink:#eeeade;--blue:#4788a0;--red:#a75245}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.6 system-ui,sans-serif}header{height:95px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 5vw}.brand{display:flex;gap:15px;align-items:center;text-decoration:none;color:var(--ink);letter-spacing:3px;font-weight:700;font-size:20px}.brand small{display:block;font-size:9px;color:var(--gold);letter-spacing:2px}.crest{font-size:34px;color:var(--gold);border:1px solid var(--gold);width:50px;text-align:center}.edition,.eyebrow{font-size:10px;letter-spacing:2px;color:var(--gold);font-weight:700}main{max-width:1500px;margin:auto;padding:35px 5vw}h1,h2,h3{font-family:Georgia,serif;font-weight:400;line-height:1.2}h1{font-size:48px;margin:12px 0 22px}h2{font-size:25px}h3{font-size:20px}p{color:var(--muted)}.intro{padding:24px 0 38px;max-width:770px}.intro h1{font-size:66px}.intro>p:not(.eyebrow){font-size:17px;max-width:630px}.tags{display:flex;gap:25px;font-size:11px;color:var(--gold);margin-top:28px}.panel{padding:24px;border:1px solid var(--line);background:var(--panel)}.panel-title{display:flex;align-items:center;justify-content:space-between}.panel-title>span{color:var(--gold)}.settings{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:18px 0 26px}label{display:block;font-size:11px;color:var(--muted);letter-spacing:.5px}select,input{width:100%;background:#101918;border:1px solid #455047;color:var(--ink);padding:10px;margin-top:6px;border-radius:3px;font:inherit;font-size:14px}button{cursor:pointer;border:1px solid #536054;border-radius:3px;background:#27332e;color:var(--ink);padding:11px 18px;font:inherit}button:hover:not(:disabled){border-color:var(--gold);filter:brightness(1.15)}button:focus-visible{outline:2px solid #fff;outline-offset:2px}button:disabled{opacity:.4;cursor:default}.primary{background:var(--gold);color:#18211c;border-color:var(--gold);font-weight:700}.roster{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:12px}.troop{padding:18px;background:#121c1a;border:1px solid var(--line)}.troop h3{margin:10px 0}.unit-icon{font-size:31px;color:var(--gold)}.price{color:var(--ink);margin:8px 0}.price small{color:var(--muted)}.stats{font-size:10px;border-bottom:1px solid var(--line);padding-bottom:15px}.troop label{margin-top:12px}.muster-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:22px}.brief{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;margin-top:40px}.brief h3{color:var(--gold)}footer{border-top:1px solid var(--line);padding:25px 5vw;font-size:11px;color:var(--gold);letter-spacing:1px;display:flex;justify-content:space-between}footer span{color:var(--muted)}.battle-heading{display:flex;justify-content:space-between;align-items:center}.battle-heading h1{font-size:38px}.round{color:var(--muted);font-size:12px}.round strong{color:var(--gold);font-size:35px;padding:8px}.battle-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:22px}.battlefield{background:#1b2622;border:1px solid var(--line);align-self:start;padding:15px}.field-bar{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;padding:0 0 13px}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}.blue{background:var(--blue)}.red{background:var(--red)}.board{display:grid;grid-template-columns:repeat(24,1fr);aspect-ratio:1;min-width:570px;border:1px solid #52604a;background:#59684d;gap:1px}.board-scroll{overflow:auto}.cell{position:relative;aspect-ratio:1;min-width:0;padding:0;border:0;border-radius:0;background:#68775a;color:#354b35;line-height:1;font-size:18px;display:flex;align-items:center;justify-content:center}.cell:nth-child(3n){background-color:#647356}.cell.wood{background:#3e5b41;color:#233c2a}.cell.hill{background:#8a8963;color:#585d3c}.cell.stream{background:#658d8a;color:#bad2bb}.cell.ditch{background:#6c634c;color:#443e30}.cell.marsh{background:#576e61}.cell.rock{background:#7f8377}.cell.village{background:#978b6c;color:#4d422e}.cell.objective{box-shadow:inset 0 0 0 2px #ead283;color:#f5e4ac}.cell.side0{background:#386f87;color:#f3f3df}.cell.side1{background:#8f493d;color:#f9e8cb}.cell small{position:absolute;font-size:9px;bottom:0;letter-spacing:1px;line-height:1}.cell.spent{opacity:.65}.cell.selected{outline:2px solid white;z-index:2}.cell.reachable{box-shadow:inset 0 0 0 2px #d8dba6;background:#8d9b6d}.cell.target{outline:2px solid #ffd27e;z-index:1}.crown{position:absolute;top:-3px;right:0;font-size:11px;color:#ffe58a}.disordered{position:absolute;top:0;left:1px;color:#fff070;font-size:12px}.legend{display:flex;gap:13px;flex-wrap:wrap;font-size:10px;color:var(--muted);padding-top:15px}aside .panel{margin-bottom:16px;padding:20px}.phases{display:flex;gap:5px;font-size:10px}.phases span{padding:5px;color:#819086}.phases .active{background:#394538;color:var(--gold)}.orders h2{font-size:23px}.orders button{width:100%;margin-top:10px}.hint{font-size:12px;padding-top:16px;border-top:1px solid var(--line)}#unit-details{font-size:11px;color:var(--gold)}.conditions h3{margin:5px 0}.conditions p{margin:5px 0}.conditions strong{float:right;color:var(--gold)}.chronicle div{max-height:240px;overflow:auto;font-size:12px}.chronicle div p{border-bottom:1px solid var(--line);padding-bottom:10px}.bottom-actions{display:flex;gap:10px;margin:20px 0}.result{padding:18px 25px;border:1px solid var(--gold);margin-bottom:22px;background:#30392b}.result h2{color:var(--gold);margin:0}.error{background:#592d29;padding:14px;color:#ffdfd1}dialog{max-width:650px;max-height:85vh;background:var(--panel);color:var(--ink);border:1px solid var(--gold);padding:30px}dialog::backdrop{background:#000a}.close{float:right}@media(max-width:1100px){.battle-layout{grid-template-columns:1fr}aside{display:grid;grid-template-columns:1fr 1fr;gap:15px}.chronicle{grid-column:1/-1}.board{min-width:570px}.edition{display:none}}@media(max-width:650px){main{padding:20px 4vw}.intro h1{font-size:43px}.settings,.brief{grid-template-columns:1fr}.muster-bottom,.panel-title{align-items:start;flex-direction:column}.tags{gap:12px;font-size:9px}.panel{padding:16px}aside{display:block}.battle-heading h1{font-size:28px}.battlefield{padding:8px}footer span{display:none}.brand{font-size:17px}.round{white-space:nowrap}.bottom-actions button{font-size:11px;padding:10px}.roster{grid-template-columns:repeat(2,minmax(0,1fr))}.troop{padding:12px}.troop h3{font-size:17px}}

.sound-controls{display:flex;align-items:center;gap:12px;margin-left:18px}.sound-controls button{font-size:11px;white-space:nowrap;padding:7px 10px}.sound-controls label{display:flex;align-items:center;gap:8px}.sound-controls input{width:75px;margin:0;padding:0;accent-color:var(--gold)}@media(max-width:650px){header{height:auto;min-height:95px;flex-wrap:wrap;gap:12px;padding-top:15px;padding-bottom:15px}.sound-controls{margin-left:0}.sound-controls label{font-size:10px}}
.cell.weapon-range::after{content:"";position:absolute;inset:0;background:rgba(105,203,233,.22);border:1px solid rgba(156,224,245,.55);pointer-events:none}.cell.weapon-range.selected::after{background:transparent}.cell.weapon-range.target::after{border-color:#ffd27e;background:rgba(255,210,126,.12)}.range-key{color:#9ce0f5}.target-key{color:#ffd27e}
.cell.deployment-zone{box-shadow:inset 0 0 0 1px #77b7ce}.cell.deployment-zone:not(.unit){background-color:#4b7374}.cell.deployment-zone.reachable{background-color:#759da0;box-shadow:inset 0 0 0 2px #b8e3eb}
.cell.formation-anchor{outline:3px solid #f8ca62;z-index:3}.cell.formation-anchor::before{content:"◆";position:absolute;top:0;left:1px;color:#ffe19a;font-size:9px;pointer-events:none}#multi[aria-pressed="true"]{border-color:var(--gold);color:var(--gold)}
.pivot-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px}.orders .pivot-controls button{padding:9px 6px;font-size:12px}
.high-scores{margin-top:28px}.score-table{overflow:auto;margin:14px 0}.score-table table{width:100%;border-collapse:collapse}.score-table th,.score-table td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left}.score-table th{color:var(--gold);font-size:10px;letter-spacing:1px;text-transform:uppercase}.score-table td:nth-child(1),.score-table td:nth-child(7),.score-table td:nth-child(8){text-align:right}.score-table td:nth-child(3),.score-table td:nth-child(4),.score-table td:nth-child(5),.score-table td:nth-child(6){white-space:nowrap}.arcade-score{display:flex;gap:24px;align-items:baseline}.arcade-score strong{font:700 30px Georgia,serif;color:var(--gold)}.save-score{display:flex;align-items:end;gap:10px;max-width:520px;margin:16px 0}.save-score label{flex:1}.save-score input{margin-bottom:0}.save-score button{white-space:nowrap}
.battlefield-leaderboards{margin-top:28px;padding-top:22px;border-top:1px solid var(--line)}.battlefield-leaderboards h3{margin:4px 0 0;font:700 24px Georgia,serif;color:var(--paper)}.battlefield-score-intro{margin:7px 0 16px;color:var(--muted)}.battlefield-score-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:12px}.battlefield-score-card{min-width:0;padding:14px;background:#0b1412b8;border:1px solid var(--line);box-shadow:inset 0 1px #ffffff0a}.battlefield-score-card h4{min-height:2.4em;margin:0 0 9px;color:var(--gold);font:700 16px/1.2 Georgia,serif}.battlefield-score-card table{width:100%;border-collapse:collapse;font-size:12px}.battlefield-score-card th,.battlefield-score-card td{padding:6px 5px;border-bottom:1px solid #ffffff12;text-align:left}.battlefield-score-card th{color:var(--muted);font-size:9px;letter-spacing:.08em;text-transform:uppercase}.battlefield-score-card th:nth-child(1),.battlefield-score-card td:nth-child(1),.battlefield-score-card th:nth-child(n+3),.battlefield-score-card td:nth-child(n+3){text-align:right}.battlefield-score-card tbody tr:first-child td{color:#f2cf78;font-weight:700}.battlefield-score-card .hint{margin:10px 0 2px}
.troop-squares{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;width:76%;padding-bottom:5px;pointer-events:none;z-index:1}.fighter-square{display:block;aspect-ratio:1;background:#e5f2f4;border:1px solid #143c51;min-width:0}.side1 .fighter-square{background:#f4d8c3;border-color:#612f28}.fighter-square.leader-square{background:#f3cc69;border-color:#7a5817;color:#48380c;font-size:7px;line-height:1;display:flex;align-items:center;justify-content:center}.strength-track{position:absolute;bottom:0;font-size:8px;line-height:1;letter-spacing:1px;pointer-events:none}.leader-key{color:#f3cc69}
.cell.side0{--troop-fill:#e5f2f4}.cell.side1{--troop-fill:#f4d8c3}.map-orders{margin-top:18px;text-align:left}.map-orders>button,.map-orders>form>button{width:100%;margin-top:10px}.map-chronicle{margin-top:18px;text-align:left}.map-chronicle div{max-height:220px}

/* Keep battlefield orders compact and on one wrapping control row. */
.map-orders>form{display:inline-flex;margin:4px 6px 0 0;vertical-align:top}
.map-orders>.pivot-controls{display:inline-flex;gap:6px;margin:4px 6px 0 0;vertical-align:top}
.map-orders>button,.map-orders>form>button,.map-orders .pivot-controls button{width:auto;margin:0;padding:6px 10px;min-height:32px;font-size:11px;line-height:1.2}
.map-orders>button{margin:4px 6px 0 0;vertical-align:top}
.objective-flag{position:absolute;right:2px;top:2px;z-index:5;font-size:18px;line-height:1;color:#f5e4ac;text-shadow:0 1px 2px #000,0 0 3px #000}
.objective-flag.player-held{color:#55b8e3}.objective-flag.enemy-held{color:#e75b4e}
.battle-layout{grid-template-columns:minmax(0,1fr)}
.full-width-conditions{width:100%;margin-top:22px}
.battlefield{position:relative}
.result-overlay{position:absolute;inset:0;z-index:100;display:flex;align-items:flex-start;justify-content:center;padding:clamp(70px,10vh,130px) 20px 30px;background:rgba(5,10,9,.68);backdrop-filter:blur(2px)}
.result-overlay .result{width:min(620px,calc(100% - 20px));max-height:calc(100% - 30px);overflow:auto;margin:0;padding:28px;text-align:center;background:rgba(28,38,32,.97);box-shadow:0 18px 55px #000;border:2px solid var(--gold)}
.result-overlay .result h2{font-size:clamp(30px,5vw,52px)}
.result-overlay .new-game-button{min-width:220px;margin-top:10px;font-size:16px}
.result-overlay .save-score{margin:16px auto;text-align:left}
.health-key{display:inline-block;width:12px;height:4px;margin-right:2px;vertical-align:middle}.health-key.full{background:#45d46a}.health-key.strong{background:#b9d84b}.health-key.weak{background:#ef9a35}.health-key.critical{background:#e3483f}

/* Photorealistic troop portraits used by every muster roster. */
.troop{overflow:hidden}
.roster-portrait{width:calc(100% + 36px);margin:-18px -18px 14px;aspect-ratio:1.35;background-image:url('assets/troop-selection-atlas.png');background-size:300% 300%;background-repeat:no-repeat;background-color:#27352f;border-bottom:1px solid #59685d;box-shadow:inset 0 -24px 24px -24px #000}
.cultural-unit-portrait{background-repeat:no-repeat;background-color:#27352f}
.portrait-spear{background-position:0 0}.portrait-bow{background-position:50% 0}.portrait-warrior{background-position:100% 0}
.portrait-horse{background-position:0 50%}.portrait-knight{background-position:50% 50%}.portrait-crossbow{background-position:100% 50%}
.portrait-longbow{background-position:0 100%}.portrait-bill{background-position:50% 100%}.portrait-pike{background-position:100% 100%}
@media(max-width:650px){.roster-portrait{width:calc(100% + 24px);margin:-12px -12px 10px}}
/* Culture-specific Early Medieval selection portraits. */
.roster-portrait[class*="portrait-early-"]{background-image:url('assets/early-troop-selection-atlas.png')}
.portrait-early-spear{background-position:0 0}.portrait-early-bow{background-position:50% 0}.portrait-early-horse{background-position:100% 0}
.portrait-early-housecarl{background-position:0 50%}.portrait-early-frankish{background-position:50% 50%}.portrait-early-norse{background-position:100% 50%}
.portrait-early-byzantine{background-position:0 100%}.portrait-early-rus{background-position:50% 100%}.portrait-early-byzantine-horse{background-position:100% 100%}
.culture-portrait{display:block;width:190px;min-width:190px;height:132px;background-image:url('assets/high-late-culture-atlas.png');background-size:400% 400%;background-repeat:no-repeat;background-color:#27352f}.culture-banner{grid-column:1/-1;display:flex;align-items:center;gap:24px;overflow:hidden;border:1px solid #59685d;background:#101918}.culture-banner>span:last-child{display:grid;gap:2px}.culture-banner small,.culture-banner em{color:var(--gold);font-size:10px;letter-spacing:1.5px;text-transform:uppercase}.culture-banner strong{font:400 30px/1.15 Georgia,serif}.culture-banner em{color:var(--muted);font-style:normal}
.portrait-culture-high-english{background-position:0 0}.portrait-culture-high-french{background-position:33.333% 0}.portrait-culture-high-german{background-position:66.667% 0}.portrait-culture-high-iberian{background-position:100% 0}
.portrait-culture-high-italian{background-position:0 33.333%}.portrait-culture-high-byzantine{background-position:33.333% 33.333%}.portrait-culture-high-rus{background-position:66.667% 33.333%}.portrait-culture-late-ottoman{background-position:100% 33.333%}
.portrait-culture-late-english{background-position:0 66.667%}.portrait-culture-late-french{background-position:33.333% 66.667%}.portrait-culture-late-scottish{background-position:66.667% 66.667%}.portrait-culture-late-swiss{background-position:100% 66.667%}
.portrait-culture-late-german{background-position:0 100%}.portrait-culture-late-italian{background-position:33.333% 100%}.portrait-culture-late-iberian{background-position:66.667% 100%}.portrait-culture-late-balkan{background-position:100% 100%}

.unit-history-trigger{display:block;width:calc(100% + 36px);margin:-18px -18px 0;padding:0 18px 10px;text-align:left;border:0;border-radius:0;background:transparent;color:inherit}
.unit-history-trigger:hover{background:#1b2925;filter:none!important}.unit-history-trigger:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.unit-history-trigger .roster-portrait{display:block}.unit-history-trigger h3{margin:10px 0 2px}.unit-history-trigger small{color:var(--gold);font-size:10px;letter-spacing:.7px;text-transform:uppercase}
.unit-history{width:min(620px,92vw)}.unit-history h2{font-size:34px;margin:8px 0}.unit-history h3{color:var(--gold);margin-bottom:5px}.history-meta{color:var(--gold);font-size:11px;letter-spacing:1px;text-transform:uppercase}.unit-history ul{color:var(--muted);padding-left:20px}.history-link{display:inline-block;margin-top:12px;padding:10px 14px;border:1px solid var(--gold);border-radius:3px;color:var(--gold);text-decoration:none;font-weight:700}.history-link:hover{background:var(--gold);color:#18211c}
@media(max-width:650px){.unit-history-trigger{width:calc(100% + 24px);margin:-12px -12px 0;padding:0 12px 8px}}
@media(max-width:650px){.culture-portrait{width:128px;min-width:128px;height:96px}.culture-banner{gap:14px}.culture-banner strong{font-size:23px}}
.culture-portrait[class*="portrait-early-"]{background-image:url('assets/early-troop-selection-atlas.png');background-size:300% 300%}
.culture-inset{position:absolute;right:8px;bottom:8px;width:52px;height:52px;border:2px solid #d7ba75;border-radius:50%;background-image:url('assets/high-late-culture-atlas.png');background-size:400% 400%;background-repeat:no-repeat;background-color:#1a2420;box-shadow:0 3px 10px #000c}.culture-inset[class*="portrait-early-"]{background-image:url('assets/early-troop-selection-atlas.png');background-size:300% 300%}