/* Fonts are served from this site so the app looks right offline. Licensed under the SIL Open Font License (fonts/OFL.txt). */
@font-face{font-family:"Barlow";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/Barlow-Regular.woff) format("woff")}
@font-face{font-family:"Barlow";font-weight:500;font-style:normal;font-display:swap;src:url(fonts/Barlow-Medium.woff) format("woff")}
@font-face{font-family:"Barlow";font-weight:600;font-style:normal;font-display:swap;src:url(fonts/Barlow-SemiBold.woff) format("woff")}
@font-face{font-family:"Barlow";font-weight:700;font-style:normal;font-display:swap;src:url(fonts/Barlow-Bold.woff) format("woff")}
@font-face{font-family:"Barlow Condensed";font-weight:600;font-style:normal;font-display:swap;src:url(fonts/BarlowCondensed-SemiBold.woff) format("woff")}
@font-face{font-family:"Barlow Condensed";font-weight:700;font-style:normal;font-display:swap;src:url(fonts/BarlowCondensed-Bold.woff) format("woff")}
@font-face{font-family:"IBM Plex Mono";font-weight:500;font-style:normal;font-display:swap;src:url(fonts/IBMPlexMono-Medium.woff) format("woff")}

/* Layout: fixed navy command rail (w-64) + white work surface; status encoded as colored stripes and pills. */
:root{
  --bg:#ffffff; --fg:hsl(218 46% 12%); --muted:hsl(218 18% 42%); --surface:hsl(218 33% 97%);
  --card:#ffffff; --border:hsl(218 24% 88%); --ring:hsl(348 85% 42% / .35);
  --primary:hsl(348 85% 42%); --primary-strong:hsl(348 85% 36%); --primary-fg:#ffffff; --primary-soft:hsl(348 85% 42% / .09);
  --accent:hsl(218 46% 19%); --accent-fg:#ffffff; --accent-soft:hsl(218 46% 19% / .08);
  --sb-bg:hsl(218 46% 14%); --sb-fg:hsl(218 35% 90%); --sb-muted:hsl(218 22% 64%); --sb-hover:hsl(218 40% 21%); --sb-primary:hsl(348 85% 42%); --sb-line:hsl(218 35% 22%);
  --ok:hsl(142 70% 29%); --ok-soft:hsl(142 71% 45% / .14); --ok-dot:hsl(142 71% 45%);
  --warn:hsl(32 90% 32%); --warn-soft:hsl(43 96% 56% / .24); --warn-dot:hsl(43 96% 50%);
  --bad:hsl(348 85% 40%); --bad-soft:hsl(348 85% 42% / .11); --bad-dot:hsl(348 85% 48%);
  --none:hsl(218 15% 50%); --none-soft:hsl(218 15% 50% / .12);
  --chart-1:hsl(348 85% 42%); --chart-2:hsl(218 46% 19%); --chart-3:hsl(142 71% 45%); --chart-4:hsl(43 96% 56%); --chart-5:hsl(27 87% 67%);
  --overlay:hsl(218 46% 8% / .55); --shadow:0 12px 40px hsl(218 46% 10% / .18);
  --radius:.625rem;
  --f-display:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --f-body:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:hsl(218 46% 10%); --fg:hsl(218 30% 93%); --muted:hsl(218 18% 66%); --surface:hsl(218 42% 12%);
  --card:hsl(218 42% 13%); --border:hsl(218 30% 22%); --ring:hsl(348 85% 52% / .45);
  --primary:hsl(348 85% 52%); --primary-strong:hsl(348 85% 46%); --primary-soft:hsl(348 85% 52% / .16);
  --accent:hsl(218 46% 30%); --accent-soft:hsl(218 46% 50% / .16);
  --sb-bg:hsl(218 46% 14%); --sb-hover:hsl(218 40% 21%); --sb-primary:hsl(348 85% 48%);
  --ok:hsl(142 60% 60%); --ok-soft:hsl(142 71% 45% / .18); --warn:hsl(43 96% 62%); --warn-soft:hsl(43 96% 56% / .16);
  --bad:hsl(348 90% 70%); --bad-soft:hsl(348 85% 52% / .2); --none:hsl(218 15% 65%); --none-soft:hsl(218 15% 60% / .16);
  --chart-2:hsl(218 46% 45%); --overlay:hsl(218 46% 4% / .7); --shadow:0 12px 40px hsl(218 50% 2% / .5);
  color-scheme:dark;
}}
:root[data-theme="dark"]{
  --bg:hsl(218 46% 10%); --fg:hsl(218 30% 93%); --muted:hsl(218 18% 66%); --surface:hsl(218 42% 12%);
  --card:hsl(218 42% 13%); --border:hsl(218 30% 22%); --ring:hsl(348 85% 52% / .45);
  --primary:hsl(348 85% 52%); --primary-strong:hsl(348 85% 46%); --primary-soft:hsl(348 85% 52% / .16);
  --accent:hsl(218 46% 30%); --accent-soft:hsl(218 46% 50% / .16);
  --sb-bg:hsl(218 46% 14%); --sb-hover:hsl(218 40% 21%); --sb-primary:hsl(348 85% 48%);
  --ok:hsl(142 60% 60%); --ok-soft:hsl(142 71% 45% / .18); --warn:hsl(43 96% 62%); --warn-soft:hsl(43 96% 56% / .16);
  --bad:hsl(348 90% 70%); --bad-soft:hsl(348 85% 52% / .2); --none:hsl(218 15% 65%); --none-soft:hsl(218 15% 60% / .16);
  --chart-2:hsl(218 46% 45%); --overlay:hsl(218 46% 4% / .7); --shadow:0 12px 40px hsl(218 50% 2% / .5);
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{background:var(--bg);color:var(--fg);font-family:var(--f-body);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:40;background:var(--sb-bg)}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
svg.i{width:1.15em;height:1.15em;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.num,.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums;font-size:.9em}
.tnum{font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Sidebar */
.sidebar{position:fixed;top:0;bottom:0;left:0;width:16rem;z-index:60;background:var(--sb-bg);color:var(--sb-fg);display:flex;flex-direction:column;gap:18px;
  padding:calc(16px + env(safe-area-inset-top,0px)) 14px calc(16px + env(safe-area-inset-bottom,0px)) calc(14px + env(safe-area-inset-left,0px));
  transform:translateX(-102%);transition:transform .22s ease;overflow-y:auto}
.sidebar.open{transform:none;box-shadow:var(--shadow)}
.sb-close{position:absolute;top:calc(10px + env(safe-area-inset-top,0px));right:10px;background:var(--sb-hover);border:0;color:#fff;border-radius:8px;width:34px;height:34px;display:grid;place-items:center;cursor:pointer;z-index:2}
.logo-card{background:#fff;border-radius:var(--radius);padding:8px;box-shadow:0 2px 0 hsl(348 85% 42%)}
.logo-card img{display:block;width:100%;height:8rem;object-fit:contain}
.nav{display:flex;flex-direction:column;gap:3px}
.nav-label{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--sb-muted);padding:0 12px 4px;font-weight:600}
.nav a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:8px;text-decoration:none;color:var(--sb-fg);font-weight:500;cursor:pointer}
.nav a:hover{background:var(--sb-hover)}
.nav a.active{background:var(--sb-primary);color:#fff;font-weight:600}
.nav a .badge{margin-left:auto;background:hsl(348 85% 42%);color:#fff;font-size:11px;font-weight:700;border-radius:999px;padding:0 7px;line-height:18px}
.nav a.active .badge{background:#fff;color:hsl(348 85% 38%)}
.sb-foot{margin-top:auto;display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--sb-line);padding-top:14px}
.viewer{display:flex;align-items:center;gap:10px;font-size:13px}
.viewer img{width:30px;height:30px;border-radius:50%}
.viewer small{display:block;color:var(--sb-muted);font-size:11.5px}
.tagline{font-family:var(--f-display);text-transform:uppercase;letter-spacing:.14em;font-size:13px;color:var(--sb-muted);text-align:center}
.overlay{position:fixed;inset:0;background:var(--overlay);z-index:55}

/* Top bar (mobile) */
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--sb-bg);color:#fff;display:flex;align-items:center;gap:10px;
  padding-block:10px;padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px))}
