/* Launchpad v8 Performance, Competitors and Health (performance-v8.js, competitors-v8.js, health-v8.js). Existing tokens
   only (--panel, --line, --ink*, --mute, --v-*), so light and dark follow the theme switch. 390px: one column, no
   horizontal scroll. */
.v8 { display: grid; gap: 14px; min-width: 0; }
.v8 h3 { font-size: 14px; font-weight: 600; margin: 0 0 10px; }
.v8 h4 { font-size: 12px; font-weight: 600; margin: 12px 0 6px; color: var(--ink2); }
.v8 a { color: var(--info); overflow-wrap: anywhere; }
.v8-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.v8-tile, .v8-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 12px 14px; min-width: 0; }
.v8-tl { font-size: 12px; color: var(--ink2); }
.v8-tv { font-size: 26px; font-weight: 600; line-height: 1.2; margin-top: 2px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.v8-tv.v8-nm { font-size: 18px; color: var(--mute); }
.v8-of { font-size: 13px; font-weight: 400; color: var(--ink2); }
.v8-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 12px; align-items: start; }
.v8-mute { color: var(--mute); }
.v8-sm { font-size: 12px; line-height: 1.4; }
.v8-bars { display: grid; gap: 7px; }
.v8-bar { display: grid; grid-template-columns: minmax(70px, 34%) minmax(0, 1fr) auto; gap: 8px; align-items: center; font-size: 12px; }
.v8-bl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink2); }
.v8-bt { position: relative; height: 12px; background: var(--v-track); border-radius: 3px; }
.v8-bf { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 3px; min-width: 2px; }
.v8-bv { font-variant-numeric: tabular-nums; font-size: 12px; white-space: nowrap; }
.v8-tgt, .v8-exp { position: absolute; top: -3px; bottom: -3px; width: 2px; transform: translateX(-1px); }
.v8-tgt { background: var(--ink); }
.v8-exp { background: var(--v-s4); }
.v8-s1 { background: var(--v-s1); } .v8-good { background: var(--v-good); } .v8-warn { background: var(--v-warn); }
.v8-serious { background: var(--v-serious); } .v8-crit { background: var(--v-crit); } .v8-mute.v8-dot, .v8-seg.v8-mute, .v8-sw.v8-mute, .v8-bf.v8-mute { background: var(--v-trend); }
.v8-trend { background: var(--v-trend); }
.v8-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 11px; color: var(--mute); margin-top: 6px; }
.v8-sw { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 4px; vertical-align: -1px; }
.v8-exp-sw { background: var(--v-s4); } .v8-tgt-sw { background: var(--ink); }
.v8-stack { display: flex; height: 14px; border-radius: 3px; overflow: hidden; background: var(--v-track); gap: 1px; }
.v8-seg { height: 100%; }
.v8-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.v8-item { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; min-width: 0; }
.v8-it { min-width: 0; overflow-wrap: anywhere; }
.v8-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; margin-top: 5px; }
.v8-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.v8-chip { font: inherit; font-size: 12px; padding: 3px 9px; border-radius: 999px; border: 1px solid var(--line2); background: var(--panel2); color: var(--ink); cursor: default; }
button.v8-chip { cursor: pointer; } button.v8-chip.on { border-color: var(--gold); color: var(--gold); }
span.v8-chip.v8-good, span.v8-chip.v8-warn, span.v8-chip.v8-crit, span.v8-chip.v8-mute { background: var(--panel2); border-left: 4px solid; }
span.v8-chip.v8-good { border-left-color: var(--v-good); } span.v8-chip.v8-warn { border-left-color: var(--v-warn); }
span.v8-chip.v8-crit { border-left-color: var(--v-crit); } span.v8-chip.v8-mute { border-left-color: var(--v-trend); }
.v8 details { margin-top: 8px; } .v8 summary { cursor: pointer; font-size: 12px; color: var(--ink2); }
.v8-wows { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.v8-wow .v8-tv { font-size: 22px; }
.v8-delta { font-size: 12px; font-weight: 600; margin-left: 6px; color: var(--ink2); }
.v8-pair { display: grid; gap: 2px; margin: 6px 0 4px; }
.v8-pb { display: block; height: 6px; border-radius: 2px; min-width: 2px; }
.v8-shifts { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.v8-shift { border-left: 3px solid var(--line2); padding: 4px 0 4px 10px; min-width: 0; overflow-wrap: anywhere; }
.v8-shift.v8-sev3 { border-left-color: var(--v-crit); } .v8-shift.v8-sev2 { border-left-color: var(--v-warn); }
.v8-moved { font-weight: 600; font-size: 13px; display: flex; gap: 8px; align-items: flex-start; }
.v8-prop { font-size: 13px; color: var(--gold2); margin: 2px 0; }
@media (max-width: 720px) {
  .v8-grid { grid-template-columns: minmax(0, 1fr); }
  .v8-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v8-tv { font-size: 20px; }
}
/* Ship board (v3/ship.js, Naja 11-02): business counts, five stage columns, decide and by-choice lists. */
.ship-biz { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.ship-b { font: inherit; text-align: left; display: grid; gap: 3px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 8px 10px; color: var(--ink); cursor: pointer; min-width: 0; }
.ship-b.on { border-color: var(--gold); }
.ship-mini { height: 6px; }
.ship-cols { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; align-items: start; }
.ship-col h3 { display: flex; gap: 6px; align-items: center; font-size: 13px; }
.ship-card { border: 1px solid var(--line); border-radius: 8px; padding: 8px; background: var(--panel2); min-width: 0; overflow-wrap: anywhere; }
.ship-name { font-weight: 600; font-size: 13px; }
.ship-tag { font-size: 11px; padding: 1px 7px; margin-left: 4px; }
@media (max-width: 1100px) { .ship-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .ship-cols { grid-template-columns: minmax(0, 1fr); } }
/* Ship loop: burndown (top of Features & enhancements), timeline chips, the 8-week level trend beside each business bar. */
.ship-bd { margin: 0 0 14px; }
.ship-bd .v8-chips { margin: 0 0 8px; }
.ship-bd-svg { display: block; width: 100%; height: auto; max-height: 220px; overflow: visible; }
.ship-chips { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 2px; }
.ship-chip { font-size: 11px; padding: 0 6px; background: var(--panel2); border-left: 3px solid; }
.ship-chip.v8-good { border-left-color: var(--v-good); } .ship-chip.v8-warn { border-left-color: var(--v-warn); }
.ship-chip.v8-crit { border-left-color: var(--v-crit); } .ship-chip.v8-s1 { border-left-color: var(--v-s1); } .ship-chip.v8-mute { border-left-color: var(--v-trend); }
.ship-chip.v8-good, .ship-chip.v8-warn, .ship-chip.v8-crit, .ship-chip.v8-s1, .ship-chip.v8-mute { background: var(--panel2); }
.ship-cov { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: start; }
.ship-trend { display: inline-flex; gap: 2px; align-items: flex-end; height: 34px; }
.ship-wk { width: 7px; height: 100%; display: flex; flex-direction: column-reverse; border-radius: 2px; overflow: hidden; background: var(--v-track); }
.ship-wk > span { display: block; width: 100%; }
.ship-wk > .v8-mute { background: var(--v-trend); }

/* Form funnel (Performance, Naja 11-05): one block per site; the form table scrolls inside its card on a phone. */
.v8-fsite { padding: 10px 0; border-top: 1px solid var(--line); display: grid; gap: 8px; min-width: 0; }
.v8-fsite:first-child { border-top: 0; }
.v8-fhead { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; }
.v8-fgood { background: var(--v-good); } .v8-fbad { background: var(--v-warn); }
.v8-f-errors .v8-fbad { background: var(--v-crit); }
.v8-fforms summary { cursor: pointer; color: var(--mute); font-size: 12.5px; }
.v8-fsteps { display: grid; gap: 6px; }
.v8-fstep { display: grid; grid-template-columns: 84px minmax(0, 1fr) 64px; gap: 8px; align-items: center; font-size: 12px; }
.v8-fl { color: var(--ink2); }
.v8-ft { position: relative; height: 12px; background: var(--v-track); border-radius: 3px; overflow: hidden; }
.v8-ft i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 3px; }
.v8-fv { font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; }
.v8-flist { list-style: none; margin: 6px 0; padding: 0; display: grid; gap: 6px; }
.v8-flist li { border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px; min-width: 0; overflow-wrap: anywhere; }
.v8-flist li.v8-fflag { border-left: 3px solid var(--v-crit); }
.v8-fchip { font-size: 11px; padding: 1px 6px; border-radius: 8px; background: var(--panel2); color: var(--bad); }