/* ═══ STATION 91 — "STEEL" ═══
 * Graphite monochrome interface. Borderless elevation (surfaces separate by
 * lightness, not borders). One accent — amber — used ONLY for the hero stat
 * and active states. Call-type colors are a data channel, never chrome.
 * Type: Geist (UI) / Geist Mono (times, units, CAD data).
 */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  /* surface ladder */
  --bg:    #0e0f12;
  --bg2:   #14161b;
  --card:  #181b21;
  --card2: #1e222a;
  --pill:  #232730;
  --bdr:   #22262e;   /* hairlines only — used sparingly */
  --brd:   #22262e;   /* legacy alias */
  /* ink */
  --text:  #eef1f5;
  --muted: #98a0ad;
  --muted2:#aeb6c2;
  /* accent (per-department recolorable) */
  --acc:   #f5a623;
  /* Donald, 2026-09-13: the DEADLINE amber (Time Sheets Due) — Google's
     Tangerine, and on purpose not the gold above: a deadline and a holiday
     both head a day, and the two must never read as the same thing. Must
     equal CAL_TYPE_COLOR.Deadline in calendar-core.js. */
  --ovd:   #f47b20;
  --acc-ink:#0e0f12;
  --gold:  #f5a623;   /* legacy alias — old inline styles reference it */
  /* call-type data colors */
  --fire:   #ec5b52;
  --medical:#5b9bd8;
  --assist: #45b183;
  /* Shift rotation, A / B / C (Donald, 2026-09-13). DELIBERATELY NOT the
     event-type colours above. The first build used --fire/--medical/--assist
     and Donald found the app's blue and green indistinguishable in a 3px
     edge and a 7px letter — they are both desaturated, teal-adjacent hues that
     fold into each other at that size. These sit further apart on the wheel:
     a cooler, deeper blue and a warmer, brighter green, with red left as the
     app's --fire so A still reads as the same red everywhere. The shift edge
     is a different shape in a different place from an event chip, so the two
     palettes do not compete; event chips keep the palette above. Same values
     as --shift-* in smartboard.css — change both or neither. */
  --shift-a: #ec5b52;
  --shift-b: #3b82f6;
  --shift-c: #22c55e;
  --tc:     #9b6fd0;
  --rescue: #34b3c1;
  --haz:    #e8b93a;
  --alarm:  #e0863f;
  --font:'Geist',-apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue',sans-serif;
  --font-mono:'Geist Mono',ui-monospace,'SF Mono',SFMono-Regular,Menlo,monospace;
  --sat: env(safe-area-inset-top, 0px);
  --sab: env(safe-area-inset-bottom, 0px);
  --sal: env(safe-area-inset-left, 0px);
  --sar: env(safe-area-inset-right, 0px);
  --hdr-h: 52px;
  --nav-h: 60px;
  --nav-total: calc(var(--nav-h) + var(--sab));
}

html,body{
  height:100%;width:100%;overflow:hidden;
  position:fixed;top:0;left:0;
  background:var(--bg);
  font-family:var(--font);
  font-size:15px;
  color:var(--text);
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  -webkit-font-smoothing:antialiased;
}

/* ── LAYOUT ── */
#app{
  display:flex;flex-direction:column;
  height:100vh;height:100dvh;
  width:100%;
}

header{
  background:var(--bg);
  padding:calc(var(--sat) + 10px) 20px 10px;
  display:flex;align-items:center;justify-content:space-between;
  flex-shrink:0;
  min-height:var(--hdr-h);
}
.hd-left{display:flex;flex-direction:column;gap:2px}
.hd-title{
  font-size:1.375rem;font-weight:700;
  color:var(--text);letter-spacing:-0.02em;
  font-family:var(--font);
}
.hd-badge{font-family:var(--font-mono);font-size:.8rem;color:var(--muted);letter-spacing:0.08em}
.hd-sub{
  font-family:var(--font-mono);font-size:.8rem;color:var(--muted);
  margin-top:2px;letter-spacing:0.06em;text-transform:uppercase;
}
.hd-controls{
  display:flex;align-items:center;gap:6px;
  height:44px;flex-shrink:0;
  overflow:hidden;
}
.hd-refresh,.hd-pa{
  background:var(--card);border:none;color:var(--muted);
  border-radius:12px;padding:0;
  cursor:pointer;touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
  width:44px;height:44px;flex-shrink:0;
}
.hd-refresh{
  display:flex;align-items:center;justify-content:center;
  font-size:1rem;font-weight:700;text-decoration:none;
}
.hd-refresh svg,.hd-pa svg{display:block;margin:auto}
.hd-refresh:active{background:var(--card2);color:var(--text)}
.hd-refresh.spin{color:var(--acc)}
.hd-refresh.spin svg{animation:hd-spin .6s linear infinite}
@keyframes hd-spin{to{transform:rotate(360deg)}}

/* Station PA link (owners) — same tile as refresh */
.hd-pa{display:flex;align-items:center;justify-content:center}
.hd-pa[hidden]{display:none}
.hd-pa:active{background:var(--card2);color:var(--text)}

