/* Dark metal, framed portraits and a compact icon bar inspired by the supplied HUD reference. */
body:has(.combat-live) .topbar{display:none}
body:has(.combat-live) .content{padding:8px 18px}
.arena-combat-view{--hud-metal:#9c8254;--hud-border:#6f5c3b;--hud-blue:#76bfd1;--hud-green:#89b574}
.arena-combat-view .arena-session-line{margin:0 0 3px;font-size:9px;line-height:1.2}
.combat-heading{margin:0 0 5px;align-items:center;gap:8px}
.combat-heading h1{font:18px/1.15 var(--serif);margin:2px 0}
.combat-heading .eyebrow{display:none}
.combat-heading .button{font-size:11px;padding:6px 9px}
.combat-turn-strip{height:70px;display:flex;align-items:center;gap:14px;border-top:1px solid #665335;border-bottom:1px solid #665335;background:linear-gradient(90deg,#28251c99,#11121400);margin:0 0 6px;padding:3px 10px}
.combat-active-sprite{align-self:stretch;width:65px;display:flex;justify-content:center;filter:drop-shadow(0 0 8px #ba9a4b55)}
.combat-active-sprite .race-sprite{height:86px;width:60px;max-height:none;transform:translateY(-8px)}
.combat-active-name{display:flex;flex-direction:column;min-width:0}
.combat-active-name small{color:#c1ab7c;font-size:10px;letter-spacing:1px}
.combat-active-name strong{font:21px var(--serif);color:#e4d9bd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:360px}
.combat-active-name>span{font-size:11px;color:#a9a49b}
.combat-initiative{display:flex;gap:7px;margin-left:auto}
.initiative-portrait{position:relative;width:42px;height:60px;background:#1c1a17;border:1px solid #544a39;opacity:.65;display:flex;justify-content:center;align-items:center}
.initiative-portrait.current{border:2px solid #d7bb79;opacity:1;box-shadow:0 0 8px #b1934f55}
.initiative-portrait .race-sprite{height:48px;width:32px;max-height:none}
.initiative-portrait>span{position:absolute;bottom:0;left:0;right:0;background:#5f2225cc;font:9px Georgia,serif;text-align:center;color:#fff}
.arena-hud-layout{display:grid;grid-template-columns:minmax(0,1fr) 235px;gap:12px;align-items:start}
.combat-live .arena-hud-layout{height:calc(100dvh - 137px);min-height:360px;grid-template-rows:minmax(0,1fr)}
body:has(.combat-live) footer{display:none}
.arena-stage{min-width:0;min-height:0;display:grid;grid-template-rows:minmax(150px,1fr) auto;height:100%;gap:0}
.arena-stage .arena-board-panel{min-height:0;display:flex;flex-direction:column;padding:7px;border-radius:4px 4px 0 0;border-color:#5f523d;background:#101112}
.arena-stage #arena-board{display:grid;grid-template-rows:minmax(100px,1fr) auto;min-height:0;flex:1}
.arena-stage .arena-svg{height:100%;width:100%;min-height:0;max-height:none;display:block;object-fit:contain}
.arena-stage .keyboard-destination{gap:7px;margin:3px 0 0;font-size:10px;align-items:center}
.arena-stage .keyboard-destination label{display:flex;flex-direction:row;gap:4px;align-items:center;font-size:9px}
.arena-stage .keyboard-destination input{padding:3px;width:46px;font:12px Georgia,serif}
.arena-stage .keyboard-destination .button{padding:4px 7px;font-size:10px}
.arena-stage .arena-legend{font-size:9px;gap:10px;margin:3px 0}
.arena-stage .arena-impact{min-height:28px;padding:3px 8px;margin:0 0 4px;gap:6px}
.arena-stage .arena-impact.idle p{display:none}
.arena-stage .arena-impact .eyebrow{font-size:8px}
.arena-stage .arena-impact strong{font-size:16px;margin:0}
.arena-stage .arena-impact p{font-size:10px;margin:0}
.arena-stage .impact-roll{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.arena-stage .impact-roll b{font-size:20px}
.arena-stage .impact-roll span{display:none}
.hud-movement-row{display:flex;gap:5px;align-items:center}
.hud-movement-row .path-preview{padding:3px 5px;font-size:10px;min-height:0;flex:1;margin:0}
.hud-movement-row .button{font-size:11px;padding:4px 7px}
.combat-sidebar{height:100%;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:8px;scrollbar-width:thin}
.combat-sidebar .arena-live-log{min-height:140px;max-height:50%;overflow:auto;padding:10px;flex-shrink:0}
.combat-sidebar .fighter-card{padding:8px;border:1px solid #514839;background:#171719;margin:0}
.combat-sidebar .fighter-stats{margin:4px 0;gap:8px}
.combat-sidebar .fighter-card h3{font-size:17px}
.combat-sidebar .combat-log-event>p{font-size:11px;line-height:1.5}
.combat-sidebar .fighter-expanded-status{margin:5px 0}
.combat-hud{position:sticky;bottom:5px;z-index:15;border:1px solid var(--hud-metal);border-top:2px solid #b09a68;border-radius:0 0 12px 12px;background:linear-gradient(160deg,#25231e,#111215 45%,#221e18);box-shadow:0 -5px 22px #0009,inset 0 0 0 3px #171715,inset 0 0 0 4px #615033;padding:9px 9px 5px;min-width:0}
.hud-main{display:grid;grid-template-columns:62px minmax(0,1fr) 80px;gap:8px;align-items:center}
.hud-character{text-align:center;position:relative;align-self:end}
.hud-character-portrait{height:72px;width:62px;border:2px solid var(--hud-metal);border-radius:50% 50% 43% 43%;background:radial-gradient(ellipse,#44372a,#151419 75%);display:flex;justify-content:center;overflow:hidden;box-shadow:0 0 0 2px #191714,0 0 0 3px #71603f}
.hud-character-portrait .race-sprite{height:94px;max-height:none;width:48px;margin-top:7px;filter:drop-shadow(0 2px 3px #000)}
.hud-character>strong{display:block;font:12px Georgia,serif;background:linear-gradient(90deg,#501c23,#9a4249,#501c23);border:1px solid #957c50;position:relative;margin:-10px 0 0;padding:3px;color:#fff}
.hud-character>span{font-size:9px;color:#b7a889}
.hud-center{min-width:0}
.hud-resources{display:flex;flex-wrap:wrap;gap:5px 11px;align-items:center;color:#c7bfae;font:11px Georgia,serif;margin:0 0 6px;min-height:18px}
.hud-resources>span{display:flex;align-items:center;gap:4px;white-space:nowrap}
.resource-gem{display:inline-block;width:9px;height:9px;border:1px solid #444;transform:rotate(45deg);background:#343430}
.hud-action-resource .available{background:var(--hud-green);border-color:#b1d19f;box-shadow:0 0 6px #86b66b66}
.hud-reaction-resource .available{background:#a38ac8;border-color:#c3a6e4}
.hud-resolve-resource b{color:#87c9ed;background:#243d53;border:1px solid #598ba8;min-width:16px;text-align:center;border-radius:50%}
.hud-move-resource{color:#c7bc84}
.hud-target-controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:4px;font-size:10px}
.hud-target-controls label{display:flex;align-items:center;gap:5px;min-width:0}
.hud-target-controls select{max-width:185px;padding:3px 5px;font-size:11px;min-width:0;background:#121416;border:1px solid #66583f;color:#d0c7b5}
.hud-target-controls>span{font-size:9px;color:#929084}
.hud-action-scroll{height:96px;overflow:auto;scrollbar-width:thin;scrollbar-color:#887149 #161617;display:flex;gap:5px;flex-wrap:wrap;align-content:start;padding:3px 0}
.hud-action-scroll .expanded-action-grid,.hud-tile-grid{display:flex;flex-wrap:wrap;gap:4px;margin:0;align-content:start}
.hud-group-label{display:none}
.hud-tile{width:46px;height:48px;flex:0 0 46px;position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:2px;border:1px solid #85704c;background:linear-gradient(135deg,#36362f,#101417);border-radius:2px;box-shadow:inset 0 0 0 2px #151617,0 1px 3px #0008;color:#dfd4b8}
.hud-tile img,.hud-tile>svg{width:38px;height:38px;object-fit:contain}
.hud-tile>svg{stroke:#b5c5ca;stroke-width:1.5;fill:#25404b44}
.hud-tile-label{position:absolute;bottom:1px;left:1px;right:1px;background:#0a0b0dd9;font:8px/1.15 Georgia,serif;max-height:18px;overflow:hidden;text-align:center;color:#eee7d3;padding:1px}
.hud-tile.ready:hover,.hud-tile:focus-visible{border-color:#ead493;background:#47412c;outline:2px solid #ba9b5a;outline-offset:1px}
.hud-tile.blocked{filter:grayscale(.75);opacity:.45;cursor:help}
.hud-tile.blocked:focus-visible,.hud-tile.blocked:hover{opacity:.85}
.hud-tile.equipped{border-color:#87bfae;box-shadow:inset 0 0 0 1px #6f9c8c}
.hud-quantity{position:absolute;right:1px;top:0;padding:1px 3px;background:#142d3c;border:1px solid #7a8f99;font:11px Georgia,serif;color:#fff}
.hud-equipped-mark{position:absolute;top:0;left:2px;color:#b0d5ac;font-size:10px}
.hud-tabs{display:flex;gap:3px;align-items:center;margin-top:4px;border-top:1px solid #53462e;padding-top:4px;overflow:auto;scrollbar-width:none}
.hud-tabs button{background:#22211c;border:1px solid #736243;border-radius:12px;padding:4px 9px;white-space:nowrap;font:11px var(--serif);color:#b7ab8f}
.hud-tabs .selected{background:linear-gradient(#645333,#322b1d);border-color:#cbb784;color:#fff0ca}
.hud-turn-controls{display:flex;flex-direction:column;align-items:center;gap:4px}
.hud-end-turn{width:76px;height:76px;border:3px solid #b29b62;border-radius:50%;background:radial-gradient(circle,#287089 0%,#174153 50%,#0b171c 65%);box-shadow:0 0 0 2px #181b1c,0 0 0 4px #625236,inset 0 0 0 2px #7db4bf,inset 0 0 15px #6cb7c744;color:#e0edf1;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}
.hud-end-turn span,.hud-end-turn strong{font:15px/1 var(--serif)}
.hud-end-turn small{font:8px Georgia,serif;margin-top:5px;color:#a5c2cc}
.hud-end-turn:hover:not(:disabled){filter:brightness(1.3);box-shadow:0 0 0 2px #101c20,0 0 0 4px #b79855,0 0 15px #70b7ce77}
.hud-end-turn:disabled{filter:grayscale(.9);opacity:.5;cursor:not-allowed}
.hud-tooltip{display:none;position:absolute;left:70px;bottom:calc(100% + 6px);width:min(390px,calc(100% - 75px));padding:13px 16px;background:#11151af5;border:1px solid #9e8554;box-shadow:0 5px 20px #000b;pointer-events:none;z-index:30;color:#ddd1b8}
.combat-hud:has(.hud-tile:hover) .hud-tooltip,.combat-hud:has(.hud-tile:focus-visible) .hud-tooltip{display:block}
.hud-tooltip strong{font:20px var(--serif)}
.hud-tooltip p{font:13px/1.6 Georgia,serif;color:#c4c5c5;margin:7px 0 0}
.hud-feedback{font-size:11px;line-height:1.4;color:#c2bcac;padding:5px 2px;max-height:40px;overflow:auto}
.hud-feedback.blocked{color:#e2a7a2}
.hud-inventory-note{font:10px/1.5 Georgia,serif;color:#b2ac9f;margin:3px 0}
.hud-action-scroll .field-help,.hud-action-scroll .notice{font-size:12px;margin:3px;padding:5px;line-height:1.5}
.hud-action-scroll .form-field{display:flex;align-items:center;gap:5px;font-size:10px;margin:0;width:100%}
.hud-action-scroll .form-field select{font-size:10px;padding:3px}
.hud-match-menu{position:absolute;right:2px;top:-20px;font-size:10px;color:#aaa18e}
.hud-match-menu[open]{background:#171717;border:1px solid #79633e;padding:8px;z-index:30}
.hud-match-menu summary{cursor:pointer}
.hud-reaction-window .expanded-reaction-prompt{padding:8px 12px;margin:0 0 8px;border-color:#bd9f64}
.hud-reaction-window h2{font-size:19px;margin:0}
.hud-reaction-window p{font-size:11px;margin:3px 0;line-height:1.3}
.hud-reaction-window .button{padding:5px 8px;font-size:12px}
.hud-reaction-window .eyebrow,.hud-reaction-window .field-help{display:none}
@media(max-width:1050px){.arena-hud-layout{grid-template-columns:minmax(0,1fr) 190px;gap:8px}.hud-main{grid-template-columns:48px minmax(0,1fr) 64px;gap:5px}.hud-character-portrait{width:47px;height:62px}.hud-end-turn{width:61px;height:61px}.hud-end-turn span,.hud-end-turn strong{font-size:13px}.hud-action-scroll{height:108px}.hud-tile{width:42px;height:46px;flex-basis:42px}.hud-tile img{width:35px;height:35px}.combat-active-name strong{max-width:260px}}
@media(max-width:850px){.arena-hud-layout{display:block}.combat-live .arena-hud-layout{height:auto;min-height:0}.arena-stage{height:calc(100dvh - 225px);min-height:420px}.combat-sidebar{height:auto;max-height:420px;margin-top:10px;display:grid;grid-template-columns:1fr 1fr}.combat-sidebar .arena-live-log{grid-column:1/-1;max-height:220px}.combat-turn-strip{height:65px}.combat-active-sprite .race-sprite{height:75px}.combat-active-name strong{font-size:18px}.combat-heading h1{font-size:19px}.combat-heading{flex-wrap:wrap}.hud-action-scroll{height:100px}.hud-target-controls>span{display:none}}
@media(max-width:520px){body:has(.combat-live) .content{padding:8px}.combat-initiative{gap:3px}.initiative-portrait{width:28px;height:45px}.initiative-portrait .race-sprite{width:23px;height:37px}.combat-active-sprite{width:40px}.combat-active-name strong{max-width:180px;font-size:17px}.combat-active-name>span{font-size:10px}.hud-main{grid-template-columns:minmax(0,1fr) 57px}.hud-character{display:none}.hud-end-turn{width:53px;height:53px;border-width:2px}.hud-end-turn span,.hud-end-turn strong{font-size:12px}.hud-resources{font-size:10px;gap:4px 7px}.hud-tabs button{font-size:10px;padding:4px 7px}.hud-target-controls select{max-width:190px}.hud-tile{width:42px;height:44px}.hud-action-scroll{height:95px}.hud-tooltip{left:5px;width:calc(100% - 10px)}.arena-stage{min-height:420px}.hud-movement-row .path-preview{font-size:9px}.arena-stage .arena-legend{font-size:8px}.combat-sidebar{grid-template-columns:1fr}.combat-sidebar .arena-live-log{grid-column:auto}}

.hud-resources>.hud-health-resource{display:none}
@media(max-width:520px){.hud-resources>.hud-health-resource{display:flex;color:#e3a8ac}}
.arena-visual{image-rendering:pixelated;background:#26301b}
.arena-visual .arena-floor{fill:url(#arena-grass);stroke:#75905b22;stroke-width:.6}
.arena-visual .arena-rough{fill:url(#arena-mud);stroke:#9b735c55;stroke-width:.7}
.arena-visual .arena-wall{fill:url(#arena-wall);stroke:#19191b;stroke-width:2}
.arena-visual .arena-tree-tile{fill:url(#arena-grass);stroke:#374723}
.arena-tree-art{image-rendering:pixelated}
.combat-sidebar .combat-log-event{display:block;border:1px solid #50483d;border-left:3px solid #96805a;background:#1c1c1d;margin:0 0 9px;padding:9px}
.combat-sidebar .combat-log-heading{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.combat-sidebar .combat-log-heading>span:last-child{font-size:13px;color:#e1d5b8}
.combat-sidebar .combat-log-event>p{font-size:12px;line-height:1.65;margin:7px 0 0;white-space:pre-wrap}
.combat-log-target{color:#bca79b!important;font-size:11px!important}
.combat-log-event.log-initiative{border-left-color:#b8a4d3}
.combat-log-event.log-reaction_available{border-left-color:#e3bb60;background:#30291c}

.arena-token.token-down{opacity:.35;filter:grayscale(1)}

.equipped-weapon-art{image-rendering:pixelated}.combat-active-sprite .equipped-portrait{width:70px;height:80px;max-width:none}

.ancestry-condition rect{fill:#291a1b;stroke:#d29e9e;stroke-width:.6}.ancestry-condition text{fill:#f6c9ce;font:7px monospace}.ancestry-condition.werewolf rect{fill:#29251a;stroke:#d1b77c}.ancestry-condition.werewolf text{fill:#f0dda9}