/**
 * SkyBioML Shipyard — remap SkyBioML palette (orange/blue → portal red / #0a0a0f).
 * Loaded after app.css; uses SkyBioML semantic classes from colors.less.
 */
:root {
  --sky-bg: #0a0a0f;
  --sky-bg-panel: #121215;
  --sky-bg-elevated: #1a1a1f;
  --sky-bg-slot: rgba(42, 5, 5, 0.92);
  --sky-border: rgba(255, 255, 255, 0.1);
  --sky-fg: #e5e7eb;
  --sky-muted: #9ca3af;
  --sky-primary: #dc2626;
  --sky-primary-bright: #f87171;
  --sky-primary-dark: #991b1b;
  --sky-primary-disabled: #7f1d1d;
  --sky-secondary: #a1a1aa;
  --sky-secondary-disabled: #52525b;
  --sky-warning: #ef4444;
  --sky-warning-disabled: #b91c1c;
  --sky-chrome-h: 48px;
  --sky-font-display: "Audiowide", "Eurostile", sans-serif;
  --sky-font-body: "Play", "Segoe UI", sans-serif;
}

html,
body {
  background-color: var(--sky-bg) !important;
  color: var(--sky-fg) !important;
  font-family: var(--sky-font-body) !important;
  padding-top: var(--sky-chrome-h) !important;
}

body.skybioml-branded {
  padding-top: 0 !important;
}

body.skybioml-branded #coriolis {
  background: radial-gradient(ellipse 120% 80% at 50% -20%, rgba(220, 38, 38, 0.12), transparent 55%),
    var(--sky-bg) !important;
}

/* ── SkyBioML semantic colors ── */
.fg {
  color: var(--sky-fg) !important;
  stroke: var(--sky-fg) !important;
  fill: var(--sky-fg) !important;
}

.muted {
  color: var(--sky-muted) !important;
  stroke: var(--sky-muted) !important;
  fill: var(--sky-muted) !important;
}

.disabled {
  color: #4b5563 !important;
  stroke: #4b5563 !important;
  fill: #4b5563 !important;
}

.primary,
.icon.primary {
  color: var(--sky-primary) !important;
  stroke: var(--sky-primary) !important;
  fill: var(--sky-primary) !important;
}

.primary-bg {
  color: var(--sky-bg-slot) !important;
  stroke: var(--sky-bg-slot) !important;
  fill: var(--sky-bg-slot) !important;
  background-color: var(--sky-bg-slot) !important;
}

.primary-disabled {
  color: var(--sky-primary-disabled) !important;
  stroke: var(--sky-primary-disabled) !important;
  fill: var(--sky-primary-disabled) !important;
}

.secondary {
  color: var(--sky-secondary) !important;
  stroke: var(--sky-secondary) !important;
  fill: var(--sky-secondary) !important;
}

.secondary-disabled {
  color: var(--sky-secondary-disabled) !important;
  stroke: var(--sky-secondary-disabled) !important;
  fill: var(--sky-secondary-disabled) !important;
}

.warning {
  color: var(--sky-primary) !important;
  stroke: var(--sky-primary) !important;
}

body.skybioml-branded #coriolis header .menu-header,
body.skybioml-branded #coriolis header a,
body.skybioml-branded #coriolis header a:visited {
  color: #9ca3af !important;
}

body.skybioml-branded #coriolis header .menu-header > svg,
body.skybioml-branded #coriolis header .menu-header .warning {
  fill: none !important;
  background: transparent !important;
}

body.skybioml-branded #coriolis header .menu-header > svg path {
  fill: currentColor !important;
  stroke: none !important;
}

body.skybioml-branded #coriolis header .sky-nav-builds .menu-header > svg,
body.skybioml-branded #coriolis header .sky-nav-compare .menu-header > svg {
  color: var(--sky-primary) !important;
}

.warning-disabled,
.bg-warning-disabled {
  color: var(--sky-warning-disabled) !important;
  stroke: var(--sky-warning-disabled) !important;
  background-color: var(--sky-warning-disabled) !important;
}

