:root {
  --paper: #f1f2f2;
  --surface: #ffffff;
  --surface-muted: #f0f2f3;
  --ink: #111314;
  --muted: #5d646a;
  --line: #d7dadd;
  --line-strong: #888f94;
  --chrome: #111314;
  --chrome-muted: #d8dcde;
  --accent: #b1262d;
  --accent-dark: #8f1d23;
  --accent-soft: #f9e7e8;
  --state: #4f5960;
  --amber: #9a6500;
  --on-ink: #ffffff;
  --on-accent: #ffffff;
  --text-soft: #42484c;
  --prose-ink: #363b3e;
  --placeholder: #6f767b;
  --error: #9d2626;
  --home-bg: #f5f6f6;
  --panel-line: #dfe2e4;
  --icon-bg: #f3f5f6;
  --icon-ink: #68727f;
  --row-hover: #f6f8f8;
  --large-bg: #fff6f6;
  --large-line: #e7b9bc;
  --shadow: rgba(17, 19, 20, .05);
  --chrome-ink: #ffffff;
  --chrome-line: #000000;
  /* Shared shape and type tokens for .chip and .pill; 13 px is the floor except badges. */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-pill: 999px;
  --chip-pad: .1rem .45rem;
  --text-badge: .75rem;
  --measure: 76rem;
  --font: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
}

* { box-sizing: border-box; }
@media (prefers-color-scheme: dark) {
  :root {
    --paper: #0f1112;
    --surface: #16191b;
    --surface-muted: #1f2326;
    --ink: #e9ecee;
    --muted: #a6aeb4;
    --line: #2c3236;
    --line-strong: #5d666c;
    --chrome: #0b0c0d;
    --chrome-muted: #b9c0c4;
    --accent: #f0646c;
    --accent-dark: #ff9a9f;
    --accent-soft: #3a1c1f;
    --state: #c0c8cd;
    --amber: #e0a43a;
    --on-ink: #111314;
    --on-accent: #16191b;
    --text-soft: #c7ced2;
    --prose-ink: #d6dbde;
    --placeholder: #8d959b;
    --error: #ff8a8a;
    --home-bg: #0f1112;
    --panel-line: #2c3236;
    --icon-bg: #1f2326;
    --icon-ink: #a6aeb4;
    --row-hover: #1c2023;
    --large-bg: #2a1618;
    --large-line: #6b2a2f;
    --shadow: rgba(0, 0, 0, .3);
    --chrome-ink: #f3f5f6;
    --chrome-line: #24292c;
  }
}

html { color-scheme: light dark; }
@media (prefers-color-scheme: dark) {
  .incident-icon { border-radius: 8px; background: #e9ecee; }
  .news-thumbnail { filter: saturate(.45) contrast(1.04) opacity(.8); }
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.6;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration-color: var(--line-strong); text-underline-offset: .2em; }
a:hover { color: var(--accent-dark); text-decoration-color: currentColor; }
button, input, select { font: inherit; }
button, a { transition: color 140ms ease, background-color 140ms ease, border-color 140ms ease; }
::selection { background: var(--accent-soft); color: var(--ink); }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.shell { width: min(calc(100% - 3rem), var(--measure)); margin-inline: auto; }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 100; background: var(--ink); color: var(--on-ink); padding: .65rem 1rem; border-radius: 6px; }
.skip-link:focus { top: 1rem; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.site-header { border-bottom: 1px solid var(--line); background: var(--surface); color: var(--ink); }
.header-row { min-height: 4rem; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.brand { display: inline-flex; align-items: center; gap: .65rem; min-height: 44px; font-weight: 750; font-size: 1.12rem; text-decoration: none; letter-spacing: -.025em; }
.brand-icon { display: block; flex: 0 0 auto; width: 2.25rem; height: 2.25rem; object-fit: contain; }
.primary-nav { display: flex; align-items: center; gap: 1.5rem; font-size: .9rem; }
.primary-nav a { padding-block: 1.25rem; border-bottom: 2px solid transparent; color: var(--muted); text-decoration: none; }
.primary-nav a:hover, .primary-nav a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--accent); }

.page-main { min-height: 70vh; padding: 1.15rem 2rem 5rem; background: var(--surface); }
.breadcrumbs { margin-block: 0 2rem; color: var(--muted); font-size: .8125rem; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: .45rem; padding: 0; margin: 0; list-style: none; }
.breadcrumbs li + li::before { content: "/"; margin-right: .45rem; color: var(--line-strong); }
.page-intro { max-width: 55rem; padding-block: 1rem 2.2rem; }
/* p.eyebrow and p.article-meta out-rank .page-intro > p without !important. */
.page-intro > p.eyebrow { margin: 0 0 .65rem; color: var(--muted); font-size: .82rem; font-weight: 550; }
.page-title-row { display: flex; align-items: flex-start; gap: 1rem; }
.page-intro h1 { max-width: 19ch; margin: 0; font-size: clamp(2.15rem, 5vw, 3.65rem); font-weight: 620; line-height: 1.04; letter-spacing: -.04em; text-wrap: balance; }
.page-intro > p { max-width: 48rem; margin: 1rem 0 0; color: var(--text-soft); font-size: clamp(1rem, 1.5vw, 1.12rem); }
/* Follow star (location pages): space is reserved; site.*.js adds .is-ready when localStorage works. */
.follow-row { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; margin-top: 1rem; }
.follow-star { display: inline-flex; align-items: center; gap: .4rem; min-width: 44px; min-height: 44px; padding: .45rem .95rem .45rem .75rem; border: 1px solid var(--line-strong); border-radius: var(--radius-pill); background: transparent; color: var(--ink); cursor: pointer; font: inherit; font-size: .9rem; font-weight: 600; }
.follow-star svg { flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; }
.follow-star:hover { border-color: var(--ink); }
.follow-star[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-dark); }
.follow-star[aria-pressed="true"] svg { fill: currentColor; }
.follow-star:not(.is-ready) { visibility: hidden; }
.follow-status { margin: 0; color: var(--text-soft); font-size: .875rem; }
.follow-status:empty { display: none; }
.follow-status a { display: inline-flex; align-items: center; min-height: 44px; color: var(--accent-dark); font-weight: 600; }
.region-crest { display: block; flex: 0 0 auto; object-fit: contain; }
.region-crest--title { width: 50px; height: 60px; }
.region-crest--summary { width: 25px; height: 30px; }
.region-crest--directory { width: 28px; height: 34px; }