.topbar .brand{font-family:var(--f-display);font-weight:700;font-size:21px;letter-spacing:.04em;text-transform:uppercase}
.topbar .brand b{color:hsl(348 85% 62%)}
.icon-btn{background:transparent;border:0;color:inherit;width:38px;height:38px;border-radius:8px;display:grid;place-items:center;cursor:pointer}
.icon-btn:hover{background:var(--sb-hover)}
.topbar .btn{margin-left:auto}
@media (min-width:1024px){
  .sidebar{transform:none}
  .sb-close,.overlay,.topbar{display:none!important}
  .main{padding-left:16rem}
}
.content{max-width:80rem;margin:0 auto;padding-block:20px 64px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));display:flex;flex-direction:column;gap:22px}
@media (min-width:640px){.content{padding-block:26px 64px;padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}}
@media (min-width:1024px){.content{padding-block:32px 72px;padding-left:32px;padding-right:max(32px,env(safe-area-inset-right,0px))}}

/* Type */
.page-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px}
.page-head > div{min-width:0}
.eyebrow{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--primary)}
h1{font-family:var(--f-display);font-weight:700;text-transform:uppercase;letter-spacing:.015em;font-size:clamp(28px,4.4vw,40px);line-height:1;margin:4px 0 0;text-wrap:balance}
h2{font-family:var(--f-display);font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:20px;line-height:1.1;margin:0;text-wrap:balance}
h3{font-size:16px;font-weight:700;margin:0;line-height:1.25}
.sub{color:var(--muted);margin:6px 0 0;font-size:14px}
.section{display:flex;flex-direction:column;gap:12px}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.link{background:none;border:0;padding:0;color:var(--primary);font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:4px}
.back{background:none;border:0;padding:0;color:var(--muted);font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-size:14px}
.back:hover{color:var(--fg)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 15px;border-radius:8px;border:1px solid var(--border);background:var(--card);color:var(--fg);font-weight:600;font-size:14px;cursor:pointer;white-space:nowrap;text-decoration:none;line-height:1.2}
.btn:hover{border-color:var(--muted)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-primary{background:var(--primary);border-color:transparent;color:var(--primary-fg)}
.btn-primary:hover{background:var(--primary-strong);border-color:transparent}
.btn-accent{background:hsl(218 46% 19%);border-color:transparent;color:#fff}
.btn-danger{color:var(--bad);border-color:var(--bad-soft);background:transparent}
.btn-danger:hover{background:var(--bad-soft);border-color:var(--bad)}
.btn-sm{padding:6px 10px;font-size:13px;border-radius:7px}
.btn-lg{padding:12px 20px;font-size:16px}
.btn-sos{background:var(--primary);color:#fff;border:0;font-family:var(--f-display);text-transform:uppercase;letter-spacing:.06em;font-size:18px;padding:12px 22px;box-shadow:0 0 0 4px var(--primary-soft)}
.btn-sos:hover{background:var(--primary-strong)}
.topbar .btn-sos{font-size:14px;padding:7px 12px;box-shadow:none}
.btn-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}

/* Cards & surfaces */
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius)}
.pad{padding:16px}
@media (min-width:640px){.pad{padding:18px 20px}}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(auto-fill,minmax(min(100%,22rem),1fr))}
.g3{grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr))}
.g4{grid-template-columns:repeat(auto-fill,minmax(min(100%,14rem),1fr))}
.split{display:grid;gap:22px}
@media (min-width:1100px){.split{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}}
.clickable{cursor:pointer;transition:border-color .15s, transform .15s}
.clickable:hover{border-color:var(--muted)}
@media (prefers-reduced-motion:no-preference){.clickable:hover{transform:translateY(-1px)}}

