/* Art direction: a dispatch-desk wire printout. Warm paper background, near-black ink,
   hairline rules between rows, monospace for page text like a pager readout.
   Colour is reserved for meaning: red = emergency, amber = non-emergency, blue = admin. */
:root{
  --paper:#fbfaf7; --ink:#1b1f24; --muted:#4f5a64; --rule:#dcd8cf; --rule-strong:#b9b3a6;
  --panel:#ffffff; --hover:#f3f1ec;
  --red:#a8231b; --red-bg:#fbeceb; --amber:#7a4f00; --amber-bg:#fdf3df; --blue:#1d5482; --blue-bg:#e8f0f8;
  --green:#1e6b3a; --green-bg:#e6f4ea; --focus:#1d5482;
  --btn-ink:#fff; --btn-hover:#33393f; --fresh:#fff3c4; --fresh-still:#fff8dc; --warn-dot:#b07a00;
  --map-sea:#f4f7f9; --map-land:#fffdf8; --map-edge:#8b8578; --grid:#e4e0d8; --backdrop:rgba(27,31,36,.35);
  color-scheme:light;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SFMono-Regular","DejaVu Sans Mono",Menlo,Consolas,monospace;
}
:root[data-theme="dark"]{--paper:#14171a; --ink:#e8e6e1; --muted:#a9b1b9; --rule:#2c3238; --rule-strong:#47505a;
  --panel:#1c2024; --hover:#22272c;
  --red:#ff8a80; --red-bg:#3a1a18; --amber:#f0c060; --amber-bg:#33270f; --blue:#8cc4f5; --blue-bg:#15283a;
  --green:#7fd49a; --green-bg:#14301e; --focus:#8cc4f5;
  --btn-ink:#14171a; --btn-hover:#c9c6bf; --fresh:#3a3412; --fresh-still:#2e2a14; --warn-dot:#e0a82e;
  --map-sea:#101418; --map-land:#1f2428; --map-edge:#6b7480; --grid:#2c3238; --backdrop:rgba(0,0,0,.6); color-scheme:dark}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]):not([data-theme="dark"]){--paper:#14171a; --ink:#e8e6e1; --muted:#a9b1b9; --rule:#2c3238; --rule-strong:#47505a;
  --panel:#1c2024; --hover:#22272c;
  --red:#ff8a80; --red-bg:#3a1a18; --amber:#f0c060; --amber-bg:#33270f; --blue:#8cc4f5; --blue-bg:#15283a;
  --green:#7fd49a; --green-bg:#14301e; --focus:#8cc4f5;
  --btn-ink:#14171a; --btn-hover:#c9c6bf; --fresh:#3a3412; --fresh-still:#2e2a14; --warn-dot:#e0a82e;
  --map-sea:#101418; --map-land:#1f2428; --map-edge:#6b7480; --grid:#2c3238; --backdrop:rgba(0,0,0,.6); color-scheme:dark}}

*{box-sizing:border-box}
html,body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.45 var(--sans)}
body{overflow-x:clip}
a{color:var(--blue)}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--btn-ink);padding:8px 12px;z-index:10}
.skip:focus{left:8px}
[hidden]{display:none!important}

.top{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px;padding:12px 20px 0;border-bottom:2px solid var(--ink)}
.brand{display:flex;flex-direction:column;min-width:0}
.title{font-weight:700;font-size:19px;letter-spacing:-.01em}
.statusline{color:var(--muted);font-size:13px;display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--muted);margin-right:5px;vertical-align:baseline}
.dot.ok{background:var(--green)} .dot.warn{background:var(--warn-dot)} .dot.bad{background:var(--red)}
.nav{display:flex;gap:2px;overflow-x:auto;flex:1 1 auto;order:3;width:100%;scrollbar-width:thin}
.nav a{padding:9px 12px;color:var(--ink);text-decoration:none;border-bottom:3px solid transparent;white-space:nowrap;font-size:14px}
.nav a:hover{background:var(--hover)}
.nav a[aria-current="page"]{border-bottom-color:var(--red);font-weight:600}
.who{margin-left:auto;display:flex;gap:8px;align-items:center;font-size:13px;color:var(--muted)}

main{padding:16px 20px 60px;max-width:1280px;margin:0 auto}
h1{font-size:20px;margin:4px 0 12px}
h2{font-size:16px;margin:24px 0 8px;padding-bottom:4px;border-bottom:1px solid var(--rule-strong)}
h2:first-child{margin-top:4px}
p.note{color:var(--muted);margin:4px 0 12px}
.toolbar{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:flex-end;margin:0 0 12px;padding-bottom:12px;border-bottom:1px solid var(--rule)}
.field{display:flex;flex-direction:column;gap:3px;font-size:13px;color:var(--muted)}
.field.inline{flex-direction:row;align-items:center;gap:6px;color:var(--ink)}
input,select,textarea,button{font:inherit;color:var(--ink)}
input[type=text],input[type=password],input[type=number],input[type=search],input[type=datetime-local],select,textarea{
  border:1px solid var(--rule-strong);background:var(--panel);border-radius:4px;padding:6px 8px;min-height:34px;max-width:100%}
textarea{font-family:var(--mono);font-size:13px;width:100%;min-height:120px}
.btn{border:1px solid var(--ink);background:var(--ink);color:var(--btn-ink);border-radius:4px;padding:6px 12px;min-height:34px;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--btn-hover)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--rule-strong)}
.btn.ghost:hover{background:var(--hover)}
.btn.danger{background:var(--red);border-color:var(--red)}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.err{color:var(--red);font-size:13px}
.ok-text{color:var(--green)}

/* message rows */
.msgs{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.msg{display:grid;grid-template-columns:var(--feed-cols);gap:4px 14px;padding:10px 6px;border-bottom:1px solid var(--rule);cursor:pointer}
.msg:hover{background:var(--hover)}
.msg.fresh{animation:fresh 4s ease-out}
@keyframes fresh{from{background:var(--fresh)}to{background:transparent}}
@media (prefers-reduced-motion:reduce){.msg.fresh{animation:none;background:var(--fresh-still)}}
.msg .when{font-family:var(--mono);font-size:13px;color:var(--muted)}
.msg .when b{display:block;color:var(--ink);font-size:14px;font-weight:600}
.msg .text{font-family:var(--mono);font-size:14px;word-break:break-word;white-space:pre-wrap}
.msg .meta{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:13px;color:var(--muted);margin-top:4px}
.msg .tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:3px}
.tag{display:inline-block;font-size:12px;line-height:18px;padding:0 7px;border-radius:3px;border:1px solid var(--rule-strong);color:var(--ink);background:var(--panel)}
.tag.emergency{color:var(--red);border-color:var(--red);background:var(--red-bg);font-weight:600}
.tag.non-emergency{color:var(--mauve);border-color:var(--mauve);background:var(--mauve-bg)}
.tag.admin{color:var(--blue);border-color:var(--blue);background:var(--blue-bg)}
.tag.suspect{color:var(--muted);border-style:dashed}
.rcpt{display:inline-flex;gap:4px;align-items:baseline}
.rcpt .cap{font-family:var(--mono);font-size:12px;color:var(--muted)}
.more{display:flex;justify-content:center;padding:14px}
.empty{padding:28px 6px;color:var(--muted);border-bottom:1px solid var(--rule)}
@media (max-width:640px){
  .msg{grid-template-columns:1fr}
  .msg .when b{display:inline;margin-right:8px}
  main{padding:12px 12px 60px}
  .top{padding:10px 12px 0}
}

/* tables */
.tablewrap{overflow-x:auto;border-top:1px solid var(--rule)}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{text-align:left;padding:7px 8px;border-bottom:1px solid var(--rule);vertical-align:top}
th{font-weight:600;font-size:13px;color:var(--muted);background:var(--paper);position:sticky;top:0}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
td.mono{font-family:var(--mono);font-size:13px}
tr.best td{background:var(--green-bg)}

/* stat strip */
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:0;border-top:1px solid var(--rule);border-left:1px solid var(--rule);margin-bottom:8px}
.kpi{padding:10px 12px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.kpi .k{font-size:13px;color:var(--muted)} .kpi .v{font-size:22px;font-weight:650;font-variant-numeric:tabular-nums}
.kpi .s{font-size:12px;color:var(--muted)}
.chart{width:100%;overflow-x:auto}
.chart svg{display:block;min-width:520px;width:100%;height:auto}
.chart text{font:12px var(--sans);fill:var(--muted)}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin:4px 0}
.sw{display:inline-block;width:11px;height:11px;margin-right:5px;vertical-align:-1px;border-radius:2px}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
@media (max-width:820px){.cols{grid-template-columns:1fr}}

/* map */
.mapwrap{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:16px}
@media (max-width:900px){.mapwrap{grid-template-columns:1fr}}
.mapbox{position:relative;border:1px solid var(--rule-strong);background:var(--map-sea);border-radius:4px;overflow:hidden;touch-action:none}
.mapbox svg{display:block;width:100%;height:auto;max-height:70vh;cursor:grab}
.mapbox svg.drag{cursor:grabbing}
.mapbox .land{fill:var(--map-land);stroke:var(--map-edge);stroke-width:1.2;vector-effect:non-scaling-stroke}
.mapbox .pt{stroke:var(--paper);stroke-width:1.5;vector-effect:non-scaling-stroke;cursor:pointer}
.mapbox .pt:hover,.mapbox .pt.sel{stroke:var(--ink);stroke-width:2.5}
.mapbox .city{fill:var(--muted);font:11px var(--sans)}
.zoom{position:absolute;right:8px;top:8px;display:flex;flex-direction:column;gap:4px}
.zoom .btn{min-width:36px;padding:4px}
.attrib{font-size:12px;color:var(--muted);margin-top:6px}

dialog{border:1px solid var(--rule-strong);border-radius:6px;padding:0;max-width:760px;width:calc(100% - 24px);background:var(--panel);color:var(--ink)}
dialog::backdrop{background:var(--backdrop)}
.dlg-head{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--rule)}
.dlg-head h2{margin:0;border:0;padding:0}
#detail-body{padding:12px 16px 18px}
#detail-body .text{font-family:var(--mono);white-space:pre-wrap;word-break:break-word;font-size:15px;padding:10px;background:var(--paper);border:1px solid var(--rule);border-radius:4px}
dl.kv{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:12px 0;font-size:14px}
dl.kv dt{color:var(--muted)} dl.kv dd{margin:0;word-break:break-word}

.login{max-width:380px;margin:9vh auto;padding:0 12px}
.login h1{font-size:22px;margin-bottom:4px}
.login .field{margin:12px 0}
.login input{width:100%}
.toast{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);background:var(--ink);color:var(--btn-ink);padding:10px 14px;border-radius:5px;display:flex;gap:12px;align-items:center;max-width:calc(100% - 24px);z-index:20}
.toast button{background:transparent;border:1px solid var(--btn-ink);color:var(--btn-ink);border-radius:4px;padding:3px 10px;cursor:pointer}
.formgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px 18px;margin-bottom:12px}
.formgrid .field input,.formgrid .field select{width:100%}
.hint{font-size:12px;color:var(--muted)}
.progress{height:8px;background:var(--rule);border-radius:4px;overflow:hidden;margin:8px 0;max-width:480px}
.progress > div{height:100%;background:var(--blue);transition:width .4s}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* theme: SVG presentation attributes are overridden by CSS so charts and map follow the theme */
.chart line{stroke:var(--grid)}
.chart rect[fill="#1b1f24"]{fill:var(--ink)}
.mapbox circle:not(.pt){fill:var(--map-edge)}
.themepick{display:flex;align-items:center;gap:6px}
.themepick select{min-height:30px;padding:2px 6px;background:var(--panel);border:1px solid var(--rule-strong);border-radius:4px}
input,select,textarea{background:var(--panel)}

.feedhead{display:grid;grid-template-columns:var(--feed-cols);gap:4px 14px;padding:6px 6px;font-size:13px;font-weight:600;color:var(--muted);border-top:1px solid var(--rule)}
.msg .c-cap,.msg .c-org,.msg .c-brig{font-size:14px;min-width:0;overflow-wrap:anywhere}
.msg .c-cap{font-family:var(--mono)}
.msg .line{display:block}
.msg .c-msg{min-width:0}
.msg a.addr{color:var(--blue);text-decoration:underline;text-underline-offset:2px}
@media (max-width:900px){
  .feedhead{display:none}
  .msg{grid-template-columns:1fr}
  .msg .c-cap,.msg .c-org,.msg .c-brig,.msg .c-prio{display:flex;gap:8px;flex-wrap:wrap}
  .msg .c-cap::before,.msg .c-org::before,.msg .c-brig::before,.msg .c-prio::before{content:attr(data-h);color:var(--muted);min-width:96px;font-family:var(--sans);font-size:13px}
  .msg .line{display:inline}
}

.healthpills{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 2px}
.pill{display:inline-flex;align-items:center;font-size:13px;font-weight:600;padding:2px 9px;border-radius:999px;border:1px solid}
.pill.ok{color:var(--green);background:var(--green-bg);border-color:var(--green)}
.pill.bad{color:var(--red);background:var(--red-bg);border-color:var(--red)}
.offline-banner{background:var(--red-bg);color:var(--red);border-bottom:2px solid var(--red);padding:8px 20px;font-weight:600;font-size:14px}
.msg .when .since{display:block;font-size:12px;color:var(--muted)}
.msg .when .day{display:block;font-size:12px;color:var(--muted)}
.msg .line.guess{font-style:italic}
.msg .line.muted{color:var(--muted)}
.msg .meta .primary{font-weight:600;color:var(--ink)}
@media (max-width:900px){.msg .when .since,.msg .when .day{display:inline;margin-right:8px}}