/* ── KPI STRIP ── */
.kpi-strip{
  display:flex;gap:8px;
  padding:2px 20px 12px;
}
.kpi{
  flex:1;background:var(--card);border-radius:16px;
  padding:12px 14px 10px;min-width:0;
}
.kpi-v{
  font-size:1.5rem;font-weight:700;letter-spacing:-0.02em;
  color:var(--text);font-variant-numeric:tabular-nums;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.kpi-v.acc{color:var(--acc)}
.kpi-l{
  font-size:.8rem;font-weight:600;color:var(--muted);
  letter-spacing:0.04em;text-transform:uppercase;margin-top:3px;line-height:1.2;
}

/* ── CONTENT ── */
#content{flex:1;overflow:hidden;position:relative;min-height:0}
.pane{
  position:absolute;inset:0;overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  display:none;
  /* The staffing FAB is position:fixed (52px + 16px inset) and shown on every
     tab. Without this the last call card, the map legend and the final line of
     a passdown note all render underneath it. */
  padding-bottom:84px;
}
/* Map fills its pane and positions its own legend — no FAB padding there. */
#pane-map{padding-bottom:0}
.pane.active{display:block}
#pane-map.active{display:flex!important}

/* ── NAV ──
 * iOS gesture-zone buffer: keep 12px above env(safe-area-inset-bottom) so
 * taps land above the swipe-up zone in Capacitor WebView + standalone PWA.
 */
nav{
  background:var(--bg2);
  border-top:1px solid #1a1d23;
  display:flex;
  flex-shrink:0;
  min-height:var(--nav-h);
  padding-bottom:calc(env(safe-area-inset-bottom, 0px) + 12px);
  position:relative;
  z-index:50;
}
.nb{
  /* content-sized tabs (min 44px) so seven 12px labels fit a 360px phone */
  flex:1 1 auto;min-width:44px;background:none;border:none;
  color:var(--muted);
  padding:10px 4px 6px;
  cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
  -webkit-touch-callout:none;
  user-select:none;
  transition:color 0.12s;
  min-height:48px;
  position:relative;
}
.nb > *{pointer-events:none}
.nb .ic{line-height:0;display:block}
.nb .ic svg{display:block}
.nb-lbl{font-size:.8rem;font-weight:600;white-space:nowrap;font-family:var(--font)}
.nb.active{color:var(--acc)}
.nb.active .nb-lbl{font-weight:700}
.nb.active::after{
  content:'';position:absolute;bottom:2px;left:50%;
  width:4px;height:4px;border-radius:50%;
  background:var(--acc);transform:translateX(-50%);
}
.nb:active{opacity:0.6}

/* ── LOADING / SKELETONS ── */
.loading{
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;padding:60px 16px;
  color:var(--muted);gap:12px;font-size:0.875rem;
}
.spin{
  width:24px;height:24px;
  border:2px solid var(--pill);border-top-color:var(--acc);
  border-radius:50%;animation:spin 0.7s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
.err-msg{color:var(--fire);font-size:0.875rem;text-align:center;padding:16px;line-height:1.6}

.skel{
  background:var(--card);border-radius:18px;height:72px;margin-bottom:8px;
  position:relative;overflow:hidden;
}
.skel::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,0.03),transparent);
  animation:shimmer 1.4s infinite;
}
@keyframes shimmer{from{transform:translateX(-100%)}to{transform:translateX(100%)}}

/* ── SEARCH ── */
.srch-wrap{
  padding:8px 20px 10px;background:var(--bg);
  position:sticky;top:0;z-index:5;
}
.srch-inp{
  width:100%;background:var(--card);border:none;
  border-radius:14px;color:var(--text);
  padding:11px 14px;
  font-size:16px;outline:none;
  font-family:var(--font);
  -webkit-appearance:none;appearance:none;
  min-height:44px;
}
.srch-inp:focus{box-shadow:0 0 0 1.5px var(--acc) inset}
.srch-inp::placeholder{color:var(--muted)}

