:root{color-scheme:dark;--bg:#111311;--panel:#1c201d;--panel2:#252a26;--line:#4c554d;--text:#f3efe3;--muted:#aeb5ad;--red:#a82e29;--green:#4e8a45;--yellow:#c8a52c;--orange:#c76a25}

#playView .right-rail .danger-panel{background:linear-gradient(145deg,#313831,#1b201c 70%);color:var(--text);border-color:#69736a;box-shadow:inset 0 1px #ffffff12,0 6px 18px #0008}
#playView .right-rail .danger-title{border-bottom-color:#69736a}
#playView .right-rail .danger-title .eyebrow{color:#b7a66c}
#playView .right-rail .danger-scale span{border-color:#111713}
#playView .right-rail .danger-scale span.active{box-shadow:0 3px 0 #0c0f0d}
#playView .right-rail .danger-digit{color:#f7f3e8;border-color:#121612;background:linear-gradient(#485048,#303630 48%,#252b26 52%,#181c19);text-shadow:0 1px 2px #000;box-shadow:inset 0 0 8px #0006}
#playView .right-rail .danger-digit-low{background:linear-gradient(rgba(78,138,69,.72),rgba(46,75,42,.82)),linear-gradient(#626b62,#242a25)}
#playView .right-rail .danger-digit-medium{color:#181713;text-shadow:0 1px #f2dc82;background:linear-gradient(rgba(200,165,44,.78),rgba(126,101,28,.84)),linear-gradient(#777064,#292a25)}
#playView .right-rail .danger-digit-high{background:linear-gradient(rgba(199,106,37,.8),rgba(117,59,20,.86)),linear-gradient(#6d665e,#292a25)}
#playView .right-rail .danger-digit-critical{background:linear-gradient(rgba(168,46,41,.82),rgba(92,25,22,.88)),linear-gradient(#6d625e,#292a25)}
#playView .right-rail .danger-digit.current{border-color:#d4c69b;box-shadow:0 4px 0 #0d100e,inset 0 0 12px #0005}
#playView .right-rail .danger-controls button{border-color:#68746a;background:linear-gradient(#566158,#39423b);color:#f3efe3;box-shadow:inset 0 1px #ffffff1c}
#playView .right-rail .danger-controls button:hover{background:linear-gradient(#69766b,#465148)}
#playView .right-rail .danger-controls button:disabled{background:#2c322d;color:#777f78}
#playView .right-rail .danger-panel .history{color:#cbd0ca}
#playView .right-rail .danger-panel .notice{color:#f3efe3;background:#513a25;border-color:#b77736}

#playView .danger-panel{background:linear-gradient(135deg,#fff7e7,#d5cfbd);color:#181713;border:3px solid #111;padding:.65rem;box-shadow:0 6px 18px #0007}
#playView .danger-title{align-items:end;border-bottom:3px solid #181713;margin-bottom:.55rem}
#playView .danger-title h2{font-size:1.25rem;text-transform:uppercase;letter-spacing:.05em}
#playView .danger-title .eyebrow{color:#4b473d;font-size:.58rem}
#playView .danger-scale{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;font-size:inherit;text-align:left}
#playView .danger-scale span{display:grid;grid-template-columns:21px 1fr;grid-template-rows:1fr 1fr;align-items:center;min-width:0;padding:.25rem;color:white;border:2px solid #181713;border-top:2px solid #181713;opacity:.48;transition:.18s}
#playView .danger-scale span:nth-child(1){background:var(--green)}
#playView .danger-scale span:nth-child(2){background:var(--yellow);color:#181713}
#playView .danger-scale span:nth-child(3){background:var(--orange)}
#playView .danger-scale span:nth-child(4){background:var(--red)}
#playView .danger-scale span.active{opacity:1;transform:translateY(-3px);box-shadow:0 3px 0 #181713}
#playView .danger-scale img{grid-row:1/3;width:18px;height:18px;object-fit:contain}
#playView .danger-scale b{font-size:.7rem;line-height:1}
#playView .danger-scale small{font-size:.62rem;line-height:1}
#playView .danger-band{font-weight:700;letter-spacing:.2em}
#playView .danger-readout{display:grid;justify-items:center;gap:0;margin:.45rem 0}
#playView .danger-readout>small{letter-spacing:.16em;font-size:.6rem}
#playView .danger-roller{height:68px;display:flex;align-items:center;justify-content:center;gap:3px;overflow:hidden}
#playView .danger-digit{display:grid;place-items:center;width:42px;height:46px;border:2px solid #5b584f;border-radius:5px;background:linear-gradient(#d1ccc0,#fff 48%,#c5c0b4 52%,#aaa69b);font-size:1.55rem;box-shadow:inset 0 0 8px #0004}
#playView .danger-digit.current{width:58px;height:61px;border:3px solid #151410;font-size:2.4rem;box-shadow:0 4px 0 #171612,inset 0 0 10px #0004}
#playView .danger-digit.near{opacity:.65;transform:scale(.9)}
#playView .danger-digit.far{opacity:.3;transform:scale(.8)}
#playView .danger-digit.out{visibility:hidden}
#playView .danger-controls{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
#playView .danger-controls button{height:40px;border:2px solid #151410;background:#3c3a34;color:white;font-size:1.6rem;line-height:1}
#playView .danger-panel details{margin-top:.45rem}
#playView .danger-panel .history{color:#28251f}
#playView .danger-panel .notice{background:#f1cf9e;border-color:#9c5c20}
.deck-counts{color:var(--muted);font-size:.8rem;margin:.35rem 0 .55rem;padding-top:.35rem;border-top:1px solid var(--line)}
.inline-die{width:16px;height:16px;vertical-align:-3px;margin:0 1px}

*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at 20% 0,#263028 0,#111311 42%);color:var(--text);font:15px/1.35 "Segoe UI",system-ui,sans-serif;min-height:100vh}
button,input,select{font:inherit}
button{background:#303832;border:1px solid #667168;color:var(--text);border-radius:4px;padding:.5rem .75rem;cursor:pointer}
button:hover{background:#435046}
button:disabled{opacity:.4;cursor:not-allowed}
h1,h2,h3,p{margin-top:0}
.topbar{position:sticky;top:0;z-index:10;min-height:80px;display:flex;align-items:center;gap:2rem;padding:.7rem 1.2rem;background:#111711ee;border-bottom:2px solid #69736a}
.topbar h1{font-size:1.35rem;margin:0;letter-spacing:.08em}
.eyebrow{font-size:.68rem;color:#b7a66c;letter-spacing:.18em}
.topbar nav{display:flex;gap:.4rem}
.nav.active{background:#79502b;border-color:#d6a565}
.top-actions{margin-left:auto;display:flex;gap:.4rem;align-items:center}
.view{display:none;padding:1rem}
.view.active{display:block}
.play-grid{display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:1rem}
.player-workspace{min-width:0}
.player-tabs-row{align-items:center;display:flex;gap:.55rem;margin-bottom:.55rem;min-width:0}
.player-tabs{display:flex;flex:1 1 auto;gap:.35rem;min-width:0;overflow-x:auto}
.player-tabs:empty{display:none}
.player-tabs button{min-width:130px;border-radius:5px 5px 0 0}
.player-tabs button.active{background:#79502b;border-color:#d6a565}
.team-points{align-items:center;display:flex;flex:0 0 auto;gap:.3rem;white-space:nowrap}
.team-points-heading{color:#cbd0ca;font-size:.66rem;letter-spacing:.05em;text-transform:uppercase}
.players{min-height:870px;padding-bottom:1rem}
.player{width:100%;background:linear-gradient(#252b26,#171b18);border:1px solid var(--line);border-radius:7px;overflow:hidden}
.player-head,.panel-head,.view-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.player-head{padding:.75rem;background:#303830}
.player-head>div{min-width:0}
.player-head-actions{display:flex;flex:0 0 auto;gap:.4rem}
.player-head h2{font-size:1rem;margin:0}
.loadout-summary{display:flex;align-items:center;gap:.35rem;max-width:100%;overflow-x:auto;padding-bottom:.15rem;white-space:nowrap}
.loadout-title{color:var(--muted);font-size:.72rem}
.saved-points-heading{color:#cbd0ca;font-size:.66rem;letter-spacing:.05em;text-transform:uppercase}
.point-chip{border:1px solid rgba(255,255,255,.16);border-radius:999px;font-size:.67rem;font-weight:700;line-height:1;padding:.25rem .45rem}
.point-tactical{background:#8d2c25;color:#fff4ee}
.point-rpg{background:#4f668a;color:#f3f6ff}
.point-equipment{background:#c48632;color:#1b160e}
.point-total{background:#3e6b4b;color:#f1fff3}
.points-total-note{color:var(--muted);font-size:.65rem}
.player-body{padding:.75rem}
.card-stack{display:flex;flex-direction:column;align-items:center;gap:.5rem}
.card-thumb{max-width:260px;max-height:160px;object-fit:contain;cursor:zoom-in;background:#111;border:1px solid #4c554d}
.mod-thumb{max-height:95px}
.missing-image{width:240px;min-height:75px;display:grid;place-items:center;background:#101310;border:1px dashed #5e695f;color:var(--muted);padding:.5rem;text-align:center}
.health{display:flex;align-items:center;justify-content:center;gap:.65rem;margin:.75rem 0}
.health strong{font-size:1.25rem}
.conditions-panel{border-top:1px solid var(--line);margin-top:.75rem;padding-top:.75rem;width:600px}
.conditions-panel>h3{color:#d7c58a;font-size:.85rem;letter-spacing:.08em;margin-bottom:.45rem;text-transform:uppercase}
.condition-list{display:grid;gap:.4rem}
.condition-row{align-items:center;background:#1b201c;border:1px solid #424b43;border-left:4px solid #59625a;display:grid;gap:.75rem;grid-template-columns:minmax(0,1fr) auto;padding:.5rem .6rem}
.condition-row.condition-active{background:#2c332b;border-color:#78866f;border-left-color:#d6a565}
.condition-details{min-width:0}
.condition-details b{font-size:.85rem;text-transform:uppercase}
.condition-details small{color:#8fa087;font-size:.6rem;margin-left:.45rem;text-transform:uppercase}
.condition-details p{color:var(--muted);font-size:.72rem;margin:.15rem 0 0}
.condition-controls{align-items:center;display:flex;gap:.35rem}
.condition-controls button{min-width:34px;padding:.3rem .5rem}
.condition-controls strong{min-width:1.5rem;text-align:center}
.condition-toggle[aria-pressed="true"]{background:#79502b;border-color:#d6a565}
.equipment-list{display:grid;gap:.4rem}
.equipment-row{display:grid;grid-template-columns:1fr auto;gap:.35rem;background:#242a25;padding:.45rem;border-left:4px solid #73664f}
.equipment-row.equipment-unassigned small{display:inline-block;background:#8a5a24;color:#fff2d2;border:1px solid #c98a32;border-radius:3px;padding:.12rem .35rem}
.equipment-row small{color:var(--muted);display:block}
.equipment-actions{display:flex;gap:.25rem;align-items:center}
.equipment-actions button{padding:.25rem .4rem}
.player-content-layout{display:grid;grid-template-columns:600px minmax(650px,1fr);gap:1rem;align-items:start;overflow-x:auto;padding-bottom:.5rem}
.character-column{width:600px}
.character-column .card-stack{align-items:flex-start;gap:.75rem}
.character-card-image,.mod-card-image{display:block;width:600px;max-width:none;max-height:none;height:auto}
.equipment-board{min-width:650px;display:grid;gap:1rem;align-content:start}
.slot-row{border-top:1px solid var(--line);padding-top:.65rem}
.slot-row:first-child{border-top:0;padding-top:0}
.slot-row h3{font-size:.85rem;color:#d7c58a;letter-spacing:.08em;text-transform:uppercase;margin-bottom:.45rem}
.slot-cells{display:flex;gap:.75rem;align-items:flex-start;overflow-x:auto;padding-bottom:.25rem}
.slot-cell{flex:0 0 200px;width:200px}
.slot-label{display:block;color:#aeb5ad;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.3rem}
.slot-placeholder{width:200px;min-height:56px;display:grid;place-items:center;border:1px dashed #59625a;background:#171b18;color:#747d75;font-size:.75rem;text-align:center;padding:.35rem}
.slot-card{width:200px;background:#171b18;border:1px solid var(--line);margin-bottom:.5rem}
.slot-card-image{display:block;width:200px;height:300px;max-width:none;max-height:none;object-fit:contain;border:0}
.slot-card footer{display:grid;gap:.15rem;padding:.4rem}
.slot-card footer small{color:var(--muted)}
.slot-card footer button{margin-top:.2rem;padding:.3rem .45rem}
.slot-attachment-label{display:block;margin:.2rem 0 .3rem;color:#9db88b;font-size:.68rem;text-transform:uppercase;letter-spacing:.08em}
.right-rail{display:grid;gap:1rem;align-content:start}
.panel{background:linear-gradient(#242a25,#191d1a);border:1px solid var(--line);border-radius:7px;padding:.75rem}
.panel h2{font-size:1rem;margin:0}
.danger-band{font-weight:700;letter-spacing:.1em}
.danger-readout{display:flex;justify-content:center;align-items:center;gap:1rem;margin:.7rem}
.danger-readout strong{font-size:3rem;min-width:4rem;text-align:center}
.danger-scale{display:grid;grid-template-columns:repeat(4,1fr);font-size:.66rem;text-align:center}
.danger-scale span{padding:.3rem;border-top:4px solid var(--green)}
.danger-scale span:nth-child(2){border-color:var(--yellow)}
.danger-scale span:nth-child(3){border-color:var(--orange)}
.danger-scale span:nth-child(4){border-color:var(--red)}
.notice{margin-top:.6rem;padding:.55rem;background:#4b3320;border:1px solid #b77736}
.history{max-height:100px;overflow:auto;padding-left:1.4rem;font-size:.8rem}
.hidden-card{height:105px;display:grid;place-items:center;background:repeating-linear-gradient(45deg,#28322b,#28322b 8px,#172019 8px,#172019 16px);border:2px solid #6e786f;color:#d7c58a;font-weight:700;letter-spacing:.15em;margin:.6rem 0}
.revealed-card{max-height:180px;max-width:100%;display:block;margin:.6rem auto;cursor:zoom-in}
.button-row{display:flex;gap:.35rem;flex-wrap:wrap}
.drawn-list{display:grid;gap:.4rem;margin-top:.5rem}
.supply-item{background:#252b26;padding:.4rem}
.empty{color:var(--muted);padding:2rem;border:1px dashed #59625a;border-radius:5px}
.view-head{margin-bottom:1rem}
.npc-points-total{display:inline-block;background:#3e6b4b;border:1px solid #6e9678;border-radius:999px;color:#f1fff3;font-size:.75rem;padding:.25rem .5rem}
.npc-workspace{min-width:0}
.npc-tabs{display:flex;gap:.35rem;overflow-x:auto;margin-bottom:.55rem}
.npc-tabs:empty{display:none}
.npc-tabs button{min-width:130px;border-radius:5px 5px 0 0}
.npc-tabs button.active{background:#79502b;border-color:#d6a565}
.npc-group{background:linear-gradient(#252b26,#171b18);border:1px solid var(--line);border-radius:7px;overflow:hidden}
.npc-group-head{align-items:center;background:#303830;display:flex;justify-content:space-between;padding:.75rem}
.npc-group-head h3{margin:0}
.npc-group-actions{align-items:center;display:flex;gap:.55rem;justify-content:flex-end;white-space:nowrap}
.npc-group-points{color:#d7c58a;font-size:.78rem}
.npc-group-body{display:grid;grid-template-columns:600px minmax(260px,1fr);gap:1rem;overflow-x:auto;padding:1rem}
.npc-card-column{width:600px}
.npc-reference{display:block;width:600px;height:350px;max-width:none;object-fit:contain;cursor:zoom-in}
.npc-controls{align-self:start;background:var(--panel);border:1px solid var(--line);padding:1rem;min-width:260px}
.npc-controls .health{margin-top:0}
.npc-instances{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.75rem}
.npc-chip{background:#303730;border:1px solid #4f5a51;border-radius:4px;padding:.35rem}
.npc-chip-defeated{background:#552522;border-color:#8d3a34;color:#ffe8e5}
.tools-grid{display:flex;gap:.5rem;margin-bottom:.75rem}
#toolFrame{width:100%;height:790px;border:1px solid var(--line);background:white}
.rules-layout{display:grid;grid-template-columns:260px 1fr;gap:1rem}
.rules-layout aside,.rules-layout article{background:var(--panel);padding:1rem;border:1px solid var(--line)}
.rules-layout input{width:100%;padding:.5rem}
.rules-layout article{min-height:650px}
.rules-mods{display:flex;gap:.45rem;flex-wrap:wrap;justify-content:flex-end}
.rules-mod{display:flex;align-items:center;gap:.35rem;padding:.4rem .55rem;background:var(--panel);border:1px solid var(--line);border-radius:4px}
.rules-mod input{accent-color:#b77736}
.rules-data-path{display:block;color:#7f8981;font-size:.7rem;margin-top:-.55rem}
.rules-data-path code{color:#9ca49d}
.phase-nav{display:grid;gap:.35rem;margin-top:.7rem}
.phase-nav button{text-align:left}
.phase-nav button.active{background:#79502b;border-color:#d6a565}
.rules-phase-head{border-bottom:2px solid #79502b;padding-bottom:.5rem;margin-bottom:1rem}
.rules-phase-head p{color:var(--muted);margin-bottom:0}
.rules-section{margin:1rem 0 1.4rem}
.rules-section>h3{color:#d7c58a;border-bottom:1px solid var(--line);padding-bottom:.35rem}
.rule-card{background:var(--panel2);border:1px solid var(--line);border-left:4px solid #73664f;border-radius:4px;margin:.55rem 0;overflow:hidden}
.rule-card[data-source="zombo"]{border-left-color:#7e9b69}
.rule-card summary{list-style:none;cursor:pointer;padding:.7rem;display:grid;grid-template-columns:1fr auto;gap:.5rem}
.rule-card summary::-webkit-details-marker{display:none}
.rule-card summary::after{content:"+";font-size:1.2rem;color:#d7c58a}
.rule-card[open] summary::after{content:"−"}
.rule-card summary b{display:block}
.rule-summary{display:block;color:var(--muted);font-size:.88rem;margin-top:.2rem}
.rule-source{align-self:start;font-size:.62rem;letter-spacing:.08em;padding:.15rem .3rem;border:1px solid #68746a;border-radius:3px;color:#cbd0ca}
.rule-body{padding:0 .85rem .85rem}
.rule-body ul,.rule-body ol{padding-left:1.35rem}
.rule-body li{margin:.32rem 0}
.rule-body li[data-source="zombo"]{color:#7e9b69}
.rule-callout{background:#1a211b;border:1px solid #566158;border-left:4px solid #7e9b69;padding:.6rem;margin:.65rem 0}
.rule-table{width:100%;border-collapse:collapse;margin:.65rem 0}
.rule-table th,.rule-table td{border:1px solid var(--line);padding:.45rem;text-align:left;vertical-align:top}
.rule-table th{background:#303830;color:#d7c58a}
.rules-empty{color:var(--muted);padding:1rem;border:1px dashed var(--line)}
dialog{background:#202520;color:var(--text);border:1px solid #768078;max-width:min(1100px,92vw);max-height:90vh}
dialog::backdrop{background:#000b}
#zoomDialog{padding:1rem}
.zoom-content{clear:both;display:flex;justify-content:center;max-height:82vh;min-width:0}
.zoom-content.has-details{gap:1rem;justify-content:flex-start}
.zoom-card{display:grid;flex:0 1 auto;min-width:0;place-items:center}
#zoomDialog img{display:block;max-height:80vh;max-width:80vw;object-fit:contain}
.zoom-content.has-details #zoomDialog img,.zoom-content.has-details img{max-width:min(58vw,650px)}
.zoom-details{background:#171b18;border:1px solid var(--line);border-radius:6px;flex:0 0 min(360px,34vw);max-height:80vh;overflow:auto;padding:1rem}
.zoom-details header{border-bottom:1px solid var(--line);margin-bottom:1rem;padding-bottom:.75rem}
.zoom-details h2,.zoom-details h3,.zoom-details h4{margin:.15rem 0 .45rem}
.zoom-details h3{color:#d7c58a;font-size:.9rem;text-transform:uppercase}
.zoom-details h4{color:#f0eee8;font-size:1rem}
.zoom-details section+section{border-top:1px solid var(--line);margin-top:1rem;padding-top:1rem}
.zoom-details-kicker{color:var(--muted);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase}
.zoom-rule+.zoom-rule{border-top:1px dashed #49514b;margin-top:.8rem;padding-top:.8rem}
.zoom-rule div,.zoom-details section>div{line-height:1.45}
.zoom-no-rules{color:var(--muted);font-style:italic}
#zoomDialog .zoom-details .inline-die{display:inline-block;height:16px;margin:0 .08rem;max-height:16px;max-width:16px;vertical-align:-3px;width:16px}
.dialog-close{float:right}
.zoom-placeholder{min-width:360px;min-height:200px;display:grid;place-items:center}
.dialog-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1rem}
dialog label{display:grid;gap:.25rem;margin:.7rem 0}
dialog select,dialog input{padding:.45rem}
.transfer-discard-option,.transfer-discard-selected{color:#d8645c;font-weight:700}
.transfer-discard-button{background:#8d2c25;border-color:#b74a42;color:#fff4ee}
.setup-tools{display:flex;gap:.4rem}
@media(max-width:760px){.zoom-content.has-details{display:block;overflow:auto}.zoom-content.has-details img{max-height:60vh;max-width:86vw}.zoom-details{box-sizing:border-box;max-height:none;margin-top:1rem;width:100%}}
.supply-choices{max-height:55vh;overflow:auto;min-width:650px;margin-top:.6rem}
.supply-choice{display:grid;grid-template-columns:auto 1fr 80px;gap:.5rem;padding:.35rem;border-bottom:1px solid #414941}
.toast{position:fixed;left:50%;bottom:1.5rem;transform:translateX(-50%);background:#e9dfc8;color:#171b18;padding:.7rem 1rem;border-radius:4px;z-index:30;box-shadow:0 4px 20px #000}
.danger-low{color:#78b071}
.danger-medium{color:#e0bd44}
.danger-high{color:#e08339}
.danger-critical{color:#e44b43}
@media(max-width:900px){.play-grid{grid-template-columns:1fr}
.right-rail{grid-template-columns:repeat(3,minmax(300px,1fr));overflow:auto}
.players{min-height:500px}
.topbar{flex-wrap:wrap}
.top-actions{margin-left:0}
}
@media(max-width:760px){.right-rail{grid-template-columns:1fr}
.player{flex-basis:330px}
.rules-layout{grid-template-columns:1fr}
.topbar nav{order:3;width:100%;overflow:auto}
}
