/* =====================================================================
   CREW CALL — the stylesheet
   =====================================================================
   THIS IS THE PROTOTYPE'S OWN CSS, LIFTED WHOLE.

   The first live version of this file was a fresh set of styles that
   borrowed the prototype's colour variables and invented everything
   else. It read as a different application, because it was one. Chris
   put it plainly: "it definitely does not look like the original."

   So the rule from here: the prototype is the design. When a screen
   moves across, its markup moves with the class names it already has,
   and this file is the thing both of them share. Anything the live site
   needs that the prototype has no class for gets ADDED at the bottom,
   under its own heading, so the ported half stays diffable against
   board.html.
   ===================================================================== */

:root{
  --ground:#eef0f3; --panel:#ffffff; --panel-2:#f7f8fa;
  --line:#d6dae1; --line-soft:#e6e9ee;
  --ink:#161b22; --ink-2:#4d5866; --ink-3:#7d8794;
  --accent:#0f8d89; --accent-ink:#ffffff; --accent-soft:#daf0ef;
  --grey:#98a2af;
  --amber:#b06b12; --amber-bg:#fbeed7;
  --green:#1f7a49; --green-bg:#dcf0e3;
  --red:#a8352d;   --red-bg:#f9dedb;
  --shadow:0 1px 2px rgba(16,22,30,.08), 0 8px 24px rgba(16,22,30,.06);
  --radius:5px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#0d1116; --panel:#151a21; --panel-2:#1b212a;
    --line:#2b3440; --line-soft:#222a34;
    --ink:#e6ebf2; --ink-2:#a3aebd; --ink-3:#78838f;
    --accent:#31b9b3; --accent-ink:#07211f; --accent-soft:#123634;
    --grey:#6d7885;
    --amber:#e0a24a; --amber-bg:#33270f;
    --green:#4bbd7c; --green-bg:#12301f;
    --red:#e0736a;   --red-bg:#341715;
    --shadow:0 1px 2px rgba(0,0,0,.5), 0 8px 24px rgba(0,0,0,.35);
  }
}
:root[data-theme="dark"]{
  --ground:#0d1116; --panel:#151a21; --panel-2:#1b212a;
  --line:#2b3440; --line-soft:#222a34;
  --ink:#e6ebf2; --ink-2:#a3aebd; --ink-3:#78838f;
  --accent:#31b9b3; --accent-ink:#07211f; --accent-soft:#123634;
  --grey:#6d7885;
  --amber:#e0a24a; --amber-bg:#33270f;
  --green:#4bbd7c; --green-bg:#12301f;
  --red:#e0736a;   --red-bg:#341715;
  --shadow:0 1px 2px rgba(0,0,0,.5), 0 8px 24px rgba(0,0,0,.35);
}

*{box-sizing:border-box}
/* HIDDEN MEANS HIDDEN, EVERYWHERE. The UA rule for [hidden] is only
   `display:none` at the lowest specificity, so ANY rule of ours that
   sets display on the same element beats it — and #sheetwrap is
   position:fixed;inset:0;display:flex, which means a "hidden" overlay
   still covers the whole page and swallows every click on it. The
   screen looks drawn and is completely dead. This was patched twice by
   hand (#landing, .lerr) before it happened a third time; once, here,
   covers everything added later. */
[hidden]{display:none!important}
body{
  margin:0; background:var(--ground); color:var(--ink);
  font:400 13px/1.45 "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  -webkit-font-smoothing:antialiased;
}
button,input{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
.mono{font-family:"IBM Plex Mono", ui-monospace, monospace;font-variant-numeric:tabular-nums}

/* ---------- shell ---------- */
.app{
  display:grid; grid-template-columns:238px minmax(0,1fr) 328px;
  gap:10px; padding:10px; align-items:start;
}
.pane{
  background:var(--panel); border:1px solid var(--line);
  border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden;
}
.pane.sticky{position:sticky; top:10px; max-height:calc(100vh - 20px); display:flex; flex-direction:column}
.pane.sticky > .scroll{overflow-y:auto; overscroll-behavior:contain}
.pane-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:8px;
  padding:9px 12px; border-bottom:1px solid var(--line-soft); background:var(--panel-2);
  flex:0 0 auto;
}
.pane-head h2{
  margin:0; font-family:"Barlow Condensed", sans-serif;
  font-weight:600;font-size:14px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2);
}
.pane-head .count{font-size:11px;color:var(--ink-3);font-family:"IBM Plex Mono",monospace}

/* ---------- event rail ---------- */
.railcol{display:flex;flex-direction:column;gap:10px}
.wknav{display:flex;align-items:center;gap:4px;padding:7px 8px;
  border-bottom:1px solid var(--line-soft);background:var(--panel-2)}
.wknav select{flex:1;min-width:0;background:var(--panel);border:1px solid var(--line);
  border-radius:3px;padding:3px 5px;font-size:11.5px;font-family:"IBM Plex Mono",monospace}
.wkarrow{background:var(--panel);border:1px solid var(--line);border-radius:3px;
  width:22px;height:24px;line-height:1;color:var(--ink-2);font-size:13px;padding:0}
.wkarrow:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}
.wkarrow:disabled{opacity:.35;cursor:default}
.ev.evoff{opacity:.5}
.ev-stat.evoffstat{color:var(--amber)}
.wkgate{font:400 11px/1.5 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-3);padding:7px 12px;border-bottom:1px solid var(--line-soft)}
.wkwarn{padding:5px 12px;font-size:10.5px;font-family:"IBM Plex Mono",monospace;
  color:var(--amber);background:var(--amber-bg);border-bottom:1px solid var(--line-soft)}
.wkwarn.bad{color:var(--red);background:var(--red-bg)}
.ev-stat.unbuilt{color:var(--amber)}

/* ---------- guide ---------- */
#guide .pane-head{cursor:default}
.gbody{padding:2px 0 8px}
.gsec{padding:7px 12px 2px;border-top:1px solid var(--line-soft)}
.gsec:first-child{border-top:0}
.gscreen{border-top:1px solid var(--line)}
.gscreen:first-child{border-top:0}
.gtitle{display:flex;align-items:center;gap:6px;width:100%;text-align:left;
  background:none;border:0;padding:9px 2px;cursor:pointer;
  font:600 12.5px/1.2 "Barlow Condensed",sans-serif;letter-spacing:.04em;
  text-transform:uppercase;color:var(--ink)}
.gtitle:hover{color:var(--accent)}
.gcar{font-size:9px;color:var(--ink-3);width:10px}
.gscreen.open .gcar{color:var(--accent)}
.ghere{margin-left:auto;font:400 9px/1 "IBM Plex Mono",monospace;letter-spacing:.05em;
  text-transform:uppercase;color:var(--accent);background:var(--accent-soft);
  padding:3px 5px;border-radius:3px}
.gscreen.open{padding-bottom:6px}
.gsec h6{margin:0 0 5px;font-family:"Barlow Condensed",sans-serif;font-size:12px;
  font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3)}
.grow{display:grid;grid-template-columns:auto minmax(0,1fr);gap:7px;
  align-items:start;padding:3px 0;font-size:11px;line-height:1.4;color:var(--ink-2)}
.gsw{display:inline-flex;align-items:center;min-height:14px;padding-top:1px}
.gdot{color:var(--ink-3);padding-top:1px}
.gtx b{color:var(--ink);font-weight:500}
.grow.gwide{grid-template-columns:minmax(0,1fr)}
.grow.gwide .gsw{margin-bottom:4px}
.grow .dot{justify-self:start}
.wk{padding:9px 12px 3px;font-family:"IBM Plex Mono",monospace;
    font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.ev{display:block;width:100%;text-align:left;background:none;border:0;
    border-left:3px solid transparent;padding:8px 12px 9px;border-bottom:1px solid var(--line-soft)}
.ev:hover{background:var(--panel-2)}
.ev[aria-current="true"]{border-left-color:var(--accent);background:var(--accent-soft)}
.ev-name{font-weight:600;font-size:13px;display:flex;justify-content:space-between;gap:6px;align-items:baseline}
.ev-co{font-size:9.5px;letter-spacing:.08em;color:var(--ink-3);font-family:"IBM Plex Mono",monospace}
.ev-dates{display:block;font-size:11px;color:var(--ink-3);margin-top:1px;
  font-family:"IBM Plex Mono",monospace}
.bar{height:3px;background:var(--line);border-radius:2px;margin-top:6px;display:flex;overflow:hidden}
.bar i{display:block;height:100%}
.bar .g{background:var(--green)} .bar .a{background:var(--amber)}
.ev-stat{display:block;font-size:10.5px;color:var(--ink-3);margin-top:4px;
  font-family:"IBM Plex Mono",monospace}

/* ---------- event header ---------- */
.ehead{padding:12px 14px 0}
.ehead h1{margin:0;font-family:"Barlow Condensed",sans-serif;font-size:27px;font-weight:600;
          line-height:1.05;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.tag{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.1em;padding:2px 6px;
     border:1px solid var(--line);border-radius:3px;color:var(--ink-2);text-transform:uppercase}
.emeta{margin-top:5px;font-size:12px;color:var(--ink-2);display:flex;gap:14px;flex-wrap:wrap}
.emeta b{font-weight:500;color:var(--ink)}
.days{display:flex;gap:5px;margin:11px 0 0;flex-wrap:wrap;align-items:stretch}
.day{border:1px solid var(--line);border-radius:3px;padding:4px 8px;min-width:64px;background:var(--panel-2)}
.day .d{font-size:10px;letter-spacing:.06em;color:var(--ink-3);font-family:"IBM Plex Mono",monospace}
.day .n{font-size:15px;font-family:"IBM Plex Mono",monospace;margin-top:1px}
.day .n s{text-decoration:none;color:var(--ink-3);font-size:12px}
.day.setup .d{color:var(--amber)}
.form.ask .askq{font:400 12px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink);padding-bottom:6px}
.form.ask .askn{font:400 11px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3);margin:6px 0 0}
.plist-in{max-height:340px;overflow:auto;margin:4px 0 8px}
/* ---------------- hotels ---------------- */
.hsplit{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:12px}
.hcard{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:12px 14px 14px;min-width:0}
.hcard.wide{grid-column:1/-1}
.hcard h3{margin:0 0 8px;font:600 13px/1 "Barlow Condensed",sans-serif;
  letter-spacing:.03em;text-transform:uppercase;color:var(--ink);
  display:flex;align-items:baseline;gap:8px}