/* ── CALL CARDS ── */
.call-list{padding:2px 20px 8px}
.call-card{
  background:var(--card);border:none;
  border-radius:18px;margin-bottom:8px;overflow:hidden;
  cursor:pointer;
  transition:background 0.12s;
}
.call-card:active{background:var(--card2)}
.call-card.call-unread{box-shadow:0 0 0 1.5px var(--fire) inset}
.card-head{display:flex;align-items:center;padding:13px 14px;gap:12px}
.unread-dot{
  width:9px;height:9px;border-radius:50%;
  background:var(--fire);flex-shrink:0;
  box-shadow:0 0 6px rgba(236,91,82,.65);
}
.ct-badge{
  border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
}
.ct-badge svg{display:block}
.card-body{flex:1;min-width:0}
.ct-name{font-size:0.9375rem;font-weight:700;color:var(--text);line-height:1.25;letter-spacing:0.04em;text-transform:uppercase}
.ct-addr{font-size:0.8125rem;color:var(--muted);margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card-right{
  display:flex;flex-direction:column;align-items:flex-end;gap:5px;
  flex-shrink:0;
}
.meta-time{font-family:var(--font-mono);font-size:.8rem;color:var(--muted);letter-spacing:0.04em}
.meta-dur{font-family:var(--font-mono);font-size:.8rem;color:var(--muted)}
.unit-chips{display:flex;gap:4px}
.chip{
  background:var(--pill);color:var(--muted2);
  font-family:var(--font-mono);font-size:.8rem;font-weight:500;
  padding:3px 7px;border-radius:8px;letter-spacing:0.03em;
  white-space:nowrap;
}

/* legacy card-meta row (search results etc. reuse it) */
.card-meta{
  display:flex;gap:8px;margin-top:6px;
  font-family:var(--font-mono);font-size:.8rem;
  color:var(--muted);align-items:center;flex-wrap:wrap;
}
.meta-units{color:var(--muted2);font-weight:500}

/* CALL DETAIL */
.card-detail{border-top:1px solid var(--bdr);padding:10px 14px;display:none}
.card-detail.open{display:block}
.dr{display:flex;gap:8px;padding:8px 0;border-bottom:1px solid #1d2129}
.dr:last-child{border-bottom:none}
.dr-block{flex-direction:column;gap:6px}
.dl{color:var(--muted);min-width:76px;font-size:.8rem;flex-shrink:0;padding-top:2px;
  text-transform:uppercase;letter-spacing:0.06em;font-weight:600}
.dv{color:var(--text);font-family:var(--font-mono);font-size:.8rem;flex:1;word-break:break-word;line-height:1.5}
.dv-narrative{font-family:var(--font);line-height:1.5;white-space:normal;font-size:0.8125rem}
.dv-narrative .dt-p{margin:0 0 8px}
.dv-narrative .dt-p:last-child{margin-bottom:0}
.map-lnk{
  display:inline-flex;align-items:center;gap:6px;
  margin-top:10px;color:var(--acc);text-decoration:none;
  font-size:0.875rem;font-weight:600;
}
.map-lnk + .map-lnk{margin-left:20px}  /* Maps, then Start Cost Recovery Review */
/* Start Cost Recovery Review asks first (callcard.js confirmCr). */
.cr-ask{position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;padding:24px}
.cr-ask-box{width:100%;max-width:340px;background:var(--card2);border:1px solid var(--bdr);border-radius:18px;padding:22px 20px 18px;text-align:center}
.cr-ask-t{font-size:1.0625rem;font-weight:700;color:var(--text)}
.cr-ask-s{margin-top:6px;font-family:var(--font-mono);font-size:0.875rem;color:var(--muted2)}
.cr-ask-b{display:flex;gap:10px;margin-top:20px}
.cr-ask-b button{flex:1;height:46px;border-radius:12px;border:none;background:var(--pill);color:var(--text);font:600 0.9375rem var(--font);cursor:pointer}
.cr-ask-b button.yes{background:var(--acc);color:var(--acc-ink)}

.load-more{
  display:block;width:calc(100% - 40px);margin:4px 20px 16px;
  background:var(--card);border:none;color:var(--muted2);
  border-radius:14px;padding:14px;
  font-size:0.875rem;font-weight:600;cursor:pointer;text-align:center;
  font-family:var(--font);
}
.load-more:active{background:var(--card2)}

/* ── MAP ── */
/* Map queue M1 (Donald + Brad, 2026-09-29): no toolbar row. One range button
   ("Shift ▾") and Filter float top-left over the map; the Preplans switch
   floats top-right; the status line takes the second row, centred; Leaflet's
   zoom drops below the range button. */
#map-toolbar{
  position:absolute;top:10px;left:10px;z-index:9;
  display:flex;gap:6px;align-items:flex-start;pointer-events:none;
}
#map-toolbar > *{pointer-events:auto}
#rng-wrap{position:relative}
.map-fbtn{
  display:inline-flex;align-items:center;gap:6px;min-height:44px;
  background:rgba(14,15,18,.9);border:1px solid rgba(160,180,215,.14);
  color:var(--text);border-radius:999px;padding:8px 13px;
  font:700 .8rem/1 var(--font);letter-spacing:.02em;white-space:nowrap;
  box-shadow:0 4px 14px rgba(0,0,0,.45);cursor:pointer;
  touch-action:manipulation;-webkit-tap-highlight-color:transparent;
}
.map-fbtn .caret{color:var(--acc);font-size:.8rem}
#rng-btn[aria-expanded="true"]{border-color:var(--acc)}
#rng-menu{
  position:absolute;top:calc(100% + 6px);left:0;min-width:128px;
  display:flex;flex-direction:column;gap:4px;padding:6px;
  background:rgba(24,27,33,.98);border:1px solid var(--bdr);border-radius:16px;
  box-shadow:0 10px 30px rgba(0,0,0,.6);
}
#rng-menu[hidden]{display:none}
#rng-menu .rng-btn{justify-content:flex-start;background:transparent;border-radius:11px}
#rng-menu .rng-btn.active{background:var(--acc);color:var(--acc-ink)}
#leaflet-map .leaflet-top.leaflet-left{top:48px}
#me-btn{
  position:absolute;right:10px;bottom:64px;z-index:6;
  width:44px;height:44px;border-radius:50%;padding:0;
  display:flex;align-items:center;justify-content:center;
  background:rgba(14,15,18,.9);border:1px solid rgba(160,180,215,.14);color:var(--muted2);
  box-shadow:0 4px 14px rgba(0,0,0,.45);cursor:pointer;
  touch-action:manipulation;-webkit-tap-highlight-color:transparent;
}
#me-btn.on{color:var(--acc)}
#me-btn:active{opacity:.7}
#map-container{
  flex:1;position:relative;overflow:hidden;background:var(--bg);min-height:0;
}
#leaflet-map{
  position:absolute;top:0;left:0;right:0;bottom:0;
  width:100%;height:100%;z-index:1;
}
#map-loading{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:12px;
  color:var(--muted);font-size:14px;z-index:2;
  background:rgba(14,15,18,0.85);
}
/* Floats over the map (top-centre, second row: the range + Filter buttons and
   the Preplans switch hold the first) instead of occupying its own row. */
#map-status{
  position:absolute;top:56px;left:50%;transform:translateX(-50%);z-index:6;
  font-family:var(--font-mono);font-size:.8rem;color:var(--muted2);
  letter-spacing:0.05em;text-transform:uppercase;
  background:rgba(14,15,18,.82);border:1px solid rgba(160,180,215,.10);
  padding:4px 10px;border-radius:999px;white-space:nowrap;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  pointer-events:none;max-width:70%;overflow:hidden;text-overflow:ellipsis;
}
/* Map queue M1: the location-off hint and the selected-preplan line are the
   long ones; they wrap to a second line (centred) instead of losing the end. */
#map-status{white-space:normal;text-align:center;line-height:1.35;width:max-content;max-width:calc(100% - 120px);border-radius:12px}
#map-legend{
  background:var(--bg2);border-top:1px solid #1a1d23;
  padding:7px 74px 7px 14px;display:flex;flex-wrap:wrap;gap:10px;
  justify-content:center;flex-shrink:0;

  /* Map never scrolls, so the FAB cannot auto-hide here — the legend keeps
     clear of it (52px button + 16px inset + breathing room). */
  padding-right:88px;
}
#map-legend span{font-size:.8rem;color:var(--muted)}

/* Leaflet dark theme */
.leaflet-popup-content-wrapper{background:var(--card);border:none;border-radius:14px;box-shadow:0 8px 32px rgba(0,0,0,.6);color:var(--text)}
.leaflet-popup-tip{background:var(--card)}
.leaflet-popup-content{margin:12px 14px;font-size:13px}
.leaflet-popup-content a{color:var(--acc)}
.leaflet-control-zoom a{background:var(--card);color:var(--text);border-color:#1d2129;width:44px!important;height:44px!important;line-height:44px!important}
.leaflet-control-zoom a:hover{background:var(--card2)}

.rng-btn{
  background:var(--card);border:none;color:var(--muted);
  border-radius:20px;padding:9px 15px;font-size:.8rem;font-weight:600;
  white-space:nowrap;cursor:pointer;touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;flex-shrink:0;min-height:44px;min-width:44px;
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font);
}
.rng-btn.active{background:var(--acc);color:var(--acc-ink);font-weight:700}
.rng-btn:active{opacity:0.7}

