/* ============ WARLORD'S FATE — ink & parchment UI ============ */
:root{
  --parch:#e8d9b5; --parch2:#dcc79a; --ink:#241a10; --ink2:#3a2c1c;
  --wood:#1d1410; --wood2:#2b1f16; --bronze:#a8874f; --bronze2:#c8a869;
  --seal:#a02c20; --gold:#d8b25f; --green:#6fa06a; --blue:#5b7fb4;
  --panel:#171009ee; --panel-line:#5a4527;
  --serif:'Noto Serif SC','Songti SC',Georgia,serif;
  --disp:'Cinzel','Noto Serif SC',serif;
  --brush:'Ma Shan Zheng','Noto Serif SC',cursive;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;overflow:hidden;background:#0d0906}
body{font-family:var(--serif);color:var(--parch);font-size:14px;-webkit-font-smoothing:antialiased}
.hidden{display:none!important}
#app{position:relative;width:100vw;height:100vh;overflow:hidden}

canvas#gl{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab}
canvas#gl.picking{cursor:pointer}
#labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}

/* ---------- screens ---------- */
.screen{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:50}
#title-screen{background:
  radial-gradient(1200px 700px at 70% 15%, rgba(216,178,95,.13), transparent 60%),
  radial-gradient(900px 600px at 20% 85%, rgba(160,44,32,.12), transparent 60%),
  linear-gradient(180deg,#12100c 0%, #191209 40%, #0d0906 100%)}
.title-ink{position:absolute;inset:0;opacity:.5;background:
  radial-gradient(600px 300px at 78% 30%, rgba(232,217,181,.07), transparent 70%),
  radial-gradient(500px 260px at 12% 60%, rgba(232,217,181,.05), transparent 70%)}
.title-inner{position:relative;text-align:center;max-width:760px;padding:30px;z-index:2}
.title-seal{position:absolute;top:-8px;right:-30px;width:96px;height:96px;border:3px solid var(--seal);
  color:var(--seal);font-family:var(--brush);font-size:30px;line-height:1.05;display:flex;align-items:center;justify-content:center;
  transform:rotate(6deg);border-radius:10px;background:rgba(160,44,32,.08);box-shadow:0 0 24px rgba(160,44,32,.35), inset 0 0 18px rgba(160,44,32,.25);opacity:.92}
.game-title{font-family:var(--disp);font-weight:900;font-size:64px;letter-spacing:.14em;color:var(--parch);
  text-shadow:0 2px 0 #000,0 0 42px rgba(216,178,95,.28);margin-bottom:6px}
.game-subtitle{font-size:17px;color:var(--gold);letter-spacing:.34em;margin-bottom:22px;font-weight:600}
.title-tag{color:#cdbb93;line-height:1.75;margin-bottom:30px;font-size:15px}
.title-menu{display:flex;flex-direction:column;gap:11px;align-items:center}
.title-foot{margin-top:36px;color:#7d6c4e;font-size:12px;letter-spacing:.12em}

/* ---------- buttons ---------- */
.btn{font-family:var(--disp);letter-spacing:.09em;font-size:14px;color:var(--parch);
  background:linear-gradient(180deg,#33261a,#211709);border:1px solid var(--panel-line);
  padding:11px 26px;border-radius:4px;cursor:pointer;min-width:280px;transition:.16s;position:relative}
.btn:hover{border-color:var(--bronze2);color:#fff;box-shadow:0 0 18px rgba(200,168,105,.22);transform:translateY(-1px)}
.btn-primary{border-color:var(--seal);background:linear-gradient(180deg,#5d2018,#38120c);color:#f5e6c8}
.btn-primary:hover{box-shadow:0 0 22px rgba(160,44,32,.5)}
.btn.small{min-width:0;padding:7px 14px;font-size:12px}
.btn:disabled{opacity:.4;cursor:default;transform:none}

/* ---------- setup / faction pick ---------- */
.setup-scroll,.end-scroll{max-height:92vh;overflow-y:auto;width:min(1060px,94vw);
  background:linear-gradient(180deg,#20170e 0%,#170f08 100%);
  border:1px solid var(--panel-line);border-radius:10px;padding:28px 34px;
  box-shadow:0 30px 80px rgba(0,0,0,.7), inset 0 0 80px rgba(0,0,0,.5)}
.panel-title{font-family:var(--disp);font-size:26px;letter-spacing:.12em;color:var(--gold);margin-bottom:18px;text-align:center}
.panel-title .cn{font-family:var(--brush);color:var(--seal);margin-left:10px;font-size:24px}
.setup-section{margin-bottom:20px}
.setup-section h3{color:var(--bronze2);letter-spacing:.14em;font-size:14px;font-weight:600;margin-bottom:10px;border-bottom:1px solid #3a2c18;padding-bottom:5px}
.cn-small{font-family:var(--brush);opacity:.75;font-size:13px;margin-left:6px}
.choice-row{display:flex;flex-wrap:wrap;gap:8px}
.choice-row.small{gap:6px}
.choice{padding:8px 14px;border:1px solid var(--panel-line);border-radius:4px;cursor:pointer;background:#1d150c;font-size:13px;transition:.15s}
.choice:hover{border-color:var(--bronze2)}
.choice.sel{border-color:var(--seal);background:linear-gradient(180deg,#4a1c14,#2a100a);color:#f2dfba;box-shadow:0 0 12px rgba(160,44,32,.4)}
.hint-box{margin-top:10px;color:#c9b68d;font-size:12.5px;line-height:1.65;min-height:38px;padding:9px 12px;background:#140e07;border-left:3px solid var(--bronze);border-radius:2px}
.setup-columns{display:grid;grid-template-columns:1fr 1.2fr;gap:26px}
.setup-section label{display:flex;align-items:center;gap:10px;margin-bottom:10px;color:#cdbb93;font-size:13px}
.setup-section input[type=text],.setup-section select{flex:1;background:#120c06;border:1px solid var(--panel-line);color:var(--parch);padding:7px 10px;border-radius:3px;font-family:var(--serif);font-size:14px}
.setup-section input[type=color]{width:52px;height:30px;background:none;border:1px solid var(--panel-line);border-radius:3px;padding:2px;cursor:pointer}
.city-list,.faction-grid{display:flex;flex-wrap:wrap;gap:7px;max-height:180px;overflow-y:auto;padding-right:6px}
.faction-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));max-height:56vh}
.faction-card{border:1px solid var(--panel-line);border-radius:6px;padding:12px 14px;cursor:pointer;background:#191108;transition:.15s;position:relative;overflow:hidden}
.faction-card:hover{transform:translateY(-2px);border-color:var(--bronze2)}
.faction-card.sel{border-color:var(--gold);box-shadow:0 0 16px rgba(216,178,95,.3)}
.faction-card .fc-banner{position:absolute;left:0;top:0;bottom:0;width:5px}
.faction-card h4{font-size:16px;margin-bottom:3px;letter-spacing:.04em}
.faction-card .fc-leader{color:var(--gold);font-size:12.5px;margin-bottom:6px}
.faction-card p{font-size:11.5px;color:#b3a17c;line-height:1.55}
.fc-cities{margin-top:6px;font-size:11px;color:#8d7c5c}
.setup-actions{display:flex;gap:14px;justify-content:center;margin-top:22px}

/* ---------- HUD top ---------- */
#game-screen{z-index:10}
#hud-top{position:absolute;top:0;left:0;right:0;height:46px;display:flex;align-items:center;gap:8px;padding:0 12px;z-index:30;
  background:linear-gradient(180deg,rgba(13,9,5,.94) 0%,rgba(13,9,5,.82) 70%,transparent);
  border-bottom:1px solid rgba(90,69,39,.35)}
.hud-block{display:flex;align-items:center;gap:6px;background:rgba(23,16,9,.72);border:1px solid rgba(90,69,39,.5);
  padding:4px 11px;border-radius:3px;font-size:13.5px;white-space:nowrap}
.hud-block b{font-size:14.5px;letter-spacing:.03em}
.res-ico{opacity:.85;font-size:13px}
.delta{font-size:11px;color:#9aa87a}
.delta.neg{color:#c96a5a}
.hud-date b{color:var(--gold);letter-spacing:.05em}
.hud-date span{color:#a5946f;font-size:11px;margin-right:7px;letter-spacing:.1em;text-transform:uppercase}
.legit b{color:#d8845f}
.hud-spacer{flex:1}
.icon-btn{background:rgba(23,16,9,.8);border:1px solid var(--panel-line);color:var(--parch);border-radius:3px;
  width:32px;height:32px;cursor:pointer;font-size:15px;transition:.15s;pointer-events:auto}
.icon-btn:hover{border-color:var(--bronze2);color:#fff}
#btn-endturn{font-family:var(--disp);font-weight:700;letter-spacing:.1em;color:#f5e6c8;font-size:13.5px;cursor:pointer;
  background:linear-gradient(180deg,#7c2a1e 0%,#4c170e 100%);border:1px solid #b0552f;border-radius:4px;padding:8px 22px;transition:.18s;
  box-shadow:0 0 0 rgba(160,44,32,0)}
#btn-endturn:hover{box-shadow:0 0 24px rgba(192,74,42,.55);transform:translateY(-1px)}
#btn-endturn.busy{opacity:.5;pointer-events:none}

/* ---------- left objective ---------- */
#hud-left{position:absolute;top:56px;left:12px;z-index:25;max-width:290px}
.mini-note{background:rgba(23,16,9,.78);border:1px solid rgba(90,69,39,.5);border-left:3px solid var(--gold);
  border-radius:3px;padding:9px 12px;font-size:12px;line-height:1.6;color:#d6c49b;backdrop-filter:blur(3px)}

/* ---------- tabs & panel ---------- */
#tab-bar{position:absolute;bottom:0;left:0;right:0;height:44px;display:flex;justify-content:center;gap:4px;z-index:30;
  background:linear-gradient(0deg,rgba(13,9,5,.95) 0%,rgba(13,9,5,.75) 70%,transparent);padding-top:10px}
.tab-btn{font-family:var(--serif);font-size:13px;letter-spacing:.06em;color:#bda87e;background:rgba(23,16,9,.7);
  border:1px solid rgba(90,69,39,.5);border-bottom:none;border-radius:6px 6px 0 0;padding:7px 16px 12px;cursor:pointer;transition:.15s}
.tab-btn:hover{color:var(--parch);border-color:var(--bronze2)}
.tab-btn.active{color:#ffe9bd;background:linear-gradient(180deg,#33241a,#241a10);border-color:var(--bronze);box-shadow:0 -4px 14px rgba(0,0,0,.4)}
#side-panel{position:absolute;top:52px;bottom:48px;right:0;width:min(430px,44vw);z-index:28;display:flex;flex-direction:column;
  background:linear-gradient(180deg,rgba(20,14,8,.97),rgba(14,9,5,.97));border-left:1px solid var(--panel-line);
  box-shadow:-18px 0 40px rgba(0,0,0,.5)}
.panel-close{position:absolute;top:8px;right:8px;z-index:2}
#panel-content{overflow-y:auto;padding:16px;flex:1}
#panel-content::-webkit-scrollbar,.city-list::-webkit-scrollbar,.setup-scroll::-webkit-scrollbar{width:8px}
#panel-content::-webkit-scrollbar-thumb,.city-list::-webkit-scrollbar-thumb{background:#3a2c18;border-radius:4px}
.panel-h{font-family:var(--disp);font-size:17px;color:var(--gold);letter-spacing:.08em;margin-bottom:10px;border-bottom:1px solid #3a2c18;padding-bottom:6px}
.sub-h{color:var(--bronze2);font-size:12.5px;letter-spacing:.12em;margin:14px 0 7px;font-weight:600}

/* general card */
.gen-card{display:flex;gap:11px;background:#1a130a;border:1px solid #3a2c18;border-radius:6px;padding:10px;margin-bottom:9px;cursor:pointer;transition:.15s;position:relative}
.gen-card:hover{border-color:var(--bronze2);background:#221809}
.gen-portrait{width:58px;height:58px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--brush);font-size:26px;color:#fff;text-shadow:0 1px 3px #000;border:2.5px solid;box-shadow:inset 0 0 16px rgba(0,0,0,.55)}
.gen-info{flex:1;min-width:0}
.gen-name{font-size:15px;color:#f0dfba;letter-spacing:.04em}
.gen-name .age{color:#8d7c5c;font-size:11.5px;margin-left:6px}
.gen-title{font-size:11px;color:var(--gold);letter-spacing:.08em;margin:1px 0 5px}
.stat-row{display:flex;gap:5px;flex-wrap:wrap}
.stat-chip{font-size:10.5px;background:#120c06;border:1px solid #33271a;border-radius:3px;padding:2px 6px;color:#cbb88f}
.stat-chip b{color:#efe0ba}
.trait-tag{font-size:10px;border:1px solid #4a3a20;border-radius:3px;padding:1px 6px;color:#d8b25f;background:rgba(216,178,95,.07)}
.loyalty-bar{height:5px;background:#0e0903;border-radius:3px;margin-top:6px;overflow:hidden}
.loyalty-fill{height:100%;border-radius:3px;transition:width .4s}
.gen-flags{position:absolute;top:8px;right:9px;display:flex;gap:5px;font-size:11px}
.flag-wounded{color:#d86a4a}.flag-battle{color:#e8c66a}.flag-hidden{color:#7ab07a}
.bar-wrap{display:flex;align-items:center;gap:8px;margin:3px 0;font-size:12px;color:#c9b68d}
.bar-track{flex:1;height:7px;background:#0e0903;border:1px solid #292013;border-radius:4px;overflow:hidden}
.bar-fill{height:100%;transition:width .5s}
.btn-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.btn-tiny{font-family:var(--serif);font-size:11.5px;color:var(--parch);background:#241a10;border:1px solid #4a3a20;border-radius:3px;padding:5px 10px;cursor:pointer;transition:.15s}
.btn-tiny:hover{border-color:var(--bronze2);background:#332415}
.btn-tiny.warn{border-color:#7c3a2a;color:#eba890}
.btn-tiny:disabled{opacity:.35;cursor:default}

/* city card */
.city-card{background:#1a130a;border:1px solid #3a2c18;border-radius:6px;padding:11px;margin-bottom:9px}
.city-head{display:flex;justify-content:space-between;align-items:baseline}
.city-name{font-size:15.5px;color:#f0dfba}
.city-name .prov{color:#8d7c5c;font-size:11px;margin-left:6px}
.owner-dot{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:7px;vertical-align:baseline;border:1px solid rgba(255,255,255,.25)}
.city-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:4px 10px;margin:8px 0;font-size:11.5px;color:#c9b68d}
.city-stats b{color:#eee0ba}
.build-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:6px}
.build-slot{background:#120c06;border:1px solid #33271a;border-radius:4px;padding:6px;text-align:center;font-size:11px;color:#c9b68d}
.build-slot .lv{color:var(--gold);font-weight:700}
.build-slot.up{border-color:#5a6b3a;cursor:pointer}
.build-slot.up:hover{background:#1d1a0c;border-color:#8fa050}
.build-slot.max{border-color:#3a4a2a;color:#9ab07a}

/* diplomacy */
.diplo-row{display:flex;align-items:center;gap:9px;background:#1a130a;border:1px solid #3a2c18;border-radius:6px;padding:9px 11px;margin-bottom:8px}
.diplo-flag{width:14px;height:22px;border-radius:2px;flex-shrink:0;border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:9px}
.diplo-name{flex:1;min-width:0}
.diplo-name b{font-size:13.5px}
.diplo-rel{font-size:11px;margin-top:2px}
.rel-war{color:#e07a5a}.rel-alliance{color:#8fd07a}.rel-nap{color:#8fb0d0}.rel-trade{color:#d0c07a}.rel-peace{color:#b0a480}
.trust-meter{width:64px;height:7px;background:#0e0903;border-radius:4px;position:relative;overflow:hidden;flex-shrink:0}
.trust-meter::after{content:'';position:absolute;left:50%;top:0;bottom:0;width:1px;background:#5a4527}

/* journal */
.journal-entry{border-left:3px solid #4a3a20;padding:7px 11px;margin-bottom:7px;background:#170f08;border-radius:0 4px 4px 0;font-size:12.5px;line-height:1.55;color:#d6c49b}
.journal-entry.war{border-color:#a04a2a}.journal-entry.good{border-color:#6fa06a}.journal-entry.bad{border-color:#c05040}.journal-entry.epic{border-color:#d8b25f;background:#1c1508}
.journal-entry .je-date{color:var(--gold);font-size:11px;letter-spacing:.08em;margin-right:8px}
.chron-year{color:var(--seal);font-family:var(--brush);font-size:17px;margin:10px 0 4px}

/* hover card */
#hover-card{position:absolute;z-index:40;pointer-events:none;max-width:270px;background:rgba(16,11,6,.95);
  border:1px solid var(--panel-line);border-radius:5px;padding:10px 12px;font-size:12px;line-height:1.5;color:#d6c49b;
  box-shadow:0 10px 30px rgba(0,0,0,.6)}
#hover-card h4{color:#f0dfba;font-size:14px;margin-bottom:3px}
#hover-card .hc-sub{color:var(--gold);font-size:11px;margin-bottom:5px}

/* map labels */
.map-label{position:absolute;transform:translate(-50%,-100%);text-align:center;pointer-events:auto;cursor:pointer;transition:opacity .3s}
.ml-name{font-size:12px;color:#f4e8cc;text-shadow:0 1px 2px #000,0 0 8px rgba(0,0,0,.9);letter-spacing:.06em;white-space:nowrap}
.ml-sub{font-size:10px;color:#c9b184;text-shadow:0 1px 2px #000;white-space:nowrap}
.army-label{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;cursor:pointer;
  background:rgba(16,11,6,.88);border:1px solid;border-radius:3px;padding:2px 7px;font-size:11px;white-space:nowrap;text-shadow:none}

/* province tooltip region highlight */
.prov-banner{position:absolute;left:50%;top:54px;transform:translateX(-50%);z-index:24;text-align:center;pointer-events:none;opacity:0;transition:opacity .4s}
.prov-banner.show{opacity:1}
.prov-banner h3{font-family:var(--brush);font-size:26px;color:#f2e3bd;text-shadow:0 2px 6px #000;letter-spacing:.1em}
.prov-banner p{font-size:12px;color:#cab98f;text-shadow:0 1px 3px #000}

/* event modal */
.modal{position:absolute;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;background:rgba(5,3,2,.62);backdrop-filter:blur(2px)}
.event-card{width:min(560px,92vw);background:linear-gradient(180deg,#221709 0%,#170f07 100%);
  border:1px solid var(--bronze);border-radius:8px;padding:26px 30px;box-shadow:0 30px 90px rgba(0,0,0,.8), inset 0 0 60px rgba(0,0,0,.45);
  animation:eventIn .35s ease-out}
@keyframes eventIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
.event-kind{font-family:var(--disp);font-size:11px;letter-spacing:.3em;color:var(--seal);margin-bottom:8px}
.event-card h2{font-family:var(--disp);font-size:21px;color:var(--gold);letter-spacing:.05em;margin-bottom:12px;line-height:1.35}
.event-art{font-size:44px;text-align:center;margin:6px 0 12px;filter:drop-shadow(0 4px 12px rgba(216,178,95,.25))}
.event-card p{color:#d9c89f;line-height:1.8;font-size:13.5px;margin-bottom:18px;white-space:pre-line}
.event-choice{display:block;width:100%;text-align:left;font-family:var(--serif);font-size:13.5px;color:var(--parch);
  background:#1e150b;border:1px solid #4a3a20;border-left:3px solid var(--bronze);border-radius:4px;padding:11px 15px;margin-bottom:9px;cursor:pointer;transition:.15s;line-height:1.5}
.event-choice:hover{border-color:var(--bronze2);border-left-color:var(--seal);background:#2a1d0e;transform:translateX(3px)}
.event-choice .ec-hint{display:block;font-size:11px;color:#97835b;margin-top:3px}

/* toasts */
#toasts{position:absolute;right:14px;top:110px;z-index:45;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.toast{background:rgba(20,14,8,.94);border:1px solid var(--panel-line);border-left:3px solid var(--gold);color:#e5d5ac;
  padding:9px 14px;border-radius:4px;font-size:12.5px;max-width:320px;animation:toastIn .3s ease-out;box-shadow:0 8px 24px rgba(0,0,0,.5);line-height:1.5}
.toast.bad{border-left-color:#c05040}.toast.good{border-left-color:#6fa06a}.toast.epic{border-left-color:#d8b25f;box-shadow:0 0 24px rgba(216,178,95,.3)}
@keyframes toastIn{from{opacity:0;transform:translateX(24px)}to{opacity:1}}

/* turn banner */
#turn-banner{position:absolute;inset:0;z-index:55;display:flex;align-items:center;justify-content:center;pointer-events:none}
#turn-banner-text{font-family:var(--brush);font-size:64px;color:#f2e3bd;text-shadow:0 4px 24px rgba(0,0,0,.9),0 0 60px rgba(216,178,95,.4);
  animation:turnFade 1.5s ease forwards;letter-spacing:.12em;text-align:center}
@keyframes turnFade{0%{opacity:0;transform:scale(1.12)}18%{opacity:1;transform:scale(1)}75%{opacity:1}100%{opacity:0}}

/* vignette + grain */
#vignette{position:absolute;inset:0;pointer-events:none;z-index:20;
  background:radial-gradient(ellipse at center, transparent 55%, rgba(8,5,2,.55) 100%)}

/* battle overlay */
#battle-overlay{position:absolute;inset:0;z-index:58;background:#000}
#battle-gl{position:absolute;inset:0;width:100%;height:100%}
#battle-hud{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;padding:12px 18px;gap:20px;
  background:linear-gradient(180deg,rgba(10,6,3,.9),transparent)}
.bh-side{flex:1;max-width:330px}
.bh-right{text-align:right}
.bh-name{font-family:var(--disp);font-size:15px;color:#f2e3bd;letter-spacing:.06em;margin-bottom:5px}
.bh-bar{height:9px;background:rgba(0,0,0,.6);border:1px solid #5a4527;border-radius:5px;overflow:hidden}
.bh-bar div{height:100%;border-radius:4px;transition:width .5s}
#bh-att-morale{background:linear-gradient(90deg,#7ca050,#a8c878)}
#bh-def-morale{background:linear-gradient(90deg,#c07850,#e0a878);float:right}
.bh-troops{font-size:12px;color:#cab98f;margin-top:4px}
.bh-center{text-align:center}
#bh-round{font-family:var(--disp);font-size:19px;color:var(--gold);letter-spacing:.14em}
#bh-terrain{font-size:12px;color:#a5946f;margin-top:3px;letter-spacing:.1em;text-transform:uppercase}
#battle-callout{position:absolute;left:0;right:0;bottom:22%;text-align:center;pointer-events:none}
.callout{display:inline-block;font-family:var(--brush);font-size:42px;color:#ffe9bd;text-shadow:0 3px 18px rgba(0,0,0,.95),0 0 40px rgba(216,178,95,.45);
  animation:calloutIn 2.2s ease forwards}
@keyframes calloutIn{0%{opacity:0;transform:scale(1.4)}14%{opacity:1;transform:scale(1)}80%{opacity:1}100%{opacity:0}}
#battle-speed{position:absolute;right:14px;bottom:14px;width:42px;height:42px;font-size:16px}
#battle-result{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(8,5,2,.72)}
.br-card{width:min(520px,92vw);background:linear-gradient(180deg,#221709,#170f07);border:1px solid var(--bronze);border-radius:8px;padding:26px 30px;animation:eventIn .4s ease-out}
.br-card h2{font-family:var(--disp);font-size:24px;letter-spacing:.1em;margin-bottom:14px;text-align:center}
.br-victory{color:#a8d078;text-shadow:0 0 24px rgba(140,200,110,.4)}
.br-defeat{color:#e07a5a;text-shadow:0 0 24px rgba(220,110,80,.4)}
.br-lines{font-size:13px;line-height:1.9;color:#d9c89f;margin-bottom:16px}
.prisoner-actions{display:flex;flex-direction:column;gap:8px;margin:10px 0}

/* end screen */
#end-screen{background:radial-gradient(1000px 600px at 50% 20%, rgba(216,178,95,.1), transparent 60%),linear-gradient(180deg,#151009,#0b0704)}
.dynasty-name{text-align:center;font-family:var(--brush);font-size:44px;color:var(--seal);margin:6px 0 18px;text-shadow:0 0 30px rgba(160,44,32,.4)}
#end-chronicle{font-family:var(--serif);font-size:13.5px;line-height:2.05;color:#d9c89f;white-space:pre-wrap;margin-bottom:18px}
#end-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:8px}
.es-item{background:#191108;border:1px solid #3a2c18;border-radius:5px;padding:10px 12px;text-align:center}
.es-item b{display:block;font-size:20px;color:var(--gold)}
.es-item span{font-size:11px;color:#97835b;letter-spacing:.08em}

/* help */
.help-cols{columns:2;column-gap:30px;font-size:12.5px;color:#cdbb93;line-height:1.7}
.help-cols h4{color:var(--gold);margin:10px 0 4px;break-after:avoid}
kbd{background:#2a1d0e;border:1px solid #4a3a20;border-radius:3px;padding:1px 6px;font-size:11px;font-family:monospace}

@media (max-width:900px){
  .setup-columns{grid-template-columns:1fr}
  .help-cols{columns:1}
  .game-title{font-size:42px}
  #side-panel{width:60vw}
}