/* ── Top bar layout: skybioml-portal.css (.sky-top-bar) ── */
#skybioml-shipyard-chrome {
  top: 0 !important;
}

body.skybioml-branded #coriolis header .menu-list {
  background-color: var(--sky-bg-panel) !important;
  border: 1px solid var(--sky-border) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6) !important;
}

body.skybioml-branded #coriolis header a.no-touch:hover,
body.skybioml-branded #coriolis header a:hover {
  color: var(--sky-primary-bright) !important;
}

body.skybioml-branded #coriolis header a.active {
  color: #fff !important;
}

body.skybioml-branded #coriolis header hr {
  border-top-color: var(--sky-border) !important;
}

/* ── Ship picker ── */
#shipyard a.ship {
  background: linear-gradient(145deg, var(--sky-bg-elevated), var(--sky-bg-panel)) !important;
  border: 1px solid var(--sky-border) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.35) !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}

#shipyard a.ship:hover {
  border-color: rgba(220, 38, 38, 0.55) !important;
  box-shadow: 0 0 20px rgba(220, 38, 38, 0.2) !important;
}

#shipyard a.ship small {
  color: var(--sky-primary-bright) !important;
}

body.skybioml-branded #coriolis header.sky-top-bar .menu-header.selected {
  background: transparent !important;
  color: #fff !important;
  box-shadow: inset 0 -2px 0 var(--sky-primary), 0 0 12px rgba(220, 38, 38, 0.12) !important;
}

body.skybioml-branded #coriolis header .menu-list a,
body.skybioml-branded #coriolis header .menu-list .block,
body.skybioml-branded #coriolis header .menu-list .name {
  letter-spacing: 0.06em !important;
  transition: color 0.12s, background 0.12s !important;
}

body.skybioml-branded #coriolis header .menu-list a:hover,
body.skybioml-branded #coriolis header .menu-list a.active,
body.skybioml-branded #coriolis header .menu-list .name:hover {
  color: var(--sky-primary-bright) !important;
  background: rgba(255, 255, 255, 0.04) !important;
}

body.skybioml-branded #coriolis header .menu-list hr {
  border-top: 1px solid var(--sky-border) !important;
  opacity: 1 !important;
}

body.skybioml-branded #coriolis header .menu-list table {
  font-family: var(--sky-font-body) !important;
}

body.skybioml-branded #coriolis header .menu-list select {
  background: var(--sky-bg-elevated) !important;
  border: 1px solid var(--sky-border) !important;
  color: var(--sky-fg) !important;
}

/* ── Build name + action bar (#build) ── */
#build input {
  background: var(--sky-bg-panel) !important;
  border: 1px solid var(--sky-border) !important;
  color: var(--sky-fg) !important;
  font-family: var(--sky-font-body) !important;
  letter-spacing: 0.05em !important;
  border-radius: 2px !important;
}

#build input:focus {
  border-color: rgba(220, 38, 38, 0.55) !important;
  color: #fff !important;
  box-shadow: 0 0 0 1px rgba(220, 38, 38, 0.2), 0 0 14px rgba(220, 38, 38, 0.12) !important;
  outline: none !important;
}

#build .build-actions button,
#build button {
  background: linear-gradient(180deg, var(--sky-bg-elevated), var(--sky-bg-panel)) !important;
  border: 1px solid rgba(220, 38, 38, 0.35) !important;
  color: var(--sky-primary) !important;
  transition: border-color 0.15s, background 0.15s, color 0.15s !important;
}

#build .build-actions button:hover,
#build button:hover {
  border-color: var(--sky-primary) !important;
  color: #fff !important;
  background: linear-gradient(180deg, #2a0505, #1a0000) !important;
}

/* ── Outfitting area ── */
#outfit {
  font-family: var(--sky-font-body) !important;
}