.hcard .hsub{font:400 11px/1 "IBM Plex Mono",monospace;color:var(--ink-3);
  text-transform:none;letter-spacing:0;margin-left:auto}
.htab{width:100%;border-collapse:collapse}
.htab th{font:500 9.5px/1 "IBM Plex Sans",system-ui,sans-serif;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3);text-align:left;padding:4px 6px 5px}
.htab td{font:400 12px/1.4 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink);
  padding:4px 6px;border-top:1px solid var(--line-soft);vertical-align:middle}
.htab td.dim{color:var(--ink-3);font-size:11.5px}
.htab td.prob{color:var(--amber);font-weight:500;white-space:nowrap}
.hnote{font:400 11.5px/1.6 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3);margin:8px 0 0}
.hnote.good{color:var(--green)}
.hnote.bad{color:var(--red)}
.hlist{list-style:none;margin:0;padding:0;max-height:340px;overflow:auto}
.hlist li{margin:0}
.hrow{display:flex;align-items:baseline;gap:8px;width:100%;text-align:left;
  background:none;border:0;border-top:1px solid var(--line-soft);padding:6px;cursor:pointer;
  font:inherit;color:inherit}
.hrow:hover{background:var(--accent-soft)}
.hn{font:500 12.5px/1.3 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink)}
.hg{font:400 10.5px/1 "IBM Plex Mono",monospace;color:var(--ink-2);
  border:1px solid var(--line);border-radius:3px;padding:2px 4px}
.hg.none{color:var(--red);border-color:var(--red)}
.hfit{font:500 10px/1 "IBM Plex Mono",monospace;padding:2px 4px;border-radius:3px;
  text-transform:uppercase;letter-spacing:.04em}
.hfit.exact{background:var(--green-bg);color:var(--green)}
.hfit.close{background:var(--amber-bg);color:var(--amber)}
.hfit.loose{background:var(--red-bg);color:var(--red)}
.hd{font:400 11px/1 "IBM Plex Mono",monospace;color:var(--ink-3);margin-left:auto;
  white-space:nowrap}
.hlist{max-height:420px}
.alerts{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  margin:12px 12px 0}
.ahead{display:flex;align-items:center;gap:7px;padding:9px 12px}
.ahead h3{margin:0;font:600 12.5px/1 "Barlow Condensed",sans-serif;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink)}
.acount{margin-left:auto;display:flex;gap:4px}
.apill{font:600 10px/1 "IBM Plex Mono",monospace;padding:3px 6px;border-radius:9px}
.apill.red{background:var(--red-bg);color:var(--red)}
.apill.amber{background:var(--amber-bg);color:var(--amber)}
.apill.info{background:var(--panel-2);color:var(--ink-3);font-weight:400;
  letter-spacing:.03em}
.abody{border-top:1px solid var(--line);max-height:186px;overflow-y:auto}
/* About three alerts deep, then it scrolls. They are sorted worst first, so
   what is visible without scrolling is always what matters most. */
.amore{font:400 10px/1 "IBM Plex Mono",monospace;color:var(--ink-3);
  padding:0 12px 8px;letter-spacing:.03em}
.alert{display:flex;align-items:flex-start;gap:9px;padding:8px 12px;
  border-top:1px solid var(--line-soft)}
.alert:first-child{border-top:0}
.alert .akind{font:600 9px/1.6 "IBM Plex Mono",monospace;letter-spacing:.05em;
  text-transform:uppercase;padding:2px 5px;border-radius:3px;white-space:nowrap;
  flex:none;min-width:104px;text-align:center}
.alert.red   .akind{background:var(--red-bg);color:var(--red)}
.alert.amber .akind{background:var(--amber-bg);color:var(--amber)}
.alert.info  .akind{background:var(--panel-2);color:var(--ink-3)}
.atext{min-width:0}
.atext b{font:500 12.5px/1.4 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink);
  display:block}
.adet{font:400 11px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3);
  display:block;margin-top:1px}
.alert .act{margin-left:auto;flex:none}
/* ---- Event Info ---- */
.gfields.one{grid-template-columns:1fr}
.gfields.two{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.gfields.three{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.gfields.dates{padding:9px;border:1px solid var(--line);border-radius:var(--radius);
  background:var(--panel-2);margin-top:8px}
.evrow{display:flex;gap:6px;align-items:center;min-width:0}
.evrow .dsel{flex:1;min-width:0}
.evrow.wide{width:100%;margin-top:8px}
.act.nowrap{white-space:nowrap;flex:0 0 auto}
.evsub{display:block;margin-top:3px;font:400 11px/1.45 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-3)}
.evsub.warn{color:var(--amber)}
.airlist{list-style:none;margin:6px 0 0;padding:0;width:100%}
.airlist li{display:flex;align-items:flex-start;gap:10px;padding:6px 0;
  border-bottom:1px solid var(--line)}
.aircode{font:500 11px/1.4 "IBM Plex Mono",monospace;color:var(--accent);
  border:1px solid var(--accent);border-radius:3px;padding:2px 5px;flex:0 0 auto}
.airname{flex:1;font:400 12px/1.4 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink)}
.evair{display:block}
.evair .rvlab{display:block;margin-bottom:2px}
.viewonly{border-color:var(--amber)}
.rov{font:400 12px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink);
  padding:3px 0;min-height:22px}
.evrow{display:flex;gap:6px;align-items:center}
.evrow .dsel{flex:1}
.evair{display:flex;flex-wrap:wrap;gap:5px;align-items:center;margin:10px 0 0;
  padding:9px;border:1px solid var(--line);border-radius:var(--radius);
  background:var(--panel-2)}
.tempask{color:#8a6d3b}
/* ---- Generators ---- */
.gscope{display:block;font:400 8.5px/1 "IBM Plex Mono",monospace;letter-spacing:.05em;
  text-transform:uppercase;opacity:.7;margin-top:2px}
.genedit{margin:10px 0 0;display:flex;flex-direction:column;gap:8px}
.gbody{font-family:"IBM Plex Mono",monospace;font-size:11.5px;line-height:1.6;
  min-height:280px;resize:vertical;width:100%}
.gplugs{display:flex;flex-wrap:wrap;gap:4px;align-items:center;padding:8px;
  border:1px solid var(--line);border-radius:var(--radius);background:var(--panel-2)}
.gplugs .act{margin:0}
.genout{margin:10px 0 0;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden}
.gsub{padding:8px 10px;background:var(--panel-2);border-bottom:1px solid var(--line);
  font:500 12px/1.4 "IBM Plex Sans",system-ui,sans-serif}
.gsub span{display:block;font:500 9px/1 "IBM Plex Mono",monospace;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:4px}
.gbodyout{margin:0;padding:12px;white-space:pre-wrap;word-break:break-word;
  font:400 12px/1.7 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink)}
.gmiss{background:#fdf1dc;color:#8a6d3b;border-radius:2px;padding:0 3px;font-weight:500}
.hnote.miss{color:#8a6d3b}
.hnote.starter{color:var(--ink-3);font-style:italic}
.gfields{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px;
  margin:6px 0 0}
.gf{display:flex;flex-direction:column;gap:3px}
.gf>span{font:500 9px/1 "IBM Plex Mono",monospace;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3)}
.grs{display:flex;gap:4px}
.gcontacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;
  margin:6px 0 0}