/* Stat */
.stat{padding:16px 18px;display:flex;flex-direction:column;gap:4px;position:relative;overflow:hidden}
.stat .lbl{font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:8px}
.stat .val{font-family:var(--f-display);font-weight:700;font-size:48px;line-height:1;font-variant-numeric:tabular-nums}
.stat .note{font-size:13px;color:var(--muted);min-height:1.5em}
.stat.hot{border-color:var(--primary)}
.stat.hot .val{color:var(--primary)}
.stat .ico{position:absolute;right:14px;top:14px;color:var(--border)}
.stat .ico svg{width:34px;height:34px}

/* Pills / badges */
.pill{display:inline-flex;align-items:center;gap:6px;padding:2px 9px;border-radius:999px;font-size:12.5px;font-weight:600;line-height:20px;white-space:nowrap;background:var(--none-soft);color:var(--none)}
.pill.sm{font-size:11.5px;padding:0 7px;line-height:18px}
.pill .dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.t-green{background:var(--ok-soft);color:var(--ok)} .t-green .dot{background:var(--ok-dot)}
.t-yellow{background:var(--warn-soft);color:var(--warn)} .t-yellow .dot{background:var(--warn-dot)}
.t-red{background:var(--bad-soft);color:var(--bad)} .t-red .dot{background:var(--bad-dot)}
.t-navy{background:var(--accent-soft);color:var(--fg)}
.t-solid-red{background:var(--primary);color:#fff}
.t-solid-navy{background:hsl(218 46% 19%);color:#fff}
.t-outline{background:transparent;border:1px solid var(--border);color:var(--fg)}
.t-amber{background:var(--warn-soft);color:var(--warn)}

/* Call buttons */
.calls{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr))}
.call{display:flex;align-items:stretch;border-radius:var(--radius);overflow:hidden;border:2px solid transparent;min-width:0}
.call a{flex:1;display:flex;align-items:center;gap:12px;padding:13px 14px;text-decoration:none;min-width:0}
.call .ph{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;flex:none}
.call .ph svg{width:20px;height:20px}
.call .who{min-width:0}
.call .who b{display:block;font-size:15.5px;line-height:1.2}
.call .who span{display:block;font-size:12.5px;opacity:.85}
.call .who .mono{display:block;font-size:13px;margin-top:2px;opacity:1;user-select:all}
.call .cp{border:0;background:transparent;padding:0 12px;cursor:pointer;color:inherit;opacity:.8}
.call .cp:hover{opacity:1}
.call-primary{background:var(--primary);color:#fff}
.call-primary .ph{background:hsl(0 0% 100% / .18)}
.call-primary .cp{border-left:1px solid hsl(0 0% 100% / .25)}
.call-accent{background:hsl(218 46% 19%);color:#fff}
.call-accent .ph{background:hsl(0 0% 100% / .14)}
.call-accent .cp{border-left:1px solid hsl(0 0% 100% / .2)}
.call-outline{background:var(--card);color:var(--fg);border-color:var(--primary)}
.call-outline .ph{background:var(--primary-soft);color:var(--primary)}
.call-outline .cp{border-left:1px solid var(--border)}

/* Lists */
.list{display:flex;flex-direction:column}
.row{display:flex;gap:12px;align-items:flex-start;padding:13px 16px;border-top:1px solid var(--border);position:relative}
.row:first-child{border-top:0}
.row.sev::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:4px;border-radius:0 4px 4px 0;background:var(--none)}
.row.sev-green::before{background:var(--ok-dot)} .row.sev-yellow::before{background:var(--warn-dot)} .row.sev-red::before{background:var(--bad-dot)}
.row .main-col{flex:1;min-width:0}
.row .meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;color:var(--muted);margin-top:3px}
.row .meta span{display:inline-flex;align-items:center;gap:5px}
.row .side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none}
.row.clickable:hover{background:var(--surface);transform:none}
.excerpt{margin:6px 0 0;font-size:14px;overflow-wrap:anywhere}
.detail-grid{display:grid;gap:10px 18px;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));margin-top:12px;padding:12px;background:var(--surface);border-radius:8px;font-size:14px}
.detail-grid dt{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
.detail-grid dd{margin:2px 0 0;overflow-wrap:anywhere}

/* Toolbar */
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.search{position:relative;flex:1 1 16rem;min-width:0}
.search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--muted)}
.search input{width:100%;padding:9px 12px 9px 36px;border:1px solid var(--border);border-radius:8px;background:var(--card)}
.seg{display:inline-flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--card);flex-wrap:wrap}
.seg button{border:0;background:transparent;padding:8px 12px;font-weight:600;font-size:13.5px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;color:var(--muted)}
.seg button + button{border-left:1px solid var(--border)}
.seg button.on{background:var(--accent-soft);color:var(--fg)}
.seg .dot{width:8px;height:8px;border-radius:50%}