#outfit h1,
#outfit h2,
#outfit h3,
.section-menu h1 {
  font-family: var(--sky-font-display) !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

.section-menu.selected h1 {
  background: linear-gradient(90deg, rgba(220, 38, 38, 0.25), transparent) !important;
  color: #fff !important;
  border-left: 3px solid var(--sky-primary) !important;
  padding-left: 0.35em !important;
}

/* ── Module slots (build list) ── */
.slot {
  background-color: var(--sky-bg-slot) !important;
  border: 1px solid rgba(220, 38, 38, 0.22) !important;
  border-radius: 2px !important;
  transition: border-color 0.15s, box-shadow 0.15s, background 0.15s !important;
}

body.skybioml-branded .no-touch .slot .details-container:hover {
  border-color: rgba(220, 38, 38, 0.4) !important;
}

.slot.selected {
  color: var(--sky-fg) !important;
  stroke: var(--sky-fg) !important;
  fill: var(--sky-fg) !important;
  background: linear-gradient(90deg, rgba(220, 38, 38, 0.16), var(--sky-bg-slot) 45%) !important;
  border: 1px solid rgba(220, 38, 38, 0.55) !important;
  box-shadow: inset 3px 0 0 var(--sky-primary), 0 0 14px rgba(220, 38, 38, 0.14) !important;
}

.slot.selected .sz {
  color: var(--sky-primary-bright) !important;
  stroke: var(--sky-primary-bright) !important;
  background: rgba(0, 0, 0, 0.35) !important;
  border-right: 1px solid rgba(220, 38, 38, 0.45) !important;
}

.slot.selected .details {
  background: transparent !important;
}

.slot.eligible {
  border-color: rgba(161, 161, 170, 0.45) !important;
}

.slot.drop {
  border-color: rgba(220, 38, 38, 0.65) !important;
  background: rgba(220, 38, 38, 0.08) !important;
  color: var(--sky-fg) !important;
}

/* ── Module picker chips (class / rating lists) ── */
.compact-module,
.hardpoint-module,
.special-module,
.empty-slot {
  background: var(--sky-bg-panel) !important;
  border: 1px solid var(--sky-border) !important;
  color: var(--sky-muted) !important;
  border-radius: 2px !important;
  font-family: var(--sky-font-body) !important;
  letter-spacing: 0.04em !important;
  transition: border-color 0.12s, color 0.12s, background 0.12s, box-shadow 0.12s !important;
}

.no-touch .compact-module:hover:not(.disabled):not(.active),
.no-touch .hardpoint-module:hover:not(.disabled):not(.active),
.no-touch .special-module:hover:not(.disabled):not(.active),
.no-touch .empty-slot:hover:not(.active) {
  border-color: rgba(220, 38, 38, 0.45) !important;
  color: var(--sky-primary-bright) !important;
}

.compact-module.active,
.hardpoint-module.active,
.special-module.active,
.empty-slot.active {
  background: linear-gradient(180deg, rgba(220, 38, 38, 0.14), var(--sky-bg-elevated)) !important;
  border-color: var(--sky-primary) !important;
  color: #fff !important;
  box-shadow: 0 0 10px rgba(220, 38, 38, 0.18), inset 0 -1px 0 var(--sky-primary) !important;
}

.hardpoint-module.active .mount-icon,
.special-module.active .mount-icon {
  stroke: var(--sky-primary-bright) !important;
}

/* ── Select dropdowns (module lists) ── */
.select .lc.active,
.select .c.active,
.select .rc.active,
.select .r.active {
  background: rgba(220, 38, 38, 0.12) !important;
  color: #fff !important;
  border-left: 2px solid var(--sky-primary) !important;
}

.select .options,
.select .menu-section-wrapper {
  background: var(--sky-bg-panel) !important;
  border: 1px solid var(--sky-border) !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.55) !important;
}

.no-touch .select .lc:hover:not(.disabled),
.no-touch .select .c:hover:not(.disabled) {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--sky-primary-bright) !important;
}

/* ═══════════════════════════════════════════════════════════
   BARS & STAT PANELS — HQ tech (replaces orange SkyBioML bars)
   ═══════════════════════════════════════════════════════════ */