#base-switch{
  position:absolute;left:10px;bottom:10px;z-index:6;
  display:flex;gap:2px;padding:3px;
  background:rgba(14,15,18,.85);border:1px solid rgba(160,180,215,.12);
  border-radius:999px;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:0 4px 14px rgba(0,0,0,.45);
}
.base-btn{
  background:none;border:none;color:var(--muted);
  border-radius:999px;padding:0 12px;min-height:44px;font-size:.8rem;font-weight:600;
  letter-spacing:0.05em;text-transform:uppercase;
  cursor:pointer;touch-action:manipulation;
  font-family:var(--font-mono);
  -webkit-tap-highlight-color:transparent;
}
.base-btn.active{background:var(--pill);color:var(--text)}
.base-btn:active{opacity:0.7}


/* Station 91 on the map: a DIAMOND, not a dot. Every call marker is a circle,
   so shape alone separates it — which means it can keep the amber and still be
   unambiguous, and it stays readable on Dark, Topo and Satellite alike.
   (A white dot with a dark ring vanished into the near-black basemap.) */
.s91-station-marker{background:none;border:none}
.s91-diamond{
  display:block;width:14px;height:14px;margin:4px;
  background:var(--acc);border:2px solid #fff;border-radius:3px;
  transform:rotate(45deg);
  box-shadow:0 0 0 1px rgba(0,0,0,.55), 0 2px 6px rgba(0,0,0,.6);
}

/* ── STATS ── */
.stats-body{padding:8px 20px 24px}
.s-title{
  font-size:.8rem;font-weight:700;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--muted);
  padding:20px 0 8px;margin-bottom:4px;
  font-family:var(--font-mono);
}
.s-row{
  display:flex;justify-content:space-between;align-items:baseline;
  padding:11px 0;border-bottom:1px solid #272c36;
}
.s-row:last-child{border-bottom:none}
.s-lbl{color:var(--muted2);font-size:0.8125rem}
.s-val{font-family:var(--font-mono);font-size:0.9375rem;color:var(--text);font-weight:700;font-variant-numeric:tabular-nums}
.s-sub{font-size:.8rem;color:var(--muted);margin-left:6px;font-weight:400}

.bar-row{display:flex;align-items:center;gap:10px;padding:5px 0;font-size:.8rem}
.bar-lbl{width:100px;flex-shrink:0;color:var(--muted2);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar-track{flex:1;background:var(--card);border-radius:5px;height:10px;position:relative}
.bar-fill{height:100%;border-radius:5px;transition:width 0.6s ease;position:relative;overflow:visible}
.bar-arrow{position:absolute;right:0;top:0;width:0;height:0;border:5px solid transparent;border-left-width:12px;transform:translateX(100%)}
.bar-cnt{width:36px;text-align:right;color:var(--muted);font-family:var(--font-mono);font-variant-numeric:tabular-nums}

.p-tbl{width:100%;border-collapse:collapse;font-size:0.8125rem;margin:6px 0 12px}
.p-tbl th{color:var(--muted);font-size:.8rem;text-transform:uppercase;
  letter-spacing:0.1em;padding:8px 6px;text-align:left;
  border-bottom:1px solid var(--bdr);font-family:var(--font-mono);font-weight:600}
.p-tbl td{padding:11px 6px;border-bottom:1px solid #272c36;color:var(--text)}
.p-tbl tbody tr:nth-child(even) td,.p-tbl tr:nth-child(even) td{background:rgba(255,255,255,0.025)}
.p-tbl tr:last-child td{border-bottom:none}
.rank-num{color:var(--muted);font-family:var(--font-mono)}

.fire-card{
  background:rgba(236,91,82,0.08);border:none;
  border-radius:14px;padding:13px 14px;margin-bottom:8px;
}
.fire-ct{font-weight:600;color:var(--fire);font-size:0.9375rem}
.fire-meta{font-size:.8rem;color:var(--muted);margin-top:4px;font-family:var(--font-mono)}

.addr-card{
  background:var(--card);border:none;
  border-radius:14px;padding:12px 14px;margin-bottom:8px;
  display:flex;justify-content:space-between;align-items:center;
}
.addr-name{font-size:0.8125rem;color:var(--muted2);flex:1;padding-right:12px}
.addr-cnt{font-family:var(--font-mono);font-size:1.25rem;color:var(--text);font-weight:700;flex-shrink:0;font-variant-numeric:tabular-nums}

/* ── PERSON ── */
.person-pane{padding:10px 20px}
.ps-wrap{position:relative;margin-bottom:10px}
.ps-dd{
  position:absolute;top:100%;left:0;right:0;
  background:var(--card2);border:none;
  border-radius:0 0 14px 14px;
  max-height:220px;overflow-y:auto;z-index:10;display:none;
  box-shadow:0 12px 32px rgba(0,0,0,0.5);
}
.ps-dd.open{display:block}
.ps-item{
  padding:12px 14px;font-size:0.875rem;cursor:pointer;
  border-bottom:1px solid #1d2129;
}
.ps-item:last-child{border-bottom:none}
.ps-item:active,.ps-item.hi{background:var(--pill)}
.ps-item strong{color:var(--acc)}

.pc{background:var(--card);border:none;border-radius:18px;
  padding:14px;margin-bottom:10px}
.pc-name{
  font-size:1.125rem;font-weight:700;color:var(--text);letter-spacing:-0.01em;
  margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid #1d2129;
}
.pc-title{
  font-size:.8rem;font-weight:700;text-transform:uppercase;
  letter-spacing:0.12em;color:var(--muted);margin-bottom:10px;
  font-family:var(--font-mono);
}

.crew-row{display:grid}
.crew-hidden{display:none!important}

/* ── FILTER OVERLAY/SHEET ── */
#filter-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,0.55);z-index:100;touch-action:none;
}
#filter-sheet{
  display:none;position:fixed;bottom:0;left:0;right:0;z-index:101;
  background:var(--bg2);border-top:none;border-radius:20px 20px 0 0;
  max-height:85vh;max-width:600px;margin:0 auto;
  flex-direction:column;
  transform:translateY(100%);transition:transform 0.28s cubic-bezier(.32,.72,.33,1);
  box-shadow:0 -12px 48px rgba(0,0,0,0.5);
}