.top{position:relative}
.lastpage{position:absolute;left:50%;top:12px;transform:translateX(-50%);text-align:center;font-size:14px;color:var(--ink);white-space:nowrap}
.lastpage .lp-label{color:var(--muted)}
.lastpage #lp-ago{font-weight:700;font-variant-numeric:tabular-nums}
.lastpage .lp-ts{color:var(--muted);font-variant-numeric:tabular-nums}
@media (max-width:900px){.lastpage{position:static;transform:none;width:100%;text-align:left;order:2;white-space:normal}}
.newpill{position:fixed;top:12px;left:50%;transform:translateX(-50%);z-index:30;background:var(--blue);color:var(--paper);border:0;border-radius:999px;padding:6px 14px;font:600 13px var(--sans);cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.25)}
.newpill:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.msg .c-prio{min-width:0}

.iconbtn{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:34px;height:34px;padding:0 8px;border:1px solid var(--rule-strong);border-radius:6px;background:var(--panel);color:var(--ink);cursor:pointer;position:relative}
.iconbtn:hover{background:var(--hover)}
.iconbtn[aria-pressed="true"]{background:var(--amber-bg);border-color:var(--amber);color:var(--amber)}
.iconbtn .badge{font:700 11px var(--sans);background:var(--red);color:var(--paper);border-radius:999px;padding:1px 6px}
.qbox{display:inline-flex;align-items:center;gap:6px;margin-left:auto;border:1px solid var(--rule-strong);border-radius:6px;background:var(--panel);padding:0 8px;height:34px;color:var(--muted);min-width:0;flex:0 1 340px}
.qbox input{border:0;background:transparent;outline:none;min-width:0;width:100%;height:32px;padding:0;color:var(--ink)}
.qbox:focus-within{outline:3px solid var(--focus);outline-offset:1px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:900px){.qbox{flex:1 1 100%;margin-left:0}}

/* Frozen header, feed toolbar and column headings */
:root{--hdr-h:96px;--bar-h:52px}
.top{position:sticky;top:0;z-index:25;background:var(--paper)}
.feedbar{position:sticky;top:var(--hdr-h);z-index:20;background:var(--paper);margin:0 -20px 0;padding:10px 20px;border-bottom:1px solid var(--rule)}
.feedhead{position:sticky;top:calc(var(--hdr-h) + var(--bar-h));z-index:19;background:var(--paper)}
.offline-banner{position:sticky;top:var(--hdr-h);z-index:24}
.newpill{top:calc(var(--hdr-h) + var(--bar-h) + 36px)}
.msg{scroll-margin-top:calc(var(--hdr-h) + var(--bar-h) + 36px)}
dialog{z-index:40}

.updnote{margin:4px auto 0;display:inline-block;background:var(--amber-bg);color:var(--amber);border:1px solid var(--amber);border-radius:6px;padding:3px 10px;font-weight:600;font-size:13px;white-space:normal}
.updnote[hidden]{display:none}
.pill.warn{color:var(--amber);background:var(--amber-bg);border-color:var(--amber)}
.statusline .ver{font-family:var(--mono);color:var(--muted)}