/* ── Ship title row ── */
#overview {
  margin: 0.5em 0.25em !important;
  padding: 0.5em 0.75em !important;
  background: var(--sky-bg-panel) !important;
  border: 1px solid var(--sky-border) !important;
  border-radius: 2px !important;
}

#overview h1 {
  font-family: var(--sky-font-display) !important;
  letter-spacing: 0.12em !important;
  color: var(--sky-fg) !important;
  text-shadow: 0 0 16px rgba(220, 38, 38, 0.2) !important;
}

/* ── Classic top stat strip (#summary) — desktop wide bar ── */
#summary {
  background: var(--sky-bg-panel) !important;
  border: 1px solid var(--sky-border) !important;
  border-radius: 2px !important;
  padding: 0.5em 0.35em !important;
  margin-bottom: 0.65em !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

#summary .summaryTable {
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

/* Kill global orange thead inside summary */
#summary thead,
#summary .summaryTable thead,
#summary thead tr,
#summary thead th,
#summary thead .main th {
  background: linear-gradient(180deg, var(--sky-bg-elevated), #141418) !important;
  color: var(--sky-muted) !important;
  border: 1px solid var(--sky-border) !important;
  border-bottom: none !important;
  font-family: var(--sky-font-display) !important;
  font-size: 0.68em !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  padding: 0.5em 0.35em !important;
  line-height: 1.25 !important;
}

#summary thead .main th,
#summary thead th.lft,
#summary thead th.rgt {
  border-left: 1px solid var(--sky-border) !important;
}

#summary thead th.invisible {
  color: var(--sky-primary-dark) !important;
}

#summary thead th.bg-warning-disabled,
#summary .bg-warning-disabled {
  background: rgba(127, 29, 29, 0.25) !important;
  color: #6b7280 !important;
}

#summary .summaryTable > thead.blue,
#summary thead.blue th {
  background: linear-gradient(180deg, rgba(30, 58, 138, 0.25), var(--sky-bg-elevated)) !important;
  color: #93c5fd !important;
  box-shadow: inset 0 -2px 0 rgba(59, 130, 246, 0.55) !important;
}

#summary .summaryTable > thead.green,
#summary thead.green th {
  background: linear-gradient(180deg, rgba(22, 101, 52, 0.22), var(--sky-bg-elevated)) !important;
  color: #86efac !important;
  box-shadow: inset 0 -2px 0 rgba(34, 197, 94, 0.45) !important;
}

#summary .summaryTable > thead.purple,
#summary thead.purple th {
  background: linear-gradient(180deg, rgba(88, 28, 135, 0.22), var(--sky-bg-elevated)) !important;
  color: #d8b4fe !important;
  box-shadow: inset 0 -2px 0 rgba(168, 85, 247, 0.45) !important;
}

#summary .summaryTable thead th.bordered {
  border-left: 1px solid var(--sky-border) !important;
}

#summary tbody tr,
#summary .summaryTable tbody tr {
  background: transparent !important;
}

#summary tbody tr:nth-child(odd),
#summary .summaryTable tbody tr:nth-child(odd) {
  background: rgba(255, 255, 255, 0.02) !important;
}

#summary tbody td,
#summary .summaryTable tbody td {
  color: var(--sky-fg) !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04) !important;
  padding: 0.35em 0.45em !important;
  font-family: var(--sky-font-body) !important;
  font-size: 0.88em !important;
  text-align: center !important;
}

#summary tbody td.warning,
#summary tbody td .warning {
  color: var(--sky-primary-bright) !important;
  stroke: var(--sky-primary-bright) !important;
  fill: var(--sky-primary-bright) !important;
}

/* Toggle row above stats */
.summary-toggle {
  padding: 0.4em 0.6em !important;
  margin-bottom: 0.35em !important;
  background: var(--sky-bg-panel) !important;
  border: 1px solid var(--sky-border) !important;
  border-radius: 2px !important;
}

.summary-toggle .text-toggle {
  color: var(--sky-muted) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  font-size: 0.75em !important;
}

.summary-toggle .text-toggle:hover {
  color: var(--sky-primary-bright) !important;
}