/* ── Leaflet dark overrides ── */
.leaflet-container{background:#0e0f12!important}
.leaflet-control-zoom a{background:var(--card)!important;color:var(--text)!important;border-color:#1d2129!important}
.leaflet-control-attribution{background:transparent!important;color:#4a4f58!important;font:9px/1 sans-serif!important;padding:2px 4px!important;margin:0!important}
.leaflet-control-attribution a{color:#4a4f58!important;text-decoration:none}
.leaflet-popup-content-wrapper{background:rgba(24,27,33,0.98)!important;color:var(--text)!important;border:none!important;border-radius:14px!important;box-shadow:0 8px 32px rgba(0,0,0,0.6)!important}
.leaflet-popup-tip{background:rgba(24,27,33,0.98)!important}
.leaflet-popup-content{margin:12px 14px!important;font-family:var(--font)!important;font-size:13px!important}
.leaflet-popup-close-button{color:var(--muted)!important}

/* ── LOGIN ── */
.login-container{
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;min-height:100vh;padding:20px;
}
.login-box{
  background:var(--card);border:none;
  border-radius:20px;padding:32px;width:100%;max-width:360px;text-align:center;
}
.login-box h1{color:var(--text);font-size:1.375rem;margin-bottom:4px;letter-spacing:-0.02em}
.login-box .subtitle{color:var(--muted);font-size:0.8125rem;margin-bottom:24px}
.login-box input[type="password"]{
  width:100%;background:var(--bg);border:none;
  color:var(--text);padding:13px;border-radius:12px;font-size:16px;
  margin-bottom:12px;text-align:center;outline:none;
  font-family:var(--font);
}
.login-box input[type="password"]:focus{box-shadow:0 0 0 1.5px var(--acc) inset}
.login-error{color:var(--fire);font-size:0.8125rem;margin-bottom:8px;display:none}
.btn-primary{
  background:var(--acc);color:var(--acc-ink);border:none;
  padding:13px 24px;border-radius:12px;font-weight:700;
  cursor:pointer;width:100%;margin-top:8px;font-size:0.875rem;
  font-family:var(--font);
}
.btn-primary:active{opacity:0.8}

/* ── TABLET (768px+) ── */
@media screen and (min-width:768px){
  body{font-size:16px}
  header{padding:calc(var(--sat) + 12px) 24px 12px}
  .hd-title{font-size:1.5rem}
  .kpi-strip{padding:2px 24px 12px}
  .kpi-v{font-size:1.75rem}
  .srch-wrap{padding:8px 24px 12px}
  .srch-inp{padding:12px 16px}
  .call-list{padding:2px 24px 8px}
  .card-head{padding:15px 16px}
  .ct-name{font-size:1.0625rem}
  .ct-addr{font-size:0.875rem}
  .stats-body{padding:10px 28px 24px}
  .bar-lbl{width:120px}
  .person-pane{padding:12px 24px}
  .pc{padding:18px}
  .rng-btn{padding:9px 17px;font-size:0.8125rem}
}

/* ── DESKTOP (1024px+) ── */
@media screen and (min-width:1024px){
  header{padding:calc(var(--sat) + 14px) 32px 14px}
  .hd-title{font-size:1.625rem}
  .kpi-strip{padding:2px 32px 14px;max-width:720px}
  .srch-wrap{padding:10px 32px 14px}
  .call-list{padding:2px 32px 8px;max-width:720px}
  .stats-body{padding:12px 32px 32px;max-width:720px}
  .bar-lbl{width:160px}
  .person-pane{padding:14px 32px;max-width:720px}
  .s-lbl{font-size:0.875rem}
  .s-val{font-size:1rem}
}

/* ── PASSDOWN NOTES ── */
.pd-mgr { padding: 12px 20px; max-width: 600px; margin: 0 auto; }

.pd-add-row {
  display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px;
}
.pd-input {
  width: 100%; padding: 12px 14px; border: none;
  border-radius: 14px; background: var(--card); color: var(--text);
  font-size: 16px; font-family: var(--font); outline: none;
  resize: vertical; min-height: 64px;
}
.pd-input:focus { box-shadow: 0 0 0 1.5px var(--acc) inset; }
.pd-input::placeholder { color: var(--muted); }
/* Submit is a once-a-shift action. It was the largest, brightest element on the
   screen and pushed the notes people actually come here to READ below the fold.
   Quieter, and it only lights up once there is something to submit. */
.pd-add-btn {
  width: 100%; min-height: 44px; padding: 11px 24px; background: var(--pill); color: var(--muted2);
  border: none; border-radius: 12px; font-weight: 600; font-size: 14px;
  cursor: pointer; text-align: center; font-family: var(--font);
  transition: background .12s, color .12s;
}
.pd-add-btn.ready { background: var(--acc); color: var(--acc-ink); font-weight: 700; }
.pd-add-btn:active { opacity: .8; }
.pd-input { min-height: 48px; }

.pd-item {
  display: block;
  padding: 12px 14px 13px; margin-bottom: 8px;
  background: var(--card); border-left: none;
  border-radius: 14px;
}
/* Who wrote it and when IS the content of a shift handoff — it leads now
   instead of trailing in small grey type under the body. */
.pd-head {
  display: flex; align-items: baseline; gap: 8px;
  padding-bottom: 8px; margin-bottom: 9px;
  border-bottom: 1px solid var(--bdr);
}
.pd-item-body { min-width: 0; }
.pd-text { color: var(--text); font-size: 14.5px; line-height: 1.45; }
.pd-p { margin: 0 0 7px; }
.pd-p:last-child { margin-bottom: 0; }
.pd-ul { margin: 0 0 7px; padding-left: 17px; }
.pd-ul:last-child { margin-bottom: 0; }
.pd-ul li { margin-bottom: 5px; line-height: 1.42; }
.pd-ul li:last-child { margin-bottom: 0; }
.pd-author { font-size: 13px; font-weight: 700; color: var(--text); letter-spacing: -0.01em; }
/* Temporary highlight when arriving from a tapped passdown push notification. */
.pd-item.pd-flash { animation: pdFlash 4.2s ease-out; }
@keyframes pdFlash {
  0%, 35% { background: rgba(245, 166, 35, 0.22); box-shadow: 0 0 0 1.5px rgba(245, 166, 35, 0.6); }
  100% { background: var(--card); box-shadow: 0 0 0 1.5px transparent; }
}
.pd-time { font-size: 12px; color: var(--muted); font-family: var(--font-mono); }
/* A destructive control should not be the brightest thing on every card. It sits
   quiet at the end of the byline and only turns red on intent. */
.pd-del {
  margin-left: auto; width: 44px; height: 44px; margin-block: -9px; border: none; border-radius: 10px;
  background: transparent; color: var(--muted); font-size: 18px; cursor: pointer;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  transition: color .12s, background .12s;
}
.pd-del:hover, .pd-del:active { background: rgba(236, 91, 82, .15); color: var(--fire); }
/* Stage 6a: the server's one-line refusal ("Only a captain can delete…"),
   under the byline, in the same quiet red the calendar sheet uses. */
.pd-status { font-size: 12px; color: var(--fire); margin: -4px 0 8px; }

/* ── SETTINGS ── */
.set-group{
  background:var(--card);border:none;border-radius:18px;
  padding:16px 16px 14px;margin-bottom:12px;
}
/* A phone that is not going to alert its owner says so, at the top of the page,
   in the one colour this interface reserves for fire. Same shape as .cal-f-err
   in the calendar sheet — no new idea, just the existing one, used here. */
.set-warn{
  background:rgba(236,91,82,.14);border-radius:14px;
  padding:12px 14px;margin-bottom:12px;
  font-size:.8125rem;line-height:1.45;color:#f3a38f;
}
.set-warn b{font-weight:700}
.set-label{font-size:.8rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.12em;color:var(--muted);margin-bottom:10px;font-family:var(--font-mono)}
.set-help{font-size:.8rem;color:var(--muted);margin-top:6px;line-height:1.45}
.set-input{
  width:100%;background:var(--bg);border:none;
  color:var(--text);border-radius:12px;padding:11px 13px;font-size:16px;
  font-family:var(--font);
  -webkit-appearance:none;
}
.set-input:focus{box-shadow:0 0 0 1.5px var(--acc) inset;outline:none}
.set-radio{
  display:flex;gap:10px;align-items:flex-start;
  padding:9px 4px;border-bottom:1px solid #1d2129;cursor:pointer;
  touch-action:manipulation;
}
.set-radio:last-of-type{border-bottom:none}
.set-radio input{margin-top:3px;flex-shrink:0;width:18px;height:18px;accent-color:var(--acc)}
.set-radio-label{font-size:.95rem;color:var(--text);font-weight:600}
.set-radio-desc{font-size:.8rem;color:var(--muted);margin-top:2px}
.set-tone{align-items:center}
.set-tone input{margin-top:0}
.set-tone .set-radio-label{flex:1}
.set-tone-play{width:34px;height:34px;border-radius:50%;border:1px solid var(--muted);background:none;color:var(--text);font-size:.8rem;cursor:pointer;touch-action:manipulation}
.set-tone-spin{width:16px;height:16px;border:2px solid var(--muted);border-top-color:var(--acc);border-radius:50%;animation:set-spin .8s linear infinite}
.set-tone-spin[hidden]{display:none}
@keyframes set-spin{to{transform:rotate(360deg)}}
.set-units-grid{
  display:grid;grid-template-columns:repeat(auto-fill, minmax(72px, 1fr));
  gap:8px;
}
.set-chip{
  display:flex;align-items:center;justify-content:center;gap:5px;
  background:var(--bg);border:none;border-radius:12px;
  padding:11px 8px;font-size:.85rem;color:var(--muted2);cursor:pointer;
  font-weight:600;touch-action:manipulation;font-family:var(--font-mono);
}
.set-chip:has(input:checked){
  background:rgba(245,166,35,.14);color:var(--acc);
  box-shadow:0 0 0 1.5px var(--acc) inset;
}
.set-chip input{display:none}
.set-toggle{
  display:flex;gap:10px;align-items:center;padding:9px 4px;
  border-bottom:1px solid #1d2129;cursor:pointer;touch-action:manipulation;
}
.set-toggle:last-of-type{border-bottom:none}
.set-toggle input{width:18px;height:18px;accent-color:var(--acc)}
.set-toggle span{font-size:.9rem;color:var(--text)}
.set-actions{display:flex;gap:10px;margin-top:18px}
.set-save-btn,.set-test-btn{
  flex:1;min-height:44px;padding:13px 16px;border:none;border-radius:12px;
  font-size:.95rem;font-weight:700;cursor:pointer;touch-action:manipulation;
  font-family:var(--font);
}
.set-save-btn{background:var(--acc);color:var(--acc-ink)}
.set-save-btn:active{opacity:.7}
.set-test-btn{background:var(--pill);color:var(--text)}
.set-test-btn:active{opacity:.7}
.set-status{margin-top:12px;font-size:.85rem;text-align:center;min-height:1.2em}
.set-empty{padding:32px 18px;text-align:center;color:var(--muted);line-height:1.55}
.set-empty p{margin:0 0 10px}

/* ── STATS CHARTS ── */
.cc{margin:2px 0 4px}
.cc-plot{display:flex;align-items:flex-end;gap:2px;height:96px;border-bottom:1px solid var(--bdr);padding-bottom:1px}
.cc-col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;min-width:0}
.cc-bar{width:100%;background:rgba(245,166,35,0.45);border-radius:4px 4px 0 0;transition:background 0.15s}
.cc-col:hover .cc-bar{background:rgba(245,166,35,0.8)}
.cc-bar.max{background:var(--acc)}
.cc-cap{font-family:var(--font-mono);font-size:.8rem;color:var(--acc);margin-bottom:2px;font-weight:700}
.cc-x{position:relative;height:14px;margin-top:3px}
.cc-x span{position:absolute;transform:translateX(-50%);font-family:var(--font-mono);font-size:.8rem;color:var(--muted)}
.cc-lbl{font-family:var(--font-mono);font-size:.8rem;color:var(--muted);letter-spacing:0.08em;margin:6px 0 4px;font-weight:600}
.ct-dom{background:var(--card);border-radius:12px;padding:10px 12px;margin:4px 0 8px}
.ct-dom-hd{display:flex;justify-content:space-between;align-items:baseline}
.ct-dom-name{font-weight:700;font-size:0.8125rem}
.ct-dom-n{font-family:var(--font-mono);font-weight:700}
.ct-dom-share{font-size:.8rem;color:var(--muted);margin-top:1px}
.ct-dom-band{height:6px;background:var(--bdr);border-radius:3px;margin-top:8px;overflow:hidden}
.ct-dom-band div{height:100%;border-radius:3px}

/* ── ROUND 2: timeline, day headers, search row ── */
.srch-row{display:flex;gap:8px;align-items:stretch}
.day-hd{
  font-family:var(--font-mono);font-size:.8rem;font-weight:700;
  color:var(--muted);letter-spacing:0.12em;
  padding:14px 4px 6px;display:flex;align-items:center;gap:10px;
}
.day-hd::after{content:'';flex:1;height:1px;background:var(--bdr)}
.tl{padding:10px 0 6px;border-bottom:1px solid var(--bdr);margin-bottom:6px}
.tl-bar{display:flex;gap:2px;height:8px;border-radius:4px;overflow:hidden}
.tl-bar div{border-radius:2px}
.tl-labels{display:flex;gap:14px;flex-wrap:wrap;margin-top:7px}
.tl-seg{font-family:var(--font-mono);font-size:.8rem;color:var(--muted);display:flex;align-items:center;gap:5px;letter-spacing:0.04em}
.tl-seg b{color:var(--text);font-weight:700}
.tl-dot{width:7px;height:7px;border-radius:50%;display:inline-block}
.tl-clocks{
  font-family:var(--font-mono);margin-top:8px;
  display:flex;flex-wrap:wrap;gap:6px 14px;
}
/* Same weight as the TURNOUT / TRAVEL / ON SCENE row directly above: quiet
   label, value in full ink. These two rows read as one instrument. */
.tl-clk{
  font-size:.8rem;color:var(--text);font-weight:700;
  letter-spacing:0.04em;display:flex;align-items:baseline;gap:5px;
  font-variant-numeric:tabular-nums;
}
.tl-clk i{
  font-style:normal;font-size:.8rem;font-weight:400;
  color:var(--muted);letter-spacing:0.04em;
}

/* ── ROUND 3: STEEL plates, radial clock, heat calendar ── */
.p-title{
  font-family:var(--font-mono);font-size:.8rem;font-weight:700;
  color:var(--text);letter-spacing:0.14em;
  margin:26px 0 10px;display:flex;align-items:center;gap:10px;
}
.p-title .p-num{color:var(--muted2);font-weight:700}
.p-title::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,var(--bdr),transparent)}
.plate{
  background:var(--card);border:1px solid var(--bdr);border-radius:16px;
  padding:14px 14px 12px;
}
.rc-wrap{display:flex;justify-content:center;padding:4px 0 0}
.rc{width:min(78vw,300px);height:auto}
.rc-tick{fill:var(--muted);font-family:var(--font-mono);font-size:12px;text-anchor:middle;letter-spacing:0.05em}
.rc-peak{fill:var(--text);font-family:var(--font-mono);font-size:26px;font-weight:700;text-anchor:middle}
.rc-sub{fill:var(--muted);font-family:var(--font-mono);font-size:12px;text-anchor:middle;letter-spacing:0.12em}
.hc-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px}
.hc{position:relative;padding-top:16px}
.hc-months{position:absolute;top:0;left:0;right:0;height:14px}
.hc-months span{position:absolute;font-family:var(--font-mono);font-size:.8rem;color:var(--muted);letter-spacing:0.06em}
.hc-grid{display:grid;grid-template-rows:repeat(7,10px);grid-auto-flow:column;grid-auto-columns:10px;gap:2px}
.hc-c{width:10px;height:10px;border-radius:2.5px;display:inline-block}
.hc-pad{background:transparent}
.hc-l0{background:rgba(255,255,255,0.05)}
.hc-l1{background:rgba(245,166,35,0.25)}
.hc-l2{background:rgba(245,166,35,0.5)}
.hc-l3{background:rgba(245,166,35,0.75)}
.hc-l4{background:var(--acc)}
.hc-legend{display:flex;align-items:center;gap:4px;justify-content:flex-end;margin-top:8px}
.hc-legend span:first-child,.hc-legend span:last-child{font-family:var(--font-mono);font-size:.8rem;color:var(--muted);margin:0 2px}

