/* M10: shared maps (other commanders) and weekly races. */

/* ---------- other commanders on the maps ---------- */
.map-ship.other { opacity: .78; }
.map-ship.other.ally { opacity: .95; }
.map-ship.other.ally .ship-halo { box-shadow: 0 0 0 1.5px rgba(143,227,222,.8); }
.map-ship.other.sel { opacity: 1; }
.other-tag .map-eta { font-size: 9px; opacity: .85; }
.map-others { display: inline-flex; align-items: center; gap: 2px; margin-top: 2px; padding: 0 4px; font: 700 8px var(--sw-font-body); letter-spacing: 1px;
  color: #F2E6CF; background: rgba(27,42,65,.85); border: 1px solid rgba(242,230,207,.4); border-radius: 6px; }
.map-others svg { width: 8px; height: 8px; fill: none; stroke: currentColor; stroke-width: 1.2; }
.map-others.ally { color: #0b1a1a; background: var(--sw-teal-light); border-color: var(--sw-teal-light); }
.other-panel { border-color: #6b7380; }
.other-panel.ally { border-color: var(--sw-teal); box-shadow: 4px 4px 0 var(--sw-teal); }
.also-here { font-size: 10px; letter-spacing: .5px; margin-top: 4px; }
.also-here span { display: inline-block; margin-right: 6px; font-weight: 700; }
.also-here span.ally { color: var(--sw-teal); }

/* globe pins for other commanders */
.g-pin.ally .g-pin-dot, .g-pin-dot.static.ally { background: var(--sw-teal-light); box-shadow: 0 0 0 3px rgba(143,227,222,.35), 0 0 14px 3px rgba(143,227,222,.6); }
.g-pin.other .g-pin-dot, .g-pin-dot.static.other { width: 10px; height: 10px; left: -5px; top: -5px; background: #F2E6CF; box-shadow: 0 0 0 2px rgba(242,230,207,.3); animation: none; }
.g-pin-dot.static.other { left: 0; top: 0; }
.g-pin.ally .g-pin-label, .g-pin.other .g-pin-label { left: auto; right: 12px; top: 2px; border-left: 0; border-right: 3px solid var(--sw-teal-light); text-align: right; }
.g-pin.ally .g-pin-label b { color: var(--sw-teal-light); }
.g-pin.other .g-pin-label { border-right-color: #F2E6CF; opacity: .85; }
.g-pin.other .g-pin-label b { color: #F2E6CF; font-size: 14px; }

.race-medal { flex: none; }

/* ---------- season liveries ---------- */
.livery.season { box-shadow: inset 0 0 0 3px rgba(255,255,255,.55); }
.livery.locked { display: inline-flex; align-items: center; justify-content: center; opacity: .45; cursor: not-allowed; color: #fff; }

/* ---------- race banner on the base ---------- */
.race-banner { display: flex; gap: 12px; align-items: center; padding: 10px 12px; margin-bottom: 8px; border: 3px solid var(--sw-ink); background: var(--sw-ink);
  color: var(--sw-paper); text-decoration: none; box-shadow: 4px 4px 0 var(--sw-mustard); }
.race-banner small { display: block; font-size: 8px; font-weight: 700; letter-spacing: 1px; color: var(--sw-mustard); }
.race-banner b { display: block; font-size: 24px; line-height: 1; }
.race-banner .link-btn { color: var(--sw-paper); font-size: 10px; }

/* ---------- races page ---------- */
.race-card { padding: 14px; display: flex; flex-direction: column; gap: 12px; }
.race-head { display: flex; gap: 12px; align-items: center; }
.race-head h2 { font-size: 34px; line-height: .95; }
.race-head .eyebrow { color: var(--sw-orange-text); }
.race-stats { display: grid; grid-template-columns: 1fr 1fr 1.3fr; gap: 8px; }
.race-stats > div { border: 2px solid var(--sw-ink); padding: 6px 8px; background: var(--sw-paper); min-width: 0; display: flex; flex-direction: column; }
.race-stats small, .race-stats em { font-size: 8px; font-weight: 700; letter-spacing: 1px; font-style: normal; }
.race-stats b { font: 400 28px var(--sw-font-display); letter-spacing: 1px; line-height: 1; }
.race-prize { align-items: center; background: radial-gradient(ellipse at 50% 120%, #10203a, #05070d 75%) !important; color: #F2E6CF; border-color: var(--liv) !important; }
.race-prize em { color: var(--liv); text-align: center; }
.race-time { height: 6px; border: 2px solid var(--sw-ink); background: var(--sw-paper); }
.race-time div { height: 100%; background: var(--sw-orange); }
.board { display: flex; flex-direction: column; border: 3px solid var(--sw-ink); background: var(--sw-paper-light); }
.board-row { display: grid; grid-template-columns: 34px 1fr auto; gap: 8px; align-items: center; padding: 7px 10px; border-bottom: 1px solid rgba(27,42,65,.18); font-size: 12px; }
.board-row:last-child { border-bottom: 0; }
.board-row .rank { font: 400 22px var(--sw-font-display); text-align: center; }
.board-row.r1 .rank { color: #B8860B; } .board-row.r2 .rank { color: #6B7380; } .board-row.r3 .rank { color: #A0522D; }
.board-row .who { min-width: 0; display: flex; gap: 4px; align-items: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.board-row .who small { font-size: 9px; color: #4a5468; margin-left: 4px; }
.board-row .tag { border: 2px solid var(--sw-ink); padding: 0 3px; font-size: 9px; }
.board-row .score { font: 400 20px var(--sw-font-display); letter-spacing: 1px; }
.board-row .score small { font: 700 8px var(--sw-font-body); letter-spacing: 1px; }
.board-row.me { background: var(--sw-mustard); }
.board-row.ally { background: rgba(46,140,138,.14); }
.board-gap { text-align: center; font-size: 14px; line-height: 1; padding: 2px; border-bottom: 1px solid rgba(27,42,65,.18); }
.podium { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; align-items: end; }
.podium .step { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 6px; border: 3px solid var(--sw-ink); background: var(--sw-paper-light); text-align: center; min-width: 0; }
.podium .step b { font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.podium .step small { font-size: 8px; font-weight: 700; letter-spacing: 1px; }
.podium .p1 { order: 2; padding-top: 22px; background: var(--sw-mustard); }
.podium .p2 { order: 1; padding-top: 14px; }
.podium .p3 { order: 3; }
.podium .step.me { box-shadow: 4px 4px 0 var(--sw-orange); }
.trophies { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
.trophy { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 10px 6px; border: 2px solid var(--sw-ink); background: var(--sw-paper-light); text-align: center; }
.trophy b { font: 400 18px var(--sw-font-display); letter-spacing: 1px; }
.trophy small { font-size: 8px; font-weight: 700; letter-spacing: 1px; }
.trophy.patch { border-style: dashed; }
.honours { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.honours span { font-size: 9px; font-weight: 700; letter-spacing: 1px; padding: 1px 6px; background: var(--sw-mustard); }