/* The Fires page (fires.inc, scripts/fires.js): the map and the words beside
   it, in the Radar family's panel (css/radar.css carries the panel, the
   strip and the --rs-* tokens; this file carries only the map).

   THE MAP'S COLORS ARE ITS OWN, not the panel's: sea, land, the state lines,
   the rings, the fires.  Light and dark each have a set, keyed by
   .theme-dark as radar.css keys its tokens, with no prefers-color-scheme
   rule, for the reason radar.css gives.  The words over the map are HTML
   (scripts/fires.js says why) and take the panel's type sizes and the
   phone's floors; each carries a halo in its ground's color so it reads
   where it crosses a coastline.  Every ink here scores APCA Lc 60 or
   better on the ground it sits on (tools/contrast.py, 2026-09-28):
   #3f4955 on land 81.7 and on sea 75.8; #246a92 on sea 64.0; in dark
   #b2bae1 on land -61.8 and on sea -64.9; #99c2dd on sea -65.4. */

/* ---- the layout ---------------------------------------------------- */
.rs .fm-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:1.5rem;align-items:start;margin-top:.25rem}
.rs .fm-box{position:relative;min-width:0}
.rs .firemap{width:100%;height:auto;display:block;border:.0625rem solid var(--rs-rule);border-radius:.4rem}
.rs .fm-labels{position:absolute;inset:0;pointer-events:none}
.rs .fm-lab{position:absolute;transform:translate(0,-50%);white-space:nowrap;line-height:1;
            font-size:.7em;letter-spacing:.01em}
.rs .fm-townlab{color:#3f4955;margin-left:.45em;text-shadow:0 0 .2em #f3efe6,0 0 .2em #f3efe6,0 0 .3em #f3efe6}
.rs .fm-townlab--left{transform:translate(-100%,-50%);margin-left:-.45em}
.rs .fm-ringlab{color:#246a92;font-weight:600;text-shadow:0 0 .2em #dbe7f0,0 0 .2em #dbe7f0,0 0 .3em #dbe7f0}
.rs .fm-stationlab{color:#246a92;font-weight:700;font-size:.75em;transform:translate(0,-110%);
                   text-shadow:0 0 .2em #f3efe6,0 0 .2em #f3efe6,0 0 .3em #f3efe6}

/* ---- the map ------------------------------------------------------- */
.rs .fm-sea{fill:#dbe7f0}
.rs .fm-land{fill:#f3efe6;stroke:#9aa3ad;stroke-width:.8}
.rs .fm-lake{fill:#dbe7f0;stroke:#9aa3ad;stroke-width:.5}
.rs .fm-state{fill:none;stroke:#9aa3ad;stroke-width:.9;stroke-dasharray:4 3}
.rs .fm-ring{fill:none;stroke:#246a92;stroke-width:.7;stroke-dasharray:3 3;opacity:.7}
.rs .fm-reach{stroke-dasharray:none;stroke-width:1.1;opacity:.9}
.rs .fm-town{fill:#545e69}
.rs .fm-steady{fill:none;stroke:#6b7078;stroke-width:1.3}
.rs .fm-fire{fill:#d9480f;fill-opacity:.6;stroke:#a8320a;stroke-width:.9}
.rs .fm-station{fill:#246a92;stroke:#ffffff;stroke-width:1}

.theme-dark .rs .fm-sea,.theme-dark .rs .fm-lake{fill:#0f1730}
.theme-dark .rs .fm-land{fill:#232b45;stroke:#5a6486}
.theme-dark .rs .fm-lake{stroke:#5a6486}
.theme-dark .rs .fm-state{stroke:#5a6486}
.theme-dark .rs .fm-ring{stroke:#99c2dd}
.theme-dark .rs .fm-town{fill:#b2bae1}
.theme-dark .rs .fm-steady{stroke:#9aa3bd}
.theme-dark .rs .fm-fire{fill:#ff7a3d;stroke:#ffb08a}
.theme-dark .rs .fm-station{fill:#99c2dd;stroke:#0a0f22}
.theme-dark .rs .fm-townlab{color:#b2bae1;text-shadow:0 0 .2em #232b45,0 0 .2em #232b45,0 0 .3em #232b45}
.theme-dark .rs .fm-ringlab{color:#99c2dd;text-shadow:0 0 .2em #0f1730,0 0 .2em #0f1730,0 0 .3em #0f1730}
.theme-dark .rs .fm-stationlab{color:#99c2dd;text-shadow:0 0 .2em #232b45,0 0 .2em #232b45,0 0 .3em #232b45}

/* ---- the words beside it ------------------------------------------- */
.rs .fm-words{min-width:0}
.rs .fm-words p{margin:.4rem 0 .6rem;line-height:1.5;color:var(--rs-ink-2)}
.rs .fm-lead{font-size:1.15em;color:var(--rs-ink)}
.rs .fm-lead b{font-size:1.35em;font-weight:600}
.rs .fm-note{color:var(--rs-ink-3)}
.rs .fm-table{border-collapse:collapse;width:100%;font-size:.92em;margin:.5rem 0}
.rs .fm-table th,.rs .fm-table td{text-align:left;padding:.3rem .5rem .3rem 0;border-bottom:.0625rem solid var(--rs-rule);vertical-align:top}
.rs .fm-table thead th{color:var(--rs-muted);font-size:.8em;letter-spacing:.06em;text-transform:uppercase;font-weight:600}
.rs .fm-table td{white-space:nowrap;font-variant-numeric:tabular-nums}
.rs .fm-aside{color:var(--rs-muted);font-size:.86em}
.rs .fm-aside a,.rs .fm-words a{color:var(--rs-link)}

/* ---- the phone ----------------------------------------------------- */
@media (max-width: 600px){.rs .fm-grid{grid-template-columns:1fr;gap:1rem}}
@media (max-width: 600px){.rs .fm-lab{font-size:var(--tp-phone-label)}}
@media (max-width: 600px){.rs .fm-stationlab{font-size:var(--tp-phone-label)}}
@media (max-width: 600px){.rs .fm-words p{font-size:var(--tp-phone-body)}}
@media (max-width: 600px){.rs .fm-aside,.rs .fm-table,.rs .fm-table thead th{font-size:var(--tp-phone-label)}}
@media (max-width: 600px){.rs .fm-table td,.rs .fm-table tbody th{font-size:var(--tp-phone-body)}}
@media (max-width: 600px){.rs .fm-table td{white-space:normal;padding-right:.4rem}}
@media (max-width: 600px){.rs .fm-lead{font-size:max(1.15em, var(--tp-phone-body))}}