/* A sea chart framed in dark timber; all counts and HP come from the combat engine. */
body#realm-ui #workspace .combat-monitor{--combat-gold:#b99550;--combat-ink:#061c28;color:#fff0ce;background:#081e2b;border:2px solid var(--combat-gold);box-shadow:0 0 0 4px #261b13,0 7px 18px #0007;overflow:visible;margin:6px 0 20px;font-size:14px}
body#realm-ui #workspace .combat-monitor :is(h2,h3,p){margin:0;color:inherit}
body#realm-ui #workspace .combat-monitor h2{font-size:25px;line-height:1.22;color:#ffe2a0}
body#realm-ui #workspace .combat-monitor h3{font-size:16px;line-height:1.4}
body#realm-ui #workspace .combat-monitor small{color:#ebddc2;font-size:12px}
body#realm-ui #workspace .combat-monitor button{font-size:14px;min-height:40px;white-space:normal}
body#realm-ui #workspace .combat-heading{display:grid;grid-template-columns:1fr 1.6fr 1fr;align-items:center;border-bottom:2px solid var(--combat-gold);background:linear-gradient(100deg,#073c62,#071c29 40%,#071c29 60%,#4d181c);padding:12px 18px;gap:14px}
body#realm-ui #workspace .combat-title{text-align:center;padding:8px}
body#realm-ui #workspace .combat-title p{font-size:13px;margin-top:6px;line-height:1.6}
body#realm-ui #workspace .combat-kicker{font-size:10px;letter-spacing:1.2px;color:#efd19b}
body#realm-ui #workspace .combat-kicker button{padding:0;min-height:24px;border:0;border-image:none;background:none;box-shadow:none;color:#efd19b;font-size:11px;text-decoration:underline}
body#realm-ui #workspace .combat-side-title{display:grid;gap:3px;min-width:0}
body#realm-ui #workspace .combat-side-title.hostile{text-align:right}
body#realm-ui #workspace .combat-side-title strong{font-size:16px;overflow-wrap:anywhere}
body#realm-ui #workspace .combat-side-title>span>b{font-size:28px;font-variant-numeric:tabular-nums}
body#realm-ui #workspace .combat-side-title>small{font-size:10px;letter-spacing:1.2px}
body#realm-ui #workspace .combat-tabs{display:flex;gap:8px;align-items:center;padding:6px 14px;background:#191915 url('/art/interface/cabin-timber.webp') center/cover;border-bottom:1px solid var(--combat-gold);position:relative;z-index:2}
body#realm-ui #workspace .combat-tabs>button{border:1px solid #967646;border-image:none;border-radius:2px;background:#0d2938;color:#fae8c4;box-shadow:inset 0 0 10px #0008;padding:6px 14px;min-height:34px}
body#realm-ui #workspace .combat-tabs>button[aria-pressed=true]{background:#0e5678;border-color:#e2bd71;color:#fff}
body#realm-ui #workspace .combat-info{margin-left:auto;position:relative}
body#realm-ui #workspace .combat-info summary{border:1px solid #b99550;border-radius:50%;width:32px;height:32px;display:grid;place-items:center;cursor:pointer;color:#ffe2a0}
body#realm-ui #workspace .combat-info p{position:absolute;z-index:10;right:0;top:36px;width:300px;max-width:80vw;padding:16px;background:#071b27;border:1px solid #b99550;box-shadow:0 4px 20px #000;font-size:13px;line-height:1.7}
body#realm-ui #workspace .combat-arena{display:grid;grid-template-columns:1fr 1fr;background:linear-gradient(#04436722,#00203d22),url('/art/battle/sea.webp') center/cover;position:relative;gap:20px;padding:14px 20px;max-height:432px;overflow-y:auto;scrollbar-color:#b99550 #072737}
body#realm-ui #workspace .combat-side{display:grid;grid-auto-rows:98px;align-content:start;gap:8px;min-width:0}
body#realm-ui #workspace .combat-squad{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:8px;text-align:left;width:100%;min-width:0;padding:6px 10px;border:1px solid #a88b59;border-image:none;border-radius:2px;background:linear-gradient(90deg,#062d4d80,#071d2beF 60%);color:#fff1cf;box-shadow:0 2px 5px #0008;cursor:pointer;position:relative}
body#realm-ui #workspace .hostile .combat-squad{background:linear-gradient(90deg,#461d25a8,#21171deF 60%)}
body#realm-ui #workspace .combat-squad.selected{outline:2px solid #ffe2a0;outline-offset:-3px;border-color:#ffe2a0;box-shadow:inset 0 0 15px #e9c27344,0 0 10px #081b2a}
body#realm-ui #workspace .combat-squad-art{height:83px;position:relative;display:flex;align-items:center;justify-content:center;min-width:0;overflow:hidden}
body#realm-ui #workspace .combat-squad-art img{height:100%;width:68%;object-fit:contain;filter:drop-shadow(0 2px 1px #001924);max-width:none;margin-left:-26%}
body#realm-ui #workspace .combat-squad-art img:first-child{margin-left:0}
body#realm-ui #workspace .hostile .combat-squad-art{transform:scaleX(-1)}
body#realm-ui #workspace .combat-squad-copy{min-width:0;display:grid;gap:3px}
body#realm-ui #workspace .combat-squad-copy>strong{font-size:15px;line-height:1.1}
body#realm-ui #workspace .combat-count{font-size:23px;line-height:1.1;font-variant-numeric:tabular-nums}
body#realm-ui #workspace .combat-health{display:block;position:relative;isolation:isolate;height:17px;border:1px solid #b99550;border-radius:2px;background:#04121b;overflow:hidden;min-width:45px}
body#realm-ui #workspace .combat-health i{position:absolute;inset:0 auto 0 0;background:linear-gradient(#4baf91,#15725f);z-index:-1}
body#realm-ui #workspace .combat-health.damaged i{background:linear-gradient(#c18c31,#95601a)}
body#realm-ui #workspace .combat-health.critical i{background:linear-gradient(#ca4b41,#8e211f)}
body#realm-ui #workspace .combat-health b{display:block;text-align:center;color:#fff;font-size:11px;line-height:15px;text-shadow:0 1px 2px #000,0 0 2px #000}
body#realm-ui #workspace .combat-vacant{align-self:start;padding:20px;background:#062638dd;text-align:center}
body#realm-ui #workspace .combat-fort{display:flex;align-items:center;gap:12px;padding:8px 16px;font-size:12px;border-top:1px solid #b99550;border-bottom:1px solid #6a5734;background:#132631}
body#realm-ui #workspace .combat-fort>.combat-health{width:100px}
body#realm-ui #workspace .combat-fort>span:last-child{margin-left:auto;font-size:11px}
body#realm-ui #workspace .combat-unit-detail{padding:10px 14px;background:linear-gradient(#0e2a37,#071c28)}
body#realm-ui #workspace .combat-unit-detail>header{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:8px}
body#realm-ui #workspace .combat-unit-detail>header>span{font-size:12px;white-space:nowrap}
body#realm-ui #workspace .combat-units{display:grid;grid-template-columns:30px 1fr 30px;gap:8px;align-items:stretch}
body#realm-ui #workspace .combat-units>button{padding:0;border:1px solid #b99550;border-image:none;background:#112c39;color:#ffdda1;border-radius:2px;font-size:28px}
body#realm-ui #workspace .combat-unit-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;min-width:0}
body#realm-ui #workspace .combat-unit{margin:0;padding:4px;display:flex;gap:3px;align-items:center;min-width:0;border:1px solid #5a7c8a;border-radius:2px;background:#061822;box-shadow:inset 0 0 8px #0009}
body#realm-ui #workspace .combat-unit>img{width:47%;height:55px;object-fit:contain}
body#realm-ui #workspace .combat-unit>div{flex:1;min-width:0}
body#realm-ui #workspace .combat-unit strong{font-size:12px;display:block;margin-bottom:3px}
body#realm-ui #workspace .combat-unit small{font-size:10px;display:block;margin-top:4px;line-height:1.3}
body#realm-ui #workspace .combat-monitor .lost img{filter:grayscale(1);opacity:.6}
body#realm-ui #workspace .combat-actions{display:flex;justify-content:flex-end;gap:10px;padding:8px 14px;background:#251b14;border-top:1px solid #b99550;border-bottom:1px solid #b99550}
body#realm-ui #workspace .combat-actions button{padding:6px 20px;min-height:42px}
body#realm-ui #workspace .combat-actions .combat-retreat{background-color:#70261d;color:#fff0ce}
body#realm-ui #workspace .combat-log{padding:12px 16px}
body#realm-ui #workspace .combat-log h3{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-bottom:8px}
body#realm-ui #workspace .combat-log ol{list-style:none;margin:0;padding:0;max-height:140px;overflow:auto;scrollbar-color:#b99550 #071c28}
body#realm-ui #workspace .combat-log li{display:grid;grid-template-columns:50px 32px 1fr;gap:8px;padding:5px 7px;font-size:12px;line-height:1.5}
body#realm-ui #workspace .combat-log li:nth-child(odd){background:#ffffff08}
body#realm-ui #workspace .combat-log li time{color:#dbc595}
body#realm-ui #workspace .combat-replay{border-top:1px solid #6a5734;padding:10px 16px;font-size:13px}
body#realm-ui #workspace .combat-replay summary{cursor:pointer;color:#f0d298;min-height:30px}
body#realm-ui #workspace .combat-unavailable{padding:60px 30px;background:linear-gradient(#051e39b0,#061b2bf0),url('/art/battle/sea.webp') center/cover;text-align:center}
body#realm-ui #workspace .combat-picker{display:flex;gap:12px;align-items:center;margin:8px 0 12px}
body#realm-ui #workspace .combat-picker select{max-width:100%;min-width:0;flex:1}
@media(max-width:1200px){body#realm-ui #workspace .combat-unit{display:block;text-align:center}body#realm-ui #workspace .combat-unit>img{width:80%;height:40px}body#realm-ui #workspace .combat-unit-cards{gap:4px}body#realm-ui #workspace .combat-arena{padding:12px;gap:12px}body#realm-ui #workspace .combat-squad{grid-template-columns:1fr 1fr;padding:6px}}
@media(max-width:600px){
body#realm-ui #workspace .combat-monitor{margin:6px 0 12px;font-size:13px}
body#realm-ui #workspace .combat-heading{grid-template-columns:1fr 1fr;gap:5px 12px;padding:8px 10px}
body#realm-ui #workspace .combat-title{grid-column:1/-1;grid-row:1;padding:2px 0 8px;border-bottom:1px solid #a1824b77}
body#realm-ui #workspace .combat-monitor h2{font-size:19px}
body#realm-ui #workspace .combat-kicker{display:none}
body#realm-ui #workspace .combat-title p{font-size:12px;margin-top:3px}
body#realm-ui #workspace .combat-side-title{gap:1px}
body#realm-ui #workspace .combat-side-title strong{font-size:13px}
body#realm-ui #workspace .combat-side-title>span{font-size:12px}
body#realm-ui #workspace .combat-side-title>span>b{font-size:22px}
body#realm-ui #workspace .combat-side-title>small{font-size:9px}
body#realm-ui #workspace .combat-tabs{padding:5px;gap:5px}
body#realm-ui #workspace .combat-tabs>button{padding:4px 8px;font-size:12px;min-height:40px}
body#realm-ui #workspace .combat-arena{padding:7px;gap:7px;max-height:338px}
body#realm-ui #workspace .combat-side{grid-auto-rows:102px;gap:6px}
body#realm-ui #workspace .combat-squad{display:block;padding:6px;overflow:hidden}
body#realm-ui #workspace .combat-squad-art{position:absolute;left:0;top:26px;width:65%;height:64px}
body#realm-ui #workspace .combat-squad-art img{width:100%;margin:0}
body#realm-ui #workspace .combat-squad-art img:not(:first-child){display:none}
body#realm-ui #workspace .combat-squad-copy{display:grid;grid-template-columns:1fr;gap:2px;position:relative}
body#realm-ui #workspace .combat-squad-copy>strong{font-size:12px;line-height:1.2;min-height:15px}
body#realm-ui #workspace .combat-count{font-size:20px;text-align:right;height:41px;padding-top:4px;text-shadow:0 2px 3px #001421}
body#realm-ui #workspace .combat-count small{display:block;font-size:10px}
body#realm-ui #workspace .combat-squad-copy>small{font-size:9px;white-space:nowrap}
body#realm-ui #workspace .combat-health{height:16px}
body#realm-ui #workspace .combat-health b{font-size:10px;line-height:14px}
body#realm-ui #workspace .combat-fort{padding:6px 8px;font-size:10px;gap:7px}
body#realm-ui #workspace .combat-fort>span:last-child:not(.combat-governor){display:none}
body#realm-ui #workspace .combat-fort>.combat-health{flex:1}
body#realm-ui #workspace .combat-unit-detail{padding:8px 6px}
body#realm-ui #workspace .combat-unit-detail h3{font-size:12px}
body#realm-ui #workspace .combat-unit-detail h3 small{display:none}
body#realm-ui #workspace .combat-unit-detail>header>span{font-size:10px}
body#realm-ui #workspace .combat-units{grid-template-columns:25px 1fr 25px;gap:4px}
body#realm-ui #workspace .combat-unit-cards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:5px;padding-bottom:4px}
body#realm-ui #workspace .combat-unit{flex:0 0 77px;scroll-snap-align:start;padding:3px}
body#realm-ui #workspace .combat-unit>img{height:43px;width:100%}
body#realm-ui #workspace .combat-unit small{font-size:9px}
body#realm-ui #workspace .combat-actions{position:sticky;bottom:calc(66px + env(safe-area-inset-bottom));z-index:3;padding:6px;gap:5px;box-shadow:0 -4px 12px #0004}
body#realm-ui #workspace .combat-actions button{flex:1;font-size:12px;min-height:44px;padding:4px 5px}
body#realm-ui #workspace .combat-log{padding:10px 8px}
body#realm-ui #workspace .combat-log h3{font-size:14px}
body#realm-ui #workspace .combat-log h3 small{font-size:10px}
body#realm-ui #workspace .combat-log li{grid-template-columns:37px 22px 1fr;gap:4px;font-size:11px;padding:4px 0}
body#realm-ui #workspace .combat-replay{padding:8px;font-size:12px}
}
body#realm-ui[data-view=battles] #workspace .page-heading,body#realm-ui[data-view=battles] #workspace .activity-bar:has([data-session-view=battles]):not(:has([data-session-view=fleets])){display:none}
body#realm-ui #workspace .combat-side-title>span{line-height:1.15}
body#realm-ui #workspace .combat-info summary{min-height:32px}
body#realm-ui #workspace .combat-units>button{min-width:0}
body#realm-ui #workspace .combat-side{grid-auto-rows:88px}
body#realm-ui #workspace .combat-arena{max-height:396px}
body#realm-ui #workspace .combat-squad-art{height:73px}
@media(max-width:600px){
body#realm-ui #workspace .combat-side{grid-auto-rows:108px}
body#realm-ui #workspace .combat-arena{max-height:354px}
body#realm-ui #workspace .combat-squad-art{height:48px;top:22px;width:60%}
body#realm-ui #workspace .combat-squad-copy>small{font-size:10px;white-space:normal;line-height:1.25}
body#realm-ui #workspace .combat-info summary{min-height:40px;width:40px;height:40px}
}
body#realm-ui #workspace .combat-side-title>*{margin:0;line-height:1.2}
body#realm-ui #workspace .combat-squad-copy>small{line-height:1.15}
body#realm-ui #workspace .combat-side{grid-auto-rows:96px}
body#realm-ui #workspace .combat-arena{max-height:424px}
@media(max-width:600px){body#realm-ui #workspace .combat-side{grid-auto-rows:108px}body#realm-ui #workspace .combat-arena{max-height:354px}}
body#realm-ui #workspace .combat-log li small{display:block;font-size:11px;color:#dcc69e}
body#realm-ui #workspace .combat-incoming{display:flex;justify-content:space-between;gap:8px;padding:8px 14px;font-size:12px;background:#163e4a;color:#fff1c5;border-bottom:1px solid #b99550}
@media(max-width:600px){body#realm-ui #workspace .combat-incoming{display:grid;padding:7px 8px;font-size:11px}}

/* Governor siege status must remain readable in the compact and mobile monitors. */
:root body#realm-ui[data-ui-theme] #workspace #content-page .combat-fort:has(.combat-governor){flex-wrap:wrap}
:root body#realm-ui[data-ui-theme] #workspace #content-page .combat-fort>.combat-governor{display:block;flex-basis:100%;margin:0;font-size:12px;line-height:1.4;color:#ffe7b2}
