:root { color-scheme: dark; --bg:#101923; --surface:#1b2937; --text:#edf5fa; --accent:#8bd3f7; }
* { box-sizing:border-box; } body { margin:auto; padding:1rem; max-width:1100px; background:var(--bg); color:var(--text); font:1rem/1.5 system-ui,sans-serif; }
a { color:var(--accent); } button, input, select { font:inherit; min-height:44px; padding:.4rem .7rem; margin:.2rem; }
button { cursor:pointer; } button:focus-visible, a:focus-visible, summary:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
nav { display:flex; flex-wrap:wrap; gap:.4rem; position:sticky; top:0; background:var(--bg); padding:.4rem; z-index:1; }
article, .battle-group { background:var(--surface); border:1px solid #728496; border-radius:.5rem; padding:.8rem; margin:.6rem 0; }
article.destroyed { opacity:.65; filter:grayscale(1); } .tracker { display:flex; align-items:center; flex-wrap:wrap; gap:.4rem; border-bottom:1px solid #728496; padding:.35rem 0; }
.tracker strong { flex:1 1 180px; } .tracker output { font-weight:bold; } details { margin:.5rem 0; } summary { cursor:pointer; min-height:44px; padding:.4rem; }
.stat-card dl { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:.3rem; } dt { font-weight:bold; } dd { margin:0; }
.rule-chip { display:inline-block; padding:.2rem .5rem; margin:.2rem; border:1px solid currentColor; border-radius:1rem; }
[role=alert] { border:2px solid #ffc66d; padding:.5rem; } footer { margin-top:2rem; } [hidden] { display:none!important; }
@media(max-width:600px) { body { padding:.6rem; } .stat-card dl { grid-template-columns:repeat(2,minmax(0,1fr)); } nav { position:static; } }
@media print { body { color:#000; background:#fff; } nav,button,footer { display:none; } article,.battle-group { background:#fff; color:#000; } }