@font-face{font-family:"Barlow Condensed";font-weight:600;font-style:normal;font-display:swap;src:url(fonts/barlow-condensed-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:700;font-style:normal;font-display:swap;src:url(fonts/barlow-condensed-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:500;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-sans-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:600;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-sans-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:500;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2")}

:root{
  --ground:#EDF0F2; --surface:#FFFFFF; --sunk:#F5F7F8; --ink:#13202C; --muted:#586878; --line:#D2D9DF;
  --accent:#1C5D99; --accent-ink:#FFFFFF; --warn-bg:#FFF4D6; --warn-ink:#6B4B00; --bad-ink:#A3222F; --ok-ink:#1E7A35;
  --ex-bg:#E8E0F7; --ex-ink:#4A2C85;
  --mp:#2B59C3; --mp-ink:#FFFFFF; --mc:#A9C3F0; --mc-ink:#0E2350; --g:#28a745; --y:#F5A000; --r:#dc3545; --u:#6c757d;
  --display:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --body:"IBM Plex Sans",-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --mp:#6E97F2; --mp-ink:#06121D; --mc:#233A66; --mc-ink:#CFDCF7;
    --ground:#0B141D; --surface:#13202C; --sunk:#0F1A25; --ink:#E4ECF2; --muted:#93A4B4; --line:#26384B;
    --accent:#5AA9E6; --accent-ink:#06121D; --warn-bg:#3A2E0E; --warn-ink:#F4D27A; --bad-ink:#FF8A93; --ok-ink:#6FD58A;
    --ex-bg:#2C2248; --ex-ink:#CBB8F5;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --mp:#6E97F2; --mp-ink:#06121D; --mc:#233A66; --mc-ink:#CFDCF7;
  --ground:#0B141D; --surface:#13202C; --sunk:#0F1A25; --ink:#E4ECF2; --muted:#93A4B4; --line:#26384B;
  --accent:#5AA9E6; --accent-ink:#06121D; --warn-bg:#3A2E0E; --warn-ink:#F4D27A; --bad-ink:#FF8A93; --ok-ink:#6FD58A;
  --ex-bg:#2C2248; --ex-ink:#CBB8F5;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{background:var(--ground);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.45;padding-inline:16px;padding-block:0 48px}
.wrap{max-width:1200px;margin:0 auto}
header.top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px;padding-block:20px 12px;border-bottom:2px solid var(--ink)}
h1{font-family:var(--display);font-weight:700;font-size:40px;letter-spacing:.02em;line-height:1;margin:0;text-transform:uppercase}
h1 span{color:var(--accent)}
.sub{color:var(--muted);font-size:13px;margin-top:4px}
.utc{font-family:var(--mono);font-size:13px;text-align:right}
.utc b{font-size:22px;font-weight:500;display:block;font-variant-numeric:tabular-nums}
.period{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;padding-block:12px;font-size:14px}
.badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--display);font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:15px;padding:3px 10px;border-radius:4px;background:var(--sunk);border:1px solid var(--line)}
.badge.ex{background:var(--ex-bg);color:var(--ex-ink);border-color:transparent}
.badge.live{background:var(--accent);color:var(--accent-ink);border-color:transparent}
.badge.closed{color:var(--muted)}
.me{margin-left:auto;display:flex;gap:8px;align-items:center;font-size:13px;color:var(--muted)}
.me b{font-family:var(--mono);color:var(--ink);font-weight:500}
nav.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:18px;overflow-x:auto}
nav.tabs button{font-family:var(--display);font-weight:600;font-size:18px;letter-spacing:.06em;text-transform:uppercase;background:none;border:0;border-bottom:3px solid transparent;color:var(--muted);padding:10px 14px;min-height:44px;cursor:pointer;white-space:nowrap}
nav.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent)}
.note{background:var(--warn-bg);color:var(--warn-ink);border-radius:8px;padding:10px 14px;font-size:14px;margin-bottom:14px}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:20px;align-items:start}
@media (max-width:920px){.layout{grid-template-columns:1fr}}
.col{display:grid;gap:18px}
section.block{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px;display:grid;gap:14px}
h2{font-family:var(--display);font-weight:600;font-size:21px;letter-spacing:.06em;text-transform:uppercase;margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
h2 small{font-family:var(--body);font-size:12px;letter-spacing:.02em;text-transform:none;color:var(--muted);font-weight:400}
.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;align-items:start}
label.f{display:grid;gap:4px;align-content:start;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600}
.lbl{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600}
input[type=text],input[type=number],input[type=password],select,textarea{font:inherit;color:var(--ink);background:var(--sunk);border:1px solid var(--line);border-radius:6px;padding:10px 11px;min-height:44px;width:100%}
input.mono,textarea{font-family:var(--mono);text-transform:uppercase}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.hint{font-size:12px;color:var(--muted);text-transform:none;letter-spacing:0;font-weight:400}
.hint.bad{color:var(--bad-ink)}
.seg{display:flex;flex-wrap:wrap;gap:6px}
.seg button{font:inherit;font-size:14px;min-height:44px;padding:8px 14px;border-radius:6px;border:1px solid var(--line);background:var(--sunk);color:var(--ink);cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:600}
.toggle{display:flex;align-items:center;gap:10px;font-size:14px;cursor:pointer;min-height:44px}
.toggle input{width:22px;height:22px;accent-color:var(--accent)}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
@media (max-width:1100px) and (min-width:921px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.grid .nm{font-size:17px}
.grps{display:grid;gap:18px}
.grp{display:grid;gap:8px}
.grp-hd{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;border-bottom:1px solid var(--line);padding-bottom:6px}
.grp-n{font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:.08em;text-transform:uppercase}
.grp-p{font-size:13px;color:var(--muted)}
.grp-hd .btn{margin-left:auto}
.cells-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
@media (max-width:640px){.cells-g{grid-template-columns:1fr}}
.cells-g .cg{display:grid;gap:3px}
.cells-g .cg-n{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
.cells-g .cg-c{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px}
.area-g{font-family:var(--display);font-weight:700;font-size:19px;letter-spacing:.08em;text-transform:uppercase;margin-top:10px;display:flex;gap:12px;align-items:baseline}
.area-g span{font-family:var(--body);font-weight:400;font-size:13px;letter-spacing:0;text-transform:none;color:var(--muted)}
.cat{border:1px solid var(--line);border-left:6px solid var(--u);border-radius:8px;padding:10px 10px 10px 12px;display:grid;gap:8px;background:var(--surface)}
.cat[data-s="P"]{border-left-color:var(--mp)} .cat[data-s="C"]{border-left-color:var(--mc)} .cat[data-s="N"]{border-left-color:var(--line)}
.cat[data-s="G"]{border-left-color:var(--g)} .cat[data-s="Y"]{border-left-color:var(--y)} .cat[data-s="R"]{border-left-color:var(--r)}
.cat .hd{display:flex;justify-content:space-between;align-items:baseline;gap:6px}
.nm{font-family:var(--display);font-weight:600;font-size:19px;letter-spacing:.04em;text-transform:uppercase}
.ab{font-family:var(--mono);font-size:12px;color:var(--muted)}
.cat .test{font-size:12.5px;color:var(--muted);min-height:2.6em}
.sw{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.sw button{font:inherit;font-size:13px;font-weight:600;min-height:40px;border-radius:5px;border:1px solid var(--line);background:var(--sunk);color:var(--ink);cursor:pointer}
.sw button[aria-pressed="true"][data-v="G"]{background:var(--g);border-color:var(--g);color:#fff}
.sw button[aria-pressed="true"][data-v="Y"]{background:var(--y);border-color:var(--y);color:#1d1600}
.sw button[aria-pressed="true"][data-v="R"]{background:var(--r);border-color:var(--r);color:#fff}
.sw button[aria-pressed="true"][data-v="U"]{background:var(--u);border-color:var(--u);color:#fff}
.sw button[aria-pressed="true"][data-v="P"]{background:var(--mp);border-color:var(--mp);color:var(--mp-ink)}
.sw button[aria-pressed="true"][data-v="C"]{background:var(--mc);border-color:var(--mc);color:var(--mc-ink)}
.sw button[aria-pressed="true"][data-v="N"]{background:var(--surface);border-color:var(--ink);color:var(--ink)}
.bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.btn{font:inherit;font-size:14px;font-weight:500;min-height:44px;padding:8px 14px;border-radius:6px;border:1px solid var(--line);background:var(--sunk);color:var(--ink);cursor:pointer}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
.btn.small{min-height:36px;padding:5px 10px;font-size:13px}
.btn.danger{color:var(--bad-ink)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.chip{font-family:var(--mono);font-size:12.5px;padding:6px 10px;min-height:36px;border-radius:999px;border:1px dashed var(--line);background:transparent;color:var(--ink);cursor:pointer}
.dot{width:14px;height:14px;border-radius:50%;background:var(--u);display:inline-block;flex:none}
.dot.G{background:var(--g)} .dot.Y{background:var(--y)} .dot.R{background:var(--r)} .dot.U{background:var(--u)}
.count{font-family:var(--mono);font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.side{position:sticky;top:calc(env(safe-area-inset-top, 0px) + 12px);display:grid;gap:16px}
@media (max-width:920px){.side{position:static}}
ul.checks{list-style:none;margin:0;padding:0;display:grid;gap:8px}
ul.checks li{display:grid;grid-template-columns:22px 1fr;gap:8px;font-size:14px;align-items:start}
.mark{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:700;color:#fff;background:var(--r)}
.mark.ok{background:var(--g)} .mark.na{background:var(--u)}
.why{display:block;font-size:12.5px;color:var(--muted)}
.why.bad{color:var(--bad-ink)}
.tick{display:flex;gap:8px;align-items:center;font-size:13px;margin-top:4px;cursor:pointer}
.tick input{width:20px;height:20px;accent-color:var(--accent)}
pre.wire{font-family:var(--mono);font-size:13px;background:var(--sunk);border:1px solid var(--line);border-radius:6px;padding:10px;margin:0;white-space:pre-wrap;word-break:break-word}
.meta{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.msg{font-size:13.5px;min-height:1.2em}
.msg.ok{color:var(--ok-ink)} .msg.bad{color:var(--bad-ink)}
/* board */
.boardbar{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-bottom:12px;font-size:14px}
.stations{display:grid;gap:10px}
.st{background:var(--surface);border:1px solid var(--line);border-left:6px solid var(--u);border-radius:8px;padding:12px 14px;display:grid;grid-template-columns:170px minmax(0,1fr);gap:8px 16px}
.st.G{border-left-color:var(--g)} .st.Y{border-left-color:var(--y)} .st.R{border-left-color:var(--r)}
@media (max-width:640px){.st{grid-template-columns:1fr}}
.st .who{display:grid;gap:2px;align-content:start}
.st .call{font-family:var(--mono);font-size:18px;font-weight:500}
.st .when{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.cells{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:3px}
@media (max-width:640px){.cells{grid-template-columns:repeat(6,minmax(0,1fr))}}
.cell{font-family:var(--mono);font-size:11px;text-align:center;padding:5px 0;border-radius:3px;background:var(--u);color:#fff}
.cell.mP{background:var(--mp);color:var(--mp-ink)} .cell.mC{background:var(--mc);color:var(--mc-ink)} .cell.mN{background:var(--surface);color:var(--muted);border:1px solid var(--line)} .cell.mU{background:var(--u)}
.cell.G{background:var(--g)} .cell.Y{background:var(--y);color:#1d1600} .cell.R{background:var(--r)}
.rem{font-family:var(--mono);font-size:13px;word-break:break-word}
.tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.tag{font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;font-weight:600;padding:2px 7px;border-radius:3px;border:1px solid var(--line);color:var(--muted)}
.tag.ver{color:var(--ok-ink);border-color:currentColor}
.tag.qry{color:var(--bad-ink);border-color:currentColor}
.tag.ex{background:var(--ex-bg);color:var(--ex-ink);border-color:transparent}
.tag.old{color:var(--warn-ink);background:var(--warn-bg);border-color:transparent}
.empty{font-size:14px;color:var(--muted);padding:16px;border:1px dashed var(--line);border-radius:8px;text-align:center}
/* area */
.area{display:grid;gap:8px}
.arow{display:grid;grid-template-columns:150px 90px minmax(0,1fr) 170px;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:10px 14px}
@media (max-width:700px){.arow{grid-template-columns:1fr 1fr}.arow .stack{grid-column:1/-1}.arow .src{grid-column:1/-1}}
.worst{display:flex;align-items:center;gap:8px;font-weight:600}
.stack{display:flex;height:22px;border-radius:4px;overflow:hidden;background:var(--sunk)}
.stack span{display:block;height:100%}
.stack .mP{background:var(--mp)} .stack .mC{background:var(--mc)} .stack .mN{background:var(--line)} .stack .mU{background:var(--u)}
.dot.mP{background:var(--mp)} .dot.mC{background:var(--mc)} .dot.mN{background:var(--surface);border:1px solid var(--muted)} .dot.mU{background:var(--u)}
.stack .G{background:var(--g)} .stack .Y{background:var(--y)} .stack .R{background:var(--r)} .stack .U{background:var(--u)}
.src{font-family:var(--mono);font-size:12px;color:var(--muted)}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12.5px;color:var(--muted)}
.legend span{display:inline-flex;align-items:center;gap:6px}
/* net control */
table.roster{width:100%;border-collapse:collapse;font-size:14px}
table.roster td,table.roster th{padding:7px 8px;border-bottom:1px solid var(--line);text-align:left}
table.roster th{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
table.roster td.c{font-family:var(--mono)}
.st-ok{color:var(--ok-ink);font-weight:600} .st-late{color:var(--bad-ink);font-weight:600} .st-none{color:var(--muted)}
.scroll{overflow-x:auto}
.legend-line{font-family:var(--mono);font-size:12.5px;color:var(--muted)}

html{-webkit-text-size-adjust:100%}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
body{margin:0}
.login{min-height:100vh;display:grid;place-items:center;padding:24px 0}
.login-card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:24px;display:grid;gap:14px;width:min(380px,100%)}
.login-card h1{font-size:34px}
.conn{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:3px 8px;border-radius:999px;border:1px solid var(--line)}
.conn::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--u)}
.conn.on{color:var(--ok-ink)} .conn.on::before{background:var(--g)}
.conn.off{color:var(--bad-ink)} .conn.off::before{background:var(--r)}
.wide{margin-top:20px}
.prev{display:grid;gap:6px}
.call{font-family:var(--mono)}
a.btn{display:inline-flex;align-items:center;text-decoration:none}
.me{flex-wrap:wrap}

.pinout{border:2px solid var(--accent);border-radius:8px;padding:12px 14px;display:grid;gap:6px;background:var(--sunk)}
.pinout .big{font-family:var(--mono);font-size:26px;font-weight:500;letter-spacing:.14em}
td.pin{font-family:var(--mono);font-size:16px;letter-spacing:.1em}
.pend{color:var(--warn-ink);font-weight:600;font-size:13px}
#slips{display:none}
@media print{
  body{background:#fff;color:#000;padding:0}
  #app,#login,#pinchange{display:none!important}
  #slips{display:block}
  #slips h1{font:600 14px system-ui,sans-serif;margin:0 0 8px}
  #slips .sg{display:grid;grid-template-columns:1fr 1fr}
  #slips .slip{border:1px dashed #888;padding:10px 12px;break-inside:avoid;font-family:system-ui,sans-serif}
  #slips .t{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#444}
  #slips .c{font:600 20px ui-monospace,monospace}
  #slips .p b{font:600 20px ui-monospace,monospace;letter-spacing:.12em}
  #slips .i{font-size:10px;color:#444;margin-top:4px}
}
#imp-text{text-transform:none;font-family:var(--body)}

input[type=date]{font:inherit;color:var(--ink);background:var(--sunk);border:1px solid var(--line);border-radius:6px;padding:10px 11px;min-height:44px;width:100%}
.alert{background:var(--warn-bg);color:var(--warn-ink);border-left:5px solid var(--r);border-radius:6px;padding:10px 14px;font-size:14px}
table.act td{font-size:13.5px;vertical-align:top}
table.act td.t{font-family:var(--mono);white-space:nowrap;font-variant-numeric:tabular-nums}
table.act td.d{font-family:var(--mono);font-size:12.5px;color:var(--muted);word-break:break-word}
table.act tr.bad td{background:color-mix(in srgb, var(--r) 10%, transparent)}
table.act tr.new td{animation:flash 2s ease-out}
@keyframes flash{from{background:color-mix(in srgb, var(--accent) 25%, transparent)}to{background:transparent}}
@media (prefers-reduced-motion:reduce){table.act tr.new td{animation:none}}

.rs-item{border:1px solid var(--line);border-left:5px solid var(--accent);border-radius:6px;padding:8px 10px;display:grid;gap:6px;margin-bottom:6px}
.rs-item .l{font-family:var(--mono);font-size:12.5px;word-break:break-word}
.rs-item.done{opacity:.6;border-left-color:var(--line)}
.dotline{display:inline-flex;align-items:center;gap:6px}
