:root {
        color-scheme: dark;
        --bg: #090b0f;
        --panel: #10141b;
        --panel-2: #151a23;
        --ink: #f5f0e8;
        --muted: #aab1bd;
        --line: #2a3140;
        --teal: #54d6c7;
        --rose: #ff7aa8;
        --sky: #7dd3fc;
        --gold: #f3c969;
      }

      * { box-sizing: border-box; }

      html { scroll-behavior: smooth; }

      body {
        margin: 0;
        min-height: 100vh;
        background:
          linear-gradient(118deg, rgba(84, 214, 199, 0.16), transparent 34%),
          linear-gradient(238deg, rgba(255, 122, 168, 0.13), transparent 36%),
          linear-gradient(180deg, rgba(125, 211, 252, 0.08), transparent 46%),
          #090b0f;
        color: var(--ink);
        font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      }

      body::before {
        content: "";
        position: fixed;
        inset: 0;
        z-index: -1;
        opacity: 0.12;
        pointer-events: none;
        background:
          repeating-linear-gradient(90deg, rgba(245, 240, 232, 0.08) 0 1px, transparent 1px 72px),
          repeating-linear-gradient(0deg, rgba(245, 240, 232, 0.05) 0 1px, transparent 1px 72px);
      }

      a { color: inherit; }

      .topbar {
        position: sticky;
        top: 0;
        z-index: 10;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
        padding: 14px clamp(18px, 4vw, 56px);
        border-bottom: 1px solid var(--line);
        background: rgba(9, 11, 15, 0.92);
        backdrop-filter: blur(14px);
      }

      .brand { font-weight: 780; }

      nav {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-end;
        gap: 0;
        color: var(--muted);
        font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
        font-size: 14px;
      }

      nav::before {
        content: "/pva";
        margin-right: 0.25rem;
        color: var(--teal);
        font-weight: 760;
      }

      nav a {
        display: inline-flex;
        align-items: center;
        min-height: 32px;
        padding: 0 0.35rem;
        border-radius: 4px;
        text-decoration: none;
      }

      nav a::before {
        content: "/";
        margin-right: 0.35rem;
        color: var(--line);
      }

      nav a:hover,
      nav a[aria-current="page"] {
        color: var(--ink);
        background: rgba(84, 214, 199, 0.12);
      }

      main {
        width: min(1180px, calc(100% - 36px));
        margin: 0 auto;
        padding: clamp(44px, 8vw, 90px) 0 72px;
      }

      .hero {
        display: grid;
        grid-template-columns: minmax(0, 1.08fr) minmax(280px, 0.62fr);
        gap: clamp(22px, 5vw, 58px);
        align-items: end;
        min-height: 62vh;
      }

      .hero-copy {
        display: grid;
        gap: 22px;
      }

      .eyebrow {
        margin: 0;
        color: var(--teal);
        font-size: 13px;
        font-weight: 820;
        text-transform: uppercase;
      }

      h1 {
        max-width: 980px;
        margin: 0;
        font-size: clamp(42px, 8.5vw, 104px);
        line-height: 0.93;
        letter-spacing: 0;
      }

      .lede {
        max-width: 760px;
        margin: 0;
        color: #d7dbe2;
        font-size: clamp(19px, 2.2vw, 27px);
        line-height: 1.42;
      }

      .hero-actions,
      .links,
      .meta {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
      }

      .button,
      .links a {
        min-height: 40px;
        padding: 9px 12px;
        border: 1px solid rgba(84, 214, 199, 0.55);
        border-radius: 6px;
        background: rgba(84, 214, 199, 0.14);
        color: var(--ink);
        font: inherit;
        font-size: 14px;
        font-weight: 760;
        text-decoration: none;
        transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, color 180ms ease;
      }

      .button.secondary,
      .links a:not(.primary) {
        border-color: var(--line);
        background: rgba(21, 26, 35, 0.86);
        color: var(--muted);
      }

      .button:hover,
      .links a:hover {
        transform: translateY(-2px);
      }

      .archive-panel {
        display: grid;
        gap: 12px;
        padding: 18px;
        border: 1px solid var(--line);
        border-radius: 8px;
        background: rgba(16, 20, 27, 0.82);
      }

      .archive-panel h2 {
        margin: 0;
        font-size: 24px;
      }

      .archive-panel p {
        margin: 0;
        color: var(--muted);
        line-height: 1.45;
      }

      .route-list {
        display: grid;
        gap: 10px;
        margin: 0;
        padding: 0;
        list-style: none;
        font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
        color: var(--muted);
        font-size: 14px;
      }

      .route-list a {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        padding: 10px;
        border: 1px solid var(--line);
        border-radius: 6px;
        text-decoration: none;
      }

      .route-list a:hover {
        color: var(--ink);
        border-color: rgba(84, 214, 199, 0.52);
      }

      .route-list strong {
        min-width: 0;
        color: var(--ink);
        overflow-wrap: anywhere;
      }

      .route-list span {
        flex-shrink: 0;
      }

      @media (max-width: 420px) {
        .route-list a {
          align-items: flex-start;
          flex-direction: column;
        }
      }

      .year-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr));
        gap: 16px;
        margin-top: clamp(42px, 6vw, 78px);
      }

      .year-card {
        --year-accent: var(--teal);
        --year-border: rgba(84, 214, 199, 0.32);
        --year-soft: rgba(84, 214, 199, 0.08);
        display: grid;
        gap: 16px;
        min-height: 320px;
        padding: 18px;
        border: 1px solid var(--year-border);
        border-radius: 8px;
        background:
          linear-gradient(135deg, var(--year-soft), transparent 48%),
          rgba(16, 20, 27, 0.86);
        text-decoration: none;
        transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
      }

      .year-card[data-year="2024-2025"] {
        --year-accent: var(--rose);
        --year-border: rgba(255, 122, 168, 0.34);
        --year-soft: rgba(255, 122, 168, 0.08);
      }

      .year-card:hover {
        transform: translateY(-4px);
        border-color: var(--year-accent);
        background:
          linear-gradient(135deg, var(--year-soft), transparent 56%),
          rgba(21, 26, 35, 0.92);
      }

      .year-card span {
        color: var(--year-accent);
        font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
        font-size: 14px;
        font-weight: 760;
      }

      .year-card h2 {
        margin: 0;
        font-size: clamp(30px, 4vw, 48px);
        line-height: 0.98;
      }

      .year-card p {
        margin: 0;
        color: var(--muted);
        line-height: 1.5;
      }

      .meta {
        margin-top: auto;
      }

      .meta b {
        padding: 7px 9px;
        border: 1px solid var(--year-border);
        border-radius: 999px;
        color: #d8dde6;
        font-size: 13px;
        font-weight: 650;
      }

      .footer {
        display: flex;
        flex-wrap: wrap;
        gap: 10px 18px;
        margin-top: 54px;
        padding-top: 24px;
        border-top: 1px solid var(--line);
        color: var(--muted);
        font-size: 14px;
      }

      .footer strong { color: var(--ink); }

      :focus-visible {
        outline: 3px solid var(--gold);
        outline-offset: 3px;
      }

      @media (max-width: 860px) {
        .hero {
          grid-template-columns: 1fr;
          align-items: start;
        }
      }

      @media (max-width: 760px) {
        .topbar {
          flex-direction: column;
          align-items: flex-start;
        }

        nav { justify-content: flex-start; }
      }

      @media (prefers-reduced-motion: reduce) {
        html { scroll-behavior: auto; }
        .button,
        .links a,
        .year-card {
          transition: none;
        }
        .button:hover,
        .links a:hover,
        .year-card:hover {
          transform: none;
        }
      }