:root{color-scheme:dark;--bg:#10151c;--panel:#17212b;--ink:#edf2f5;--muted:#a9b7c4;--line:#344351;--ally:#7ce4c1;--enemy:#ff9aa4;--gold:#f4ce85;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}
*{box-sizing:border-box}body{margin:0}button,select{font:inherit}button,select{color:var(--ink);background:#202e3c;border:1px solid var(--line);border-radius:8px;min-height:44px;padding:9px 14px}button{cursor:pointer}button:hover:not(:disabled){background:#304657}button:disabled{opacity:.45;cursor:default}button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}button.primary{background:var(--ally);color:#12241f;border-color:var(--ally);font-weight:650}button.primary:hover:not(:disabled){background:#a0f3d7}.site-head{height:64px;padding:0 max(20px,calc((100% - 1200px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font-size:12px;color:var(--muted)}.site-head a{text-decoration:none;color:var(--ink);font-weight:800;letter-spacing:.06em}.site-head a span{font-weight:400;margin-left:14px;color:var(--ally)}main{max-width:1240px;margin:auto;padding:30px 20px 48px}.heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:26px}.eyebrow{color:var(--ally);font-size:11px;letter-spacing:.14em;margin:0 0 8px}h1{font-size:40px;line-height:1.1;margin:0;font-weight:650;letter-spacing:-.04em}.heading p:last-child{color:var(--muted);font-size:14px;margin-bottom:0}.game-layout{display:grid;grid-template-columns:minmax(0,800px) minmax(250px,300px);gap:24px;align-items:start}.arena{min-width:0}.turn-bar{display:flex;align-items:center;gap:18px;padding:14px 0}.turn-bar>div:first-child{flex:1;display:flex;flex-direction:column;gap:4px}.turn-bar strong{font-size:16px}.turn-bar span{font-size:12px;color:var(--muted)}#actions{display:flex;gap:6px}#actions i{display:block;width:10px;height:24px;background:var(--ally);border-radius:3px}#actions i.spent{background:var(--line)}.board-tools{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:12px;margin-bottom:10px}.board-tools>div{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.board-tools button{padding:6px 10px}.board-tools b{font-weight:600}.ally-key{color:var(--ally)}.enemy-key{color:var(--enemy)}.versus{padding:0 9px;color:var(--muted)}#pan{display:flex;gap:4px}.board-wrap{position:relative;background:#17202a;border:1px solid var(--line);border-radius:10px;overflow:hidden}canvas{display:block;width:100%;height:auto;aspect-ratio:1;touch-action:manipulation}.commands{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0}.commands button{min-width:0;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 10px;padding:12px 6px}.commands small{font-size:11px;color:var(--muted)}.commands button.selected{border-color:var(--ally);background:#213c36}.confirmation{display:flex;gap:14px;align-items:center;justify-content:space-between;min-height:62px}.confirmation p{font-size:13px;line-height:1.5;margin:0}.confirmation button{flex-shrink:0}.key-target{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding-top:12px;font-size:12px}.key-target select{min-width:56px;padding:8px}.key-target label{color:var(--muted)}aside{padding-top:14px;display:grid;gap:16px}aside section,aside details{background:var(--panel);padding:18px;border-radius:10px}aside p{font-size:13px;line-height:1.65;color:var(--muted);margin:10px 0}aside h2{font-size:28px;margin:12px 0;display:flex;flex-direction:column;gap:4px}#unitRole{font-size:15px;font-weight:400;color:var(--muted)}aside h3{font-size:14px;font-weight:650;margin:14px 0 7px}aside hr{border:0;border-top:1px solid var(--line);margin:16px 0}.identity-heading{display:flex;justify-content:space-between;font-size:11px;color:var(--ally)}#health{display:flex;gap:4px;align-items:center;flex-wrap:wrap}#health .pip{display:block;width:14px;height:7px;background:var(--ally);border-radius:1px}#health .pip.lost{background:var(--line)}#health span{font-size:12px;margin-left:6px}#passiveBox{border-left:2px solid var(--gold);padding-left:12px;margin-top:16px}#passiveBox h3{color:var(--gold)}#passiveProgress{font-size:12px;color:var(--gold)}.subtle{font-size:12px!important}summary{font-size:14px;font-weight:600;cursor:pointer;min-height:26px;line-height:1.6}summary span{float:right;font-size:11px;color:var(--muted);font-weight:400}.roster{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:14px}.roster button{padding:8px 2px;font-size:11px;min-width:0;display:flex;flex-direction:column;align-items:center;gap:4px}.roster button span{font-size:10px;color:var(--muted)}.roster button.chosen{border-color:var(--ally);background:#254539}.roster button.fallen{opacity:.45;text-decoration:line-through}.rules ol,.history ol{padding-left:18px;margin-bottom:0}.rules li,.history li{font-size:12px;line-height:1.6;margin:10px 0;color:var(--muted)}.rules a{color:var(--ally);font-size:12px}.history li{list-style:none}.history ol{padding-left:0}#result{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:14px;background:rgba(10,18,24,.94);text-align:center;padding:20px}#result h2{font-size:32px;margin:0}#result p{font-size:14px;max-width:340px;line-height:1.6;margin:0 0 8px}[hidden]{display:none!important}
@media(max-width:850px){main{padding:20px 14px 40px}.game-layout{grid-template-columns:minmax(0,1fr);max-width:650px;margin:auto}.heading{max-width:650px;margin:0 auto 15px}.heading h1{font-size:32px}.heading>button{font-size:12px;padding:8px}.heading p:last-child{font-size:12px;max-width:230px;line-height:1.5}aside{grid-template-columns:1fr 1fr;padding-top:0}.identity{grid-column:1/-1}#health .pip{width:20px}.roster button{font-size:12px}.turn-bar{gap:10px;padding-top:0}.turn-bar>button{padding:9px 12px;font-size:13px}.site-head{height:48px;padding:0 14px;font-size:10px}.board-tools button{min-height:44px}.key-target{font-size:11px}.key-target select{min-width:48px}.key-target button{font-size:11px}.confirmation{gap:8px}.confirmation p{font-size:12px}.confirmation button{font-size:12px;padding:9px 10px}}
@media(max-width:540px){aside{grid-template-columns:1fr}.identity{grid-column:auto}main{padding:15px 10px 32px}.heading h1{font-size:29px}.heading{gap:8px}.heading>button{max-width:105px}.turn-bar strong{font-size:14px}.turn-bar span{font-size:11px}#actions{gap:4px}#actions i{width:7px;height:20px}.board-tools{font-size:11px}.commands{gap:6px}.commands button{font-size:13px;flex-direction:column}.commands small{font-size:10px}.site-head a span{margin-left:9px}aside section,aside details{padding:16px}.roster{gap:8px}.roster button{font-size:13px}.roster button span{font-size:11px}}
.keyboard-target{margin-top:8px;color:var(--muted)}.keyboard-target>summary{font-size:11px;font-weight:400}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}