/* ============================================================
   pacenote · /series/{slug}/{year} — season filing strip and
   round calendar. Traversal state; user spends seconds here.
   ============================================================ */

/* ── Breadcrumb (shared shape with series-hub) ── */
.crumbs {
  display: flex; align-items: center; gap: var(--space-2);
  font: 600 var(--t-label)/1 var(--sans);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-bottom: var(--space-4);
}
.crumbs .sep { color: var(--hairline-2); }
.crumbs .here { color: var(--ink); }

/* ── Filing strip ── */
.filing-strip {
  display: flex; align-items: baseline; flex-wrap: wrap;
  gap: var(--space-5);
  padding: var(--space-3) 0;
  border-top: 2px solid var(--rule);
  border-bottom: 1px solid var(--rule-soft);
  margin-bottom: var(--space-6);
}
.filing-strip h1 {
  margin: 0;
  flex: 1 1 auto;
  font-family: var(--display);
  font-weight: 700;
  font-size: clamp(28px, 3.2vw, 36px);
  line-height: 1;
  color: var(--ink);
}
.filing-strip .pair {
  display: flex; gap: var(--space-2); align-items: baseline;
}
.filing-strip .k {
  font: 600 var(--t-label)/1 var(--sans);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--ink-mute);
}
.filing-strip .actions { display: flex; align-items: center; }
.filing-strip .investigate {
  display: inline-flex; align-items: center; gap: var(--space-2);
  background: var(--stamp); color: var(--paper);
  padding: 10px 16px;
  font: 600 var(--t-ui)/1 var(--sans);
  letter-spacing: 0.02em;
}
.filing-strip .investigate:hover { background: var(--stamp-deep); }
.filing-strip .investigate .arrow { font-family: var(--mono); }
.filing-strip .v {
  font-family: var(--mono);
  font-weight: 500;
  font-size: var(--t-meta);
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}

/* ── Calendar header ── */
.cal-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}
.cal-head .stamp {
  font: 600 var(--t-label)/1 var(--sans);
  letter-spacing: var(--tracking-mark);
  text-transform: uppercase;
  color: var(--ink-mute);
}

/* ── Round calendar table ── */
.rounds-table {
  width: 100%;
  border-collapse: collapse;
  border-top: 2px solid var(--rule);
}
.rounds-table th,
.rounds-table td {
  padding: var(--space-3);
  border-bottom: 1px solid var(--hairline);
  text-align: left;
  vertical-align: middle;
}
.rounds-table th {
  font: 600 var(--t-label)/1 var(--sans);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--ink-mute);
}
.rounds-table tr.complete:hover,
.rounds-table tr.upcoming:hover,
.rounds-table tr.next:hover { background: var(--paper-deep); }
.rounds-table tr.next { background: var(--paper-stamp); }
.rounds-table tr.cancelled { opacity: 0.45; }
.rounds-table tr.cancelled .r-num,
.rounds-table tr.cancelled .r-flag { opacity: 0.6; }

.rounds-table .r-num {
  width: 64px;
  font-family: var(--mono);
  font-size: 15px;
  font-variant-numeric: tabular-nums;
  color: var(--ink);
}
.rounds-table .r-flag { width: 32px; font-size: 18px; }
.rounds-table .r-gp { font-family: var(--display); font-weight: 600; font-size: 17px; color: var(--ink); }
.rounds-table .r-gp a { color: inherit; }
.rounds-table .r-gp a:hover { color: var(--stamp); }
.rounds-table .r-gp .name-cancelled { text-decoration: line-through; color: var(--ink-mute); }
.rounds-table .r-gp .circuit {
  display: block;
  font: 500 var(--t-meta)/1 var(--sans);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-top: 2px;
}
.rounds-table .r-date {
  width: 150px;
  font-family: var(--mono);
  font-size: var(--t-meta);
  color: var(--ink-soft);
  font-variant-numeric: tabular-nums;
}
.rounds-table .r-winner { width: 220px; }
.rounds-table .r-winner .bar {
  display: inline-block;
  width: 4px; height: 18px;
  vertical-align: -4px;
  margin-right: 10px;
  background: var(--ink-mute);
}
.rounds-table .r-winner .name {
  font-family: var(--display);
  font-size: 15px;
  color: var(--ink);
}
.rounds-table .r-winner .upcoming-note {
  font-family: var(--body);
  font-style: italic;
  font-size: var(--t-meta);
  color: var(--ink-mute);
}
.rounds-table .r-status { width: 130px; text-align: right; }

/* ── Status badges ── */
.badge {
  display: inline-block;
  font: 600 var(--t-label)/1 var(--sans);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  padding: 4px 10px;
}
.badge.complete { color: var(--positive); background: var(--paper-deep); }
.badge.upcoming { color: var(--ink-mute); background: var(--paper-deep); }
.badge.cancelled { color: var(--ink-mute); background: var(--paper-deep); }
.badge.next { color: var(--stamp); border: 1px solid var(--stamp); background: var(--paper); }

.empty {
  font-family: var(--body);
  font-style: italic;
  color: var(--ink-mute);
  padding: var(--space-6) 0;
}

/* ── Responsive ── */
@media (max-width: 1023px) {
  .filing-strip h1 { flex-basis: 100%; font-size: 26px; }
}
@media (max-width: 767px) {
  .cal-head { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
  .rounds-table .r-flag,
  .rounds-table .r-date,
  .rounds-table .r-winner,
  .rounds-table thead th:nth-child(2),
  .rounds-table thead th:nth-child(4),
  .rounds-table thead th:nth-child(5) { display: none; }
  .rounds-table .r-num { width: 56px; }
  .rounds-table .r-gp { font-size: 15px; }
}