.gc{display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.gskip{color:var(--amber)}
/* ---- Reviews ---- */
.rvlab{font:500 9.5px/1 "IBM Plex Mono",monospace;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3)}
.rvcap{display:block;font:400 9px/1.3 "IBM Plex Mono",monospace;opacity:.75;margin-top:2px}
.rvtab td{vertical-align:middle}
.rvscore{white-space:nowrap}
.rvn{width:24px;height:24px;margin-right:3px;border:1px solid var(--line);border-radius:3px;
  background:var(--panel);color:var(--ink-3);font:500 12px/1 "IBM Plex Mono",monospace;
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.rvn:hover{border-color:var(--accent);color:var(--accent)}
/* the list re-sorts on every save, so a click's focus ring would land on
   whichever row slid into that spot and read as a score somebody gave */
.rvn:focus{outline:none}
.rvn:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.rvn.on{color:#fff;border-color:transparent}
.rvn.on.s5,.rvn.on.s4{background:var(--green)}
.rvn.on.s3{background:var(--amber)}
.rvn.on.s2,.rvn.on.s1{background:var(--red)}
.rvsc .rvn{cursor:default;margin-right:4px}
.rvflags{white-space:nowrap}
.rvflags .act{margin-right:4px}
.act.tiny.danger.on{border-color:var(--red);color:var(--red)}
.rvout{color:var(--amber)}
.rvflagged{font:500 9px/1 "IBM Plex Mono",monospace;letter-spacing:.05em;color:var(--red);
  border:1px solid var(--red);border-radius:3px;padding:2px 4px;margin-left:6px}
tr.rvdone{background:var(--panel-2)}
.ovtab td{vertical-align:middle}
.ovx{font:400 9px/1 "IBM Plex Mono",monospace;color:var(--ink-3);margin:0 6px 0 1px}
#ovq{min-width:220px}

.cand .cwhy{font-weight:600;color:var(--ink-2)}
.cmeta.blocked .cwhy{color:var(--ink-3)}

.sheet .tot{display:flex;gap:0;margin:14px 0 4px;border:1px solid #ccc;
  border-radius:3px;overflow:hidden;page-break-inside:avoid}
.sheet .tot span{flex:1;padding:9px 12px;border-right:1px solid #ddd;
  font:400 10px/1.3 "IBM Plex Sans",system-ui,sans-serif;letter-spacing:.06em;
  text-transform:uppercase;color:#555}
.sheet .tot span:last-child{border-right:0}
.sheet .tot span.sum{background:#f4f4f4}
.sheet .tot b{display:block;font:600 20px/1.1 "Barlow Condensed",system-ui,sans-serif;
  letter-spacing:0;text-transform:none;color:#111;margin-bottom:2px}
.sheet .totn{font:400 10.5px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:#555;
  margin:6px 0 0}

.tinp{width:76px;min-width:0;padding:3px 5px;font:400 11px/1.3 "IBM Plex Mono",monospace}
.tinp.num{width:52px}
.rconf code{font:400 11px/1.4 "IBM Plex Mono",monospace;color:var(--ink-2)}
.pmail{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 0 0;
  padding:6px 8px;border:1px solid var(--line);border-radius:3px;background:var(--panel-2)}
.pmail code{flex:1;min-width:0;font:400 11px/1.4 "IBM Plex Mono",monospace;
  color:var(--ink);word-break:break-all}
.pmail.none{display:block;font:400 11px/1.5 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--amber);border-color:var(--amber);background:var(--amber-bg)}

/* ---- landing ---- */
#landing{position:fixed;inset:0;z-index:60;background:var(--ground);
  display:flex;align-items:center;justify-content:center;padding:24px;overflow:auto}
#landing[hidden]{display:none!important}
.lwrap{width:100%;max-width:420px}
.lbrand{text-align:center;margin:0 0 22px}
.lmark{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;
  border-radius:12px;background:var(--accent);color:var(--accent-ink);
  font:600 17px/1 "Barlow Condensed",system-ui,sans-serif;letter-spacing:.06em;
  margin-bottom:12px}
.lbrand h1{margin:0;font:600 26px/1.15 "Barlow Condensed",system-ui,sans-serif;
  letter-spacing:.01em;color:var(--ink)}
.lbrand p{margin:4px 0 0;font:400 11.5px/1.5 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-3)}
.lcard{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:20px}
.lcard h2{margin:0 0 14px;font:600 15px/1.2 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink)}
.lf{display:block;margin:0 0 11px}
.lf span{display:block;font:500 10px/1 "IBM Plex Mono",monospace;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:5px}
.lf input{width:100%;box-sizing:border-box;font:400 13px/1.3 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink);background:var(--panel-2);border:1px solid var(--line);
  border-radius:3px;padding:8px 10px}
.lf input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.lbtn{width:100%;justify-content:center;margin:4px 0 8px;padding:9px}
.linklike{display:block;width:100%;border:0;background:none;cursor:pointer;
  font:400 11.5px/1.4 "IBM Plex Sans",system-ui,sans-serif;color:var(--accent);
  text-align:center;padding:2px}
.linklike:hover{text-decoration:underline}
.lerr{font:400 11.5px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:var(--red);
  background:var(--red-bg);border:1px solid var(--red);border-radius:3px;
  padding:7px 9px;margin:0 0 10px}
.lerr[hidden]{display:none!important}
.lnote{margin:14px 0 0;padding-top:12px;border-top:1px solid var(--line-soft);
  font:400 11px/1.6 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3)}
.lprev{margin:14px 0 0;padding:10px 12px;border:1px dashed var(--line);border-radius:3px;
  font:400 11px/1.6 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3)}
.lprev span{display:block;margin-top:5px;font-family:"IBM Plex Mono",monospace;
  font-size:10.5px;color:var(--ink-2)}

/* ---- home & admin ---- */
.tab.locked{color:var(--ink-3);cursor:not-allowed;opacity:.7}
.tab.locked:hover{color:var(--ink-3)}
.tab .lock{width:11px;height:11px;margin-right:5px;vertical-align:-1px}
.attnband{display:flex;gap:0;margin:12px 0 10px;border:1px solid var(--line);
  border-radius:3px;overflow:hidden}
.attnband .ab{flex:1;padding:8px 11px;border-right:1px solid var(--line-soft);
  font:500 9.5px/1.3 "IBM Plex Mono",monospace;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-3)}
.attnband .ab:last-child{border-right:0}
.attnband .ab b{display:block;font:600 19px/1.1 "Barlow Condensed",system-ui,sans-serif;
  letter-spacing:0;text-transform:none;color:var(--ink);margin-bottom:1px}
.attnband .ab.red b{color:var(--red)}
.attnband .ab.amber b{color:var(--amber)}
.sev{display:inline-block;font:500 9px/1 "IBM Plex Mono",monospace;letter-spacing:.05em;
  text-transform:uppercase;padding:3px 5px;border-radius:3px;margin-right:6px;
  border:1px solid var(--line);color:var(--ink-3);white-space:nowrap}
.sev.red{border-color:var(--red);color:var(--red);background:var(--red-bg)}
.sev.amber{border-color:var(--amber);color:var(--amber);background:var(--amber-bg)}
.linkev{border:0;background:none;padding:0;cursor:pointer;color:var(--accent);
  font:500 12px/1.3 "IBM Plex Sans",system-ui,sans-serif}
.linkev:hover{text-decoration:underline}
.qgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(228px,1fr));gap:8px;
  margin:4px 0 0}
.qlink{display:block;text-align:left;padding:10px 12px;border:1px solid var(--line);
  border-radius:var(--radius);background:var(--panel-2);cursor:pointer}
.qlink:hover{border-color:var(--accent);background:var(--accent-soft)}
.qlink b{display:block;font:600 12.5px/1.3 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink);margin-bottom:3px}
.qlink span{display:block;font:400 11px/1.5 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-3)}
.schemes{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}
.swatch{display:flex;align-items:center;gap:9px;padding:8px 10px;cursor:pointer;
  border:1px solid var(--line);border-radius:var(--radius);background:var(--panel-2);
  text-align:left}
.swatch.on{border-color:var(--accent);background:var(--accent-soft)}
.swatch i{width:22px;height:22px;border-radius:5px;flex:none}
.swatch b{display:block;font:600 12px/1.2 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink)}
.swatch span{display:block;font:400 10px/1.3 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-3);margin-top:1px}
.ghits{list-style:none;margin:8px 0 0;padding:0}
.ghits li{padding:9px 0;border-top:1px solid var(--line-soft)}
.gh-screen{display:inline-block;font:500 9px/1 "IBM Plex Mono",monospace;
  letter-spacing:.05em;text-transform:uppercase;color:var(--accent);
  border:1px solid var(--accent);border-radius:3px;padding:3px 5px;margin-right:6px}
.gh-sec{font:500 10.5px/1 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3)}
.ghits p{margin:5px 0 6px;font:400 11.5px/1.6 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-2)}
tr.rowopen td{background:var(--accent-soft)}
tr.formrow td{padding:0 0 10px}
tr.formrow .lkform{margin:0}
.sheetid{font:400 10.5px/1.4 "IBM Plex Mono",monospace;color:var(--ink-2)}
.badpill{display:inline-block;font:500 9px/1 "IBM Plex Mono",monospace;
  letter-spacing:.05em;text-transform:uppercase;padding:3px 5px;border-radius:3px;
  border:1px solid var(--red);color:var(--red);background:var(--red-bg)}
.okpill{display:inline-block;margin-left:7px;font:500 9px/1 "IBM Plex Mono",monospace;
  letter-spacing:.05em;text-transform:uppercase;padding:3px 5px;border-radius:3px;
  border:1px solid var(--green);color:var(--green);background:var(--green-bg)}
.nowrap{white-space:nowrap}