.freshness { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .35rem 1rem; padding-block: .7rem; border-block: 1px solid var(--line); color: var(--muted); font-size: .8125rem; }
.freshness__latest time { color: var(--ink); font-weight: 600; }
.coverage-note { margin: .55rem 0 .1rem; color: var(--muted); font-size: .8125rem; line-height: 1.45; }
.coverage-note a { display: inline-block; margin-block: -.75rem; padding-block: .75rem; color: var(--accent-dark); font-weight: 600; white-space: nowrap; }
.live-dot { display: inline-block; width: .48rem; height: .48rem; margin-right: .45rem; border-radius: 50%; background: var(--accent); }
.live-dot.is-synthetic { background: var(--amber); }
.stats { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; border-bottom: 1px solid var(--line); }
.stats div { padding: 1rem 1.5rem 1.1rem 0; border-right: 1px solid var(--line); }
.stats div + div { padding-left: 1.5rem; }
.stats div:last-child { border-right: 0; }
.stats dt { color: var(--muted); font-size: .8125rem; }
.stats dd { margin: .15rem 0 0; font-size: clamp(1.4rem, 2.5vw, 1.9rem); font-weight: 600; line-height: 1.15; letter-spacing: -.025em; }

.incident-search { margin-top: 1rem; padding: 1.25rem; border: 1px solid var(--panel-line); border-radius: 10px; background: var(--surface); box-shadow: 0 1px 4px var(--shadow); }
.incident-search form { display: grid; grid-template-columns: minmax(18rem, 1fr) auto; gap: 1rem 1.25rem; align-items: end; }
.search-field label { display: block; margin-bottom: .4rem; color: var(--muted); font-size: .8125rem; }
.search-input-row { position: relative; display: flex; min-height: 3.1rem; }
.search-input-row input { width: 100%; min-width: 0; padding: .62rem .75rem .62rem 2.65rem; border: 1px solid var(--line-strong); border-right: 0; border-radius: var(--radius-md) 0 0 var(--radius-md); background: var(--surface); color: var(--ink); }
.search-input-row input::placeholder { color: var(--placeholder); }
.search-input-icon { position: absolute; z-index: 1; top: 50%; left: .9rem; fill: none; stroke: var(--muted); stroke-width: 1.8; stroke-linecap: round; transform: translateY(-50%); pointer-events: none; }
.search-input-row input:focus, .near-bar select:focus, .location-button:focus-visible, .search-submit:focus-visible, .clear-search:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-color: var(--accent); }
.search-submit, .location-button, .clear-search { border: 1px solid var(--ink); background: var(--ink); color: var(--on-ink); cursor: pointer; font-weight: 600; }
.search-submit { min-width: 6rem; padding: .62rem 1.5rem; border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.location-button { display: inline-flex; align-items: center; gap: .45rem; padding: .5rem .8rem; border-radius: var(--radius-md) 0 0 var(--radius-md); white-space: nowrap; }
.location-button svg { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.location-button:hover, .location-button[aria-pressed="true"] { border-color: var(--accent-dark); background: var(--accent-dark); }
.location-button:disabled { cursor: wait; opacity: .62; }
/* Near-me bar above the stats; the "Hae" jump to the search field only shows on phones. */
.near-bar { display: flex; align-items: stretch; min-height: 44px; margin: .75rem .4rem 0; }
.near-bar select { min-width: 5.5rem; padding: .4rem 1.6rem .4rem .6rem; border: 1px solid var(--line-strong); border-left: 0; border-radius: 0 var(--radius-md) var(--radius-md) 0; background: var(--surface); color: var(--ink); cursor: pointer; }
.near-bar select:disabled { color: var(--muted); cursor: not-allowed; opacity: .7; }
.near-bar__search { display: none; }
.clear-search { align-self: end; min-height: 3.1rem; padding: .62rem .8rem; border-color: var(--line-strong); border-radius: var(--radius-md); background: transparent; color: var(--ink); white-space: nowrap; }
.clear-search:hover { border-color: var(--ink); background: var(--ink); color: var(--on-ink); }
.search-status { min-height: 1.3em; margin: .7rem 0 0; color: var(--muted); font-size: .8125rem; }
.search-status.is-error { color: var(--error); }
.search-status .button-secondary { margin-left: .4rem; }
.incident-distance { margin-left: .45rem; color: var(--accent-dark); font-size: .8125rem; font-weight: 600; white-space: nowrap; }
.button-secondary { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .45rem 1rem; border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: transparent; color: var(--ink); cursor: pointer; font-size: .9rem; font-weight: 600; text-decoration: none; }
.button-secondary:hover { border-color: var(--ink); background: var(--ink); color: var(--on-ink); }
.button-secondary[hidden] { display: none; }

.content-grid { display: grid; grid-template-columns: minmax(0, 2.25fr) minmax(15rem, .75fr); gap: clamp(2.5rem, 5vw, 5rem); align-items: start; margin-top: 3rem; }
.incident-search + .content-grid { margin-top: 2rem; }
.section-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding-bottom: .65rem; border-bottom: 1px solid var(--line-strong); }
.section-heading h2, .side-summary h2, .region-index h2, .directory-section > h2, .definition h2, .news-list > h2, .prose h2 { margin: 0; font-size: 1.25rem; font-weight: 620; letter-spacing: -.02em; }
.section-heading span { color: var(--muted); font-size: .8125rem; }
.incident-list { margin: 0; padding: 0; list-style: none; }
/* Row: time | icon + type and place | chips. The type link covers the whole row; other links and details sit above it. */
.incident-row { --icon-size: 2.25rem; --icon-gap: .8rem; --row-indent: calc(var(--icon-size) + var(--icon-gap)); position: relative; display: grid; grid-template-columns: 6.5rem minmax(0, 1fr) auto; column-gap: 1rem; row-gap: .35rem; align-items: start; padding: .85rem .25rem .8rem 0; border-bottom: 1px solid var(--line); scroll-margin-top: 1rem; transition: background-color 140ms ease; }
.incident-row:hover { background: var(--row-hover); }
.incident-row:target { background: var(--accent-soft); outline: 2px solid var(--accent); outline-offset: -2px; }
.incident-row h3 a::after { content: ""; position: absolute; inset: 0; }
.incident-place a, .incident-labels a, .incident-details, .pill[title] { position: relative; z-index: 1; }
.incident-time { display: flex; flex-wrap: wrap; align-items: baseline; padding-top: .15rem; color: var(--text-soft); font-size: .875rem; font-variant-numeric: tabular-nums; line-height: 1.35; }
.incident-time--range span { margin-inline: .2rem; }
.incident-content { display: grid; grid-template-columns: var(--icon-size) minmax(0, 1fr); gap: var(--icon-gap); min-width: 0; }
.incident-icon { display: block; width: var(--icon-size); height: var(--icon-size); margin-top: -.15rem; padding: .08rem; object-fit: contain; filter: drop-shadow(0 1px 1px rgb(0 0 0 / 18%)); }
.incident-body { min-width: 0; }
.incident-row h3 { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem .35rem; margin: 0; font-size: .98rem; font-weight: 700; line-height: 1.35; }
.incident-row h3 a { text-decoration: none; }
.incident-row h3, .incident-row h3 a { overflow-wrap: break-word; hyphens: auto; }
/* Pills are status badges (severity, state): text plus a shape, red only for large. Chips are source and road labels. */
.pill, .chip { display: inline-flex; align-items: center; padding: var(--chip-pad); border: 1px solid var(--line-strong); line-height: 1.4; white-space: nowrap; }
.pill { gap: .25rem; border-radius: var(--radius-pill); color: var(--text-soft); font-size: var(--text-badge); font-weight: 700; }
.pill::before { font-size: .85em; line-height: 1; }
.pill--small::before { content: "○"; content: "○" / ""; }
.pill--medium { border-color: var(--amber); color: var(--amber); }
.pill--medium::before { content: "◆"; content: "◆" / ""; }
.pill--large { border-color: var(--accent); background: var(--accent); color: var(--on-accent); }
.pill--large::before { content: "▲"; content: "▲" / ""; }
.pill--state { background: var(--surface-muted); color: var(--muted); font-weight: 600; }
.pill[title] { cursor: help; }
.chip { border-radius: var(--radius-sm); color: var(--muted); font-size: .8125rem; text-decoration: none; }
a.chip:hover { border-color: var(--ink); color: var(--ink); }
.chip--link::after { content: "↗"; content: "↗" / ""; margin-left: .28rem; }
.chip--road { color: var(--ink); font-weight: 650; font-variant-numeric: tabular-nums; }
a.chip--road:hover { background: var(--ink); color: var(--surface); }
.incident-row--resolved .incident-icon { opacity: .55; filter: grayscale(1); }
.incident-row--resolved h3 a { color: var(--muted); }
.incident-row p { margin: .28rem 0 0; color: var(--text-soft); font-size: .875rem; }
.incident-row p.incident-place { display: flex; align-items: center; gap: .35rem; }
.incident-place svg { flex: 0 0 auto; width: .72rem; height: .9rem; fill: currentColor; stroke: none; }
.incident-place a { text-decoration: none; }
.incident-row details { color: var(--muted); font-size: .8125rem; }
.incident-details { grid-column: 2 / -1; grid-row: 2; justify-self: stretch; min-width: 0; margin: .15rem 0 0 var(--row-indent); border-top: 1px solid var(--line); }
.incident-details summary { display: flex; align-items: center; width: fit-content; min-height: 2rem; color: var(--state); cursor: pointer; font-weight: 600; list-style: none; white-space: nowrap; }
.incident-details summary::-webkit-details-marker { display: none; }
.incident-details summary::before { content: ""; width: .42rem; height: .42rem; margin: -.1rem .55rem 0 .15rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(-45deg); transition: transform 160ms ease; }
.incident-details[open] summary { color: var(--ink); }
.incident-details[open] summary::before { transform: rotate(45deg); }
.incident-details summary:hover { color: var(--ink); }
.incident-details__content { max-width: 46rem; padding: 0 0 .7rem 1.15rem; animation: details-reveal 160ms ease-out; }
.incident-row .incident-details__content p { margin: 0; padding: .55rem .7rem; border-left: 2px solid var(--line-strong); background: var(--surface-muted); color: var(--text-soft); line-height: 1.5; overflow-wrap: break-word; white-space: normal; }
@keyframes details-reveal { from { opacity: 0; transform: translateY(-2px); } to { opacity: 1; transform: translateY(0); } }
.incident-labels { display: flex; grid-column: 3; grid-row: 1; flex-direction: column; align-items: flex-end; gap: .35rem; }
.day-separator { padding: 1rem 0 .3rem; border-bottom: 1px solid var(--line-strong); color: var(--ink); font-size: .8125rem; font-weight: 700; letter-spacing: .01em; }
.day-separator:first-child { padding-top: .6rem; }
.day-separator time { font-variant-numeric: tabular-nums; }
.load-more { width: 100%; margin-top: 1.25rem; padding: .72rem 1rem; border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: transparent; color: var(--ink); cursor: pointer; font-weight: 600; }
.load-more:hover { border-color: var(--ink); background: var(--ink); color: var(--on-ink); }
.load-more:disabled { cursor: wait; opacity: .55; }
.incident-list[aria-busy="true"] { opacity: .6; transition: opacity 140ms ease; }
.empty-state { padding: 1.25rem 0 .5rem; color: var(--text-soft); }
.empty-state p { margin: 0; }
.empty-state .empty-state__actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .9rem; }
/* Reserved ad space: fixed height so a late ad never pushes content. Labelled, muted until filled. */
/* Reserved ad space: fixed height, overflow hidden, so a filled slot cannot shift the layout. */
.ad-slot { display: flex; flex-direction: column; min-height: 250px; height: 250px; overflow: hidden; margin-block: 1rem; padding: .3rem .5rem; border-radius: var(--radius-md); background: var(--surface-muted); list-style: none; }
.ad-slot__label { color: var(--muted); font-size: .8125rem; line-height: 1.4; }
.ad-slot--list { margin-block: .6rem; }
.ad-slot--top { display: none; }
.side-summary > .ad-slot--side { margin-block: 1rem; }
.page-main--home .side-summary > .ad-slot--side { margin-block: 0 1rem; }