.summary-toggle button {
  background: linear-gradient(180deg, var(--sky-bg-elevated), var(--sky-bg-panel)) !important;
  color: var(--sky-primary) !important;
  border: 1px solid rgba(220, 38, 38, 0.4) !important;
  border-radius: 2px !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  font-size: 0.72em !important;
}

.summary-toggle button:hover {
  background: linear-gradient(180deg, #2a0505, #1a0000) !important;
  color: #fff !important;
  border-color: var(--sky-primary) !important;
}

.outfitting-toggle {
  color: var(--sky-muted) !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  font-family: var(--sky-font-display) !important;
  font-size: 0.75em !important;
  border-top: 1px solid var(--sky-border) !important;
  margin-top: 0.25em !important;
}

.outfitting-toggle:hover,
.outfitting-toggle.active {
  color: var(--sky-primary-bright) !important;
}

.outfitting-toggle.active {
  border-top-color: var(--sky-primary) !important;
}

.outfitting-toggle.pulse {
  animation: sky-pulse 1.5s ease-in-out infinite !important;
}

@keyframes sky-pulse {
  0%,
  100% {
    color: var(--sky-muted);
    text-shadow: none;
  }
  50% {
    color: var(--sky-primary-bright);
    text-shadow: 0 0 8px rgba(220, 38, 38, 0.35);
  }
}

/* ── Responsive stat grid (#summary-responsive) ── */
#summary-responsive {
  background: var(--sky-bg-panel) !important;
  border: 1px solid var(--sky-border) !important;
  border-radius: 2px !important;
  padding: 0.65em !important;
  margin-bottom: 0.65em !important;
}

#summary-responsive .stat-tab-bar {
  gap: 0.25em !important;
  padding: 0.25em !important;
  background: var(--sky-bg) !important;
  border: 1px solid var(--sky-border) !important;
  border-radius: 2px !important;
  margin-bottom: 0.75em !important;
}

#summary-responsive .stat-tab {
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 2px !important;
  color: var(--sky-muted) !important;
  font-family: var(--sky-font-display) !important;
  font-size: 0.72em !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  padding: 0.45em 0.25em !important;
}

#summary-responsive .stat-tab:hover:not(.active) {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--sky-primary) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

#summary-responsive .stat-tab.active {
  background: linear-gradient(180deg, rgba(220, 38, 38, 0.18), rgba(18, 18, 21, 0.95)) !important;
  color: #fff !important;
  border-color: rgba(220, 38, 38, 0.45) !important;
  box-shadow: inset 0 -2px 0 var(--sky-primary) !important;
}

#summary-responsive .stats-tables {
  gap: 0.55em !important;
}

#summary-responsive .stat-table,
#summary-responsive .defense-table {
  background: var(--sky-bg) !important;
  border: 1px solid var(--sky-border) !important;
  border-radius: 2px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25) !important;
}

#summary-responsive .stat-table .stat-table-header,
#summary-responsive .defense-table .defense-header {
  background: linear-gradient(180deg, var(--sky-bg-elevated), #141418) !important;
  color: var(--sky-fg) !important;
  border-bottom: 2px solid var(--sky-primary) !important;
  font-family: var(--sky-font-display) !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-size: 0.78em !important;
  padding: 0.5em 0.6em !important;
}

#summary-responsive .defense-table .defense-header.blue {
  border-bottom-color: rgba(59, 130, 246, 0.7) !important;
  color: #bfdbfe !important;
}

#summary-responsive .defense-table .defense-header.green {
  border-bottom-color: rgba(34, 197, 94, 0.6) !important;
  color: #bbf7d0 !important;
}

#summary-responsive .defense-table .defense-header.purple {
  border-bottom-color: rgba(168, 85, 247, 0.6) !important;
  color: #e9d5ff !important;
}

#summary-responsive .stat-table table tbody tr td {
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}

#summary-responsive .stat-table table tbody tr:hover,
#summary-responsive .defense-table table tbody tr:hover {
  background: rgba(220, 38, 38, 0.06) !important;
}