/* ---- the show summary above the hotel ---- */
.evsum .sumgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.evsum .sf{padding:10px 12px;border-right:1px solid var(--line-soft)}
.evsum .sf:last-child{border-right:0}
.evsum .sf span{display:block;font:500 9.5px/1 "IBM Plex Mono",monospace;
  letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);margin-bottom:5px}
.evsum .sf b{display:block;font:600 14px/1.25 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink)}
.evsum .sf i{display:block;margin-top:3px;font:400 11px/1.5 "IBM Plex Sans",system-ui,
  sans-serif;font-style:normal;color:var(--ink-3)}
.evsum .sf i.warn{color:var(--amber)}
.sheet td.conf{font-family:"IBM Plex Mono",monospace;font-size:10px}

/* ---- viewing as ---- */
.permoff{opacity:.45;pointer-events:none}
button[disabled], .act[disabled]{opacity:.45;cursor:not-allowed}
.vas{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:7px 14px;
  border-bottom:1px solid var(--line);background:var(--panel-2)}
.vas.on{background:var(--amber-bg);border-bottom-color:var(--amber)}
.vas label{display:flex;align-items:center;gap:7px}
.vas label span{font:500 9.5px/1 "IBM Plex Mono",monospace;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ink-3)}
.vas .dsel{font-size:11.5px}
.vasnote{flex:1;min-width:180px;font:400 11px/1.5 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-2)}
.vas.on .vasnote{color:var(--amber)}
.vasnote.dim{color:var(--ink-3)}

/* ---- Users & permissions ---- */
.hnote.warn{color:var(--amber)}
.tiny{font-size:10.5px}
.permbox{margin:12px 0 0;padding:10px 12px;border:1px solid var(--line);
  border-radius:var(--radius);background:var(--panel-2)}
.permbox h4{margin:0 0 8px;font:600 12px/1.3 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink);display:flex;align-items:baseline;gap:8px}
.htab.tight td{padding:4px 6px 4px 0;vertical-align:middle}
.pchip{display:inline-block;font:500 9.5px/1 "IBM Plex Mono",monospace;letter-spacing:.04em;
  text-transform:uppercase;padding:3px 5px;border-radius:3px;margin:2px 4px 2px 0;
  border:1px solid var(--line-soft);color:var(--ink-3);background:transparent;
  white-space:nowrap;opacity:.45}
.pchip.on{opacity:1;border-color:var(--accent);color:var(--accent);
  background:var(--accent-soft)}
.gchip{display:inline-flex;align-items:center;gap:5px;font:500 11px/1.2 "IBM Plex Sans",
  system-ui,sans-serif;color:var(--ink);background:var(--panel-2);
  border:1px solid var(--line);border-radius:3px;padding:3px 4px 3px 7px;
  margin:2px 5px 2px 0;white-space:nowrap}
.gchip em{font-style:normal;font-size:10px;color:var(--ink-3)}
.xchip{border:0;background:transparent;color:var(--ink-3);cursor:pointer;font-size:13px;
  line-height:1;padding:0 3px;border-radius:2px}
.xchip:hover{color:var(--red);background:var(--red-bg)}
.warnink{color:var(--amber)}
.linkbox{margin:6px 0 2px;padding:6px 8px;border:1px solid var(--amber);
  border-radius:3px;background:var(--amber-bg);max-width:420px}
.linkbox code{display:block;font:400 10.5px/1.4 "IBM Plex Mono",monospace;
  color:var(--ink);word-break:break-all;margin-bottom:5px}
.warnchip{display:inline-block;font:500 10px/1 "IBM Plex Mono",monospace;
  letter-spacing:.04em;text-transform:uppercase;padding:4px 6px;border-radius:3px;
  border:1px solid var(--amber);color:var(--amber);background:var(--amber-bg)}
.rolerow{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0 0}
.gridscroll{overflow-x:auto;margin:0 -2px}
.htab.grid{min-width:820px}
.htab.grid th.rot{font-size:10px;letter-spacing:.02em;vertical-align:bottom;
  white-space:normal;max-width:92px}
.htab.grid td.gcell{vertical-align:top;padding-right:8px}
.htab.grid td:first-child{white-space:nowrap;font-weight:500}

/* ---- Event Documentation ---- */
.dshelf{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 10px}
.dup{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:8px 0 0}
.dfile{cursor:pointer}
.dnote{font:400 11px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3)}
.dstage{list-style:none;margin:10px 0 0;padding:0;border-top:1px solid var(--line)}
.dstage li{display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:7px 0;border-bottom:1px solid var(--line)}
.dstage li.bad{background:var(--red-bg,#fdf3f3)}
.dstage .dn{font:500 12px/1.3 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink)}
.dstage .dsz{font:400 11px/1 "IBM Plex Mono",monospace;color:var(--ink-3)}
.dwhy{font:400 11.5px/1.4 "IBM Plex Sans",system-ui,sans-serif;color:var(--red);flex:1}
.dsel,.dinp{font:400 11.5px/1 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink);
  background:var(--panel);border:1px solid var(--line);border-radius:3px;padding:3px 6px}
.dinp{min-width:180px}
.dinp.wide{min-width:260px;font-weight:500}
.dtab td{vertical-align:top}
.dtag{display:inline-block;font:500 9.5px/1 "IBM Plex Mono",monospace;letter-spacing:.05em;
  text-transform:uppercase;padding:3px 5px;border-radius:3px;margin-right:8px;
  border:1px solid var(--line);color:var(--ink-2);background:var(--panel-2);white-space:nowrap}
.dtag.floor_plan{border-color:var(--accent);color:var(--accent)}
.dtag.bol{border-color:#8a6d3b;color:#8a6d3b}
.dtag.implementation{border-color:var(--green);color:var(--green)}
.dname{font-weight:500}
.dsub{display:block;margin-top:3px;font:400 11px/1.4 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-3)}
.dgone{display:block;margin-top:3px;font:500 9.5px/1 "IBM Plex Mono",monospace;
  letter-spacing:.05em;color:var(--ink-3)}
tr.darch{opacity:.62}
.dact{white-space:nowrap;text-align:right}
.dact .act{margin-left:4px}
.darc{list-style:none;margin:10px 0 0;padding:0}
.darc li{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 10px;
  border:1px solid var(--line);border-radius:var(--radius);margin-bottom:6px;
  font:400 12px/1.4 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink)}
.darc li.now{border-color:var(--accent);background:var(--panel-2)}
.darc li.wait{opacity:.6}
.darc li.done{color:var(--ink-3)}
.lkform{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0 0;
  padding:10px;border:1px solid var(--accent);border-radius:var(--radius);
  background:var(--panel-2)}
.lkurl{font-family:"IBM Plex Mono",monospace;font-size:11px;word-break:break-all;
  max-width:340px}
.dmiss{color:var(--amber);font-weight:500}
.dver{margin-left:6px;font:500 9.5px/1 "IBM Plex Mono",monospace;letter-spacing:.05em;
  color:var(--ink-3);border:1px solid var(--line);border-radius:3px;padding:2px 4px}
.dbound{font:400 11.5px/1 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-2)}
.dgood{font:500 10px/1 "IBM Plex Mono",monospace;letter-spacing:.05em;
  text-transform:uppercase;color:var(--green)}
.hgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:10px;
  margin-bottom:10px}
.hcell{border:1px solid var(--line);border-radius:var(--radius);padding:9px 10px;
  background:var(--panel-2)}
.hcell.filling{border-color:var(--accent);background:var(--accent-soft)}
.hcname{font:600 13px/1.2 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink);
  display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.fillnow{font:500 9px/1 "IBM Plex Mono",monospace;letter-spacing:.05em;
  text-transform:uppercase;color:var(--accent)}
.hcaddr{font:400 11.5px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-2);
  margin:2px 0 4px}
.hcmeta{font:400 10.5px/1.5 "IBM Plex Mono",monospace;color:var(--ink-3);margin-bottom:7px}
.hgrp{font:600 11px/1 "Barlow Condensed",sans-serif;letter-spacing:.06em;
  text-transform:uppercase;color:var(--accent);margin:14px 0 0;padding-bottom:4px;
  border-bottom:1px solid var(--line);display:flex;justify-content:space-between}
.hgrp span{color:var(--ink-3);font-weight:400}
.intohotel{font:400 11px/1 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3);
  display:flex;align-items:center;gap:5px}
.intohotel select{font:500 11.5px/1 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink);
  background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:4px 5px}
.hotelcard .haddr{font:400 12.5px/1.5 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-2);margin:0 0 10px}
.umark{display:inline-flex;align-items:center;justify-content:center;
  width:15px;height:15px;margin-left:5px;border-radius:3px;vertical-align:1px;
  font:700 9px/1 "IBM Plex Mono",monospace;
  background:var(--amber-bg);color:var(--amber);cursor:help}
.dsrc{font:600 8.5px/1 "IBM Plex Mono",monospace;letter-spacing:.05em;padding:2px 4px;
  border-radius:3px;margin-left:4px;vertical-align:1px}
.dsrc.working{background:var(--amber-bg);color:var(--amber)}
.dsrc.show{background:var(--red-bg);color:var(--red)}
.chbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:2px 0 10px}
.chnote{font:400 11px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3)}
.chtab td{vertical-align:middle}
.cb{display:inline-block;font:600 9.5px/1 "IBM Plex Mono",monospace;letter-spacing:.05em;
  text-transform:uppercase;padding:3px 5px;border-radius:3px;margin:1px 4px 1px 0;
  white-space:nowrap}