/* ── CREW BASEBALL CARD ── */
.bc{
  position:relative;background:linear-gradient(160deg,#1a1e26 0%,#14171c 55%,#12141a 100%);
  border:1px solid #2a2f3a;border-top:3px solid #39404e;border-radius:18px;
  padding:16px 18px 14px;margin:12px 0 16px;overflow:hidden;
}
.bc::before{
  content:'';position:absolute;top:-40px;right:-40px;width:150px;height:150px;
  background:radial-gradient(circle,rgba(160,180,215,0.05),transparent 70%);pointer-events:none;
}
.bc-top{
  display:flex;justify-content:space-between;align-items:center;
  font-family:var(--font-mono);font-size:.8rem;font-weight:700;
  color:var(--muted);letter-spacing:0.16em;
}
.bc-badge{
  color:var(--muted2);background:var(--pill);border-radius:4px;
  padding:2px 6px;letter-spacing:0.1em;
}
.bc-name{
  font-size:1.75rem;font-weight:800;letter-spacing:-0.02em;color:var(--text);
  margin-top:10px;line-height:1.05;text-transform:uppercase;
}
.bc-sub{
  font-family:var(--font-mono);font-size:.8rem;color:var(--muted);
  letter-spacing:0.1em;margin-top:4px;
}
.bc-heroes{display:flex;gap:8px;margin:16px 0 4px;text-align:center}
.bc-hero{flex:1;background:rgba(255,255,255,0.03);border-radius:12px;padding:10px 4px 8px}
.bc-hv{font-size:1.75rem;font-weight:800;letter-spacing:-0.02em;color:var(--text);font-variant-numeric:tabular-nums}
.bc-hv.bc-acc{color:var(--acc)}
.bc-hl{font-family:var(--font-mono);font-size:.8rem;font-weight:700;color:var(--muted);letter-spacing:0.12em;margin-top:2px}
.bc-rows{margin:12px 0 2px}
.bc-row{
  display:flex;align-items:center;gap:8px;
  font-size:0.8125rem;color:var(--muted2);padding:5px 0;
}
/* One neutral marker. These were three arbitrary colours with no legend, so
   they read as meaning something they didn't. */
.bc-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0;background:var(--muted);opacity:.75}
.bc-strip{display:flex;align-items:flex-end;gap:3px;height:34px;margin-top:12px}
.bc-sb{flex:1;height:100%;display:flex;align-items:flex-end}
.bc-sb div{width:100%;background:rgba(245,166,35,0.55);border-radius:2px 2px 0 0;min-height:0}
.bc-stripl{font-family:var(--font-mono);font-size:.8rem;color:var(--muted);letter-spacing:0.1em;margin-top:5px;text-align:right}