/* Banner */
.banner{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:var(--radius);border:1px solid;font-size:14px}
.banner > div{min-width:0}
.banner.warn{background:var(--warn-soft);border-color:hsl(43 96% 50% / .45);color:var(--fg)}
.banner.warn > svg{color:var(--warn)}
.banner.bad{background:var(--bad-soft);border-color:hsl(348 85% 42% / .35)}
.banner.bad > svg{color:var(--bad)}
.banner.info{background:var(--accent-soft);border-color:var(--border)}

/* Member */
.avatar{width:46px;height:46px;border-radius:50%;flex:none;display:grid;place-items:center;font-weight:700;font-family:var(--f-display);font-size:19px;letter-spacing:.03em;color:#fff;background:hsl(218 46% 24%);overflow:hidden}
.avatar.lg{width:76px;height:76px;font-size:30px}
.avatar img{width:100%;height:100%;object-fit:cover}
.certs{display:flex;flex-wrap:wrap;gap:6px}
.cert{display:inline-flex;flex-direction:column;gap:0;padding:5px 9px;border-radius:7px;font-size:12px;line-height:1.3;min-width:5.5rem}
.cert b{font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.cert.big{padding:10px 14px;min-width:9rem;font-size:13.5px}
.cert.big b{font-size:12px}
.member-card{padding:16px;display:flex;flex-direction:column;gap:12px}
.member-card .top{display:flex;gap:12px;align-items:center;min-width:0}
.member-card .top > div{min-width:0}
.member-card .foot{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--muted);border-top:1px solid var(--border);padding-top:10px}

/* Events */
.ev{display:flex;flex-direction:column;overflow:hidden}
.ev.upcoming{border-color:hsl(218 46% 40% / .55);box-shadow:inset 4px 0 0 var(--primary)}
.ev-head{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;cursor:pointer;background:none;border:0;text-align:left;width:100%}
.datebox{flex:none;width:58px;border-radius:8px;overflow:hidden;text-align:center;border:1px solid var(--border);background:var(--card)}
.datebox .m{background:hsl(218 46% 19%);color:#fff;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:2px 0}
.datebox .d{font-family:var(--f-display);font-weight:700;font-size:28px;line-height:1.15}
.datebox .w{font-size:11px;color:var(--muted);padding-bottom:3px;text-transform:uppercase;letter-spacing:.06em}
.ev.upcoming .datebox .m{background:var(--primary)}
.ev-body{border-top:1px solid var(--border);padding:14px 16px;display:flex;flex-direction:column;gap:14px;background:var(--surface)}
.chev{transition:transform .15s;color:var(--muted);margin-left:auto;align-self:center}
.ev.open .chev{transform:rotate(180deg)}
.type-dot{width:9px;height:9px;border-radius:2px;display:inline-block}
.roster-role{display:flex;flex-direction:column;gap:6px}
.roster-role h4{margin:0;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.shift{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:9px 12px;background:var(--card);border:1px solid var(--border);border-radius:8px}
.shift .nm{font-weight:600;flex:1 1 9rem;min-width:0}
.shift .times{font-size:12.5px;color:var(--muted)}

/* Kits */
.kit-card{padding:16px;display:flex;gap:14px;align-items:flex-start}
.kit-card > div{min-width:0;flex:1}
.qr{background:#fff;border-radius:6px;padding:4px;flex:none;border:1px solid var(--border);line-height:0}
.qr svg{display:block;width:100%;height:auto}
.qr.sm{width:64px}
.qr.lg{width:150px}
.qr-fallback{width:100%;aspect-ratio:1;display:grid;place-items:center;color:hsl(218 46% 19%)}
.qr-label{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px;border:1px dashed var(--border);border-radius:var(--radius);background:var(--card)}
.qr-label .code{font-family:var(--f-mono);font-size:13px;letter-spacing:.06em}
.qty{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:7px;overflow:hidden;background:var(--card)}
.qty button{border:0;background:transparent;width:30px;height:30px;cursor:pointer;font-size:17px;font-weight:600}
.qty button:hover{background:var(--surface)}
.qty span{min-width:2.4rem;text-align:center;font-family:var(--f-mono);font-variant-numeric:tabular-nums;font-size:14px}

/* Tables */
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:10px 12px;border-bottom:1px solid var(--border);white-space:nowrap}
td{padding:10px 12px;border-bottom:1px solid var(--border);vertical-align:middle}
tr:last-child td{border-bottom:0}
td.r,th.r{text-align:right}
td.c,th.c{text-align:center}
.chk{width:20px;height:20px;accent-color:var(--primary);cursor:pointer}

/* Protocols */
.triage{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(min(100%,16rem),1fr))}
.tri{padding:14px 16px;border-radius:var(--radius);border:1px solid var(--border);display:flex;flex-direction:column;gap:6px;background:var(--card);border-top:5px solid}
.tri.red{border-top-color:var(--bad-dot)} .tri.yellow{border-top-color:var(--warn-dot)} .tri.green{border-top-color:var(--ok-dot)}
.tri h3{font-family:var(--f-display);text-transform:uppercase;letter-spacing:.04em;font-size:19px}
.tri ul{margin:0;padding-left:18px;font-size:13.5px;color:var(--muted)}
.proto{padding:16px;display:flex;flex-direction:column;gap:10px}
.proto .pi{width:42px;height:42px;border-radius:10px;display:grid;place-items:center}
.proto .pi svg{width:22px;height:22px}
.pi.red{background:var(--bad-soft);color:var(--bad)} .pi.yellow{background:var(--warn-soft);color:var(--warn)} .pi.green{background:var(--ok-soft);color:var(--ok)}
.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;counter-reset:s}
.steps li{display:flex;gap:14px;align-items:flex-start;counter-increment:s;max-width:46rem}
.steps li::before{content:counter(s);flex:none;width:34px;height:34px;border-radius:50%;background:hsl(218 46% 19%);color:#fff;display:grid;place-items:center;font-family:var(--f-display);font-weight:700;font-size:18px}
.steps li p{margin:5px 0 0}
.flags{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.flags li{display:flex;gap:10px;align-items:flex-start}
.flags li svg{color:var(--bad);margin-top:3px}
.proto-hero{padding:20px;display:flex;gap:16px;align-items:flex-start;border-left:6px solid}
.proto-hero.red{border-left-color:var(--bad-dot)} .proto-hero.yellow{border-left-color:var(--warn-dot)} .proto-hero.green{border-left-color:var(--ok-dot)}
.proto-hero > div{min-width:0}
.prose{max-width:65ch}

/* Empty */
.empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:36px 16px;color:var(--muted)}
.empty .ei{width:52px;height:52px;border-radius:50%;background:var(--surface);display:grid;place-items:center;color:var(--muted);border:1px solid var(--border)}
.empty .ei svg{width:24px;height:24px}
.empty h3{color:var(--fg)}
.empty p{margin:0;max-width:34ch;font-size:14px}

/* Forms / modal */
.modal-bg{position:fixed;inset:0;background:var(--overlay);z-index:80;display:flex;align-items:flex-end;justify-content:center}
@media (min-width:640px){.modal-bg{align-items:center;padding:24px}}
.modal{background:var(--card);color:var(--fg);width:100%;max-width:40rem;max-height:calc(100% - env(safe-area-inset-top,0px) - 12px);display:flex;flex-direction:column;border-radius:14px 14px 0 0;box-shadow:var(--shadow)}
@media (min-width:640px){.modal{border-radius:14px;max-height:calc(100vh - 48px)}}
.modal-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border-bottom:1px solid var(--border)}
.modal-b{padding:16px 18px;overflow-y:auto;display:flex;flex-direction:column;gap:14px}
.modal-f{display:flex;justify-content:flex-end;gap:8px;padding:12px 18px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--border);flex-wrap:wrap}
.modal-h .icon-btn:hover{background:var(--surface)}
.fields{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,13rem),1fr))}
.field{display:flex;flex-direction:column;gap:5px;min-width:0}
.field.full{grid-column:1/-1}
.field label,.flabel{font-size:12.5px;font-weight:600;color:var(--muted);letter-spacing:.02em}
.field input,.field select,.field textarea{width:100%;padding:9px 11px;border:1px solid var(--border);border-radius:8px;background:var(--bg);min-width:0}
.field textarea{min-height:76px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--ring)}
.req{color:var(--primary)}
.sevpick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.sevpick label{border:2px solid var(--border);border-radius:9px;padding:10px;cursor:pointer;display:flex;flex-direction:column;gap:2px;font-size:12.5px;color:var(--muted)}
.sevpick label b{font-size:14.5px;color:var(--fg);display:flex;align-items:center;gap:6px}
.sevpick input{position:absolute;opacity:0;pointer-events:none}
.sevpick label:has(input:focus-visible){outline:2px solid var(--primary);outline-offset:2px}
.sevpick label.green:has(input:checked){border-color:var(--ok-dot);background:var(--ok-soft)}
.sevpick label.yellow:has(input:checked){border-color:var(--warn-dot);background:var(--warn-soft)}
.sevpick label.red:has(input:checked){border-color:var(--bad-dot);background:var(--bad-soft)}
.check{display:flex;align-items:center;gap:10px;font-weight:600;cursor:pointer}
.form-err{color:var(--bad);font-size:13.5px;font-weight:600}
.drop{display:flex;flex-direction:column;align-items:center;gap:8px;padding:22px;border:2px dashed var(--border);border-radius:var(--radius);text-align:center;cursor:pointer}
.drop:hover{border-color:var(--primary)}
.drop svg{width:28px;height:28px;color:var(--primary)}

