.hd {
      display: flex;
      flex-direction: column;
      gap: var(--sp-2);
    }

    .eyebrow {
      font-family: var(--f-mono);
      font-size: var(--fs-micro);
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--ink-3);
    }

    h1 {
      font-family: var(--f-mono);
      font-size: var(--fs-display);
      font-weight: 600;
      letter-spacing: -0.02em;
      margin: 0;
      line-height: 1.12;
    }

    .lede {
      font-size: var(--fs-lead);
      color: var(--ink-2);
      margin: 0;
      max-width: 62ch;
    }

    .bar {
      display: flex;
      flex-wrap: wrap;
      gap: var(--sp-3);
      align-items: center;
      padding-bottom: var(--sp-3);
      border-bottom: 1px solid var(--rule);
    }

    .count {
      font-family: var(--f-mono);
      font-size: var(--fs-sm);
      color: var(--ink-2);
      font-variant-numeric: tabular-nums;
    }

    button.reset {
      font: inherit;
      font-size: var(--fs-sm);
      color: var(--accent);
      background: none;
      border: 1px solid var(--rule-2);
      padding: 8px 12px;
      cursor: pointer;
      min-height: 44px;
    }

    button.reset:hover {
      border-color: var(--accent);
    }

    button.reset:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
    }

    .day {
      margin-top: var(--sp-4);
    }

    .day h2 {
      font-family: var(--f-mono);
      font-size: var(--fs-h2);
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--ink-2);
      margin: 0 0 var(--sp-2);
      display: flex;
      align-items: center;
      gap: var(--sp-3);
    }

    .day h2::after {
      content: '';
      flex: 1;
      height: 1px;
      background: var(--rule);
    }

    .soon {
      font-family: var(--f-sans);
      font-size: var(--fs-xs);
      letter-spacing: 0;
      text-transform: none;
      color: var(--accent);
      font-weight: 600;
    }

    ul.meets {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      gap: 1px;
      background: var(--rule);
      border: 1px solid var(--rule-2);
    }

    li.meet {
      background: var(--sheet);
      padding: 12px 14px;
      display: grid;
      gap: 2px var(--sp-4);
      grid-template-columns: 76px 1fr auto;
      align-items: baseline;
    }

    .time {
      font-family: var(--f-mono);
      font-variant-numeric: tabular-nums;
      font-size: var(--fs-sm);
      color: var(--ink-2);
    }

    .what {
      font-weight: 600;
    }

    .where {
      grid-column: 2;
      font-size: var(--fs-xs);
      color: var(--ink-3);
    }

    .town {
      font-family: var(--f-mono);
      font-size: var(--fs-micro);
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--ink-3);
      white-space: nowrap;
    }

    .ag {
      grid-column: 2;
      font-size: var(--fs-xs);
      margin-top: 2px;
    }

    .ag.no {
      color: var(--ink-3);
    }

    .ag.yes {
      color: var(--accent);
      font-weight: 600;
    }

    .gapbox {
      font-size: var(--fs-sm);
      color: var(--flag-ink);
      background: var(--flag-bg);
      border: 1px solid var(--flag-bd);
      padding: 12px 14px;
    }

    .gapbox b {
      font-weight: 600;
    }

    .empty {
      padding: var(--sp-5);
      text-align: center;
      color: var(--ink-3);
      font-size: var(--fs-sm);
      border: 1px dashed var(--rule-2);
    }

    footer {
      border-top: 1px solid var(--rule);
      padding-top: var(--sp-4);
      font-size: var(--fs-xs);
      color: var(--ink-3);
      line-height: 1.65;
      display: flex;
      flex-direction: column;
      gap: var(--sp-3);
    }

    footer a {
      color: var(--accent);
    }

    @media (max-width: 700px) {
      :root {
        --fs-display: 27px;
      }

      li.meet {
        grid-template-columns: 1fr auto;
      }

      .time {
        grid-column: 1;
      }

      .town {
        grid-column: 2;
        grid-row: 1;
      }

      .what,
      .where,
      .ag {
        grid-column: 1/-1;
      }
    }