/* ── YEAR SKYLINE ── */
.sky{margin:2px 0 0}
.sky-plot{display:flex;align-items:flex-end;gap:2px;height:84px;border-bottom:1px solid var(--bdr);padding-bottom:1px}
.sky-col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;min-width:0}
.sky-bar{width:100%;background:rgba(245,166,35,0.5);border-radius:3px 3px 0 0;transition:background 0.15s}
.sky-col:hover .sky-bar{background:rgba(245,166,35,0.85)}
.sky-bar.max{background:var(--acc)}
.sky-cap{font-family:var(--font-mono);font-size:.8rem;color:var(--acc);font-weight:700;margin-bottom:2px}
.sky-x{position:relative;height:14px;margin-top:3px}
.sky-x span{position:absolute;transform:translateX(-50%);font-family:var(--font-mono);font-size:.8rem;color:var(--muted)}

/* ── YEAR EKG ── */
.ekg{position:relative}
.ekg-svg{display:block;width:100%;height:112px}
.ekg-peak{
  position:absolute;top:0;transform:translateX(-50%);
  font-family:var(--font-mono);font-size:.8rem;font-weight:700;
  color:var(--fire);letter-spacing:0.08em;white-space:nowrap;
}
.ekg-live{transform-box:fill-box;transform-origin:center;animation:ekgPulse 1.6s ease-out infinite}
@keyframes ekgPulse{0%{opacity:1;transform:scale(1)}50%{opacity:0.45;transform:scale(1.7)}100%{opacity:1;transform:scale(1)}}