#summary-responsive .stat-table table tbody tr td.label,
#summary-responsive .defense-table table tbody tr td.label,
#summary-responsive .defense-table table tbody tr.info-row-narrow td.info-pair .pair-label {
  color: var(--sky-muted) !important;
  font-weight: 500 !important;
}

#summary-responsive .stat-table table tbody tr td.value,
#summary-responsive .defense-table table tbody tr td.value,
#summary-responsive .defense-table table tbody tr.info-row-narrow td.info-pair .pair-value {
  color: var(--sky-fg) !important;
  font-weight: 600 !important;
}

#summary-responsive .stat-table table tbody tr td.value.warning,
#summary-responsive .defense-table table tbody tr td.value.warning,
#summary-responsive .defense-table table tbody tr.info-row-narrow td.info-pair.warning .pair-value {
  color: var(--sky-primary-bright) !important;
}

#summary-responsive .defense-table table tbody tr.alt-row {
  background: rgba(255, 255, 255, 0.03) !important;
}

#summary-responsive .defense-table table tbody tr td.res-label {
  color: var(--sky-muted) !important;
}

/* ── Ship control panels (.group) — ENG / SYS / charts ── */
.group {
  background: var(--sky-bg-panel) !important;
  border: 1px solid var(--sky-border) !important;
  border-radius: 2px !important;
  padding: 0 !important;
  margin: 0.2em !important;
  overflow: hidden !important;
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.3) !important;
}

.group h1 {
  background: linear-gradient(180deg, var(--sky-bg-elevated), #141418) !important;
  color: var(--sky-fg) !important;
  border: none !important;
  border-bottom: 2px solid var(--sky-primary) !important;
  border-radius: 0 !important;
  font-family: var(--sky-font-display) !important;
  font-size: 0.78em !important;
  letter-spacing: 0.14em !important;
  padding: 0.5em 0.55em !important;
  margin: 0 !important;
  box-shadow: none !important;
}

.group table {
  background: transparent !important;
  width: 100% !important;
}

.group thead,
.group thead th {
  background: var(--sky-bg) !important;
  color: var(--sky-muted) !important;
  border-color: var(--sky-border) !important;
}

.group tbody tr:nth-child(odd) {
  background: rgba(255, 255, 255, 0.02) !important;
}

.group tbody td {
  color: var(--sky-fg) !important;
}

/* ── Pips bar ── */
#pips table {
  background: var(--sky-bg-panel) !important;
  border: 1px solid var(--sky-border) !important;
  border-radius: 2px !important;
  color: var(--sky-muted) !important;
}

#pips .full {
  stroke: var(--sky-primary) !important;
  fill: var(--sky-primary) !important;
}

#pips .half {
  stroke: var(--sky-primary-dark) !important;
  fill: var(--sky-primary-dark) !important;
}

#pips .mc {
  stroke: #71717a !important;
  fill: #71717a !important;
}

#pips .empty {
  stroke: #3f3f46 !important;
  fill: #27272a !important;
}

/* ── Power / defence / offence tabs (.tabs) ── */
.tabs,
.tabs th {
  background: var(--sky-bg-panel) !important;
  border: 1px solid var(--sky-border) !important;
  color: var(--sky-muted) !important;
  font-family: var(--sky-font-display) !important;
  letter-spacing: 0.08em !important;
  border-radius: 0 !important;
}

.tabs .active,
.tabs th.active {
  background: linear-gradient(180deg, rgba(220, 38, 38, 0.2), #141418) !important;
  color: #fff !important;
  border-color: rgba(220, 38, 38, 0.45) !important;
  box-shadow: inset 0 -2px 0 var(--sky-primary) !important;
}

/* Scoped global table headers on outfit page (power priority etc.) */
#outfit thead,
#outfit table thead,
#componentPriority thead,
#componentPriority thead th {
  background: linear-gradient(180deg, var(--sky-bg-elevated), #141418) !important;
  color: var(--sky-muted) !important;
  border-color: var(--sky-border) !important;
}

#outfit tbody tr:nth-child(odd),
#componentPriority tbody tr:nth-child(odd) {
  background: rgba(255, 255, 255, 0.02) !important;
}