.sugs{margin-top:4px;display:flex;flex-direction:column;gap:3px}
.sug{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink);background:var(--blue-bg);border:1px solid var(--blue);border-radius:5px;padding:2px 4px 2px 6px}
.sug.done{background:transparent;border-style:dashed;color:var(--muted)}
.sugtxt{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
.sugbtn{width:24px;height:24px;border-radius:4px;border:1px solid;cursor:pointer;font-weight:700;line-height:1;background:var(--panel)}
.sugbtn.ok{color:var(--green);border-color:var(--green)}
.sugbtn.no{color:var(--red);border-color:var(--red)}
.sugbtn:hover{background:var(--hover)}
.linkbtn{border:0;background:none;color:var(--blue);text-decoration:underline;cursor:pointer;padding:0;font:inherit}

td.acts{white-space:nowrap}
td.acts .iconbtn{margin-right:4px}
.iconbtn.danger{color:var(--red)}
.iconbtn.danger:hover{background:var(--red-bg)}
.iconbtn.okbtn{color:var(--green);border-color:var(--green)}
tr.editing td{background:var(--blue-bg)}
tr.editing input{width:100%;min-width:0}

.orgb{display:inline-flex;align-items:center;gap:4px;font-weight:600;font-size:13px;padding:1px 7px;border-radius:999px;border:1px solid;margin:1px 0;width:max-content;max-width:100%}
.orgb svg{width:13px;height:13px;flex:0 0 auto}


.orgb.org-ses svg{color:#d9730d}
.orgb.org-other{color:var(--ink);background:#ffffff;border-color:var(--rule-strong)}
:root[data-theme="dark"] .orgb.org-other{background:#f2f2f2;color:#1b1f24;border-color:#f2f2f2}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .orgb.org-other{background:#f2f2f2;color:#1b1f24;border-color:#f2f2f2}}
.msg .c-org{display:flex;flex-direction:column;align-items:flex-start}

.updrow{order:2;width:100%;display:flex;justify-content:center}
.updrow:has(.updnote[hidden]):has(.recnote[hidden]){display:none}
.updnote{margin:4px 0 2px}

/* Agency colours, deliberately distinct from the priority tags:
   Emergency = brick red, Non-emergency = brown amber (see .tag).
   CFA = bright signal red, FRV = deep raspberry, SES = vivid safety orange. */
:root{--cfa:#c8102e;--cfa-bg:#fde7ea;--frv:#8a1849;--frv-bg:#f6e3ec;--ses:#a63c00;--ses-bg:#ffe7d4;--ses-edge:#f47920}
:root[data-theme="dark"]{--cfa:#ff6b7d;--cfa-bg:#3a1218;--frv:#e98bb4;--frv-bg:#33142a;--ses:#ffa45c;--ses-bg:#3a2210;--ses-edge:#f47920}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--cfa:#ff6b7d;--cfa-bg:#3a1218;--frv:#e98bb4;--frv-bg:#33142a;--ses:#ffa45c;--ses-bg:#3a2210;--ses-edge:#f47920}}
.orgb.org-cfa{color:var(--cfa);background:var(--cfa-bg);border-color:var(--cfa)}
.orgb.org-frv{color:var(--frv);background:var(--frv-bg);border-color:var(--frv)}
.orgb.org-ses{color:var(--ses);background:var(--ses-bg);border-color:var(--ses-edge)}

/* Non-emergency = purple/mauve */
:root{--mauve:#6b3fa0;--mauve-bg:#f1eaf9}
:root[data-theme="dark"]{--mauve:#c9a6f2;--mauve-bg:#2a1d3d}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--mauve:#c9a6f2;--mauve-bg:#2a1d3d}}

.chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.chip{display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 10px;border-radius:999px;border:1px solid var(--rule-strong);background:var(--panel);color:var(--muted);font:600 13px var(--sans);cursor:pointer}
.chip svg{width:14px;height:14px}
.chip:hover{background:var(--hover)}
.chip[aria-pressed="true"].org-cfa{color:var(--cfa);background:var(--cfa-bg);border-color:var(--cfa)}
.chip[aria-pressed="true"].org-frv{color:var(--frv);background:var(--frv-bg);border-color:var(--frv)}
.chip[aria-pressed="true"].org-ses{color:var(--ses);background:var(--ses-bg);border-color:var(--ses-edge)}
.chip[aria-pressed="true"].org-other{color:#1b1f24;background:#ffffff;border-color:#00a651}
.chip[aria-pressed="true"].p-emergency{color:var(--red);background:var(--red-bg);border-color:var(--red)}
.chip[aria-pressed="true"].p-non-emergency{color:var(--mauve);background:var(--mauve-bg);border-color:var(--mauve)}
.chip[aria-pressed="true"].p-admin{color:var(--blue);background:var(--blue-bg);border-color:var(--blue)}
.chip.org-cfa svg{color:var(--cfa)} .chip.org-frv svg{color:var(--frv)}
.chipsep{width:1px;height:20px;background:var(--rule-strong);margin:0 2px}

/* Gradual light/dark transition, active only while .theme-fade is set */
html.theme-fade, html.theme-fade *, html.theme-fade *::before, html.theme-fade *::after{
  transition:background-color 1.5s ease, color 1.5s ease, border-color 1.5s ease, fill 1.5s ease, stroke 1.5s ease, box-shadow 1.5s ease !important}

/* Filter chips always wear the same colours as the feed badges/tags.
   Off = outlined in the colour; On = filled exactly like the badge in the feed, plus a check ring. */
.chip.org-cfa{color:var(--cfa);border-color:var(--cfa)}
.chip.org-frv{color:var(--frv);border-color:var(--frv)}
.chip.org-ses{color:var(--ses);border-color:var(--ses-edge)}
.chip.org-other{color:var(--ink);border-color:#00a651}
.chip.p-emergency{color:var(--red);border-color:var(--red)}
.chip.p-non-emergency{color:var(--mauve);border-color:var(--mauve)}
.chip.p-admin{color:var(--blue);border-color:var(--blue)}
.chip[aria-pressed="true"]{box-shadow:0 0 0 2px var(--paper),0 0 0 4px currentColor}
.chip[aria-pressed="true"].org-other{color:#1b1f24;background:#ffffff}
.chip[aria-pressed="false"]{background:var(--panel)}

.perwrap{display:inline-flex}
.persel{height:34px;border:1px solid var(--rule-strong);border-radius:6px;background:var(--panel);color:var(--ink);padding:0 8px;font:inherit}
.pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;padding:14px 0 6px;border-top:1px solid var(--rule);margin-top:4px}
.pginfo{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}
.pgbtns{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.pgbtn{min-width:34px;height:32px;padding:0 10px;border:1px solid var(--rule-strong);border-radius:6px;background:var(--panel);color:var(--ink);cursor:pointer;font:inherit;font-variant-numeric:tabular-nums}
.pgbtn:hover:not(:disabled){background:var(--hover)}
.pgbtn:disabled{opacity:.5;cursor:default}
.pgbtn.cur{background:var(--ink);color:var(--paper);border-color:var(--ink);opacity:1}
.pgdots{color:var(--muted);padding:0 2px}

/* Time column sizes to its content and never wraps */
.msg .when{white-space:nowrap;min-width:13.5em;font-variant-numeric:tabular-nums}
.msg .when b,.msg .when .since,.msg .when .day{white-space:nowrap}
.feedhead > span:first-child{min-width:13.5em}
@media (max-width:900px){.msg .when{min-width:0;white-space:normal}.msg .when b,.msg .when .since,.msg .when .day{white-space:nowrap}}
dialog::backdrop{cursor:pointer}
dialog > *{cursor:auto}

.whoname{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.hostline{display:flex;flex-wrap:wrap;gap:4px 10px;justify-content:flex-end;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.hst{display:inline-flex;align-items:center;white-space:nowrap}
.hst.warn{color:var(--amber);font-weight:600}
.hst.bad{color:var(--red);font-weight:700}
.nodeid{font-size:12px;color:var(--muted);font-family:var(--mono)}

.who{align-items:flex-start}
.whoicons{display:flex;flex-direction:column;gap:4px;align-items:center}
.whoicons .iconbtn{width:34px;height:34px;padding:0}
.qbox.inline{margin-left:0;flex:0 1 320px}
.qbox.inline input{border:0}
.dlg-head .iconbtn{flex:0 0 auto}
.clockline{display:flex;justify-content:flex-end;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.clockline{gap:4px 10px;flex-wrap:wrap}
.pitime{display:block;text-align:right;font-size:12px;font-family:var(--mono);color:var(--ink);font-variant-numeric:tabular-nums}
.tag.fscc{color:var(--muted);border-color:var(--rule-strong);background:var(--hover)}
.chip[aria-pressed="true"].p-fscc{color:var(--muted);background:var(--hover);border-color:var(--rule-strong)}

.newcap{color:var(--red);font-weight:800;margin-left:2px;cursor:help}
.unkbox td.sample{font-family:var(--mono);font-size:12px;color:var(--muted);max-width:420px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.sorth{all:unset;cursor:pointer;font-weight:600;font-size:13px;color:var(--muted);white-space:nowrap;border-radius:4px;padding:1px 2px}
.sorth:hover{color:var(--ink);text-decoration:underline}
.sorth.on{color:var(--ink)}
.sorth:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.sortarrow{font-size:10px}

/* One shared column template so the header row and every page row line up exactly.
   (Each grid sizes itself, so content-based widths like max-content can't be used here.) */
:root{--feed-cols:13em 6.5em 7.5em minmax(9em,11em) 8.5em minmax(0,1fr)}
.feedhead,.msg{column-gap:14px}
.feedhead{padding-left:6px;padding-right:6px}
.msg .when{min-width:0}
.feedhead > span:first-child{min-width:0}
.feedhead .sorth{display:block;overflow:hidden;text-overflow:ellipsis}
.msg > div{min-width:0}

.feedcount{margin-left:auto;font-size:13px;font-weight:600;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.feedcount.on{color:var(--blue)}
.feedbar .qbox{margin-left:0}
@media (max-width:900px){.feedcount{margin-left:0}}

/* Alignment fix: the old widths were in "em", which scales with each element's own font size.
   The heading row is 13px text and page rows are 15px, so every column came out a different
   width. Fixed pixel widths make both rows identical. */
:root{--feed-cols:178px 92px 118px minmax(140px,170px) 128px minmax(0,1fr)}
.feedhead,.msg{grid-template-columns:var(--feed-cols) !important;column-gap:14px !important;padding-left:6px !important;padding-right:6px !important;box-sizing:border-box}
.feedhead > *{min-width:0}

/* Filter chips: neutral border (same as the search box / page-size borders) when off,
   coloured border only when the filter is active. Text and icon keep their colour. */
.chip[aria-pressed="false"]{border-color:var(--rule-strong) !important}
.chip[aria-pressed="true"].org-cfa{border-color:var(--cfa) !important}
.chip[aria-pressed="true"].org-frv{border-color:var(--frv) !important}
.chip[aria-pressed="true"].org-ses{border-color:var(--ses-edge) !important}
.chip[aria-pressed="true"].org-other{border-color:#00a651 !important}
.chip[aria-pressed="true"].p-emergency{border-color:var(--red) !important}
.chip[aria-pressed="true"].p-non-emergency{border-color:var(--mauve) !important}
.chip[aria-pressed="true"].p-admin{border-color:var(--blue) !important}

/* Message count as its own box, matching the search box / page-size control */
.feedcount{display:inline-flex;align-items:center;justify-content:center;height:34px;min-width:44px;padding:0 10px;box-sizing:border-box;
  border:1px solid var(--rule-strong);border-radius:6px;background:var(--panel);color:var(--ink);font-size:13px;font-weight:600}
.feedcount.on{border-color:var(--blue);color:var(--blue);background:var(--blue-bg)}

/* Alternating row shading (feed and tables). Hover and new-page highlight still win. */
:root{--zebra:rgba(0,0,0,.035)}
:root[data-theme="dark"]{--zebra:rgba(255,255,255,.045)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--zebra:rgba(255,255,255,.045)}}
.msgs > .msg:nth-child(even){background:var(--zebra)}
.msgs > .msg:hover{background:var(--hover)}
.tablewrap tbody tr:nth-child(even) td{background:var(--zebra)}

/* Stronger new-page highlight: bright flash, then a coloured left bar that fades over ~12 s.
   Bar colour follows priority. Respects reduced-motion (static highlight instead). */
.msgs > .msg.fresh{position:relative;animation:freshbg 12s ease-out forwards}
.msgs > .msg.fresh::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--fresh-bar,#f5b800);animation:freshbar 12s ease-out forwards}
.msgs > .msg.fresh.p-emergency{--fresh-bar:var(--red)}
.msgs > .msg.fresh.p-non-emergency{--fresh-bar:var(--mauve)}
.msgs > .msg.fresh.p-admin{--fresh-bar:var(--blue)}
@keyframes freshbg{
  0%{background:#ffe066;box-shadow:inset 0 0 0 2px #f5b800}
  6%{background:#fff3b0}
  12%{background:#ffe066}
  18%{background:#fff3b0;box-shadow:inset 0 0 0 2px #f5b800}
  100%{background:transparent;box-shadow:inset 0 0 0 0 transparent}}
@keyframes freshbar{0%,70%{opacity:1}100%{opacity:0}}
:root[data-theme="dark"] .msgs > .msg.fresh{animation-name:freshbgdk}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .msgs > .msg.fresh{animation-name:freshbgdk}}
@keyframes freshbgdk{
  0%{background:#6b5300;box-shadow:inset 0 0 0 2px #f5b800}
  6%{background:#3d3100}
  12%{background:#6b5300}
  18%{background:#3d3100;box-shadow:inset 0 0 0 2px #f5b800}
  100%{background:transparent;box-shadow:inset 0 0 0 0 transparent}}
@media (prefers-reduced-motion:reduce){
  .msgs > .msg.fresh{animation:none;background:var(--fresh-still);box-shadow:inset 0 0 0 2px #f5b800}
  .msgs > .msg.fresh::before{animation:none}}

/* Unknown priority: same shape as the grey FSCC tag, on a pale white background */
.tag.unknown{color:var(--muted);border-color:var(--rule-strong);background:#fdfdfc}
:root[data-theme="dark"] .tag.unknown{background:#e9e9e7;color:#4f5a64;border-color:#c9c9c4}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tag.unknown{background:#e9e9e7;color:#4f5a64;border-color:#c9c9c4}}

.colswrap{position:relative;display:inline-flex}
.colsmenu{position:absolute;top:calc(100% + 4px);right:0;z-index:30;min-width:170px;background:var(--panel);border:1px solid var(--rule-strong);border-radius:6px;padding:6px;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.colsmenu[hidden]{display:none}
.colsitem{display:flex;align-items:center;gap:8px;padding:5px 6px;border-radius:4px;font-size:14px;cursor:pointer;white-space:nowrap}
.colsitem:hover{background:var(--hover)}
.colsitem input:disabled + *{opacity:.6}

/* Column hiding (toggled by classes on <html>) */
html.hide-time .msg > .when, html.hide-time .feedhead > [data-col="time"]{display:none !important}
html.hide-capcode .msg > .c-cap, html.hide-capcode .feedhead > [data-col="capcode"]{display:none !important}
html.hide-org .msg > .c-org, html.hide-org .feedhead > [data-col="org"]{display:none !important}
html.hide-brigade .msg > .c-brig, html.hide-brigade .feedhead > [data-col="brigade"]{display:none !important}
html.hide-priority .msg > .c-prio, html.hide-priority .feedhead > [data-col="priority"]{display:none !important}
html:not(.show-capcode) .msg > .c-cap, html:not(.show-capcode) .feedhead > [data-col="capcode"]{display:none !important}

/* Use the full window width; Message takes all spare space as the window grows. */
main{max-width:none}
.msg .c-brig,.msg .c-org,.msg .c-prio{overflow:hidden}
.msg .c-brig .line{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msg .c-msg .text{overflow-wrap:anywhere}
.rawpage{font-family:var(--mono);font-size:12px;word-break:break-word}

/* Pop-up field block: each field has its own colour on the key */
.pfbox{display:flex;flex-direction:column;gap:6px;margin:0 0 16px;padding:12px 14px;border:1px solid var(--rule);border-radius:6px;background:var(--panel)}
.pf{display:grid;grid-template-columns:11.5em minmax(0,1fr);gap:10px;align-items:baseline}
.pfk{font-weight:700;font-size:13px}
.pfv{color:var(--ink);overflow-wrap:anywhere}
.pfli{display:block}
.pf .text{margin:0}
.pf-time .pfk{color:#1d6fb8} .pf-cap .pfk{color:#6b6f76} .pf-org .pfk{color:var(--cfa)} .pf-brig .pfk{color:#b0450a}
.pf-prio .pfk{color:var(--mauve)} .pf-job .pfk{color:#0f7b6c} .pf-inc .pfk{color:#9a3412} .pf-fgd .pfk{color:#7a5a00}
.pf-grid .pfk{color:#2e7d32} .pf-mel .pfk{color:#00838f} .pf-sub .pfk{color:#5d4037} .pf-paged .pfk{color:#3949ab}
.pf-resp .pfk{color:var(--frv)} .pf-also .pfk{color:#8e5ba8} .pf-other .pfk{color:#6b6f76} .pf-msg .pfk{color:var(--ink)} .pf-raw .pfk{color:var(--muted)}
:root[data-theme="dark"] .pf-time .pfk{color:#7cb7ef} :root[data-theme="dark"] .pf-brig .pfk{color:#f0a070} :root[data-theme="dark"] .pf-job .pfk{color:#5fd1bf}
:root[data-theme="dark"] .pf-inc .pfk{color:#f5a07a} :root[data-theme="dark"] .pf-fgd .pfk{color:#e7c35c} :root[data-theme="dark"] .pf-grid .pfk{color:#7fd49a}
:root[data-theme="dark"] .pf-mel .pfk{color:#62d3dd} :root[data-theme="dark"] .pf-sub .pfk{color:#c9a99e} :root[data-theme="dark"] .pf-paged .pfk{color:#9fa8ff}
:root[data-theme="dark"] .pf-also .pfk{color:#d1a8e6} :root[data-theme="dark"] .pf-cap .pfk, :root[data-theme="dark"] .pf-other .pfk{color:#a9b1b9}
.pf-raw .pfv{font-size:12px;color:var(--muted)}
@media (max-width:600px){.pf{grid-template-columns:1fr;gap:2px}}

/* ===================================================================================
   Responsive layout (phones and iPads). Placed last so it wins over the desktop rules,
   several of which use !important.
   =================================================================================== */
html,body{max-width:100%;overflow-x:clip}
.nav{flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
.mapbox svg{display:block;width:100%;height:auto}

/* iPad landscape and small laptops */
@media (max-width:1180px){
  .top{gap:6px 14px}
  .chip{padding:0 8px}
}

/* iPad portrait and phones: feed rows become cards, header stacks */
@media (max-width:900px){
  main{padding:10px 12px 60px}
  /* header */
  .top{padding:8px 12px 0;gap:6px 10px}
  .brand{flex:1 1 auto;min-width:0}
  .lastpage{position:static !important;transform:none !important;width:100%;order:2;text-align:left;white-space:normal;font-size:13px}
  .who{width:100%;margin-left:0;order:2;justify-content:space-between;align-items:flex-start;gap:8px}
  .whoname{align-items:flex-start}
  .hostline,.clockline{justify-content:flex-start}
  .pitime{text-align:left}
  .whoicons{flex-direction:row}
  .healthpills{gap:4px}
  .pill{font-size:12px;padding:2px 8px}
  .nav a{padding:10px 12px}
  /* toolbar */
  .feedbar{flex-wrap:wrap;gap:8px;margin:0 -12px;padding:8px 12px}
  .chips{flex:1 1 100%;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;-webkit-overflow-scrolling:touch}
  .chips::-webkit-scrollbar{display:none}
  .chip{flex:0 0 auto;height:34px}
  .qbox,.feedbar .qbox{flex:1 1 160px;min-width:0;margin-left:0;order:0}
  .feedcount{margin-left:0}
  input,select,textarea{font-size:16px}  /* stops iOS zooming into fields */
  /* feed: cards instead of a table */
  .feedhead{display:none !important}
  .msgs > .msg{display:flex !important;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:10px 8px !important}
  .msg > .when{order:1;flex:1 1 auto;min-width:0;white-space:normal}
  .msg > .when b,.msg > .when .since,.msg > .when .day{display:inline !important;margin-right:8px}
  .msg > .c-prio{order:2;margin-left:auto}
  .msg > .c-org{order:3;flex-direction:row !important;flex-wrap:wrap;gap:4px}
  .msg > .c-brig{order:4;flex:1 1 auto;min-width:0}
  .msg > .c-cap{order:5}
  .msg > .c-msg{order:6;flex:1 1 100%}
  .msg .c-org::before,.msg .c-brig::before,.msg .c-prio::before{content:none !important}
  .msg .c-cap::before{min-width:0 !important;margin-right:4px}
  .msg .c-brig .line{white-space:normal}
  /* pager */
  .pager{justify-content:center}
  .pgbtn{min-width:40px;height:38px}
  /* tables */
  .tablewrap{-webkit-overflow-scrolling:touch}
  th,td{padding:8px 6px}
  td.acts .iconbtn{width:38px;height:38px}
}

/* phones */
@media (max-width:640px){
  main{padding:8px 10px 60px}
  /* header scrolls away so the feed gets the screen; filter bar stays pinned */
  .top{position:static !important;padding:8px 10px 0}
  .feedbar{top:0 !important;margin:0 -10px;padding:8px 10px}
  .offline-banner{top:0 !important}
  .newpill{top:calc(var(--bar-h) + 8px) !important}
  .title{font-size:17px}
  .nodeid,.clockline > .hst + .hst{display:none}
  .hostline{gap:2px 8px;font-size:11.5px}
  .perwrap .persel{padding:0 6px}
  /* pop-up fills the screen */
  dialog{width:calc(100% - 12px) !important;max-width:none !important;max-height:92vh;margin:auto;overflow:auto}
  .pfbox{padding:10px}
  .dlg-head{position:sticky;top:0;background:var(--panel);z-index:1}
  /* map */
  .mapwrap{gap:10px}
}

/* Colour-coded fields inside the message text (same colours as the pop-up labels) */
.text .fld{font-weight:700;border-radius:3px;padding:0 2px}
.text .fld.pf-org{color:var(--cfa)} .text .fld.pf-job{color:#0f7b6c} .text .fld.pf-grid{color:#2e7d32} .text .fld.pf-mel{color:#00838f}
.text .fld.pf-fgd{color:#7a5a00} .text .fld.pf-resp{color:var(--frv)} .text .fld.pf-paged{color:#3949ab} .text .fld.pf-brig{color:#b0450a}
.text .fld.pf-inc{color:#9a3412} .text .fld.pf-other{color:#6b6f76;font-weight:600}
:root[data-theme="dark"] .text .fld.pf-job{color:#5fd1bf} :root[data-theme="dark"] .text .fld.pf-grid{color:#7fd49a} :root[data-theme="dark"] .text .fld.pf-mel{color:#62d3dd}
:root[data-theme="dark"] .text .fld.pf-fgd{color:#e7c35c} :root[data-theme="dark"] .text .fld.pf-paged{color:#9fa8ff} :root[data-theme="dark"] .text .fld.pf-brig{color:#f0a070}
:root[data-theme="dark"] .text .fld.pf-inc{color:#f5a07a} :root[data-theme="dark"] .text .fld.pf-other{color:#a9b1b9}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .text .fld.pf-job{color:#5fd1bf}:root:not([data-theme="light"]) .text .fld.pf-grid{color:#7fd49a}:root:not([data-theme="light"]) .text .fld.pf-mel{color:#62d3dd}:root:not([data-theme="light"]) .text .fld.pf-fgd{color:#e7c35c}:root:not([data-theme="light"]) .text .fld.pf-paged{color:#9fa8ff}:root:not([data-theme="light"]) .text .fld.pf-brig{color:#f0a070}:root:not([data-theme="light"]) .text .fld.pf-inc{color:#f5a07a}:root:not([data-theme="light"]) .text .fld.pf-other{color:#a9b1b9}}

.title{display:inline-flex;align-items:center;gap:8px}
.title .logo{font-size:1.45em;line-height:1;transform:translateY(-1px)}
@media (max-width:640px){.title .logo{font-size:1.35em}}

/* Message-field colours: a separate palette from status / priority / organisation colours */
.text .fld.pf-org,.pf.pf-org .pfk{color:#00695c !important}
.text .fld.pf-job,.pf.pf-job .pfk{color:#5b6b00 !important}
.text .fld.pf-grid,.pf.pf-grid .pfk{color:#006d77 !important}
.text .fld.pf-mel,.pf.pf-mel .pfk{color:#2b5d8c !important}
.text .fld.pf-fgd,.pf.pf-fgd .pfk{color:#8a6d00 !important}
.text .fld.pf-resp,.pf.pf-resp .pfk{color:#4a3aa8 !important}
.text .fld.pf-paged,.pf.pf-paged .pfk{color:#7b5e57 !important}
.text .fld.pf-brig,.pf.pf-brig .pfk{color:#2f6f4e !important}
.text .fld.pf-inc,.pf.pf-inc .pfk{color:#9c5a1e !important}
.text .fld.pf-other,.pf.pf-other .pfk{color:#5c6470 !important}
:root[data-theme="dark"] .text .fld.pf-org,:root[data-theme="dark"] .pf.pf-org .pfk{color:#4fd1c1 !important}
:root[data-theme="dark"] .text .fld.pf-job,:root[data-theme="dark"] .pf.pf-job .pfk{color:#c4d65a !important}
:root[data-theme="dark"] .text .fld.pf-grid,:root[data-theme="dark"] .pf.pf-grid .pfk{color:#5fd3df !important}
:root[data-theme="dark"] .text .fld.pf-mel,:root[data-theme="dark"] .pf.pf-mel .pfk{color:#8fb8e6 !important}
:root[data-theme="dark"] .text .fld.pf-fgd,:root[data-theme="dark"] .pf.pf-fgd .pfk{color:#e8c95a !important}
:root[data-theme="dark"] .text .fld.pf-resp,:root[data-theme="dark"] .pf.pf-resp .pfk{color:#b3a6ff !important}
:root[data-theme="dark"] .text .fld.pf-paged,:root[data-theme="dark"] .pf.pf-paged .pfk{color:#d1b2a8 !important}
:root[data-theme="dark"] .text .fld.pf-brig,:root[data-theme="dark"] .pf.pf-brig .pfk{color:#7fd6a4 !important}
:root[data-theme="dark"] .text .fld.pf-inc,:root[data-theme="dark"] .pf.pf-inc .pfk{color:#f0b07a !important}
:root[data-theme="dark"] .text .fld.pf-other,:root[data-theme="dark"] .pf.pf-other .pfk{color:#b3bac4 !important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .text .fld.pf-org,:root:not([data-theme="light"]) .pf.pf-org .pfk{color:#4fd1c1 !important}:root:not([data-theme="light"]) .text .fld.pf-job,:root:not([data-theme="light"]) .pf.pf-job .pfk{color:#c4d65a !important}:root:not([data-theme="light"]) .text .fld.pf-grid,:root:not([data-theme="light"]) .pf.pf-grid .pfk{color:#5fd3df !important}:root:not([data-theme="light"]) .text .fld.pf-mel,:root:not([data-theme="light"]) .pf.pf-mel .pfk{color:#8fb8e6 !important}:root:not([data-theme="light"]) .text .fld.pf-fgd,:root:not([data-theme="light"]) .pf.pf-fgd .pfk{color:#e8c95a !important}:root:not([data-theme="light"]) .text .fld.pf-resp,:root:not([data-theme="light"]) .pf.pf-resp .pfk{color:#b3a6ff !important}:root:not([data-theme="light"]) .text .fld.pf-paged,:root:not([data-theme="light"]) .pf.pf-paged .pfk{color:#d1b2a8 !important}:root:not([data-theme="light"]) .text .fld.pf-brig,:root:not([data-theme="light"]) .pf.pf-brig .pfk{color:#7fd6a4 !important}:root:not([data-theme="light"]) .text .fld.pf-inc,:root:not([data-theme="light"]) .pf.pf-inc .pfk{color:#f0b07a !important}:root:not([data-theme="light"]) .text .fld.pf-other,:root:not([data-theme="light"]) .pf.pf-other .pfk{color:#b3bac4 !important}}
.pf-time .pfk{color:#00695c !important}.pf-cap .pfk{color:#5c6470 !important}.pf-prio .pfk{color:#9c5a1e !important}.pf-sub .pfk{color:#2b5d8c !important}.pf-also .pfk{color:#4a3aa8 !important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pf-time .pfk{color:#4fd1c1 !important}:root:not([data-theme="light"]) .pf-cap .pfk{color:#b3bac4 !important}:root:not([data-theme="light"]) .pf-prio .pfk{color:#f0b07a !important}:root:not([data-theme="light"]) .pf-sub .pfk{color:#8fb8e6 !important}:root:not([data-theme="light"]) .pf-also .pfk{color:#b3a6ff !important}}
:root[data-theme="dark"] .pf-time .pfk{color:#4fd1c1 !important}:root[data-theme="dark"] .pf-cap .pfk{color:#b3bac4 !important}:root[data-theme="dark"] .pf-prio .pfk{color:#f0b07a !important}:root[data-theme="dark"] .pf-sub .pfk{color:#8fb8e6 !important}:root[data-theme="dark"] .pf-also .pfk{color:#b3a6ff !important}

html.hide-delta .msg > .c-delta, html.hide-delta .feedhead > [data-col="delta"]{display:none !important}
.msg .c-delta{font-family:var(--mono);font-size:13px;font-variant-numeric:tabular-nums}
.msg .c-delta .delay{color:var(--ink)}
@media (max-width:900px){.msg > .c-delta{order:1;font-size:12px}}

/* High-priority incident types: red box around the priority badge */
.redbox{outline:2.5px solid #d50000;outline-offset:2px;border-radius:4px}
:root[data-theme="dark"] .redbox{outline-color:#ff5252}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .redbox{outline-color:#ff5252}}

.text .fld.pf-redinc{color:#d50000 !important;font-weight:800}
:root[data-theme="dark"] .text .fld.pf-redinc{color:#ff5252 !important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .text .fld.pf-redinc{color:#ff5252 !important}}

/* High-priority incident: shade the whole Priority cell instead of boxing the badge */
.redbox{outline:none !important}
.msg > .c-prio.redcell{background:rgba(213,0,0,.14);border-left:3px solid #d50000;margin:-10px 0;padding:10px 6px;display:flex;align-items:center;align-self:stretch}
:root[data-theme="dark"] .msg > .c-prio.redcell{background:rgba(255,82,82,.18);border-left-color:#ff5252}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .msg > .c-prio.redcell{background:rgba(255,82,82,.18);border-left-color:#ff5252}}
@media (max-width:900px){.msg > .c-prio.redcell{margin:0;padding:3px 6px;border-radius:4px}}

/* Pop-up: use most of the window, never scroll sideways. Rows inside it (related pages) are
   shown as compact cards, not the wide feed grid. */
dialog{width:min(1100px,calc(100vw - 32px)) !important;max-width:none !important;max-height:calc(100vh - 32px);overflow-y:auto;overflow-x:hidden;box-sizing:border-box}
#detail-body{min-width:0;overflow-x:hidden}
#detail-body *{max-width:100%;box-sizing:border-box}
#detail-body .text,#detail-body .pfv{overflow-wrap:anywhere;word-break:break-word;white-space:pre-wrap}
#detail-body .tablewrap{overflow-x:auto}
#detail-body .msgs > .msg{display:flex !important;flex-wrap:wrap;gap:4px 10px;align-items:center;grid-template-columns:none !important}
#detail-body .msgs > .msg > .c-msg{flex:1 1 100%;min-width:0}
#detail-body .msgs > .msg > .when{flex:1 1 auto}
#detail-body .msgs > .msg > .when b,#detail-body .msgs > .msg > .when .since,#detail-body .msgs > .msg > .when .day{display:inline !important;margin-right:8px}
#detail-body .msgs > .msg > .c-delta,#detail-body .msgs > .msg > .c-cap{display:none !important}
#detail-body .msgs > .msg .c-org{flex-direction:row !important}
#detail-body .msgs > .msg > .c-prio.redcell{margin:0;padding:3px 6px;border-radius:4px}
.pf{grid-template-columns:minmax(8em,11.5em) minmax(0,1fr)}

/* Received after the page's own sent time: red underline on the time */
.msg .when b.late{text-decoration:underline;text-decoration-color:#d50000;text-decoration-thickness:2px;text-underline-offset:3px}
:root[data-theme="dark"] .msg .when b.late{text-decoration-color:#ff5252}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .msg .when b.late{text-decoration-color:#ff5252}}
.orgb.org-sys{color:var(--muted);background:var(--hover);border-color:var(--rule-strong)}
.tag.fgdtag{color:#8a6d00;border-color:#8a6d00;background:#fff7d6}
:root[data-theme="dark"] .tag.fgdtag{color:#e8c95a;border-color:#e8c95a;background:#2e2610}

/* Phone pop-up: use the full screen width, keep short fields on one line, give the message the whole width */
@media (max-width:640px){
  dialog{width:100vw !important;max-width:100vw !important;max-height:100dvh;height:auto;margin:0;border-radius:0;border-left:0;border-right:0}
  #detail-body{padding:8px 10px 16px}
  .dlg-head{padding:8px 10px}
  .pfbox{padding:8px 0;border:0;background:transparent;gap:4px}
  .pf{grid-template-columns:7.2em minmax(0,1fr) !important;gap:6px;font-size:14px}
  .pfk{font-size:12px}
  .pf.pf-msg,.pf.pf-raw{grid-template-columns:1fr !important;gap:2px;margin-top:6px}
  .pf.pf-msg .text{font-family:var(--sans);font-size:15px;line-height:1.5;white-space:normal;word-break:normal;overflow-wrap:break-word}
  .pf.pf-raw .pfv{font-size:12px}
  #detail-body .kv{grid-template-columns:7.2em minmax(0,1fr);font-size:13px}
}

/* Message stats */
.msgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr));gap:14px}
.mscard{border:1px solid var(--rule);border-radius:6px;padding:12px 14px;background:var(--panel);min-width:0}
.mscard:first-child{grid-column:1/-1}
.mscard h2{margin:0 0 6px;border:0;padding:0}
.hbars{display:flex;flex-direction:column;gap:5px}
.hbar{display:grid;grid-template-columns:minmax(90px,38%) minmax(0,1fr) 3.5em;gap:8px;align-items:center;font-size:13px}
.hbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbt{height:14px;background:var(--hover);border-radius:3px;overflow:hidden}
.hbf{display:block;height:100%;border-radius:3px;transition:width .4s ease}
.hbn{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}

/* Brigade names wrap onto a second line instead of being cut off with "…" */
.msg .c-brig,.msg .c-brig .line{overflow:visible !important;text-overflow:clip !important;white-space:normal !important;overflow-wrap:break-word;word-break:normal}
.msg .c-brig .line{line-height:1.3}

/* System filter: white, like the EMV / AV badge */
.chip.org-system{color:var(--ink)}
.chip[aria-pressed="true"].org-system{color:#1b1f24 !important;background:#ffffff !important;border-color:#8b8578 !important}
.orgb.org-sys{color:#1b1f24;background:#ffffff;border-color:#8b8578}

/* Unknown capcodes merged into the capcode list (1.1.1) */
.chip.org-unknown{color:var(--muted);border-color:var(--rule-strong)}
.chip.org-unknown[aria-pressed="true"]{background:#fdfdfc;color:var(--ink)}
tr.unkrow td{background:rgba(185,179,166,.10)}
tr.unkrow .unkmeta{font-size:12px;color:var(--muted)}
tr.unkrow .sample{display:block;margin-top:2px}

/* Reconnected notice sits directly under the Update-in-progress notice (1.1.1) */
.updrow{display:flex;flex-direction:column;align-items:center;gap:4px}
.recnote{background:#e7f4ea;color:#1e6b34;border:1px solid #8cc79b;border-radius:6px;padding:3px 12px;font-size:13px;font-weight:600}
html.dark .recnote,[data-theme="dark"] .recnote{background:#16351f;color:#9fe0b0;border-color:#2f6b40}
.recnote[hidden]{display:none}
html.dark .dayline,[data-theme="dark"] .dayline{stroke:#4a4740}
.hostline{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
th.sortable{cursor:pointer;user-select:none}

/* 1.1.2: menu tabs in two colour groups — pages (blue) and system (slate/olive) */
.nav a.nv-data{background:#e8f0f8;color:#1d4e7a;border-radius:6px 6px 0 0}
.nav a.nv-sys{background:#eeece4;color:#5a5640;border-radius:6px 6px 0 0}
.nav a.nv-data[aria-current="page"]{background:#cfe0f1;border-bottom-color:#1d5482}
.nav a.nv-sys[aria-current="page"]{background:#ddd9ca;border-bottom-color:#6e6848}
.nav a.nv-data:hover{background:#d9e7f5}.nav a.nv-sys:hover{background:#e5e2d6}
.nav a.nv-sys:not([hidden]) ~ a.nv-sys{margin-left:0}
.nav a.nv-data + a.nv-sys{margin-left:14px}
html.dark .nav a.nv-data,[data-theme="dark"] .nav a.nv-data{background:#18293a;color:#a9cbea}
html.dark .nav a.nv-sys,[data-theme="dark"] .nav a.nv-sys{background:#2a2820;color:#d2cba8}
html.dark .nav a.nv-data[aria-current="page"],[data-theme="dark"] .nav a.nv-data[aria-current="page"]{background:#21405c}
html.dark .nav a.nv-sys[aria-current="page"],[data-theme="dark"] .nav a.nv-sys[aria-current="page"]{background:#3c3829}
.nav a[hidden]{display:none}
/* System time unreachable */
.pitime.unreach{color:var(--red);font-weight:600}
/* Quick label from the feed */
.qlbtn{margin-left:4px;width:22px;height:22px;vertical-align:middle}
.qlform{display:flex;flex-wrap:wrap;gap:6px;align-items:flex-end;margin-top:6px;padding:8px;border:1px solid var(--rule-strong);border-radius:8px;background:var(--bg,#fff);box-shadow:0 2px 8px rgba(0,0,0,.12);position:relative;z-index:5;cursor:default}
.qlform .ql-f{display:flex;flex-direction:column;font-size:11px;color:var(--muted)}
.qlform input{font-size:13px;padding:3px 5px}
.qlform .err{flex-basis:100%}

/* 1.1.3: clear X inside filter / search boxes */
input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none;display:none}
.hasclr{position:relative}
.hasclr input{padding-right:28px}
.clrbtn{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:22px;height:22px;border:0;border-radius:50%;background:transparent;color:var(--muted);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.clrbtn:hover,.clrbtn:focus-visible{background:var(--hover);color:var(--ink)}
.clrbtn[hidden]{display:none}
.clrbtn svg{width:14px;height:14px}

/* 1.1.4: keep the unknown capcode's page visible while editing */
.unkctx{margin-top:4px}
.unkctx .unkmeta{display:block;font-size:12px;color:var(--muted)}
.unkctx .sample.full{white-space:normal;overflow:visible;max-width:none;word-break:break-word;margin-top:2px}

/* 1.1.8: Search page text box. Inside a column-direction .field, the qbox flex-basis (160px) was
   being applied as HEIGHT. Pin it to the same height as the other inputs. */
.field .qbox,.field .qbox.inline{flex:0 0 auto;height:34px;align-self:stretch;min-width:220px}
.field .qbox input{height:32px}

/* 1.1.9: statistics overlay + rich tooltips on Message stats */
.chart .sdband{fill:rgba(29,84,130,.08)}
.chart line.mean{stroke:#1d5482;stroke-width:1.5}
.chart line.med{stroke:#6e6848;stroke-width:1.2;stroke-dasharray:2 3}
.chart line.sd1{stroke:#7fa3c4;stroke-width:1;stroke-dasharray:5 4}
.chart line.sd2{stroke:#a8231b;stroke-width:1;stroke-dasharray:6 3}
.chart polyline.ma{fill:none;stroke:#e08a00;stroke-width:2;stroke-linejoin:round;opacity:.9}
.chart circle.spike{fill:#a8231b}
.chart text.peak{fill:#a8231b;font-size:11px}
.chart text.stl{font-size:10px;paint-order:stroke;stroke:var(--panel,#fff);stroke-width:3px}
.chart text.stl.mean{fill:#1d5482}.chart text.stl.med{fill:#6e6848}.chart text.stl.sd1{fill:#5d84a8}.chart text.stl.sd2{fill:#a8231b}
.chart rect.hovt{fill:transparent;cursor:crosshair}
.chart rect.hovt.tiphot{fill:rgba(0,0,0,.06)}
.statlegend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--muted);margin-top:6px}
.statlegend .k{cursor:help;display:inline-flex;align-items:center;gap:5px}
.statlegend .k::before{content:"";display:inline-block;width:16px;height:0;border-top:2px solid #8b8578}
.statlegend .mean::before{border-top:2px solid #1d5482}.statlegend .med::before{border-top:2px dotted #6e6848}
.statlegend .sd1::before{height:8px;border:0;background:rgba(29,84,130,.15)}.statlegend .sd2::before{border-top:2px dashed #a8231b}
.statlegend .ma::before{border-top:2px solid #e08a00}
.hbar.tiphot{background:var(--hover)}
dt[data-tip],dd[data-tip]{cursor:help}
.ftip{position:fixed;z-index:1000;pointer-events:none;max-width:340px;white-space:pre-line;background:#1b1f24;color:#f4f2ec;font-size:12px;line-height:1.45;padding:7px 10px;border-radius:6px;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.ftip[hidden]{display:none}
html.dark .chart text.stl,[data-theme="dark"] .chart text.stl{stroke:#1b1d20}
html.dark .ftip,[data-theme="dark"] .ftip{background:#f4f2ec;color:#1b1f24}

/* 1.1.10: unique F jobs today (CFA red), Health history */
.feedcount.fjobs{border-color:#c8102e;color:#c8102e;background:rgba(200,16,46,.06);cursor:help}
html.dark .feedcount.fjobs,[data-theme="dark"] .feedcount.fjobs{color:#ff6b7f;border-color:#ff6b7f;background:rgba(255,107,127,.08)}
.bignum{font-size:44px;font-weight:700;line-height:1.1;padding:8px 0}
.bignum.fjobs-big{color:#c8102e}

/* 1.1.11: labels that came from a suggestion */
.tag.sugtag{margin-left:6px;font-size:11px;color:#7a4f00;border-color:#d9b25c;background:#fff6dd;cursor:help}
.sugdot{color:#b07a00;font-weight:800;margin-left:3px;cursor:help}
.chip.org-sug{color:#7a4f00;border-color:#d9b25c}
.chip.org-sug[aria-pressed="true"]{background:#fff6dd}
html.dark .tag.sugtag,[data-theme="dark"] .tag.sugtag{background:#3a2e10;color:#f0cf7a;border-color:#7a5f20}

/* 1.1.12: dropdowns in label editors */
.qlform select,tr.editing select{font-size:13px;padding:3px 4px;height:28px;min-width:90px}

/* 1.1.13: typo guard */
.err.warnmsg{color:#7a4f00;background:#fff6dd;border:1px solid #d9b25c;border-radius:5px;padding:3px 6px}
html.dark .err.warnmsg,[data-theme="dark"] .err.warnmsg{background:#3a2e10;color:#f0cf7a;border-color:#7a5f20}

/* 1.1.14: user settings */
.whoicons{flex-direction:column}
.userdlg{max-width:640px}
.userdlg .dlg-body{padding:12px 16px 16px}
.userdlg h3{margin:14px 0 6px;font-size:14px}
.userdlg .fgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}
.userdlg .field input{height:32px;padding:0 8px}
.userdlg input.bad{border-color:var(--red);outline-color:var(--red)}
.userdlg .ferr{color:var(--red);font-size:12px;min-height:14px}
.userdlg .primlist{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-direction:column;gap:4px}
.userdlg .primlist li{display:flex;align-items:center;gap:6px;padding:4px 6px;border:1px solid var(--rule);border-radius:6px}
.userdlg .primlist li .iconbtn{margin-left:auto;width:24px;height:24px}
.userdlg .dlg-actions{justify-content:flex-end;margin-top:12px}
@media (max-width:640px){.userdlg .fgrid{grid-template-columns:1fr}}
.msg.myprim{box-shadow:inset 4px 0 0 #c8102e;background:rgba(200,16,46,.05)}
html.dark .msg.myprim,[data-theme="dark"] .msg.myprim{background:rgba(255,107,127,.07)}

/* 1.1.15: on-Node label guesses */
.guessbox{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin-top:4px;flex-basis:100%}
.guessbox .note{font-size:11px;margin-right:2px}
.guesschip{display:inline-flex;gap:5px;align-items:center;font-size:12px;padding:2px 8px;border:1px solid var(--rule-strong);border-radius:12px;background:var(--panel);color:var(--ink);cursor:pointer}
.guesschip.top{border-color:#1d5482;background:#e8f0f8}
.guesschip .gpct{color:var(--muted);font-variant-numeric:tabular-nums}
.guesschip:hover{background:var(--hover)}
input.guessed{background:#eef5fb;font-style:italic}
html.dark .guesschip.top,[data-theme="dark"] .guesschip.top{background:#18293a;border-color:#a9cbea}
html.dark input.guessed,[data-theme="dark"] input.guessed{background:#18293a}

/* 1.1.16: watched capcodes */
.msg.mywatch{box-shadow:inset 4px 0 0 #e08a00;background:rgba(224,138,0,.05)}
html.dark .msg.mywatch,[data-theme="dark"] .msg.mywatch{background:rgba(224,138,0,.08)}
.userdlg .locknote{padding:6px 8px;border:1px dashed var(--rule-strong);border-radius:6px}
.userdlg .wsug{margin-top:6px}

/* 1.1.17: member role + richer Accounts table */
.tag.role-admin{color:#a8231b;border-color:#a8231b}
.tag.role-member{color:#1d5482;border-color:#1d5482}
.tag.role-viewer{color:var(--muted)}
.usertable td{vertical-align:top;white-space:nowrap}
.usertable td:nth-child(7){white-space:normal;max-width:260px}
.usertable .tag{margin-left:4px}

/* 1.1.19: support form + admin Support tab */
#supdlg textarea{width:100%;box-sizing:border-box;font:inherit;padding:6px 8px}
#supdlg .field{margin:8px 0}
#supdlg select,#supdlg input{height:32px;padding:0 8px;width:100%;box-sizing:border-box}
.navbadge{display:inline-block;margin-left:5px;min-width:16px;padding:0 5px;border-radius:9px;background:#a8231b;color:#fff;font-size:11px;font-weight:700;line-height:16px;text-align:center}
.suplist{display:flex;flex-direction:column;gap:10px;margin-top:10px}
.supcard{border:1px solid var(--rule-strong);border-left:4px solid #8b8578;border-radius:8px;padding:10px 12px;background:var(--panel)}
.supcard.sup-new{border-left-color:#a8231b}.supcard.sup-seen{border-left-color:#e08a00}.supcard.sup-resolved{border-left-color:#1e6b3a;opacity:.85}
.suphead{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.supmeta{font-size:12px;color:var(--muted);margin:4px 0}
.supbody{white-space:pre-wrap;word-break:break-word;font:inherit;margin:6px 0;padding:8px;background:var(--hover);border-radius:6px;max-height:320px;overflow:auto}
.supcard textarea{width:100%;box-sizing:border-box;font:inherit;padding:5px 7px;margin:4px 0}
.tag.sup-new{color:#a8231b;border-color:#a8231b}.tag.sup-seen{color:#b06a00;border-color:#e08a00}.tag.sup-resolved{color:#1e6b3a;border-color:#1e6b3a}

/* 1.1.22: storage note */
.keepnote{padding:6px 10px;border-left:3px solid #1e6b3a;background:rgba(30,107,58,.06);border-radius:4px}

/* 1.1.22: editable red incident codes */
.redbox{margin:10px 0;padding:8px 12px;border:1px solid var(--rule-strong);border-left:4px solid #d50000;border-radius:6px;background:var(--panel)}
.redbox summary{cursor:pointer}
.redchips{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.redchip{display:inline-flex;align-items:center;gap:4px;padding:2px 4px 2px 9px;border:1px solid #d50000;border-radius:12px;color:#d50000;font-weight:600;font-size:13px;font-family:var(--mono)}
.redchip .iconbtn{width:20px;height:20px}

/* 1.1.22: live validation */
input.bad,select.bad,textarea.bad{border-color:#c62828 !important;box-shadow:0 0 0 1px #c62828 inset}
input.good,select.good,textarea.good{border-color:#2e7d32}
.livemsg{font-size:12px;color:#c62828;min-height:15px;line-height:15px;margin-top:2px}
.livemsg.ok{color:#2e7d32}
.livemsg:empty{min-height:0}
button.btn:disabled,button.iconbtn:disabled{opacity:.45;cursor:not-allowed}
html.dark .livemsg,[data-theme="dark"] .livemsg{color:#ff8a80}

/* 1.1.22: support table, conversations, icon buttons, autosave */
.suptable td{vertical-align:middle}
.suptable .supsubj{max-width:420px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.suprow{cursor:pointer}
.suprow.open td{background:var(--hover)}
.suprow.sup-new .supsubj{font-weight:700}
tr.convo>td{background:var(--panel);border-top:0;padding:8px 12px 12px}
.thread{display:flex;flex-direction:column;gap:6px;margin:6px 0 8px;max-height:360px;overflow:auto}
.bubble{max-width:80%;padding:6px 10px;border-radius:10px;border:1px solid var(--rule)}
.bubble.them{align-self:flex-start;background:var(--hover)}
.bubble.me{align-self:flex-end;background:#e8f0f8;border-color:#bcd3ea}
html.dark .bubble.me,[data-theme="dark"] .bubble.me{background:#18293a;border-color:#2c4a66}
.bubble .bmeta{font-size:11px;color:var(--muted)}
.bubble .btext{white-space:pre-wrap;word-break:break-word}
.replybar{display:flex;gap:6px;align-items:flex-start;margin-top:6px}
.replybar textarea{flex:1;font:inherit;padding:5px 8px;min-height:34px}
.replybar input,.replybar select{height:32px;padding:0 8px}
.replybar input{flex:1}
.iconbtn.big{width:38px;height:38px}
.iconbtn.okbtn{color:#1e6b3a}
a.iconbtn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:var(--ink)}
.iconbtn{position:relative}
.navbadge.iconbadge{position:absolute;top:-4px;right:-4px;margin:0}
.savestat{font-size:12px;color:var(--muted);margin-right:auto}
.savestat.ok{color:#2e7d32}.savestat.bad{color:#c62828}

/* 1.1.23: My capcodes filter */
.minebtn{width:34px;height:34px;border:1px solid var(--rule-strong);border-radius:6px}
.minebtn[aria-pressed="true"]{color:#c8102e;border-color:#c8102e;background:rgba(200,16,46,.08)}

/* 1.1.24: unique E jobs today, themed like the AV / EMR chip (white, light-blue +) */
.feedcount.ejobs{border-color:#00a651;color:var(--ink);background:#fff;cursor:help;gap:4px}
.feedcount.ejobs svg{width:13px;height:13px}
html.dark .feedcount.ejobs,[data-theme="dark"] .feedcount.ejobs{background:#15291d;border-color:#00a651;color:#e3f5e9}

/* 1.1.27: admin user editor + password in settings */
.useredit .ue-grid{grid-template-columns:1fr 1fr;max-width:720px}
.useredit .field input{height:32px;padding:0 8px}
.useredit select{height:32px}
.minebtn[aria-pressed="true"],.iconbtn[aria-pressed="true"]{color:#1d5482}

/* 1.1.28: page family tag */
.tag.famtag{cursor:help}
.tag.fam-frv{color:#8a1849;border-color:#8a1849}
.tag.fam-cfa{color:#c8102e;border-color:#c8102e}

/* 1.1.29: review suggested labels */
.reviewbox{margin:10px 0;padding:10px 12px;border:1px solid var(--rule-strong);border-left:4px solid #1d5482;border-radius:6px;background:var(--panel)}
.reviewbox .toolbar b{margin-right:8px}
.reviewtable td{vertical-align:top}
.reviewtable td.why,.reviewtable td.evidence{font-size:12px;color:var(--muted);max-width:280px;white-space:normal}
.reviewtable .sample.full{margin-top:3px;font-family:var(--mono);font-size:11px;white-space:normal;max-width:360px}
.reviewtable tr.hi td:first-child{box-shadow:inset 3px 0 0 #2e7d32}
.reviewtable tr.mid td:first-child{box-shadow:inset 3px 0 0 #e08a00}
.reviewtable tr.lo td:first-child{box-shadow:inset 3px 0 0 #b9b3a6}
.reviewtable input[type="checkbox"]{width:18px;height:18px}
.confbar{position:relative;display:inline-block;width:70px;height:16px;border:1px solid var(--rule-strong);border-radius:8px;overflow:hidden;font-size:11px;text-align:center;line-height:16px}
.confbar .fill{position:absolute;left:0;top:0;bottom:0;z-index:0;opacity:.35}
.confbar.chi .fill{background:#2e7d32}.confbar.cmid .fill{background:#e08a00}.confbar.clo .fill{background:#b9b3a6}

/* 1.1.29: background history load indicator */
.feedcount.loading{background-image:linear-gradient(90deg,transparent 0,rgba(29,84,130,.18) 50%,transparent 100%);background-size:200% 100%;animation:pmload 1.4s linear infinite}
@keyframes pmload{from{background-position:200% 0}to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.feedcount.loading{animation:none;background:rgba(29,84,130,.10)}}

/* 1.1.30: support delete */
.suptable td.pick{white-space:nowrap}
.suptable td.pick input{margin-right:6px;vertical-align:middle}
.bubble .bmeta .iconbtn{width:20px;height:20px;margin-left:6px;vertical-align:middle;opacity:.55}
.bubble:hover .bmeta .iconbtn{opacity:1}
.iconbtn.danger{color:#c62828}

/* 1.1.32: live-feed quick editor - compact, sized like the rest of the app */
.qlform{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px 8px;align-items:end;
  width:min(420px,100%);max-width:100%;box-sizing:border-box;margin-top:6px;padding:8px 10px;
  border:1px solid var(--rule-strong);border-radius:8px;background:var(--panel);color:var(--ink);box-shadow:0 4px 14px rgba(0,0,0,.14)}
.qlform .ql-f{display:flex;flex-direction:column;gap:2px;min-width:0;font-size:11px;color:var(--muted)}
.qlform .ql-f:first-child{grid-column:1 / -1}
.qlform input,.qlform select{width:100%;min-width:0;max-width:100%;box-sizing:border-box;height:30px;padding:0 8px;font-size:13px;
  border:1px solid var(--rule-strong);border-radius:6px;background:var(--panel);color:var(--ink)}
.qlform input[readonly]{background:var(--hover);color:var(--muted)}
.qlform input:focus,.qlform select:focus{outline:2px solid var(--focus);outline-offset:0}
.qlform .acts{grid-column:1 / -1;display:flex;gap:6px;justify-content:flex-end}
.qlform .guessbox{grid-column:1 / -1;margin:0}
.qlform .err,.qlform .livemsg{grid-column:1 / -1}
.qlform .livemsg{font-size:11px}
.c-brig .qlform{position:relative;z-index:6}
@media (max-width:640px){.qlform{grid-template-columns:1fr;width:100%}}

.reviewbox[hidden]{display:none}

/* 1.1.33: primary brigade alerts in the header */
.primalerts{order:2;width:100%;display:flex;flex-direction:column;align-items:center;gap:4px;margin:2px 0}
.primalerts:empty{display:none}
.primalert{position:relative;overflow:hidden;display:flex;flex-wrap:wrap;align-items:center;gap:8px;max-width:min(900px,96vw);
  padding:6px 34px 8px 12px;border:1px solid #c8102e;border-left:6px solid #c8102e;border-radius:8px;background:#fff1f2;color:var(--ink);
  font-size:14px;cursor:pointer;box-shadow:0 2px 10px rgba(200,16,46,.18);animation:paIn .25s ease-out}
.primalert.p-non-emergency{border-color:#6b3fa0;border-left-color:#6b3fa0;background:#f5effb;box-shadow:0 2px 10px rgba(107,63,160,.15)}
.primalert.p-admin{border-color:#1d5482;border-left-color:#1d5482;background:#eef4fb;box-shadow:0 2px 10px rgba(29,84,130,.15)}
.primalert.red{border-left-color:#d50000}
.primalert.test{border-style:dashed;cursor:default}
.primalert .testtag{font-weight:800;letter-spacing:.06em;color:#fff;background:#7a4f00;border-radius:4px;padding:1px 6px;font-size:12px}
.primalert .pabrig{font-weight:700}
.primalert .painc{font-family:var(--mono);font-weight:700}
.primalert .painc.redtext{color:#d50000}
.primalert .pawhere{color:var(--ink)}
.primalert .patime{color:var(--muted);font-size:12px}
.primalert .iconbtn{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:24px;height:24px}
.primalert .pabar{position:absolute;left:0;bottom:0;height:3px;width:100%;background:currentColor;opacity:.35;transform-origin:left;animation:paBar linear forwards}
.primalert.leaving{opacity:0;transform:translateY(-4px);transition:opacity .25s,transform .25s}
.pamore{border:1px solid var(--rule-strong);background:var(--panel);color:var(--ink);border-radius:12px;padding:2px 10px;font-size:12px;cursor:pointer}
@keyframes paIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes paBar{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media (prefers-reduced-motion:reduce){.primalert{animation:none}.primalert .pabar{animation:none;opacity:0}}
html.dark .primalert,[data-theme="dark"] .primalert{background:#3a1218}
html.dark .primalert.p-non-emergency,[data-theme="dark"] .primalert.p-non-emergency{background:#2a1d3a}
html.dark .primalert.p-admin,[data-theme="dark"] .primalert.p-admin{background:#16283a}

/* 1.1.35: F / E boxes jump to their graph */
button.feedcount{font:inherit;font-size:13px;font-weight:600;cursor:pointer}
button.feedcount.clickable:hover{filter:brightness(.96);box-shadow:0 0 0 2px rgba(0,0,0,.06)}
.bignum.ejobs-big{color:#1f7fc4}
.jobcard{scroll-margin-top:calc(var(--hdr-h,120px) + 12px)}
.jobcard.jumpflash{animation:jumpflash 1.8s ease-out}
@keyframes jumpflash{0%{box-shadow:0 0 0 4px rgba(29,84,130,.45)}100%{box-shadow:0 0 0 0 rgba(29,84,130,0)}}

/* 1.1.36: header alerts - text never hidden; prominent test button */
.primalert{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:8px;padding:6px 6px 9px 12px}
.primalert .pabody{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;min-width:0}
.primalert .pabody>*{overflow-wrap:anywhere;min-width:0}
.primalert .iconbtn{position:static;transform:none;align-self:start;flex:none;width:26px;height:26px}
.btn.testbtn{display:inline-flex;align-items:center;gap:6px;background:#7a4f00;border-color:#7a4f00;color:#fff;font-weight:700;padding:6px 14px}
.btn.testbtn svg{width:16px;height:16px;fill:currentColor}
.btn.testbtn:hover{background:#94600a}
html.dark .btn.testbtn,[data-theme="dark"] .btn.testbtn{background:#c9952a;border-color:#c9952a;color:#1b1f24}

/* 1.1.37: a primary page tints the whole app by priority (header + page background + feed heading) */
html.pa-on{--pa:#c8102e;--pa-bg:#fde8ea}
html.pa-non-emergency{--pa:#6b3fa0;--pa-bg:#f1e9fa}
html.pa-admin{--pa:#1d5482;--pa-bg:#e6effa}
html.pa-none{--pa:#8b8578;--pa-bg:#f1efe9}
html.pa-on body{background:var(--pa-bg);transition:background .3s}
html.pa-on #top{background:var(--pa-bg);box-shadow:inset 0 -4px 0 var(--pa);transition:background .3s}
html.pa-on #top .title{color:var(--pa)}
html.pa-on .feedhead,html.pa-on #feedbar{background:var(--pa-bg);border-bottom:2px solid var(--pa)}
html.pa-on .feedhead{color:var(--pa)}
html.pa-on.pa-test #top{box-shadow:inset 0 -4px 0 var(--pa),inset 0 4px 0 #7a4f00}
html.pa-on .primalert{border-color:var(--pa);border-left-color:var(--pa)}
html.dark.pa-on,[data-theme="dark"].pa-on{--pa-bg:#3a1218}
html.dark.pa-non-emergency,[data-theme="dark"].pa-non-emergency{--pa-bg:#2a1d3a}
html.dark.pa-admin,[data-theme="dark"].pa-admin{--pa-bg:#16283a}
html.dark.pa-none,[data-theme="dark"].pa-none{--pa-bg:#2a2820}
@media (prefers-reduced-motion:no-preference){html.pa-emergency #top{animation:paPulse 1.2s ease-in-out 3}}
@keyframes paPulse{50%{box-shadow:inset 0 -10px 0 var(--pa)}}
/* test buttons, coloured by priority */
.testbtns{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.btn.testbtn.t-em{background:#a8231b;border-color:#a8231b;color:#fff}
.btn.testbtn.t-ne{background:#6b3fa0;border-color:#6b3fa0;color:#fff}
.btn.testbtn.t-ad{background:#1d5482;border-color:#1d5482;color:#fff}
.btn.testbtn:hover{filter:brightness(1.12)}

/* 1.1.42: suggestions inside unknown rows; add-row; tools in the capcode toolbar */
.captools{display:inline-flex;align-items:center;gap:4px}
.captools[hidden]{display:none}
.rowsug{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-top:4px}
.rowsug .sugtick{width:17px;height:17px;margin:0 2px 0 0}
.rowsug .note{font-size:11px}
.rowsug .sugwhy{flex-basis:100%;font-size:11px;color:var(--muted)}
tr.newrow td{background:rgba(29,84,130,.06)}
.redslot{margin:14px 0 6px}

/* 1.1.42 Mac notifications status */
.macst{font-size:13px;padding:2px 8px;border-radius:10px;border:1px solid var(--line)}
.macst.st-ok{color:#1f6b2e;border-color:#1f6b2e}
.macst.st-warn{color:#8a5a00;border-color:#c48a00}
.macst.st-bad{color:#a8231b;border-color:#a8231b}
.macst.st-off{color:var(--muted)}

/* 1.1.42 Last page colour by how unusual the silence is */
.lastpage{padding:2px 10px;border-radius:12px;border:1px solid transparent;transition:background .6s,border-color .6s,color .6s}
.lastpage.lp-ok #lp-ago{color:#1f6b2e}
.lastpage.lp-warn{background:rgba(196,138,0,.14);border-color:#c48a00}
.lastpage.lp-warn #lp-ago{color:#8a5a00}
.lastpage.lp-bad{background:rgba(168,35,27,.14);border-color:#a8231b;animation:lpPulse 2s ease-in-out infinite}
.lastpage.lp-bad #lp-ago{color:#a8231b}
.lastpage.lp-idle #lp-ago{color:var(--muted)}
@keyframes lpPulse{50%{background:rgba(168,35,27,.28)}}
@media (prefers-reduced-motion:reduce){.lastpage.lp-bad{animation:none}}
html[data-theme="dark"] .lastpage.lp-ok #lp-ago{color:#6fcf7f}
html[data-theme="dark"] .lastpage.lp-warn #lp-ago{color:#f0b84a}
html[data-theme="dark"] .lastpage.lp-bad #lp-ago{color:#ff7a70}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .lastpage.lp-ok #lp-ago{color:#6fcf7f}
  :root:not([data-theme="light"]) .lastpage.lp-warn #lp-ago{color:#f0b84a}
  :root:not([data-theme="light"]) .lastpage.lp-bad #lp-ago{color:#ff7a70}}

/* 1.1.42 fire-call prediction widgets */
.predcard .kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:8px 0}
table.heat{border-collapse:separate;border-spacing:2px;font-size:11px}
table.heat th{font-weight:600;color:var(--muted);padding:0 3px;text-align:left;white-space:nowrap}
table.heat td.hc{width:22px;height:18px;border-radius:3px;background:rgba(200,16,46,var(--a,.1))}
table.heat td.hc.now{outline:2px solid var(--ink)}
.next24{display:flex;align-items:flex-end;gap:2px;height:90px;margin:4px 0 14px}
.n24{flex:1;display:flex;flex-direction:column;justify-content:flex-end;height:100%;position:relative}
.n24b{display:block;background:#c8102e;border-radius:3px 3px 0 0;min-height:3px}
.n24l{position:absolute;bottom:-14px;left:0;font-size:10px;color:var(--muted)}

/* 1.1.43: graphs and widgets always fit the window: no sideways scroll bars, they shrink and grow with it */
.chart{overflow:hidden}
.chart svg{min-width:0 !important;max-width:100%}
.mscard,.mscard>*{min-width:0;max-width:100%}
.predcard .tablewrap{overflow:hidden;border-top:0}
table.heat{width:100%;table-layout:fixed;border-spacing:1px}
table.heat td.hc{width:auto;height:clamp(10px,2.2vw,20px)}
table.heat th{overflow:hidden;text-overflow:clip;font-size:clamp(8px,1vw,11px);padding:0 1px}
table.heat tr>th:first-child{width:2.6em}
.next24{min-width:0;overflow:hidden}
.n24l{font-size:clamp(8px,1vw,10px);white-space:nowrap}
.predcard .kpis{grid-template-columns:repeat(auto-fit,minmax(min(140px,100%),1fr))}

/* 1.1.43 blank unknown pages */
.sample.blankmsg{font-family:var(--mono);color:var(--muted);font-style:italic;letter-spacing:.02em}

/* 1.1.43 imported pages: blue asterisk next to the time (admins only) */
.impmark{color:#1d6fd6;font-weight:800;margin-left:2px;cursor:help}

/* 1.1.43 VicEmergency incident map in the page pop-up */
.vicembox{border:1px solid var(--rule);border-radius:6px;overflow:hidden;margin:4px 0 12px}
.vicembox iframe.vicem{display:block;width:100%;height:min(520px,60vh);border:0;background:var(--panel)}
.vicembox .note{margin:6px 8px}

/* 1.1.45 radio test countdown, centred in the header */
.busynote{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 12px;margin:4px auto 0;padding:6px 14px;
  max-width:min(640px,100%);border:2px solid #c48a00;border-radius:10px;background:rgba(196,138,0,.14);color:var(--ink);text-align:center}
.busynote[hidden]{display:none}
.busynote .bn-t{font-weight:700}
.busynote .bn-c{font:700 22px/1 var(--mono);font-variant-numeric:tabular-nums}
.busynote .bn-s{font-size:12px;color:var(--muted);flex-basis:100%}
.busynote .bn-bar{flex-basis:100%;height:5px;border-radius:3px;background:var(--rule);overflow:hidden}
.busynote .bn-bar>span{display:block;height:100%;background:#c48a00;transition:width 1s linear}

/* 1.1.45 radio test cards */
.testcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:14px;margin:10px 0}
.testcard{border:1px solid var(--rule);border-radius:8px;padding:12px 14px;background:var(--panel);min-width:0}
.testcard h2{margin:0 0 2px;border:0;padding:0}
.testcard .tc-time{margin:0 0 6px;color:#8a5a00;font-weight:600;font-size:13px}
.testcard ul{margin:0 0 8px 18px;padding:0}
.testcard li{margin:2px 0}
.testcard input[type=number]{width:9em}

/* 1.1.46 passkeys */
.login .pkbtn{display:block;width:100%;margin:6px 0 4px;font-size:16px;padding:10px}
.pklist{list-style:none;margin:6px 0;padding:0}
.pklist li{display:flex;align-items:center;gap:8px;padding:4px 0;border-bottom:1px solid var(--rule)}
.pklist li .iconbtn{margin-left:auto}

/* 1.1.49 weather risk */
.wxlist{list-style:none;margin:4px 0;padding:0}
.wxlist li{padding:3px 0;border-bottom:1px solid var(--rule);display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline}
.wxr{font-size:13px}
.wxr.wx-fire{color:#a8231b;font-weight:700}
.wxr.wx-storm{color:#3949ab}
.wxr.wx-wind{color:#5d4037}
.wxr.wx-rain{color:#1d6fb8}
.wxr.wx-heat{color:#b0450a}

/* 1.1.49 rule out a suggestion */
.sugpair{display:inline-flex;align-items:center;gap:0}
.sugpair .sugx{width:22px;height:22px;padding:0;margin-left:-2px;opacity:.65}
.sugpair .sugx:hover{opacity:1;color:#a8231b}

/* 1.1.51 last fire call + 7-day calendar */
.lastcall{border:1px solid var(--rule);border-left:4px solid #c8102e;border-radius:6px;padding:6px 10px;margin:4px 0 10px;cursor:pointer;background:var(--panel)}
.lastcall:hover{background:var(--hover)}
.lastcall .lctext{font-size:13px;color:var(--muted);margin-top:3px;overflow-wrap:anywhere}
.weekcal{display:grid;grid-template-columns:minmax(40px,auto) repeat(7,minmax(0,1fr));gap:2px;margin:4px 0 12px;font-size:clamp(9px,1vw,12px)}
.weekcal .wc-hh{color:var(--muted);text-align:right;padding-right:4px;white-space:nowrap;align-self:center}
.weekcal .wc-day{color:var(--muted);font-weight:600;white-space:nowrap;text-align:center;overflow:hidden;text-overflow:ellipsis}
.weekcal .wc-c{min-height:30px;border-radius:4px;background:rgba(var(--r,200),var(--g,16),40,var(--a,.08));display:flex;align-items:flex-end;justify-content:center;padding:2px;overflow:hidden}
.weekcal .wc-c.now{outline:2px solid var(--ink)}
.weekcal .wc-c.past{filter:grayscale(.6) brightness(1.05)}
.weekcal .wc-k{font-size:clamp(8px,.85vw,11px);line-height:1.1;text-align:center;color:#fff;background:var(--kc,#6b6f76);border-radius:3px;padding:1px 3px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 1.1.51 S (SES) counter, themed like the SES chip */
.sjobs{border-color:#f47920;color:var(--ink);background:#fff4ec;cursor:help;gap:4px}
.sjobs svg{width:13px;height:13px;color:#d9730d}
[data-theme="dark"] .feedcount.sjobs{background:#2b1d12;border-color:#f47920;color:#fde7d6}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .feedcount.sjobs{background:#2b1d12;border-color:#f47920;color:#fde7d6}}
.sjobs-big{color:#d9730d}

/* 1.1.52 BoM live readings + warnings */
.bomwarn{border:1px solid #c48a00;background:rgba(196,138,0,.10);border-radius:6px;padding:6px 10px;margin:4px 0 8px}
.bomwarn ul{margin:4px 0 0 0;padding:0;list-style:none}
.bomwarn li{margin:2px 0}
.bomwarn li.bw-fire a,.bomwarn li.bw-fire{color:#a8231b;font-weight:700}
.bomlive{margin:4px 0}
.bomlive.fire{color:#a8231b}
.bomlive .bomrisk{font-weight:700;color:#a8231b;font-size:13px}

/* 1.1.52 last 7 days (actual calls only) */
.pastcal .wc-c.real{background:var(--hover);opacity:1}
.pastcal .wc-c.real.hit{background:rgba(168,35,27,.85);cursor:pointer}
.pastcal .wc-c.real.hit:hover{outline:2px solid var(--ink)}

/* 1.1.55 VicEmergency Status / Size columns */
html.hide-emv .msg > .c-emv, html.hide-emv .feedhead > [data-col="emv"]{display:none !important}
html.hide-size .msg > .c-size, html.hide-size .feedhead > [data-col="size"]{display:none !important}
.msg .c-emv,.msg .c-size{overflow:hidden;min-width:0;font-size:13px}
.tag.emvtag{white-space:normal;line-height:1.15}
.tag.emv-nyuc{color:#fff;background:#a8231b;border-color:#a8231b}
.tag.emv-uc{color:#7a5a00;background:#fff4d6;border-color:#c48a00}
.tag.emv-stop{color:#1f6b2e;background:#e6f4ea;border-color:#1f6b2e}
.tag.emv-other{color:var(--ink);background:var(--hover);border-color:var(--rule-strong)}
@media (max-width:900px){
  .msg .c-emv,.msg .c-size{display:flex;gap:8px;flex-wrap:wrap}
  .msg .c-emv::before,.msg .c-size::before{content:attr(data-h);color:var(--muted);min-width:96px;font-family:var(--sans);font-size:13px}
  .msg .c-emv:empty,.msg .c-size:empty{display:none}
}
html.hide-qty .msg > .c-qty, html.hide-qty .feedhead > [data-col="qty"]{display:none !important}
.msg .c-qty{overflow:hidden;min-width:0;font-size:13px;text-align:center}
@media (max-width:900px){ .msg .c-qty{display:flex;gap:8px} .msg .c-qty::before{content:attr(data-h);color:var(--muted);min-width:96px;font-size:13px} .msg .c-qty:empty{display:none} }
.tag.emvtag.emv-gone{opacity:.6;border-style:dashed}

/* 1.1.59 AFPRS letters coloured by agency */
.afprs{display:inline-flex;gap:1px;align-items:baseline;font-weight:700}
.afl{padding:0 3px;border-radius:3px;line-height:1.35}
.afl-a{color:#0b5d2e;background:#e6f6ec;box-shadow:inset 0 0 0 1px #00a651}     /* AV / EMR: white + light blue */
.afl-f{color:#fff;background:#c8102e}                                            /* CFA red */
.afl-p{color:#fff;background:#1a3a8f}                                            /* police blue */
.afl-r,.afl-s{color:#fff;background:#f47920}                                     /* SES orange */
.afl-e{color:#0b5d2e;background:#e6f6ec;box-shadow:inset 0 0 0 1px #00a651}      /* EM (AFEM) = medical */
:root[data-theme="dark"] .afl-a,:root[data-theme="dark"] .afl-e{color:#cdeed8;background:#12321f}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .afl-a,:root:not([data-theme="light"]) .afl-e{color:#cdeed8;background:#12321f}}
.text .fld.pf-paged.afprs{color:inherit !important}

/* 1.1.61 AV / EMR now green with green +; R (Rescue) has a darker border so it differs from S */
.orgb.org-other{color:#0b5d2e;background:#e6f6ec;border-color:#00a651}
:root[data-theme="dark"] .orgb.org-other{color:#cdeed8;background:#12321f;border-color:#00a651}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .orgb.org-other{color:#cdeed8;background:#12321f;border-color:#00a651}}
.chip[aria-pressed="true"].org-other{color:#fff !important;background:#00a651 !important;border-color:#00a651 !important}
.feedcount.ejobs{background:#e6f6ec}
.afl-r{box-shadow:inset 0 0 0 2px #7a3300}
:root[data-theme="dark"] .afl-r{box-shadow:inset 0 0 0 2px #ffd2a8}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .afl-r{box-shadow:inset 0 0 0 2px #ffd2a8}}
.emvblank{display:inline-block;min-width:24px;cursor:help}
.svpop{position:fixed;z-index:9999;width:360px;background:var(--paper);border:1px solid var(--rule-strong);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.25);overflow:hidden;pointer-events:none}
.svpop iframe{display:block;width:360px;height:240px;border:0}
.svcap{font-size:12px;padding:4px 8px;color:var(--muted)}

/* 1.1.66 appliances coloured by agency, matching the AFPRS letters */
.text .fld.pf-resp.resp-cfa{color:#fff !important;background:#c8102e;padding:0 3px}
.text .fld.pf-resp.resp-frv{color:#7a1035 !important;background:#fbdde6;box-shadow:inset 0 0 0 1px #e59ab3;padding:0 3px}
:root[data-theme="dark"] .text .fld.pf-resp.resp-frv{color:#ffd0de !important;background:#4a1626;box-shadow:inset 0 0 0 1px #a8456a}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .text .fld.pf-resp.resp-frv{color:#ffd0de !important;background:#4a1626;box-shadow:inset 0 0 0 1px #a8456a}}

/* 1.1.68 every appliance/unit code keeps a purple underline, whatever its agency colour */
.text .fld.pf-resp{text-decoration:underline;text-decoration-color:#4a3aa8;text-decoration-thickness:2px;text-underline-offset:2px}
:root[data-theme="dark"] .text .fld.pf-resp{text-decoration-color:#b3a6ff}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .text .fld.pf-resp{text-decoration-color:#b3a6ff}}

/* 1.1.69 readable appliance text: the theme's purple field colour was overriding the text on red/pink
   (dark mode). Agency-coloured codes get high-contrast text; purple is only the underline. */
:root:not(#_a):not(#_b) .text .fld.pf-resp.resp-cfa{color:#fff !important;background:#c8102e !important}
:root:not(#_a):not(#_b) .text .fld.pf-resp.resp-frv{color:#5c0a27 !important;background:#fbdde6 !important;box-shadow:inset 0 0 0 1px #e59ab3}
:root:not(#_a):not(#_b)[data-theme="dark"] .text .fld.pf-resp.resp-frv{color:#ffe3ec !important;background:#5a1a2f !important;box-shadow:inset 0 0 0 1px #a8456a}
@media (prefers-color-scheme:dark){:root:not(#_a):not(#_b):not([data-theme="light"]) .text .fld.pf-resp.resp-frv{color:#ffe3ec !important;background:#5a1a2f !important;box-shadow:inset 0 0 0 1px #a8456a}}
:root:not(#_a):not(#_b) .text .fld.pf-resp{text-decoration:underline !important;text-decoration-color:#7c4dff !important;text-decoration-thickness:2px;text-underline-offset:3px}

/* 1.1.69 preloaded Street View: hidden boxes sit off screen until hovered; never clickable */
.svpop.svhidden{left:-10000px !important;top:0 !important;visibility:hidden}
.svpop,.svpop iframe{pointer-events:none}

/* 1.1.71 Street View: picture only. Google's viewer is drawn at 1.6x size and shrunk to fit, which shows a
   wider area, and its edges (address card, zoom/arrow controls, logo strip) are cropped off. */
.svpop{width:440px !important;height:260px;padding:0;overflow:hidden;border-radius:8px}
.svpop iframe{position:absolute;left:-90px;top:-70px;width:1000px !important;height:640px !important;transform:scale(.62);transform-origin:0 0;border:0}
.svpop .svcap{display:none}

/* 1.1.71 Street View in the page pop-up: right of the field block, fields keep their layout */
.pfwrap{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:14px;align-items:start}
.pfsv{position:relative;width:380px;height:240px;overflow:hidden;border-radius:8px;border:1px solid var(--rule-strong);pointer-events:none;position:sticky;top:0}
.pfsv iframe{position:absolute;left:-90px;top:-70px;width:900px;height:620px;transform:scale(.6);transform-origin:0 0;border:0}
@media (max-width:900px){.pfwrap{grid-template-columns:1fr}.pfsv{width:100%;height:220px;position:relative}.pfsv iframe{width:calc((100% + 180px) / .6)}}

/* 1.1.71 [FSxx] station tags: FRV theme, never the appliance purple underline */
:root:not(#_a):not(#_b) .text .fld.pf-other.tag-frv{color:#5c0a27 !important;background:#fbdde6 !important;box-shadow:inset 0 0 0 1px #e59ab3;padding:0 3px;text-decoration:none !important}
:root:not(#_a):not(#_b)[data-theme="dark"] .text .fld.pf-other.tag-frv{color:#ffe3ec !important;background:#5a1a2f !important;box-shadow:inset 0 0 0 1px #a8456a}
@media (prefers-color-scheme:dark){:root:not(#_a):not(#_b):not([data-theme="light"]) .text .fld.pf-other.tag-frv{color:#ffe3ec !important;background:#5a1a2f !important;box-shadow:inset 0 0 0 1px #a8456a}}

/* 1.1.71 rescue appliances (RK6882): themed like the R letter, keep the appliance underline */
:root:not(#_a):not(#_b) .text .fld.pf-resp.resp-rescue{color:#fff !important;background:#f47920 !important;box-shadow:inset 0 0 0 2px #7a3300;padding:0 3px}
:root:not(#_a):not(#_b)[data-theme="dark"] .text .fld.pf-resp.resp-rescue{box-shadow:inset 0 0 0 2px #ffd2a8}
@media (prefers-color-scheme:dark){:root:not(#_a):not(#_b):not([data-theme="light"]) .text .fld.pf-resp.resp-rescue{box-shadow:inset 0 0 0 2px #ffd2a8}}
.pfsv.pfsv-wait{visibility:hidden;height:0;border:0}
.svpop,.pfsv{background:transparent}

/* 1.1.72 FFMVIC: forest green with a tree */
.orgb.org-ffm{color:#1f4a14;background:#e4f1dc;border-color:#2e7d32}
:root[data-theme="dark"] .orgb.org-ffm{color:#d4ecc6;background:#1c3314;border-color:#4caf50}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .orgb.org-ffm{color:#d4ecc6;background:#1c3314;border-color:#4caf50}}
.chip.org-ffm{border-color:#2e7d32}
.chip[aria-pressed="true"].org-ffm{color:#fff !important;background:#2e7d32 !important;border-color:#2e7d32 !important}
:root:not(#_a):not(#_b) .text .fld.pf-ffm{color:#fff !important;background:#2e7d32 !important;padding:0 3px}
html.hide-ffm .x{display:none}

/* 1.1.72 EMV-only rows (no page yet) */
.msg.emvonly{opacity:.7;background:repeating-linear-gradient(135deg,transparent 0 10px,rgba(127,127,127,.06) 10px 20px);cursor:default}
.msg.emvonly .c-msg .text::before{content:"EMV only \00b7 ";font-weight:700;color:var(--muted)}

/* 1.1.77 Appliances: EMV above MSG, numbers aligned */
.qtystack{display:inline-grid;grid-template-columns:auto auto;gap:0 6px;line-height:1.25}
.qtyrow{display:contents}
.qtyk{color:var(--muted);font-size:12px}
.qtyv{font-weight:700;text-align:right;font-variant-numeric:tabular-nums}

/* 1.1.78 CFA brigade tags ([PISL]): CFA red, no appliance underline */
:root:not(#_a):not(#_b) .text .fld.pf-other.tag-cfa{color:#fff !important;background:#c8102e !important;padding:0 3px;text-decoration:none !important}

/* 1.1.78 pop-up Street View: inside the field block, top right. Fixed-size box; the viewer is drawn larger
   and shrunk to fit so Google's controls fall outside the box. Specific + !important so no other
   iframe rule (e.g. the VicEmergency map) can resize it and cut the picture in half. */
#detail-body .pfbox > .pfsv{float:right;position:relative !important;top:auto !important;width:340px !important;height:220px !important;
  margin:0 0 10px 14px;overflow:hidden;border-radius:8px;border:1px solid var(--rule-strong);pointer-events:none}
#detail-body .pfbox > .pfsv > iframe{position:absolute !important;left:-60px !important;top:-50px !important;width:767px !important;height:500px !important;
  max-width:none !important;min-width:0 !important;transform:scale(.6) !important;transform-origin:0 0 !important;border:0 !important;margin:0 !important}
#detail-body .pfbox > .pfsv.pfsv-wait{display:none}
#detail-body .pfbox::after{content:"";display:block;clear:both}
@media (max-width:640px){#detail-body .pfbox > .pfsv{float:none;width:100% !important;margin:0 0 10px 0}
  #detail-body .pfbox > .pfsv > iframe{width:calc((100% + 120px) / .6) !important}}

/* 1.1.79 EMV-only rows: bolder hatching so they stand out from real pages */
.msg.emvonly{opacity:.85;background:repeating-linear-gradient(135deg,rgba(127,127,127,.22) 0 8px,transparent 8px 16px) !important;
  border-left:4px dashed var(--muted)}
.msg.emvonly .c-msg .text::before{content:"EMV ONLY (no page yet) \00b7 ";font-weight:800;letter-spacing:.02em}
.tbtn.t-emv{border-color:#1f6b2e;color:#1f6b2e}
:root[data-theme="dark"] .tbtn.t-emv{color:#8fd19e;border-color:#8fd19e}

/* 1.1.80 garbled decodes: compact, single line, faded */
.msg.garbled{padding-top:2px !important;padding-bottom:2px !important;opacity:.55;font-size:12px;min-height:0}
.msg.garbled > *{max-height:1.4em;overflow:hidden}
.msg.garbled .c-msg .text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:40ch}
.msg.garbled .tags,.msg.garbled .c-emv,.msg.garbled .c-size,.msg.garbled .c-qty{display:none}
.msg.garbled:hover{opacity:.85}
.orgb.org-cfafrv{color:var(--ink);background:linear-gradient(90deg,rgba(200,16,46,.12),rgba(138,24,73,.12));border-color:#a8143c}

/* 1.1.81 Appliances: EMV line above MSG line, digits right-aligned in one column (overrides any flex/row rule) */
:root:not(#_a):not(#_b) .msg > .c-qty{display:block !important}
:root:not(#_a):not(#_b) .qtystack2{display:flex !important;flex-direction:column !important;align-items:stretch;gap:1px;width:max-content;cursor:help;line-height:1.2}
:root:not(#_a):not(#_b) .qtystack2 > .qtyline{display:flex !important;flex-direction:row;justify-content:space-between;gap:6px}
:root:not(#_a):not(#_b) .qtystack2 .qtyk{color:var(--muted);font-size:12px;min-width:3.4em}
:root:not(#_a):not(#_b) .qtystack2 .qtyv{font-weight:700;min-width:2.5ch;text-align:right;font-variant-numeric:tabular-nums;font-family:var(--mono, ui-monospace, Menlo, monospace)}
@media (max-width:900px){:root:not(#_a):not(#_b) .msg > .c-qty{display:flex !important}}

/* 1.1.82 SES unit tags ([GISB]): SES orange, no appliance underline */
:root:not(#_a):not(#_b) .text .fld.pf-other.tag-ses{color:#fff !important;background:#f47920 !important;padding:0 3px;text-decoration:none !important}
:root:not(#_a):not(#_b) .text .fld.tag-ffm{color:#fff !important;background:#2e7d32 !important;padding:0 3px;text-decoration:none !important}

/* 1.1.85 pop-up: fields left, Street View right, same fixed crop as before */
#detail-body .pfrow{display:flex !important;flex-direction:row !important;align-items:flex-start;gap:14px}
#detail-body .pfrow > .pfbox{flex:1 1 auto;min-width:0}
#detail-body .pfrow > .pfsv{flex:0 0 340px;float:none !important;position:relative !important;top:auto !important;width:340px !important;height:220px !important;
  margin:0;overflow:hidden;border-radius:8px;border:1px solid var(--rule-strong);pointer-events:none}
#detail-body .pfrow > .pfsv > iframe{position:absolute !important;left:-60px !important;top:-50px !important;width:767px !important;height:500px !important;
  max-width:none !important;min-width:0 !important;transform:scale(.6) !important;transform-origin:0 0 !important;border:0 !important;margin:0 !important}
#detail-body .pfrow > .pfsv.pfsv-wait{display:none !important}
@media (max-width:640px){#detail-body .pfrow{flex-direction:column-reverse !important}#detail-body .pfrow > .pfsv{flex-basis:auto;width:100% !important}
  #detail-body .pfrow > .pfsv > iframe{width:calc((100% + 120px) / .6) !important}}

/* 1.1.86 external-source pills (BoM / EMV / Tailscale): hollow, dashed, slightly smaller, set apart */
.pill.ext{background:transparent !important;border-style:dashed !important;font-size:12px;opacity:.95}
.pill.ext[data-ext="bom"]{margin-left:10px}
.pill.ext.ok{border-color:#2e7d32 !important;color:var(--ink)}
.pill.ext.warn{border-color:#c48a00 !important}
.pill.ext.bad{border-color:#a8231b !important}
.pill.ext.off{border-color:var(--rule-strong) !important;color:var(--muted)}

/* 1.1.86 CFA FSCC themed like CFA: message, Priority, Brigade */
:root:not(#_a):not(#_b) .text .fld.pf-fscc{color:#fff !important;background:#c8102e !important;padding:0 3px;text-decoration:none !important}
.tag.fscc.fscc-cfa{color:#c8102e;border-color:#c8102e;background:#fde7ea}
:root[data-theme="dark"] .tag.fscc.fscc-cfa{color:#ff8a98;border-color:#ff6b7d;background:#3a1218}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tag.fscc.fscc-cfa{color:#ff8a98;border-color:#ff6b7d;background:#3a1218}}
.line.brig-fscc{color:var(--cfa);font-weight:600}
.addr.gpslink{font-family:var(--mono, ui-monospace, Menlo, monospace);font-size:.92em}

/* 1.1.91 FSCC always italic: message text, Priority tag, Brigade/Station column */
.text .fld.pf-fscc,.tag.fscc.fscc-cfa,.line.brig-fscc{font-style:italic !important}

/* 1.1.99 estimated priority on EMV-only rows: italic + hatched so it reads as an approximation */
.tag.prio-est{font-style:italic;opacity:.85;border-style:dashed !important;
  background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.35) 0 4px,transparent 4px 8px) !important}
.tag.emv-del{color:var(--muted);background:transparent;border:1px dashed var(--rule-strong);text-decoration:line-through}
.msg.emvonly:has(.emv-del){opacity:.55}

/* 1.2.9 frozen header + filter bar on every page (feed, Search, Capcodes) */
html,body{overflow-y:visible}
.top{position:sticky !important;top:0}
.feedbar{position:sticky !important;top:var(--hdr-h)}
:root:not(#_a):not(#_b) .text .fld.pf-note{color:#a8231b !important;font-weight:700;font-style:italic;text-decoration:none !important}
:root:not(#_a):not(#_b) .text .fld.pf-fscc.fscc-plain{font-style:normal !important;color:#fff !important;background:#c8102e !important;padding:0 3px}

/* 1.3.5 pre-cached Street View for the pop-up: the viewer lives inside the dialog and is laid over the
   picture slot (fields left, picture right). Same crop as before; hidden until it's in place. */
#detail .svcache{position:absolute;left:0;top:0;width:0;height:0;overflow:visible;pointer-events:none;z-index:5}
#detail .svcache > .pfsvc{position:absolute;left:-10000px;top:0;width:340px;height:220px;overflow:hidden;border-radius:8px;
  border:1px solid var(--rule-strong);visibility:hidden;background:transparent}
#detail .svcache > .pfsvc.on{visibility:visible}
#detail .svcache > .pfsvc > iframe{position:absolute;left:-60px;top:-50px;width:calc((100% + 120px) / .6);height:500px;max-width:none;
  transform:scale(.6);transform-origin:0 0;border:0;margin:0}
#detail-body .pfrow > .pfsv{border-color:transparent !important}

/* 1.3.5 incident codes that aren't high-priority (INCIC3, NOSTC3, G&SC3 ...): same mauve as the Non-emergency badge.
   High-priority codes (pf-redinc) stay red. */
:root:not(#_a):not(#_b) .text .fld.pf-inc,:root:not(#_a):not(#_b) .pf.pf-inc .pfk{color:var(--mauve) !important}
:root:not(#_a):not(#_b) .text .fld.pf-police{color:#fff !important;background:#1a3a8f !important;padding:0 3px;text-decoration:none !important}