.cb.unconfirmed{background:var(--red-bg);color:var(--red)}
.cb.nodates{background:var(--amber-bg);color:var(--amber)}
.cb.nohotel{background:var(--panel-2);color:var(--ink-2);border:1px solid var(--line)}
.mailcell{display:flex;align-items:center;gap:6px}
.mail{font:400 11.5px/1.3 "IBM Plex Mono",monospace;color:var(--ink-2);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  min-width:0;max-width:22em}
.mailcell .iconbtn{margin-left:2px}
.iconbtn{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;
  border:1px solid var(--line);border-radius:4px;background:var(--panel);color:var(--ink-3);
  cursor:pointer;flex:none}
.iconbtn:hover{border-color:var(--accent);color:var(--accent)}
#copyfall{position:fixed;inset:0;z-index:70;background:rgba(16,22,30,.35);
  display:flex;align-items:center;justify-content:center}
.cfbox{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:14px;width:min(560px,90vw);box-shadow:var(--shadow);display:flex;
  flex-direction:column;gap:8px}
.cfbox b{font:600 12px/1 "Barlow Condensed",sans-serif;letter-spacing:.04em;
  text-transform:uppercase;color:var(--ink)}
.cfbox textarea{font:400 12px/1.5 "IBM Plex Mono",monospace;color:var(--ink);
  background:var(--panel-2);border:1px solid var(--line);border-radius:4px;padding:8px;
  resize:vertical}
.reform{display:grid;grid-template-columns:1fr 1fr;gap:8px 10px;padding:10px 0 4px;
  border-bottom:1px solid var(--line)}
.reform label{display:flex;flex-direction:column;gap:3px;
  font:500 10px/1 "IBM Plex Sans",system-ui,sans-serif;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ink-3)}
.reform label.wide{grid-column:1/-1}
.reform input,.reform select{font:400 12.5px/1.3 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink);background:var(--panel-2);border:1px solid var(--line);
  border-radius:4px;padding:6px 7px}
.reocc{padding-top:8px}
.occ{display:flex;align-items:center;gap:7px;padding:7px 0;
  border-bottom:1px solid var(--line-soft);flex-wrap:wrap}
.occl{font:500 9.5px/1 "IBM Plex Sans",system-ui,sans-serif;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3);width:78px}
.occ b{font:500 13px/1.2 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink)}
.occ .act{margin-left:auto}
.tdates{flex-basis:100%;display:flex;align-items:center;gap:5px;padding-top:5px}
.tlab{font:500 9.5px/1 "IBM Plex Sans",system-ui,sans-serif;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ink-3);width:78px;flex:none}
.tdates input{font:400 11.5px/1.2 "IBM Plex Mono",monospace;color:var(--ink);
  background:var(--panel-2);border:1px solid var(--line);border-radius:4px;padding:4px 5px}
.occ .act + .act{margin-left:4px}
.hform{display:grid;grid-template-columns:1fr 1fr;gap:8px 10px;margin-bottom:4px}
.hform label{display:flex;flex-direction:column;gap:3px;
  font:500 10px/1 "IBM Plex Sans",system-ui,sans-serif;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ink-3)}
.hform label.wide{grid-column:1/-1}
.hform input{font:400 12.5px/1.3 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink);
  background:var(--panel-2);border:1px solid var(--line);border-radius:4px;padding:6px 7px}
.hform input:focus{outline:2px solid var(--accent);outline-offset:-1px}
.hfrow{display:flex;gap:6px;flex-wrap:wrap;grid-column:1/-1}
.rflag{font:600 9px/1 "IBM Plex Mono",monospace;letter-spacing:.06em;padding:2px 4px;
  border-radius:3px;margin-right:5px}
.rflag.new{background:var(--green-bg);color:var(--green)}
.rflag.changed{background:var(--amber-bg);color:var(--amber)}
tr.flagged td{background:rgba(176,107,18,.05)}
.sheet .chg{font:600 8.5px/1 "IBM Plex Mono",monospace;letter-spacing:.06em;
  color:var(--amber);vertical-align:2px}
.hrow.flat{cursor:default;flex-wrap:wrap}
.hrow.flat:hover{background:none}
.hrow.off .hn{color:var(--ink-3)}
.hbtns{display:flex;gap:4px;margin-left:8px}
.hwhy{flex-basis:100%;font:400 10.5px/1.5 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-3);padding:1px 0 2px}
.rt{font:500 10px/1 "IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.04em;
  border:1px solid var(--line);border-radius:3px;padding:2px 4px;color:var(--ink-2)}
.rt.king{border-color:var(--accent);color:var(--accent)}
.hpick{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:6px 6px 10px;
  border-bottom:1px solid var(--line);font:500 13px/1.3 "IBM Plex Sans",system-ui,sans-serif}
.hpick .dim{font:400 11px/1 "IBM Plex Mono",monospace;color:var(--ink-3)}
.hrule{flex-basis:100%;font:400 10.5px/1.5 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-3);padding-top:2px}
.hpick .act{margin-left:auto}
.act.tiny{font-size:10.5px;padding:2px 6px}
@media (max-width:1200px){ .hsplit{grid-template-columns:1fr} }

/* ---------------- the staff list ----------------
   Built to be read on paper. Serif-free, generous leading, and every
   rule light enough that the names carry the page rather than the grid. */
#sheetwrap{position:fixed;inset:0;z-index:60;background:var(--ground);
  overflow:auto;display:flex;flex-direction:column;align-items:center}
.sheetbar{position:sticky;top:0;z-index:2;width:100%;display:flex;gap:8px;
  align-items:center;padding:10px 16px;background:var(--panel);
  border-bottom:1px solid var(--line)}
.sheetbar .t{font:600 13px/1 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink)}
.sheetbar .blocked{flex-basis:100%;font:400 11.5px/1.6 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-2);background:var(--amber-bg);border:1px solid var(--amber);
  border-radius:4px;padding:7px 10px;margin-top:2px}
.sheetbar .blocked b{color:var(--ink)}
.sheetbar{flex-wrap:wrap}
.sheetbar .n{font:400 11px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3);max-width:560px}
.sheet{width:min(760px,100%);background:var(--panel);margin:18px 0 40px;
  padding:34px 40px 44px;border:1px solid var(--line);border-radius:3px}
.sheet h1{font:600 24px/1.15 "Barlow Condensed",sans-serif;letter-spacing:.01em;margin:0 0 2px;
  color:var(--ink);text-transform:none}
.sheet .meta{font:400 12px/1.7 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-2);margin:0 0 4px}
.sheet .gen{font:400 10.5px/1.6 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3);
  border-bottom:1.5px solid var(--ink);padding-bottom:14px;margin-bottom:20px}
.sheet h2{font:600 11px/1 "IBM Plex Sans",system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;
  color:var(--accent);margin:22px 0 0;padding-bottom:5px;
  border-bottom:1px solid var(--line)}
.sheet h2 span{float:right;color:var(--ink-3);font-weight:400;letter-spacing:.04em}
.sheet table{width:100%;border-collapse:collapse;margin-top:2px}
.sheet th{font:500 9.5px/1 "IBM Plex Sans",system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase;
  color:var(--ink-3);text-align:left;padding:9px 8px 5px;font-weight:500}
.sheet td{font:400 12.5px/1.45 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink);
  padding:5px 8px;border-top:1px solid var(--line-soft);vertical-align:top}
.sheet td.pos{color:var(--ink-2)}
.sheet td.dcol{display:table-cell;font:400 11px/1.45 "IBM Plex Mono",monospace;
  color:var(--ink-2);white-space:nowrap}
.sheet td.dcol i{font-style:normal;color:var(--ink-3)}
.sheet .empty{font:400 12px/1.6 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3);padding:8px 8px}
.sheet .foot{margin-top:26px;padding-top:12px;border-top:1px solid var(--line);
  font:400 11px/1.7 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3)}
@media print{
  body>*{display:none!important}
  #sheetwrap{display:block!important;position:static;background:#fff;overflow:visible}
  .sheetbar{display:none!important}
  .sheet{width:auto;margin:0;padding:0;border:0;background:#fff}
  .sheet h2{break-after:avoid}
  .sheet tr{break-inside:avoid}
}
.selbar.ask{flex-wrap:wrap}
.askq{font:500 12px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink);align-self:center}
.askn{flex-basis:100%;font:400 11px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3);padding-top:2px}
.seldiv{width:1px;align-self:stretch;background:var(--line);margin:0 4px}
.movelab{font:500 11px/1 "IBM Plex Sans",system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-3);align-self:center}
.moveto{font:500 12px/1 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink);background:var(--panel);
  border:1px solid var(--line);border-radius:5px;padding:5px 6px;max-width:190px}
.moveto:disabled{opacity:.45}
.bulk{display:flex;gap:5px;margin-left:auto;align-items:flex-end;padding-bottom:1px}
.tabs{display:flex;gap:2px;margin:12px 0 0;border-bottom:1px solid var(--line-soft)}
.tab{background:none;border:0;padding:7px 11px 8px;font-size:12px;color:var(--ink-3);
     border-bottom:2px solid transparent;margin-bottom:-1px}
.tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent);font-weight:500}
.tab:hover{color:var(--ink)}
.selbar{display:flex;align-items:center;gap:6px;padding:7px 14px;
  border-bottom:1px solid var(--line-soft);background:var(--accent-soft);flex-wrap:wrap}
.selbar.hint{background:var(--panel-2);color:var(--ink-3);font-size:11.5px}
.selc{font-family:"IBM Plex Mono",monospace;font-size:11px;font-weight:500}

/* ---------- board ---------- */
.zone{border-top:1px solid var(--line-soft)}
.zone:first-child{border-top:0}
.zhead,.bhead{display:flex;align-items:center;gap:8px}
.zhead{padding:9px 14px 4px}
.disc{background:none;border:0;padding:0 2px;color:var(--ink-3);width:16px;line-height:1;
      font-size:10px;transition:transform .12s ease}
@media (prefers-reduced-motion:reduce){.disc{transition:none}}
.disc[aria-expanded="false"]{transform:rotate(-90deg)}
.zhead h3{margin:0;font-family:"Barlow Condensed",sans-serif;font-size:15px;font-weight:600;
          letter-spacing:.08em;text-transform:uppercase}
.zhead .sub,.bhead .sub{font-size:10.5px;color:var(--ink-3);font-family:"IBM Plex Mono",monospace}
.spacer{flex:1}
.booth{padding:0 14px 8px}
.bhead{padding:7px 0 4px}
.blabel{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.09em;
        color:var(--ink-3);text-transform:uppercase}
.brule{flex:1;height:1px;background:var(--line-soft);min-width:10px}
.rows{display:flex;flex-direction:column;gap:2px}

.row{
  display:grid;
  grid-template-columns:18px 14px 184px minmax(80px,1fr) 148px 118px 92px;
  align-items:center;gap:8px;
  border:1px solid transparent;border-radius:3px;padding:4px 7px;
}
.row:hover{background:var(--panel-2);border-color:var(--line-soft)}
.row[aria-current="true"]{border-color:var(--accent);background:var(--accent-soft)}
.row[data-sel]{background:var(--accent-soft)}
.sel{margin:0;justify-self:center;accent-color:var(--accent);cursor:pointer}
.row.clickable{cursor:pointer}
.dot{width:9px;height:9px;border-radius:50%;background:var(--grey);justify-self:center}
.dot.amber{background:var(--amber)} .dot.green{background:var(--green)}
.slot{font-size:12.5px}
.slot.sit{color:var(--ink-3);font-style:italic}
/* .who was nowrap + ellipsis so long names truncate cleanly on one
   line. Right for a name; wrong for the SAID NO badge underneath it,
   which inherited both and got clipped mid-word at anything under
   1500px. The name keeps its own ellipsis; the row is allowed to be
   two lines when it carries a warning. */
.who{font-size:12.5px;color:var(--ink-2);min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* ...and the badge opts out of the nowrap it would otherwise inherit,
   which is what clipped it mid-word below 1500px. Letting the whole
   column wrap instead made every Temp and Con Crew row two lines high
   at narrow widths — the fix has to be the one element, not the column. */
.saidflag{white-space:normal}
.who.empty{color:var(--ink-3)}
.who b{font-weight:500;color:var(--ink)}

/* day pills on a staff line */
.dp{display:flex;gap:3px}
.dp b{
  font-family:"IBM Plex Mono",monospace;font-size:8.5px;letter-spacing:0;font-weight:400;
  width:26px;text-align:center;padding:2px 0;border-radius:2px;
  border:1px solid var(--line-soft);color:var(--ink-3);background:transparent;
}
.dp b.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);font-weight:500}
.dp b.setup{border-style:dashed}
.dp.blank b{opacity:.35}

.chips{display:flex;gap:4px;justify-content:flex-end;flex-wrap:nowrap}
.chip{font-family:"IBM Plex Mono",monospace;font-size:9px;letter-spacing:.07em;padding:1px 4px;
      border-radius:2px;border:1px solid var(--line);color:var(--ink-3);white-space:nowrap}
.chip.core{border-color:var(--accent);color:var(--accent)}
.hnote.prev{border:1px dashed var(--line);border-left:3px solid var(--amber);background:var(--panel-2);padding:8px 10px;border-radius:var(--radius)}
.hnote.prev code{font-size:11px}
.saidnote{margin:10px 0;padding:9px 11px;border:1px solid var(--red);border-left-width:3px;border-radius:var(--radius);background:var(--red-bg);color:var(--ink);line-height:1.45}
/* Beside the name, not in the chips column: .row is a fixed grid and the
   chips track is 118px, so a badge this long overflowed onto the day
   pills and sat on top of them. The name column is the one that flexes. */
.hno{color:var(--red)}
/* ---- equipment ---- */
.palgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:6px;
  margin:6px 0 12px}
.pal{display:flex;flex-direction:column;gap:2px;align-items:flex-start;text-align:left;
  padding:7px 9px;border:1px solid var(--line);border-radius:var(--radius);
  background:var(--panel);color:var(--ink);cursor:pointer;font:inherit}
.pal:hover{border-color:var(--accent)}
.pal.on{border-color:var(--accent);background:var(--accent-soft);
  box-shadow:inset 3px 0 0 var(--accent)}
.pal.empty .paln{color:var(--amber)}
.palname{font-weight:600;font-size:12.5px}
.paln{font-family:"IBM Plex Mono",monospace;font-size:9.5px;color:var(--ink-3);
  letter-spacing:.04em;text-transform:uppercase}
.eqform{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:9px;
  margin:8px 0}
.eqform label{display:flex;flex-direction:column;gap:3px;font-size:11px;color:var(--ink-2);
  min-width:0}
.eqform label.wide2{grid-column:1/-1}
.eqform select{font:inherit;font-size:12px;padding:5px 6px;border:1px solid var(--line);
  border-radius:var(--radius);background:var(--panel);color:var(--ink);max-width:100%}
.eqform select:disabled{color:var(--ink-3);background:var(--panel-2)}
.probchip{font-family:"IBM Plex Mono",monospace;font-size:9px;letter-spacing:.05em;
  text-transform:uppercase;padding:1px 5px;border-radius:2px;border:1px solid var(--line);
  color:var(--ink-2);white-space:nowrap}
.probchip.bad{border-color:var(--red);color:var(--red);background:var(--red-bg)}
tr.eqdone td{opacity:.55}
tr.eqdone td:nth-child(3){text-decoration:line-through}
.binchip{font-family:"IBM Plex Mono",monospace;font-size:8.5px;letter-spacing:.06em;
  padding:1px 4px;border-radius:2px;border:1px solid var(--accent);color:var(--accent)}