#outfit td.lbl,
#componentPriority td.lbl {
  background: var(--sky-bg-elevated) !important;
  color: var(--sky-muted) !important;
  border-color: var(--sky-border) !important;
}

#outfit td.val {
  border-color: var(--sky-border) !important;
  color: var(--sky-fg) !important;
}

#boost button {
  background: var(--sky-bg-panel) !important;
  border: 1px solid var(--sky-border) !important;
  color: var(--sky-primary) !important;
  border-radius: 2px !important;
}

#boost button.selected {
  background: linear-gradient(180deg, #2a0505, #1a0000) !important;
  color: #fff !important;
  border-color: var(--sky-primary) !important;
}

/* ── Ship picker / comparison lists ── */
.shippicker .menu-header.selected {
  background: rgba(220, 38, 38, 0.12) !important;
  color: #fff !important;
}

.shippicker li.selected,
table.shipyard-table tbody tr.comparehighlight {
  background: rgba(220, 38, 38, 0.1) !important;
  color: var(--sky-fg) !important;
  box-shadow: inset 2px 0 0 var(--sky-primary) !important;
}

#coriolis #shipyard .shipyard-filter-bar,
#coriolis .shipyard-filter-bar {
  width: 100% !important;
  box-sizing: border-box !important;
  background: rgba(8, 8, 12, 0.98) !important;
  border-bottom: 2px solid var(--sky-primary) !important;
}

#coriolis #shipyard .shipyard-table-wrapper {
  border-bottom: 3px solid var(--sky-primary) !important;
}

#coriolis #shipyard table.shipyard-table thead {
  background: rgba(255, 255, 255, 0.04) !important;
  box-shadow: none !important;
}

#coriolis .table-tools,
#coriolis .table-tools label,
#coriolis #shipyard .table-tools,
#coriolis #shipyard .table-tools label {
  color: var(--sky-primary) !important;
}

#coriolis header .sky-nav-builds .menu-header svg.icon.warning,
#coriolis header .sky-nav-compare .menu-header svg.icon.warning {
  fill: none !important;
  stroke: none !important;
  color: var(--sky-primary) !important;
}

#coriolis header .sky-nav-builds .menu-header svg.icon.warning path,
#coriolis header .sky-nav-compare .menu-header svg.icon.warning path {
  fill: var(--sky-primary) !important;
  stroke: var(--sky-primary) !important;
}

#coriolis table.shipyard-table thead tr.main th:nth-child(2),
#coriolis table.shipyard-table thead tr.main th:nth-child(3),
#coriolis table.shipyard-table thead tr.main th:nth-child(4),
#coriolis table.shipyard-table thead tr.main th:nth-child(5),
#coriolis table.shipyard-table thead tr.main th:nth-child(6) {
  border-left: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

#coriolis .shipyard-filter-bar .filter-option {
  border-color: rgba(220, 38, 38, 0.35) !important;
  color: var(--sky-muted) !important;
}

#coriolis .shipyard-filter-bar .filter-option:hover,
#coriolis .no-touch .shipyard-filter-bar .filter-option:hover {
  color: var(--sky-primary-bright) !important;
  border-color: var(--sky-primary) !important;
}

.shipyard-filter-bar .filter-option.active,
#coriolis .shipyard-filter-bar .filter-option.active {
  background: linear-gradient(180deg, #2a0505, #1a0000) !important;
  border: 1px solid rgba(220, 38, 38, 0.45) !important;
  color: var(--sky-primary-bright) !important;
}

#coriolis .shipyard-filter-bar .filter-clear {
  color: var(--sky-primary-bright) !important;
}

#coriolis .shipyard-table-wrapper,
#coriolis .shipyard-table-wrapper .shipyard-table td {
  border-color: var(--sky-border) !important;
}

/* ── Comparison facets ── */
.facet.active {
  color: var(--sky-primary-bright) !important;
  stroke: var(--sky-primary-bright) !important;
  fill: var(--sky-primary-bright) !important;
}

