/* CHXLive production contract. No network fonts, generated controls or JS required.
   Latin faces are static weights, not a fictitious variable range. Arial only
   supplies its real regular face; missing Medium/Semibold use the system stack.
   Curly quotes (U+2018–201D) deliberately remain in the Chinese fallback. */
@font-face {
  font-family: "CHX Flag Emoji";
  src: url("/assets/noto-color-emoji-flags-e20cbc2b.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: block;
  unicode-range: U+1F1E6-1F1FF;
}
@font-face {
  font-family: "CHX Latin";
  src: local("Inter Regular"), local("Inter-Regular"), local("Arial");
  font-style: normal;
  font-weight: 400;
  size-adjust: 102%;
  unicode-range: U+0020-007E, U+00A0-024F;
}
@font-face {
  font-family: "CHX Latin";
  src: local("Inter Medium"), local("Inter-Medium");
  font-style: normal;
  font-weight: 500;
  size-adjust: 102%;
  unicode-range: U+0020-007E, U+00A0-024F;
}
@font-face {
  font-family: "CHX Latin";
  src: local("Inter SemiBold"), local("Inter-SemiBold");
  font-style: normal;
  font-weight: 600;
  size-adjust: 102%;
  unicode-range: U+0020-007E, U+00A0-024F;
}

:root {
  color-scheme: light;
  --bg: #fafaf7;
  --surface: #fff;
  --inset: #f4f3ee;
  --fg: #15171c;
  --strong: #0e0d0b;
  --muted: #54514a;
  --faint: #706c62;
  --line: #eeece5;
  --line-strong: #dcd8ce;
  --accent: #ff6a1a;
  --accent-hover: #e65c13;
  --accent-ink: #b8420b;
  --accent-soft: #fff4ec;
  --zone-muted: #f1f0e9;
  --zone-soft: #f6f5f0;
  --zone-rule: #dfdcd2;
  --selection: #ffd9c2;
  --good: #047857;
  --tbc: #805d00;
  --tbd: #b8420b;
  --live: #be123c;
  --fail: #9f1239;
  --good-bg: #e9f5ef;
  --tbc-bg: #fbf2dd;
  --tbd-bg: #fceee4;
  --fail-bg: #fbe9ed;
  --weekend: #f0f0ee;
  --chip-hover: #efeee8;
  --next-ink: #c2410c;
  --weather-warm: #b8420b;
  --weather-cool: #2f6f96;
  --decoration: #a8a49a;
  --now-rule: #e8c9b5;
  --dot-ring: rgba(255,255,255,.75);
  --orbit-border: rgba(255,106,26,.25);
  --orbit-ripple: rgba(255,106,26,.6);
  --hover-tint: rgba(255,106,26,.045);
  --calendar-hover: rgba(255,106,26,.05);
  --next-start: rgba(255,106,26,.065);
  --next-end: rgba(255,106,26,.018);
  --on-accent: #241b13;
  /* Deep-space poster surfaces for the rocket library. A poster stays a dark
     object in both themes, so these are literal colours, not theme tokens.
     Warm white type and one orange accent keep the SpaceX-poster direction
     without borrowing any mark or inventing data. */
  --poster: #0b0d10;
  --poster-fg: #f7f4ee;
  --poster-muted: #b6b0a5;
  --poster-faint: #8d887e;
  --poster-line: rgba(247,244,238,.16);
  --poster-line-strong: rgba(247,244,238,.32);
  --poster-accent: #ff8342;
  --poster-accent-ink: #ffb184;
  --poster-good: #7ee2b8;
  --poster-warn: #f2cd7a;
  --poster-bad: #ffa1b6;
  --text: "CHX Latin", "PingFang SC", "Noto Sans CJK SC", "Microsoft YaHei", "Source Han Sans SC", sans-serif;
  font-family: var(--text);
  font-synthesis: none;
}

/* CSS owns the system fallback, even without JS. Older engines retain the
   complete light palette above rather than invalid custom-property colors. */
@supports (color: light-dark(white, black)) {
  :root {
    color-scheme: light dark;
    --bg: light-dark(#fafaf7, #141619);
    --surface: light-dark(#fff, #1a1d20);
    --inset: light-dark(#f4f3ee, #24272a);
    --fg: light-dark(#15171c, #e7e7e2);
    --strong: light-dark(#0e0d0b, #f5f4ef);
    --muted: light-dark(#54514a, #b9b9b1);
    --faint: light-dark(#706c62, #a1a29a);
    --line: light-dark(#eeece5, #303438);
    --line-strong: light-dark(#dcd8ce, #454a4e);
    --accent: light-dark(#ff6a1a, #ff8a4a);
    --accent-hover: light-dark(#e65c13, #ffa16a);
    --accent-ink: light-dark(#b8420b, #ffae7d);
    --accent-soft: light-dark(#fff4ec, #30231d);
    --zone-muted: light-dark(#f1f0e9, #222629);
    --zone-soft: light-dark(#f6f5f0, #1b1e21);
    --zone-rule: light-dark(#dfdcd2, #3b4043);
    --selection: light-dark(#ffd9c2, #59321e);
    --good: light-dark(#047857, #6cdbad);
    --tbc: light-dark(#805d00, #efc96d);
    --tbd: light-dark(#b8420b, #ffae7d);
    --live: light-dark(#be123c, #ff8ca8);
    --fail: light-dark(#9f1239, #ff8ca8);
    --good-bg: light-dark(#e9f5ef, #18332b);
    --tbc-bg: light-dark(#fbf2dd, #352d1c);
    --tbd-bg: light-dark(#fceee4, #38271e);
    --fail-bg: light-dark(#fbe9ed, #3a222b);
    --weekend: light-dark(#f0f0ee, #1c1f22);
    --chip-hover: light-dark(#efeee8, #303538);
    --next-ink: light-dark(#c2410c, #ffae7d);
    --weather-warm: light-dark(#b8420b, #ffae7d);
    --weather-cool: light-dark(#2f6f96, #8fc4e0);
    --decoration: light-dark(#a8a49a, #969890);
    --now-rule: light-dark(#e8c9b5, #6c4530);
    --dot-ring: light-dark(rgba(255,255,255,.75), rgba(20,22,25,.85));
    --orbit-border: light-dark(rgba(255,106,26,.25), rgba(255,138,74,.4));
    --orbit-ripple: light-dark(rgba(255,106,26,.6), rgba(255,138,74,.8));
    --hover-tint: light-dark(rgba(255,106,26,.045), rgba(255,138,74,.08));
    --calendar-hover: light-dark(rgba(255,106,26,.05), rgba(255,138,74,.08));
    --next-start: light-dark(rgba(255,106,26,.065), rgba(255,138,74,.12));
    --next-end: light-dark(rgba(255,106,26,.018), rgba(255,138,74,.025));
  }
  :root[data-theme="light"] { color-scheme: light; }
  :root[data-theme="dark"] { color-scheme: dark; }
}

*, *::before, *::after { box-sizing: border-box; }
html { background: var(--bg); -webkit-text-size-adjust: 100%; scrollbar-gutter: stable; }
body {
  margin: 0;
  color: var(--fg);
  background: var(--bg);
  font-size: 15px;
  line-height: 1.7;
  overflow-wrap: anywhere;
  word-break: normal;
  -webkit-font-smoothing: antialiased;
}
[hidden] { display: none !important; }
h1, h2, h3, h4 { color: var(--strong); font-weight: 600; }
h1 { margin: 0; font-size: clamp(30px, 4vw, 40px); line-height: 1.3; }
h2 { margin: 0 0 16px; font-size: 22px; line-height: 1.4; }
h3 { margin: 0 0 12px; font-size: 18px; line-height: 1.45; }
p { margin: 0 0 16px; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 4px; }
a:hover { color: var(--accent-ink); }
strong, b { font-weight: 600; }
small { font-size: 12px; line-height: 1.6; }
img, svg { max-inline-size: 100%; vertical-align: middle; }
img { height: auto; }
figure { margin: 0; min-width: 0; }
figcaption { margin-top: 8px; color: var(--muted); font-size: 12px; line-height: 1.6; }
button, input, select, textarea { max-width: 100%; min-width: 0; font: inherit; color: inherit; }
button, select, input, textarea {
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface);
  padding: 8px 12px;
  line-height: 1.5;
}
button, select { cursor: pointer; }
button { min-height: 44px; font-weight: 500; }
button:hover:not(:disabled) { background: var(--accent-soft); border-color: var(--accent-hover); }
:disabled { cursor: not-allowed; opacity: .6; }
input, select { min-height: 44px; }
textarea { width: 100%; resize: vertical; }
::placeholder { color: var(--faint); opacity: 1; }
:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 4px; }
::selection { color: var(--strong); background: var(--selection); }

.shell { width: calc(100% - 72px); max-width: 1000px; margin-inline: auto; min-width: 0; }
.site-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 24px;
  min-height: 72px;
  padding-block: 12px;
  border-bottom: 1px solid var(--line);
}
/* Supports header.shell as well as header > .shell. */
.site-header > .shell { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; }
.brand { display: inline-flex; align-items: center; gap: 10px; min-width: 0; text-decoration: none; }
.brand img, .brand svg { display: block; width: 32px; height: 32px; flex: 0 0 32px; object-fit: contain; }
.brand-name { font-size: 18px; line-height: 1.4; font-weight: 600; }
.brand-name small { margin-inline-start: 6px; color: var(--muted); font-size: 10px; font-weight: 400; letter-spacing: .08em; }
.intro { padding-block: 40px 32px; }
.intro p:not(.eyebrow) { max-width: 42em; margin: 12px 0 0; color: var(--muted); font-size: 14px; line-height: 1.75; }
.eyebrow { margin: 0 0 10px; color: var(--muted); font-size: 11px; font-weight: 500; line-height: 1.5; letter-spacing: .08em; }

.filters, .month-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin: 0; padding-block: 16px; border-block: 1px solid var(--line); }
.filters label { display: grid; gap: 4px; min-width: 0; font-size: 12px; color: var(--muted); }
.filters input, .filters select { width: 100%; color: var(--fg); }
.filters > * { min-width: 0; max-width: 100%; }
.filters a, .month-nav a { display: inline-flex; align-items: center; min-height: 44px; padding: 6px 0; }
.month-nav { justify-content: space-between; }
.month-nav h1, .month-nav h2, .month-nav p { margin: 0; font-size: 22px; line-height: 1.4; }
.month-nav time { font-variant-numeric: tabular-nums; }

/* Preferred row structure: li.launch-row > .launch-time + .launch-content
   + .status. Status can instead be nested inside .launch-content. */
.timeline { margin: 0; padding: 0; list-style: none; }
.timeline ul { margin: 0; padding: 0; list-style: none; }
.timeline > h2, .timeline > li > h2, .timeline > section > h2 { margin: 24px 0 12px; font-size: 18px; }
.launch-row {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr) auto;
  align-items: start;
  gap: 16px;
  padding-block: 20px;
  border-bottom: 1px solid var(--line);
  min-width: 0;
}
.launch-row > * { min-width: 0; max-width: 100%; }
.launch-time { font-size: 24px; font-weight: 500; line-height: 1.3; font-variant-numeric: tabular-nums; }
.launch-time time { font-variant-numeric: tabular-nums; }
.launch-time small, .launch-time span { display: block; margin-top: 6px; color: var(--muted); font-size: 11px; font-weight: 400; line-height: 1.5; }
.launch-content { min-width: 0; display: flow-root; }
.launch-title { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.45; }
.launch-title a { text-decoration: none; }
.launch-title a:hover { text-decoration: underline; }
.launch-meta { display: flex; flex-wrap: wrap; gap: 2px 12px; margin: 6px 0 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.launch-meta > * { min-width: 0; }
.launch-content > .status { margin-top: 8px; }
.status { display: inline-block; color: var(--muted); font-size: 12px; font-weight: 500; line-height: 1.6; }
.launch-row > .status { margin-top: 4px; text-align: end; max-width: 10em; }
/* Both .status.good and .status.status-good are accepted. Text labels must
   name the state: color alone is not an accessible status indication.
   Go/Success = good; TBC/Hold/Partial Failure = tbc; TBD = tbd. */
.status.good, .status.status-good { color: var(--good); }
.status.tbc, .status.status-tbc { color: var(--tbc); }
.status.tbd, .status.status-tbd { color: var(--tbd); }
.status.live, .status.status-live { color: var(--live); }
.status.fail, .status.status-fail { color: var(--fail); }
.status.sched, .status.status-sched { color: var(--muted); }
.empty-state { padding-block: 40px; color: var(--muted); border-bottom: 1px solid var(--line); }
.empty-state p:last-child { margin-bottom: 0; }

.detail-header { padding-block: 40px 24px; border-bottom: 1px solid var(--line); }
.detail-header .launch-meta { margin-top: 16px; }
.detail-header .status { margin-top: 12px; }
/* dl.detail-grid uses direct dt/dd pairs; no wrapper elements required. */
.detail-grid { display: grid; grid-template-columns: minmax(100px, 160px) minmax(0, 1fr); gap: 0 24px; margin: 24px 0; }
.detail-grid dt, .detail-grid dd { min-width: 0; margin: 0; padding-block: 12px; border-bottom: 1px solid var(--line); line-height: 1.7; }
.detail-grid dt { color: var(--muted); font-size: 13px; }
.detail-grid dd { font-size: 14px; }
.detail-description { max-width: 72ch; margin-block: 32px; font-size: 15px; line-height: 1.75; }
.detail-description ul, .detail-description ol { padding-inline-start: 24px; }
.detail-description pre, .plain-text { white-space: pre-wrap; overflow-wrap: anywhere; }
.task-image { display: block; width: 100%; max-width: 640px; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 6px; margin-block: 24px; }
figure.task-image { aspect-ratio: auto; }
figure.task-image img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 6px; }

/* Keep real titles and seven weekday columns. Narrow screens scroll only
   this labelled region, never squeeze each day into unreadable 40px strips. */
.calendar-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; margin-block: 24px; }
.calendar-scroll-note { display: none; color: var(--muted); font-size: 12px; }
.month-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); min-width: 770px; gap: 1px; margin: 0; padding: 1px; list-style: none; background: var(--line); }
@media (max-width: 820px) { .calendar-scroll-note { display: block; } }
.day-cell { min-width: 0; min-height: 112px; padding: 10px 8px; background: var(--bg); }
.day-cell[aria-current="date"] { background: var(--accent-soft); }
.day-number { display: block; font-size: 13px; font-weight: 500; line-height: 1.5; font-variant-numeric: tabular-nums; }
.day-launch { display: block; margin-top: 8px; font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
.day-launch time { display: block; white-space: nowrap; color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.error-page { max-width: 640px; min-height: 40vh; padding-block: 64px; }
.error-page p { margin-top: 16px; color: var(--muted); }
.turbo-progress-bar { height: 3px; background: var(--accent); }
.skip-link { position: fixed; top: -10rem; left: 12px; z-index: 100; padding: 8px 16px; background: var(--surface); color: var(--fg); border: 2px solid var(--accent); }
.skip-link:focus { top: 12px; }
/* Turbo, the skip link and the article's in-page table of contents focus their
   document-positioning targets: #main itself, the article top, its sections and
   headings, and the #launch-schedule region. Those landmarks carry tabindex -1
   for scripted focus only, so they must not paint a focus frame when focus lands
   on them (Home/End included). Links, buttons and other real controls keep
   their own :focus-visible ring, and no tabindex or navigation code changes. */
main#main:focus,
main#main:focus-visible,
#main :is(article, section, header, h1, h2, h3, h4, h5, h6, div#launch-schedule)[tabindex="-1"]:focus {
  outline: none;
}
.weekday { padding-block: 8px; text-align: center; font-size: 12px; color: var(--muted); border-bottom: 1px solid var(--line); }
.uncertain-plans { margin-top: 32px; }
.uncertain-plans > p { color: var(--muted); font-size: 13px; }

/* Display preferences never change the Beijing date groups or month grid. */
.date-group { margin-block: 28px 12px; min-width: 0; }
.date-group > h2, h2.date-group { margin-block: 0 12px; font-size: 18px; }
.row-thumbnail {
  float: right;
  display: block;
  width: 96px;
  max-width: 32%;
  margin: 0 0 8px 16px;
  border-radius: 6px;
}
img.row-thumbnail, .row-thumbnail img { aspect-ratio: 4 / 3; object-fit: cover; }
.row-thumbnail img { display: block; width: 100%; border-radius: inherit; }
html:not([data-thumbnails="true"]) .row-thumbnail { display: none; }
.display-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  min-width: 0;
  margin-block: 16px;
}
.display-controls { padding-block: 12px; color: var(--muted); font-size: 12px; border-bottom: 1px solid var(--line); }
.display-controls > * { min-width: 0; max-width: 100%; }
.display-controls label { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 44px; }
.display-controls select { color: var(--fg); }
.display-controls input[type="checkbox"] { flex: 0 0 20px; width: 20px; height: 20px; min-height: 20px; margin: 0; padding: 0; accent-color: var(--accent-ink); }
.display-controls p, .display-controls > small { flex-basis: 100%; margin: 0; }
.next-launch { margin-block: 24px; padding: 20px; border: 1px solid var(--line); border-inline-start: 3px solid var(--accent); border-radius: 6px; background: var(--surface); min-width: 0; }
.next-launch h2 { margin-bottom: 10px; font-size: 18px; }
.next-launch p:last-child { margin-bottom: 0; }
[data-countdown-iso] { font-variant-numeric: tabular-nums; }
.detail-extra { margin-block: 32px; min-width: 0; }
.detail-extra h2 { font-size: 20px; }
.detail-extra ul, .detail-extra ol { padding-inline-start: 24px; }
.detail-extra pre { max-width: 100%; white-space: pre-wrap; overflow-wrap: anywhere; }
.detail-extra table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.detail-extra th, .detail-extra td { padding: 8px; border-bottom: 1px solid var(--line); text-align: start; }
.window-range { color: var(--muted); font-size: 13px; line-height: 1.7; font-variant-numeric: tabular-nums; }
.window-range time { display: inline; }
.updates { margin-block: 24px; padding: 0; list-style: none; }
.update-row { display: grid; grid-template-columns: minmax(100px, 160px) minmax(0, 1fr); gap: 8px 24px; padding-block: 16px; border-bottom: 1px solid var(--line); }
.update-row > * { min-width: 0; margin: 0; }
.update-row time { color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.update-row p:last-child { margin-bottom: 0; }
.pagination, .pagination ul { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 16px; }
.pagination { margin-block: 28px; }
.pagination ul { padding: 0; margin: 0; list-style: none; }
.pagination a, .pagination span { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 6px 10px; }
.pagination [aria-current="page"] { color: var(--accent-ink); background: var(--accent-soft); border-radius: 6px; }
.pagination [aria-disabled="true"] { color: var(--muted); text-decoration: none; }
.sitemap-note { margin-block: 20px; color: var(--muted); font-size: 12px; line-height: 1.7; }
main[aria-busy="true"] { cursor: progress; }

@media (max-width: 600px) {
  .display-controls { gap: 8px 12px; }
  .row-thumbnail { width: 72px; margin-inline-start: 10px; }
  .next-launch { padding: 16px; }
  .update-row { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .site-header { min-height: 64px; gap: 4px 16px; }
  .intro { padding-block: 28px 24px; }
  .launch-row { grid-template-columns: 72px minmax(0, 1fr); gap: 6px 12px; padding-block: 16px; }
  .launch-time { grid-column: 1; grid-row: 1 / span 2; font-size: 22px; }
  .launch-content { grid-column: 2; }
  .launch-title { font-size: 16px; }
  .launch-row > .status { grid-column: 2; margin: 0; max-width: 100%; text-align: start; }
  .launch-meta { gap: 2px 8px; }
  .detail-header { padding-block: 28px 20px; }
  .detail-grid { grid-template-columns: 80px minmax(0, 1fr); column-gap: 16px; }
  .filters { align-items: end; }
  .filters label { flex: 1 1 140px; }
  .day-cell { min-height: 88px; padding: 8px 4px; }
  .day-launch { font-size: 12px; }
  .day-launch time { font-size: 11px; }
}
@media (max-width: 360px) {
  .launch-row { grid-template-columns: 64px minmax(0, 1fr); column-gap: 8px; }
  .launch-time { font-size: 20px; }
  .day-cell { padding-inline: 2px; }
}
/* One shared column for every route. Routes without their own .shell override
   (launches, providers, gallery, ...) now inherit the homepage column, so the
   masthead and the body never shift sideways when navigating between pages. */
@media (max-width: 920px) { .shell { width: calc(100% - 52px); } }
@media (max-width: 740px) { .shell { width: calc(100% - 34px); } }
@media (max-width: 370px) { .shell { width: calc(100% - 28px); } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (forced-colors: active) {
  .day-cell[aria-current="date"] { outline: 2px solid Highlight; outline-offset: -2px; }
}

/* Homepage restoration: final V2.5 cascade, not the older design-token draft.
   These rules deliberately do not alter calendar/detail/error layouts. */
.page-home {
  font-size: 14px;
  line-height: 1.64;
  letter-spacing: -.012em;
  text-rendering: optimizeLegibility;
  /* Match the reference's synthetic bold when only a regular CJK face exists. */
  font-synthesis: weight;
}
.page-home .shell, .page-calendar .shell, .page-reports .shell, .page-report .shell { width: calc(100% - 72px); max-width: 1000px; }
.page-home a { text-decoration: none; }
.ui-icon { display: inline-block; width: 14px; height: 14px; flex: none; vertical-align: -2px; }
.ui-icon-external { width: 16px; height: 16px; }
/* Shared masthead owns typography as well as geometry; never inherit route
   body settings (notably font synthesis and line-height). */
.landing-header, .site-header-band { font-size: 14px; line-height: 1.64; letter-spacing: -.012em; text-rendering: optimizeLegibility; font-synthesis: weight; }
.landing-header .hero { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 14px 36px; align-items: stretch; padding: 32px 0; }
.landing-header .hero-countdown { margin: 12px 0 0; color: var(--next-ink); font-size: 24px; font-weight: 600; line-height: 1.4; letter-spacing: 0; font-variant-numeric: tabular-nums; }
.landing-header .hero-summary { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; margin: 10px 0 0; max-width: 48em; color: var(--muted); font-size: 13px; line-height: 1.85; }
.landing-header .hero-orbit { margin: 10px 0 0; padding-top: 10px; border-top: 1px solid var(--line); color: var(--faint); font-size: 11px; line-height: 1.75; }
.landing-header .hero-detail { margin: 8px 0 0; }
.landing-header .hero-detail-link { display: inline-flex; align-items: center; gap: 5px; min-height: 24px; color: var(--accent-ink); font-size: 11px; font-weight: 400; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.landing-header .hero-figure { grid-column: 2; grid-row: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; align-self: center; }
.landing-header .hero-image-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; width: 100%; aspect-ratio: 25 / 16; flex: none; min-height: 0; padding: 16px; background: var(--zone-soft); border-block: 1px solid var(--line); color: var(--faint); text-align: center; font-size: 13px; }
.landing-header .hero-image-empty small { max-width: 20em; font-size: 10px; }
.landing-header .hero-copy { min-width: 0; }
.landing-header .kicker { font-size: 10px; color: var(--faint); font-weight: 650; letter-spacing: .11em; margin: 0 0 10px; }
.landing-header .kicker span { color: var(--accent); padding-inline: 3px; }
.landing-header .hero :is(h1, h2) { margin: 0; font-size: clamp(25px, 2.8vw, 35px); font-weight: 690; letter-spacing: -.037em; line-height: 1.31; white-space: normal; min-height: 0; overflow-wrap: anywhere; }
.landing-header .hero :is(h1, h2) a { color: inherit; text-decoration: none; }
.landing-header .hero :is(h1, h2) a:hover { color: var(--accent-ink); }
/* The single page H1 names the column; it is a quiet label above the Hero. */
.landing-header .hero-window { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 8px; margin: 8px 0 0; color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
/* Hero and calendar popovers share badge states; route styles stay scoped. */
:is(.landing-header .hero-window, .page-calendar .cal-tip) .status { display: inline-block; margin: 0; padding: 1px 6px; border: 0; border-radius: 4px; background: var(--inset); color: var(--muted); font-size: 12px; font-weight: 500; line-height: 1.6; letter-spacing: 0; white-space: nowrap; }
:is(.landing-header .hero-window, .page-calendar .cal-tip) .status.good { background: var(--good-bg); color: var(--good); }
:is(.landing-header .hero-window, .page-calendar .cal-tip) .status.tbc { background: var(--tbc-bg); color: var(--tbc); }
:is(.landing-header .hero-window, .page-calendar .cal-tip) .status.tbd { background: var(--tbd-bg); color: var(--tbd); }
:is(.landing-header .hero-window, .page-calendar .cal-tip) .status.fail { background: var(--fail-bg); color: var(--fail); }
:is(.landing-header .hero-window, .page-calendar .cal-tip) .status.live { background: var(--fail-bg); color: var(--live); }
:is(.landing-header .hero-window, .page-calendar .cal-tip) .status.sched { background: var(--inset); color: var(--muted); }
/* Term links stay quiet in data rows: the dotted underline marks the definition. */
a.term-link, a.terms-link { color: inherit; text-decoration: underline dotted; text-decoration-thickness: 1px; text-decoration-color: color-mix(in srgb, currentColor 55%, transparent); text-underline-offset: 3px; }
a.term-link:hover, a.term-link:focus-visible, a.terms-link:hover, a.terms-link:focus-visible { color: var(--accent-ink); text-decoration-style: solid; }
/* Status badges link to the glossary and keep their badge colours; the badge
   stays plain and only gains an underline on hover. */
a.status { text-decoration: none; }
a.status:hover, a.status:focus-visible { text-decoration: underline; text-underline-offset: 2px; }
.landing-header .hero-period { color: var(--accent); font: inherit; letter-spacing: 0; margin-left: 2px; }
.landing-header .lede { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 12px; margin: 11px 0 0; font-size: 13px; line-height: 1.75; color: var(--muted); letter-spacing: 0; max-width: 420px; }
.landing-header .lede > span { min-width: 0; overflow-wrap: anywhere; }
.landing-header .hero-facts { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 14px; }
.landing-header .hero-fact { display: inline-flex; align-items: center; gap: 5px; min-width: 0; }
.landing-header .hero-fact > :last-child { min-width: 0; overflow-wrap: anywhere; }
.landing-header .hero-fact-icon { width: 13px; height: 13px; flex: 0 0 13px; color: var(--faint); stroke-width: 1.65; }
/* The Hero states orbit and launch site on separate lines, so the site block
   gets the full width and never shares a wrapped run with the orbit value.
   Both facts use the same two-track grid: a 16px marker column, a 6px gutter
   and one flexible text column. The marker track carries the orbit glyph or
   the optional country flag, so the orbit value and the site's base text start
   on one left edge. The value tracks are explicitly placed in column two, so
   the base/pad pair stays aligned even when no flag is rendered; the flag is
   centred over that two-line pair and the glyph never grows past 13px. The
   order comes from the layout, so no visible field label repeats it. */
.landing-header .hero-orbit.hero-facts { flex-direction: column; align-items: flex-start; gap: 5px; }
.landing-header .hero-orbit .hero-fact { display: grid; grid-template-columns: 16px minmax(0, 1fr); column-gap: 6px; row-gap: 0; align-items: center; min-width: 0; }
.landing-header .hero-orbit .hero-fact > .hero-fact-icon { grid-column: 1; grid-row: 1; justify-self: center; width: 13px; height: 13px; }
.landing-header .hero-orbit .hero-fact > a.term-link { grid-column: 2; grid-row: 1; min-width: 0; overflow-wrap: anywhere; }
.landing-header .hero-orbit .hero-site > .country-flag { grid-column: 1; grid-row: 1; align-self: center; justify-self: center; margin-inline-end: 0; vertical-align: 0; }
.landing-header .hero-orbit .hero-site > .hero-site-lines { grid-column: 2; grid-row: 1; display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 1px; min-width: 0; }
.landing-header .hero-orbit .hero-site-base, .landing-header .hero-orbit .hero-site-pad { min-width: 0; overflow-wrap: anywhere; }
/* The model/provider pair is owned by the shared .mission-identity row below;
   no route adds its own type emphasis on top of it. */
.landing-header .hero-figure img { display: block; width: 100%; height: auto; min-height: 0; flex: none; object-fit: contain; object-position: center; border-radius: 2px; }
.landing-header .view-switcher { display: flex; align-items: stretch; height: 60px; }
.landing-header .tabs { display: flex; align-items: stretch; gap: 26px; }
/* Equal weights reserve the same link widths when the active tab changes. */
.landing-header .tab { display: flex; align-items: center; position: relative; padding: 0 1px; white-space: nowrap; color: var(--faint); font-size: 13px; font-weight: 650; text-decoration: none; }
.landing-header .tab:hover { color: var(--muted); }
.landing-header .tab[aria-current="page"] { color: var(--fg); }
.landing-header .tab[aria-current="page"]::after { content: ""; position: absolute; bottom: 0; left: 0; right: 0; height: 2px; background: var(--accent); }
.page-home .tools { display: flex; align-items: center; gap: 15px; min-width: 0; }
.page-home .display-controls { display: flex; flex-wrap: nowrap; align-items: center; gap: 8px; margin: 0; padding: 0; border: 0; }
.page-home .display-controls { gap: 15px; }
.page-home .display-controls label { flex-wrap: nowrap; gap: 5px; min-height: 30px; white-space: nowrap; font-size: 11px; color: var(--faint); }
.page-home .display-controls .tz { border: 0; background: transparent; max-width: 116px; padding: 4px 0; min-height: 30px; font-size: 11px; color: var(--muted); }
.page-home .display-controls input[type="checkbox"] { width: 12px; height: 12px; min-height: 12px; flex-basis: 12px; accent-color: var(--accent-ink); }
.page-home .visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.page-home .heading-line { padding: 24px 0 10px; display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.page-home .heading-line :is(h1, h2) { margin: 0; font-size: 18px; line-height: 1.4; font-weight: 670; letter-spacing: -.025em; }
.page-home .heading-line small { font-size: 11px; color: var(--faint); }
.page-home .timeline-section { margin-bottom: 8px; }
.page-home .timeline-heading { padding: 13px 0 8px; display: flex; align-items: baseline; justify-content: space-between; gap: 15px; }
.page-home .timeline-heading h3 { margin: 0; font-size: 14px; font-weight: 660; letter-spacing: 0; line-height: 1.64; flex-shrink: 0; }
.page-home .timeline-heading small { font-size: 11px; color: var(--faint); text-align: right; }
.page-home .recent-section .timeline-heading { padding-top: 1px; }
.page-home .upcoming-section .timeline-heading { padding-top: 4px; }
.page-home .date-group.day-title { display: flex; align-items: baseline; gap: 8px; margin: 0; padding: 11px 0 8px; }
.page-home .day-title h4 { margin: 0; font-size: 12px; font-weight: 620; letter-spacing: 0; color: var(--muted); line-height: 1.64; }
.page-home .day-count { font-size: 10px; letter-spacing: 0; color: var(--decoration); margin-left: auto; }
:is(.page-home, .page-calendar) .launch-row.record { display: grid; grid-template-columns: 86px minmax(0, 1fr) 167px 78px; gap: 15px; align-items: center; min-height: 79px; width: 100%; padding: 12px 14px 13px 0; border: 0; border-top: 1px solid var(--line); background: transparent; text-align: left; color: var(--fg); transition: background .12s; }
:is(.page-home, .page-calendar) .record:hover { background: var(--hover-tint); }
/* One overlay anchor owns the whole row on the home timeline and on the
   calendar's date-unconfirmed lists; real entity/term/status links sit above it
   so they stay clickable and keyboard reachable. */
:is(.page-home, .page-calendar) .launch-row:has(> a.task-link) { position: relative; isolation: isolate; }
:is(.page-home, .page-calendar) .launch-row:has(> a.task-link) > a.task-link { position: absolute; inset: 0; z-index: 1; display: block; border-radius: inherit; color: inherit; text-decoration: none; font: inherit; -webkit-tap-highlight-color: transparent; }
:is(.page-home, .page-calendar) .launch-row:has(> a.task-link) > a.task-link:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: -2px; }
:is(.page-home, .page-calendar) .launch-row:has(> a.task-link) :is(a.term-link, a.terms-link, a.status, a.entity-link) { position: relative; z-index: 2; }
/* Contained next-launch highlight: one full-height rail, no detached timeline dot.
   Insets are deducted from the edge columns so mission text keeps its axis. */
.page-home .record.next-launch { position: relative; isolation: isolate; margin: 0; padding: 14px 14px 14px 16px; grid-template-columns: 70px minmax(0, 1fr) 167px 78px; border-radius: 4px; background: linear-gradient(90deg,var(--next-start),var(--next-end)); }
.page-home .record.next-launch:hover { background: var(--accent-soft); }
.page-home .record.next-launch::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 2px; background: var(--accent); border-radius: 2px; pointer-events: none; }
.page-home .heading-line { min-height: 26px; }
.timeline-tools { display: flex; align-items: center; gap: 10px; }
/* Only time content is inset: the mission column and contained rail stay put. */
:is(.page-home, .page-calendar) .record:not(.next-launch) .time-col { padding-inline-start: 16px; }
:is(.page-home, .page-calendar) .record .time-col { position: relative; align-self: center; grid-column: auto; grid-row: auto; font-size: inherit; line-height: inherit; }
:is(.page-home, .page-calendar) .record .clock { font-size: 24px; font-weight: 640; line-height: 1.06; letter-spacing: -.045em; font-variant-numeric: tabular-nums; }
:is(.page-home, .page-calendar) .record .clock.undetermined { font-size: 15px; color: var(--muted); letter-spacing: 0; }
.page-home .next-launch .clock { display: block; color: var(--next-ink); }
.page-home .next-label { display: block; margin-bottom: 6px; color: var(--next-ink); font-size: 9px; font-weight: 550; line-height: 1.3; letter-spacing: .03em; }
.page-home .next-countdown { display: block; margin-top: 7px; color: var(--next-ink); font-size: 16px; font-weight: 500; line-height: 1.5; letter-spacing: 0; font-variant-numeric: tabular-nums; }
.page-home .next-countdown span { font: inherit; font-variant-numeric: tabular-nums; }
:is(.page-home, .page-calendar) .record .time-note { display: block; font-size: 10px; line-height: 1.3; letter-spacing: 0; margin-top: 6px; color: var(--faint); font-weight: 400; }
.page-home .launch-time .time-note span { display: inline; margin: 0; font: inherit; color: inherit; }
:is(.page-home, .page-calendar) .record .main-col { display: flex; align-items: center; gap: 13px; grid-column: auto; }
:is(.page-home, .page-calendar) .record .thumb { float: none; display: block; width: 94px; height: 61px; flex: 0 0 94px; max-width: none; margin: 0; border-radius: 6px; background: var(--inset); overflow: hidden; }
:is(.page-home, .page-calendar) .record .thumb img { display: block; width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; border-radius: inherit; }
html:not([data-thumbnails="true"]) :is(.page-home, .page-calendar) .record .thumb { display: none; }
.page-home .record-copy { min-width: 0; }
:is(.page-home, .page-calendar) .record .mission { margin: 0; font-size: 15px; line-height: 1.42; font-weight: 650; letter-spacing: -.013em; overflow-wrap: anywhere; }
:is(.page-home, .page-calendar) .record .subline { display: flex; flex-wrap: wrap; gap: 0 8px; font-size: 11px; line-height: 1.65; margin: 5px 0 0; color: var(--muted); }
:is(.page-home, .page-calendar) .record .precision-note { display: block; font-size: 10px; line-height: 1.5; color: var(--faint); margin-top: 3px; }
:is(.page-home, .page-calendar) .record .place { font-size: 11px; color: var(--faint); line-height: 1.5; }
/* The base and its pad are two stacked lines in that order; the status stays a
   sibling of the whole pair, never a third location line. */
:is(.page-home, .page-calendar) .record .place-lines { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 1px; min-width: 0; }
:is(.page-home, .page-calendar) .record .place-lines > span { display: block; min-width: 0; overflow-wrap: anywhere; }
:is(.page-home, .page-calendar) .record .place-base { color: var(--muted); }
.page-home .place :is(em.status, a.status) { display: none; }
.page-home .record > .status { grid-column: auto; display: flex; align-items: center; justify-content: flex-end; white-space: nowrap; margin: 0; max-width: none; font-size: 11px; font-weight: 590; text-align: right; line-height: 1.6; }
.page-home .status .arr { display: inline-block; flex: none; font-size: 13px; font-weight: 400; line-height: 1; margin-left: 4px; color: var(--decoration); }
.page-home .now-divider { display: flex; align-items: center; gap: 11px; margin: 24px 0 14px; color: var(--next-ink); }
.page-home .now-divider::before, .page-home .now-divider::after { content: ""; height: 1px; background: var(--line); flex: 1; }
.page-home .now-divider::before { max-width: 21px; background: var(--line-strong); }
.page-home .now-orbit { position: relative; width: 18px; height: 18px; flex: 0 0 18px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--orbit-border); border-radius: 50%; background: var(--accent-soft); }
.page-home .now-orbit i { width: 8px; height: 8px; background: var(--accent); display: block; border-radius: 50%; box-shadow: 0 0 0 2px var(--dot-ring); }
/* Only the decorative halo expands. The dot, NOW text and divider stay fixed. */
.page-home .now-orbit::after { content: ""; position: absolute; inset: -1px; border: 1px solid var(--orbit-ripple); border-radius: 50%; opacity: 0; transform: scale(1); pointer-events: none; }
@keyframes now-orbit-ripple {
  0% { opacity: 0; transform: scale(.85); }
  20% { opacity: .65; }
  100% { opacity: 0; transform: scale(1.85); }
}
@media (prefers-reduced-motion: no-preference) {
  .page-home .now-orbit[data-now-attention]::after { animation: now-orbit-ripple 2.2s ease-out 2; }
  .page-home .now-orbit[data-now-attention]:hover::after { animation-play-state: paused; }
}
.page-home .now-center { display: flex; align-items: baseline; gap: 6px; font-size: 12px; font-weight: 650; letter-spacing: 0; white-space: nowrap; }
.page-home .now-center small { color: var(--faint); font-size: 9px; font-weight: 550; letter-spacing: .07em; }
.page-home .note { border-top: 1px solid var(--line); padding: 19px 0 8px; display: flex; gap: 12px; align-items: flex-start; color: var(--faint); font-size: 11px; line-height: 1.8; margin-top: 20px; }
.page-home .note a { color: var(--muted); text-decoration: underline; }

@media (max-width: 920px) {
  .page-home .shell, .page-calendar .shell, .page-reports .shell, .page-report .shell { width: calc(100% - 52px); }
  .landing-header .hero { column-gap: 24px; }
  :is(.page-home, .page-calendar) .launch-row.record { grid-template-columns: 76px minmax(0, 1fr) 115px 78px; gap: 11px; }
  .page-home .record.next-launch { grid-template-columns: 60px minmax(0, 1fr) 115px 78px; }
  :is(.page-home, .page-calendar) .record .thumb { width: 83px; height: 58px; flex-basis: 83px; }
  :is(.page-home, .page-calendar) .record .main-col { gap: 11px; }
}
@media (max-width: 740px) {
  .page-home .shell, .page-calendar .shell, .page-reports .shell, .page-report .shell { width: calc(100% - 34px); }
  .landing-header .hero { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 14px; padding: 24px 0 22px; }
  .landing-header .hero-figure { grid-column: 1; grid-row: auto; align-self: start; width: 100%; }
  .landing-header .hero-countdown { font-size: 20px; }
  .landing-header .hero-summary { font-size: 12px; line-height: 1.8; }
  .landing-header .hero-orbit { font-size: 10px; }
  .landing-header .hero-image-empty { padding: 10px; gap: 5px; font-size: 11px; }
  .landing-header .hero-image-empty small { font-size: 9px; line-height: 1.5; }
  .landing-header .kicker { font-size: 9px; margin-bottom: 9px; letter-spacing: .04em; }
  .landing-header h1 { font-size: clamp(25px, 7vw, 29px); line-height: 1.29; letter-spacing: -.052em; }
  .landing-header .lede { font-size: 11px; line-height: 1.65; margin-top: 9px; max-width: 225px; }
  .landing-header .desktop-only { display: none; }
  .landing-header .hero-figure img { width: 100%; }
  .landing-header .view-switcher { height: 52px; padding-bottom: 9px; }
  .landing-header .tabs { gap: 24px; }
  @media (max-width: 430px) { .landing-header .tabs { gap: clamp(8px, 3vw, 12px); } }
  .page-home .tools { width: 100%; min-height: 33px; gap: 8px; justify-content: space-between; flex-wrap: wrap; }
  .page-home .display-controls { gap: 8px; }
  .page-home .display-controls .tz { max-width: 94px; font-size: 11px; }
  .page-home .display-controls label { font-size: 11px; }
  .page-home .heading-line { padding: 20px 0 6px; }
  .page-home .heading-line :is(h1, h2) { font-size: 16px; }
  .page-home .heading-line small { font-size: 10px; text-align: right; }
  .page-home .timeline-heading { padding: 11px 0 7px; }
  .page-home .timeline-heading h3 { font-size: 13px; }
  .page-home .timeline-heading small { font-size: 10px; }
  .page-home .recent-section .timeline-heading { padding-top: 2px; }
  .page-home .date-group.day-title { padding: 10px 0 8px; }
  :is(.page-home, .page-calendar) .launch-row.record { grid-template-columns: 65px minmax(0, 1fr); grid-template-areas: "time main" "time place"; gap: 1px 8px; min-height: 79px; padding: 11px 12px 12px 0; }
  :is(.page-home, .page-calendar) .record .time-col { grid-area: time; align-self: start; padding-top: 2px; }
  :is(.page-home, .page-calendar) .record .clock { font-size: 20px; }
  :is(.page-home, .page-calendar) .record .clock.undetermined { font-size: 12px; }
  :is(.page-home, .page-calendar) .record .time-note { font-size: 9px; margin-top: 5px; }
  :is(.page-home, .page-calendar) .record .main-col { grid-area: main; align-items: flex-start; gap: 9px; }
  :is(.page-home, .page-calendar) .record .thumb { width: 69px; height: 51px; flex: 0 0 69px; border-radius: 5px; }
  :is(.page-home, .page-calendar) .record .mission { font-size: 13px; line-height: 1.4; font-weight: 660; }
  :is(.page-home, .page-calendar) .record .subline { font-size: 10px; line-height: 1.55; margin-top: 4px; }
  :is(.page-home, .page-calendar) .record .precision-note { font-size: 9px; }
  :is(.page-home, .page-calendar) .record .place { grid-area: place; display: flex; flex-wrap: wrap; gap: 0 7px; align-items: baseline; font-size: 10px; line-height: 1.5; padding-top: 3px; }
  .page-home .place :is(em.status, a.status) { display: inline; margin-left: auto; font-size: 10px; font-style: normal; white-space: nowrap; }
  .page-home .record > :is(a, em).row-status { display: none; }
  .page-home .place .arr { font-size: 10px; }
  .page-home .record.next-launch { grid-template-columns: 51px minmax(0, 1fr); padding: 13px 12px 13px 14px; }
  .page-home .next-label { font-size: 8.5px; margin-bottom: 5px; }
  .page-home .next-countdown { font-size: 14px; margin-top: 6px; }
  :is(.page-home, .page-calendar) .record:not(.next-launch) .time-col { padding-inline-start: 14px; }
  .page-home .now-divider { margin: 19px 0 10px; gap: 10px; }
  .page-home .now-orbit { width: 16px; height: 16px; flex-basis: 16px; }
  .page-home .now-orbit i { height: 7px; width: 7px; }
  .page-home .now-center { font-size: 11px; }
  .page-home .note { margin-top: 13px; }
}
@media (max-width: 370px) {
  .page-home .shell, .page-calendar .shell, .page-reports .shell, .page-report .shell { width: calc(100% - 28px); }
  .landing-header .hero { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .landing-header h1 { font-size: 24px; }
  .landing-header .lede { font-size: 10px; }
  .page-home .tools { gap: 6px; }
  .page-home .display-controls .tz { max-width: 83px; }
  .page-home .display-controls, .page-home .display-controls label { gap: 5px; font-size: 10px; }
  :is(.page-home, .page-calendar) .record .thumb { width: 62px; height: 48px; flex-basis: 62px; }
  :is(.page-home, .page-calendar) .record .main-col { gap: 7px; }
  :is(.page-home, .page-calendar) .launch-row.record { grid-template-columns: 60px minmax(0, 1fr); gap: 2px 6px; }
  .page-home .record.next-launch { grid-template-columns: 46px minmax(0, 1fr); }
  :is(.page-home, .page-calendar) .record .clock { font-size: 19px; }
  :is(.page-home, .page-calendar) .record .mission { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { :is(.page-home, .page-calendar) .launch-row.record { transition: none; } }
@media (forced-colors: active) {
  .page-home .now-orbit, .page-home .record.next-launch::before { border: 1px solid Highlight; }
  .page-home .now-orbit i { background: Highlight; }
  .page-home .now-orbit[data-now-attention]::after { animation: none; }
  .landing-header .tab[aria-current="page"] { text-decoration: underline; }
}

/* v2.5 alignment for the calendar and detail routes without changing their
   DOM contracts. Home keeps its own .page-home scope and visual gate. */
.page-calendar .shell, .page-detail .shell { max-width: 1000px; }
.page-calendar .site-header, .page-detail .site-header { min-height: 64px; }
.page-calendar .intro, .page-detail .detail-header { padding-block: 32px 24px; }
.page-calendar .intro h1, .page-detail .detail-header h1 { font-size: clamp(28px, 3vw, 36px); letter-spacing: -.03em; line-height: 1.3; }
.page-calendar .month-nav h2, .page-calendar .month-nav p { font-size: 20px; }
@media (max-width: 740px) {
  .page-calendar .shell, .page-detail .shell { width: calc(100% - 34px); }
}
@media (max-width: 370px) {
  .page-calendar .shell, .page-detail .shell { width: calc(100% - 28px); }
}

/* ---------------------------------------------------------------------------
   2026-10 visual pass: bring /calendar and /launches onto the same warm-white,
   type-led rhythm as the v2.5 home page. These rules are scoped so the home
   visual gate and the existing DOM contracts stay untouched.
--------------------------------------------------------------------------- */
.page-calendar, .page-detail { font-size: 14px; line-height: 1.7; letter-spacing: -.008em; }
.page-calendar .shell, .page-detail .shell { max-width: 1000px; }
.page-calendar .site-header, .page-detail .site-header { min-height: 64px; }
.page-calendar .intro { padding-block: 34px 20px; }
.page-calendar .intro h1 { font-size: clamp(30px, 3.4vw, 40px); font-weight: 680; letter-spacing: -.038em; line-height: 1.22; }
.page-calendar .intro p:not(.eyebrow) { max-width: 46em; margin-top: 10px; color: var(--muted); font-size: 12.5px; line-height: 1.8; }
.page-calendar .eyebrow, .page-detail .eyebrow { color: var(--faint); font-size: 10px; font-weight: 600; letter-spacing: .12em; }

/* One quiet toolbar instead of three stacked full-width rows. */
.page-calendar .filters { display: flex; align-items: flex-end; gap: 12px; margin: 6px 0 0; padding: 14px 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.page-calendar .filters label { display: grid; gap: 5px; flex: 0 1 170px; font-size: 10px; font-weight: 500; letter-spacing: .06em; color: var(--faint); }
.page-calendar .filters label:nth-child(2) { flex-basis: 190px; }
.page-calendar .filters label:nth-child(3) { flex-basis: 130px; }
.page-calendar .filters input, .page-calendar .filters select { width: 100%; min-height: 38px; padding: 6px 10px; border-color: var(--line); border-radius: 7px; background: var(--bg); font-size: 12.5px; }
.page-calendar .filters input[type="month"] { font-variant-numeric: tabular-nums; }
.page-calendar .filters button[type="submit"] { flex: 0 0 auto; min-height: 38px; padding: 6px 20px; border-color: var(--strong); background: var(--strong); color: var(--surface); font-size: 12px; font-weight: 600; letter-spacing: .08em; border-radius: 7px; }
.page-calendar .filters button[type="submit"]:hover { border-color: var(--accent); background: var(--accent); color: var(--on-accent); }

.page-calendar .calendar-bar { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 10px; padding-block: 9px; border-bottom: 1px solid var(--line-strong); }
.page-calendar .calendar-bar .month-nav { flex: 1 1 auto; display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0; padding: 0; border: 0; }
.page-calendar .calendar-bar .month-nav a { min-height: 32px; padding: 5px 9px; border-radius: 7px; color: var(--muted); font-size: 11.5px; }
.page-calendar .calendar-bar .month-nav a:hover { background: var(--accent-soft); color: var(--accent-ink); }
.page-calendar .calendar-bar .month-nav > span:not([aria-disabled]) { padding: 3px 12px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--strong); font-size: 11.5px; font-weight: 600; letter-spacing: .07em; font-variant-numeric: tabular-nums; }
.page-calendar .calendar-bar .month-nav [aria-disabled] { color: var(--faint); font-size: 11px; }
.page-calendar .calendar-bar .display-controls { flex: 0 0 auto; display: flex; align-items: center; gap: 12px; margin: 0; padding: 0; border: 0; font-size: 11px; color: var(--faint); }
.page-calendar .calendar-bar .display-controls label { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; white-space: nowrap; font-size: 11px; }
.page-calendar .calendar-bar .display-controls select { min-height: 30px; padding: 3px 7px; border-color: var(--line); border-radius: 6px; background: var(--surface); font-size: 11px; color: var(--muted); }
.page-calendar .calendar-bar .display-controls input[type="checkbox"] { width: 13px; height: 13px; min-height: 13px; margin: 0; accent-color: var(--accent-ink); }
.page-calendar .calendar-bar [data-display-scope-note] { display: none; }

/* Date headings become quiet rules rather than repeated full-width titles. */
.page-calendar .timeline { margin-top: 8px; border-top: 0; }
.page-calendar .date-group { display: flex; align-items: center; gap: 12px; margin: 0; padding: 17px 0 7px; }
.page-calendar .date-group h2 { margin: 0; color: var(--muted); font-size: 11px; font-weight: 600; letter-spacing: .09em; line-height: 1.5; font-variant-numeric: tabular-nums; }
.page-calendar .date-group::after { content: ""; flex: 1 1 auto; height: 1px; background: var(--line); }

.page-calendar .launch-row { grid-template-columns: 80px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding-block: 14px; border-bottom: 1px solid var(--line); transition: background .15s ease; }
.page-calendar .launch-row:hover { background: linear-gradient(90deg, var(--calendar-hover), transparent 58%); }
.page-calendar .launch-time { font-size: 22px; font-weight: 620; letter-spacing: -.035em; line-height: 1.15; }
.page-calendar .launch-time small { display: block; margin-top: 5px; color: var(--faint); font-size: 9.5px; letter-spacing: .02em; }
.page-calendar .launch-title { font-size: 15.5px; font-weight: 640; line-height: 1.4; }
.page-calendar .launch-meta { margin-top: 4px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.page-calendar .launch-row > .status, .page-calendar .uncertain-tail > .status { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px 4px 9px; border-radius: 999px; background: var(--inset); color: var(--muted); font-size: 10.5px; font-weight: 600; white-space: nowrap; }
.page-calendar .launch-row > .status::before, .page-calendar .uncertain-tail > .status::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.calendar-body .status.good { background: var(--good-bg); color: var(--good); }
.calendar-body .status.tbc { background: var(--tbc-bg); color: var(--tbc); }
.calendar-body .status.tbd { background: var(--tbd-bg); color: var(--tbd); }
.calendar-body .status.fail { background: var(--fail-bg); color: var(--fail); }
.calendar-body .status.live { background: var(--fail-bg); color: var(--live); }
.calendar-body .status.sched { background: var(--inset); }

/* Month grid: denser cells, two-line task titles, calmer weekend tint. */
.page-calendar .month-grid { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: var(--line); }
.page-calendar .weekday { padding: 9px 8px; border-bottom: 0; background: var(--inset); color: var(--faint); font-size: 10px; font-weight: 600; letter-spacing: .1em; text-align: left; }
.page-calendar .day-cell { min-height: 88px; padding: 6px 7px 8px; background: var(--surface); }
.page-calendar .weekday:nth-child(6), .page-calendar .weekday:nth-child(7), .page-calendar .day-cell:nth-child(7n+6), .page-calendar .day-cell:nth-child(7n+7) { background: var(--weekend); box-shadow: 0 0 0 1px var(--line-strong); }
.page-calendar .day-cell[aria-current="date"] { background: var(--accent-soft); }
.page-calendar .day-number { margin: 0 0 4px; color: var(--faint); font-size: 10px; font-weight: 600; letter-spacing: .04em; }
.page-calendar .day-cell:nth-child(7n+6) > .day-number, .page-calendar .day-cell:nth-child(7n+7) > .day-number { color: var(--muted); }
.page-calendar .day-cell[aria-current="date"] > .day-number { color: var(--accent-ink); }
.page-calendar .today-label { display: inline-block; margin-inline-start: 3px; font-size: 9px; font-weight: 600; letter-spacing: 0; }
.page-calendar .day-launch { display: block; margin: 1px -4px; padding: 3px 4px; border-radius: 5px; font-size: 10.5px; line-height: 1.38; color: var(--fg); text-decoration: none; }
.page-calendar .day-launch:hover { background: var(--accent-soft); }
.page-calendar .day-launch .launch-name { display: block; font-weight: 620; overflow-wrap: anywhere; }
.country-flag { display: inline-block; margin-inline-end: .35em; font-family: "CHX Flag Emoji", "Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", sans-serif; font-size: .95em; font-weight: 400; line-height: 1; vertical-align: -.08em; }
.landing-header .hero-site-base, .page-home .record .launch-title, .page-calendar .uncertain-plans .launch-title, :is(.page-home, .page-calendar) .record .place-lines > .place-base { display: flex; align-items: center; gap: .35em; }
.landing-header .hero-site-base > .country-flag, .page-home .record .launch-title > .country-flag, .page-calendar .uncertain-plans .launch-title > .country-flag, :is(.page-home, .page-calendar) .record .place-base > .country-flag { margin-inline-end: 0; vertical-align: 0; flex: 0 0 auto; }
.landing-header .hero-site-location, .page-home .record .launch-title-text, .page-calendar .uncertain-plans .launch-title-text, :is(.page-home, .page-calendar) .record .place-location { min-width: 0; overflow-wrap: anywhere; }
.page-calendar .day-launch time { display: block; margin-top: 1px; color: var(--muted); font-size: 9.5px; font-variant-numeric: tabular-nums; }
.page-calendar .day-launch > .status { display: block; margin-top: 1px; font-size: 9px; font-weight: 600; }
.page-calendar .uncertain-plans { margin-top: 26px; padding: 18px 20px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.page-calendar .uncertain-plans h2 { margin-bottom: 5px; font-size: 15px; letter-spacing: -.01em; }
.page-calendar .uncertain-plans > p { margin-bottom: 10px; color: var(--muted); font-size: 11px; line-height: 1.7; }

/* Detail: editorial hierarchy, warm accents, and a source-ordered update timeline. */
.page-detail .breadcrumb { display: flex; align-items: center; gap: 8px; padding: 20px 0 0; color: var(--faint); font-size: 12px; }
.page-detail .breadcrumb a { display: inline-flex; align-items: center; min-height: 28px; color: var(--muted); text-decoration: none; }
.page-detail .breadcrumb a:hover { color: var(--accent-ink); text-decoration: underline; }
.page-detail .detail-header { margin: 0; padding: 20px 0 8px; border: 0; background: none; }
.page-detail .detail-header h1 { margin: 0; font-size: clamp(30px, 3.2vw, 36px); font-weight: 680; letter-spacing: -.035em; line-height: 1.3; overflow-wrap: anywhere; text-wrap: pretty; }
.page-detail .detail-summary { margin: 10px 0 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.page-detail .detail-header .status { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 3px 10px; border-radius: 4px; background: var(--inset); font-size: 12px; font-weight: 600; }
.page-detail .detail-header .status::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.page-detail .detail-header .status.good { background: var(--good-bg); }
.page-detail .detail-header .status.tbc { background: var(--tbc-bg); }
.page-detail .detail-header .status.tbd { background: var(--tbd-bg); }
.page-detail .detail-header .status.fail, .page-detail .detail-header .status.live { background: var(--fail-bg); }
/* The lead is three regions: the header owns the whole left cell (title,
   identity, plan, site and weather, then the remaining facts), the image is the
   right cell of the first row, and the mission description is a full-width
   second row under both. Without an image the header simply takes the width. */
.page-detail .detail-lead { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: min-content; gap: 0 24px; align-items: start; }
.page-detail .detail-lead:has(> .detail-media) { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
.page-detail .detail-lead > * { min-width: 0; }
.page-detail .detail-lead > .detail-header { grid-column: 1; grid-row: 1; }
.page-detail .detail-lead > .detail-description { grid-column: 1 / -1; grid-row: 2; }
.page-detail .detail-overview { min-width: 0; margin-top: 18px; }
.page-detail .detail-overview > * { min-width: 0; }
/* The three plan rows are one reading column: primary instant, then the status
   and plan-relative clock beside it, then the launch window. Source order is the
   same order, so no `order` is needed and screen readers follow the page. */
.page-detail .detail-schedule { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; gap: 0; margin: 0; max-width: 600px; padding-top: 0; }
.page-detail .detail-schedule dt { color: var(--muted); font-size: 12px; line-height: 1.5; }
.page-detail .detail-schedule dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.page-detail .schedule-primary dd { margin-top: 6px; color: var(--strong); font-size: clamp(22px, 2.3vw, 27px); font-weight: 600; line-height: 1.32; letter-spacing: -.015em; font-variant-numeric: tabular-nums; }
/* Zone suffix stays outside <time> so scripted rewrites never drop it. */
.page-detail .schedule-primary .time-suffix { margin-left: .28em; color: var(--muted); font-size: 13px; font-weight: 500; letter-spacing: .04em; white-space: nowrap; }
.page-detail .time-utc, .page-detail .schedule-note { display: block; margin-top: 3px; color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.7; font-variant-numeric: tabular-nums; }
/* The primary clock reads as one tight block: its UTC line stays close to the
   Beijing instant, and its own note keeps a wider gap so it never reads as part
   of the clock. The reference clock's note belongs to the status row instead. */
.page-detail .schedule-primary .time-utc { line-height: 1.55; }
.page-detail .schedule-primary .schedule-note { margin-top: 6px; line-height: 1.6; }
.page-detail .detail-reference-clock .schedule-note { margin-top: 7px; line-height: 1.6; }
.page-detail .schedule-secondary { grid-column: 1 / -1; display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; font-size: 13px; line-height: 1.7; }
.page-detail .detail-reference-clock { display: block; margin-top: 14px; padding: 0; border: 0; background: none; }
/* Status and countdown sit on one baseline group. The status keeps its own
   colour bucket and its own words, so a finished mission shows success or
   failure here without a timer; the countdown is only a plan-relative reading
   beside it and is never the thing that says what happened. */
.page-detail .reference-clock-group { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.page-detail .detail-reference-clock .reference-phase { color: var(--muted); font-size: 13px; font-weight: 500; letter-spacing: .01em; }
/* One badge size for every state here; `live` no longer needs its own rule. */
.page-detail .detail-reference-clock .status { position: absolute; top: -4.2px; right: 0; margin: 0; max-width: 55%; padding: 3px 8px; font-size: 13px; line-height: 1.5; }
.page-detail .detail-schedule a.time-suffix[title^="北京时间"] { display: none; }
.page-detail .detail-reference-clock .reference-timer { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; color: var(--accent-ink); font-size: 22px; font-weight: 500; line-height: 1.5; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.page-detail .detail-reference-clock .reference-timer-noscript { color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.6; white-space: nowrap; }
/* Plan time reads as one instant: the date line, then the clock with a single
   solid point. The point is decoration only; the clock text states the time and
   the zone link states the zone. */
.page-detail .schedule-primary { position: relative; }
.page-detail .plan-instant { display: grid; gap: 4px; }
.page-detail .instant-day { color: var(--muted); font-size: 13px; font-weight: 400; line-height: 1.55; }
.page-detail .instant-clock { display: flex; align-items: center; gap: 10px; color: var(--strong); font-size: 32px; font-weight: 600; line-height: 1.2; }
.page-detail .instant-clock::before { content: ""; flex: none; width: 7px; height: 7px; border: 1px solid var(--accent); border-radius: 50%; background: var(--accent); }
/* Only the value's own zone link moves to the label line; the UTC links nested
   in the UTC line stay inline, or they would float away from their time. */
.page-detail .schedule-primary > dd > .time-suffix { position: absolute; top: 0; right: 0; margin: 0; font-size: 12px; font-weight: 500; letter-spacing: .04em; }
/* A window is a range, so it reads as two ends and the space between them: a
   static rail with hollow endpoints, never a filled progress bar. */
.page-detail .window-schedule { position: relative; }
.page-detail .window-schedule > dd > .time-suffix { position: absolute; top: 12px; right: 0; margin: 0; font-size: 12px; font-weight: 500; letter-spacing: .04em; }
.page-detail .window-date { display: block; margin-bottom: 8px; color: var(--muted); font-size: 13px; line-height: 1.55; font-variant-numeric: tabular-nums; }
.page-detail .window-track { display: grid; grid-template-columns: max-content minmax(18px, 1fr) max-content; gap: 12px; align-items: end; }
.page-detail .window-endpoint { display: block; min-width: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.page-detail .window-endpoint time { display: block; font-variant-numeric: tabular-nums; }
.page-detail .window-endpoint .endpoint-day { display: block; color: var(--muted); font-size: 13px; font-weight: 400; line-height: 1.55; }
.page-detail .window-endpoint .endpoint-clock { display: block; color: var(--fg); font-size: 18px; font-weight: 500; line-height: 1.5; }
.page-detail .window-endpoint-end { text-align: right; }
.page-detail .window-bridge { display: flex; align-items: center; justify-content: center; min-width: 0; height: 27px; }
.page-detail .window-rail { display: none; }
.page-detail .window-bridge.is-range .window-rail { position: relative; display: block; width: 100%; border-top: 1px solid var(--line-strong); }
.page-detail .window-bridge.is-range .window-rail::before, .page-detail .window-bridge.is-range .window-rail::after { content: ""; position: absolute; top: -4px; width: 7px; height: 7px; border: 1px solid var(--muted); border-radius: 50%; background: var(--bg); }
.page-detail .window-bridge.is-range .window-rail::before { left: 0; }
.page-detail .window-bridge.is-range .window-rail::after { right: 0; }
.page-detail .window-range .window-boundary { white-space: nowrap; }
.page-detail .detail-media { grid-column: 2; grid-row: 1; align-self: start; margin: 20px 0 0; }
.page-detail .detail-media .task-image { display: block; width: auto; max-width: 100%; height: auto; max-height: 420px; margin: 0 auto; aspect-ratio: auto; object-fit: contain; border-radius: 9px; box-shadow: none; }
.page-detail .detail-grid { grid-template-columns: 92px minmax(0, 1fr) 92px minmax(0, 1fr); gap: 0 20px; margin: 10px 0 0; padding: 0; background: transparent; border: 0; border-radius: 0; }
.page-detail .detail-grid dt, .page-detail .detail-grid dd { padding: 9px 0; border: 0; background: transparent; overflow-wrap: anywhere; }
.page-detail .detail-grid dt { color: var(--muted); font-size: 12px; font-weight: 400; }
.page-detail .detail-grid dd { color: var(--fg); font-size: 14px; }
.page-detail .detail-extra { min-width: 0; margin: 32px 0 0; padding-top: 24px; border-top: 1px solid var(--line); }
/* The description closes the lead as its own full-width band: no hairline above,
   no measure cap, and the Hero reading size rather than a clamp. */
.page-detail .detail-description { min-width: 0; max-width: none; margin: 12px 0 0; padding: 0; border: 0; }
.page-detail .detail-description h2, .page-detail .detail-extra h2 { margin: 0 0 12px; font-size: 18px; font-weight: 660; letter-spacing: -.02em; }
.page-detail .detail-description h2::before, .page-detail .detail-extra h2::before { content: ""; display: inline-block; width: 4px; height: 15px; margin-right: 10px; border-radius: 3px; background: var(--detail-section-accent, var(--accent)); vertical-align: -1px; }
.page-detail .detail-description h2::after, .page-detail .detail-extra h2::after { display: none; }
.page-detail .detail-description p, .page-detail .detail-extra p { margin-block: 0; font-size: 15px; line-height: 1.85; }
.page-detail .detail-description p { font-size: 14px; line-height: 1.8; }
.page-detail .detail-extra .sitemap-note { margin-top: 16px; color: var(--muted); font-size: 12px; }
.page-detail .detail-section-heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; margin-bottom: 8px; }
.page-detail .detail-section-heading h2, .page-detail .detail-section-heading .sitemap-note { margin: 0; }
.page-detail .detail-resources { margin: 0; padding: 0; list-style: none; }
.page-detail .detail-resources li + li { margin-top: 12px; }
.page-detail .resource-link { display: flex; align-items: center; justify-content: flex-start; gap: 7px; width: fit-content; max-width: 100%; min-height: 44px; color: var(--fg); font-size: 14px; line-height: 1.7; text-decoration: none; }
.page-detail .resource-link > span:first-child { min-width: 0; overflow-wrap: anywhere; }
.page-detail .resource-arrow { display: inline-flex; align-items: center; flex: none; color: inherit; background: none; border-radius: 0; }
.page-detail .resource-link:hover, .page-detail .resource-link:focus-visible { color: var(--accent-ink); }
.page-detail .resource-link:hover > span:first-child { text-decoration: underline; text-underline-offset: 4px; }
.page-detail .detail-resources small { display: block; color: var(--muted); font-size: 12px; line-height: 1.7; }
.page-detail .detail-extra .detail-empty { color: var(--muted); font-size: 14px; }
.page-detail .updates { --update-axis: 146px; --update-node-y: 10px; margin: 20px 0 0; padding: 0; border: 0; list-style: none; }
.page-detail .update-row { position: relative; display: grid; grid-template-columns: 136px minmax(0, 1fr); gap: 24px; padding: 0 0 20px; border: 0; }
.page-detail .update-row::before { content: ""; position: absolute; top: var(--update-node-y); bottom: calc(-1 * var(--update-node-y)); left: var(--update-axis); width: 1px; background: var(--line-strong); pointer-events: none; }
.page-detail .update-row::after { content: ""; position: absolute; top: calc(var(--update-node-y) - 2px); left: calc(var(--update-axis) - 2px); width: 5px; height: 5px; border-radius: 50%; background: var(--faint); pointer-events: none; }
.page-detail .update-row:last-child { padding-bottom: 0; }
.page-detail .update-row:last-child::before { display: none; }
.page-detail .update-meta { min-width: 0; }
.page-detail .update-meta time, .page-detail .update-meta small { display: block; color: var(--muted); font-size: 12px; line-height: 1.7; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.page-detail .update-author { margin-top: 4px; }
.page-detail .update-content { min-width: 0; padding: 0; border: 0; background: none; }
.page-detail .update-row p { margin: 0; font-size: 14px; line-height: 1.85; }
.page-detail .update-row a { display: inline-flex; align-items: center; gap: 6px; min-height: 28px; margin-top: 6px; color: var(--accent-ink); font-size: 12px; }
/* A flex anchor paints no text decoration itself, so the source link underlines
   its words instead. Same offset as every other off-site link. */
.page-detail .update-row a[target="_blank"]:is(:hover, :focus-visible) > .update-link-text { text-decoration: underline; text-underline-offset: 4px; }
.page-detail .pagination { gap: 14px; margin: 16px 0 0; padding-top: 12px; border: 0; color: var(--muted); font-size: 12px; }
.page-detail #rocket h3 { margin: 0 0 12px; font-size: 16px; font-weight: 600; }
.page-detail .detail-return { margin: 32px 0 0; font-size: 13px; }
.page-detail .detail-return a { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; }
.page-detail :is(#detail-top, #launch-schedule, #mission-description, #mission-anomaly, #mission-info, #flight-timeline, #launch-site, #videos, #trajectory, #rocket, #updates) { scroll-margin-top: 72px; }
/* Native section links: the desktop rail stays outside the 1000px reading axis. */
:is(.page-detail, .page-terms, .page-report) .detail-toc { position: fixed; top: 50%; right: max(16px, calc((100vw - 1000px) / 2 - 148px)); z-index: 10; transform: translateY(-50%); display: flex; flex-direction: column; gap: 2px; width: 124px; max-height: calc(100dvh - 96px); padding: 10px; overflow: auto; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
:is(.page-detail, .page-terms, .page-report) .detail-toc-task { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; margin: 0 6px 6px; color: var(--strong); font-size: 12px; font-weight: 600; line-height: 1.6; overflow-wrap: anywhere; }
:is(.page-detail, .page-terms, .page-report) .detail-toc a { display: flex; align-items: center; flex: none; min-height: 30px; padding: 4px 6px; border-inline-start: 2px solid transparent; border-radius: 3px; color: var(--muted); font-size: 12px; line-height: 1.5; text-decoration: none; white-space: nowrap; }
:is(.page-detail, .page-terms, .page-report) .detail-toc a:hover, :is(.page-detail, .page-terms, .page-report) .detail-toc a:focus-visible { color: var(--accent-ink); background: var(--accent-soft); }
:is(.page-detail, .page-terms, .page-report) .detail-toc a[aria-current="location"] { color: var(--accent-ink); background: var(--accent-soft); border-inline-start-color: var(--accent); font-weight: 600; }
@media (max-width: 1319px) {
  :is(.page-detail, .page-terms, .page-report) .detail-toc { position: sticky; top: 8px; right: auto; transform: none; flex-direction: row; gap: 4px; width: 100%; max-height: none; margin: 12px 0 4px; padding: 4px 6px; overflow-x: auto; }
  :is(.page-detail, .page-terms, .page-report) .detail-toc-task { display: block; flex: none; max-width: 96px; margin: 0; padding: 10px 8px 10px 2px; border-inline-end: 1px solid var(--line); white-space: nowrap; text-overflow: ellipsis; -webkit-line-clamp: unset; }
  :is(.page-detail, .page-terms, .page-report) .detail-toc a { min-height: 40px; border-inline-start: 0; border-bottom: 2px solid transparent; }
  :is(.page-detail, .page-terms, .page-report) .detail-toc a[aria-current="location"] { border-bottom-color: var(--accent); }
  .page-detail :is(#detail-top, #launch-schedule, #mission-description, #mission-anomaly, #mission-info, #flight-timeline, #launch-site, #videos, #trajectory, #rocket, #updates) { scroll-margin-top: 76px; }
}
@media (prefers-reduced-motion: no-preference) and (forced-colors: none) {
  .page-detail .resource-link, .page-detail .video-outbound { transition: color 150ms ease; }
}

@media (forced-colors: active) {
  .page-detail .update-row::before, .page-detail .update-row::after { background: CanvasText; }
  .page-detail .instant-clock::before { border-color: CanvasText; background: CanvasText; }
  .page-detail .window-bridge.is-range .window-rail { border-top-color: CanvasText; }
  .page-detail .window-bridge.is-range .window-rail::before, .page-detail .window-bridge.is-range .window-rail::after { border-color: CanvasText; background: Canvas; }
  :is(.page-detail, .page-terms, .page-report) .detail-toc a[aria-current="location"] { outline: 1px solid Highlight; }
  .page-detail .detail-reference-clock :is(.reference-phase, .reference-timer, .reference-timer-noscript) { color: CanvasText; }
}

@media (max-width: 740px) {
  .page-calendar .filters { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px 12px; padding: 12px; }
  .page-calendar .filters label, .page-calendar .filters label:nth-child(2), .page-calendar .filters label:nth-child(3) { flex: none; }
  .page-calendar .filters label:nth-child(3) { grid-column: 1 / -1; }
  .page-calendar .filters button[type="submit"] { grid-column: 1 / -1; min-height: 44px; }
  .page-calendar .calendar-bar { flex-direction: column; align-items: stretch; gap: 8px; }
  .page-calendar .calendar-bar .display-controls { justify-content: flex-start; flex-wrap: wrap; }
  .page-calendar .launch-row { grid-template-columns: 66px minmax(0, 1fr); gap: 4px 12px; padding-block: 13px; }
  .page-calendar .launch-time { grid-column: 1; grid-row: 1 / span 2; font-size: 19px; }
  .page-calendar .launch-content { grid-column: 2; }
  .page-calendar .launch-row > .status { grid-column: 2; justify-self: start; margin-top: 2px; }
  .page-calendar .uncertain-tail { grid-column: 2; justify-content: space-between; }
  .page-calendar .day-cell { min-height: 78px; }
  .page-detail .breadcrumb { padding-top: 14px; }
  .page-detail .detail-header { margin: 0; padding: 16px 0 8px; }
  .page-detail .detail-header h1 { font-size: 28px; }
  .page-detail .detail-lead:has(> .detail-media) { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .page-detail .detail-lead > .detail-header { grid-column: 1; grid-row: 1; }
  .page-detail .detail-media { grid-column: 1; grid-row: 2; width: min(100%, 520px); margin: 0; }
  .page-detail .detail-lead > .detail-description { grid-column: 1; grid-row: 3; }
  .page-detail .detail-schedule { gap: 0; }
  .page-detail .schedule-primary dd { font-size: 22px; }
  .page-detail .schedule-secondary { grid-template-columns: 64px minmax(0, 1fr); gap: 12px; }
  .page-detail .detail-grid { grid-template-columns: 92px minmax(0, 1fr); gap: 0 16px; }
  .page-detail .detail-extra { margin-top: 28px; padding-top: 20px; }
  .page-detail .updates { --update-axis: 4px; --update-node-y: 10px; }
  .page-detail .update-row { display: block; padding: 0 0 22px 20px; }
  .page-detail .update-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin-bottom: 8px; padding: 0; }
  .page-detail .update-author { margin: 0; }
}
.page-calendar .day-launch .status { width: max-content; max-width: 100%; }
.page-calendar .intro h1 { text-wrap: balance; }
.page-detail .update-row:hover { background: transparent; }
.page-detail .pagination a { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 4px 10px; border-radius: 7px; text-decoration: none; }
.page-detail .pagination a:hover { background: var(--accent-soft); color: var(--accent-ink); }
@media (forced-colors: active) {
  .page-calendar .launch-row > .status, .page-calendar .uncertain-tail > .status, .page-detail .detail-header .status, .page-calendar .day-launch .status { border: 1px solid currentColor; }
}
.page-calendar .empty-state { margin: 22px 0; padding: 30px 22px; border: 1px dashed var(--line-strong); border-bottom: 1px dashed var(--line-strong); border-radius: 10px; background: var(--surface); text-align: center; color: var(--muted); }
.page-calendar .empty-state h2 { margin-bottom: 6px; font-size: 16px; letter-spacing: -.01em; }
.page-calendar .empty-state p { margin: 0; font-size: 12px; line-height: 1.7; }
@media (max-width: 740px) {
  .page-calendar .day-cell { min-height: 64px; }
}
/* Old-calendar information architecture, restyled for the current identity. */
.page-calendar .cal-stats { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin: 16px 0 0; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); overflow: hidden; }
.page-calendar .cal-stat { padding: 11px 14px; border-inline-end: 1px solid var(--line); min-width: 0; }
.page-calendar .cal-stat:last-child { border-inline-end: 0; }
.page-calendar .cal-stat .n { display: block; color: var(--strong); font-size: 22px; font-weight: 660; letter-spacing: -.04em; line-height: 1.15; font-variant-numeric: tabular-nums; }
.page-calendar .cal-stat .k { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.5; }
.page-calendar .cal-stat.ok .n { color: var(--good); }
.page-calendar .cal-view-tabs { display: flex; flex: 0 0 auto; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 8px; background: var(--inset); }
.page-calendar .cal-view-tabs .tab { padding: 4px 11px; border-radius: 6px; color: var(--muted); font-size: 11px; text-decoration: none; white-space: nowrap; }
.page-calendar .cal-view-tabs .tab:hover { color: var(--accent-ink); }
.page-calendar .cal-view-tabs .tab.on { background: var(--surface); color: var(--strong); font-weight: 600; }
.page-calendar .cal-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 2px; }
.page-calendar .cal-chip { display: inline-flex; align-items: center; padding: 4px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--muted); font-size: 11px; text-decoration: none; white-space: nowrap; }
.page-calendar .cal-chip:hover { border-color: var(--line-strong); color: var(--strong); }
.page-calendar .cal-chip.on { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-ink); font-weight: 600; }
.page-calendar .cal-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 10px 0 0; color: var(--faint); font-size: 10px; }
.page-calendar .lg-dot { display: inline-block; width: 6px; height: 6px; margin-inline-end: 5px; border-radius: 50%; background: currentColor; vertical-align: 1px; }
.page-calendar .lg-dot.good { color: var(--good); }
.page-calendar .lg-dot.tbc { color: var(--tbc); }
.page-calendar .lg-dot.tbd { color: var(--tbd); }
.page-calendar .lg-dot.fail { color: var(--fail); }
@media (max-width: 740px) {
  .page-calendar .cal-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .page-calendar .cal-stat { padding: 9px 11px; border-bottom: 1px solid var(--line); }
  .page-calendar .cal-stat:nth-child(3n) { border-inline-end: 0; }
  .page-calendar .cal-stat:nth-child(n + 4) { border-bottom: 0; }
  .page-calendar .cal-stat .n { font-size: 19px; }
  .page-calendar .cal-chips { flex-wrap: wrap; overflow: visible; padding-bottom: 0; }
}
.page-calendar .cal-toolbar { display: flex; align-items: center; gap: 16px; margin-top: 14px; }
.page-calendar .cal-toolbar .filters { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; margin: 0; padding: 0; border: 0; background: transparent; }
.page-calendar .cal-toolbar .filters label { display: inline-flex; align-items: center; gap: 6px; flex: none; font-size: 10px; letter-spacing: .04em; }
.page-calendar .cal-toolbar .filters select { width: auto; min-height: 36px; padding: 5px 9px; border-color: var(--line); background: var(--surface); font-size: 12px; }
.page-calendar .cal-toolbar .filters button[type="submit"] { min-height: 36px; padding: 5px 14px; border-color: var(--strong); background: var(--strong); color: var(--surface); }
.page-calendar .cal-toolbar .filters button[type="submit"]:hover { border-color: var(--accent); background: var(--accent); }
.page-calendar .cal-toolbar .cal-chips { flex: 1 1 auto; justify-content: flex-end; margin: 0; }
@media (max-width: 740px) {
  .page-calendar .cal-toolbar { flex-direction: column; align-items: stretch; gap: 9px; }
  .page-calendar .cal-toolbar .filters { justify-content: space-between; }
  .page-calendar .cal-toolbar .cal-chips { justify-content: flex-start; }
}
#calendar-content { display: block; }
.page-calendar .month-picker { position: relative; color: var(--strong); font-size: 12px; }
.page-calendar .month-picker summary { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 34px; padding: 4px 10px; border: 1px solid var(--line); border-radius: 6px; cursor: pointer; list-style: none; font-weight: 600; }
.page-calendar .month-picker summary::-webkit-details-marker { display: none; }
.page-calendar .month-picker[open] summary { border-color: var(--accent); background: var(--accent-soft); }
.page-calendar .month-picker-panel { position: absolute; z-index: 10; top: calc(100% + 7px); left: 50%; transform: translateX(-50%); width: 236px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); box-shadow: 0 8px 24px #0002; }
.page-calendar .month-picker-year { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 7px; }
.page-calendar .month-picker-year a { display: inline-flex; justify-content: center; width: 32px; min-height: 32px; padding: 0; border-radius: 4px; text-decoration: none; font-size: 20px; }
.page-calendar .month-picker-year a[aria-disabled] { opacity: .4; }
.page-calendar .month-picker-months { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; }
.page-calendar .month-picker-months a { display: flex; align-items: center; justify-content: center; min-height: 34px; padding: 4px; border-radius: 4px; text-decoration: none; font-size: 12px; color: var(--muted); }
.page-calendar .month-picker-months a:hover, .page-calendar .month-picker-year a[href]:hover { color: var(--accent-ink); background: var(--accent-soft); }
.page-calendar .month-picker-months a[aria-current] { color: var(--accent-ink); background: var(--accent-soft); font-weight: 650; }
/* Native top-layer popovers escape the horizontally scrollable month grid. */
.cal-tip { display: none; position: fixed; inset: auto; margin: 0; width: min(310px, calc(100vw - 24px)); max-height: calc(100vh - 24px); overflow: auto; padding: 13px 15px; border: 1px solid var(--line); border-radius: 7px; background: var(--bg); color: var(--fg); box-shadow: 0 8px 24px #0003; text-align: left; font-size: 11px; line-height: 1.6; cursor: default; }
.cal-tip:popover-open { display: block; }
.cal-tip-title { display: block; margin-bottom: 8px; font-size: 13px; overflow-wrap: anywhere; }
.cal-tip-row { display: grid; grid-template-columns: 5em minmax(0, 1fr); gap: 8px; margin-top: 3px; overflow-wrap: anywhere; }
.cal-tip-row > span:first-child { color: var(--muted); }
@media (max-width: 740px) {
  .page-calendar .calendar-bar { flex-direction: column; align-items: stretch; gap: 8px; }
  .page-calendar .month-nav { justify-content: space-between; }
  .page-calendar .cal-view-tabs { align-self: flex-start; }
}
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.page-calendar .day-launch { position: relative; }
.page-calendar .cal-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; padding: 26px 0 20px; }
.page-calendar .cal-head-copy { min-width: 0; }
.page-calendar .cal-head-copy h1 { font-size: clamp(30px, 3.4vw, 40px); font-weight: 680; letter-spacing: -.038em; line-height: 1.22; }
.page-calendar .cal-head-note { max-width: 42em; margin: 8px 0 0; color: var(--muted); font-size: 12px; line-height: 1.75; }
.page-calendar .cal-head-nav { flex: 0 0 auto; display: flex; align-items: center; gap: 14px; margin: 0; padding: 0; border: 0; }
.page-calendar .cal-head-nav > a, .page-calendar .cal-head-nav > span { min-height: 34px; display: inline-flex; align-items: center; padding: 4px 8px; border-radius: 7px; color: var(--muted); font-size: 11.5px; }
.page-calendar .cal-head-nav > a:hover { background: var(--accent-soft); color: var(--accent-ink); }
.page-calendar .cal-head-nav [aria-disabled] { color: var(--faint); }
.page-calendar .cal-stats { margin-top: 6px; border: 0; background: var(--surface); }
.page-calendar .cal-stat { border-inline-end: 0; padding: 13px 18px; }
.page-calendar .cal-stat + .cal-stat { border-inline-start: 0; }
.page-calendar .cal-chips { margin-top: 14px; }
.page-calendar .cal-chip { border-color: transparent; background: var(--inset); color: var(--muted); }
.page-calendar .cal-chip:hover { border-color: transparent; background: var(--chip-hover); color: var(--strong); }
.page-calendar .cal-chip.on { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-ink); }
/* Fixed colors follow the existing agency groups across months and filters. */
.page-calendar [data-org="spx"] { --agency-ink: #2457a7; --agency-bg: #edf3fb; }
.page-calendar [data-org="cnsa"] { --agency-ink: #a83b16; --agency-bg: #fff0e7; }
.page-calendar [data-org="nasa"] { --agency-ink: #6b46a0; --agency-bg: #f4eefb; }
.page-calendar [data-org="esa"] { --agency-ink: #16736b; --agency-bg: #e9f5f1; }
.page-calendar [data-org="rl"] { --agency-ink: #397222; --agency-bg: #eef5e9; }
.page-calendar [data-org="ula"] { --agency-ink: #a13b6b; --agency-bg: #fbeef4; }
.page-calendar [data-org="isro"] { --agency-ink: #88611d; --agency-bg: #faf2df; }
.page-calendar [data-org="jaxa"] { --agency-ink: #176d8e; --agency-bg: #eaf3f8; }
.page-calendar [data-org="other"] { --agency-ink: #59616b; --agency-bg: #f0f1f3; }
@supports (color: light-dark(white, black)) {
  .page-calendar [data-org="spx"] { --agency-ink: light-dark(#2457a7, #9bc2ff); --agency-bg: light-dark(#edf3fb, #1c2a40); }
  .page-calendar [data-org="cnsa"] { --agency-ink: light-dark(#a83b16, #ffb38d); --agency-bg: light-dark(#fff0e7, #3a261e); }
  .page-calendar [data-org="nasa"] { --agency-ink: light-dark(#6b46a0, #c9abf5); --agency-bg: light-dark(#f4eefb, #2d243c); }
  .page-calendar [data-org="esa"] { --agency-ink: light-dark(#16736b, #7dd7c8); --agency-bg: light-dark(#e9f5f1, #17332e); }
  .page-calendar [data-org="rl"] { --agency-ink: light-dark(#397222, #a7d787); --agency-bg: light-dark(#eef5e9, #25321c); }
  .page-calendar [data-org="ula"] { --agency-ink: light-dark(#a13b6b, #efabcb); --agency-bg: light-dark(#fbeef4, #382432); }
  .page-calendar [data-org="isro"] { --agency-ink: light-dark(#88611d, #e9ca77); --agency-bg: light-dark(#faf2df, #352e1d); }
  .page-calendar [data-org="jaxa"] { --agency-ink: light-dark(#176d8e, #80d1eb); --agency-bg: light-dark(#eaf3f8, #1b2f39); }
  .page-calendar [data-org="other"] { --agency-ink: light-dark(#59616b, #bcc4ce); --agency-bg: light-dark(#f0f1f3, #282d34); }
}
.page-calendar .cal-chip[data-org]:not([data-org=""]) { gap: 5px; color: var(--agency-ink); background: var(--agency-bg); }
.page-calendar .cal-chip[data-org]:not([data-org=""])::before { content: ""; width: 6px; height: 6px; flex: none; border-radius: 50%; background: currentColor; }
.page-calendar .cal-chip.on[data-org]:not([data-org=""]), .page-calendar .cal-chip[data-org]:not([data-org=""]):hover { border-color: var(--agency-ink); }
.page-calendar .day-launch[data-org] { background: var(--agency-bg); }
.page-calendar .day-launch[data-org] > .launch-name { color: var(--agency-ink); }
.page-calendar .day-launch[data-org]:hover > .launch-name { text-decoration: underline; text-underline-offset: 2px; }
.page-calendar .month-scroll-note, .page-calendar .calendar-scroll-note { color: var(--faint); }
.page-calendar .uncertain-plans { border: 0; background: var(--surface); }
.page-calendar .uncertain-plans .launch-row { border-bottom: 0; color: inherit; text-decoration: none; }
.page-calendar .uncertain-plans .launch-row:hover .launch-title { color: var(--accent-ink); text-decoration: underline; }
.page-calendar .uncertain-tail { display: flex; align-items: center; gap: 14px; padding-inline-end: 4px; min-width: 0; }
.page-calendar .uncertain-tail > .status { margin: 0; max-width: none; }
.page-calendar .uncertain-action { display: block; flex: none; font-size: 15px; line-height: 1; font-weight: 500; color: var(--accent-ink); }
@media (max-width: 740px) {
  .page-calendar .cal-head { flex-direction: column; align-items: stretch; gap: 12px; padding-top: 20px; }
  .page-calendar .cal-head-nav { justify-content: space-between; }
  .page-calendar .cal-stat { padding: 10px 11px; border-bottom: 0; }
}
/* One shared brand header for home, calendar and detail. The full-width band
   owns the hairline so the brand row has identical geometry on every page. */
.site-header-band { border-bottom: 1px solid var(--line); }
.site-header-band .site-header { min-height: 64px; height: 64px; padding-block: 0; flex-wrap: nowrap; border-bottom: 0; gap: 8px 20px; }
.site-header-band .brand { gap: 10px; letter-spacing: 0; white-space: nowrap; }
/* Resource nav sits left of the theme control. The wrapper owns the right
   alignment, so the theme button keeps its own geometry and semantics. */
.site-header-tools { display: flex; flex: 0 0 auto; align-items: center; gap: 4px 16px; margin-inline-start: auto; }
.site-header-tools .theme-control { margin-inline-start: 0; }
.header-nav { display: flex; flex: 0 0 auto; align-items: center; gap: 16px; white-space: nowrap; }
.header-nav a { display: inline-flex; align-items: center; min-height: 44px; color: var(--muted); font-size: 13px; font-weight: 500; line-height: 1.4; letter-spacing: 0; text-decoration: none; }
.header-nav a:hover { color: var(--accent-ink); }
.header-nav a:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 2px; border-radius: 2px; }
/* Current entry follows the landing tabs: normal ink at normal weight, and the
   orange is carried by the 2px rule only. The page itself and a section parent
   (location) share that rule so neither one turns into heavy orange type. */
.header-nav a[aria-current] {
  color: var(--fg);
  font-weight: 500;
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 2px;
  text-underline-offset: 6px;
}
.theme-control { display: none; flex: 0 0 auto; align-items: center; justify-content: flex-end; margin-inline-start: auto; gap: 0; width: 44px; height: 44px; min-height: 44px; padding: 0; appearance: none; border: 0; border-radius: 0; background: transparent; box-shadow: none; font-family: var(--text); font-size: 11px; font-weight: 400; line-height: 1.4; letter-spacing: 0; color: var(--muted); }
.theme-control:hover:not(:disabled), .theme-control:active { border: 0; background: transparent; box-shadow: none; color: var(--accent-ink); }
.theme-control svg { display: block; flex: 0 0 16px; stroke-linecap: round; stroke-linejoin: round; }
.theme-control .theme-auto, .theme-control .theme-sun, .theme-control .theme-moon { display: none; }
:root[data-theme-mode="auto"] .theme-control .theme-auto,
:root[data-theme-mode="light"] .theme-control .theme-sun,
:root[data-theme-mode="dark"] .theme-control .theme-moon { display: block; }
@supports (color: light-dark(white, black)) { .theme-control { display: inline-flex; } }
.site-header .brand-name { font-size: 17px; font-weight: 680; }
.site-header .brand-name small { color: var(--faint); font-size: 10px; font-weight: 540; letter-spacing: .095em; margin-inline-start: 3px; }
@media (max-width: 740px) {
  .site-header-band .site-header { min-height: 56px; height: 56px; }
  .site-header-band .brand { gap: 8px; }
  .site-header .brand img { width: 28px; height: 28px; flex-basis: 28px; }
  .site-header .brand-name { font-size: 16px; }
  .site-header .brand-name small { font-size: 9px; letter-spacing: .08em; margin-inline-start: 2px; }
  .site-header-tools { gap: 2px 8px; }
  .header-nav { gap: 10px; }
  .header-nav a { font-size: 12px; }
}
/* 320px keeps brand, all four entries and the 44px theme button on one row. */
@media (max-width: 400px) {
  .site-header-band .site-header { gap: 4px 8px; }
  .site-header-tools { gap: 2px 6px; }
  .header-nav { gap: 8px; }
}
/* Narrowest screens drop only the small Latin wordmark so the four links and
   the theme button never push the brand out of the row. */
@media (max-width: 380px) {
  .site-header .brand-name small { display: none; }
  .header-nav { gap: 6px; }
}
.page-calendar .cal-head-copy .cal-month { margin: 0; font-size: clamp(30px, 3.4vw, 40px); font-weight: 680; letter-spacing: -.038em; line-height: 1.22; }
/* Editorial zones: rules mark changes of purpose, never every task row.
   Warm-gray fills stay local to labels and supporting information, not cards. */
.site-header-band { border-bottom: 0; }
.landing-header .tabs { flex: 1; box-shadow: inset 0 -1px var(--zone-rule); }

/* A date is a small index label. Tasks themselves remain unboxed. */
.page-home .date-group.day-title { padding-block: 16px 8px; }
.page-home .day-title h4 { padding: 3px 8px; border-radius: 3px; background: var(--zone-muted); font-size: 11px; letter-spacing: .015em; }
.page-home .day-count { color: var(--faint); }
.page-home .launch-row.record { border-top: 0; }
.page-home .timeline-section + .timeline-section { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--zone-rule); }
.page-home .now-divider::before { display: none; }
.page-home .now-divider::after { display: block; background: linear-gradient(90deg, var(--now-rule), var(--line) 65%); }
.page-home .note { border-top: 1px solid var(--line); margin-top: 28px; }

/* A single statistical band, not six cards. Tiny vertical ticks group numbers. */
.page-calendar .cal-stats { background: var(--zone-muted); border-radius: 6px; }
.page-calendar .cal-stat { position: relative; }
.page-calendar .cal-stat + .cal-stat::before { content: ""; position: absolute; left: 0; top: 50%; width: 1px; height: 24px; transform: translateY(-50%); background: var(--zone-rule); }
.page-calendar .cal-chips { margin-top: 18px; }
.page-calendar .uncertain-plans { margin-top: 28px; padding: 18px 0 0; border: 0; border-top: 1px solid var(--zone-rule); border-radius: 0; background: transparent; }
.page-calendar .uncertain-plans .launch-row.record { border-top: 0; text-decoration: none; }
.page-calendar .uncertain-plans .record:hover { background: var(--hover-tint); }
.page-calendar .uncertain-plans .record-copy { min-width: 0; }
.page-calendar .uncertain-plans .record .place { display: contents; }
.page-calendar .uncertain-plans .uncertain-tail { justify-content: flex-end; }
.page-calendar .uncertain-plans .uncertain-tail > .status { padding: 0; border-radius: 0; background: transparent; color: var(--faint); font-size: 11px; font-weight: 590; line-height: 1.6; }
.page-calendar .uncertain-plans .uncertain-tail > .status::before { display: none; }
.page-calendar .uncertain-plans .status.good { color: var(--good); }
.page-calendar .uncertain-plans .status.tbc { color: var(--tbc); }
.page-calendar .uncertain-plans .status.tbd { color: var(--tbd); }
.page-calendar .uncertain-plans .status.fail { color: var(--fail); }
.page-calendar .uncertain-plans .status.live { color: var(--live); }
/* Undated tasks group under a quiet provider heading: hairlines between groups,
   no card, and every row stays one plain task link. */
.page-calendar .uncertain-provider { padding-top: 12px; border-top: 1px solid var(--line); }
.page-calendar .uncertain-provider:first-of-type { padding-top: 0; border-top: 0; }
.page-calendar .uncertain-provider + .uncertain-provider { margin-top: 14px; }
.page-calendar .uncertain-provider-title { margin: 0; padding-block-end: 3px; color: var(--muted); font-size: 11.5px; font-weight: 560; line-height: 1.6; }
.page-calendar .uncertain-provider .timeline { margin-top: 2px; }
.page-calendar .launch-row { border-bottom: 0; }
.page-calendar .cal-legend { margin-top: 14px; }

@media (max-width: 740px) {
  .page-home .date-group.day-title { padding-block: 14px 7px; }
  .page-home .day-title h4 { font-size: 10.5px; padding: 3px 6px; }
  .page-home .timeline-section + .timeline-section { margin-top: 18px; padding-top: 14px; }
  .page-calendar .cal-stat:nth-child(4)::before { display: none; }
  .page-calendar .uncertain-plans { padding: 16px 0 0; }
  .page-calendar .uncertain-plans .record .place { display: flex; }
  .page-calendar .uncertain-plans .uncertain-tail { margin-left: auto; }
  .page-calendar .uncertain-plans .uncertain-tail > .status { font-size: 10px; }
}
/* Rocket reference: photo and description share the first row, then the whole
   spec sheet and its source links run across the full width. The wrapper stays
   in the DOM but hands its children to the outer grid, so a missing photo leaves
   no empty image column and a missing description leaves no empty text column. */
.page-detail .rocket-overview { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px 28px; align-items: start; margin-block: 14px 0; }
.page-detail .rocket-overview:has(> figure) { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); }
.page-detail .rocket-overview:has(> figure):not(:has(.rocket-body > .plain-text)) { grid-template-columns: minmax(0, 1fr); }
.page-detail .rocket-overview > *, .page-detail .rocket-body > * { min-width: 0; }
.page-detail .rocket-overview:has(> figure) > figure { grid-column: 1; grid-row: 1; }
.page-detail .rocket-overview:has(> figure) .rocket-body > .plain-text { grid-column: 2; grid-row: 1; }
.page-detail .rocket-specs, .page-detail .rocket-links { grid-column: 1 / -1; }
.page-detail .rocket-image { display: block; width: auto; max-width: 100%; height: auto; max-height: 360px; margin-inline: auto; object-fit: contain; object-position: center; border-radius: 8px; background: var(--zone-soft); box-shadow: inset 0 0 0 1px var(--line); }
.page-detail .rocket-body { display: contents; }
.page-detail .rocket-specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; margin: 0; }
.page-detail .rocket-spec { min-width: 0; padding-block: 9px 10px; border-top: 1px solid var(--line); }
.page-detail .rocket-spec dt { color: var(--muted); font-size: 12px; line-height: 1.6; }
.page-detail .rocket-spec dd { margin: 2px 0 0; color: var(--fg); font-size: 14px; line-height: 1.6; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.page-detail .rocket-links { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.page-detail .rocket-links:empty { display: none; }
.page-detail .rocket-links a { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; color: var(--accent-ink); font-size: 13px; }
.page-detail .rocket-links a:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 4px; }

/* A quiet homepage follow section; QR pixels and white quiet zone stay intact. */
.page-home .wechat-follow { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 14px; margin-top: 16px; padding: 12px 0 0; border-top: 1px solid var(--line); }
.page-home .wechat-follow-copy { grid-column: 2; grid-row: 1; min-width: 0; }
.page-home .wechat-follow h2 { margin: 0; color: var(--muted); font-size: 13px; font-weight: 500; line-height: 1.5; }
.page-home .wechat-follow p { max-width: 36em; margin: 4px 0 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.page-home .wechat-qrcode { grid-column: 1; grid-row: 1; display: block; width: max-content; max-width: 100%; padding: 4px; background: #fff; }
.page-home .wechat-qrcode img { display: block; width: 86px; height: 86px; max-width: 100%; margin: 0; background: #fff; filter: none; mix-blend-mode: normal; }
@media (max-width: 740px) {
  .page-home .wechat-follow { gap: 12px; margin-top: 12px; }
}

/* About shares the same editorial width and quiet warm-white section rhythm. */
.page-about { font-size: 14px; line-height: 1.8; letter-spacing: -.008em; }
.page-about .shell { width: calc(100% - 72px); max-width: 1000px; }
.about-content { width: 100%; max-width: none; padding-block: 36px 12px; }
.about-hero, .about-section > :is(h2, h3, p, ul, ol) { max-width: 760px; }
.about-content h1 { margin-bottom: 16px; font-size: clamp(28px, 3.4vw, 40px); letter-spacing: -.035em; }
.page-about .breadcrumb { display: flex; align-items: center; gap: 8px; margin: 0 0 20px; color: var(--faint); font-size: 12px; }
.page-about .breadcrumb a { display: inline-flex; align-items: center; min-height: 28px; color: var(--muted); text-decoration: none; }
.page-about .breadcrumb a:hover { color: var(--accent-ink); text-decoration: underline; }
.about-lead { max-width: 42em; margin: 0; color: var(--muted); font-size: 16px; line-height: 1.85; }
.about-section { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 10px 32px; margin-top: 36px; padding: 0; border: 0; }
.about-section > :not(h2) { grid-column: 2; min-width: 0; }
.about-section h2 { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.7; }
.about-section h3 { margin-block: 20px 8px; font-size: 16px; }
.about-section p, .about-section li { line-height: 1.85; }
.about-section ul, .about-section ol { padding-inline-start: 22px; }
.about-section li + li { margin-top: 8px; }
.about-section a { color: var(--accent-ink); }
/* Terms page: the same 1000px editorial axis as the detail route. Every section
   is a full-width block opened by one hairline; there is no left title column
   and no 760px cap, so tables keep their real column widths on desktop. */
.page-terms { font-size: 14px; line-height: 1.7; letter-spacing: -.008em; }
.page-terms .shell { width: calc(100% - 72px); max-width: 1000px; }
.page-terms [id] { scroll-margin-top: 72px; }
.page-terms .term-link:not(.status), .page-terms .terms-link:not(.status) { color: inherit; }
.page-terms .term-link:not(.status):hover, .page-terms .term-link:not(.status):focus-visible, .page-terms .terms-link:not(.status):hover, .page-terms .terms-link:not(.status):focus-visible { color: var(--accent-ink); }
/* Page head mirrors the detail header: breadcrumb, title, then one lead. */
.page-terms .terms-content { padding-block: 0 8px; }
.page-terms .breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 20px 0 0; color: var(--faint); font-size: 12px; }
.page-terms .breadcrumb a { display: inline-flex; align-items: center; min-height: 28px; color: var(--muted); text-decoration: none; }
.page-terms .breadcrumb a:hover, .page-terms .breadcrumb a:focus-visible { color: var(--accent-ink); text-decoration: underline; }
.page-terms .terms-header { margin: 0; padding: 20px 0 0; }
.page-terms .terms-header h1 { margin: 0; font-size: clamp(30px, 3.2vw, 36px); font-weight: 680; letter-spacing: -.035em; line-height: 1.3; text-wrap: pretty; }
.page-terms .terms-lead { max-width: 46em; margin: 10px 0 0; color: var(--muted); font-size: 13px; line-height: 1.8; }
/* Section TOC reuses the detail rail (.detail-toc); its layout lives in the page-detail block above. */
/* Detail-style section rhythm: hairline, quiet accent bar, full-width body. */
.page-terms .terms-section { margin: 22px 0 0; padding: 22px 0 0; border-top: 1px solid var(--line); }
.page-terms .terms-section > h2 { margin: 0 0 12px; font-size: 18px; font-weight: 660; letter-spacing: -.02em; line-height: 1.5; }
.page-terms .terms-section > h2::before { content: ""; display: inline-block; width: 4px; height: 15px; margin-right: 10px; border-radius: 3px; background: var(--accent); vertical-align: -1px; }
.page-terms .terms-section h3 { margin: 24px 0 10px; font-size: 15px; font-weight: 660; letter-spacing: -.01em; line-height: 1.6; }
.page-terms .terms-section p, .page-terms .terms-section li { margin: 0 0 12px; font-size: 14px; line-height: 1.85; }
.page-terms .terms-section > :last-child { margin-bottom: 0; }
.page-terms .terms-section ul, .page-terms .terms-section ol { margin: 0 0 14px; padding-inline-start: 22px; }
.page-terms .terms-section li + li { margin-top: 6px; }
.page-terms .terms-section a { color: var(--accent-ink); }
.page-terms .terms-section code { padding: 1px 5px; border-radius: 3px; background: var(--inset); color: var(--strong); font-size: 12.5px; overflow-wrap: anywhere; }
/* Reference-style aside: a quoted block, not an alert. */
.page-terms .terms-note { margin: 16px 0; padding: 12px 16px; border: 1px solid var(--line); border-radius: 6px; background: var(--zone-soft); }
.page-terms .terms-note p { margin: 0; }
/* Tables fill the block and scroll only inside their own box on narrow screens. */
.page-terms .terms-scroll { max-width: 100%; margin: 14px 0 18px; padding-block: 2px 4px; overflow-x: auto; overscroll-behavior-x: contain; }
.page-terms .terms-table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 13px; line-height: 1.7; }
.page-terms .terms-table caption { margin-bottom: 8px; color: var(--faint); font-size: 12px; text-align: left; }
.page-terms .terms-table :is(th, td) { padding: 9px 18px 9px 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.page-terms .terms-table thead th { color: var(--muted); font-size: 12px; font-weight: 600; border-bottom-color: var(--line-strong); white-space: nowrap; }
.page-terms .terms-table tbody th { color: var(--fg); font-weight: 600; }
.page-terms .terms-table :is(th, td):last-child { padding-right: 0; }
.page-terms .terms-table tbody tr:last-child :is(th, td) { border-bottom: 0; }
@media (max-width: 920px) { .page-terms .shell { width: calc(100% - 52px); } }
@media (max-width: 740px) {
  .page-terms .shell { width: calc(100% - 34px); }
  .page-terms .terms-header h1 { font-size: 26px; }
  .page-terms .terms-section { margin-top: 18px; padding-top: 18px; }
  .page-terms .terms-section > h2 { font-size: 17px; }
  .page-terms .terms-section h3 { margin-top: 20px; }
  .page-terms .terms-table { font-size: 12.5px; }
  .page-terms .terms-table :is(th, td) { padding: 8px 12px 8px 0; }
}
@media (max-width: 370px) { .page-terms .shell { width: calc(100% - 28px); } }
@media (max-width: 1319px) {
  /* Keep the sticky section menu from covering the anchor it just jumped to. */
  .page-terms [id] { scroll-margin-top: 76px; }
}
@media (forced-colors: active) {
  .page-terms .terms-section { border-top-color: CanvasText; }
  .page-terms .terms-section > h2::before { background: CanvasText; }
  .page-terms .terms-note { border-color: CanvasText; background: Canvas; color: CanvasText; }
}
@media (max-width: 920px) { .page-about .shell { width: calc(100% - 52px); } }
@media (max-width: 740px) {
  .page-about .shell { width: calc(100% - 34px); }
  .about-content { padding-block: 26px 8px; }
  .about-section { grid-template-columns: minmax(0, 1fr); margin-top: 28px; }
  .about-section > :not(h2) { grid-column: 1; }
  .page-detail .rocket-overview:has(> figure) { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .page-detail .rocket-overview:has(> figure) > figure,
  .page-detail .rocket-overview:has(> figure) .rocket-body > .plain-text { grid-column: 1; grid-row: auto; }
  .page-detail .rocket-image { max-height: 320px; }
  .page-detail .rocket-specs { grid-template-columns: minmax(0, 1fr); }
  .page-detail .rocket-spec { display: grid; grid-template-columns: 124px minmax(0, 1fr); gap: 12px; align-items: baseline; padding-block: 7px 8px; }
  .page-detail .rocket-spec dd { margin: 0; }
}
@media (max-width: 370px) { .page-about .shell { width: calc(100% - 28px); } }

/* One footer for all four routes. It owns typography and shell breakpoints,
   rather than inheriting subtly different page text metrics. */
.site-footer.shell { width: calc(100% - 72px); max-width: 1000px; margin-top: 40px; padding-block: 24px 30px; border-top: 1px solid var(--line); color: var(--muted); font-family: var(--text); font-size: 11px; line-height: 1.8; letter-spacing: 0; font-synthesis: weight; text-rendering: optimizeLegibility; }
.site-footer p { margin: 0; }
.site-footer .footer-main { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 12px 24px; }
.site-footer .footer-brand { min-width: 0; }
.site-footer .footer-name { color: var(--strong); font-size: 13px; font-weight: 600; margin-bottom: 3px; }
.site-footer .footer-name span { margin-left: 6px; color: var(--faint); font-size: 10px; font-weight: 400; letter-spacing: .04em; }
.site-footer nav { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; min-width: 0; }
.site-footer nav a { display: inline-flex; align-items: center; min-height: 28px; }
.site-footer .footer-bottom { display: flex; justify-content: space-between; align-items: baseline; gap: 8px 24px; margin-top: 0; }
.site-footer .footer-source { display: flex; align-items: baseline; flex-wrap: wrap; gap: 3px 6px; min-width: 0; }
.site-footer .footer-about { display: inline-flex; flex: none; align-items: center; min-height: 28px; white-space: nowrap; }
.site-footer .footer-source > * { white-space: nowrap; }
.page-home .site-footer.shell { margin-top: 12px; }
.site-footer a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.site-footer a:hover { color: var(--accent-ink); }
@media (max-width: 920px) { .site-footer.shell { width: calc(100% - 52px); } }
@media (max-width: 740px) {
  .site-footer.shell { width: calc(100% - 34px); margin-top: 32px; padding-block: 22px 26px; }
  .site-footer .footer-main { gap: 8px 18px; }
  .site-footer nav { gap: 4px 18px; }
  .site-footer .footer-bottom { column-gap: 14px; margin-top: 0; }
}
@media (max-width: 370px) { .site-footer.shell { width: calc(100% - 28px); } }

@media (forced-colors: active) {
  .landing-header .tabs { border-bottom: 1px solid CanvasText; }
  .page-home .day-title h4 { outline: 1px solid GrayText; }
  .page-calendar .cal-stats { outline: 1px solid GrayText; }
}

/* Report list pages: only real archived reports, no placeholder cards. */
.reports-page { padding-block: 32px 48px; }
.reports-header h1 { margin: 12px 0 0; font-size: clamp(26px, 3vw, 34px); font-weight: 680; letter-spacing: -.035em; line-height: 1.3; }
.reports-header .page-intro { max-width: 42em; margin: 10px 0 0; color: var(--muted); font-size: 13px; line-height: 1.85; }
.reports-section { margin-top: 28px; padding-top: 18px; border-top: 1px solid var(--line); }
.reports-section h2 { margin: 0 0 12px; font-size: 17px; font-weight: 660; letter-spacing: -.02em; }
.reports-list { margin: 0; padding: 0; list-style: none; }
.reports-list li + li { border-top: 1px solid var(--line); }
.reports-list a { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px; min-height: 44px; padding: 11px 0; color: inherit; text-decoration: none; }
.reports-list a:hover .reports-label { color: var(--accent-ink); }
.reports-label { font-size: 14px; font-weight: 560; }
.reports-date { color: var(--faint); font-size: 12px; font-variant-numeric: tabular-nums; }

/* 2026-10-24 focused timeline, calendar and detail refinements. */
.page-home .launch-row:hover .launch-title,
.page-home .launch-row:focus-visible .launch-title { text-decoration: underline; text-underline-offset: 3px; }

.page-calendar .cal-filters { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px 18px; margin-top: 18px; }
.page-calendar .cal-filters .cal-chips { flex: 1 1 auto; margin: 0; }
/* Countries are the same chip strip as the orgs, and the wider list takes its own row. */
.page-calendar .cal-filters .country-chips { flex: 1 0 100%; }
.page-calendar .country-chips .cal-chip { font-family: "CHX Flag Emoji", var(--text); }

.page-calendar .uncertain-plans .launch-row.record { grid-template-columns: minmax(0, 1fr) minmax(120px, 167px); gap: 12px 18px; padding-inline: 16px 14px; }
.page-calendar .uncertain-plans .record .main-col { grid-column: 1; }
.page-calendar .uncertain-plans .record .place { display: block; grid-column: 2; justify-self: end; text-align: end; }

.page-detail .window-schedule { display: block; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); }
.page-detail .window-schedule dd { margin-top: 5px; }
.page-detail .window-range { color: var(--muted); font-size: 13px; line-height: 1.62; }
.page-detail .window-range > span, .page-detail .window-range > .time-utc { display: block; }
.page-detail .window-range .time-utc { margin-top: 8px; color: var(--muted); font-size: 12px; line-height: 1.55; }
/* One boundary per edge: an instant and its zone suffix wrap as a unit, so a
   320px column never strands CST/UTC on a line of its own. The value itself is
   never split, re-dated or relabelled here. */
.page-detail .window-boundary { display: inline-block; white-space: nowrap; }
/* These mobile values own the same properties as the rules above, so they have
   to stay after them (the older 740px block only zeroes the plan gap). */
@media (max-width: 740px) {
  .page-detail .detail-overview { margin-top: 16px; }
  .page-detail .detail-reference-clock { margin-top: 12px; }
  .page-detail .detail-reference-clock .status { top: -5.2px; }
  .page-detail .window-schedule { margin-top: 14px; padding-top: 10px; }
  .page-detail .schedule-primary dd { margin-top: 5px; font-size: 22px; }
  .page-detail .instant-clock { font-size: 28px; }
  .page-detail .window-schedule > dd > .time-suffix { top: 10px; }
}
@media (max-width: 400px) {
  .page-detail .schedule-primary dd { letter-spacing: -.025em; }
  .page-detail .reference-clock-group { gap: 4px 10px; }
  .page-detail .window-track { gap: 10px; }
}

/* A video is a 16:9 frame plus one honest caption line. Embedded players keep
   the real iframe; every other source reuses the same frame with a decorative
   play triangle and stays an ordinary external link, never a fake in-page
   player. */
.page-detail .video-resources { display: grid; gap: 22px 24px; }
.page-detail .video-resources li + li { margin-top: 0; }
.page-detail .video-resource { min-width: 0; }
.page-detail .video-player, .page-detail .video-placeholder { width: 100%; max-width: 760px; aspect-ratio: 16 / 9; margin-bottom: 6px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--zone-soft); }
.page-detail .video-placeholder { display: flex; align-items: center; justify-content: center; }
.page-detail .video-player iframe { display: block; width: 100%; height: 100%; border: 0; }
.page-detail .video-play { display: block; flex: none; width: 46px; height: 46px; }
.page-detail .video-outbound { display: block; width: 100%; max-width: 760px; color: var(--fg); text-decoration: none; }
.page-detail .video-caption { display: inline-flex; align-items: center; gap: 7px; min-width: 0; max-width: 100%; font-size: 14px; line-height: 1.7; }
.page-detail .video-caption-text { min-width: 0; overflow-wrap: anywhere; }
.page-detail .video-outbound:hover, .page-detail .video-outbound:focus-visible { color: var(--accent-ink); }
.page-detail .video-outbound:hover .video-caption-text, .page-detail .video-outbound:focus-visible .video-caption-text { text-decoration: underline; text-underline-offset: 4px; }
/* The outbound video is a whole 16:9 frame plus a play glyph, so it takes the
   reference treatment on its caption only; the glyph stays body ink. */
.page-detail .video-caption { color: var(--accent-ink); }
.page-detail .video-outbound:is(:hover, :focus-visible) .video-caption { color: var(--accent); }
@media (min-width: 741px) {
  .page-detail .video-resources { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 740px) {
  .page-calendar .cal-filters { flex-direction: column; align-items: stretch; gap: 12px; }
  .page-calendar .cal-filters .country-chips { flex: 0 0 auto; }
  .page-calendar .uncertain-plans .launch-row.record { grid-template-columns: minmax(0, 1fr); grid-template-areas: none; padding-inline: 12px; }
  /* The shared mobile row names its areas `main`/`place`. With no areas left the
     shorthand's row half still resolved both children onto one implicit row, so
     clear the whole area first and only then pin the single column. */
  .page-calendar .uncertain-plans .record .main-col,
  .page-calendar .uncertain-plans .record .place { grid-area: auto; grid-column: 1; }
  .page-calendar .uncertain-plans .record .place { justify-self: start; text-align: start; padding-top: 2px; }
  .page-detail .detail-media { margin-top: 0; }
}

/* ---------------------------------------------------------------------------
   2026-10-25 shared mission identity, detail header copy and schedule icons.
   The identity row is the same contract on the homepage Hero and the task
   detail header: one model nameplate plus a quiet provider fact. Each name is
   its own library link when the record carries a trusted identity, and stays
   plain text otherwise; neither name carries term-anchor wording.
--------------------------------------------------------------------------- */
/* The row resets the Hero lede metrics it also carries (class .lede) so both
   routes share one 14px identity line instead of a 13px/225px Hero variant. */
:is(.landing-header, .page-detail) .mission-identity {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 16px;
  max-width: none;
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.6;
  letter-spacing: 0;
}
/* Warm nameplate: the model stays the identity anchor; its name is the only
   link inside, so the plate itself is never a second click target. */
:is(.landing-header, .page-detail) .mission-identity .mission-model {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 3px 8px;
  border: 1px solid color-mix(in srgb, var(--accent) 25%, var(--line));
  border-radius: 3px;
  background: var(--accent-soft);
  color: var(--strong);
  font-size: 14px;
  font-weight: 550;
  line-height: 20px;
  letter-spacing: 0;
}
:is(.landing-header, .page-detail) .mission-identity .mission-model .hero-fact-icon {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  color: var(--accent-ink);
  stroke-width: 1.7;
}
:is(.landing-header, .page-detail) .mission-identity .mission-model .model-name {
  min-width: 0;
  overflow-wrap: anywhere;
}
/* The provider stays outside the plate at plain fact size; its icon is kept. */
:is(.landing-header, .page-detail) .mission-identity .mission-provider {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 400;
  line-height: 22px;
  letter-spacing: 0;
}
:is(.landing-header, .page-detail) .mission-identity .mission-provider .hero-fact-icon {
  width: 13px;
  height: 13px;
  flex: 0 0 13px;
  color: var(--faint);
  stroke-width: 1.65;
}
:is(.landing-header, .page-detail) .mission-identity .mission-provider > :last-child {
  min-width: 0;
  overflow-wrap: anywhere;
}
:is(.landing-header, .page-detail) .mission-identity .mission-provider .provider-country-flag { margin-inline-end: 0; font-size: 14px; line-height: 1; vertical-align: 0; }
@media (max-width: 740px) {
  :is(.landing-header, .page-detail) .mission-identity .mission-provider { font-size: 12px; line-height: 20px; }
}
@media (forced-colors: active) {
  :is(.landing-header, .page-detail) .mission-identity .mission-model { border-color: CanvasText; background: Canvas; color: CanvasText; }
  :is(.landing-header, .page-detail) .mission-identity :is(.mission-model, .mission-provider) .hero-fact-icon { color: CanvasText; }
}
/* Rocket and provider names are the only text in the identity row, the timeline
   meta line, the calendar tooltip and the pending lists that navigates to its
   own library page. One class keeps that affordance identical everywhere: the
   name keeps the surrounding type colour and gains the site's dotted-underline
   link language instead of a second label or an extra sentence. */
a.entity-link {
  position: relative;
  color: inherit;
  text-decoration: underline dotted;
  text-decoration-thickness: 1px;
  text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);
  text-underline-offset: 3px;
}
a.entity-link:hover, a.entity-link:focus-visible { color: var(--accent-ink); text-decoration-style: solid; }
a.entity-link:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 2px; border-radius: 3px; }
/* An invisible pseudo box lifts the pointer target of an 11px meta link to one
   18px line box plus 6px = >=24px without adding layout height. It grows into
   the 5px gap above the meta line and the 12px gap beside it, so it never
   covers the mission title above or the neighbouring name beside it. */
.entity-link::after { content: ""; position: absolute; inset: -3px -3px; }
@media (forced-colors: active) { a.entity-link { text-decoration-color: currentColor; } }

/* The planned-time and window labels pair a 14px muted icon with their label
   on one baseline; the CST/UTC explanations stay sibling links outside <time>. */
.page-detail .detail-schedule dt {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.page-detail .detail-schedule .schedule-icon {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  color: var(--muted);
}
.page-detail .detail-schedule dt > :last-child { min-width: 0; overflow-wrap: anywhere; }
/* The UTC line's zone suffix is a small inline link inside <small.time-utc>,
   including in the updates timeline. It must not inherit the source-link button
   box (.update-row a) or the planned-clock CST sizing (.schedule-primary
   .time-suffix); the planned CST suffix keeps its own rules above. */
.page-detail .time-utc a.time-suffix {
  display: inline;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: none;
  gap: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
}

/* ---------------------------------------------------------------------------
   One treatment for every off-site link, on every route: warm ink at rest,
   accent plus an underline on hover/focus. It is scoped with :root so it outranks
   the page-local grey or inherit colours without !important, and it only ever
   sets colour and underline - never a background, box or size.
--------------------------------------------------------------------------- */
:root a[target="_blank"]:not(.video-outbound) { color: var(--accent-ink); }
:root a[target="_blank"]:not(.video-outbound):is(:hover, :focus-visible) { color: var(--accent); text-decoration: underline; text-underline-offset: 4px; }
/* The outbound video is excluded above because the anchor wraps a whole 16:9
   frame; only its caption takes the reference treatment, the play glyph keeps
   the body ink it inherits from .video-outbound. */
.page-detail .video-outbound .video-caption { color: var(--accent-ink); }
.page-detail .video-outbound:is(:hover, :focus-visible) .video-caption { color: var(--accent); }
/* ---------------------------------------------------------------------------
   Elapsed clock roll: decoration only. JavaScript still computes and owns the
   clock text; this block only paints it. The face is aria-hidden, the timer's
   own text stays the full latest string, and no font size, weight, colour or
   box geometry of the clock is changed here: the hero keeps --next-ink and the
   detail timer keeps --accent-ink from its own page CSS. Normal SSR / no-JS
   keeps plain text, and any timer outside this scope is never touched.
--------------------------------------------------------------------------- */
.clock-roll-face { display: inline; white-space: nowrap; }

/* One clipped cell per digit: the cell box is fixed, only its glyph moves. */
.clock-roll-digit {
  display: inline-grid;
  grid-template-areas: "glyph";
  grid-template-columns: max-content;
  overflow: hidden;
  vertical-align: baseline;
}

.clock-roll-digit::before,
.clock-roll-current { grid-area: glyph; }

/* Resting state: the incoming glyph sits at 0 and no previous glyph is shown,
   so a missed animationend can never leave two digits stacked. */
.clock-roll-current { transform: none; }

.clock-roll-digit[data-roll-from]::before {
  content: attr(data-roll-from);
  transform: translateY(-100%);
  animation: clock-roll-out 180ms ease-out both;
}

.clock-roll-digit[data-roll-from] > .clock-roll-current {
  animation: clock-roll-in 180ms ease-out both;
}

@keyframes clock-roll-in {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}

@keyframes clock-roll-out {
  from { transform: translateY(0); }
  to { transform: translateY(-100%); }
}

/* Reduced motion, forced colours and print: the value is simply there. */
@media (prefers-reduced-motion: reduce), (forced-colors: active), print {
  .clock-roll-digit[data-roll-from]::before { content: none; animation: none; }
  .clock-roll-digit > .clock-roll-current,
  .clock-roll-digit[data-roll-from] > .clock-roll-current { animation: none; transform: none; }
}

@media (forced-colors: active) {
  :is(.landing-header .hero-countdown, .page-detail .reference-timer)
    > span[role="timer"][data-countdown-mode="elapsed"] {
    color: CanvasText;
  }
}

@media print {
  :is(.landing-header .hero-countdown, .page-detail .reference-timer)
    > span[role="timer"][data-countdown-mode="elapsed"] {
    color: inherit;
  }
}

/* Combined plan/window axis on the detail page. The rail is the measured
   window; the plan time is centred above it, not placed at its real
   proportion. Everything is decoration except the original <time> values,
   links and the reference clock group; no client script measures geometry. */
.page-detail .net-head-term::before {
  content: " · ";
  color: var(--decoration);
}
/* Combined plan/window axis on the detail page. Four grid columns: zone |
   window start | rail | window end. Row 1 is the centred plan time, row 2 the
   rail with the endpoint readouts outside it, row 3 the matching UTC line.
   Everything is decoration except the original <time> values, links and
   reference clock group; no client script computes or measures geometry. */
.page-detail .net-head-term::before {
  content: " \00b7 ";
  color: var(--decoration);
}
.page-detail .net-axis {
  position: relative;
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr) 62px;
  grid-template-rows: auto auto auto;
  gap: 10px 8px;
  height: auto;
  min-height: 0;
  font-variant-numeric: tabular-nums;
}

/* Row 1: the source NET spans the whole axis; no zone label sits above it. */
.page-detail .net-cst {
  grid-row: 1;
  grid-column: 1 / -1;
  position: static;
  top: auto;
  left: auto;
  width: auto;
  text-align: center;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
  white-space: normal;
}
.page-detail .net-cst .plan-instant { grid-column: 2; display: inline; white-space: nowrap; }
/* The reading keeps the clock on the middle column of the axis; the 发射 suffix
   fills the free space to its right instead of pushing the digits off centre. */
.page-detail .net-main-reading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content minmax(0, 1fr);
  column-gap: 4px;
  align-items: baseline;
}
.page-detail .net-launch-label {
  grid-column: 3;
  justify-self: start;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
  white-space: nowrap;
}
.page-detail .net-plan-label {
  display: none;
  margin: 0 0 2px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}
.page-detail .net-cst .net-pending-note { display:block; margin:4px 0 0; color:var(--muted); font-size:12px; font-weight:400; line-height:1.5; letter-spacing:normal; text-align:center; }
.page-detail .net-cst .net-timezone-label { display: block; margin-top: 3px; font-size: 11px; font-weight: 400; color: var(--muted); letter-spacing: normal; line-height: 1.4; text-align: center; }
.page-detail .net-cst .instant-day {
  display: inline;
  color: var(--strong);
  font-size: 20px;
  font-weight: 650;
  line-height: 1.3;
  letter-spacing: -.025em;
  white-space: nowrap;
}
.page-detail .net-cst > .instant-day { white-space: normal; overflow-wrap: anywhere; }
.page-detail .net-cst .instant-clock {
  display: inline;
  margin-left: 4px;
  color: var(--strong);
  font-size: 20px;
  font-weight: 650;
  line-height: 1.3;
  letter-spacing: -.025em;
  white-space: nowrap;
}
.page-detail .net-cst .instant-clock::before { content: none; }
/* The header CST link now closes row 1; this copy stays in the DOM. */
.page-detail .net-cst .time-suffix { display: none; }

/* The zone words stay in the DOM but are not shown: the axis is Beijing time by
   default, so no leading label column is reserved. */
.page-detail .net-zone {
  grid-column: 1;
  align-self: center;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.5;
  white-space: nowrap;
}
.page-detail .net-zone-cst { grid-row: 1; display: none; }
.page-detail .net-zone .time-suffix {
  margin: 0;
  color: inherit;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0;
  white-space: nowrap;
}

/* Row 1, sides: the complete window endpoints in CST. */
.page-detail .net-ends { display: contents; }
.page-detail .net-ends .window-endpoint {
  grid-row: 2;
  align-self: center;
  position: static;
  top: auto;
  bottom: auto;
  left: auto;
  right: auto;
  margin: 0;
  min-width: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.6;
  white-space: normal;
}
.page-detail .net-ends .window-endpoint:first-child {
  grid-column: 1;
  text-align: right;
}
.page-detail .net-ends .window-endpoint-end {
  grid-column: 3;
  margin-left: 0;
  text-align: left;
}
.page-detail .net-ends .window-endpoint time {
  display: inline;
  white-space: normal;
}
/* Same-day endpoints hide their date in the schedule block; here every date
   stays visible. Scoped to the axis only. */
.page-detail .net-ends .endpoint-day {
  display: block;
  position: static;
  width: auto;
  height: auto;
  padding: 0;
  margin: 0;
  overflow: visible;
  clip-path: none;
  white-space: normal;
  border: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.6;
}
.page-detail .net-ends .endpoint-clock {
  display: inline;
  color: var(--muted);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.6;
}

/* Row 2: the rail is the middle column only, between the two endpoint readouts,
   and keeps its hollow window ends. */
.page-detail .net-rail {
  grid-row: 2;
  grid-column: 2;
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  width: 100%;
  height: 1px;
  align-self: center;
  background: var(--line-strong);
}
.page-detail .net-rail::before,
.page-detail .net-rail::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 7px;
  height: 7px;
  border: 1px solid var(--muted);
  border-radius: 50%;
  background: var(--bg);
  transform: translateY(-50%);
}
.page-detail .net-rail::before { left: 0; transform: translate(-50%, -50%); }
.page-detail .net-rail::after { right: 0; transform: translate(50%, -50%); }
.page-detail .net-dot {
  display: none;
  position: absolute;
  left: var(--net-position, 50%);
  top: 50%;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 3px var(--bg);
  transform: translate(-50%, -50%);
}
.page-detail .net-dot::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 100%;
  width: 1px;
  height: 7px;
  background: var(--accent);
  opacity: .5;
  transform: translateX(-50%);
}

/* Row 2: status and the plan-relative clock keep their original group in the
   DOM and are placed against the axis by CSS only. The status stays on the
   heading row; T+/- is centred under the plan time. */
.page-detail .net-axis > .reference-clock-group {
  grid-row: 2;
  grid-column: 2;
  position: static;
  display: block;
  width: 100%;
  min-height: 33px;
  padding: 0;
  align-self: center;
}
.page-detail .net-axis > .reference-clock-group > .status {
  position: absolute;
  top: -34px;
  right: 0;
  margin: 0;
  padding: 3px 8px;
  max-width: 55%;
  font-size: 13px;
  line-height: 1.5;
}
.page-detail .net-axis > .reference-clock-group > .reference-timer {
  position: relative;
  top: 0;
  display: block;
  width: max-content;
  left: auto;
  right: auto;
  margin-inline: auto;
  text-align: center;
  max-width: calc(100% - 20px);
  gap: 0;
  background: var(--bg);
  box-shadow: 0 0 0 5px var(--bg);
  color: var(--accent-ink);
  font-size: 16px;
  font-weight: 500;
  line-height: 33px;
  font-variant-numeric: tabular-nums;
  white-space: normal;
  overflow-wrap: anywhere;
}
.page-detail .net-axis.net-late > .reference-clock-group > .reference-timer {
  left: auto;
  right: auto;
  margin-inline: auto;
  text-align: center;
  max-width: calc(100% - 20px);
}
.page-detail .net-axis .clock-roll-face { white-space: normal; }
.page-detail .net-axis > .reference-clock-group > .reference-timer > span {
  line-height: 33px;
}

.page-detail .net-utc-disclosure:not(:has(time)) { display: none; }
.page-detail .net-axis.net-no-range:not(:has(.net-ends, .reference-timer)) > .reference-clock-group { min-height: 0; }
.page-detail .detail-net-schedule > dd > .net-window-note { text-align: center; font-size: 12px; font-weight: 400; }

/* Row 3: the whole UTC readout is one native disclosure. Its summary states the
   zone once; the panel reuses the original three blocks in a three-column grid
   that stays aligned with the CST columns. No script is involved. */
.page-detail .net-utc-disclosure {
  grid-row: 3;
  grid-column: 1 / -1;
  min-width: 0;
}
.page-detail .net-utc-disclosure > summary {
  width: max-content;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.5;
  white-space: nowrap;
  cursor: pointer;
}
.page-detail .net-utc-disclosure > summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.page-detail .net-utc-panel {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr) 62px;
  gap: 8px;
  margin-top: 6px;
  padding-left: 0;
  box-sizing: border-box;
  min-width: 0;
}
/* The summary already states the zone, so the panel drops its inline label. */
.page-detail .net-utc-panel .net-zone-utc { display: none; }
/* The shared <small.time-utc> wrappers are display:contents so their children
   land on the panel grid. */
.page-detail .net-legend { display: contents; }
.page-detail .net-legend .time-utc { display: contents; }
.page-detail .net-legend .window-boundary {
  grid-row: 1;
  max-width: none;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.6;
  white-space: normal;
  overflow-wrap: anywhere;
}
.page-detail .net-legend .window-boundary:first-child {
  grid-column: 1;
  text-align: right;
}
.page-detail .net-legend .window-boundary:last-child {
  grid-column: 3;
  text-align: left;
}
.page-detail .net-utc {
  grid-row: 1;
  grid-column: 2;
  position: static;
  top: auto;
  left: auto;
  width: auto;
  margin: 0;
  text-align: center;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.6;
  white-space: normal;
  overflow-wrap: anywhere;
}
.page-detail .net-utc > .time-utc {
  display: inline;
  margin: 0;
  color: inherit;
  font-size: 11px;
  line-height: inherit;
}
/* Only the two row ends state the zone. */
.page-detail .net-axis .net-utc .time-utc a.time-suffix { display: none; }

/* Every UTC instant takes its own line whatever the width. The template keeps
   the original "date clock" string; a 10ch block makes it wrap at its single
   space, so no new backend field is needed. */
.page-detail .net-axis .time-utc time {
  display: block;
  inline-size: 10ch;
  max-inline-size: 100%;
  white-space: normal;
}
.page-detail .net-axis .net-utc .time-utc time { margin-inline: auto; inline-size: auto; max-inline-size: none; white-space: nowrap; }
.page-detail .net-axis .net-legend .window-boundary:last-child time { margin-left: auto; }

/* Narrow screens only tighten the gaps; the two-line CST and UTC layout is
   already the default at every width. */
@media (max-width: 600px) {
  .page-detail .net-axis { gap: 8px 6px; }
  .page-detail .net-axis > .reference-clock-group > .status, .page-detail .detail-reference-clock .status { max-width: 60%; }
}
.page-detail .detail-net-schedule > dd .reference-timer-noscript {
  display: block;
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

/* One note after the axis; a prevented marker also states its reason once. */
.page-detail .detail-net-schedule > dd > .schedule-note {
  display: block;
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}
.page-detail .timeline-note {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}
.page-detail .detail-overview > .timeline-note { margin-top: 8px; }

@media (forced-colors: active) {
  .page-detail .net-rail { background: CanvasText; }
  .page-detail .net-rail::before,
  .page-detail .net-rail::after { border-color: CanvasText; background: Canvas; }
  .page-detail .net-dot { background: CanvasText; box-shadow: none; }
  .page-detail .net-dot::before { background: CanvasText; }
}

/* Flight timeline and launch site continue the detail rhythm: a quiet
   label/axis column, hairlines, and no card chrome. */
.page-detail .detail-extra .flight-timeline { --flight-row-padding: 11px; display: grid; grid-template-columns: max-content 13px minmax(0, 1fr); column-gap: 14px; row-gap: 0; margin: 14px 0 0; padding: 0; list-style: none; }
.page-detail .detail-extra .flight-event { display: grid; grid-column: 1 / -1; grid-template-columns: subgrid; column-gap: inherit; padding-block: var(--flight-row-padding); }
.page-detail .detail-extra .flight-event > * { min-width: 0; }
.page-detail .detail-extra .flight-offset { grid-column: 1; justify-self: end; color: var(--muted); font-size: 12px; font-weight: 500; line-height: 1.7; font-variant-numeric: tabular-nums; white-space: nowrap; }
.page-detail .detail-extra .flight-axis { position: relative; grid-column: 2; align-self: stretch; }
.page-detail .detail-extra .flight-axis::before { content: ""; position: absolute; top: 9px; bottom: calc(0px - var(--flight-row-padding) - var(--flight-row-padding) - 9px); left: 50%; width: 1px; margin-left: -.5px; background: var(--line-strong); }
.page-detail .detail-extra .flight-axis::after { content: ""; position: absolute; top: 9px; left: 50%; width: 5px; height: 5px; margin: -2.5px 0 0 -2.5px; border-radius: 50%; background: var(--faint); }
.page-detail .detail-extra .flight-event:last-child .flight-axis::before { display: none; }
.page-detail .detail-extra .flight-body { grid-column: 3; }
.page-detail .detail-extra .flight-label { display: block; color: var(--fg); font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
.page-detail .detail-extra .flight-description { margin: 2px 0 0; color: var(--muted); font-size: 13px; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }

.page-detail .detail-extra .launch-site-name { display: flex; align-items: center; column-gap: 6px; margin: 12px 0 0; color: var(--fg); font-size: 15px; line-height: 1.6; }
.page-detail .detail-extra .launch-site-name > .country-flag { flex: 0 0 auto; align-self: center; margin-inline-end: 0; vertical-align: 0; }
.page-detail .detail-extra .launch-site-name .site-lines { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 1px; min-width: 0; }
.page-detail .detail-extra .launch-site-name .site-base, .page-detail .detail-extra .launch-site-name .site-pad { min-width: 0; overflow-wrap: anywhere; }
.page-detail .detail-extra .launch-site-name .site-base { display: flex; align-items: center; gap: 6px; }
.page-detail .detail-extra .launch-site-name .site-pad { display: block; color: var(--muted); font-size: 13px; }
.page-detail .detail-extra .pad-map { margin: 14px 0 0; padding: 0; }
.page-detail .detail-extra .pad-map iframe { display: block; width: 100%; height: 300px; border: 1px solid var(--line); border-radius: 8px; background: var(--zone-soft); }
.page-detail .detail-extra .pad-map-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; margin: 10px 0 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.page-detail .detail-extra .pad-coordinates { font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.page-detail .detail-extra .pad-map-link { display: inline-flex; align-items: center; min-height: 32px; color: var(--accent-ink); font-size: 13px; text-decoration: none; }
.page-detail .detail-extra .pad-map-link:hover, .page-detail .detail-extra .pad-map-link:focus-visible { color: var(--accent); text-decoration: underline; text-underline-offset: 4px; }

.page-detail .detail-title-row { display: flex; align-items: center; gap: 12px; min-width: 0; }
.page-detail .detail-title-row h1 { flex: 1 1 auto; min-width: 0; margin: 0; }
.page-detail .detail-title-row .mission-badge { flex: 0 0 40px; width: 40px; height: 40px; margin-top: 0; }
.page-detail .mission-badge { display: inline-flex; align-items: center; justify-content: center; }
.page-detail .mission-badge img { display: block; width: 100%; height: 100%; object-fit: contain; }
.page-detail .detail-identity-row { display: flex; align-items: center; gap: 12px; min-width: 0; margin: 10px 0 0; }
.page-detail .detail-identity-row .mission-identity { flex: 1 1 0; min-width: 0; margin: 0; }
@media (max-width: 740px) {
  .page-detail .detail-title-row .mission-badge { flex-basis: 32px; width: 32px; height: 32px; margin-top: 0; }
}
.page-detail .hero-weather { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; margin: 18px 0 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
/* Two real lines: the base first, its pad directly underneath. The pin and the
   optional country flag are siblings of that two-row text column, so they
   centre across both rows instead of hanging inside the first one; the order
   comes from the layout, not from a separator or a repeated country label. */
.page-detail .hero-weather .weather-site { display: flex; align-items: center; column-gap: 6px; flex-basis: 100%; min-width: 0; color: var(--fg); font-size: 13px; }
.page-detail .hero-weather .weather-site > svg { flex: 0 0 auto; align-self: center; width: 13px; height: 13px; color: var(--muted); }
.page-detail .hero-weather .weather-site > .country-flag { flex: 0 0 auto; align-self: center; margin-inline-end: 0; vertical-align: 0; }
.page-detail .hero-weather .weather-site-lines { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 1px; min-width: 0; }
.page-detail .hero-weather .weather-base, .page-detail .hero-weather .weather-pad { min-width: 0; overflow-wrap: anywhere; }
.page-detail .hero-weather .weather-base { display: flex; align-items: center; gap: 6px; }
.page-detail .hero-weather .weather-base > .weather-pad-location { min-width: 0; overflow-wrap: anywhere; }
.page-detail .hero-weather .weather-pad { color: var(--muted); }
.page-detail .hero-weather .weather-glyph { flex: 0 0 auto; align-self: center; width: 13px; height: 13px; color: var(--muted); }
.page-detail .hero-weather .weather-metric-icon[data-weather-kind="temperature"] { color: var(--weather-warm); }
.page-detail .hero-weather .weather-metric-icon[data-weather-kind="wind"], .page-detail .hero-weather .weather-metric-icon[data-weather-kind="precipitation"], .page-detail .hero-weather .weather-metric-icon[data-weather-kind="humidity"] { color: var(--weather-cool); }
.page-detail .hero-weather .weather-summary { display: grid; gap: 2px 20px; width: 100%; flex-basis: 100%; min-width: 0; margin: 0; }
.page-detail .hero-weather .weather-group { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px 8px; min-width: 0; }
.page-detail .hero-weather .weather-values { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; min-width: 0; margin: 0; }
.page-detail .hero-weather .weather-label { color: var(--muted); font-size: 12px; font-weight: 500; letter-spacing: .02em; }
.page-detail .hero-weather .weather-condition { display: inline-flex; align-items: center; gap: 4px; color: var(--fg); font-size: 13px; overflow-wrap: anywhere; }
.page-detail .hero-weather .weather-condition-icon[data-weather-kind="clear"] { color: var(--weather-warm); }
.page-detail .hero-weather .weather-metric-icon[data-weather-kind="temperature"] ~ .weather-metric-value { color: var(--weather-warm); }
.page-detail .hero-weather .weather-metric-icon:is([data-weather-kind="wind"], [data-weather-kind="precipitation"], [data-weather-kind="humidity"]) ~ .weather-metric-value { color: var(--weather-cool); }
.page-detail .hero-weather .weather-metric { display: inline-flex; align-items: baseline; gap: 4px; font-variant-numeric: tabular-nums; }
.page-detail .hero-weather .weather-metric-label { color: var(--muted); font-size: 12px; }
.page-detail .hero-weather .weather-metric-value { color: var(--strong); font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }

@media (max-width: 740px) {
  .page-detail .detail-extra .flight-timeline { --flight-row-padding: 10px; column-gap: 10px; }
  .page-detail .detail-extra .pad-map iframe { height: 240px; }
}

@media (forced-colors: active) {
  .page-detail .detail-extra .flight-axis::before { background: CanvasText; }
  .page-detail .detail-extra .flight-axis::after { background: CanvasText; }
  .page-detail .detail-extra .pad-map iframe { border-color: CanvasText; }
  .page-detail .hero-weather { --weather-warm: CanvasText; --weather-cool: CanvasText; }
  .page-detail .hero-weather .weather-glyph, .page-detail .hero-weather .weather-site svg { color: CanvasText; }
}

.page-detail .detail-media-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 4 / 3;
  min-height: 200px;
  max-height: 420px;
  margin: 0;
  border: 1px dashed var(--line);
  border-radius: 9px;
  color: var(--muted);
  background: color-mix(in srgb, var(--fg) 3%, transparent);
}

@media (max-width: 760px) {
  .page-detail .detail-media .task-image { max-height: 280px; }
  .page-detail .detail-media-empty { min-height: 180px; max-height: 280px; }
}

/* Mission facts join the Hero instead of closing the page with a second section
   that repeated the rocket, the provider and the launch site. The list keeps the
   page's label/value rhythm, one pair per line, so a pad name or a mission type
   wraps inside its own value column and never widens the lead. */
.page-detail .detail-header .detail-facts { margin: 12px 0 0; padding: 0; border: 0; }
.page-detail .detail-header .detail-facts .detail-grid { grid-template-columns: max-content minmax(0, 1fr); gap: 0 16px; margin: 0; align-items: baseline; }
.page-detail .detail-header .detail-facts :is(dt, dd) { padding: 4px 0; line-height: 1.65; }
.page-detail .detail-header .detail-facts dt { font-size: 12px; }
.page-detail .detail-header .detail-facts dd { font-size: 13px; }

/* Selected month or year beside the calendar's pending headings. Reuses the
   existing faint/secondary tokens; it is a period label, not a second heading. */
.pending-year, .pending-month {
  color: var(--faint);
  font-size: 12px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  letter-spacing: .04em;
}

/* Unified news list (/news) and native report details
   (/news/daily/{date}, /news/weekly/{week}). Nothing here defines new colors;
   every value reuses a token. The list is editorial rows, not raised cards. */
.news-section {
  padding-block: 6px 64px;
  min-width: 0;
}

.news-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.news-item + .news-item {
  border-top: 1px solid var(--line);
}

.news-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "title" "summary" "time";
  row-gap: 6px;
  min-width: 0;
  padding: 20px 0;
  color: inherit;
  text-decoration: none;
  border-radius: 4px;
}

.news-row.has-image {
  grid-template-columns: minmax(0, 1fr) 192px;
  grid-template-areas: "title image" "summary image" "time image";
  column-gap: 24px;
}

.news-row-title {
  grid-area: title;
  min-width: 0;
  margin: 0;
  color: var(--strong);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: -.012em;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  overflow-wrap: anywhere;
}

.news-row-summary {
  grid-area: summary;
  min-width: 0;
  max-width: 46em;
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  overflow-wrap: anywhere;
}

.news-row-time {
  grid-area: time;
  margin: 2px 0 0;
  color: var(--faint);
  font-size: 12px;
  line-height: 1.5;
  font-variant-numeric: tabular-nums;
}

.news-row-image {
  grid-area: image;
  grid-row: 1 / span 3;
  display: block;
  width: 192px;
  max-width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  align-self: start;
  border-radius: 4px;
  background: var(--zone-soft);
}

.news-row:hover .news-row-title {
  color: var(--accent-ink);
}

.news-row:focus-visible {
  outline: 2px solid var(--accent-ink);
  outline-offset: 2px;
}

.news-empty {
  margin: 6px 0 0;
}

.news-pages {
  justify-content: flex-start;
  gap: 8px 14px;
  margin-block: 22px 0;
  color: var(--muted);
  font-size: 12px;
}

.news-pages a,
.news-pages span {
  min-width: 0;
  min-height: 32px;
  padding: 4px 8px;
}

.news-pages a {
  border-radius: 4px;
  text-decoration: none;
}

.news-pages a:hover,
.news-pages a:focus-visible {
  color: var(--accent-ink);
  background: var(--hover-tint);
}

.news-page-position,
.news-pages [aria-current="page"] {
  color: var(--faint);
  background: none;
  font-variant-numeric: tabular-nums;
}

.report-detail {
  width: min(100%, 800px);
  margin-inline: auto;
  padding-block: 22px 64px;
  /* Native #report-top (no JS) lands at the document top without a fixed header
     offset; the article itself starts 64px down the page. */
  scroll-margin-top: 88px;
  min-width: 0;
  text-align: left;
}

/* Bottom history navigation: text only, no separator rule. */
.report-history {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin-block: 18px 0;
  font-size: 13px;
  line-height: 1.6;
}

.report-history-bottom {
  margin-block: 32px 0;
}

.report-history a {
  display: inline-flex;
  align-items: center;
  padding: 2px 6px;
  border-radius: 6px;
  color: var(--muted);
  text-decoration: none;
}

.report-history a:hover,
.report-history a:focus-visible {
  color: var(--accent-ink);
  background: transparent;
  text-decoration: underline;
}

.report-crumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  color: var(--faint);
  font-size: 12px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

/* The crumb holds two SSR groups: the fallback prefix path and the conditional
   "return to previous page" entry. Only :not([hidden]) is styled, so the UA
   [hidden] rule is never overridden and the JS toggle needs no display reset. */
.report-crumb-group:not([hidden]) {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.report-crumb a {
  padding: 1px 4px;
  border-radius: 5px;
  color: var(--muted);
  text-decoration: none;
}

.report-crumb a:hover,
.report-crumb a:focus-visible {
  color: var(--accent-ink);
  background: transparent;
  text-decoration: underline;
}

.report-empty {
  margin: 22px 0;
  padding: 30px 22px;
  border: 1px dashed var(--line-strong);
  border-bottom: 1px dashed var(--line-strong);
  border-radius: 10px;
  background: var(--surface);
  text-align: center;
}

.report-title {
  margin: 24px 0;
  color: var(--strong);
  font-size: 30px;
  font-weight: 660;
  line-height: 1.4;
  letter-spacing: -.028em;
  overflow-wrap: anywhere;
}

.report-body {
  max-width: none;
  padding-block: 8px 4px;
  color: var(--fg);
  font-size: 15px;
  line-height: 1.9;
  overflow-wrap: anywhere;
}

.report-body > :first-child {
  margin-top: 8px;
}

.report-body :is(h1, h2, h3, h4, h5, h6) {
  margin: 34px 0 10px;
  color: var(--strong);
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: -.015em;
}

.report-body h1 { font-size: 24px; }
.report-body h2 { font-size: 20px; }
.report-body h3 { font-size: 17px; }
.report-body :is(h4, h5, h6) { font-size: 15px; }

.report-body p {
  margin: 0 0 16px;
}

.report-body :is(ul, ol) {
  margin: 0 0 16px;
  padding-left: 1.4em;
}

.report-body li {
  margin-bottom: 6px;
}

.report-body li::marker {
  color: var(--accent-ink);
}

.report-body blockquote {
  margin: 20px 0;
  padding: 2px 0 2px 16px;
  border-left: 2px solid var(--orbit-border);
  color: var(--muted);
}

.report-body blockquote p {
  margin: 0 0 8px;
}

.report-body blockquote p:last-child {
  margin-bottom: 0;
}

.report-body hr {
  margin: 28px 0;
  border: 0;
  border-top: 1px solid var(--line);
}

.report-body img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 22px auto;
}

/* One historical source image is authored with white side borders baked into
   the JPEG itself (726x370: columns 0-26 and 704-725). Trimming those columns
   needs no re-encoded file, so this single exact src is clipped at render time
   and keeps its natural 726x370 attribute ratio. It is not a generic article
   image style: every other report image stays untouched. */
.report-body img[src="/images/reports/daily/2026-10-28/xingyun2-tank.jpg"] {
  clip-path: inset(0 3.1% 0 3.8%);
}

.report-body code {
  padding: 1px 5px;
  border-radius: 4px;
  background: var(--inset);
  color: var(--strong);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .88em;
  overflow-wrap: anywhere;
}

.report-body pre {
  margin: 20px 0;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--inset);
  overflow-x: auto;
}

.report-body pre code {
  padding: 0;
  background: none;
  font-size: 12.5px;
  line-height: 1.7;
  white-space: pre;
}

.report-body table {
  width: 100%;
  margin: 20px 0;
  border-collapse: collapse;
  font-size: 13px;
  line-height: 1.7;
}

.report-body :is(th, td) {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

.report-body th {
  color: var(--faint);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
  white-space: nowrap;
}

.report-body a {
  color: var(--accent-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}

.report-body a:hover,
.report-body a:focus-visible {
  color: var(--accent-ink);
  background: transparent;
}

.report-body strong {
  color: var(--strong);
  font-weight: 650;
}

/* Article body anchors keep their own scroll margin and focus ring; the rail
   itself is the shared article nav (see .detail-toc above). */
.report-body [id^="report-section-"] {
  /* The shared section nav is sticky at <=1319px, so an anchored heading keeps
     clear of it exactly like the task detail's own section anchors. */
  scroll-margin-top: 96px;
}

.report-body :is(h2, h3, h4, h5, h6):focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 4px;
}

@media (max-width: 740px) {
  .news-section {
    padding-block: 2px 48px;
  }

  .news-row {
    padding: 16px 0;
    row-gap: 5px;
  }

  .news-row.has-image {
    grid-template-columns: minmax(0, 1fr) 96px;
    grid-template-areas: "title image" "summary summary" "time time";
    column-gap: 12px;
  }

  .news-row-title {
    font-size: 16px;
    line-height: 1.5;
    -webkit-line-clamp: 3;
    line-clamp: 3;
  }

  .news-row-summary {
    max-width: none;
  }

  .news-row-image {
    grid-row: 1;
    width: 96px;
    aspect-ratio: 4 / 3;
  }

  .report-detail {
    padding-block: 14px 48px;
  }

  .report-title {
    font-size: 24px;
  }

  .report-body {
    font-size: 14px;
    line-height: 1.85;
  }

  .report-body table {
    font-size: 12px;
  }
}

@media (max-width: 370px) {
  .news-row.has-image {
    grid-template-columns: minmax(0, 1fr) 88px;
    column-gap: 10px;
  }

  .news-row-image {
    width: 88px;
  }
}

@media (forced-colors: active) {
  .news-row:focus-visible {
    outline-color: Highlight;
  }
}

/* ===== Rocket library and agency directory ==============================
   Native /rockets, /rockets/{id}, /rockets/compare, /agencies and
   /agencies/{id}. Data stays on the warm-paper tokens: thin rules, tabular
   numbers, no shadows. The rocket list and detail open on a deep-space poster
   band (--poster*) that is deliberately dark in both themes, because a poster
   is an object rather than a card; its warm white type and the single orange
   accent never carry information that the paper sections do not repeat. */

.page-rockets .landing-header,
.page-agencies .landing-header { border-bottom: 1px solid var(--line); }

.page-rockets .breadcrumb,
.page-agencies .breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; padding: 18px 0 0; color: var(--faint); font-size: 12px; }
.page-rockets .breadcrumb a,
.page-agencies .breadcrumb a { display: inline-flex; align-items: center; min-height: 28px; color: var(--muted); text-decoration: none; }
.page-rockets .breadcrumb a:hover,
.page-agencies .breadcrumb a:hover { color: var(--accent-ink); text-decoration: underline; }

/* --- page heads ------------------------------------------------------- */
.ag-head { padding: 24px 0 16px; }
.ag-head h1 { margin: 0; font-size: clamp(24px, 2.6vw, 32px); font-weight: 690; letter-spacing: -.03em; line-height: 1.3; }
.ag-intro { margin: 10px 0 0; max-width: none; color: var(--muted); font-size: 13px; line-height: 1.85; }
/* Rocket library poster: one deep-space band that stays inside the shared
   1000px column instead of bleeding into the shell gutters. Its own inline
   padding keeps the type off the band edge, and the top margin leaves the
   sticky first-level navigation a breathing gap above it. */
.rk-head {
  --rk-inset: clamp(18px, 3.2vw, 34px);
  position: relative;
  margin: 20px 0 0;
  padding: clamp(28px, 4vw, 44px) var(--rk-inset) clamp(22px, 3vw, 32px);
  overflow: hidden;
  border: 0;
  border-radius: 6px;
  background:
    radial-gradient(72% 120% at 86% 2%, rgba(255,131,66,.20), rgba(255,131,66,0) 62%),
    radial-gradient(60% 92% at 2% 100%, rgba(247,244,238,.07), rgba(247,244,238,0) 58%),
    var(--poster);
  color: var(--poster-fg);
}
.rk-kicker { margin: 0 0 16px; color: var(--poster-accent); font-size: 10.5px; font-weight: 600; letter-spacing: .24em; line-height: 1.4; text-transform: uppercase; }
.rk-title { margin: 0; max-width: 18em; color: var(--poster-fg); font-size: clamp(34px, 5.4vw, 58px); font-weight: 700; letter-spacing: -.045em; line-height: 1.04; text-wrap: balance; }
.rk-intro { margin: 18px 0 0; max-width: 44em; color: var(--poster-muted); font-size: 13.5px; line-height: 1.9; }
.rk-stats { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0; margin: clamp(26px, 3.4vw, 38px) 0 0; padding: 18px 0 0; border: 0; border-top: 1px solid var(--poster-line); border-radius: 0; background: none; }
.rk-stat { margin: 0; padding: 0 18px; border-inline-start: 1px solid var(--poster-line); background: none; }
.rk-stat:first-child { padding-inline-start: 0; border-inline-start: 0; }
.rk-stat:last-child { padding-inline-end: 0; }
.rk-stat dt { margin: 0; color: var(--poster-faint); font-size: 10.5px; font-weight: 500; letter-spacing: .08em; line-height: 1.5; }
.rk-stat dd { margin: 7px 0 0; color: var(--poster-fg); font-size: clamp(20px, 2.3vw, 27px); font-weight: 600; line-height: 1.1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }

/* --- layouts ---------------------------------------------------------- */
.rk-body { display: grid; grid-template-columns: 196px minmax(0, 1fr) 224px; gap: 22px; padding: 20px 0 44px; align-items: start; }
.ag-layout { display: grid; grid-template-columns: 196px minmax(0, 1fr); gap: 22px; padding: 20px 0 44px; align-items: start; }
/* 火箭筛选：桌面是常开的粘性列；≤900px 收进一个原生 <details>。面板本身
   不进 details（否则桌面就必须造假“展开”），而是它的下一个兄弟：
   `details[open] + .rk-facets` 只在真实展开时显示，关闭时连屏幕阅读器也
   看不到链接，所以绝不会出现“读屏说收起、内容却可见”的矛盾状态。
   summary 的展开/收起由浏览器原生管理，无需 JS、可键盘操作。 */
.rk-filters { min-width: 0; display: grid; align-content: start; border: 1px solid var(--line-strong); border-radius: 10px; background: var(--surface); overflow: hidden; }
.rk-filters-toggle { display: block; }
.rk-filters-summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 46px; padding: 12px 14px; color: var(--fg); font-size: 13px; font-weight: 600; line-height: 1.5; cursor: pointer; list-style: none; }
.rk-filters-summary::-webkit-details-marker { display: none; }
.rk-filters-summary::marker { content: ""; }
.rk-filters-summary::after { content: ""; flex: none; width: 7px; height: 7px; margin-block-end: 3px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); }
.rk-filters-toggle[open] > .rk-filters-summary::after { margin-block-end: 0; margin-block-start: 3px; transform: rotate(225deg); }
.rk-filters-summary:hover { background: var(--chip-hover); }
.rk-filters-summary:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: -2px; }
.rk-facets { display: none; }
.rk-filters-toggle[open] + .rk-facets { display: grid; }
.ag-facets { display: grid; gap: 14px; align-content: start; position: sticky; top: 12px; }
.rk-facet,
.ag-facet { border-top: 1px solid var(--line); padding-top: 10px; }
.rk-facet-title,
.ag-facet-title { margin: 0 0 6px; color: var(--faint); font-size: 10px; font-weight: 650; letter-spacing: .1em; }
.rk-opts,
.ag-facet-list { display: grid; gap: 1px; margin: 0; padding: 0; list-style: none; }
.ag-facet-list[aria-label="按国家筛选"] .ag-facet-label,
.ag-facet-more .ag-facet-label { font-family: "CHX Flag Emoji", var(--text); }
.rk-opt,
.ag-facet-link { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 30px; padding: 4px 6px; border-radius: 5px; color: var(--muted); font-size: 12px; text-decoration: none; }
.rk-opt:hover,
.ag-facet-link:hover { background: var(--chip-hover); color: var(--fg); }
.rk-opt.is-active,
.ag-facet-link.is-on { background: var(--accent-soft); color: var(--accent-ink); }
.rk-opt-count,
.ag-facet-count { color: var(--faint); font-size: 11px; font-variant-numeric: tabular-nums; }
.rk-more,
.ag-more { margin-top: 4px; }
.rk-more-toggle,
.ag-more-summary { cursor: pointer; color: var(--muted); font-size: 11px; padding: 4px 6px; border-radius: 5px; }
.rk-more-toggle:hover,
.ag-more-summary:hover { background: var(--chip-hover); }
.rk-more-toggle::marker,
.ag-more-summary::marker { color: var(--faint); }

/* --- toolbars and sort links ------------------------------------------ */
.rk-main,
.ag-results { min-width: 0; }
.rk-toolbar,
.ag-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.ag-toolbar-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; min-width: 0; }
.rk-summary,
.ag-summary { margin: 0; color: var(--muted); font-size: 12px; }
.rk-sorts,
.ag-sorts { display: flex; flex-wrap: wrap; gap: 2px; }
.rk-sort,
.ag-sort { display: inline-flex; align-items: center; min-height: 28px; padding: 4px 8px; border-radius: 999px; color: var(--faint); font-size: 11px; text-decoration: none; }
.rk-sort:hover,
.ag-sort:hover { background: var(--chip-hover); color: var(--fg); }
.rk-sort.is-active,
.ag-sort.is-on { background: var(--accent-soft); color: var(--accent-ink); }

/* --- rocket cards ----------------------------------------------------- */
.rk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(238px, 1fr)); gap: 16px; margin: 18px 0 0; padding: 0; list-style: none; }
.rk-item { min-width: 0; }
.rk-card { position: relative; display: flex; flex-direction: column; height: 100%; padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.rk-card:hover { border-color: var(--line-strong); }
.rk-card-hit { position: absolute; inset: 0; border-radius: 12px; }
/* The photo plate is edge to edge and 4:3, so the real image gets the largest
   area a two-up grid allows. contain keeps every rocket uncropped; a white
   product shot simply sits on the plate like a mounted print. */
.rk-card-media { position: relative; display: grid; place-items: center; aspect-ratio: 4 / 3; padding: 10px; overflow: hidden; border-bottom: 1px solid var(--line); background: var(--zone-soft); }
.rk-card-media:empty { display: none; }
.rk-card-image { display: block; width: 100%; height: 100%; object-fit: contain; }
.rk-card-body { display: flex; flex: 1; flex-direction: column; gap: 7px; min-width: 0; padding: 13px 14px 14px; }
.rk-card-name { margin: 0; color: var(--strong); font-size: 16px; font-weight: 650; line-height: 1.35; overflow-wrap: anywhere; }
.rk-card-en { margin: -3px 0 0; color: var(--faint); font-size: 11px; overflow-wrap: anywhere; }
.rk-card-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 0; color: var(--muted); font-size: 11px; }
.rk-card-meta a { position: relative; z-index: 1; color: var(--muted); }
.rk-card-badges { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; }
.rk-badge { display: inline-block; padding: 1px 6px; border-radius: 4px; background: var(--inset); color: var(--muted); font-size: 11px; line-height: 1.6; }
.rk-badge.status { border: 1px solid var(--line-strong); background: none; font-weight: 500; }
.rk-card-specs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 10px; margin: 2px 0 0; }
.rk-spec { margin: 0; min-width: 0; }
.rk-spec dt { color: var(--faint); font-size: 10px; }
.rk-spec dd { margin: 3px 0 0; color: var(--fg); font-size: 14px; line-height: 1.3; font-variant-numeric: tabular-nums; }
.rk-unit { margin-left: 2px; color: var(--faint); font-size: 10px; }
.rk-card-flights { display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 0; color: var(--muted); font-size: 11px; }
.rk-card-total { color: var(--accent-ink); font-weight: 600; }
.rk-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 9px; border-top: 1px solid var(--line); }
.rk-card-rate { color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.rk-cmp,
.rd-compare-btn { position: relative; z-index: 1; padding: 4px 9px; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface); color: var(--muted); font-size: 11px; line-height: 1.6; cursor: pointer; }
.rk-cmp:hover,
.rd-compare-btn:hover { border-color: var(--accent); color: var(--accent-ink); }
.rk-cmp.is-on,
.rd-compare-btn.is-on { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-ink); }
.rk-cmp[disabled],
.rd-compare-btn[disabled] { opacity: .55; cursor: not-allowed; }
.rk-empty { margin: 22px 0; padding: 26px 18px; border: 1px dashed var(--line-strong); border-radius: 10px; color: var(--muted); font-size: 13px; text-align: center; }
.rk-empty a { color: var(--accent-ink); }

/* --- compare rail ----------------------------------------------------- */
.rk-rail { display: grid; gap: 14px; align-content: start; position: sticky; top: 12px; }
.rk-tray,
.rk-box { padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.rk-tray-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.rk-tray-head h3 { margin: 0; font-size: 13px; }
.rk-tray-count { margin-left: 6px; color: var(--accent-ink); font-variant-numeric: tabular-nums; }
.rk-tray-hint { color: var(--faint); font-size: 10px; }
.rk-tray-empty { margin: 10px 0 0; color: var(--muted); font-size: 11px; line-height: 1.75; }
.rk-tray-list { display: grid; gap: 4px; margin: 10px 0; padding: 0; list-style: none; }
.rk-tray-list li { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 12px; }
.rk-tray-name { min-width: 0; overflow-wrap: anywhere; }
.rk-tray-remove { flex: none; padding: 2px 5px; border: 0; background: none; color: var(--faint); font-size: 14px; line-height: 1; cursor: pointer; }
.rk-tray-remove:hover { color: var(--accent-ink); }
.rk-tray-go { display: flex; align-items: center; justify-content: center; min-height: 32px; border-radius: 6px; background: var(--accent); color: #fff; font-size: 12px; text-decoration: none; }
.rk-tray-go:hover { background: var(--accent-hover); color: #fff; }
.rk-tray-clear { width: 100%; margin-top: 6px; border: 0; background: none; color: var(--faint); font-size: 11px; cursor: pointer; }
.rk-tray-clear:hover { color: var(--accent-ink); }
.rk-box-title { margin: 0 0 8px; font-size: 12px; }
.rk-quick { display: grid; gap: 1px; margin: 0; padding: 0; list-style: none; }
.rk-quick-link { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 28px; padding: 3px 6px; border-radius: 5px; color: var(--muted); font-size: 11px; text-decoration: none; }
.rk-quick-link:hover { background: var(--chip-hover); color: var(--fg); }
.rk-quick-link.is-active { background: var(--accent-soft); color: var(--accent-ink); }
.rk-quick-count { color: var(--faint); font-variant-numeric: tabular-nums; }

/* --- pagination ------------------------------------------------------- */
.rk-pages,
.ag-pages,
.agd-pages { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 10px; margin: 22px 0 0; font-size: 12px; }
.rk-page-list,
.ag-page-list,
.agd-page-list { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 0; list-style: none; }
.rk-page-prev,
.rk-page-next,
.rk-page-number,
.ag-page-prev,
.ag-page-next,
.ag-page,
.agd-page-prev,
.agd-page-next,
.agd-page { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; min-height: 32px; padding: 3px 8px; border-radius: 6px; color: var(--muted); text-decoration: none; }
.rk-page-number:hover,
.ag-page:hover,
.agd-page:hover { background: var(--chip-hover); color: var(--fg); }
.rk-page-number.is-active,
.ag-page.is-on,
.agd-page.is-on { background: var(--accent-soft); color: var(--accent-ink); }
.rk-page-prev[aria-disabled="true"],
.rk-page-next[aria-disabled="true"],
.ag-page-prev[aria-disabled="true"],
.ag-page-next[aria-disabled="true"] { color: var(--faint); }

/* --- rocket detail ---------------------------------------------------- */
.rd-detail { padding-bottom: 44px; }
.rd-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 24px; align-items: center; padding: 18px 0 22px; border-bottom: 1px solid var(--line); }
.rd-hero:not(:has(.rd-figure)) { grid-template-columns: minmax(0, 1fr); }
.rd-hero:not(:has(.rd-figure)) .rd-hero-copy { max-width: 56em; }
.rd-figure { margin: 0; display: flex; flex-direction: column; gap: 6px; }
.rd-hero-image { display: block; width: 100%; max-height: 360px; object-fit: contain; background: var(--zone-soft); border-radius: 10px; }
.rd-credit { display: flex; flex-wrap: wrap; gap: 4px 8px; color: var(--faint); font-size: 10px; }
.rd-credit-link { color: var(--faint); }
.rd-hero-copy { min-width: 0; }
.rd-title { margin: 0; font-size: clamp(26px, 3vw, 38px); font-weight: 700; letter-spacing: -.035em; line-height: 1.25; overflow-wrap: anywhere; }
.rd-title-en { margin: 6px 0 0; color: var(--faint); font-size: 13px; overflow-wrap: anywhere; }
.rd-identity { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin: 10px 0 0; color: var(--muted); font-size: 12px; }
.rd-link { color: var(--muted); text-decoration: none; }
.rd-link:hover { color: var(--accent-ink); text-decoration: underline; }
.rd-tags { display: flex; flex-wrap: wrap; gap: 5px; margin: 12px 0 0; padding: 0; list-style: none; }
.rd-tag { padding: 1px 7px; border-radius: 4px; background: var(--inset); color: var(--muted); font-size: 11px; line-height: 1.7; }
.rd-intro { margin: 12px 0 0; max-width: 46em; color: var(--muted); font-size: 13px; line-height: 1.85; }
.rd-key-specs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 12px; margin: 16px 0 0; }
.rd-key-spec { margin: 0; }
.rd-key-spec dt { color: var(--faint); font-size: 10px; }
.rd-key-spec dd { margin: 3px 0 0; font-size: 17px; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.rd-body { display: grid; grid-template-columns: minmax(0, 1fr) 244px; gap: 26px; padding-top: 22px; align-items: start; }
.rd-main { min-width: 0; display: grid; gap: 22px; }
.rd-section { min-width: 0; }
.rd-section-title { margin: 0 0 10px; font-size: 15px; font-weight: 650; }
.rd-overview { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.9; }
.rd-links { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 10px 0 0; padding: 0; list-style: none; font-size: 12px; }
.rd-specs { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 1px; margin: 0; padding: 1px; background: var(--line); border-radius: 8px; }
.rd-spec { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 0; padding: 7px 10px; background: var(--surface); }
.rd-spec dt { color: var(--faint); font-size: 11px; }
.rd-spec dd { margin: 0; font-size: 12px; font-variant-numeric: tabular-nums; text-align: end; overflow-wrap: anywhere; }
.rd-flight-stats { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 0 0 14px; }
.rd-flight-stat { margin: 0; }
.rd-flight-stat dt { color: var(--faint); font-size: 10px; }
.rd-flight-stat dd { margin: 2px 0 0; font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; }
.rd-chart { margin: 0 0 16px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.rd-chart-title { color: var(--muted); font-size: 11px; }
.rd-bars { display: flex; align-items: flex-end; gap: 10px; height: 108px; margin: 10px 0 0; padding: 0; list-style: none; overflow-x: auto; }
.rd-bar-col { position: relative; display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 34px; }
.rd-bar-count { color: var(--faint); font-size: 10px; font-variant-numeric: tabular-nums; }
.rd-bar { display: flex; flex-direction: column; justify-content: flex-end; width: 14px; min-height: 2px; border-radius: 3px 3px 0 0; background: var(--inset); overflow: hidden; }
.rd-bar-ok { display: block; background: var(--good); }
.rd-bar-fail { display: block; background: var(--fail); }
.rd-bar-col.is-current .rd-bar-year { color: var(--accent-ink); font-weight: 650; }
.rd-bar-year { color: var(--faint); font-size: 10px; font-variant-numeric: tabular-nums; }
.rd-chart-legend { display: flex; gap: 12px; margin: 8px 0 0; color: var(--faint); font-size: 10px; }
.rd-legend-ok::before,
.rd-legend-fail::before,
.agd-legend-ok::before,
.agd-legend-fail::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-inline-end: 4px; border-radius: 2px; background: var(--good); }
.rd-legend-fail::before,
.agd-legend-fail::before { background: var(--fail); }
.rd-table-wrap { overflow-x: auto; }
.rd-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.rd-table th { padding: 6px 8px; border-bottom: 1px solid var(--line-strong); color: var(--faint); font-size: 10px; font-weight: 600; text-align: start; white-space: nowrap; }
.rd-table td { padding: 7px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.rd-row:hover td { background: var(--hover-tint); }
.rd-date,
.rd-serial { color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.rd-mission-link { color: var(--fg); text-decoration: none; }
.rd-mission-link:hover { color: var(--accent-ink); text-decoration: underline; }
.rd-result,
.agd-result { display: inline-block; padding: 1px 6px; border-radius: 4px; background: var(--inset); color: var(--muted); font-size: 11px; }
.rd-result.ok,
.agd-result.ok { background: var(--good-bg); color: var(--good); }
.rd-result.fail,
.agd-result.fail { background: var(--fail-bg); color: var(--fail); }
.rd-result.tbc,
.agd-result.tbc { background: var(--tbc-bg); color: var(--tbc); }
.rd-result.tbd,
.agd-result.tbd { background: var(--tbd-bg); color: var(--tbd); }
.rd-result.live,
.agd-result.live { background: var(--fail-bg); color: var(--live); }
.rd-empty { margin: 0; padding: 18px 0; color: var(--muted); font-size: 12px; }
.rd-upcoming-list { display: grid; gap: 1px; margin: 0; padding: 1px; background: var(--line); border-radius: 8px; list-style: none; }
.rd-upcoming-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; padding: 7px 10px; background: var(--surface); font-size: 12px; }
.rd-upcoming-date { color: var(--muted); font-variant-numeric: tabular-nums; }
.rd-upcoming-link { color: var(--fg); text-decoration: none; }
.rd-upcoming-link:hover { color: var(--accent-ink); text-decoration: underline; }
.rd-upcoming-site { color: var(--faint); font-size: 11px; }
.rd-side { display: grid; gap: 12px; position: sticky; top: 12px; }
.rd-side-section { padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.rd-side-title { margin: 0 0 6px; font-size: 12px; font-weight: 650; }
.rd-next-name { margin: 0; font-size: 12px; font-weight: 600; overflow-wrap: anywhere; }
.rd-next-date { margin: 4px 0 0; color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.rd-next-countdown { margin: 6px 0 0; color: var(--next-ink); font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; }
.rd-next-link { display: inline-flex; align-items: center; min-height: 28px; margin-top: 6px; color: var(--accent-ink); font-size: 11px; }
.rd-kv-list { display: grid; gap: 3px; margin: 0; padding: 0; list-style: none; font-size: 12px; }
.rd-kv-row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.rd-kv-label { min-width: 0; color: var(--muted); overflow-wrap: anywhere; }
.rd-kv-value { flex: none; color: var(--fg); font-variant-numeric: tabular-nums; }

/* --- rocket compare --------------------------------------------------- */
/* 标题与分享工具同一头部：标题在左，分享工具靠右；窄屏允许换行。 */
.rc-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 8px 16px; padding: 22px 0 14px; }
.rc-title { flex: 1 1 260px; min-width: 0; margin: 0; font-size: clamp(22px, 2.4vw, 30px); font-weight: 690; letter-spacing: -.03em; }
.rc-empty { margin: 20px 0; padding: 28px 20px; border: 1px dashed var(--line-strong); border-radius: 10px; color: var(--muted); font-size: 13px; text-align: center; }
.rc-empty a { color: var(--accent-ink); }

/* 分享工具：一个小按钮 + 一行状态文字；链接输入框按需独占下一行，
   不挤标题、不额外堆说明文字。作为头部右端，靠右但不超出容器。 */
.rc-tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px 12px; max-width: 100%; min-width: 0; margin-top: 0; margin-inline-start: auto; }
.rc-share { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 4px 11px; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface); color: var(--accent-ink); font: inherit; font-size: 12px; font-weight: 400; line-height: 1.4; white-space: nowrap; cursor: pointer; transition: border-color .15s, background-color .15s, color .15s; }
.rc-share-icon { display: block; flex: none; width: 14px; height: 14px; }
.rc-share-label { min-width: 0; }
.rc-share:hover { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-ink); }
.rc-share:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.rc-share-status { min-width: 0; color: var(--muted); font-size: 11.5px; line-height: 1.6; }
.rc-share-status:empty { display: none; }
.rc-share-link { flex: 1 1 100%; max-width: 100%; min-width: 0; margin: 0; padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--inset); color: var(--muted); font: inherit; font-size: 12px; line-height: 1.5; }
.rc-share-link[hidden] { display: none; }
.rc-table-wrap { overflow-x: auto; margin-top: 8px; }
.rc-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.rc-table th { padding: 10px 12px; border-bottom: 1px solid var(--line-strong); text-align: start; vertical-align: bottom; }
.rc-corner { width: 160px; }
.rc-head-cell { min-width: 150px; }
.rc-head-link { display: block; color: var(--fg); font-size: 14px; font-weight: 650; text-decoration: none; overflow-wrap: anywhere; }
.rc-head-link:hover { color: var(--accent-ink); text-decoration: underline; }
.rc-head-maker { display: block; margin-top: 3px; color: var(--faint); font-size: 11px; }
.rc-head-status { margin-top: 4px; }
.rc-row th,
.rc-row td { padding: 8px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
.rc-label { color: var(--faint); font-size: 11px; font-weight: 500; text-align: start; white-space: nowrap; }
.rc-cell { font-family: "CHX Flag Emoji", var(--text); font-variant-numeric: tabular-nums; }
.rk-opt-label, .page-rockets .rk-filterbar .rk-fb-chip { font-family: "CHX Flag Emoji", var(--text); }
.rc-row:nth-child(even) td,
.rc-row:nth-child(even) th { background: var(--zone-soft); }
/* 最大值只做轻度强调：数值强调色 + 650 字重 + 淡强调底；不再用整行
   标签颜色表达差异，也不做红绿优劣。 */
.rc-table .rc-cell.is-max {
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-weight: 650;
}

/* 悬停/选中给整行一个克制底色，写在条纹之后并且选择器更具体，
   不会被 :nth-child(even) 盖掉；最大值单元格保留自己的淡强调底。 */
.rc-table tbody .rc-row:hover > th,
.rc-table tbody .rc-row:hover > td { background: var(--zone-muted); }

.rc-table tbody .rc-row.is-selected > th,
.rc-table tbody .rc-row.is-selected > td { background: var(--accent-soft); }
.rc-table tbody .rc-row.is-selected > th { color: var(--accent-ink); }

/* 最大值保持橙色文字：hover/选中的整行底色不把数值覆成灰。 */
.rc-table tbody .rc-row:hover > .rc-cell.is-max,
.rc-table tbody .rc-row.is-selected > .rc-cell.is-max { background: var(--accent-soft); color: var(--accent-ink); font-weight: 650; }

.rc-table tbody .rc-row:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: -2px; }
.rc-add { margin: 26px 0 0; padding-top: 16px; border-top: 1px solid var(--line); }
.rc-add-title { margin: 0 0 8px; font-size: 13px; }
.rc-add-list { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.rc-add-link { display: inline-flex; align-items: baseline; gap: 6px; min-height: 30px; padding: 4px 10px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 12px; text-decoration: none; }
.rc-add-link:hover { border-color: var(--accent); color: var(--accent-ink); }
.rc-add-count { color: var(--faint); font-size: 10px; font-variant-numeric: tabular-nums; }

/* --- agency cards ----------------------------------------------------- */
.ag-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; margin: 16px 0 0; }
.ag-card { display: flex; flex-direction: column; gap: 8px; padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: inherit; text-decoration: none; }
.ag-card:hover { border-color: var(--line-strong); color: inherit; }
.ag-card:focus-visible,
.rk-card-hit:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.rk-card:has(.rk-card-hit:focus-visible) { border-color: var(--accent); }
.ag-card-head { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 10px; align-items: center; }
.ag-mark { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--zone-soft); }
.ag-mark img { max-width: 100%; max-height: 100%; object-fit: contain; }
.ag-mark-initials { color: var(--muted); font-size: 13px; font-weight: 650; letter-spacing: .02em; }
.ag-card-title { min-width: 0; }
.ag-name { margin: 0; font-size: 15px; font-weight: 650; line-height: 1.35; overflow-wrap: anywhere; }
.ag-name-en { margin: 2px 0 0; color: var(--faint); font-size: 11px; overflow-wrap: anywhere; }
.ag-abbrev { margin: 2px 0 0; color: var(--faint); font-size: 10px; letter-spacing: .06em; }
.ag-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin: 0; }
.ag-type { padding: 1px 6px; border-radius: 4px; background: var(--inset); color: var(--muted); font-size: 11px; }
.ag-type.government { background: var(--tbc-bg); color: var(--tbc); }
.ag-type.commercial { background: var(--accent-soft); color: var(--accent-ink); }
.ag-place { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 0; color: var(--muted); font-size: 11px; }
.ag-tags { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; }
.ag-tag { padding: 1px 6px; border-radius: 4px; background: var(--zone-soft); color: var(--muted); font-size: 10px; }
.ag-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 0; padding: 1px; background: var(--line); border-radius: 8px; }
.ag-stat { margin: 0; padding: 7px 9px; background: var(--surface); }
.ag-stat dt { color: var(--faint); font-size: 10px; }
.ag-stat dd { margin: 2px 0 0; font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ag-stat-sub { display: block; margin-top: 1px; color: var(--faint); font-size: 10px; font-weight: 400; }
.ag-stat-next dd { font-size: 13px; }
.ag-card-foot { margin: auto 0 0; padding-top: 8px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; line-height: 1.6; overflow-wrap: anywhere; }
.ag-foot-empty { color: var(--faint); }
.ag-empty { margin: 22px 0; }

/* --- agency detail ---------------------------------------------------- */
.agd { padding-bottom: 44px; }
.agd-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); gap: 22px; padding: 18px 0 20px; align-items: start; }
.agd-identity { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 12px; align-items: center; }
.agd-mark { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: var(--zone-soft); }
.agd-mark img { max-width: 100%; max-height: 100%; object-fit: contain; }
.agd-mark-initials { color: var(--muted); font-size: 15px; font-weight: 650; }
.agd-title { min-width: 0; }
.agd-title h1 { margin: 0; font-size: clamp(24px, 2.8vw, 34px); font-weight: 700; letter-spacing: -.035em; line-height: 1.25; overflow-wrap: anywhere; }
.agd-hero-copy { min-width: 0; }
.agd-hero-copy > :first-child { margin-top: 0; }
.agd-name-en { margin: 4px 0 0; color: var(--faint); font-size: 12px; overflow-wrap: anywhere; }
.agd-facts { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 12px 0 0; }
.agd-fact { margin: 0; color: var(--muted); font-size: 12px; }
.agd-type { padding: 1px 6px; border-radius: 4px; background: var(--inset); color: var(--muted); font-size: 11px; }
.agd-type.government { background: var(--tbc-bg); color: var(--tbc); }
.agd-type.commercial { background: var(--accent-soft); color: var(--accent-ink); }
.agd-desc { margin: 12px 0 0; color: var(--muted); font-size: 13px; line-height: 1.9; }
.agd-note { margin: 8px 0 0; color: var(--muted); font-size: 12px; line-height: 1.75; }
.agd-note-label { margin: 0; color: var(--faint); font-size: 10px; letter-spacing: .06em; }
.agd-note-body { margin: 2px 0 0; }
.agd-links { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 0; padding: 0; list-style: none; }
.agd-link { display: inline-flex; align-items: center; min-height: 28px; padding: 3px 9px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 11px; text-decoration: none; }
.agd-link:hover { border-color: var(--accent); color: var(--accent-ink); }
.agd-board { padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.agd-board-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.agd-board-title { margin: 0; font-size: 12px; font-weight: 650; }
.agd-board-as-of { margin: 0; color: var(--faint); font-size: 10px; }
.agd-board-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 10px 0 0; padding: 1px; background: var(--line); border-radius: 8px; }
.agd-cell { margin: 0; padding: 8px 10px; background: var(--surface); }
.agd-cell dt { color: var(--faint); font-size: 10px; }
.agd-cell dd { margin: 2px 0 0; }
.agd-cell-value { display: block; font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.agd-cell-sub { display: block; margin-top: 1px; color: var(--faint); font-size: 10px; overflow-wrap: anywhere; }
.agd-cell-next .agd-cell-value { color: var(--next-ink); }
.agd-main { display: grid; gap: 22px; padding-top: 22px; border-top: 1px solid var(--line); margin-top: 18px; }
.agd-section { min-width: 0; }
.agd-section-title { margin: 0 0 10px; font-size: 15px; font-weight: 650; }
.agd-sub-title { margin: 0 0 8px; color: var(--muted); font-size: 11px; font-weight: 600; }
.agd-years-range { margin-left: 6px; color: var(--faint); font-weight: 400; font-variant-numeric: tabular-nums; }
.agd-fleet-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.agd-fleet-card { display: flex; flex-direction: column; gap: 6px; height: 100%; padding: 11px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.agd-fleet-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 10px; }
.agd-fleet-name { margin: 0; font-size: 13px; font-weight: 650; overflow-wrap: anywhere; }
.agd-fleet-name a { color: inherit; text-decoration: none; }
.agd-fleet-name a:hover { color: var(--accent-ink); text-decoration: underline; }
.agd-fleet-status { font-size: 11px; }
.agd-fleet-specs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin: 0; }
.agd-spec { margin: 0; }
.agd-spec dt { color: var(--faint); font-size: 10px; }
.agd-spec dd { margin: 1px 0 0; font-size: 12px; font-variant-numeric: tabular-nums; }
.agd-up-list { display: grid; gap: 1px; margin: 0; padding: 1px; background: var(--line); border-radius: 8px; list-style: none; }
.agd-up-row { display: grid; grid-template-columns: max-content minmax(0, 1fr) auto; gap: 6px 10px; align-items: baseline; min-width: 0; padding: 7px 10px; background: var(--surface); font-size: 12px; }
.agd-up-row.is-next { background: var(--accent-soft); }
.agd-up-row:hover { background: var(--hover-tint); }
.agd-up-when { display: grid; gap: 1px; align-content: start; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.agd-up-date { font-variant-numeric: tabular-nums; }
.agd-up-time { color: var(--faint); font-size: 11px; font-variant-numeric: tabular-nums; }
.agd-up-body { display: grid; gap: 2px; min-width: 0; }
.agd-up-mission { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; min-width: 0; }
.agd-up-name { min-width: 0; color: var(--fg); text-decoration: none; overflow-wrap: anywhere; }
.agd-up-name:hover { color: var(--accent-ink); text-decoration: underline; }
.agd-up-rocket,
.agd-up-pad { min-width: 0; color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }
.agd-up-meta { display: grid; gap: 1px; min-width: 0; }
.agd-up-status { white-space: nowrap; }
.agd-up-next { color: var(--accent-ink); font-size: 10px; }
.agd-years { display: flex; align-items: flex-end; gap: 8px; max-width: 100%; margin: 0; padding: 4px 0 0; list-style: none; overflow-x: auto; }
.agd-year { position: relative; display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 30px; }
.agd-year-total { color: var(--faint); font-size: 10px; font-variant-numeric: tabular-nums; }
.agd-year-bar { display: flex; flex-direction: column-reverse; justify-content: flex-start; width: 13px; min-height: 2px; border-radius: 3px 3px 0 0; background: var(--inset); overflow: hidden; }
.agd-year-ok { display: block; background: var(--good); }
.agd-year-fail { display: block; background: var(--fail); }
.agd-year-label { color: var(--faint); font-size: 10px; font-variant-numeric: tabular-nums; }
.agd-year.is-current .agd-year-label { color: var(--accent-ink); font-weight: 650; }
.agd-years-legend { display: flex; gap: 12px; margin: 8px 0 0; color: var(--faint); font-size: 10px; }
.agd-table-wrap { margin-top: 12px; overflow-x: auto; }
.agd-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.agd-table th { padding: 6px 8px; border-bottom: 1px solid var(--line-strong); color: var(--faint); font-size: 10px; font-weight: 600; text-align: start; white-space: nowrap; }
.agd-table td { padding: 7px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.agd-table tr:hover td { background: var(--hover-tint); }
.agd-table-date { color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.agd-row-link { color: var(--muted); text-decoration: none; }
.agd-row-link:hover { color: var(--accent-ink); text-decoration: underline; }
.agd-history-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px; margin-top: 12px; }
.agd-history-count { margin: 0; color: var(--faint); font-size: 11px; font-variant-numeric: tabular-nums; }
.agd-pads { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.agd-pad { padding: 10px 12px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.agd-pad-name { margin: 0; font-size: 13px; font-weight: 650; overflow-wrap: anywhere; }
.agd-pad-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 4px 0 0; color: var(--faint); font-size: 11px; }
.agd-pad-count { color: var(--muted); font-variant-numeric: tabular-nums; }

/* --- responsive ------------------------------------------------------- */
@media (max-width: 1100px) {
  .rk-body { grid-template-columns: 176px minmax(0, 1fr); }
  .rk-rail { grid-column: 1 / -1; position: static; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
  .rd-body { grid-template-columns: minmax(0, 1fr) 220px; gap: 20px; }
}

/* 桌面：筛选列常开，控件本身 display:none（不会进入可访问树，也就不会
   出现“读屏说收起、链接却可见”的矛盾），面板就是普通静态列表。 */
@media (min-width: 901px) {
  .rk-filters { position: sticky; top: 12px; border: 0; border-radius: 0; background: none; overflow: visible; }
  .rk-filters-toggle { display: none; }
  .rk-facets { display: grid; gap: 14px; }
}

@media (max-width: 900px) {
  .ag-head { padding-top: 18px; }
  .rk-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 18px; }
  .rk-stat { padding-inline-start: 14px; }
  .rk-stat:nth-child(3n + 1) { padding-inline-start: 0; border-inline-start: 0; }
  .rk-body,
  .ag-layout { grid-template-columns: minmax(0, 1fr); gap: 16px; padding-top: 14px; }
  /* 展开后的筛选面板：两列分组，长名单继续走各自的“更多…”details。 */
  .rk-filters { order: -1; }
  .rk-filters-toggle[open] + .rk-facets { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; padding: 2px 14px 14px; }
  .ag-facets { position: static; grid-auto-flow: column; grid-auto-columns: minmax(150px, 1fr); gap: 10px; overflow-x: auto; padding-bottom: 6px; }
  /* 机构页保持原有的横向筛选条。 */
  .ag-facet { border-top: 0; border-left: 1px solid var(--line); padding: 0 0 0 10px; }
  .ag-facet:first-child { border-left: 0; padding-left: 0; }
  .rd-body { grid-template-columns: minmax(0, 1fr); }
  .rd-side { position: static; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
  .agd-hero { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .agd-board-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .agd-up-row { grid-template-columns: max-content minmax(0, 1fr) auto; }
}

@media (max-width: 640px) {
  .rk-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 16px; }
  .rk-stat:nth-child(3n + 1) { padding-inline-start: 14px; border-inline-start: 1px solid var(--poster-line); }
  .rk-stat:nth-child(2n + 1) { padding-inline-start: 0; border-inline-start: 0; }
  .rk-grid { grid-template-columns: minmax(0, 1fr); }
  .ag-grid { grid-template-columns: minmax(0, 1fr); }
  .rk-card-specs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rd-key-specs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rd-specs { grid-template-columns: minmax(0, 1fr); }
  .rd-table,
  .agd-table { font-size: 11px; }
  .agd-board-grid { grid-template-columns: minmax(0, 1fr); }
  .agd-up-row { grid-template-columns: max-content minmax(0, 1fr) auto; }
  .agd-fleet-specs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* The poster band always follows the shared shell gutter: 36px, 26px below
   920px, 17px below 740px and 14px below 370px. Its inner padding is that same
   gutter, so type never moves off the 1000px column and the band never reaches
   a scrollbar. */
@media (max-width: 920px) {
  .rk-head { --rk-bleed: 26px; }
}

@media (max-width: 740px) {
  .rk-head { --rk-bleed: 17px; }
}

@media (max-width: 370px) {
  .rk-head { --rk-bleed: 14px; }
}

@media (max-width: 600px) {
  .rd-table { min-width: 700px; }
  .agd-table { min-width: 580px; }
  .rc-head-cell { min-width: 120px; }
  .rk-filters-toggle[open] + .rk-facets { grid-template-columns: minmax(0, 1fr); gap: 12px; }
}

.rd-table-wrap:focus-visible,
.agd-table-wrap:focus-visible,
.rc-table-wrap:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }

@media (forced-colors: active) {
  .rd-table-wrap:focus-visible,
  .agd-table-wrap:focus-visible,
  .rc-table-wrap:focus-visible,
  .rk-card-hit:focus-visible,
  .rk-opt:focus-visible,
  .rk-filters-summary:focus-visible,
  .ag-card:focus-visible {
    outline: 2px solid Highlight;
    outline-offset: 2px;
  }
  /* 选中行与最大值单元在强制配色下用系统描边表达，不依赖底色。 */
  .rc-table .rc-row.is-selected > th,
  .rc-table .rc-row.is-selected > td,
  .rc-table .rc-cell.is-max { outline: 1px solid Highlight; outline-offset: -1px; }
  .rc-table tbody .rc-row:focus-visible { outline-color: Highlight; }
  .rc-share { border-color: CanvasText; background: Canvas; color: LinkText; }
  .rc-share-link { border-color: CanvasText; background: Canvas; color: CanvasText; }
  .rk-filters { border-color: CanvasText; }
}

@media print {
  .rk-facets,
  .rk-rail,
  .rk-filters-toggle,
  .rd-side,
  .rc-add { display: none; }
}


/* Rocket detail redesign */
.rd-detail {
  --rd-split: 268px;                     /* 右侧资料列宽度 */
  --rd-gutter: clamp(24px, 3.4vw, 40px); /* 主列与资料列间距 */
  --rd-inset: clamp(16px, 2.4vw, 24px);   /* 海报带横向留白，窄屏渐变的抵消量 */
  --rd-rule: 1px solid var(--line);
  --rd-rule-strong: 1px solid var(--line-strong);
  /* 海报带就是正文本身：左右边缘与下方章节、版心完全重合，不外溢、不内缩。 */
  padding-bottom: 44px;
}

/* --- 头部：真实配图作为海报画面层，文字压在稳定暗区上 ---------------- */
.rd-detail .rd-hero {
  position: relative;
  z-index: 0;                            /* 海报沉在对比浮条之下 */
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  /* 第 1 行正文、第 2 行署名、第 3 行轮播控件：三行都是 auto，署名换行/
     变长会把行高自然撞开，不靠固定高度也不会被裁；控件隐藏时不占行。 */
  grid-template-rows: auto auto auto;
  align-content: center;
  row-gap: 0;
  min-height: clamp(340px, 46vh, 520px);
  margin-block: 18px 0;
  /* 横向留白只给文字：Hero 外边缘仍是版心边界，绝对定位的画面层用
     inset:0 覆盖整个 padding box，所以图文都不贴边、照片也不缩小。 */
  padding: clamp(26px, 3.6vw, 44px) var(--rd-inset) clamp(24px, 3.2vw, 38px);
  border: 0;
  border-radius: 6px;
  background:
    radial-gradient(74% 118% at 92% 0%, rgba(255,131,66,.16), rgba(255,131,66,0) 60%),
    radial-gradient(62% 96% at 0% 100%, rgba(247,244,238,.06), rgba(247,244,238,0) 58%),
    var(--poster);
  color: var(--poster-fg);
  overflow: hidden;                      /* 画面层永远出不了海报，保无横溢 */
}
/* 无图：大字 + 抽象渐变留白，不画任何虚构轮廓。 */
.rd-detail .rd-hero:not(:has(.rd-figure))::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(44% 84% at 86% 16%, rgba(255,131,66,.26), rgba(255,131,66,0) 70%),
    radial-gradient(56% 70% at 100% 100%, rgba(247,244,238,.07), rgba(247,244,238,0) 62%);
  pointer-events: none;
}

/* 画面层：图片铺满整条海报带，但 figure 本身回到正常网格流（第 2 行），
   只为承载 figcaption —— 署名始终是它真正的 figcaption，矩形也包住它。
   cover 保住比例而不拉伸，允许裁边；没有内边距、没有浅色底板。 */
.rd-detail .rd-figure {
  grid-row: 2;
  margin: 0;
  min-width: 0;
}
.rd-detail .rd-hero-image {
  position: absolute;
  inset: 0;
  /* 负层：图片只在海报底色之上、一切普通流背景（例如窄屏署名条）之下。 */
  z-index: -1;
  display: block;
  width: 100%;
  height: 100%;
  /* 用户决定：有图时真实照片铺满整条海报带，允许裁边但不拉伸。
     基类 .rd-hero-image 的 max-height:360px 必须先取消，否则画面层
     只有 360px 高，海报下缘会露出一条空黑。 */
  max-height: none;
  padding: 0;
  object-fit: cover;
  /* 靠左取景：真实照片的火箭主体位于画面左侧，居中会被左侧遮罩吃掉。 */
  object-position: left center;
  background: none;
  border-radius: 0;
}
/* 深墨→图片的过渡层：左侧只压一层柔和半透明暗雾，保证标题/参数可读，
   同时仍能透出同一张照片；向右连续减淡直到透明，不出现不透明平台或突变。
   因为有图时照片是 cover 铺满的，这层同时负责把图片四边柔和拖入深墨：
   文字有暗区，画面不被硬白边切开。 */
.rd-detail .rd-figure::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(11,13,16,.68) 0%, rgba(11,13,16,.60) 28%, rgba(11,13,16,.42) 48%, rgba(11,13,16,.16) 68%, rgba(11,13,16,0) 86%),
    linear-gradient(180deg, rgba(11,13,16,.72) 0%, rgba(11,13,16,.22) 6%, rgba(11,13,16,0) 18%),
    radial-gradient(126% 120% at 80% 55%, rgba(11,13,16,0) 55%, rgba(11,13,16,.28) 86%, var(--poster) 100%);
}
.rd-detail .rd-credit {
  /* 正常流：写在 figure 里随行高长高，永远可见、可聚焦；只有相对定位让它
     压在背景画面层之上（绝对定位的背景图会在普通流内容之上绘制）。 */
  position: relative;
  z-index: 2;
  /* 间距写在署名自己身上：空署名被 :empty 隐藏时连这段空白一起消失。 */
  margin: clamp(16px, 2.2vw, 24px) 0 0;
  max-width: min(46%, 30em);            /* 与正文同列，落在左侧柔和暗雾内 */
  gap: 3px 10px;
  color: var(--poster-faint);
  font-size: 10px;
  line-height: 1.6;
}
.rd-detail .rd-credit-link {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.rd-detail .rd-credit-link:hover { color: var(--poster-accent-ink); }
/* 海报图若回落到站内图库的首图，只给一条可核对的图片资料入口；它的真实
   署名/许可仍在同一行。颜色用海报强调色而不是新标签，长度与 10px 底注一致。 */
.rd-detail .rd-credit-page {
  color: var(--poster-accent-ink);
  font-size: 10px;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.rd-detail .rd-credit-page:hover,
.rd-detail .rd-credit-page:focus-visible { color: var(--poster-fg); }
/* 一个来源都没有时不留空说明行（模板 figcaption 无空白子节点）。 */
.rd-detail .rd-credit:empty { display: none; }

/* --- 轮播控件：行为由 JS 写入，模板默认 hidden，无 JS / 单图时整组不存在 - */
.rd-detail .rd-hero-controls {
  grid-row: 3;                           /* 正常第三行：不压署名和正文 */
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: clamp(12px, 1.8vw, 18px);
}
/* display:flex 会盖掉 UA 的 hidden 规则，这里显式还原。 */
.rd-detail .rd-hero-controls[hidden] { display: none; }
.rd-detail .rd-hero-controls button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  min-height: 28px;
  padding: 0 9px;
  border: 0;                             /* 常态无框：控件只由字形与进度条表达 */
  border-radius: 4px;
  background: transparent;
  box-shadow: none;
  color: var(--poster-fg);
  font: inherit;
  font-size: 12px;
  line-height: 1;
  letter-spacing: .02em;
  cursor: pointer;
  transition: color .15s;
}
.rd-detail .rd-hero-controls button:hover,
.rd-detail .rd-hero-controls button:focus-visible {
  border: 0;
  background: transparent;
  box-shadow: none;
  color: var(--poster-accent-ink);
}
/* 键盘焦点独立于 hover：2px 强调色描边 + 2px 偏移，在任何照片上都清楚。 */
.rd-detail .rd-hero-controls button:focus-visible {
  outline: 2px solid var(--poster-accent-ink);
  outline-offset: 2px;
}

/* --- 轮播剩余进度：原来的可见“暂停”文字换成可点的细进度条 -------------
   按钮高度沿用当前 28px（继承上面的 button 规则），内部只画 3px 轨道。
   CSS 不持有任何定时器：填充宽度由 JS 用 WAAPI / 内联 transform 驱动，
   transform-origin 固定在左端，scaleX(1) 是满格初始值。 */
.rd-detail .rd-hero-controls button.rd-hero-progress { padding: 0 8px; }
.rd-detail .rd-hero-progress-track { display: block; width: clamp(72px, 14vw, 90px); height: 3px; border-radius: 999px; background: rgba(255,255,255,.32); overflow: hidden; }
.rd-detail .rd-hero-progress-fill { display: block; width: 100%; height: 100%; border-radius: inherit; background: #fff; transform: scaleX(1); transform-origin: left center; }
/* data-paused 只区分静止态：轨道亮一档，填充保持同一白色，不加文字。 */
.rd-detail .rd-hero-progress[data-paused]:not([data-paused="false"]) .rd-hero-progress-track { background: rgba(255,255,255,.42); }
.rd-detail .rd-hero-progress[data-paused]:not([data-paused="false"]) .rd-hero-progress-fill { background: #fff; }

.rd-detail .rd-hero-copy {
  grid-row: 1;
  position: relative;
  z-index: 2;
  min-width: 0;
  max-width: min(48%, 30em);            /* 文字始终留在实心暗区 */
  display: grid;
  align-content: center;
}
/* 无图时没有画面层要避让，正文可以用到整个版心。 */
.rd-detail .rd-hero:not(:has(.rd-figure)) .rd-hero-copy { max-width: min(100%, 44em); }
.rd-detail .rd-title {
  margin: 0;
  color: var(--poster-fg);
  font-size: clamp(30px, 4.4vw, 52px);
  font-weight: 700;
  line-height: 1.06;
  letter-spacing: -.04em;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
.rd-detail .rd-title-en {
  margin: 13px 0 0;
  color: var(--poster-faint);
  font-size: 11.5px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: .18em;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}
.rd-detail .rd-identity {
  margin: 17px 0 0;
  gap: 6px 14px;
  color: var(--poster-muted);
  font-size: 12.5px;
  line-height: 1.6;
}
.rd-detail .rd-country { display: inline-flex; align-items: center; gap: 5px; }
.rd-detail .rd-country > .country-flag { margin-inline-end: 0; vertical-align: 0; }
.rd-detail .rd-hero .rd-link {
  color: var(--poster-fg);
  text-decoration: none;
  border-bottom: 1px solid var(--poster-line-strong);
}
.rd-detail .rd-hero .rd-link:hover,
.rd-detail .rd-hero .rd-link:focus-visible { color: var(--poster-accent-ink); border-bottom-color: currentColor; }
.rd-detail .rd-status {
  padding: 1px 9px;
  border: 1px solid var(--poster-line-strong);
  border-radius: 999px;
  background: rgba(247,244,238,.06);
  color: var(--poster-fg);
  font-size: 11.5px;
  font-weight: 500;
  white-space: nowrap;
}
/* 深色海报上不能沿用浅色主题的状态色（如 #047857），单独给一组合适的亮色。 */
.rd-detail .rd-hero .rd-status.good { color: var(--poster-good); border-color: rgba(126,226,184,.42); }
.rd-detail .rd-hero .rd-status.tbc { color: var(--poster-warn); border-color: rgba(242,205,122,.42); }
.rd-detail .rd-hero .rd-status.tbd { color: var(--poster-accent-ink); border-color: rgba(255,177,132,.42); }
.rd-detail .rd-hero .rd-status.live,
.rd-detail .rd-hero .rd-status.fail { color: var(--poster-bad); border-color: rgba(255,161,182,.42); }
.rd-detail .rd-hero .rd-status.sched { color: var(--poster-muted); }

.rd-detail .rd-tags { margin: 14px 0 0; gap: 5px; }
.rd-detail .rd-tag { padding: 1px 8px; border-radius: 999px; background: rgba(247,244,238,.1); color: var(--poster-muted); font-size: 11px; line-height: 1.7; }
/* 数据契约：src/rockets.zig 始终把 lifecycleLabel(state) 作为 tags[0]，与
   .rd-status 同值。这里只隐藏这一个纯视觉重复项，真实状态仍由带
   status_class 的 .rd-status 承载，其余标签（可复用 / 首飞 / 未来排期）
   与列表语义保持不动；模板不改字段。 */
.rd-detail .rd-tags > .rd-tag:first-child { display: none; }
/* 只剩重复项（或没有标签）时，整行标签区不占空白。 */
.rd-detail .rd-tags:not(:has(> .rd-tag:nth-child(2))) { display: none; }

.rd-detail .rd-hero .rd-key-specs { margin: 28px 0 0; gap: 16px 18px; }
.rd-detail .rd-hero .rd-key-spec { padding-top: 10px; border-top: 1px solid var(--poster-line); }
.rd-detail .rd-hero .rd-key-spec dt { color: var(--poster-faint); font-size: 10.5px; line-height: 1.5; letter-spacing: .04em; }
.rd-detail .rd-hero .rd-key-spec dd {
  margin: 5px 0 0;
  color: var(--poster-fg);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.015em;
  overflow-wrap: anywhere;
}

/* --- 照片：真实图库条目，空数组整区不占位 -----------------------------
   数据契约：rockets.Detail.photos 只含「其余」已入库图片（海报图不重复），
   photos_href 指向该型号的站内图库。每条的 href 是 /images/{sha}，署名只
   用 photo.credit 原值；模板不做任何许可推断。 */
.rd-photos { margin: 32px 0 0; padding-top: 24px; border-top: var(--rd-rule); }
.rd-photos-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px; margin-bottom: 14px; }
.rd-photos-all { display: inline-flex; align-items: center; min-height: 26px; color: var(--accent-ink); font-size: 12px; text-decoration: none; }
.rd-photos-all:hover, .rd-photos-all:focus-visible { text-decoration: underline; }
.rd-photos-strip { overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x proximity; padding-bottom: 4px; }
.rd-photos-strip:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 2px; }
.rd-photo-list { display: flex; gap: 10px; margin: 0; padding: 0; list-style: none; }
.rd-photo { flex: 0 0 clamp(152px, 22%, 188px); min-width: 0; scroll-snap-align: start; }
.rd-photo-link { display: block; color: inherit; text-decoration: none; }
.rd-photo-frame { display: block; aspect-ratio: 4 / 3; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--zone-soft); }
.rd-photo-img { display: block; width: 100%; height: 100%; object-fit: contain; }
.rd-photo-credit { display: block; margin-top: 6px; color: var(--faint); font-size: 10.5px; line-height: 1.5; overflow-wrap: anywhere; }
.rd-photo-link:hover .rd-photo-frame,
.rd-photo-link:focus-visible .rd-photo-frame { border-color: var(--accent); }

/* --- 主体：概述 / 型号参数 与资料列并列；历史横跨版心 ----------------- */
/* 首条分隔线画在整个主体块上：它必须横跨版心，而写进 #rd-overview 只能跨到
   自己的栅格轨道，会与资料列错位。资料列因此只在第一行，位于这条线之下。 */
.rd-detail .rd-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--rd-split);
  grid-template-areas: "overview side" "params params";
  align-content: start;
  align-items: start;
  gap: 30px var(--rd-gutter);
  margin-top: 32px;
  padding-top: 24px;
  border-top: var(--rd-rule);
}
.rd-detail #rd-overview { grid-area: overview; }
.rd-detail #rd-parameters { grid-area: params; }
.rd-detail #rd-history,
.rd-detail #rd-upcoming { grid-column: 1 / -1; min-width: 0; }
/* 主要章节之间只用一条同色细线加适度留白（与任务详情 / 术语页同一节奏），
   并且横跨整个版心：资料列只与概述同排，不会和分隔线交叉。 */
.rd-detail #rd-parameters,
.rd-detail #rd-history,
.rd-detail #rd-upcoming { padding-top: 24px; border-top: var(--rd-rule); }
/* 没有“下一次飞行”时模板不再渲染 .rd-side，栅格随之收回，不留空白列。 */
.rd-detail .rd-body:not(:has(> .rd-side)) {
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "overview" "params";
}

.rd-detail .rd-side {
  grid-area: side;
  position: sticky;
  top: 16px;
  display: grid;
  gap: 22px;
  align-content: start;
}

/* 章节标题与任务详情 / 术语页同一层级：18px/660，前面一条 4×15 的橙色竖条。 */
.rd-detail .rd-section-title,
.rd-detail .rd-photos-title {
  margin: 0 0 12px;
  font-size: 18px;
  font-weight: 660;
  letter-spacing: -.02em;
  line-height: 1.5;
}
.rd-detail .rd-section-title::before,
.rd-detail .rd-photos-title::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 15px;
  margin-right: 10px;
  border-radius: 3px;
  background: var(--accent);
  vertical-align: -1px;
}
.rd-detail .rd-overview { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.95; }
.rd-detail .rd-links { margin-top: 14px; gap: 6px 16px; font-size: 12px; }
.rd-detail .rd-link { color: var(--muted); text-decoration: none; }
.rd-detail .rd-link:hover { color: var(--accent-ink); text-decoration: underline; }

/* 型号参数：去卡片化，细线分行，标签与数值两极对齐 */
.rd-detail .rd-specs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap: 0 clamp(20px, 3vw, 36px);
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: none;
}
.rd-detail .rd-spec {
  align-items: baseline;
  gap: 12px;
  padding: 9px 0;
  border-bottom: var(--rd-rule);
  background: none;
}
.rd-detail .rd-spec dt { color: var(--faint); font-size: 11.5px; line-height: 1.7; }
.rd-detail .rd-spec dd { margin: 0; font-size: 13px; line-height: 1.7; }

/* --- 发射历史：全宽 + 清晰数字层级 ----------------------------------- */
.rd-detail #rd-history {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: clamp(24px, 3.4vw, 44px);
  align-items: start;
}
.rd-detail #rd-history > .rd-section-title { grid-column: 1 / -1; }
.rd-detail #rd-history > .rd-flight-stats { grid-column: 1; margin: 0; }
.rd-detail #rd-history > .rd-chart { grid-column: 2; grid-row: 2; }
.rd-detail #rd-history > .rd-table-wrap,
.rd-detail #rd-history > .rd-empty { grid-column: 1 / -1; margin-top: 24px; min-width: 0; }
.rd-detail .rd-flight-stats { gap: 10px 34px; margin: 0; }
.rd-detail .rd-flight-stat dt { color: var(--faint); font-size: 11px; }
.rd-detail .rd-flight-stat dd {
  margin: 4px 0 0;
  font-size: 21px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.01em;
}
.rd-detail .rd-chart {
  margin: 0 0 22px;
  padding: 0 0 14px;
  border: 0;
  border-bottom: var(--rd-rule);
  border-radius: 0;
  background: none;
}
.rd-detail .rd-bars { margin-top: 14px; }
.rd-detail .rd-chart-title { color: var(--faint); font-size: 11px; }

.rd-detail .rd-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;   /* 移动端只在表内滚动 */
}
.rd-detail .rd-table { width: 100%; font-size: 12.5px; }
.rd-detail .rd-table th {
  padding: 9px 12px 8px;
  border-bottom: var(--rd-rule-strong);
  color: var(--faint);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .02em;
  white-space: nowrap;
}
.rd-detail .rd-table td { padding: 11px 12px; border-bottom: var(--rd-rule); line-height: 1.65; }
.rd-detail .rd-table th:first-child,
.rd-detail .rd-table td:first-child { padding-inline-start: 0; }
.rd-detail .rd-table th:last-child,
.rd-detail .rd-table td:last-child { padding-inline-end: 0; }
.rd-detail .rd-date,
.rd-detail .rd-serial { color: var(--muted); white-space: nowrap; }
.rd-detail .rd-landing { white-space: nowrap; }   /* 避免回收站点名逐字断行 */
.rd-detail .rd-result { font-size: 11px; font-weight: 500; white-space: nowrap; }

/* --- 后续发射计划 ------------------------------------------------------ */
.rd-detail .rd-upcoming-list {
  gap: 0;
  padding: 0;
  border-radius: 0;
  background: none;
}
.rd-detail .rd-upcoming-row {
  display: grid;
  grid-template-columns: 132px minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 4px 18px;
  padding: 11px 0;
  border-bottom: var(--rd-rule);
  background: none;
  font-size: 12.5px;
}
.rd-detail .rd-upcoming-date { color: var(--muted); white-space: nowrap; }
.rd-detail .rd-upcoming-site { color: var(--faint); font-size: 12px; }

/* --- 资料列：下一次飞行 + 对比（.rd-priority） ------------------------ */
.rd-detail .rd-priority { display: grid; gap: 22px; align-content: start; }
/* 资料列不再嵌套小卡：块间只用一条细线，首块不加线（避免紧贴 hero 下边线）。 */
.rd-detail .rd-priority > * {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
}
.rd-detail .rd-priority > * + * { padding-top: 18px; border-top: var(--rd-rule); }
.rd-detail .rd-side-title {
  margin: 0 0 10px;
  color: var(--faint);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .06em;
}
.rd-detail .rd-next-name { margin: 0; font-size: 15px; font-weight: 650; line-height: 1.5; }
.rd-detail .rd-next-date { margin: 6px 0 0; color: var(--muted); font-size: 12px; }
.rd-detail .rd-next-countdown {
  margin: 10px 0 0;
  color: var(--next-ink);
  font-size: 22px;
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: -.015em;
}
.rd-detail .rd-next-link { margin-top: 8px; color: var(--accent-ink); font-size: 12px; }

/* --- 对比：版心右侧的浮动操作 ------------------------------------------
   模板把 .rd-compare 放在 article 之外，只保留一个操作入口。
   宽屏（≥1280px）按 .detail-toc 的定位思路贴 1000px 版心右缘外侧固定。
   窄屏贴 1000px 版心右外缘，无外侧留白时（≤1072px）自动回到视口右缘，
   固定 24px 宽（按钮 24px，边框在按钮上）。shell 左右 margin 在 >920px
   为 36px、≤920px 为 26px、≤740px 为 17px、≤370px 为 14px，因此后两档给
   火箭详情 main.shell 补上 8px / 12px 右内边距，正文右缘恰好落在浮条左侧，
   不被遮挡；浮条不进入正文栅格，也不新增横向滚动。fixed 只跟随视口：滚动
   时持续可用；返回、正文与页脚操作都在版心内。 */
.rd-compare {
  position: fixed;
  top: 50%;
  right: max(0px, calc((100vw - 1000px) / 2 - 24px));
  z-index: 10;
  transform: translateY(-50%);
  width: 24px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
}
/* 窄屏只在视觉上收起标签；aria-labelledby 仍在计算可访问名称。 */
.rd-compare-title { display: none; }
.rd-compare-btn {
  display: block;
  width: 24px;
  min-height: 0;
  padding: 12px 5px;
  border: 1px solid var(--line);
  border-radius: 8px 0 0 8px;
  background: var(--surface);
  color: var(--muted);
  font-size: 12px;
  line-height: 1.3;
  letter-spacing: .12em;
  writing-mode: vertical-rl;
  text-orientation: upright;
  white-space: nowrap;
  cursor: pointer;
}
.rd-compare-btn:hover { color: var(--accent-ink); }
/* 浮条贴着视口右缘，焦点环向内收紧才不被裁掉。 */
.rd-compare-btn:focus-visible { outline-offset: -2px; }
.rd-compare-btn.is-on,
.rd-compare-btn[aria-pressed="true"] { background: var(--accent-soft); color: var(--accent-ink); }
.rd-compare-btn[disabled] { opacity: .55; cursor: not-allowed; }

/* 只在火箭详情（main 直接持有 .rd-compare）让正文避让右缘的 24px 浮条。 */
@media (max-width: 740px) {
  main.shell:has(> .rd-compare) { padding-inline-end: 8px; }
}
@media (max-width: 370px) {
  main.shell:has(> .rd-compare) { padding-inline-end: 12px; }
}

@media (min-width: 1280px) {
  .rd-compare {
    right: max(16px, calc((100vw - 1000px) / 2 - 140px));
    display: grid;
    gap: 8px;
    width: 116px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: var(--surface);
  }
  .rd-compare-title {
    display: block;
    margin: 0;
    color: var(--faint);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .06em;
  }
  .rd-compare-btn {
    width: 100%;
    min-height: 32px;
    padding: 5px 6px;
    border: 1px solid var(--line-strong);
    border-radius: 6px;
    background: var(--surface);
    color: var(--fg);
    font-size: 12px;
    line-height: 1.5;
    letter-spacing: 0;
    white-space: normal;
    writing-mode: horizontal-tb;
    text-orientation: mixed;
  }
  .rd-compare-btn:hover { border-color: var(--accent); color: var(--accent-ink); }
  .rd-compare-btn:focus-visible { outline-offset: 4px; }
  .rd-compare-btn.is-on,
  .rd-compare-btn[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-ink); }
}

/* --- 后续轻量网格区：回收统计 / 常用工位 / 同机构型号 ---------------- */
.rd-detail .rd-more {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
  gap: 24px clamp(24px, 4vw, 48px);
  margin-top: 32px;
  padding-top: 26px;
  border-top: var(--rd-rule);
}
/* 三组数据全空时整块不占位（不覆盖任何 [hidden] 元素）。 */
.rd-detail .rd-more:not(:has(> .rd-side-section:not([hidden]))) { display: none; }
.rd-detail .rd-more > .rd-side-section {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
}
.rd-detail .rd-more .rd-side-title { margin-bottom: 10px; }
.rd-detail .rd-more .rd-kv-list { gap: 0; font-size: 12.5px; }
.rd-detail .rd-more .rd-kv-row { gap: 16px; padding: 6px 0; border-bottom: var(--rd-rule); }
.rd-detail .rd-more .rd-kv-row:last-child { border-bottom: 0; }
.rd-detail .rd-more .rd-link { color: var(--fg); }
.rd-detail .rd-more .rd-link:hover,
.rd-detail .rd-more .rd-link:focus-visible { color: var(--accent-ink); text-decoration: underline; }
.rd-detail .rd-empty { margin: 0; padding: 18px 0; color: var(--muted); font-size: 12.5px; }

/* --- 响应式 ------------------------------------------------------------ */
@media (max-width: 1100px) {
  .rd-detail { --rd-split: 232px; }
}

@media (max-width: 900px) {
  /* 手机 / 窄屏：下一次飞行与对比排在概述之后、型号参数与历史之前 */
  .rd-detail .rd-body {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "overview" "side" "params";
    gap: 26px;
    margin-top: 26px;
    padding-top: 20px;
  }
  .rd-detail .rd-side { position: static; }
  .rd-detail #rd-parameters,
  .rd-detail #rd-history,
  .rd-detail #rd-upcoming { padding-top: 20px; }
  .rd-detail .rd-photos { margin-top: 26px; padding-top: 20px; }
  .rd-detail .rd-more { grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)); }
}

/* 窄屏海报的竖版构图只在屏幕上生效：打印稿另有一套图在上、字在下的
   静态文档布局，不会被截在这里。 */
@media screen and (max-width: 900px) {
  /* 照片铺满整条海报带，正文与署名依次坐在同一条半透明深色渐变上
     （只有上缘 52px 渐变），所以对比稳定、照片下缘仍然可见。 */
  .rd-detail .rd-hero {
    align-content: end;
    row-gap: 0;
    min-height: clamp(400px, 68vh, 560px);
    padding-top: clamp(120px, 26vh, 200px);
  }
  /* 手机：铺满后优先留主体（竖向火箭的箭体在画面上部），不居中裁头。 */
  .rd-detail .rd-hero-image { object-position: center top; }
  /* 半透明深色渐变：只把文字区域压暗，下方画面仍然透得出来，
     不是一整块不透明黑。 */
  .rd-detail .rd-figure::after {
    background: linear-gradient(0deg, rgba(11,13,16,.82) 0%, rgba(11,13,16,.52) 22%, rgba(11,13,16,.14) 44%, rgba(11,13,16,0) 64%);
  }
  .rd-detail .rd-hero:has(.rd-figure) { padding-bottom: 0; }
  /* 署名条挂在 figure 上：海报带已与正文同宽，署名条不再外溢，只靠自身
     半透明底色让文字压在画面上仍可读。署名再长只会把 figure 撞高，
     矩形始终包住它；空署名被 :empty 隐藏时连这段条带一起消失。 */
  .rd-detail .rd-hero:has(.rd-figure) .rd-figure {
    /* 半透明而非实心海报色：署名文字仍落在暗区，背后的照片继续可见。 */
    background: rgba(11,13,16,.72);
    /* 抵消父级 Hero 的横向留白：署名底色与正文渐变恰好铺到 Hero 内部边缘，
       文字仍停在原留白位，既不贴边也不外溢到 Hero 外。 */
    margin-inline: calc(-1 * var(--rd-inset));
    padding-inline: var(--rd-inset);
  }
  .rd-detail .rd-hero:has(.rd-figure) .rd-credit {
    max-width: none;
    margin-block-start: 0;
    padding-block: 14px 12px;
  }
  /* 控件在图片上自带底部留白：Hero 的 padding-bottom 仍为 0，
     画面才能一直铺到海报下缘。 */
  .rd-detail .rd-hero-controls { margin-top: 0; padding-block: 10px 14px; }
  .rd-detail .rd-hero-copy,
  .rd-detail .rd-hero:not(:has(.rd-figure)) .rd-hero-copy { max-width: none; }
  .rd-detail .rd-hero:has(.rd-figure) .rd-hero-copy {
    /* 文字块与海报同宽、同左缘，不再外溢；渐变的最后一级仍是半透明，
       保证压在图上的标题落在暗区，又不形成硬卡片。负边距只抵消
       父级 Hero 的横向留白，让渐变铺满整条海报带，标题文字靠 padding-inline
       回到原留白位。 */
    margin-inline: calc(-1 * var(--rd-inset));
    padding: 52px var(--rd-inset) 0;
    background: linear-gradient(180deg, rgba(11,13,16,0) 0%, rgba(11,13,16,.78) 20px, rgba(11,13,16,.84) 52px);
  }
  .rd-detail .rd-title { font-size: clamp(30px, 8vw, 42px); }
  .rd-detail .rd-hero .rd-key-specs { margin-top: 18px; gap: 12px 14px; }
}

/* 海报带跟随正文版心；≤740px / ≤370px 对比浮条占用的 8px / 12px 右内边距
   已经在 main.shell 上让开，海报随之停在同一右缘，不再需要额外外溢量。 */
@media (max-width: 600px) {
  .rd-photo { flex-basis: 44%; }
}

@media (max-width: 640px) {
  .rd-detail .rd-key-specs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
  .rd-detail .rd-hero .rd-key-spec dd { font-size: 18px; }
  .rd-detail .rd-table { min-width: 720px; font-size: 12px; }
  .rd-detail .rd-table th,
  .rd-detail .rd-table td { padding: 9px 10px; }
  .rd-detail .rd-upcoming-row { grid-template-columns: minmax(0, 1fr); gap: 3px; }
  .rd-detail .rd-flight-stats { gap: 8px 24px; }
  .rd-detail #rd-history { grid-template-columns: minmax(0, 1fr); }
  .rd-detail #rd-history > .rd-chart { grid-column: 1; grid-row: auto; margin-top: 18px; }
  .rd-detail #rd-history > .rd-table-wrap,
  .rd-detail #rd-history > .rd-empty { margin-top: 18px; }
  .rd-detail .rd-more { grid-template-columns: minmax(0, 1fr); gap: 22px; margin-top: 26px; padding-top: 22px; }
}

@media (forced-colors: active) {
  .rd-detail .rd-status,
  .rd-detail .rd-tag,
  .rd-detail .rd-result { border: 1px solid; }
  /* 控件在照片上：强制配色下退回系统颜色，不依赖半透明底色。 */
  .rd-detail .rd-hero-controls button {
    border: 1px solid CanvasText;        /* 常态无框，强制配色下补回系统描边 */
    background: Canvas;
    box-shadow: none;
    color: CanvasText;
  }
  .rd-detail .rd-hero-controls button:hover,
  .rd-detail .rd-hero-controls button:focus-visible {
    background: Highlight;
    color: HighlightText;
    border-color: Highlight;
  }
  .rd-detail .rd-hero-controls button:focus-visible { outline-color: CanvasText; }
  /* 进度条在强制配色下退化为系统色：轨道描边、填充用 Highlight。 */
  .rd-detail .rd-hero-progress-track { border: 1px solid CanvasText; background: Canvas; }
  .rd-detail .rd-hero-progress-fill { background: Highlight; }
  /* 暂停态填充特异性更高，必须同样回到系统色，否则白填充在白底上看不见。 */
  .rd-detail .rd-hero-progress[data-paused]:not([data-paused="false"]) .rd-hero-progress-fill { background: Highlight; }
  /* 章节竖条是背景色，强制配色下必须换成系统文字色才不会消失。 */
  .rd-detail .rd-section-title::before,
  .rd-detail .rd-photos-title::before { background: CanvasText; }
  .rd-compare { border-color: CanvasText; }
}

/* 保留既有打印行为：对比 / 倒计时等资料列不出现在打印稿中。
   打印机默认不喷背景色，海报的深底会变成白纸，暖白字就看不见了，
   所以打印稿把海报退化为黑字白底，保留标题层级与全部真实字段。 */
@media print {
  .rd-detail .rd-side,
  .rd-compare { display: none; }
  .rk-head,
  .rd-detail .rd-hero { background: #fff !important; color: #111 !important; }
  .rk-head :is(.rk-kicker, .rk-title, .rk-intro, .rk-stat dt, .rk-stat dd, .rk-stat),
  .rd-detail .rd-hero :is(.rd-title, .rd-title-en, .rd-identity, .rd-status, .rd-tag, .rd-link, .rd-credit, .rd-credit-page, .rd-key-spec dt, .rd-key-spec dd) { color: #111 !important; }
  .rk-stats { border-top-color: #bbb !important; }
  .rk-stat { border-inline-start-color: #bbb !important; }
  .rd-detail .rd-hero .rd-key-spec,
  .rd-detail .rd-status { border-color: #bbb !important; }
  /* 打印稿不喷背景图像，把画面层从“叠在海报上”改回“图在上、字在下”的
     静态文档，否则遮罩渐变丢失后黑字会压在照片上。署名自然跟图之后。 */
  .rd-detail .rd-hero { display: block; min-height: 0; overflow: visible; margin-inline: 0; padding: 0 0 14px; border-radius: 0; }
  .rd-detail .rd-hero-controls { display: none !important; }   /* 打印稿是静态文档，不出现交互控件 */
  .rd-detail .rd-figure { display: block; }
  .rd-detail .rd-figure::after { display: none; }
  .rd-detail .rd-hero-image { position: static; width: auto; max-width: 100%; height: auto; max-height: 90mm; padding: 0; background: none; }
  .rd-detail .rd-credit { position: static; max-width: none; margin: 6px 0 0; padding: 0; background: none; }
  .rd-detail .rd-hero-copy { max-width: none; margin: 0; padding: 0; background: none; }
}


/* --- agency detail ----------------------------------------------------
   Page-local presentation for templates/agency_detail.html. Every selector
   is an .agd-* hook on this page only; colors come from the shared site
   tokens so light/dark, contrast and print stay with the rest of the site.
   Identity, data band and sections are separated by type, rhythm and 1px
   rules instead of nested surface cards. No motion, no generated content
   that carries meaning, no new dependencies. */

/* --- identity block ---------------------------------------------------- */
header.agd-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  padding: 20px 0 0;
  align-items: start;
}
.agd-identity {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
.agd-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--zone-soft);
  overflow: hidden;
}
.agd-mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
.agd-mark-initials { color: var(--muted); font-size: 16px; font-weight: 650; letter-spacing: .02em; }
.agd-title { min-width: 0; }
.agd-title h1 {
  margin: 0;
  color: var(--strong);
  font-size: clamp(26px, 3.2vw, 36px);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.22;
  text-wrap: pretty;
  overflow-wrap: anywhere;
}
.agd-name-en { margin: 6px 0 0; color: var(--faint); font-size: 12px; letter-spacing: .015em; line-height: 1.5; overflow-wrap: anywhere; }

/* Country, type and state stay one quiet meta line under the name. */
.agd-facts { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; margin: 13px 0 0; font-size: 12px; line-height: 1.6; }
.agd-country { display: inline-flex; align-items: center; gap: 5px; margin: 0; color: var(--muted); white-space: nowrap; }
.agd-country .country-flag { margin: 0; font-size: 14px; line-height: 1; }
.agd-type { padding: 1px 7px; border-radius: 4px; background: var(--inset); color: var(--muted); font-size: 11px; line-height: 1.7; white-space: nowrap; }
.agd-type.government { background: var(--tbc-bg); color: var(--tbc); }
.agd-type.commercial { background: var(--accent-soft); color: var(--accent-ink); }
.agd-facts .status { font-size: 12px; white-space: nowrap; }
.agd-fact { margin: 0; color: var(--muted); font-size: 12px; white-space: nowrap; }

/* The full description is never clamped; a readable measure carries it. */
.agd-hero-copy { min-width: 0; max-width: none; margin: 20px 0 0; }
.agd-desc { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.9; overflow-wrap: break-word; }
.agd-hero-meta { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px 32px; margin: 20px 0 0; padding: 14px 0 0; border-top: 1px solid var(--line); }
.agd-hero-meta:not(:has(.agd-note)):not(:has(a)) { display: none; }
.agd-note { display: grid; gap: 2px; max-width: 34em; margin: 0; }
.agd-note-label { margin: 0; color: var(--faint); font-size: 10px; font-weight: 600; letter-spacing: .1em; line-height: 1.5; }
.agd-note-body { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; overflow-wrap: break-word; }
.agd-links { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 0 auto; padding: 0; list-style: none; }
.agd-links:empty { display: none; }
.agd-link { display: inline-flex; align-items: center; gap: 4px; min-height: 26px; padding: 2px 9px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 11px; line-height: 1.6; text-decoration: none; }
.agd-link:hover, .agd-link:focus-visible { border-color: var(--accent); color: var(--accent-ink); }

/* --- launch record band ------------------------------------------------ */
.agd-board {
  margin: 34px 0 0;
  padding: 0;
  border: 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: none;
}
.agd-board-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px; padding: 13px 0 0; }
.agd-board .agd-board-title { margin: 0; color: var(--strong); font-size: 16px; font-weight: 650; letter-spacing: -.005em; line-height: 1.5; }
.agd-board-as-of { margin: 0; color: var(--faint); font-size: 11px; font-variant-numeric: tabular-nums; }
.agd-board .agd-board-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 30px; margin: 12px 0 0; padding: 0; border-radius: 0; background: none; }
.agd-cell { margin: 0; padding: 12px 0 14px; border-top: 1px solid var(--line); background: none; }
.agd-cell dt { margin: 0; color: var(--faint); font-size: 11px; line-height: 1.5; }
.agd-cell dd { margin: 4px 0 0; }
.agd-cell-value { display: block; color: var(--fg); font-size: 21px; font-weight: 600; letter-spacing: -.015em; line-height: 1.25; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.agd-cell-sub { display: block; margin-top: 3px; color: var(--faint); font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.agd-cell-next .agd-cell-value { color: var(--next-ink); }

/* --- sections ---------------------------------------------------------- */
.agd-main { display: grid; gap: 32px; margin: 34px 0 0; padding: 0; border: 0; }
.agd-main > .agd-section + .agd-section { padding-top: 28px; border-top: 1px solid var(--line); }
.agd-section { min-width: 0; }
.agd-section .agd-section-title { margin: 0 0 14px; color: var(--strong); font-size: 16px; font-weight: 650; letter-spacing: -.005em; line-height: 1.5; }

/* --- rocket fleet ------------------------------------------------------ */
.agd-fleet-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 22px 32px; margin: 0; padding: 0; list-style: none; }
.agd-fleet-card { display: flex; flex-direction: column; gap: 10px; height: auto; padding: 14px 0 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: none; }
.agd-fleet-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
.agd-fleet-name { margin: 0; font-size: 14px; font-weight: 620; line-height: 1.5; overflow-wrap: anywhere; }
.agd-fleet-name a, .agd-fleet-link { color: var(--strong); text-decoration: none; }
.agd-fleet-name a:hover, .agd-fleet-link:hover, .agd-fleet-link:focus-visible { color: var(--accent-ink); text-decoration: underline; text-underline-offset: 3px; }
.agd-fleet-status { font-size: 11.5px; white-space: nowrap; }
.agd-fleet-specs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 16px; max-width: 27rem; margin: 0; }
.agd-spec { margin: 0; }
.agd-spec dt { color: var(--faint); font-size: 10.5px; line-height: 1.5; }
.agd-spec dd { margin: 3px 0 0; color: var(--fg); font-size: 12.5px; line-height: 1.5; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }

/* --- upcoming launches ------------------------------------------------- */
.agd-up-list { display: grid; gap: 0; margin: 0; padding: 0; border-radius: 0; background: none; list-style: none; }
.agd-up-list > li { margin: 0; }
.agd-up-row {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr) auto;
  gap: 4px 18px;
  align-items: baseline;
  min-width: 0;
  padding: 12px 0;
  border-top: 1px solid var(--line);
  background: none;
  color: inherit;
  font-size: 12px;
  text-decoration: none;
}
.agd-up-list > li:last-child > .agd-up-row { border-bottom: 1px solid var(--line); }
.agd-up-row.is-next { background: none; }
.agd-up-row:hover { background: var(--hover-tint); }
.agd-up-row:hover .agd-up-name { color: var(--accent-ink); }
.agd-up-row:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: -2px; }
.agd-up-when { display: grid; gap: 1px; align-content: start; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.agd-up-date { font-size: 12px; font-variant-numeric: tabular-nums; }
.agd-up-row.is-next .agd-up-date { color: var(--next-ink); font-weight: 550; }
.agd-up-time { color: var(--faint); font-size: 11px; font-variant-numeric: tabular-nums; }
.agd-up-body { display: grid; gap: 4px; min-width: 0; }
.agd-up-mission { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; min-width: 0; }
.agd-up-next { color: var(--accent-ink); font-size: 10px; font-weight: 600; letter-spacing: .02em; white-space: nowrap; }
.agd-up-name { min-width: 0; color: var(--fg); font-size: 13.5px; font-weight: 550; line-height: 1.6; overflow-wrap: anywhere; }
.agd-up-meta { display: flex; flex-wrap: wrap; gap: 2px 14px; min-width: 0; color: var(--faint); font-size: 11.5px; line-height: 1.6; }
.agd-up-rocket { color: var(--muted); }
.agd-up-rocket,
.agd-up-pad,
.agd-up-place { min-width: 0; overflow-wrap: anywhere; }
.agd-up-status { align-self: baseline; font-size: 12px; white-space: nowrap; }

/* --- launch history ---------------------------------------------------- */
.agd-sub-title { margin: 0 0 10px; color: var(--muted); font-size: 11.5px; font-weight: 600; line-height: 1.6; }
.agd-years-range { margin-left: 8px; color: var(--faint); font-weight: 400; font-variant-numeric: tabular-nums; }
.agd-years-block { margin: 0 0 18px; }
.agd-years { display: flex; align-items: flex-end; gap: 10px; max-width: 100%; margin: 0; padding: 4px 0 0; list-style: none; overflow-x: auto; overscroll-behavior-x: contain; }
.agd-year { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 32px; }
.agd-year-total { color: var(--faint); font-size: 10px; font-variant-numeric: tabular-nums; }
.agd-year-bar { display: flex; flex-direction: column-reverse; justify-content: flex-start; width: 14px; min-height: 2px; border-radius: 3px 3px 0 0; background: var(--inset); overflow: hidden; }
.agd-year-ok { display: block; background: var(--good); }
.agd-year-fail { display: block; background: var(--fail); }
.agd-year-label { color: var(--faint); font-size: 10px; font-variant-numeric: tabular-nums; }
.agd-year.is-current .agd-year-label { color: var(--accent-ink); font-weight: 650; }
.agd-years-legend { display: flex; gap: 14px; margin: 10px 0 0; color: var(--faint); font-size: 10px; }
.agd-legend-ok::before,
.agd-legend-fail::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-inline-end: 5px; border-radius: 2px; background: var(--good); }
.agd-legend-fail::before { background: var(--fail); }

.agd-table-wrap { margin: 0; overflow-x: auto; overscroll-behavior-x: contain; }
.agd-table-wrap:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: -2px; }
.agd-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.agd-table th { padding: 8px 12px 8px 0; border-bottom: 1px solid var(--line-strong); color: var(--faint); font-size: 10.5px; font-weight: 600; letter-spacing: .04em; text-align: start; white-space: nowrap; }
.agd-table td { padding: 10px 12px 10px 0; border-bottom: 1px solid var(--line); vertical-align: baseline; }
.agd-table th:last-child,
.agd-table td:last-child { padding-inline-end: 0; }
.agd-table tr:hover td { background: var(--hover-tint); }
.agd-table-date { color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.agd-table-mission { overflow-wrap: anywhere; }
.agd-table-rocket,
.agd-table-pad { color: var(--muted); overflow-wrap: anywhere; }
.agd-table-result { white-space: nowrap; }
.agd-row-link { color: var(--muted); text-decoration: none; }
.agd-row-link:hover, .agd-row-link:focus-visible { color: var(--accent-ink); text-decoration: underline; text-underline-offset: 3px; }
.agd-result { display: inline-block; padding: 1px 7px; border-radius: 4px; background: var(--inset); color: var(--muted); font-size: 11px; line-height: 1.7; white-space: nowrap; }
.agd-result.ok { background: var(--good-bg); color: var(--good); }
.agd-result.fail { background: var(--fail-bg); color: var(--fail); }
.agd-result.tbc { background: var(--tbc-bg); color: var(--tbc); }
.agd-result.tbd { background: var(--tbd-bg); color: var(--tbd); }
.agd-result.live { background: var(--fail-bg); color: var(--live); }

.agd-history-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 18px; margin-top: 16px; }
.agd-history-count { margin: 0; color: var(--faint); font-size: 11.5px; font-variant-numeric: tabular-nums; }
.agd-history-foot .agd-pages { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: 0; font-size: 12px; }
.agd-page-list { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 0; list-style: none; }
.agd-page-prev,
.agd-page-next,
.agd-page { display: inline-flex; align-items: center; justify-content: center; min-width: 30px; min-height: 30px; padding: 3px 9px; border-radius: 6px; color: var(--muted); font-variant-numeric: tabular-nums; text-decoration: none; }
.agd-page:hover, .agd-page:focus-visible { background: var(--chip-hover); color: var(--fg); }
.agd-page.is-on { background: var(--accent-soft); color: var(--accent-ink); }
.agd-page-prev[aria-disabled="true"],
.agd-page-next[aria-disabled="true"] { color: var(--faint); }

/* --- launch pads -------------------------------------------------------
   The section and its list no longer share a class name: the section stays
   a plain block, only the list is a grid, so the heading never sits beside
   the cards. */
section.agd-pads { display: block; margin: 0; padding: 0; }
ul.agd-pad-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 20px 32px; margin: 0; padding: 0; list-style: none; }
.agd-pad { padding: 13px 0 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: none; }
.agd-pad-name { margin: 0; font-size: 14px; font-weight: 620; line-height: 1.55; overflow-wrap: anywhere; }
.agd-pad-meta { display: flex; flex-wrap: wrap; gap: 3px 14px; margin: 6px 0 0; color: var(--faint); font-size: 11.5px; line-height: 1.6; }
.agd-pad-count { color: var(--muted); font-variant-numeric: tabular-nums; }
.agd-pad-coords { font-variant-numeric: tabular-nums; }

/* --- narrow screens ---------------------------------------------------- */
@media (max-width: 860px) {
  .agd-board .agd-board-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
  .agd-fleet-list { grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
  .agd-fleet-specs { max-width: none; }
  .agd-links { margin-left: 0; }
}

@media (max-width: 760px) {
  .agd-identity { grid-template-columns: 48px minmax(0, 1fr); gap: 12px; }
  .agd-mark { width: 48px; height: 48px; padding: 4px; }
  .agd-mark-initials { font-size: 14px; }
  .agd-hero-copy { max-width: none; }
  .agd-hero-meta { gap: 10px 24px; }
  .agd-up-row { gap: 4px 12px; }
}

@media (max-width: 640px) {
  .agd-main { gap: 26px; margin-top: 28px; }
  .agd-main > .agd-section + .agd-section { padding-top: 24px; }
  .agd-section .agd-section-title { margin-bottom: 12px; font-size: 15px; }
  .agd-board { margin-top: 28px; }
  .agd-board .agd-board-grid { gap: 0 18px; }
  .agd-board .agd-board-title { font-size: 15px; }
  .agd-cell { padding: 10px 0 12px; }
  .agd-cell-value { font-size: 19px; }
  .agd-table { font-size: 11.5px; }
  .agd-table th { padding: 7px 10px 7px 0; }
  .agd-table td { padding: 9px 10px 9px 0; }
  .agd-fleet-list { gap: 18px 24px; }
  ul.agd-pad-list { gap: 16px 24px; }
}

/* The history table keeps every column; it scrolls inside its named region. */
@media (max-width: 600px) {
  .agd-table { min-width: 620px; }
}

@media (max-width: 380px) {
  .agd-facts { gap: 5px 10px; font-size: 11.5px; }
  .agd-fact { font-size: 11.5px; }
  .agd-up-row { gap: 3px 10px; }
  .agd-up-status { font-size: 11.5px; }
}

@media (forced-colors: active) {
  .agd-up-row:focus-visible,
  .agd-link:focus-visible,
  .agd-page:focus-visible,
  .agd-table-wrap:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; }
  .agd-result,
  .agd-type { border: 1px solid CanvasText; }
}


/* Allow long identity names and countries to wrap. */
.rd-detail .rd-maker,
.rd-detail .rd-country,
.rd-detail .rd-country > .rd-link,
.agd-country,
.agd-fact { min-width: 0; max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
/* ===== Rocket catalog (fragment 124) ==================================
   /rockets becomes a real catalog: the approved poster band keeps its
   heading, intro and six statistics and gains an optional covering
   photograph; the facets leave the sidebar for one horizontal strip above
   the table; the card grid becomes a seven-column table whose headers carry
   the sort links. Nothing here invents data: an empty LEO or country prints
   an em dash, the photograph only exists when the proxy qualified one, and
   every link is the server's own href. */

/* --- poster band with a covering photograph --------------------------- */
/* The photo is a background layer, the type stays in normal flow, and one
   directional scrim keeps the left text column solid in any frame. */
.rk-head-photo {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: clamp(320px, 34vw, 412px);
}

.rk-head-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.rk-head-media-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 68% 42%;
}

.rk-head-photo::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(8, 10, 13, .97) 0%, rgba(8, 10, 13, .93) 32%, rgba(8, 10, 13, .74) 56%, rgba(8, 10, 13, .28) 80%, rgba(8, 10, 13, .12) 100%),
    linear-gradient(180deg, rgba(8, 10, 13, .48) 0%, rgba(8, 10, 13, 0) 30%, rgba(8, 10, 13, .58) 100%);
}

.rk-head-photo > .rk-head-inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
}

.rk-head-photo .rk-intro {
  max-width: 33em;
}

/* The foot takes the leftover band height, so the statistics stay on the
   band's bottom rule like a poster credit block instead of floating mid-air.
   The padding is the minimum gap on short (mobile) bands where no height is
   left over. */
.rk-head-foot {
  display: block;
}

.rk-head-photo .rk-head-foot {
  margin-top: auto;
  padding-top: clamp(22px, 3.2vw, 32px);
}

.rk-head-photo .rk-head-foot .rk-stats {
  margin-top: 0;
}

.rk-head-credit {
  margin: 12px 0 0;
  color: var(--poster-faint);
  font-size: 10.5px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.rk-head-credit-link {
  color: var(--poster-muted);
  text-decoration: underline;
  text-decoration-color: var(--poster-line-strong);
  text-underline-offset: 3px;
}

.rk-head-credit-link:hover,
.rk-head-credit-link:focus-visible {
  color: var(--poster-accent-ink);
  text-decoration-color: currentColor;
}

/* --- one column above the catalog ------------------------------------- */
.page-rockets .rk-body {
  display: block;
  padding: 18px 0 44px;
}

/* --- horizontal filter strip ------------------------------------------ */
/* Every group keeps its label directly above its own chips and wraps as one
   unit, so a crowded line never mixes one group's label into another group's
   chips. A group whose facet list came back empty is dropped instead of
   leaving a heading over nothing. A long manufacturer name still wraps inside
   its own chip instead of pushing the strip past the page. */
.rk-filterbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 10px 26px;
  padding: 12px 0;
  border-block: 1px solid var(--line);
  min-width: 0;
}

.rk-fb-group {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  min-width: 0;
  max-width: 100%;
}

/* A label with no option at all is a broken filter, not information. */
.rk-fb-group:not(:has(.rk-fb-chip)) {
  display: none;
}

.rk-fb-label {
  margin: 0;
  color: var(--faint);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .1em;
  line-height: 1.6;
}

.rk-fb-opts {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 4px;
  margin: 0;
  padding: 0;
  list-style: none;
  min-width: 0;
}

.rk-fb-chip {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  max-width: 15em;
  padding: 2px 8px;
  border-radius: 999px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.7;
  text-decoration: none;
  overflow-wrap: anywhere;
}

.rk-fb-chip:hover {
  background: var(--chip-hover);
  color: var(--fg);
}

.rk-fb-chip.is-active {
  background: var(--accent-soft);
  color: var(--accent);
}

.rk-fb-count {
  flex: none;
  color: var(--faint);
  font-size: 10.5px;
  font-weight: 400;
  font-variant-numeric: tabular-nums;
}

.rk-fb-chip.is-active .rk-fb-count {
  color: var(--accent);
  opacity: .75;
}

.rk-fb-more {
  flex: 0 1 auto;
  min-width: 0;
}

/* An opened "more" list takes the whole row, so its options wrap in one
   predictable block instead of squeezing into a chip-width column. */
.rk-fb-group:has(.rk-fb-more[open]) {
  flex: 1 1 100%;
}

.rk-fb-more[open] {
  flex: none;
  width: 100%;
}

.rk-fb-more-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  color: var(--accent-ink);
  font-size: 11.5px;
  line-height: 1.7;
  cursor: pointer;
  list-style: none;
}

.rk-fb-more-toggle::-webkit-details-marker { display: none; }
.rk-fb-more-toggle::marker { content: ""; }

.rk-fb-more-toggle::after {
  content: "＋";
  font-size: 9.5px;
  line-height: 1;
}

.rk-fb-more[open] > .rk-fb-more-toggle::after {
  content: "－";
}

.rk-fb-more-toggle:hover {
  background: var(--chip-hover);
}

.rk-fb-more > .rk-fb-opts {
  margin-top: 4px;
  padding-inline: 2px;
}

/* --- toolbar and native GET search ------------------------------------ */
.rk-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
  padding: 12px 0 10px;
  border-bottom: 1px solid var(--line);
}

.rk-search {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  margin-left: auto;
}

.rk-search-input {
  width: clamp(136px, 24vw, 208px);
  max-width: 100%;
  min-width: 0;
  min-height: 32px;
  padding: 4px 10px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--surface);
  color: var(--fg);
  font-size: 12.5px;
}

.rk-search-input::placeholder {
  color: var(--faint);
}

.rk-search-input:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
  border-color: var(--accent);
  box-shadow: none;
}

.rk-search-submit {
  flex: none;
  min-height: 32px;
  padding: 4px 11px;
  border: 1px solid var(--accent);
  border-radius: 6px;
  background: var(--inset);
  color: var(--accent);
  font-size: 12.5px;
  font-weight: 400;
  cursor: pointer;
}

.rk-search-submit:hover {
  background: var(--accent-soft);
}

.rk-search-submit:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
  border-color: var(--accent);
  box-shadow: none;
}

.rk-search-clear {
  flex: none;
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 1px;
  color: var(--accent);
  font-size: 12.5px;
  font-weight: 400;
  text-decoration: none;
  white-space: nowrap;
}

.rk-search-clear:hover {
  text-decoration: underline;
}

.rk-search-clear:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 4px;
}

/* --- compare tray as a slim bar above the table ----------------------- */
.rk-cmpbar {
  margin-top: 12px;
}

.rk-cmpbar .rk-tray {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 14px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}

.rk-cmpbar .rk-tray-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.rk-cmpbar .rk-tray-head :is(.rk-tray-title, h2, h3) {
  margin: 0;
  font-size: 12px;
  font-weight: 650;
}

.rk-cmpbar .rk-tray-empty {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.7;
}

.rk-cmpbar .rk-tray-count {
  margin-left: 6px;
  color: var(--accent-ink);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.rk-cmpbar .rk-tray-hint {
  color: var(--faint);
  font-size: 10px;
}

.rk-cmpbar .rk-tray-name {
  min-width: 0;
  overflow-wrap: anywhere;
}

.rk-cmpbar .rk-tray-remove {
  flex: none;
  padding: 1px 5px;
  border: 0;
  background: none;
  color: var(--faint);
  font-size: 13px;
  line-height: 1.2;
  cursor: pointer;
}

.rk-cmpbar .rk-tray-remove:hover {
  color: var(--accent-ink);
}

.rk-cmpbar .rk-tray-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.rk-cmpbar .rk-tray-list li {
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 1px 3px 1px 9px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--inset);
  font-size: 11.5px;
}

.rk-cmpbar .rk-tray-go {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  font-size: 11.5px;
  text-decoration: none;
}

.rk-cmpbar .rk-tray-go:hover {
  background: var(--accent-hover);
  color: #fff;
}

.rk-cmpbar .rk-tray-clear {
  width: auto;
  margin: 0;
  padding: 2px 4px;
  border: 0;
  background: none;
  color: var(--faint);
  font-size: 11px;
  cursor: pointer;
}

.rk-cmpbar .rk-tray-clear:hover {
  color: var(--accent-ink);
}

/* --- sortable catalog table ------------------------------------------- */
/* A real table: the name is the row header, numbers carry tabular figures,
   and only the current column owns aria-sort. */
/* No scrollport at all: the table always fits the measure, so the sticky
   header can attach to the page scroll just below the primary nav. */
.rk-table-wrap {
  margin-top: 14px;
  max-width: 100%;
  max-height: none;
  overflow: visible;
}

/* No matches: an empty shell with sortable headers would be noise, so the
   table steps aside for the empty message that follows it. */
.rk-table-wrap:not(:has(tbody .rk-row)) {
  display: none;
}

.rk-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12.5px;
}

.rk-th {
  position: sticky;
  top: var(--chx-header-h, 64px);
  z-index: 4;
  padding: 8px;
  border-bottom: 1px solid var(--line-strong);
  background: var(--bg);
  color: var(--faint);
  font-size: 10.5px;
  font-weight: 650;
  letter-spacing: .06em;
  line-height: 1.6;
  text-align: start;
  vertical-align: bottom;
  white-space: normal;
}

/* 11 real columns fill the measure: no horizontal scroll at any width. */
.rk-th-name { width: 22%; }
.rk-th-maker { width: 18%; }
.rk-th-maiden { width: 6%; }
.rk-th-stages { width: 5%; }
.rk-th-length { width: 6%; }
.rk-th-mass { width: 8%; }
.rk-th-leo { width: 8%; }
.rk-th-gto { width: 8%; }
.rk-th-reusable { width: 7%; }
.rk-th-success { width: 7%; }
.rk-th-cmp { width: 5%; }

.rk-table :is(.rk-th-maiden, .rk-th-length, .rk-th-mass, .rk-th-leo, .rk-th-gto, .rk-th-success),
.rk-table :is(.rk-cell-maiden, .rk-cell-length, .rk-cell-mass, .rk-cell-leo, .rk-cell-gto, .rk-cell-success) {
  text-align: end;
}

.rk-th-link {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px;
  padding: 2px 0;
  color: inherit;
  text-decoration: none;
}

.rk-th-link:hover {
  color: var(--accent-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.rk-th-link:focus-visible {
  outline: 2px solid var(--accent-ink);
  outline-offset: 2px;
  border-radius: 3px;
}

.rk-th-link.is-active {
  color: var(--accent-ink);
  font-weight: 750;
}

.rk-th-dir {
  font-size: 9.5px;
  line-height: 1;
}

.rk-row:hover {
  background: var(--hover-tint);
}

.rk-cell {
  padding: 10px 8px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.55;
  text-align: start;
  vertical-align: middle;
}

/* Nothing is pinned horizontally anymore: the name header just shares the
   sticky row with the other headers, and the body cell follows table flow. */
.rk-th-name {
  z-index: 5;
  left: auto;
  background: var(--bg);
}

.rk-cell-name {
  position: static;
  left: auto;
  box-shadow: none;
}

.rk-name-link {
  color: var(--strong);
  font-size: 13.5px;
  font-weight: 620;
  line-height: 1.45;
  text-decoration: none;
  overflow-wrap: anywhere;
}

.rk-name-link:hover {
  color: var(--accent-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.rk-name-link:focus-visible {
  outline: 2px solid var(--accent-ink);
  outline-offset: 2px;
  border-radius: 3px;
}

.rk-name-en {
  display: block;
  color: var(--faint);
  font-size: 10.5px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

/* 名称格：国旗 → 名称 → 状态徽章落在同一行，英文名单独一行；长名称在
   自己的格内换行，国旗和徽章不参与压缩。 */
.rk-name-main {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 6px;
}

.rk-name-main > .rk-name-link {
  flex: 0 1 auto;
  min-width: 0;
}

.rk-name-main > .country-flag,
.rk-name-main > .rk-status {
  flex: 0 0 auto;
  margin-inline-end: 0;
}

.rk-name-main > .country-flag {
  align-self: center;
}

/* 名称与状态共用同一个表头格：两个排序入口之间用一条细线分开。 */
.rk-th-name .rk-th-link + .rk-th-link {
  margin-inline-start: 7px;
  padding-inline-start: 7px;
  border-inline-start: 1px solid var(--line-strong);
}

.rk-cell-link {
  color: var(--muted);
  text-decoration: none;
}

.rk-cell-link:hover {
  color: var(--accent-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.rk-cell-link:focus-visible {
  outline: 2px solid var(--accent-ink);
  outline-offset: 2px;
  border-radius: 3px;
}

.rk-status {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  background: var(--inset);
  color: var(--muted);
  font-size: 11px;
  line-height: 1.6;
  white-space: nowrap;
}

.rk-num {
  font-variant-numeric: tabular-nums;
}

.rk-unit {
  margin-left: 2px;
  color: var(--faint);
  font-size: 10px;
}

.rk-na {
  color: var(--faint);
}

.rk-cmp {
  white-space: nowrap;
}

/* --- 对比：轻量加号图标（详情页文字按钮不受影响） ---------- */
.page-rockets td.rk-cell-cmp .rk-cmp[data-cmp-icon-only] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  max-height: 24px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--muted);
  font-size: 0;
  line-height: 0;
  cursor: pointer;
}

.page-rockets td.rk-cell-cmp .rk-cmp[data-cmp-icon-only]:hover,
.page-rockets td.rk-cell-cmp .rk-cmp[data-cmp-icon-only][aria-pressed="true"],
.page-rockets td.rk-cell-cmp .rk-cmp[data-cmp-icon-only].is-on {
  color: var(--accent);
}

.page-rockets td.rk-cell-cmp .rk-cmp[data-cmp-icon-only]:disabled {
  border: 0;
  background: transparent;
  box-shadow: none;
  color: var(--faint);
  cursor: not-allowed;
  opacity: 1;
}

.page-rockets td.rk-cell-cmp .rk-cmp[data-cmp-icon-only]:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.page-rockets td.rk-cell-cmp .rk-cmp-svg {
  display: block;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* --- narrow screens ---------------------------------------------------- */
@media (max-width: 900px) {
  .page-rockets .rk-body {
    padding-top: 16px;
  }

  .rk-filterbar {
    gap: 10px 20px;
  }
}

/* The table fits every width by hiding lower-priority columns, never by
   scrolling sideways or clipping a scrollport. */

@media (max-width: 740px) {
  /* A tall cropped band would push the type off the photograph; the stack
     keeps a strong vertical scrim instead, so the copy stays readable. */
  .rk-head-photo {
    min-height: 0;
  }

  .rk-head-photo::before {
    background:
      linear-gradient(180deg, rgba(8, 10, 13, .95) 0%, rgba(8, 10, 13, .9) 46%, rgba(8, 10, 13, .96) 100%),
      linear-gradient(90deg, rgba(8, 10, 13, .5) 0%, rgba(8, 10, 13, 0) 72%);
  }

  .rk-head-media-img {
    object-position: 60% 30%;
  }

  .rk-head-photo .rk-intro {
    max-width: none;
  }

  .rk-toolbar {
    padding-top: 10px;
  }
}

@media (max-width: 520px) {
  .rk-filterbar {
    gap: 12px;
    padding: 11px 0 12px;
  }

  .rk-search {
    margin-left: 0;
    width: 100%;
  }

  .rk-search-input {
    flex: 1 1 auto;
    width: auto;
  }

  .rk-fb-group {
    width: 100%;
    gap: 3px;
  }

  .rk-fb-chip {
    font-size: 11.5px;
  }

  .rk-table {
    font-size: 12px;
  }

  .rk-cell {
    padding: 9px 8px;
  }

  .rk-th {
    padding: 7px 8px;
  }
}

@media (forced-colors: active) {
  .rk-fb-chip.is-active,
  .rk-th-link.is-active,
  .rk-status {
    border: 1px solid;
  }

  .rk-table-wrap:focus-visible,
  .rk-name-link:focus-visible,
  .rk-cell-link:focus-visible,
  .rk-th-link:focus-visible,
  .rk-search-input:focus-visible,
  .rk-search-submit:focus-visible,
  .rk-search-clear:focus-visible {
    outline: 2px solid Highlight;
  }

  .rk-th-name,
  .rk-cell-name {
    background: Canvas;
  }
}

@media print {
  .rk-filterbar,
  .rk-search,
  .rk-cmpbar {
    display: none;
  }

  .rk-table-wrap {
    max-height: none;
    overflow: visible;
  }

  /* Print keeps all 11 columns even when a breakpoint hid them on screen. */
  .rk-table {
    table-layout: auto;
  }

  .rk-table :is(thead th, tbody th, tbody td) {
    display: table-cell;
    width: auto;
  }

  .rk-th,
  .rk-th-name,
  .rk-cell-name {
    position: static;
    top: auto;
    left: auto;
    background: none;
    box-shadow: none;
  }
}
/* ── 机构天梯榜 ──────────────────────────────────────────────────────────
   追加在 public/site.css 之后。机构页改为单列榜单：每行一个原生详情链接，
   .ag-grid / .ag-card 仍是页面上既有的钩子，这里只把它们重置为列表行。
   名次来自后端 rank_label；没有该字段时模板不输出 .ag-rank，也就没有名次。 */

.ag-note { margin: 10px 0 0; color: var(--faint); font-size: 10.5px; line-height: 1.5; letter-spacing: .02em; }

/* A facet whose list is empty in this catalog would otherwise print a bare
   heading over blank space; drop the whole section instead. */
.ag-facet:not(:has(a)) { display: none; }

/* 页内搜索：SSR 输出 hidden，只有 JS 接管后才出现。表单没有 action、没有
   name=q，提交永远被阻止，所以输入既不联网也不改 URL。 */
.ag-search { display: flex; align-items: center; gap: 6px; min-width: 0; margin: 0; }
.ag-search[hidden] { display: none; }
.ag-search-input {
  width: clamp(148px, 21vw, 200px);
  min-width: 0;
  min-height: 30px;
  padding: 3px 9px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--surface);
  color: var(--fg);
  font-size: 12.5px;
  font-weight: 400;
  -webkit-appearance: none;
  appearance: none;
}
.ag-search-input::placeholder { color: var(--faint); }
/* 单圈：聚焦时隐藏边框，只留一圈 accent 描边。 */
.ag-search-input:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -1px;
  border-color: transparent;
  box-shadow: none;
}
.ag-search-clear {
  flex: none;
  padding: 0 2px;
  border: 0;
  background: none;
  color: var(--accent);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.6;
  cursor: pointer;
}
.ag-search-clear:hover { text-decoration: underline; }
.ag-search-clear:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
.ag-search-clear[hidden] { display: none; }

/* hidden 的默认 display:none 会被上面的布局规则盖掉，必须显式抬回来。 */
.ag-item[hidden] { display: none; }
.ag-search-empty { margin: 0; padding: 22px 0; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 12.5px; line-height: 1.6; }
.ag-search-empty[hidden] { display: none; }

.ag-grid.ag-board { display: block; margin: 2px 0 0; padding: 0; list-style: none; }

.ag-board .ag-item { min-width: 0; border-bottom: 1px solid var(--line); }

.ag-board .ag-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  padding: 11px 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: inherit;
  text-decoration: none;
}
.ag-board .ag-card:hover { background: var(--hover-tint); color: inherit; }
.ag-board .ag-card:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: -2px; }

.ag-rank {
  flex: none;
  min-width: 2.2ch;
  color: var(--faint);
  font-size: 13px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  line-height: 1.3;
  text-align: end;
}

/* 榜首三行只加一层克制的橙色，不出现奖牌或名次之外的暗示；
   只有后端确认为名次榜时（.is-ranked）才触发。 */
.ag-board.is-ranked[data-page="1"] > .ag-item:nth-child(-n + 3) .ag-rank,
.ag-board.is-ranked[data-page="1"] > .ag-item:nth-child(-n + 3) .ag-total-value { color: var(--accent-ink); }

/* 机构标志是一张真实 CDN 图：给足一个紧凑图片位，contain 保住原构图，
   无图时仍走 initials。 */
.ag-row-mark {
  flex: none;
  display: grid;
  place-items: center;
  width: 64px;
  height: 52px;
  padding: 3px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--zone-soft);
}
.ag-row-mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
.ag-row-initials { padding: 2px; color: var(--muted); font-size: 12px; font-weight: 650; line-height: 1.15; letter-spacing: .02em; text-align: center; overflow-wrap: anywhere; }

.ag-row-body { display: grid; flex: 1 1 auto; gap: 3px; min-width: 0; }
.ag-row-line { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.ag-row-name { margin: 0; color: var(--fg); font-size: 14px; font-weight: 650; line-height: 1.4; letter-spacing: -.005em; overflow-wrap: anywhere; }
.ag-card.ag-row:hover .ag-row-name,
.ag-card.ag-row:focus-visible .ag-row-name { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .15em; }
.ag-row-en { flex: 0 1 auto; min-width: 0; overflow: hidden; color: var(--faint); font-size: 11px; line-height: 1.5; text-overflow: ellipsis; white-space: nowrap; }

.ag-row-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 8px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.ag-row-tags .ag-type { font-size: 10.5px; line-height: 1.6; }
.ag-row-tags .ag-place { font-size: 11px; line-height: 1.5; }
.ag-rate { color: var(--faint); font-variant-numeric: tabular-nums; }

.ag-figures { flex: none; display: grid; justify-items: end; min-width: 4.6rem; }
.ag-total { display: grid; justify-items: end; gap: 0; }
.ag-total-value { color: var(--strong); font-size: 17px; font-weight: 650; line-height: 1.2; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.ag-total-label { color: var(--faint); font-size: 10px; line-height: 1.4; letter-spacing: .02em; }

@media (max-width: 900px) {
  .ag-board .ag-card { gap: 10px; padding: 10px 0; }
  .ag-row-mark { width: 52px; height: 42px; }
}

/* 手机：一行身份 + 一行类型/国家，外文全名与成功率让位给两行紧凑高度。 */
@media (max-width: 640px) {
  .ag-note { margin-top: 8px; font-size: 10px; }
  .ag-board .ag-card { gap: 8px; padding: 9px 0; }
  .ag-rank { min-width: 2ch; font-size: 12px; }
  .ag-row-en,
  .ag-row-tags .ag-rate { display: none; }
  .ag-toolbar-actions { width: 100%; justify-content: space-between; }
  .ag-search { flex: 1 1 100%; }
  .ag-search-input { flex: 1 1 auto; width: auto; }
  .ag-row-mark { width: 44px; height: 38px; }
  .ag-row-initials { font-size: 11px; }
  .ag-row-name { font-size: 13.5px; line-height: 1.35; }
  .ag-row-tags { gap: 2px 6px; font-size: 10.5px; }
  .ag-row-tags .ag-type { padding: 0 5px; font-size: 10px; }
  .ag-row-tags .ag-place { font-size: 10.5px; }
  .ag-figures { min-width: 3.4rem; }
  .ag-total-value { font-size: 15px; }
  .ag-total-label { font-size: 9.5px; }
}

@media (max-width: 370px) {
  .ag-board .ag-card { gap: 6px; }
  .ag-rank { min-width: 1.9ch; font-size: 11px; }
  .ag-row-mark { width: 40px; height: 34px; }
  .ag-row-initials { font-size: 10px; }
  .ag-row-name { font-size: 13px; }
  .ag-figures { min-width: 3.1rem; }
  .ag-total-value { font-size: 14px; }
}

@media (forced-colors: active) {
  .ag-board .ag-card:focus-visible { outline: 2px solid Highlight; outline-offset: -2px; }
  .ag-search-input:focus-visible,
  .ag-search-clear:focus-visible { outline: 2px solid Highlight; }
  .ag-row-mark { border-color: CanvasText; }
}
/* ==========================================================================
   chxv2_web_site · 一级导航吸顶（sticky site header）· 合并片段
   --------------------------------------------------------------------------
   本文件只是追加到 public/site.css 末尾的预览片段，不改动任何已有源文件。

   约束与取向：
   - 只有最外层 .site-header-band 吸顶；layout.html 的所有路由共用这一条通栏。
   - 版心仍是内部 .shell 的 1000px，左右间距不变；导航高度仍是 64 / 56px。
   - 不触碰 .header-nav 链接、aria-current 高亮和主题按钮；也不触碰
     .landing-header .tabs（首页 / 日历 / 新闻的二级栏目导航），它继续留在
     普通文档流里，不吸顶。
   - 纯 CSS：没有滚动监听、没有显隐动画、没有新增依赖；Turbo 替换 body 后
     和 BFCache 恢复时都自动生效。
   - 所有“避开导航”的偏移都派生自 --chx-header-h，以后改导航高度只改一处。
   ========================================================================== */

:root {
  /* 一级导航高度：与 .site-header 的 64 / 56px 保持一致。 */
  --chx-header-h: 64px;
  /* 吸顶元素与导航下缘之间的呼吸位；锚点滚动留白也用它。 */
  --chx-sticky-gap: 8px;
}

@media (max-width: 740px) {
  :root { --chx-header-h: 56px; }
}

/* 通栏背景带：不透明、跟随主题（--bg 由 color-scheme / light-dark 给出明暗），
   正文、Hero 和图片从它下面经过。底线用 inset box-shadow 而不是 border：
   不占盒模型，合并前后导航总高度仍是 64 / 56px，正文不会整体位移 1px；
   颜色仍取既有的 --line 细线，明暗主题自动适配。
   z-index 30：高于正文、Hero、.detail-toc / .rd-compare（10）等固定侧栏，
   低于 .skip-link（100）；原生 dialog 与已打开的 [popover]（日历 .cal-tip）
   位于 top layer，不受这个 z-index 影响，因此不会被导航盖住。 */
.site-header-band {
  position: sticky;
  top: 0;
  z-index: 30;
  background: var(--bg);
  box-shadow: inset 0 -1px 0 var(--line);
}

/* 高度继续由 64 / 56 约束，但只作为最小高度：系统字号或文字缩放放大时，
   导航行可以向下长高而不会被固定高度裁掉；内容、间距与高亮规则都不变。 */
.site-header-band > .site-header {
  height: auto;
  min-height: var(--chx-header-h);
}

/* 锚点、URL #hash、scrollIntoView 与键盘聚焦滚动的统一让位。浏览器会把它
   与目标现有的 scroll-margin-top 相加，所以详情 / 报告 / terms 的章节既
   让开一级导航，也让开移动端 sticky 的 .detail-toc（两层间距）。
   例：详情页 #flight-timeline = 64（导航）+ 8（呼吸位）+ 76（原 scroll-margin）。 */
html {
  scroll-padding-top: calc(var(--chx-header-h) + var(--chx-sticky-gap));
}

/* 二级 sticky 栏从一级导航下缘继续，不再贴着视口顶滑到导航后面。
   这里只改 top：现有 grid / flex 对齐、列宽与 ≤900px 的收起逻辑都不动。 */
.ag-facets,
.rk-rail,
.rd-side,
.rk-filters {
  top: calc(var(--chx-header-h) + 12px);
}

/* 火箭详情资料列原本就比通用 .rd-side 多 4px，保持这个差别。 */
.rd-detail .rd-side {
  top: calc(var(--chx-header-h) + 16px);
}

@media (max-width: 1319px) {
  /* 详情 / 报告 / terms 的移动端章节条：原 top:8px 是相对视口，现在从
     一级导航下缘开始吸顶，既不会压在导航上，也不会被导航盖住。 */
  :is(.page-detail, .page-terms, .page-report) .detail-toc {
    top: calc(var(--chx-header-h) + var(--chx-sticky-gap));
  }
}

@media (forced-colors: active) {
  /* 高对比模式下 box-shadow 通常被强制去掉，改用 1px 边框画出分界；
     同时把内部最小高度减 1px，导航总高度仍维持 64 / 56px。 */
  .site-header-band { border-bottom: 1px solid CanvasText; }
  .site-header-band > .site-header {
    min-height: calc(var(--chx-header-h) - 1px);
  }
}

@media print {
  /* 打印回到普通文档流：不留白、不吸顶、不画背景与细线。 */
  html { scroll-padding-top: 0; }
  .site-header-band {
    position: static;
    background: transparent;
    box-shadow: none;
    border-bottom: 0;
  }
}

/* ==========================================================================
   火箭目录（/rockets）· 追加片段
   --------------------------------------------------------------------------
   - Hero 留在 1000px 版心内，顶部让出吸顶一级导航的呼吸位；
   - 搜索在全部筛选之上，本身也是默认折叠的原生 details；状态 / 复用 / LEO
     一行一个字段，chip 仍横向排列；
   - 机构与国家各一个可搜索的原生 details 下拉：JS 关闭时输入框 hidden，
     面板里的原生链接照常可用，“全部机构 / 全部国家” 用 *_clear_href 且始终
     存在（演示库没有面时也不会只剩一个空标题）；多选选中态只是装饰伪元素，
     真实交互仍是带 href 的链接；
   - 对比沿用火箭详情的固定右侧浮条：≥1280px 是 1000px 版心外的 116px 卡片，
     窄屏是 24px 竖向标签，展开时 tray 向左浮出，页面正文不额外让出侧栏；
   - 表格只增列：全部值来自既有 Item 字段，缺失一律 em dash。
   ========================================================================== */

/* --- 搜索：常显，留在普通流，靠右对齐 ------------------------------- */
/* form 不再是浮层：input 桌面封顶 208px，≤520px 时交给 .rk-search 的
   现成规则占满余宽；GET 的 hidden 字段与 q 值照旧提交。 */
.page-rockets .rk-searchbar {
  display: flex;
  justify-content: flex-end;
  padding: 12px 0 10px;
}

.page-rockets .rk-searchbar .rk-search {
  margin: 0;
}

.page-rockets .rk-toolbar {
  flex-direction: column;
  align-items: flex-start;
  padding: 12px 0 10px;
  border-bottom: 1px solid var(--line);
}

/* --- 筛选：默认折叠，展开后单列一行一个字段 --------------------------- */
/* 折叠条只包筛选，不碰上面的搜索框。全局 .rk-filters 是给别的页面用的
   卡片 + overflow:hidden，这里改回普通流，绝对定位的 picker 面板才不被裁。
   z-index 6 让浮层在表头（4/5）之上，但仍低于一级导航 30。 */
.page-rockets .rk-filters {
  position: relative;
  top: auto;
  z-index: 6;
  display: block;
  min-width: 0;
  border: 0;
  border-block: 1px solid var(--line);
  border-radius: 0;
  background: none;
  overflow: visible;
}

.page-rockets .rk-filters-summary {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  min-height: 28px;
  margin: 9px 0;
  padding: 3px 12px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--surface);
  color: var(--muted);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.7;
  cursor: pointer;
  list-style: none;
}

.page-rockets .rk-filters-summary::-webkit-details-marker { display: none; }
.page-rockets .rk-filters-summary::marker { content: ""; }

.page-rockets .rk-filters-summary::after {
  content: "";
  flex: none;
  width: 6px;
  height: 6px;
  margin-block-end: 2px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
}

.page-rockets .rk-filters[open] > .rk-filters-summary {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.page-rockets .rk-filters[open] > .rk-filters-summary::after {
  margin-block-end: 0;
  margin-block-start: 2px;
  transform: rotate(225deg);
}

.page-rockets .rk-filters-summary:hover {
  border-color: var(--accent);
  color: var(--fg);
}

.page-rockets .rk-filters[open] > .rk-filters-summary:hover { color: var(--accent); }

.page-rockets .rk-filters-summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.page-rockets .rk-filterbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  padding: 0 0 4px;
  border: 0;
  min-width: 0;
}

.page-rockets .rk-fb-row {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  align-items: baseline;
  gap: 4px 12px;
  padding: 9px 0;
  min-width: 0;
}

.page-rockets .rk-fb-row + .rk-fb-row {
  border-top: 1px solid var(--line);
}

/* 状态 / 复用 / LEO / 机构 / 国家各占一整行，机构与国家不再并排。
   一个字段连一个选项都没有时不留下空标题。 */
.page-rockets .rk-fb-row:not(:has(.rk-fb-chip, .rk-fb-picker)) {
  display: none;
}

.page-rockets .rk-fb-row > .rk-fb-label {
  margin: 0;
  padding-block: 3px;
  color: var(--faint);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .1em;
  line-height: 1.6;
}

.page-rockets .rk-fb-row .rk-fb-opts {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 4px;
  margin: 0;
  padding: 0;
  list-style: none;
  min-width: 0;
}

/* --- 机构 / 国家：可搜索的原生 details 下拉 --------------------------- */
/* 一行 = 固定入口按钮在左 + 已选标签在右。标签是 details 的兄弟节点，
   不在 summary 里，所以删标签不会误触发开合。面板是浮层：锚点是整条
   rk-fb-line（position:relative），相对它的 100% 高度展开，因此不占用
   新高度、不撑高页面，也不会盖住右侧多行的已选 chips。 */
.page-rockets .rk-fb-line {
  position: relative;
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 4px 8px;
  min-width: 0;
}

/* 选中的容器/面板定位让给 rk-fb-line，picker 自身不建立定位上下文。 */
.page-rockets .rk-fb-picker {
  position: static;
  flex: 0 0 auto;
  width: auto;
  min-width: 0;
  max-width: 100%;
}

.page-rockets .rk-fb-picker > summary {
  display: inline-flex;
  align-items: center;
  width: max-content;
  max-width: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--fg);
  font-size: 12px;
  line-height: 1.7;
  cursor: pointer;
  list-style: none;
}

.page-rockets .rk-fb-picker > summary::-webkit-details-marker { display: none; }
.page-rockets .rk-fb-picker > summary::marker { content: ""; }

/* 真正被看见的紧凑按钮：入口文字固定为“选择机构 / 选择国家”。 */
.page-rockets .rk-fb-picker-trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  max-width: 100%;
  padding: 2px 10px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--surface);
  color: var(--fg);
  font-weight: 400;
  line-height: 1.7;
}

.page-rockets .rk-fb-picker-value {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.page-rockets .rk-fb-picker-trigger::after {
  content: "";
  flex: none;
  width: 0;
  height: 0;
  margin-inline-start: 2px;
  border-inline: 3.5px solid transparent;
  border-top: 5px solid currentColor;
  opacity: .65;
  transition: transform .12s ease;
}

.page-rockets .rk-fb-picker[open] > summary .rk-fb-picker-trigger {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.page-rockets .rk-fb-picker[open] > summary .rk-fb-picker-trigger::after {
  transform: rotate(180deg);
}

.page-rockets .rk-fb-picker > summary:hover .rk-fb-picker-trigger { border-color: var(--accent); }

.page-rockets .rk-fb-picker > summary:focus-visible { outline: none; }

.page-rockets .rk-fb-picker > summary:focus-visible .rk-fb-picker-trigger {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* --- 已选值：按钮右侧的独立可删标签 -------------------------------- */
.page-rockets .rk-fb-selected {
  display: flex;
  flex: 1 1 0;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  margin-inline-start: 0;
  padding: 0;
}

.page-rockets .rk-fb-selected:empty { display: none; }

.page-rockets .rk-fb-selected-chip {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  max-width: 100%;
  padding: 1px 3px 1px 8px;
  border: 1px solid var(--accent);
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11.5px;
  font-weight: 400;
  line-height: 1.7;
}

.page-rockets .rk-fb-selected-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.page-rockets .rk-fb-selected-x {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  color: var(--accent);
  font-size: 13px;
  line-height: 1;
  text-decoration: none;
}

.page-rockets .rk-fb-selected-x:hover { background: var(--chip-hover); color: var(--accent-ink); }

.page-rockets .rk-fb-selected-x:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

/* 面板是悬浮在整条 rk-fb-line 下方的浮层，不占新高度；不加 display，
   收起时仍由原生 details 隐藏。max-width 用 viewport 上限，避免被窄按钮压窄。 */
.page-rockets .rk-fb-picker-panel {
  position: absolute;
  left: 0;
  right: auto;
  top: calc(100% + 6px);
  z-index: 25;
  width: 240px;
  max-width: calc(100vw - 48px);
  max-height: min(58vh, 400px);
  overflow: auto;
  overscroll-behavior: contain;
  margin-top: 0;
  padding: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: var(--surface);
}

.page-rockets .rk-fb-picker-search {
  width: 100%;
  min-height: 30px;
  padding: 3px 8px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--bg);
  color: var(--fg);
  font-size: 12px;
}

.page-rockets .rk-fb-picker-search:focus-visible {
  outline: 2px solid var(--accent-ink);
  outline-offset: 1px;
}

.page-rockets .rk-fb-picker-all {
  display: flex;
  align-items: center;
  min-height: 28px;
  margin-top: 6px;
  padding: 3px 7px;
  border-radius: 6px;
  color: var(--accent);
  font-size: 12px;
  text-decoration: none;
}

.page-rockets .rk-fb-picker-all:hover { background: var(--chip-hover); }

.page-rockets .rk-fb-picker-opts {
  display: grid;
  gap: 1px;
  margin: 2px 0 0;
  padding: 0;
  list-style: none;
}

.page-rockets .rk-fb-picker-opts:not(:has(> li)) { display: none; }

.page-rockets .rk-fb-picker-more {
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px solid var(--line);
}

.page-rockets .rk-fb-picker-opt {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  gap: 7px;
  padding: 4px 7px;
  border-radius: 6px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
  text-decoration: none;
  overflow-wrap: anywhere;
}

.page-rockets .rk-fb-picker-opt:hover { background: var(--chip-hover); color: var(--fg); }

.page-rockets .rk-fb-picker-opt.is-active {
  background: var(--accent-soft);
  color: var(--accent);
}

.page-rockets .rk-fb-picker-opt:focus-visible {
  outline: 2px solid var(--accent-ink);
  outline-offset: -2px;
}

/* 国家 / 机构选项与 LEO chip 的选中记号：只画一个装饰伪元素，真实交互仍
   是带 href 的链接，所以不需要 role=checkbox，也就不需要 Space 键支持。 */
.page-rockets .rk-fb-row-payload .rk-fb-chip::before,
.page-rockets .rk-fb-picker-opt::before {
  content: "";
  display: inline-flex;
  flex: none;
  align-self: center;
  align-items: center;
  justify-content: center;
  width: 11px;
  height: 11px;
  border: 1px solid var(--line-strong);
  border-radius: 3px;
  background: var(--bg);
  color: var(--surface);
  font-size: 8px;
  font-weight: 700;
  line-height: 1;
}

.page-rockets .rk-fb-row-payload .rk-fb-chip.is-active::before,
.page-rockets .rk-fb-picker-opt.is-active::before {
  content: "✓";
  border-color: var(--accent);
  background: var(--accent);
}

.page-rockets .rk-fb-picker-opt .rk-fb-count {
  margin-inline-start: auto;
}

.page-rockets .rk-fb-picker-opt.is-active .rk-fb-count {
  color: var(--accent);
  opacity: .75;
}

/* 国家下拉沿用页面既有的旗帜字体契约（.rk-fb-chip 已是同一字体），只作用于
   国家 scope 的 summary 与选项，不污染搜索输入框。 */
.page-rockets .rk-fb-picker[data-filter-type="country"] > summary,
.page-rockets .rk-fb-picker[data-filter-type="country"] .rk-fb-picker-opt {
  font-family: "CHX Flag Emoji", var(--text);
}

/* 已选国家标签在 details 之外，需单独继承旗帜字体；只作用于标签文字。 */
.page-rockets .rk-fb-picker[data-filter-type="country"] + .rk-fb-selected .rk-fb-selected-label {
  font-family: "CHX Flag Emoji", var(--text);
}

.page-rockets .rk-fb-picker-empty {
  margin: 6px 0 0;
  padding: 4px 7px;
  color: var(--faint);
  font-size: 11.5px;
  line-height: 1.6;
}

/* --- 对比：单一浮卡 ----------------------------------------------------- */
/* 关闭时是贴视口右缘的 24px 竖向入口；展开时 details 自己就是唯一的卡片，
   旧的 116px 外框、绝对定位的第二层 tray 都不再存在。 */
.page-rockets .rk-cmprail {
  position: fixed;
  top: calc(var(--chx-header-h) + var(--chx-sticky-gap) + 18px);
  right: 0;
  z-index: 20;
  display: grid;
  justify-items: end;
}

/* 未选任何火箭时整块隐藏：hidden 优先级高于基态 display:grid 与 [open]，
   折叠入口也不显示；JS 根据已选列表长度更新 hidden。 */
.page-rockets .rk-cmprail[hidden] { display: none; }

.page-rockets .rk-cmprail > summary {
  display: block;
  width: 24px;
  padding: 12px 5px;
  border: 1px solid var(--line);
  border-inline-end: 0;
  border-radius: 8px 0 0 8px;
  background: var(--surface);
  color: var(--muted);
  font-size: 12px;
  line-height: 1.3;
  letter-spacing: .12em;
  writing-mode: vertical-rl;
  text-orientation: upright;
  white-space: nowrap;
  cursor: pointer;
  list-style: none;
}

.page-rockets .rk-cmprail > summary::-webkit-details-marker { display: none; }
.page-rockets .rk-cmprail > summary::marker { content: ""; }
.page-rockets .rk-cmprail > summary:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: -2px; }

/* 展开态：视口内有界的一张卡，最多 320px，左右各留 14px，不产生横溢。 */
.page-rockets .rk-cmprail[open] {
  right: 14px;
  justify-items: stretch;
  width: min(320px, calc(100% - 28px));
  max-height: calc(100vh - var(--chx-header-h) - 40px);
  max-height: calc(100dvh - var(--chx-header-h) - 40px);
  overflow: auto;
  overscroll-behavior: contain;
  padding: 12px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--surface);
  box-shadow: 0 10px 28px -6px rgba(0, 0, 0, .28);
}

/* 展开后 summary 融进卡片右上角，只当收起符号：无边框、无独立底色，
   仍保留 24px 可点面积、键盘焦点轮廓和原有的可访问名称。 */
.page-rockets .rk-cmprail[open] > summary {
  position: absolute;
  top: 6px;
  right: 8px;
  display: grid;
  place-items: center;
  width: 24px;
  min-height: 24px;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: none;
  color: var(--muted);
  font-size: 0;
  line-height: 1;
  letter-spacing: 0;
  writing-mode: horizontal-tb;
  text-orientation: mixed;
}

.page-rockets .rk-cmprail[open] > summary::after {
  content: "×";
  font-size: 16px;
  line-height: 1;
  letter-spacing: 0;
}

.page-rockets .rk-cmprail[open] > summary:hover { color: var(--accent-ink); background: var(--accent-soft); }

/* 卡片内部只有一层：tray 回到普通流，不再自带边框/阴影/内边距。 */
.page-rockets .rk-cmprail > .rk-tray {
  position: static;
  width: auto;
  max-height: none;
  overflow: visible;
  transform: none;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}

/* 标签盖住的 7px / 10px 正文用内边距让开，和火箭详情同一策略。 */
@media (max-width: 740px) {
  main.shell:has(> .rk-cmprail) { padding-inline-end: 8px; }
}

@media (max-width: 370px) {
  main.shell:has(> .rk-cmprail) { padding-inline-end: 12px; }
}

/* tray 的内容由对比脚本重建，这里只统一它的排版，不改结构。 */
.page-rockets .rk-cmprail .rk-tray-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  padding-inline-end: 20px;
}

.page-rockets .rk-cmprail .rk-tray-head :is(.rk-tray-title, h2, h3) {
  margin: 0;
  font-size: 12px;
  font-weight: 650;
}

.page-rockets .rk-cmprail .rk-tray-count {
  margin-left: 5px;
  color: var(--accent-ink);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.page-rockets .rk-cmprail .rk-tray-hint { color: var(--faint); font-size: 10px; }
.page-rockets .rk-cmprail .rk-tray-empty { margin: 8px 0 0; color: var(--muted); font-size: 11px; line-height: 1.7; }
.page-rockets .rk-cmprail .rk-tray-list { display: grid; gap: 2px; margin: 8px 0; padding: 0; list-style: none; }
.page-rockets .rk-cmprail .rk-tray-list li { display: flex; align-items: center; justify-content: space-between; gap: 6px; font-size: 11.5px; }
/* 常规型号名单行；只有极长名字才省略号（模板已给 title 保留全称），
   删除按钮 flex:none 始终可见，手机也不溢出。 */
.page-rockets .rk-cmprail .rk-tray-name { flex: 1 1 auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.page-rockets .rk-cmprail .rk-tray-remove {
  flex: none;
  padding: 1px 4px;
  border: 0;
  background: none;
  color: var(--faint);
  font-size: 13px;
  line-height: 1.2;
  cursor: pointer;
}

.page-rockets .rk-cmprail .rk-tray-remove:hover { color: var(--accent-ink); }

.page-rockets .rk-cmprail .rk-tray-go {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  margin-top: 8px;
  border-radius: 6px;
  background: var(--accent);
  color: #fff;
  font-size: 11.5px;
  text-decoration: none;
}

.page-rockets .rk-cmprail .rk-tray-go:hover { background: var(--accent-hover); color: #fff; }

.page-rockets .rk-cmprail .rk-tray-clear {
  width: 100%;
  margin-top: 6px;
  padding: 2px 0;
  border: 0;
  background: none;
  color: var(--faint);
  font-size: 11px;
  cursor: pointer;
}

.page-rockets .rk-cmprail .rk-tray-clear:hover { color: var(--accent-ink); }

/* --- 宽屏：唯一展开卡片固定右缘，宽度只吃版心外的空白 ----------------- */
/* 正文仍是 1000px 居中；卡片左缘 = 100vw - 14(右距) - 14(间隔) - 宽度，
   宽度上限取 calc((100% - 1000px)/2 - 28px)，因此永不越过 main.shell
   的右缘（1440 约 192px，1920 可满 300px）。 */
@media (min-width: 1280px) {
  /* 关闭态仍是贴边的入口，只有展开时才占右侧空白。 */
  .page-rockets .rk-cmprail:not([open]) {
    top: 50%;
    transform: translateY(-50%);
  }

  .page-rockets .rk-cmprail[open] {
    top: 50%;
    right: 14px;
    transform: translateY(-50%);
    width: min(300px, calc((100% - 1000px) / 2 - 28px));
    max-height: calc(100vh - var(--chx-header-h) - 48px);
    max-height: calc(100dvh - var(--chx-header-h) - 48px);
    padding: 12px 14px;
  }

  .page-rockets .rk-cmprail .rk-tray-head { flex-wrap: wrap; gap: 2px 6px; }
  .page-rockets .rk-cmprail .rk-tray-empty { font-size: 10.5px; line-height: 1.65; }
  .page-rockets .rk-cmprail .rk-tray-list li { font-size: 11px; }
}

/* --- 表格：11 列全部排入版心，不用滚动条 ---------------------------- */
/* 前部的 11 列百分比宽与 .rk-table/table-layout:fixed 在这里生效；本段只做
   屏幕响应式的列裁剪与重新配比，不再写 min-width 或固定像素宽。 */
.page-rockets .rk-table {
  min-width: 0;
  table-layout: fixed;
}

.page-rockets .rk-th-name,
.page-rockets .rk-cell-name {
  width: 22%;
  min-width: 0;
}

.page-rockets .rk-th-maker { width: 18%; }
.page-rockets .rk-th-maiden { width: 6%; }
.page-rockets .rk-th-stages { width: 5%; }
.page-rockets .rk-th-length { width: 6%; }
.page-rockets .rk-th-mass { width: 8%; }
.page-rockets .rk-th-leo { width: 8%; }
.page-rockets .rk-th-gto { width: 8%; }
.page-rockets .rk-th-reusable { width: 7%; }
.page-rockets .rk-th-success { width: 7%; }
.page-rockets .rk-th-cmp { width: 5%; }

.page-rockets .rk-table :is(.rk-th-maiden, .rk-th-length, .rk-th-mass, .rk-th-leo, .rk-th-gto, .rk-th-success),
.page-rockets .rk-table :is(.rk-cell-maiden, .rk-cell-length, .rk-cell-mass, .rk-cell-leo, .rk-cell-gto, .rk-cell-success) {
  text-align: end;
}

@media screen and (max-width: 1100px) {
  .page-rockets .rk-table :is(.rk-th-stages, .rk-cell-stages, .rk-th-reusable, .rk-cell-reusable) {
    display: none;
  }

  .page-rockets .rk-th-name,
  .page-rockets .rk-cell-name { width: 25%; }
  .page-rockets .rk-th-maker { width: 20%; }
  .page-rockets .rk-th-maiden { width: 7%; }
  .page-rockets .rk-th-length { width: 7%; }
  .page-rockets .rk-th-mass { width: 9%; }
  .page-rockets .rk-th-leo { width: 10%; }
  .page-rockets .rk-th-gto { width: 9%; }
  .page-rockets .rk-th-success { width: 8%; }
  .page-rockets .rk-th-cmp { width: 5%; }
}

@media screen and (max-width: 920px) {
  .page-rockets .rk-table :is(.rk-th-mass, .rk-cell-mass, .rk-th-gto, .rk-cell-gto) {
    display: none;
  }

  .page-rockets .rk-th-name,
  .page-rockets .rk-cell-name { width: 28%; }
  .page-rockets .rk-th-maker { width: 24%; }
  .page-rockets .rk-th-maiden { width: 8%; }
  .page-rockets .rk-th-length { width: 8%; }
  .page-rockets .rk-th-leo { width: 12%; }
  .page-rockets .rk-th-success { width: 12%; }
  .page-rockets .rk-th-cmp { width: 8%; }
}

@media screen and (max-width: 740px) {
  .page-rockets .rk-table :is(.rk-th-length, .rk-cell-length, .rk-th-success, .rk-cell-success) {
    display: none;
  }

  .page-rockets .rk-th-name,
  .page-rockets .rk-cell-name { width: 37%; }
  .page-rockets .rk-th-maker { width: 27%; }
  .page-rockets .rk-th-maiden { width: 12%; }
  .page-rockets .rk-th-leo { width: 16%; }
  .page-rockets .rk-th-cmp { width: 8%; }
}

@media screen and (max-width: 640px) {
  .page-rockets .rk-table :is(.rk-th-maker, .rk-cell-maker, .rk-th-maiden, .rk-cell-maiden) {
    display: none;
  }

  .page-rockets .rk-table :is(.rk-th, .rk-cell) {
    padding-inline: 4px;
  }

  .page-rockets .rk-th-name,
  .page-rockets .rk-cell-name { width: calc(100% - 110px); }
  .page-rockets .rk-th-leo { width: 64px; }
  .page-rockets .rk-th-cmp { width: 46px; }
}

@media (max-width: 600px) {
  .page-rockets .rk-fb-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
    padding: 10px 0;
  }

  /* 窄屏：入口固定在左，已选标签占据剩余宽度，只在自身容器内换行/省略，
     不再整块掉到下拉底部。面板仍是相对整行的浮层，不撑高页面。 */
  .page-rockets .rk-fb-picker {
    max-width: 100%;
  }

  .page-rockets .rk-fb-picker-panel {
    width: 190px;
    max-width: calc(100vw - 48px);
    max-height: min(50vh, 360px);
    margin-top: 0;
  }

  .page-rockets .rk-table { font-size: 12px; }
}

/* 高对比模式下把入口、已选标签与面板的 1px 细线画出来。 */
@media (forced-colors: active) {
  .page-rockets .rk-filters-summary,
  .page-rockets .rk-fb-picker-trigger,
  .page-rockets .rk-fb-selected-chip,
  .page-rockets .rk-fb-picker-panel,
  .page-rockets .rk-search,
  .page-rockets .rk-cmprail > summary {
    border: 1px solid CanvasText;
  }

  /* 展开时只有一张卡：外框由 details 画出，内部 tray 不叠第二层边框。 */
  .page-rockets .rk-cmprail[open] { border: 1px solid CanvasText; }
  .page-rockets .rk-cmprail[open] > .rk-tray { border: 0; }

  .page-rockets .rk-fb-picker-opt.is-active,
  .page-rockets .rk-fb-picker-all { border: 1px solid; }

  .page-rockets .rk-fb-row-payload .rk-fb-chip:not(.is-active)::before,
  .page-rockets .rk-fb-picker-opt:not(.is-active)::before { border: 1px solid CanvasText; }
  .page-rockets .rk-fb-row-payload .rk-fb-chip.is-active::before,
  .page-rockets .rk-fb-picker-opt.is-active::before { border-color: Highlight; background: Highlight; color: HighlightText; }
}

@media print {
  .page-rockets .rk-searchbar,
  .page-rockets .rk-cmprail { display: none; }

  .page-rockets .rk-fb-picker-panel { position: static; max-height: none; border: 0; padding: 0; }
}

/* 打印：响应式隐藏列和旧全局表格规则都必须在纸面上让位，11 列全部回归
   静态布局。追加在文件末尾，特异性足以盖过上面的 screen 分支。 */
@media print {
  .page-rockets .rk-table {
    table-layout: auto;
    min-width: 0;
    width: 100%;
  }

  .page-rockets .rk-table :is(thead th, tbody th, tbody td) {
    display: table-cell;
    width: auto;
    min-width: 0;
    position: static;
    inset: auto;
    background: none;
    box-shadow: none;
    white-space: normal;
  }

  .page-rockets .rk-table .rk-th {
    position: static;
    top: auto;
  }
}

/* ==========================================================================
   火箭目录（/rockets）· 联合排序、分页与列表锚点
   --------------------------------------------------------------------------
   追加在文件末尾，覆盖上面的 page-scope 与旧 media 分支。
   - 列头只输出主排序的 aria-sort；active 列头额外给一个极小的优先级数字。
   - 工具栏用轻量排序顺序 chip 表达“先按什么、再按什么”，点列头依次叠加。
   - 分页是普通 SSR 链接：上一页 / 页码（含省略号）/ 下一页 + 每页数量。
   ========================================================================== */

/* 锚点：分页和每页数量链接自带 #rocket-list，滚回来时让开吸顶导航。 */
.page-rockets #rocket-list {
  scroll-margin-top: calc(var(--chx-header-h, 64px) + var(--chx-sticky-gap, 8px) + 8px);
}

/* --- 排序顺序 chips --------------------------------------------------- */
.page-rockets .rk-sortbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
  min-width: 0;
  max-width: 100%;
}

.page-rockets .rk-sortbar-hint {
  margin: 0;
  color: var(--faint);
  font-size: 10.5px;
  line-height: 1.6;
}

.page-rockets .rk-sort-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  min-width: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-rockets .rk-sort-chips:not(:has(.rk-sort-chip)) { display: none; }

.page-rockets .rk-sort-chip {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 26px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--surface);
}

.page-rockets .rk-sort-chip-main {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  padding: 2px 4px 2px 7px;
  border-radius: 999px 0 0 999px;
  color: var(--accent);
  font-size: 11.5px;
  font-weight: 400;
  line-height: 1.7;
  text-decoration: none;
}

.page-rockets .rk-sort-chip-main:hover { background: var(--chip-hover); color: var(--accent-ink); }

.page-rockets .rk-sort-chip-main:focus-visible,
.page-rockets .rk-sort-chip-x:focus-visible,
.page-rockets .rk-sort-reset:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

.page-rockets .rk-sort-chip-prio {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 13px;
  height: 13px;
  border-radius: 50%;
  background: var(--accent);
  color: var(--surface);
  font-size: 8.5px;
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.page-rockets .rk-sort-chip-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.page-rockets .rk-sort-chip-dir {
  flex: none;
  font-size: 9.5px;
  line-height: 1;
}

.page-rockets .rk-sort-chip-x {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  margin-inline-end: 2px;
  border-radius: 50%;
  color: var(--faint);
  font-size: 13px;
  line-height: 1;
  text-decoration: none;
}

.page-rockets .rk-sort-chip-x:hover { background: var(--chip-hover); color: var(--accent-ink); }

.page-rockets .rk-sort-reset {
  color: var(--faint);
  font-size: 10.5px;
  line-height: 1.6;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-rockets .rk-sort-reset:hover { color: var(--accent-ink); }

.page-rockets .rk-sortbar:not(:has(.rk-sort-chip)) .rk-sort-reset { display: none; }

/* --- 列头优先级小标记（只在 active 列出现） -------------------------- */
.page-rockets .rk-th-prio {
  flex: none;
  align-self: center;
  min-width: 11px;
  padding: 0 1px;
  border-radius: 3px;
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: 8.5px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

/* --- 分页：页码与每页数量 -------------------------------------------- */
.page-rockets .rk-pages {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
  margin-top: 18px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.page-rockets .rk-pages-pager {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px 4px;
  min-width: 0;
}

.page-rockets .rk-pages-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
  margin-inline-start: auto;
  min-width: 0;
}

.page-rockets .rk-page-range {
  margin: 0;
  color: var(--faint);
  font-size: 10.5px;
  line-height: 1.6;
  font-variant-numeric: tabular-nums;
}

.page-rockets .rk-page-sizes {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-rockets .rk-page-size {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  min-height: 32px;
  padding: 2px 6px;
  border-radius: 6px;
  color: var(--faint);
  font-size: 11.5px;
  line-height: 1.5;
  text-decoration: none;
  font-variant-numeric: tabular-nums;
}

.page-rockets .rk-page-size:hover { background: var(--chip-hover); color: var(--fg); }

.page-rockets .rk-page-size.is-active {
  background: var(--accent-soft);
  color: var(--accent);
}

.page-rockets .rk-page-size:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

.page-rockets .rk-page-gap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  min-height: 32px;
  color: var(--faint);
  font-size: 11.5px;
  line-height: 1;
}

@media (max-width: 600px) {
  .page-rockets .rk-sortbar {
    width: 100%;
  }

  .page-rockets .rk-pages {
    justify-content: center;
    gap: 8px;
  }

  .page-rockets .rk-pages-meta {
    margin-inline-start: 0;
    justify-content: center;
  }
}

@media (forced-colors: active) {
  .page-rockets .rk-sort-chip,
  .page-rockets .rk-fb-selected-chip,
  .page-rockets .rk-page-size.is-active {
    border: 1px solid;
  }

  .page-rockets .rk-sort-chip-main:focus-visible,
  .page-rockets .rk-sort-chip-x:focus-visible,
  .page-rockets .rk-sort-reset:focus-visible,
  .page-rockets .rk-fb-selected-x:focus-visible,
  .page-rockets .rk-fb-picker > summary:focus-visible .rk-fb-picker-trigger,
  .page-rockets .rk-page-size:focus-visible {
    outline: 2px solid Highlight;
  }
}

@media print {
  .page-rockets .rk-sortbar,
  .page-rockets .rk-pages { display: none; }
}