tr.eqhead td{background:var(--panel-2)}
.eqload td{padding:3px 6px}
.eqta{font-family:"IBM Plex Mono",monospace;font-size:11px;line-height:1.5;resize:vertical;min-height:74px}
.eqwarn{margin:6px 0;padding-left:18px;font-size:11px;color:var(--amber);line-height:1.5}
.eqwarn li{margin:2px 0}
.tick{display:inline-flex;align-items:center;gap:4px;font-size:10px;color:var(--ink-3)}
/* the printable sheet */
.eqsheet .palrow td{font-weight:700;font-size:12px;padding-top:9px;
  border-bottom:1px solid #000}
.eqsheet .binrow td{font-style:italic;padding-left:10px;color:#333}
.eqsheet .qty{width:34px;text-align:center}
.eqsheet .tickbox{width:74px;border:1px solid #999}
.eqsheet tr.struck td{text-decoration:line-through;color:#777}
/* NOT nowrap. The name column is minmax(80px,1fr), so on a narrower
   window it shrinks and a nowrap badge is CLIPPED — at 1400px this read
   "SAID NO — NEEDS REPL". A truncated warning is a worse warning than a
   two-line one, and clipping is silent: it looks like the label is just
   short. Wrapping costs one row of height on the one row that needs it. */
.saidflag{display:inline-block;max-width:100%;margin-top:3px;
  font-family:"IBM Plex Mono",monospace;font-size:9px;letter-spacing:.06em;
  text-transform:uppercase;padding:1px 5px;border-radius:2px;line-height:1.35;
  border:1px solid var(--red);color:var(--red);background:var(--red-bg)}
/* Amber family, as asked — but its own wash and its own left edge, so it cannot be mistaken for an ordinary pencilled-in row, which is also amber. */
.row.saidnorow{background:var(--amber-bg);box-shadow:inset 3px 0 0 var(--red)}
.row.saidnorow .who b{text-decoration:line-through;text-decoration-thickness:1px;opacity:.75}
.row.saidnorow .stat{border-color:var(--red);color:var(--red);background:var(--red-bg)}
.chip.local{border-color:var(--green);color:var(--green)}
.chip.sit{border-style:dashed}
.stat{
  font-family:"IBM Plex Mono",monospace;font-size:9px;letter-spacing:.07em;padding:2px 5px;
  border-radius:2px;border:1px solid var(--line);background:var(--panel);color:var(--ink-3);
  width:100%;text-align:center;
}
.stat.amber{border-color:var(--amber);color:var(--amber);background:var(--amber-bg)}
.stat.green{border-color:var(--green);color:var(--green);background:var(--green-bg)}
.stat:hover:not(:disabled){filter:brightness(.97);border-color:var(--accent)}
.stat:disabled{opacity:.5;cursor:default}

.addbtn{background:none;border:1px dashed var(--line);border-radius:3px;color:var(--ink-3);
        font-size:10.5px;padding:2px 8px;font-family:"IBM Plex Mono",monospace}
.addbtn:hover{border-color:var(--accent);color:var(--accent);border-style:solid}

/* strips */
.strip{padding:9px 14px 12px;border-top:1px solid var(--line-soft);background:var(--panel-2)}
.strip h4{margin:0 0 5px;font-family:"Barlow Condensed",sans-serif;font-size:12.5px;
          letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.striprow{display:flex;align-items:baseline;gap:8px;padding:3px 0;font-size:12px;
          border-bottom:1px dotted var(--line-soft)}
.striprow:last-child{border-bottom:0}
.striprow .where{font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--ink-3);white-space:nowrap}
.striprow .why{color:var(--ink-3);font-style:italic;flex:1}
.mini{background:none;border:1px solid var(--line);border-radius:3px;font-size:10.5px;
      padding:1px 6px;color:var(--ink-2)}
.mini:hover{border-color:var(--accent);color:var(--accent)}

/* ---------- picker ---------- */
.picker-empty{padding:22px 16px;color:var(--ink-3);font-size:12px;line-height:1.6}
.psel{padding:10px 12px;border-bottom:1px solid var(--line-soft);background:var(--accent-soft);flex:0 0 auto}
.psel .pslot{font-family:"Barlow Condensed",sans-serif;font-size:19px;font-weight:600;line-height:1.1}
.psel .pwhere{font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--ink-2);
              margin-top:2px;letter-spacing:.05em}
.pacts{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}
.act{background:var(--panel);border:1px solid var(--line);border-radius:3px;padding:3px 8px;font-size:11px}
.act:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}
.act.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.act.primary:hover{color:var(--accent-ink);filter:brightness(1.08)}
.act.danger:hover:not(:disabled){border-color:var(--red);color:var(--red)}
.act:disabled{opacity:.42;cursor:not-allowed}

.form{padding:10px 12px;border-bottom:1px solid var(--line-soft);background:var(--panel-2)}
.form label{display:block;font-size:11px;color:var(--ink-3);margin-bottom:4px}
.form input[type=text]{width:100%;background:var(--panel);border:1px solid var(--line);
  border-radius:3px;padding:5px 7px;font-size:12px}
.form .frow{display:flex;gap:5px;margin-top:7px}

.pdays{padding:9px 12px;border-bottom:1px solid var(--line-soft)}
.photel{display:flex;gap:8px;align-items:flex-start;padding:9px 12px;
  border-bottom:1px solid var(--line-soft);font-size:11.5px;color:var(--ink-2)}
.photel b{color:var(--ink);font-weight:500}
.pdays .lab{font-size:11px;color:var(--ink-3);margin-bottom:5px}
.pdays .dp{gap:3px;flex-wrap:wrap}
.pdays .dp b{width:auto;padding:3px 7px;font-size:10px;cursor:pointer;border-style:solid}
.pdays .dp b.setup{border-style:dashed}
.pdays .quick{display:flex;gap:5px;margin-top:6px;flex-wrap:wrap}

.pfilter{display:flex;align-items:center;gap:7px;padding:7px 12px;border-bottom:1px solid var(--line-soft)}
.pfilter input[type=search]{flex:1;min-width:0;background:var(--panel-2);border:1px solid var(--line);
  border-radius:3px;padding:4px 7px;font-size:12px}
.pfilter label{font-size:11px;color:var(--ink-3);display:flex;align-items:center;gap:4px;white-space:nowrap}

.tier{padding:7px 12px 2px;display:flex;align-items:baseline;gap:7px}
.tier h5{margin:0;font-family:"Barlow Condensed",sans-serif;font-size:12.5px;font-weight:600;
         letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2)}
.tier .n{font-size:10px;color:var(--ink-3);font-family:"IBM Plex Mono",monospace}
.tier .rule{flex:1;height:1px;background:var(--line-soft)}
.cand{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:start;width:100%;
      text-align:left;background:none;border:0;border-radius:3px;padding:6px 12px}
.cand > span:first-child{min-width:0}
.cand:hover:not(:disabled){background:var(--accent-soft)}
.cand:disabled{cursor:default;opacity:.62}
.cname{font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.cmeta{display:block;font-size:10.5px;color:var(--ink-3);
  font-family:"IBM Plex Mono",monospace;margin-top:1px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmeta.blocked{color:var(--red)}
.cmeta.trip{color:var(--ink-3);opacity:.85}
.chip.rel{border-color:var(--amber);color:var(--amber)}
.chip.hot.green{border-color:var(--green);color:var(--green);background:var(--green-bg)}
.chip.hot.amber{border-color:var(--amber);color:var(--amber);background:var(--amber-bg)}
.chip.hot.red{border-color:var(--red);color:var(--red);background:var(--red-bg)}
.chip.hot.grey{opacity:.45}
.plist{padding:4px 0 10px}
.plist button{display:block;width:100%;text-align:left;background:none;border:0;
  padding:5px 12px;font-size:12.5px}
.plist button:hover{background:var(--accent-soft)}
.plist .grp{padding:8px 12px 3px;font-size:10px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--ink-3);font-family:"IBM Plex Mono",monospace}

.toast{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);max-width:min(600px,92vw);
  background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--accent);
  border-radius:var(--radius);box-shadow:var(--shadow);padding:9px 13px;font-size:12.5px;z-index:20}
.toast.bad{border-left-color:var(--red)}
.toast.good{border-left-color:var(--green)}
@media (prefers-reduced-motion:no-preference){
  .toast{animation:rise .18s ease-out}
  @keyframes rise{from{opacity:0;transform:translate(-50%,6px)}}
}
@media (max-width:1180px){
  .app{grid-template-columns:1fr}
  .pane.sticky{position:static;max-height:none}
  .railcol{order:-1}
  .row{grid-template-columns:18px 14px 150px minmax(64px,1fr) 148px 104px 88px}
}

/* =====================================================================
   ADDED FOR THE LIVE SITE
   =====================================================================
   Everything above this line is board.html's stylesheet, unchanged, so
   the two can be diffed. Below are the few things the live site needs
   that the prototype has no class for — because the prototype has no
   notion of a screen that exists in it and not yet here.
   ===================================================================== */

/* A tile for a screen that is open to you and has not been ported yet.
   Disabled rather than clickable, and SAYING SO rather than looking
   ordinary: a tile that does nothing when pressed is a bug report. */
.qlink:disabled{cursor:default;opacity:.72}
.qlink:disabled:hover{border-color:var(--line);background:var(--panel-2)}
.qsoon{display:block;margin-top:5px;font-family:"IBM Plex Mono",monospace;
  font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}

/* A tab whose screen is not built. Distinct from .locked, which means
   the permission grid refuses you — two different answers to "why can I
   not press this", and collapsing them would send somebody to an admin
   for a screen nobody can open yet. */
.tab:disabled:not(.locked){opacity:.55;cursor:default}
.tab:disabled:not(.locked):hover{color:var(--ink-2);border-bottom-color:transparent}

/* A sub-heading inside a card — the archive pane has three lists in one
   pane ("Over, still in the lists", "Archived") and they need separating
   without becoming three cards. */
.hsec{margin:16px 0 4px;font:600 11px/1.2 "IBM Plex Sans",system-ui,sans-serif;
  letter-spacing:.07em;text-transform:uppercase;color:var(--ink-2)}
.hsec:first-child{margin-top:0}

/* The permission grid is 9 columns and does not shrink usefully — a
   grid squeezed until the ticks no longer line up under their role is
   not a grid. So it scrolls sideways inside its own card rather than
   pushing the whole page wide. */
.tabwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* NOT .htab.grid — board.html already defines that, for a grid with
   rotated headers and .gcell bodies, and reusing the name meant two
   sets of rules quietly disagreeing about the same table. The ticks
   bunched at the left under the wrong roles and neither rule was
   obviously wrong on its own. A class name is an interface; borrowing
   one that is already taken is the CSS version of two functions with
   the same name.

   table-layout:fixed, because auto layout sizes a column to its widest
   CELL — and a tick column whose cells are mostly empty collapses to
   nothing. A grid whose ticks do not line up under their role is not a
   grid, it is a trap. */
.pgrid{min-width:780px;table-layout:fixed}
.pgrid th:first-child,.pgrid td:first-child{width:200px;white-space:normal}
.pgrid th:nth-child(2),.pgrid td:nth-child(2){width:70px}
.pgrid th:nth-child(n+3){width:74px;text-align:center}
/* .pgtick, not .tick — board.html uses .tick for an inline-flex badge,
   and inheriting display:inline-flex on a table cell stops it being a
   cell at all: the browser laid seven of them out as inline boxes
   inside one column and the ticks wrapped onto three lines. Two class
   collisions in one table (.htab.grid and .tick), both silent, both
   looking like a layout bug rather than a naming one. */