/* Conn + toast */
.conn{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;padding:5px 11px;border-radius:999px}
.conn.on{background:var(--ok-soft);color:var(--ok)}
.conn.off{background:var(--bad-soft);color:var(--bad)}
.toasts{position:fixed;z-index:90;left:50%;transform:translateX(-50%);bottom:calc(16px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:8px;width:min(26rem,calc(100% - 32px))}
.toast{background:hsl(218 46% 14%);color:#fff;padding:11px 14px;border-radius:9px;font-size:14px;box-shadow:var(--shadow);display:flex;gap:9px;align-items:center}
.toast.err{background:hsl(348 70% 32%)}

/* Gate / loading */
.gate{min-height:100vh;display:grid;place-items:center;padding-block:32px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));background:var(--sb-bg)}
.gate-card{background:#fff;color:hsl(218 46% 12%);border-radius:16px;max-width:26rem;width:100%;padding:26px;display:flex;flex-direction:column;gap:14px;align-items:center;text-align:center}
.gate-card img.fa{width:11rem}
.gate-card img.rh{width:13rem;opacity:.9}
.gate-card h1{color:hsl(218 46% 14%)}
.gate-card p{margin:0;color:hsl(218 18% 38%)}
.skel{height:92px;border-radius:var(--radius);background:linear-gradient(90deg,var(--surface),var(--border),var(--surface));background-size:200% 100%}
@media (prefers-reduced-motion:no-preference){.skel{animation:sh 1.4s infinite linear}}
@keyframes sh{to{background-position:-200% 0}}
.hide-sm{display:none}
@media (min-width:640px){.hide-sm{display:inline}}

/* Import & export */
.io-step{display:flex;flex-direction:column;gap:8px;align-items:flex-start;position:relative}
.io-step p{margin:0;font-size:14px}
.io-n{font-family:var(--f-display);font-weight:700;font-size:15px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:hsl(218 46% 19%);color:#fff}
.io-ic{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;flex:none}
.io-ic svg{width:22px;height:22px}
.is-disabled{opacity:.5;pointer-events:none}
.drop.over{border-color:var(--primary);background:var(--primary-soft)}
.prog{height:10px;border-radius:999px;background:var(--surface);border:1px solid var(--border);overflow:hidden}
.prog span{display:block;height:100%;background:var(--primary);transition:width .2s}
.issues{margin:6px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px;font-size:13.5px;max-height:18rem;overflow:auto}
.issues li{padding:6px 10px;border-radius:6px;background:var(--surface);overflow-wrap:anywhere}
.issues li.err{background:var(--bad-soft)}
.issues .mono{font-size:12px;color:var(--muted);margin-right:6px}

/* ---- Self-hosted additions: sign-in, account, team access ---- */
.auth-form{display:flex;flex-direction:column;gap:12px;width:100%;text-align:left}
.auth-form label{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:600;color:hsl(218 18% 38%)}
.auth-form input{width:100%;padding:11px 12px;border:1px solid hsl(218 24% 84%);border-radius:8px;background:#fff;color:hsl(218 46% 12%);font-size:16px}
.auth-form input:focus{outline:none;border-color:hsl(348 85% 42%);box-shadow:0 0 0 3px hsl(348 85% 42% / .25)}
.auth-form .btn-primary{width:100%}
.auth-form .hint,.gate-card .hint{font-size:13px;color:hsl(218 18% 42%);margin:0}
.gate-card .banner{color:hsl(218 46% 12%);width:100%}
.gate-card .link{color:hsl(348 85% 42%)}
.viewer.clickable{border-radius:8px;padding:6px;margin:-6px;cursor:pointer}
.viewer.clickable:hover{background:var(--sb-hover)}
.mode{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;padding:10px 12px;border:1px solid var(--border);border-radius:8px;background:var(--card);cursor:pointer}
.mode span{font-size:13px;color:var(--muted)}
.mode.on{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-soft)}
.mode.on b::before{content:"\25CF  ";color:var(--primary)}
.temp-pw{font-size:28px;letter-spacing:.12em;text-align:center;padding:14px;border:2px dashed var(--primary);border-radius:10px;user-select:all;background:var(--primary-soft)}
.btn[disabled][title]{cursor:not-allowed}
.field input,.field select,.field textarea{font-size:16px}
@media (min-width:640px){.field input,.field select,.field textarea{font-size:inherit}}
/* v1.1: purple contact card, contact editor */
.call-purple{background:hsl(270 55% 42%);color:#fff}
.call-purple .ph{background:hsl(0 0% 100% / .16)}
.call-purple .cp{border-left:1px solid hsl(0 0% 100% / .22)}
.contact-row{border-top:1px solid var(--border);padding-top:12px}
/* v1.1: sectioned patient form */
.fsec{border:1px solid var(--border);border-radius:9px;background:var(--card)}
.fsec > summary{cursor:pointer;padding:11px 14px;font-weight:700;display:flex;align-items:center;gap:8px;list-style:none}
.fsec > summary::-webkit-details-marker{display:none}
.fsec > summary::after{content:"+";margin-left:auto;color:var(--muted);font-weight:600;font-size:18px;line-height:1}
.fsec[open] > summary::after{content:"\2212"}
.fsec > .fields{padding:0 14px 14px}
.fsec.amb{border-color:hsl(348 85% 42% / .45);background:var(--bad-soft)}
.fields > .check.full,.fields > .field.full{grid-column:1/-1}
.amb-pick{display:flex;flex-wrap:wrap;gap:6px}
.amb-pick label{display:flex;align-items:center;gap:6px;border:1px solid var(--border);border-radius:8px;padding:8px 11px;background:var(--card);cursor:pointer;font-weight:600;font-size:14px}
.amb-pick label:has(input:checked){border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-soft)}
.form-sec{margin-top:4px}
.form-sec h3{margin-bottom:4px}
/* v1.1: Need Help / RESUS alarms */
.btn-help{background:hsl(28 95% 48%);border-color:transparent;color:#fff;font-weight:700}
.btn-help:hover{background:hsl(28 95% 42%);border-color:transparent}
.btn-resus{background:hsl(348 85% 34%);border-color:transparent;color:#fff;font-weight:700}
.topbar .btn-help{padding:7px 10px;font-size:14px;font-family:var(--f-display);text-transform:uppercase;letter-spacing:.06em}
.sb-help{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.sb-help .btn{padding:9px 6px;font-size:13px}
.alarm-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.alarm-big{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:var(--radius);border:0;cursor:pointer;color:#fff;text-align:left;min-width:0}
.alarm-big svg{width:28px;height:28px;flex:none}
.alarm-big b{display:block;font-family:var(--f-display);text-transform:uppercase;letter-spacing:.05em;font-size:20px;line-height:1.1}
.alarm-big small{display:block;font-size:12.5px;opacity:.9}
.alarm-big.help{background:hsl(28 95% 46%)}
.alarm-big.resus{background:hsl(348 85% 34%)}
@media (max-width:420px){.alarm-big{padding:12px}.alarm-big b{font-size:17px}}
.kindpick{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.kindpick label{border:2px solid var(--border);border-radius:9px;padding:10px;cursor:pointer;display:flex;flex-direction:column;gap:3px;font-size:12.5px;color:var(--muted)}
.kindpick label b{display:flex;align-items:center;gap:6px;font-size:15px;color:var(--fg)}
.kindpick input{position:absolute;opacity:0;pointer-events:none}
.kindpick label.help:has(input:checked){border-color:hsl(28 95% 46%);background:hsl(28 95% 46% / .1)}
.kindpick label.resus:has(input:checked){border-color:hsl(348 85% 40%);background:var(--bad-soft)}
.locpick{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.locpick label{cursor:pointer}
.locpick input{position:absolute;opacity:0;pointer-events:none}
.locpick span{display:inline-block;padding:8px 12px;border:1px solid var(--border);border-radius:999px;font-weight:600;font-size:14px;background:var(--card)}
.locpick input:checked + span{background:var(--accent);color:#fff;border-color:transparent}
.locpick input:focus-visible + span{outline:2px solid var(--primary);outline-offset:2px}
#al-other{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg);font-size:16px}
.alarm{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:calc(16px + env(safe-area-inset-top,0px)) 14px calc(16px + env(safe-area-inset-bottom,0px));background:hsl(28 95% 40% / .96)}
.alarm.alarm-resus{background:hsl(348 85% 30% / .97)}
@media (prefers-reduced-motion:no-preference){.alarm.alarm-resus{animation:alarmflash 1s steps(2,end) infinite}}
@keyframes alarmflash{0%{background:hsl(348 85% 30% / .97)}50%{background:hsl(0 0% 6% / .97)}}
.alarm-card{width:100%;max-width:30rem;color:#fff;display:flex;flex-direction:column;gap:10px;text-align:center}
.alarm-title{display:flex;align-items:center;justify-content:center;gap:10px;font-family:var(--f-display);font-weight:700;font-size:clamp(34px,9vw,52px);letter-spacing:.04em;line-height:1}
.alarm-title svg{width:.9em;height:.9em}
.alarm-sub{font-size:16px;font-weight:600}
.alarm-loc{display:flex;align-items:center;justify-content:center;gap:8px;font-size:24px;font-weight:700;background:hsl(0 0% 100% / .14);border-radius:10px;padding:10px}
.alarm-meta{font-size:14px;opacity:.9}
.alarm-note{background:#fff;color:hsl(218 46% 12%);border-radius:8px;padding:10px;font-weight:600}
.alarm-resp{font-size:14px;background:hsl(0 0% 0% / .2);border-radius:8px;padding:10px;text-align:left}
.alarm-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.alarm-actions .btn{flex:1;min-width:8rem;padding:13px 14px;font-size:16px}
.alarm .alarm-go{background:#fff;color:hsl(142 70% 26%);border:0}
.alarm .alarm-clear{background:hsl(142 70% 30%);color:#fff;border:0}
.alarm .alarm-no{background:transparent;color:#fff;border:1px solid hsl(0 0% 100% / .6)}
.alarm .alarm-map{background:hsl(0 0% 100% / .15);color:#fff;border:1px solid hsl(0 0% 100% / .4);justify-content:center}
.alarm-call{color:#fff;font-size:13px;opacity:.95;display:flex;gap:8px;align-items:flex-start;text-align:left;text-decoration:none;border-top:1px solid hsl(0 0% 100% / .25);padding-top:10px}
.banner.alarm-banner{color:#fff;border:0;background:hsl(28 95% 44%)}
.banner.alarm-banner.alarm-resus{background:hsl(348 85% 36%)}
.banner.alarm-banner .btn{background:#fff;color:hsl(218 46% 12%);border:0}