/* ── YEAR TIMELINE (scrubbable) ── */
.yr-read{
  display:flex;justify-content:space-between;align-items:baseline;
  font-family:var(--font-mono);margin-bottom:10px;
}
.yr-date{font-size:0.8125rem;font-weight:700;color:var(--text);letter-spacing:0.08em}
.yr-val{font-size:0.8125rem;font-weight:700;color:var(--acc);letter-spacing:0.06em}
.yr-fire{font-size:0.8125rem;font-weight:700;color:var(--fire);letter-spacing:0.06em}
.yr-plot{position:relative;touch-action:none;cursor:crosshair}
.yr-svg{display:block;width:100%;height:92px}
.yr-cursor{
  position:absolute;top:0;bottom:5px;width:1.5px;background:var(--acc);
  transform:translateX(-50%);pointer-events:none;
  box-shadow:0 0 8px rgba(245,166,35,0.7);
}
.yr-hint{
  font-family:var(--font-mono);font-size:.8rem;color:var(--muted);
  letter-spacing:0.1em;margin-top:10px;text-align:center;
}

/* hour-strip readout on the station card */
.bc-stripl{display:flex;justify-content:space-between;align-items:baseline}
.hr-read{color:var(--acc);font-weight:700}
.bc-stripl > span:only-child{margin-left:auto}

/* ── PULL TO REFRESH ── */
.pane{overscroll-behavior-y:contain}
#ptr-hint{
  height:0;overflow:hidden;transition:height 0.18s ease-out;
  display:flex;align-items:center;justify-content:center;
}
#ptr-hint span{
  font-family:var(--font-mono);font-size:.8rem;font-weight:700;
  color:var(--acc);letter-spacing:0.14em;
}

/* Donald, 2026-09-03: passdown poster name (remembered per device) */
.pd-name{max-height:36px;margin-bottom:6px}
.pd-name-missing{outline:2px solid #ec5b52}

/* a small visual control with a 44px glove-size tap area (the element must be positioned) */
.hit44::before{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%)}

/* ── ACCESSIBILITY (UI/UX audit, 2026-10-10) ──
 * A keyboard focus ring everywhere (zero specificity: fields keep their own inset ring),
 * 16px fields by default (iOS zooms the page into anything smaller on focus; 1rem is 15px
 * here), and no motion for anyone who asked their phone for less. */
:where(:focus-visible){outline:2px solid var(--acc);outline-offset:2px}
:where(input,select,textarea){font-size:16px}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}