.card{position:relative}.card>span,.card>strong,.card-repeat{z-index:1}.battle-stage,.field{background:#102d3a!important}.battle-stage{isolation:isolate}.workspace>.hand-dock{grid-template-columns:minmax(0,1fr)}.battle-stage .starter-feature{position:absolute;right:10px;bottom:88px;margin:0;padding:0;z-index:35;pointer-events:none;display:flex;flex-direction:column;gap:3px;align-items:center;width:var(--playing-card-width)}.battle-stage .starter-feature>.card{width:var(--playing-card-width);height:var(--playing-card-height);font-size:var(--playing-card-font);padding:var(--playing-card-padding);border:2px solid #d1cbbf;border-radius:7px;box-sizing:border-box}.battle-stage .starter-feature .card strong{font-size:var(--playing-card-suit)}.battle-stage .starter-feature .eyebrow{font-size:9px}.hull-corner{position:absolute;bottom:5px;z-index:34;pointer-events:none;background:#132532e8;border:1px solid #718394;border-radius:5px;padding:6px 8px;min-width:165px;font-size:10px;line-height:1.5}.hull-corner.team-0{left:6px;border-top:3px solid #ed777c}.hull-corner.team-1{right:6px;border-top:3px solid #79a9f0}.hull-corner label{display:flex;gap:10px;justify-content:space-between}.hull-corner>b{display:block;font-size:11px}.hull-corner strong{font-variant-numeric:tabular-nums}.results-scroll>table tbody tr:nth-child(-n+2){font-size:15px;color:#f4d79d;background:#314046}.results-scroll [data-count-up]{font-variant-numeric:tabular-nums}.workspace>.secondary[open]{position:fixed;inset:10vh 4vw auto;max-height:80vh;overflow:auto;z-index:150;padding:20px;background:#15232dfc;box-shadow:0 0 0 100vmax #0008}.secondary[open] .battle-rows{height:45vh;max-height:45vh;overflow:auto;scrollbar-width:auto;overscroll-behavior:contain}.phase-intro{position:absolute;left:15%;right:15%;top:35%;z-index:95;text-align:center;background:#152632ed;border:1px solid #bdab7c;padding:14px;font-size:19px;pointer-events:none;animation:phase-intro 1800ms both}.starter-reveal{position:absolute;left:50%;top:45%;z-index:100;pointer-events:none;animation:starter-settle 2400ms both}.starter-flip{width:76px;height:104px;transform-style:preserve-3d;animation:starter-flip 2400ms both}.starter-flip>.card{position:absolute;inset:0;width:76px;height:104px;backface-visibility:hidden;box-sizing:border-box;font-size:23px}.starter-flip>.card:not(.card-back){transform:rotateY(180deg)}.starter-flip>.card-back{display:grid;place-items:center;background:#203951;border:3px double #cab986}.starter-flip strong{font-size:29px}#deployment-drag{position:fixed;top:0;left:0;z-index:9999;pointer-events:none}#deployment-drag .card{width:76px;height:104px;box-sizing:border-box;box-shadow:0 8px 16px #0008}[data-packet]{touch-action:none}.command-station svg{display:block}.phase-intro,.starter-reveal svg{pointer-events:none}
@keyframes phase-intro{0%,100%{opacity:0}15%,80%{opacity:1}}@keyframes starter-flip{0%,20%{transform:rotateY(0)}45%,100%{transform:rotateY(180deg)}}@keyframes starter-settle{0%,65%{transform:translate(-50%,-50%) scale(1.8);opacity:1}95%,100%{left:calc(100% - 48px);top:calc(100% - 140px);transform:translate(-50%,-50%) scale(1);opacity:0}}
@media(prefers-reduced-motion:reduce){.phase-intro{animation:none}.starter-reveal{display:none}}@media(max-width:1400px){.hull-corner{min-width:142px;font-size:9px;padding:4px 6px}.battle-stage .starter-feature{right:8px;bottom:76px}.phase-header h2{font-size:18px!important}}
.card.ink-blue,.table-card.ink-blue{color:#a62d3d}

.score-card.ink-blue{color:#a62d3d}.hand-card:has([data-packet]:active){z-index:40;filter:brightness(1.08)}

/* Shared face boundary applies to every renderer variant, including score/table cards. */
[data-card-face]{position:relative;isolation:isolate;overflow:hidden;contain:paint;container-type:inline-size}
[data-card-face]>.card-rank{position:absolute;inset:7% auto auto 9%;margin:0;line-height:1;pointer-events:none}
[data-card-face]>.card-suit{position:absolute;inset:auto 8% 6% auto;margin:0;line-height:1;pointer-events:none}
[data-card-face]>svg.nautical-card-icon{position:absolute;inset:auto;left:50%;top:50%;width:40%;height:40%;max-width:34px;max-height:34px;transform:translate(-50%,-50%);display:block;pointer-events:none;opacity:.85}
[data-card-face][data-card-size=small]>svg.nautical-card-icon{display:none}
@container (max-width:52px){[data-card-face]>svg.nautical-card-icon{display:none}}
/* Suit ink is independent of team ownership; team labels remain unchanged. */
:is(.card,.score-card,.table-card,.history-card)[data-card-face][data-owner]{background:var(--cream,#f0efea);color:#111922!important}
:is(.card,.score-card,.table-card,.history-card)[data-card-face][data-owner]:is(.ink-red,.ink-blue){color:#bd263e!important}
.boatswain>.command-station{font-size:0!important;pointer-events:none}
.boatswain>.command-station::after{content:"";display:block;width:22px;height:22px;max-width:22px;max-height:22px;background:var(--command-team);pointer-events:none;mask:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round'%3E%3Ccircle cx='16' cy='16' r='9'/%3E%3Ccircle cx='16' cy='16' r='3'/%3E%3Cpath d='M16 2v11m0 6v11M2 16h11m6 0h11M6 6l8 8m4 4 8 8M6 26l8-8m4-4 8-8'/%3E%3C/g%3E%3C/svg%3E")}

:is(.card,.score-card,.table-card,.history-card)[data-card-face][data-owner].ink-black{color:#111922!important}

/* Cylinder diameter and height come from the authoritative projection tile size. */
.mast-marker{position:absolute;left:0;top:0;width:var(--mast-diameter);margin-left:calc(var(--mast-diameter) / -2);margin-top:calc(var(--mast-height) * -1);color:var(--mast-team);text-align:center;pointer-events:auto;line-height:1;cursor:help}
.mast-cylinder{display:block;position:relative;width:var(--mast-diameter);height:var(--mast-height);border:1px solid #344149;border-radius:0 0 45% 45%;background:linear-gradient(90deg,#69777e 0 48%,#46535a 50% 100%);box-shadow:0 1px 1px #0004;pointer-events:none}
.mast-cylinder-top{position:absolute;left:-1px;right:-1px;top:calc(var(--mast-ellipse) / -2);height:var(--mast-ellipse);border:1px solid #9aa7ac;border-radius:50%;background:#839198;pointer-events:none}
.mast-cylinder::after{content:'';position:absolute;left:25%;right:25%;bottom:1px;height:2px;background:var(--mast-team);pointer-events:none}
.mast-marker small{position:relative;display:block;left:50%;width:max-content;transform:translateX(-50%);font:8px Consolas,monospace;background:#14202aed;padding:1px 2px;white-space:nowrap;pointer-events:none}
.mast-marker.wreck{margin-top:calc(var(--mast-height) * -.5)}.mast-marker.wreck .mast-cylinder{height:calc(var(--mast-height) * .5);background:#343e43}.mast-marker.wreck .mast-cylinder-top{background:#4f5d63;clip-path:polygon(0 30%,20% 5%,38% 40%,60% 0,80% 35%,100% 10%,100% 100%,0 100%)}.mast-marker.wreck .mast-cylinder::before{content:'';position:absolute;left:35%;top:0;height:70%;border-left:1px solid #242d32;transform:rotate(20deg)}.mast-marker:focus-visible{outline:2px solid #e4ca91}
.mast-status-row{display:flex;justify-content:space-between;gap:4px}.fleet-command>b{display:block;margin-bottom:3px}.fleet-command{font-size:10px;line-height:1.6}

:root{--corner-status-height:76px}
.hull-corner{height:var(--corner-status-height);box-sizing:border-box;padding:5px 8px}
.hull-corner .resource-progress{display:block;width:100%;height:5px;margin:2px 0 0;appearance:none;border:0;border-radius:2px;overflow:hidden;background:#34434e;accent-color:#dc9298}
.hull-corner .resource-progress::-webkit-progress-bar{background:#34434e;border-radius:2px}.hull-corner .resource-progress::-webkit-progress-value{background:#dc9298}.hull-corner .resource-progress::-moz-progress-bar{background:#dc9298}
.hull-corner.team-1 .resource-progress{accent-color:#91b6e2}.hull-corner.team-1 .resource-progress::-webkit-progress-value{background:#91b6e2}.hull-corner.team-1 .resource-progress::-moz-progress-bar{background:#91b6e2}

.battle-stage .starter-feature{bottom:calc(var(--corner-status-height) + 13px)}
@media(max-width:1400px){:root{--corner-status-height:70px}.hull-corner{padding:4px 6px}}

/* One bounded stack for troops; one topmost, input-transparent combat-text surface. */
.battle-stage>.troop-layer{z-index:10}
.battle-stage>#combat-numbers-layer{position:absolute;inset:0;z-index:110;width:100%;height:100%;pointer-events:none;touch-action:none}