.side-summary { border-top: 1px solid var(--line-strong); }
.side-summary section { padding-block: 1.1rem 1.4rem; border-bottom: 1px solid var(--line); }
.side-summary h2 { font-size: 1rem; }
.side-summary p { color: var(--muted); font-size: .86rem; }
.population-stat strong { color: var(--ink); font-size: 1.5rem; font-weight: 640; letter-spacing: -.02em; }
.fmi-warnings ul { list-style: none; margin: .6rem 0 0; padding: 0; display: grid; gap: .5rem; }
.fmi-warning { padding: .5rem .7rem; border-left: 4px solid var(--line-strong); background: var(--surface-muted); font-size: .86rem; }
.fmi-warning--yellow { border-left-color: #e0a800; }
.fmi-warning--orange { border-left-color: #e8710a; }
.fmi-warning--red { border-left-color: #c0262d; }
.source-note { font-size: .8125rem; }
.side-summary ol, .side-summary ul { margin: .75rem 0 0; padding: 0; list-style: none; }
.side-summary ol li a { display: flex; justify-content: space-between; gap: .75rem; padding: .45rem 0; font-size: .84rem; text-decoration: none; }
.side-summary ol li a.region-summary-link { display: grid; grid-template-columns: 25px minmax(0, 1fr) auto; align-items: center; }
.side-summary ol strong { color: var(--accent-dark); font-variant-numeric: tabular-nums; }
.home-news__heading { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.home-news__heading h2 { margin: 0; }
.home-news__heading .text-link { color: var(--accent-dark); white-space: nowrap; }
.home-news ol { border-top: 1px solid var(--line); }
.home-news ol li { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: .75rem; align-items: start; min-height: 48px; padding: .75rem 0; border-bottom: 1px solid var(--line); }
.home-news__body { min-width: 0; }
.home-news__body > a:first-child { display: block; padding: 0; font-weight: 600; line-height: 1.3; text-decoration: none; }
.home-news__body p { margin: .25rem 0 0; font-size: .8125rem; }
.home-news__body > a.home-news__incident { display: inline-flex; gap: .3rem; margin-top: .35rem; color: var(--accent-dark); font-size: .8125rem; font-weight: 650; }
.news-thumbnail-link { display: block; width: 72px; height: 54px; overflow: hidden; background: var(--surface-muted); text-decoration: none; }
.home-news .news-thumbnail-link { width: 64px; height: 48px; }
.news-thumbnail { display: block; width: 100%; height: 100%; object-fit: cover; filter: saturate(.45) contrast(1.04) opacity(.55); transition: filter 160ms ease; }
.news-thumbnail-link:hover .news-thumbnail { filter: saturate(.65) contrast(1.04) opacity(.74); }
.plain-links { columns: 2; }
.plain-links li { margin-bottom: .35rem; font-size: .84rem; }
.side-summary .plain-links { columns: 1; }
.side-summary .plain-links li { margin-bottom: 0; }
.side-summary .plain-links a { display: block; min-height: 44px; padding-block: .5rem; }
.history-link { display: inline-block; min-height: 44px; padding-block: .6rem; }
.text-link { font-size: .88rem; font-weight: 650; text-decoration: none; }

/* Home dashboard */
.page-main--home {
  --home-gutter: clamp(.75rem, 1.6vw, 1.25rem);
  --home-hero-gutter: clamp(1.25rem, 2.5vw, 2rem);
  width: min(calc(100% - clamp(.5rem, 2vw, 2rem)), 80rem);
  padding: 0 var(--home-gutter) 4rem;
  overflow: hidden;
  border-radius: 10px 10px 0 0;
  background: var(--home-bg);
}
.page-main--home .page-intro {
  max-width: none;
  margin-inline: calc(var(--home-gutter) * -1);
  padding: 1.35rem var(--home-hero-gutter) 1rem;
  background: var(--surface);
}
.page-main--home .eyebrow { display: none; }
.page-main--home .page-intro h1 {
  max-width: 12ch;
  font-size: clamp(2.35rem, calc(1.65rem + 3vw), 4rem);
  font-weight: 650;
  line-height: .98;
}
.page-main--home .page-intro > p {
  max-width: 49rem;
  margin-top: 1rem;
  font-size: 1.05rem;
}
.page-main--home .freshness {
  margin-inline: calc(var(--home-gutter) * -1);
  padding: .7rem var(--home-hero-gutter) 1rem;
  border-top: 0;
  background: var(--surface);
}
.page-main--home .stats {
  gap: .6rem;
  padding: .65rem .4rem 0;
  border: 0;
}
.page-main--home .stats div,
.page-main--home .stats div + div {
  position: relative;
  min-height: 6.6rem;
  padding: 1.15rem 4.5rem 1.1rem 1.5rem;
  border: 1px solid var(--panel-line);
  border-radius: 9px;
  background: var(--surface);
}
.page-main--home .stats dt { font-size: .82rem; }
.page-main--home .stats dd {
  margin-top: .1rem;
  font-size: 2rem;
  font-weight: 650;
}
.stat-icon {
  position: absolute;
  top: 50%;
  right: 1.5rem;
  display: grid;
  width: 3.15rem;
  height: 3.15rem;
  place-items: center;
  border-radius: 10px;
  background: var(--icon-bg);
  color: var(--icon-ink);
  transform: translateY(-50%);
}
.stat-icon svg {
  width: 1.45rem;
  height: 1.45rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.page-main--home .content-grid {
  grid-template-columns: minmax(0, 2.45fr) minmax(19rem, 1fr);
  gap: 1rem;
  margin-top: 1.4rem;
}
.page-main--home .incident-section,
.page-main--home .side-summary {
  padding: 1.25rem;
  border: 1px solid var(--panel-line);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: 0 1px 4px var(--shadow);
}
.page-main--home .side-summary > .home-news { padding: 0 0 1.1rem; }
.page-main--home .side-summary > section:not(.home-news) { padding-inline: 0; }
.page-main--home .section-heading { border-bottom-color: var(--line); }
.page-main--home .home-news ol li {
  grid-template-columns: 80px minmax(0, 1fr);
  gap: .75rem;
  min-height: 50px;
  padding: .8rem 0;
}
.page-main--home .home-news .news-thumbnail-link {
  width: 80px;
  height: 50px;
  border-radius: 2px;
}
.page-main--home .home-news__body > a:first-child {
  font-size: .92rem;
  line-height: 1.25;
}
.page-main--home .range-tabs {
  margin: 1rem .4rem 0;
}

@media (max-width: 1040px) {
  .page-main--home .content-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 960px) {
  .incident-search form { grid-template-columns: minmax(0, 1fr); }
}

.range-tabs { display: flex; margin: 2rem 0 -1rem; border-bottom: 1px solid var(--line); }
.range-tabs a { min-width: 5rem; padding: .6rem 1rem; border-bottom: 2px solid transparent; color: var(--muted); text-align: center; text-decoration: none; }
.range-tabs a[aria-current="page"] { border-bottom-color: var(--accent); color: var(--ink); font-weight: 650; }
.definition { max-width: 52rem; margin-top: 2.5rem; padding: 1.4rem 0; border-block: 1px solid var(--line); }
.definition ul { columns: 2; padding-left: 1.1rem; }
.definition li { break-inside: avoid; margin: .45rem 1rem .45rem 0; color: var(--muted); }
.faq h3 { margin: 1.1rem 0 .25rem; font-size: 1rem; font-weight: 650; line-height: 1.35; }
.faq p { max-width: 46rem; margin: 0; color: var(--text-soft); font-size: .92rem; }
.region-index { margin: 2.5rem 0 4rem; padding-top: 1rem; border-top: 1px solid var(--line-strong); }
.region-index ul { display: grid; grid-template-columns: repeat(4, 1fr); gap: .8rem 1.5rem; padding: 0; list-style: none; }
.region-index a { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: center; gap: .65rem; min-height: 2.25rem; font-size: .9rem; }
.directory-section { padding-top: 1rem; border-top: 1px solid var(--line-strong); }
.letter-nav { display: flex; flex-wrap: wrap; gap: .35rem; margin-block: 1.2rem 2.5rem; }
.letter-nav a { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border: 1px solid var(--line); border-radius: var(--radius-sm); font-size: .8125rem; text-decoration: none; }
.letter-nav a:hover { border-color: var(--accent); }
.directory-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.5rem 2rem; }
.directory-grid section { scroll-margin-top: 1rem; }
.directory-grid h3 { margin: 0 0 .55rem; padding-bottom: .3rem; border-bottom: 1px solid var(--line); color: var(--accent-dark); font-size: 1.25rem; font-weight: 620; }
.directory-grid ul { margin: 0; padding: 0; list-style: none; }
.directory-grid li { margin: .28rem 0; font-size: .86rem; }

.news-list, .prose, .article-index { max-width: 53rem; margin-top: 3rem; }
.news-list > ol { margin: 1rem 0 0; padding: 0; border-top: 1px solid var(--line-strong); list-style: none; }
.news-list li { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 1rem; align-items: start; min-height: 54px; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.news-list time, .news-list span { color: var(--muted); font-size: .8125rem; }
.news-list a { font-weight: 600; text-decoration: none; }
.news-list .news-thumbnail-link { grid-column: 1; grid-row: 1; }
.news-list__body { grid-column: 2; min-width: 0; }
.news-list__body > a { display: block; font-size: 1rem; line-height: 1.32; }
.news-list__body p { margin: .28rem 0 0; color: var(--muted); font-size: .8125rem; line-height: 1.4; }
.news-incident-link, .news-source-label { font-size: .8125rem; white-space: nowrap; }
.news-incident-link { color: var(--accent-dark); }
.page-intro > p.article-meta { display: flex; flex-wrap: wrap; gap: .45rem 1.25rem; margin-top: 1rem; color: var(--muted); font-size: .8125rem; font-weight: 550; }
.article-meta span + span::before { content: "·"; margin-right: 1.25rem; color: var(--line-strong); }
.article-hero { width: min(100%, 64rem); margin: 1.25rem 0 0; overflow: hidden; background: var(--line); }
.article-hero img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.prose { font-size: 1.04rem; line-height: 1.75; }
.article-body { max-width: 46rem; margin-top: 2.4rem; }
.prose h2 { margin-top: 2.7rem; font-size: 1.45rem; line-height: 1.25; text-wrap: balance; }
.prose h3 { margin-top: 2rem; font-size: 1.18rem; }
.prose p, .prose li { color: var(--prose-ink); }
.prose li + li { margin-top: .45rem; }
.prose img { display: block; width: 100%; height: auto; margin-block: 2rem; }
.article-body > h1:first-child { display: none; }
.quick-guide { margin: 0 0 2.8rem; padding: 1.2rem 1.3rem 1.3rem; border-left: 3px solid var(--accent); background: var(--surface-muted); }
.quick-guide p.quick-guide__label { margin: 0 0 .35rem; color: var(--muted); font-size: .8125rem; font-weight: 600; }
.quick-guide h2 { margin: 0; font-size: 1.2rem; }
.quick-guide ol, .quick-guide ul { margin: .8rem 0 0; padding-left: 1.2rem; }
.quick-guide li { padding-left: .2rem; color: var(--ink); font-size: .9rem; line-height: 1.55; }
.source-note { margin-top: 3.5rem; padding-top: 1.2rem; border-top: 1px solid var(--line-strong); }
.source-note h2 { margin: 0 0 .5rem; font-size: 1rem; }
.source-note p { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.6; }
.related-guides { max-width: 46rem; margin-top: 3rem; padding-top: 1rem; border-top: 1px solid var(--line-strong); }
.related-guides h2 { margin: 0; font-size: 1.2rem; font-weight: 620; }
.related-guides ul { margin: .8rem 0 0; padding: 0; list-style: none; }
.related-guides li { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); gap: 1rem; padding: .75rem 0; border-bottom: 1px solid var(--line); }
.related-guides span { color: var(--muted); font-size: .8125rem; font-weight: 600; }
.related-guides a { font-size: 1rem; font-weight: 600; text-decoration-thickness: 1px; }
.article-index { display: grid; gap: 0; border-top: 1px solid var(--line-strong); }
.article-index article { display: grid; grid-template-columns: 13rem minmax(0, 1fr); gap: 1.5rem; padding: 1.4rem 0; border-bottom: 1px solid var(--line); animation: editorial-rise 360ms both; }
.article-index article:nth-child(2) { animation-delay: 40ms; }
.article-index article:nth-child(3) { animation-delay: 80ms; }
.article-index article:first-child { grid-template-columns: minmax(20rem, 1.15fr) minmax(18rem, .85fr); padding-block: 1.6rem 2rem; }
.article-index__image { display: block; overflow: hidden; background: var(--line); }
.article-index img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; filter: saturate(.8) contrast(.98); transition: filter 180ms ease; }
.article-index__image:hover img { filter: saturate(1) contrast(1); }
.article-index h2 { margin: .25rem 0 0; font-size: 1.2rem; font-weight: 620; line-height: 1.25; text-wrap: balance; }
.article-index article:first-child h2 { font-size: clamp(1.5rem, 2.5vw, 2rem); }
.article-index h2 a { text-decoration-color: transparent; text-decoration-thickness: 1px; }
.article-index h2 a:hover { text-decoration-color: currentColor; }
.article-index p.article-index__summary { display: -webkit-box; margin: .55rem 0 0; overflow: hidden; color: var(--muted); font-size: .86rem; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.article-index__meta { display: flex; gap: .75rem; margin: 0; color: var(--muted); font-size: .8125rem; font-weight: 600; }
.article-index__meta span + span::before { content: "·"; margin-right: .75rem; color: var(--line-strong); }
@keyframes editorial-rise { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
.not-found-action { margin-top: 2rem; }

/* Below-the-list links on location and type pages. */
.second-click { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 0 clamp(1.5rem, 4vw, 3rem); margin-top: 3rem; border-top: 1px solid var(--line-strong); }
.second-click section { padding-block: 1.1rem 1.4rem; }
.second-click h2 { margin: 0; font-size: 1rem; font-weight: 620; letter-spacing: -.01em; }
.second-click ul { margin: .5rem 0 0; padding: 0; list-style: none; }
.second-click li { display: flex; justify-content: space-between; align-items: center; gap: .75rem; border-bottom: 1px solid var(--line); }
.second-click li a { display: inline-flex; align-items: center; min-width: 0; min-height: 44px; font-size: .9rem; font-weight: 600; text-decoration: none; }
.second-click li a:hover { text-decoration: underline; }
.second-click time { flex: 0 0 auto; color: var(--muted); font-size: .8125rem; font-variant-numeric: tabular-nums; }
.second-click p { margin: .6rem 0 0; font-size: .9rem; line-height: 1.6; }

/* Own-place card: every state has the same height, so the script fills it without moving content. */
.own-place { display: grid; gap: .5rem; margin-top: 2.5rem; padding: .75rem 1rem .25rem; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); }
.own-place__main { display: flex; align-items: center; justify-content: space-between; gap: .6rem 1rem; min-height: 44px; }
.own-place__link { display: grid; min-width: 0; color: var(--ink); text-decoration: none; }
.own-place__link strong, .own-place__link span { overflow: hidden; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.own-place__link strong { font-size: .95rem; font-weight: 650; }
.own-place__link span { color: var(--muted); font-size: .875rem; }
.own-place__link[href^="/halytykset/"] strong { color: var(--accent-dark); }
.own-place__link:hover strong { text-decoration: underline; }
.own-place__top { margin: 0; border-top: 1px solid var(--line); color: var(--muted); font-size: .8125rem; }
.own-place__top a { display: inline-flex; align-items: center; gap: .3rem; min-height: 44px; margin-left: .75rem; color: var(--ink); font-size: .875rem; text-decoration: none; }
.own-place__top a:hover { text-decoration: underline; }
.own-place__top strong { color: var(--accent-dark); font-variant-numeric: tabular-nums; }
@media (max-width: 680px) {
  .own-place__main { flex-direction: column; align-items: stretch; }
  .own-place__top a { margin: 0 .9rem 0 0; }
  .own-place__top span { display: block; padding-top: .5rem; }
}

/* Oma lista (/oma): one block per followed place, rows reuse .incident-list. */
.oma-places { display: grid; gap: 2rem; max-width: 53rem; }
.oma-place { padding-top: .75rem; border-top: 1px solid var(--line-strong); }
.oma-place__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.oma-place__head h2 { min-width: 0; margin: 0; font-size: 1.35rem; font-weight: 620; letter-spacing: -.02em; }
.oma-place__head h2 a { display: inline-flex; align-items: center; min-height: 44px; color: var(--ink); text-decoration: none; overflow-wrap: anywhere; }
.oma-place__head h2 a:hover { color: var(--accent-dark); text-decoration: underline; }
.oma-place__remove { flex: 0 0 auto; }
.oma-place__summary { margin: .1rem 0 .4rem; color: var(--muted); font-size: .875rem; }
.oma-place__summary a { color: var(--accent-dark); }
.oma-place__more { display: inline-flex; align-items: center; min-height: 44px; margin-top: .25rem; color: var(--accent-dark); }
.oma-empty { max-width: 40rem; padding: 1.25rem; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-muted); }
.oma-empty h2 { margin: 0 0 .5rem; font-size: 1.2rem; font-weight: 650; }
.oma-empty p { margin: 0 0 1rem; color: var(--text-soft); }
.oma-empty[hidden], .oma-empty [hidden] { display: none; }
.oma-note { max-width: 40rem; margin: 2.5rem 0 0; color: var(--muted); font-size: .8125rem; }

.site-footer { padding-block: 2.5rem; border-top: 1px solid var(--chrome-line); background: var(--chrome); }
.footer-grid { display: grid; grid-template-columns: 1.3fr 1fr .7fr; gap: 3rem; color: var(--chrome-muted); font-size: .82rem; }
.footer-grid strong { color: var(--chrome-ink); font-size: .92rem; }
.footer-grid p { margin: .4rem 0; }
.footer-grid nav { display: grid; align-content: start; gap: .4rem; }
.footer-grid a[href^="tel:"] { display: inline-flex; align-items: center; min-width: 44px; min-height: 44px; justify-content: center; font-weight: 700; }

@media (max-width: 1000px) {
  /* Two lines per row: icon | type + place, then time + chip; details below. Icon spans both lines. */
  .incident-row { --icon-gap: .6rem; grid-template-columns: var(--icon-size) minmax(0, 1fr) auto; gap: .15rem var(--icon-gap); padding: .55rem 0 .5rem; }
  .incident-row--large { margin-inline: -.5rem; padding-inline: .5rem; background: var(--large-bg); box-shadow: inset 3px 0 0 var(--accent); }
  .incident-content { display: contents; }
  .incident-icon { grid-column: 1; grid-row: 1 / span 2; margin-top: .05rem; padding: .1rem; }
  .incident-body { display: flex; grid-column: 2 / -1; grid-row: 1; flex-wrap: wrap; align-items: baseline; gap: 0 .6rem; }
  .incident-row h3 { line-height: 1.3; }
  .incident-row h3, .incident-row h3 a { hyphens: manual; overflow-wrap: break-word; }
  /* Place gets its own line and wraps; long municipality + region names are never cut. */
  .incident-row p.incident-place { flex: 1 1 100%; align-items: flex-start; min-width: 0; margin: 0; }
  .incident-place svg { margin-top: .2rem; }
  .incident-place > span { min-width: 0; overflow-wrap: anywhere; }
  .incident-time { grid-column: 2; grid-row: 2; align-self: center; padding: 0; }
  .incident-labels { grid-column: 3; grid-row: 2; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .25rem .5rem; min-width: 0; }
  .incident-labels .chip { padding-block: 0; line-height: 1.5; }
  /* 44 px tap targets without taller rows: invisible hit areas around chips and the details toggle. */
  .incident-labels a.chip::before { content: ""; position: absolute; inset: -.65rem -.2rem; }
  .incident-details { grid-column: 2 / -1; grid-row: 3; margin: 0; border-top: 0; white-space: normal; }
  .incident-details summary { min-height: 44px; margin-block: -.45rem; }
  .incident-details__content { max-width: none; padding: 0 0 .5rem 1.05rem; }
  .page-main--home .incident-section {
    padding: .75rem .75rem .9rem;
    box-shadow: none;
  }
}

@media (max-width: 800px) {
  .shell { width: min(calc(100% - 2rem), var(--measure)); }
  .page-main { width: 100%; padding-inline: 1rem; }
  .page-main { padding-top: .8rem; }
  .breadcrumbs { margin-bottom: 1.25rem; }
  .page-intro { padding-block: .7rem 1.6rem; }
  .page-main--home .page-intro { padding-bottom: 1.15rem; }
  .lead-rest { display: none; }
  .page-title-row { gap: .7rem; }
  .region-crest--title { width: 40px; height: 49px; }
  .page-intro h1 { font-size: clamp(2rem, 10vw, 3.1rem); }
  .freshness { justify-content: flex-start; align-items: baseline; gap: .15rem .9rem; padding: .6rem 0; background: var(--surface); }
  .freshness > span { white-space: nowrap; }
  .freshness > a { margin-left: auto; }
  .stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .stats div, .stats div + div { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: .2rem; padding: .8rem .7rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .stats div:first-child { padding-left: 0; }
  .stats div:last-child { border-right: 0; }
  .stats dt { line-height: 1.25; }
  .stats dd { font-size: 1.35rem; }
  .incident-search { padding: 1rem; }
  .incident-search form { grid-template-columns: 1fr; gap: .85rem; }
  .clear-search { width: 100%; }
  .content-grid { grid-template-columns: 1fr; margin-top: 2rem; }
  .incident-search + .content-grid { margin-top: 1.5rem; }
  .ad-slot { min-height: 280px; height: 280px; }
  .ad-slot--top { display: flex; min-height: 100px; height: 100px; margin: .75rem 0 0; }
  .ad-slot--side { display: none; }
  .region-index ul, .directory-grid { grid-template-columns: repeat(2, 1fr); }
  .definition ul { columns: 1; }
  .news-list li { grid-template-columns: 72px minmax(0, 1fr); gap: 1rem; }
  .article-index article, .article-index article:first-child { grid-template-columns: 10rem minmax(0, 1fr); gap: 1rem; }
  .article-index article:first-child h2 { font-size: 1.35rem; }
  .footer-grid { grid-template-columns: 1fr; gap: 1.25rem; }
  .footer-grid nav { gap: 0; }
  .footer-grid a { display: inline-flex; align-items: center; min-height: 44px; }
  .page-main--home {
    width: min(calc(100% - clamp(.5rem, 2vw, 2rem)), 80rem);
    border-radius: 8px 8px 0 0;
  }
  .page-main--home .page-intro {
    padding-block: 1rem .85rem;
  }
  .page-main--home .page-intro h1 {
    max-width: 11ch;
    font-size: clamp(2.35rem, 10vw, 3rem);
  }
  .page-main--home .freshness {
    padding-block: .65rem;
  }
  .page-main--home .stats {
    gap: .45rem;
    padding: .65rem 0 0;
  }
  .page-main--home .stats div,
  .page-main--home .stats div + div {
    display: block;
    min-height: 5.2rem;
    padding: .75rem .65rem;
    border: 1px solid var(--panel-line);
  }
  .page-main--home .stats div:first-child { padding-left: .65rem; }
  .page-main--home .stats dt { font-size: .8125rem; }
  .page-main--home .stats dd { font-size: 1.5rem; }
  .page-main--home .stat-icon { display: none; }
  .page-main--home .content-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    margin-top: 1rem;
  }
  .page-main--home .incident-section {
    order: 1;
  }
  .page-main--home .side-summary { order: 2; }
}

@media (max-width: 680px) {
  .header-row { display: block; padding-top: .9rem; }
  .primary-nav { gap: 1.1rem; overflow-x: auto; }
  .primary-nav a { display: inline-flex; align-items: center; min-height: 44px; padding-block: 0; white-space: nowrap; }
}

@media (max-width: 460px) {
  .shell { width: min(calc(100% - 1.25rem), var(--measure)); }
  .page-main { width: 100%; padding-inline: .75rem; }
  .page-main--home { width: min(calc(100% - clamp(.5rem, 2vw, 2rem)), 80rem); }
  .brand { font-size: 1.05rem; }
  .brand-icon { width: 2rem; height: 2rem; }
  .primary-nav { justify-content: space-between; gap: .65rem; font-size: .84rem; }
  .page-intro--traffic h1 { max-width: none; font-size: clamp(1.65rem, 7.35vw, 2rem); letter-spacing: -.035em; hyphens: auto; overflow-wrap: anywhere; }
  .region-index ul, .directory-grid { grid-template-columns: 1fr 1fr; gap-inline: 1rem; }
  .incident-row { padding-block: .55rem .45rem; }
  .search-input-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  .search-input-row input { padding-left: 2.45rem; font-size: .9rem; }
  .search-submit { min-width: 4.75rem; padding-inline: 1rem; }
  .article-meta span + span::before { margin-right: .45rem; }
  .page-intro > p.article-meta { gap: .35rem .45rem; }
  .article-index article, .article-index article:first-child { grid-template-columns: 1fr; }
  .article-index img { max-height: 11rem; }
  .related-guides li { grid-template-columns: 1fr; gap: .2rem; }
}

/* Phones: compact header, intro, near-me bar, one-line stats and search so the first incident is near the top. */
@media (max-width: 680px) {
  .header-row { padding-top: .45rem; }
  .brand { font-size: 1rem; }
  .brand-icon { width: 1.75rem; height: 1.75rem; }
  .page-intro h1 { font-size: clamp(1.75rem, 7vw, 2rem); }
  .page-intro > p { margin-top: .6rem; font-size: .95rem; line-height: 1.5; }
  .page-main--home .page-intro { padding-block: .7rem .45rem; }
  .page-main--home .page-intro h1 { max-width: none; font-size: 1.75rem; line-height: 1.05; }
  .page-main--home .page-intro > p { margin-top: .4rem; font-size: .9375rem; }
  .page-main--home .freshness { padding-block: .45rem .55rem; }
  .near-bar { margin: .6rem 0 0; }
  .near-bar .location-button { padding: .4rem .7rem; font-size: .875rem; }
  .near-bar select { font-size: .875rem; }
  .near-bar select:disabled { display: none; }
  .near-bar:has(select:disabled) .location-button { border-radius: var(--radius-md); }
  .near-bar__search { display: inline-flex; align-items: center; margin-left: auto; padding: .4rem 1.1rem; border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: var(--surface); color: var(--ink); font-size: .875rem; font-weight: 600; text-decoration: none; }
  /* One line of stats; scrolls sideways instead of wrapping on the narrowest screens. */
  .stats,
  .page-main--home .stats { display: flex; flex-wrap: nowrap; gap: 1rem; padding: .55rem .15rem; overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
  .stats div, .stats div + div, .stats div:first-child,
  .page-main--home .stats div,
  .page-main--home .stats div + div,
  .page-main--home .stats div:first-child { display: flex; flex: 0 0 auto; flex-direction: row-reverse; justify-content: flex-end; align-items: baseline; gap: .3rem; min-height: 0; padding: 0; border: 0; background: transparent; }
  .stats dt, .page-main--home .stats dt { color: var(--muted); font-size: .8125rem; }
  .stats dd, .page-main--home .stats dd { margin: 0; font-size: 1rem; font-weight: 700; letter-spacing: 0; }
  .page-main--home .stats { padding-bottom: 0; }
  .page-main--home .range-tabs { margin: .45rem 0 0; }
  .range-tabs a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding-block: 0; }
  .incident-search { margin-top: .6rem; padding: .6rem; }
  .search-field label { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
  .incident-search form { gap: .5rem; }
  .search-input-row { min-height: 44px; }
  .search-status { margin-top: .4rem; }
  .search-status:has(> .search-hint) { min-height: 0; margin: 0; }
  .search-hint { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
  .page-main--home .content-grid { margin-top: .6rem; }
}

/* Small phones: three equal stat columns with wrapping labels instead of a sideways scroll; capped guide hero. */
@media (max-width: 479px) {
  .stats,
  .page-main--home .stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; padding: 0; overflow: visible; white-space: normal; }
  .stats div, .stats div + div, .stats div:first-child,
  .page-main--home .stats div,
  .page-main--home .stats div + div,
  .page-main--home .stats div:first-child { flex-direction: column-reverse; align-items: flex-start; gap: .1rem; min-width: 0; padding: .5rem; border-right: 1px solid var(--line); }
  .stats div:last-child, .page-main--home .stats div:last-child { border-right: 0; }
  .stats dt, .page-main--home .stats dt { line-height: 1.25; overflow-wrap: anywhere; hyphens: auto; }
  .article-hero img { max-height: 200px; }
}

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Weekly pages (/viikko): label and count on one row; links get a 44px tap area. */
.page-main--weekly .definition ul { padding-left: 0; list-style: none; }
.page-main--weekly .definition li { display: flex; justify-content: space-between; align-items: center; gap: .75rem; }
.page-main--weekly .definition li strong { font-variant-numeric: tabular-nums; }
.page-main--weekly .definition li a,
.page-main--weekly .side-summary .text-link,
.page-main--weekly .breadcrumbs a,
.page-main--weekly .freshness > a { display: inline-flex; align-items: center; min-height: 44px; }

/* Home strip to the group pages (/palot-tanaan, /liikenneonnettomuudet-tanaan): 44px tap areas; the " · " separator is aria-hidden and hidden here. */
.group-links { display: flex; flex-wrap: wrap; align-items: center; gap: 0 .75rem; margin: .5rem 0 0; }
.group-links a { display: inline-flex; align-items: center; min-height: 44px; }
.group-links span { display: none; }

/* "Muu pelastustehtävä" cards: one clamped line of the bulletin text under the generic heading. */
.incident-row p.incident-excerpt { display: -webkit-box; margin: .1rem 0 0; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 1; line-clamp: 1; overflow-wrap: anywhere; }
@media (max-width: 1000px) {
  .incident-row p.incident-excerpt { flex: 1 1 100%; min-width: 0; margin: 0; }
}