.facet.active svg {
  stroke: var(--sky-primary-bright) !important;
}

/* ── Boost / inline controls ── */
#boost button.selected,
.button-inline-menu.active {
  background: rgba(220, 38, 38, 0.15) !important;
  border-color: var(--sky-primary) !important;
  color: #fff !important;
}

/* ── Tables (stats, lists) ── */
table {
  border-color: var(--sky-border) !important;
}

table th {
  color: var(--sky-muted) !important;
  font-family: var(--sky-font-display) !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  font-size: 0.85em !important;
}

table td {
  border-color: rgba(255, 255, 255, 0.06) !important;
}

.no-touch table.highlight:hover,
.no-touch table.highlighted {
  background: rgba(220, 38, 38, 0.08) !important;
}

/* ── Modals ── */
.modal .tabs .active,
.cmdr-link-item.active {
  background: rgba(220, 38, 38, 0.12) !important;
  border-color: rgba(220, 38, 38, 0.4) !important;
  color: #fff !important;
}

.cap {
  letter-spacing: 0.05em !important;
}

/* ── Tables / modals ── */
.table,
.modal,
.dialog {
  background-color: var(--sky-bg-panel) !important;
  border-color: var(--sky-border) !important;
}

/* ── Buttons (SkyBioML .button classes) ── */
.button,
button {
  font-family: var(--sky-font-body) !important;
}

.button.primary,
.button-primary {
  background: linear-gradient(180deg, #2a0505, #1a0000) !important;
  border: 1px solid rgba(220, 38, 38, 0.45) !important;
  color: var(--sky-primary) !important;
}

/* ── Scrollbars ── */
::-webkit-scrollbar-track {
  background: var(--sky-bg) !important;
}

::-webkit-scrollbar-thumb {
  background: var(--sky-primary-dark) !important;
  border-radius: 2px !important;
}

header .menu-list::-webkit-scrollbar-thumb {
  background: var(--sky-primary-dark) !important;
}

/* ── Hide donate / external SkyBioML promo ── */
header .menu:has(a[href*="sponsors"]),
header a[href*="github.com/sponsors"] {
  display: none !important;
}

header a.view-changes,
header #app-update {
  display: none !important;
}

/* ── SkyBioML home mark (replaces SkyBioML logo) ── */
header a.skybioml-home {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.55em !important;
  text-decoration: none !important;
  margin-right: 6px !important;
  padding: 0 1.35em 0 1em !important;
  height: 36px !important;
  min-height: 36px !important;
  box-sizing: border-box !important;
}

header a.skybioml-home .skybioml-logo-img {
  display: block;
  width: auto;
  height: 28px;
  max-width: 56px;
  object-fit: contain;
  flex-shrink: 0;
  filter: drop-shadow(0 0 10px rgba(220, 38, 38, 0.35));
}

header a.skybioml-home .skybioml-logo-mark {
  display: none;
}

header a.skybioml-home .skybioml-logo-text {
  font-family: var(--sky-font-display);
  font-size: 12px;
  letter-spacing: 0.2em;
  color: var(--sky-fg);
  text-transform: uppercase;
}

/* ── PROFILE (portal HQ) ── */
header .skybioml-profile-link {
  text-decoration: none !important;
  color: inherit !important;
}

header .skybioml-profile-btn {
  color: var(--sky-primary) !important;
  border: 1px solid rgba(220, 38, 38, 0.35) !important;
  background: linear-gradient(180deg, #1a1a1f, #121215) !important;
  padding: 0 0.75em !important;
}

header .skybioml-profile-btn:hover {
  color: #fff !important;
  border-color: var(--sky-primary) !important;
  background: linear-gradient(180deg, #2a0505, #1a0000) !important;
}

header .skybioml-profile-btn .menu-item-label {
  display: inline-block !important;
  margin-left: 0 !important;
  letter-spacing: 0.16em;
  font-size: 0.75em;
}

/* Hide default SkyBioML logo svg when branded */
body.skybioml-branded header a.skybioml-home svg {
  display: none !important;
}