@font-face {
  font-family: 'Fraunces';
  src: url(/static/fraunces-latin-600-normal.woff2) format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fraunces';
  src: url(/static/fraunces-latin-ext-600-normal.woff2) format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
:root {
    --bg: #FCFCFB;
    --wash: #F9F9F7;
    --ink: #2E2C27;
    --ink-soft: #6B6A63;
    --ink-grey: #B4B3A8;
    --hairline: #E4E3DC;
    --band-edge: #E1E1DF;
    --clay: #C6613F;
    --clay-hover: #AE5133;
    --dot-fill: #FCFCFB;
  }

  @media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
      --bg: #1C1B18;
      --wash: #201F1B;
      --ink: #EDEBE4;
      --ink-soft: #A6A399;
      --ink-grey: #6E6C63;
      --hairline: #333129;
      --band-edge: #38362E;
      --clay: #E07A55;
      --clay-hover: #EF8F6C;
      --dot-fill: #1C1B18;
    }
  }

  :root[data-theme="dark"] {
    --bg: #1C1B18;
    --wash: #201F1B;
    --ink: #EDEBE4;
    --ink-soft: #A6A399;
    --ink-grey: #6E6C63;
    --hairline: #333129;
    --band-edge: #38362E;
    --clay: #E07A55;
    --clay-hover: #EF8F6C;
    --dot-fill: #1C1B18;
  }

  * { box-sizing: border-box; }

  body {
    margin: 0;
    background: var(--bg);
    color: var(--ink-soft);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
  }

  a:focus-visible, select:focus-visible, button:focus-visible {
    outline: 2px solid var(--clay);
    outline-offset: 2px;
    border-radius: 2px;
  }

  /* ---------- archive bar ---------- */

  .archive-bar {
    background: var(--wash);
    border-bottom: 1px solid var(--band-edge);
  }

  .archive-inner {
    max-width: 860px;
    margin: 0 auto;
    padding: 10px 24px;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 52px;
  }

  .archive-label {
    font-size: 12px;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--ink-grey);
    white-space: nowrap;
  }

  .archive-select {
    font: inherit;
    font-size: 14px;
    color: var(--ink);
    background: transparent;
    border: 1px solid var(--hairline);
    border-radius: 6px;
    padding: 7px 10px;
    max-width: 100%;
    flex: 0 1 auto;
    min-height: 40px;
  }

  .archive-nav {
    display: flex;
    gap: 6px;
    margin-left: auto;
  }

  .archive-btn {
    font: inherit;
    font-size: 15px;
    line-height: 1;
    color: var(--ink-soft);
    background: transparent;
    border: 1px solid var(--hairline);
    border-radius: 6px;
    min-width: 40px;
    min-height: 40px;
    cursor: pointer;
  }
  .archive-btn:hover:not(:disabled) { color: var(--ink); border-color: var(--ink-grey); }
  .archive-btn:disabled { opacity: 0.35; cursor: default; }

  .archive-hint {
    font-size: 12.5px;
    color: var(--ink-grey);
  }

  .legacy-note {
    max-width: 860px;
    margin: 0 auto;
    padding: 28px 24px 40px;
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--ink-soft);
  }
  .legacy-note a {
    color: var(--ink);
    text-decoration: underline;
    text-decoration-color: var(--ink-grey);
    text-underline-offset: 3px;
  }

  /* ---------- edition ---------- */

  .band { width: 100%; }
  .band-top { background: var(--wash); border-bottom: 1px solid var(--band-edge); }
  .band-bottom { background: var(--bg); }

  .wrap {
    max-width: 860px;
    margin: 0 auto;
    padding: 40px 24px 48px;
  }

  .day-date {
    font-size: 13px;
    letter-spacing: 0.02em;
    color: var(--ink-soft);
    margin: 0 0 14px;
  }

  h1.headline {
    font-family: 'Fraunces', Georgia, serif;
    font-weight: 600;
    font-style: normal;
    font-size: 40px;
    line-height: 1.2;
    color: var(--ink);
    margin: 0 0 20px;
    max-width: 15ch;
    text-wrap: balance;
  }

  .opener {
    font-style: italic;
    color: var(--ink-soft);
    font-size: 16px;
    line-height: 1.6;
    max-width: 60ch;
    margin: 0 0 32px;
  }
  .opener a {
    color: var(--ink-soft);
    text-decoration: underline;
    text-decoration-color: var(--ink-grey);
  }

  svg.terrain {
    width: 100%;
    height: auto;
    display: block;
    margin-bottom: 4px;
  }

  .acts { display: flex; width: 100%; }

  .act {
    flex: 1 1 0;
    padding: 14px 20px 0 0;
    border-left: 1px solid var(--hairline);
  }
  .act:first-child { border-left: none; padding-left: 0; }

  .act-time {
    font-weight: 600;
    font-size: 13px;
    color: var(--ink);
    margin-bottom: 6px;
    letter-spacing: 0.01em;
    font-variant-numeric: tabular-nums;
  }

  .act-sentence {
    font-size: 14px;
    line-height: 1.5;
    color: var(--ink-soft);
    margin: 0;
  }

  .section { margin-bottom: 40px; }
  .section:last-child { margin-bottom: 0; }

  .section-heading {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ink);
    margin: 0 0 18px;
  }

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

  .item {
    display: flex;
    gap: 14px;
    padding: 16px 0;
    border-top: 1px solid var(--hairline);
  }
  .item:first-child { border-top: none; padding-top: 0; }

  .item-num {
    font-size: 13px;
    color: var(--ink-grey);
    flex: 0 0 20px;
    padding-top: 2px;
    font-variant-numeric: tabular-nums;
  }

  .item-body { flex: 1 1 auto; min-width: 0; }

  .item-title {
    font-weight: 600;
    font-size: 16px;
    color: var(--ink);
    margin: 0 0 4px;
    line-height: 1.35;
  }
  .item-title a {
    color: var(--ink);
    text-decoration: none;
    border-bottom: 1px solid var(--ink-grey);
  }

  .item-source {
    font-size: 12.5px;
    color: var(--ink-grey);
    margin: 0 0 6px;
  }

  .item-sentence {
    font-size: 14.5px;
    line-height: 1.55;
    color: var(--ink-soft);
    margin: 0;
  }
  .item-sentence a {
    color: var(--ink-soft);
    text-decoration: underline;
    text-decoration-color: var(--ink-grey);
  }

  .counterpoint {
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--ink-grey);
    margin: 8px 0 0;
  }
  .counterpoint b { color: var(--ink-soft); font-weight: 600; }

  .calm-line { font-size: 14.5px; color: var(--ink-soft); margin: 0; }

  /* continuing storylines */
  .thread-tag {
    display: block;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--clay);
    margin: 0 0 5px;
  }

  .previously {
    font-size: 13px;
    line-height: 1.5;
    color: var(--ink-grey);
    margin: 8px 0 0;
    padding-left: 12px;
    border-left: 1px solid var(--hairline);
  }
  .previously a {
    color: var(--ink-grey);
    text-decoration: underline;
    text-decoration-color: var(--ink-grey);
  }

  /* action buttons */
  .btn {
    display: inline-block;
    margin-top: 12px;
    background: var(--clay);
    color: #FCFCFB;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    padding: 10px 16px;
    border-radius: 8px;
    border: 1px solid var(--clay);
    min-height: 40px;
    line-height: 1.4;
  }
  .btn:hover { background: var(--clay-hover); border-color: var(--clay-hover); }

  @media (max-width: 640px) {
    .archive-inner { padding: 9px 18px; gap: 8px; }
    .archive-label { display: none; }
    .archive-select { flex: 1 1 auto; font-size: 15px; }
    .wrap { padding: 28px 18px 40px; }
    .legacy-note { padding: 24px 18px 36px; }
    h1.headline { font-size: 30px; max-width: 100%; }
    .acts { flex-direction: column; }
    .act {
      border-left: none;
      border-top: 1px solid var(--hairline);
      padding: 16px 0 0;
    }
    .act:first-child { border-top: none; padding-top: 0; }
    .item { gap: 12px; }
    .item-title { font-size: 15.5px; }
    .item-sentence { font-size: 15px; }
  }

/* ---------- public site additions ---------- */
.archive-inner a.archive-btn { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; }
.archive-btn[aria-disabled="true"] { opacity: 0.35; pointer-events: none; }
.site-name { font-family:'Fraunces', Georgia, serif; font-weight:600; font-size:17px; color:var(--ink); text-decoration:none; margin-right:6px; white-space:nowrap; }
.dek { font-size:15px; line-height:1.6; color:var(--ink-soft); max-width:60ch; margin:0 0 8px; }
.site-footer { border-top:1px solid var(--band-edge); background:var(--wash); }
.site-footer .wrap { padding:24px 24px 32px; font-size:13px; line-height:1.6; color:var(--ink-grey); }
.site-footer a { color:var(--ink-soft); }
.archive-list { list-style:none; margin:0; padding:0; }
.archive-list li { padding:12px 0; border-top:1px solid var(--hairline); }
.archive-list li:first-child { border-top:none; }
.archive-list a { color:var(--ink); font-weight:600; text-decoration:none; border-bottom:1px solid var(--ink-grey); }
.archive-list span { display:block; font-size:13px; color:var(--ink-grey); margin-top:4px; }