.pgrid td.pgtick{display:table-cell;text-align:center;color:var(--accent);
  font-weight:600;font-size:13px}
.pgrid tbody tr:hover td{background:var(--panel-2)}

/* WHAT THE DATABASE SAID.

   Every verb in this app answers in a sentence, and those sentences are
   the most useful thing on the screen — "36 people on it under the
   current company's loadout", "there would be nobody left who could put
   it back". They render in a card that has to be findable: it is
   scrolled to after every write and marked for a moment, because an
   answer nobody reads is an answer nobody got. */
.hcard.said{border-left:3px solid var(--accent)}
.hcard.said h3{color:var(--accent)}
.hcard.said.bad{border-left-color:var(--red)}
.hcard.said.bad h3{color:var(--red)}
.hcard.said.justsaid{animation:saidflash 1.6s ease-out}
@keyframes saidflash{
  0%{background:var(--accent-soft)}
  100%{background:var(--panel)}
}
@media (prefers-reduced-motion:reduce){
  .hcard.said.justsaid{animation:none;background:var(--accent-soft)}
}

/* ANSWERED NO  (migration 98)

   The fourth badge on Still to settle, and the only one that is not a
   question. Unconfirmed, No Dates and Hotel Unanswered are things
   somebody still owes you; this one is an answer that ends them —
   Chris: "a 'No, I am no longer available.' means they aren't coming,
   so removal is pending. Dates and Hotel do not matter at that point."

   So it reads as a state rather than a chore: solid red, not the tinted
   ground the other three share, and it never appears beside them. The
   row it sits on is dimmed and its name struck through, the same
   treatment the Staffing Board gives a said-no row, so the two screens
   say the same thing the same way. */
.cb.saidno{background:var(--red);color:#fff;border:1px solid var(--red)}
tr.chgone{opacity:.72}
tr.chgone td:nth-child(2){text-decoration:line-through;
  text-decoration-thickness:1px;text-decoration-color:var(--red)}
/* the position under the name is context, not the person — leave it alone */
tr.chgone td:nth-child(2) .dim{text-decoration:none}
.hrow .cb.saidno{margin-right:6px}

/* OUT BEFORE IN  (migration 100)

   The third date badge, and unlike WORKING DATES and SHOW DATES it is
   not saying where the dates came from — it is saying they cannot both
   be true. Solid red rather than tinted, because the other two are
   degrees of confidence and this one is an error. */
.dsrc.impossible{background:var(--red);color:#fff}

/* WORKING  (the Staffing Board)

   Every write here is a round trip and then a full re-read of the
   board — a second or two on a real show. The only feedback used to be
   the buttons greying out, and on a dark screen a greyed button reads
   as a click that missed rather than a click that landed. Chris:
   "it simply appears it is being unresponsive even though it is in the
   midst of doing something."

   So: a bar at the top of the board that says what is happening in
   words, a spinner that is obviously moving, and progress counted out
   loud when it is a batch. It goes up BEFORE the request, not after. */
.pendbar{display:flex;align-items:center;gap:10px;margin:0 0 10px;padding:9px 12px;
  border:1px solid var(--accent);border-left-width:3px;border-radius:var(--radius);
  background:var(--accent-soft);color:var(--ink);
  font:500 12px/1.4 "IBM Plex Sans",system-ui,sans-serif}
.spinner{flex:none;width:13px;height:13px;border-radius:50%;
  border:2px solid var(--accent);border-top-color:transparent;
  animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
body.boardbusy{cursor:progress}
body.boardbusy .row.clickable,
body.boardbusy .cand{pointer-events:none}
.act.working,.mini.working,.cand.working{position:relative;
  border-color:var(--accent);background:var(--accent-soft)}
@media (prefers-reduced-motion:reduce){
  .spinner{animation:none;border-top-color:var(--accent);opacity:.6}
}

/* ---------------- Generators ----------------
   Templates, plugs and the four contact lists. The one thing here that
   is doing real work is .plugchip.miss: an unfilled plug is LEFT IN the
   text rather than becoming a blank, so it has to be impossible to read
   past. Amber, boxed, monospace — a hole that looks like a hole. */
.gtab td{vertical-align:top}
.gtab .dact{white-space:nowrap}
.dmiss{color:var(--amber)}

.tscope{display:inline-block;margin-left:6px;font:500 8.5px/1 "IBM Plex Mono",monospace;
  letter-spacing:.07em;text-transform:uppercase;padding:2px 4px;border-radius:2px;
  border:1px solid var(--green);color:var(--green);background:var(--green-bg)}
.tscope.own{border-color:var(--line);color:var(--ink-3);background:var(--panel-2)}

.tmeta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 0 2px;
  font:400 11px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-3)}
.tmeta .tname{font:600 14px/1.2 "Barlow Condensed",sans-serif;letter-spacing:.01em;
  color:var(--ink)}
.tmeta .prob{color:var(--amber)}

.tfield{margin:10px 0 0}
.tfield label{display:block;font:500 9.5px/1 "IBM Plex Sans",system-ui,sans-serif;
  letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);margin:0 0 4px}
.tout{white-space:pre-wrap;font:400 12.5px/1.65 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink);background:var(--panel-2);border:1px solid var(--line);
  border-radius:4px;padding:10px 12px;max-height:420px;overflow:auto}
.tout.one{max-height:none;font-weight:500}
.dtext{width:100%;min-height:260px;resize:vertical;font:400 12.5px/1.65 "IBM Plex Mono",monospace;
  color:var(--ink);background:var(--panel);border:1px solid var(--line);
  border-radius:4px;padding:10px 12px}

.holes{margin:10px 0 0;padding:8px 10px;border-radius:4px;
  font:400 11.5px/1.6 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-2);
  border:1px solid var(--amber);background:var(--amber-bg)}
.holes.bad{border-color:var(--red);background:var(--red-bg)}
.holes b{color:var(--ink)}
.holes .hrule{display:block;margin-top:4px}

.plugchip{display:inline-block;font:500 10.5px/1.4 "IBM Plex Mono",monospace;
  padding:1px 4px;border-radius:2px;border:1px solid var(--line);
  background:var(--panel);color:var(--ink-2)}
.plugchip.miss{border-color:var(--amber);color:var(--amber);background:var(--amber-bg)}
.plugchip.unk{border-color:var(--red);color:var(--red);background:var(--red-bg)}

.pluggrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2px 14px;
  margin:8px 0 0}
.plugrow{display:flex;align-items:baseline;gap:7px;padding:3px 0;
  border-bottom:1px dotted var(--line-soft)}
.plugrow.broke{background:var(--red-bg)}
.pluglab{font:500 11.5px/1.4 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink)}
.plugd{margin-left:5px;font:400 9.5px/1 "IBM Plex Mono",monospace;color:var(--ink-3)}
.plughint{margin-left:auto;font:400 10.5px/1.4 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-3);text-align:right}

/* ---- equipment, the parts the port needed ---- */
.palopen{margin:10px 0 0;padding:9px 11px;border:1px solid var(--line);
  border-radius:var(--radius);background:var(--panel-2)}
.palopen h4{margin:0 0 6px;display:flex;align-items:baseline;gap:9px;
  font:600 12.5px/1 "Barlow Condensed",sans-serif;letter-spacing:.05em;
  text-transform:uppercase;color:var(--ink-3)}
.palopen h4 .act{margin-left:auto}
.palist{list-style:none;margin:0;padding:0;
  columns:2;column-gap:18px;font-size:11.5px;line-height:1.7}
@media (max-width:1100px){.palist{columns:1}}
.palist li{break-inside:avoid;color:var(--ink)}
.palsec{margin-left:6px;font:400 9.5px/1 "IBM Plex Mono",monospace;color:var(--ink-3);
  letter-spacing:.05em;text-transform:uppercase}
.ldprev{margin:10px 0 0}
.qtyin{max-width:90px}

/* ---- the editable loadout ---- */
.ldname{margin:2px 0 10px;padding-bottom:9px;border-bottom:1px solid var(--line-soft)}
.ldname label{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--ink-2)}
.ldname .dinp{min-width:280px}
.lded{margin:4px 0 0}
.ldrow{display:flex;align-items:center;gap:5px;padding:2px 0}
.ldrow .ldin{flex:1;min-width:0}
.ldrow.ishead{margin-top:7px}
.ldrow.ishead .ldin{font-weight:600;text-transform:uppercase;letter-spacing:.04em;
  font-size:11px}
.ldk{width:34px;flex:0 0 auto;text-align:right;
  font:500 9px/1 "IBM Plex Mono",monospace;letter-spacing:.06em;color:var(--ink-3)}
.ldrow.ishead .ldk{color:var(--accent)}

/* ---- hotel card ---- */
.hcwhy{margin-top:5px;font:400 10.5px/1.5 "IBM Plex Sans",system-ui,sans-serif;
  color:var(--ink-3)}
.hnote.homeless{margin:10px 0 0;padding:9px 11px;border:1px solid var(--red);
  border-radius:var(--radius);background:var(--red-bg);color:var(--ink-2)}
.hnote.homeless b{color:var(--ink)}
.hnote.homeless .hrule{display:block;margin-top:6px}