/* Sapporo: snow. Cool snow-white ground, a deep winter navy for ink, the red star of the
   city's old breweries for accents, falling-snow dots for texture and a soft rounded title.
   Layout is shared; only tokens and a few signs change. */
:root[data-city="sapporo"] {
  --ground: #eef4f8;
  --surface: #fbfdff;
  --ink: #14385a;
  --ink-soft: #52677c;
  --rule: #c7d4de;
  --stamp: #d1362b;
  --signal: #ffcc00;
  --ticket: #e2eef6;
  --font-display: "Zen Maru Gothic", "BIZ UDPGothic", "Hiragino Maru Gothic ProN", sans-serif;

  /* snow: two drifts of dots at different sizes and pitches */
  --tone-color: rgb(20 56 90 / 0.14);
  --tone:
    radial-gradient(circle, var(--tone-color) 0 1.4px, transparent 1.8px) 0 0 / 23px 19px,
    radial-gradient(circle, var(--tone-color) 0 0.9px, transparent 1.2px) 9px 7px / 13px 11px;
}

:root[data-city="sapporo"] .title { font-weight: 900; letter-spacing: 0.02em; }
/* A frosty pale-blue offset instead of halftone. */
:root[data-city="sapporo"] .title::before {
  transform: translate(0.07em, 0.09em);
  background: #8cc4e8;
  -webkit-background-clip: text;
  background-clip: text;
}

:root[data-city="sapporo"] .masthead { border-top: 6px solid #8cc4e8; box-shadow: inset 0 6px 0 var(--ink); }
:root[data-city="sapporo"] .edition-code { border-color: var(--ink); border-radius: 50%; }
/* The red star of the old brewery signs, on the current city. */
:root[data-city="sapporo"] .cities a[aria-current]::before { content: "★"; margin-right: 4px; color: var(--stamp); }
:root[data-city="sapporo"] .btn-ink:hover { background: #1f4c76; }
