/* Rapid Builders — site system
   System fonts throughout: nothing to download on a bad 3G signal. */

:root{
  --paper:#F4F5F2; --card:#FFFFFF; --sunk:#EAECE7;
  --ink:#15191C; --ink-2:#4A5257; --ink-3:#767F85;
  --line:#DADED7; --line-2:#C6CCC3;
  --accent:#1E5266; --accent-soft:#E4EDF0; --accent-ink:#123847;
  --crit:#B0342A; --crit-soft:#F7E7E5;
  --warn:#8F6212; --warn-soft:#F8EFDD;
  --good:#2E6A4C; --good-soft:#E3F0E8;
  --shadow:0 1px 2px rgba(21,25,28,.06),0 8px 24px -12px rgba(21,25,28,.18);
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --tap:44px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#12161A; --card:#191E23; --sunk:#20262C;
    --ink:#E8ECEE; --ink-2:#A6B0B6; --ink-3:#7A858C;
    --line:#2A3138; --line-2:#3A424A;
    --accent:#7FB8CC; --accent-soft:#1B333D; --accent-ink:#BFDDE8;
    --crit:#E58279; --crit-soft:#3A2321;
    --warn:#DCAE5E; --warn-soft:#33291A;
    --good:#79C49E; --good-soft:#1B2F26;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px -12px rgba(0,0,0,.7);
  }
}
:root[data-theme="dark"]{
  --paper:#12161A; --card:#191E23; --sunk:#20262C;
  --ink:#E8ECEE; --ink-2:#A6B0B6; --ink-3:#7A858C;
  --line:#2A3138; --line-2:#3A424A;
  --accent:#7FB8CC; --accent-soft:#1B333D; --accent-ink:#BFDDE8;
  --crit:#E58279; --crit-soft:#3A2321;
  --warn:#DCAE5E; --warn-soft:#33291A;
  --good:#79C49E; --good-soft:#1B2F26;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px -12px rgba(0,0,0,.7);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--paper);color:var(--ink);font-family:var(--sans);
  font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;
  -webkit-text-size-adjust:100%;
}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:-.015em;text-wrap:balance}
h1{font-size:19px} h2{font-size:17px;margin-bottom:12px} h3{font-size:15px}
a{color:var(--accent)}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}

/* ---------- chrome ---------- */
.topbar{
  position:sticky;top:0;z-index:30;background:var(--card);border-bottom:1px solid var(--line);
  padding-top:env(safe-area-inset-top);
}
.topbar-in{max-width:1160px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:12px}
.brand{flex:1;min-width:0}
.brand .t{font-weight:700;font-size:15px;line-height:1.2}
.brand .s{font-size:11.5px;color:var(--ink-3);font-family:var(--mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.who{font-size:12px;color:var(--ink-3);text-align:right;line-height:1.3}
.who b{display:block;color:var(--ink-2);font-weight:600}

.tabs{background:var(--card);border-bottom:1px solid var(--line);overflow-x:auto;-webkit-overflow-scrolling:touch}
.tabs-in{max-width:1160px;margin:0 auto;display:flex;gap:2px;padding:0 8px}
.tabs button{
  font:inherit;font-size:13.5px;font-weight:600;border:0;background:transparent;color:var(--ink-3);
  padding:12px 14px;border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap;min-height:var(--tap);
}
.tabs button[aria-selected="true"]{color:var(--accent);border-bottom-color:var(--accent)}
.tabs .badge{
  display:inline-block;margin-left:6px;font-family:var(--mono);font-size:11px;
  background:var(--crit);color:#fff;border-radius:9px;padding:1px 6px
}
:root[data-theme="dark"] .tabs .badge,:root:not([data-theme="light"]) .tabs .badge{color:#160E0D}

.wrap{max-width:1160px;margin:0 auto;padding:16px 16px 96px}
.offline{background:var(--warn-soft);color:var(--warn);font-size:13px;padding:8px 16px;text-align:center;font-weight:600}
.queued{background:var(--accent-soft);color:var(--accent-ink);font-size:13px;padding:8px 16px;text-align:center}
:root[data-theme="dark"] .queued,:root:not([data-theme="light"]) .queued{color:var(--accent)}

/* ---------- banner ---------- */
.banner{
  background:var(--card);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);
  margin-bottom:16px;overflow:hidden;display:grid;gap:1px;
  grid-template-columns:repeat(auto-fit,minmax(104px,1fr));
}
.banner > div{background:var(--card);padding:14px 16px;box-shadow:0 0 0 1px var(--line)}
.banner > div:first-child{grid-column:1/-1}
@media (min-width:760px){
  .banner{grid-template-columns:minmax(250px,1.5fr) repeat(auto-fit,minmax(120px,1fr))}
  .banner > div:first-child{grid-column:auto}
}
.verdict{position:relative}
.verdict::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--good)}
.verdict.w::before{background:var(--warn)} .verdict.c::before{background:var(--crit)}
.verdict .k{font-weight:700;font-size:21px;line-height:1.2;letter-spacing:-.02em}
.verdict.w .k{color:var(--warn)} .verdict.c .k{color:var(--crit)}
.verdict .sub{font-size:13px;color:var(--ink-3);margin-top:5px;line-height:1.45}
.mk{font-weight:700;font-size:20px;line-height:1;letter-spacing:-.02em;font-family:var(--mono);font-variant-numeric:tabular-nums}
.mk.c{color:var(--crit)} .mk.w{color:var(--warn)}
.ml{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3);margin-top:6px;font-weight:600}

/* ---------- panels, cards ---------- */
.panel{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:16px;box-shadow:var(--shadow);margin-bottom:16px}
.panel-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.panel-head h2{margin:0;flex:1}
.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.spacer{flex:1}
.empty{padding:36px 16px;text-align:center;color:var(--ink-3);font-size:14px}
.lede{font-size:13.5px;color:var(--ink-3);margin:0 0 14px;line-height:1.55;max-width:75ch}

/* ---------- coverage calendar ---------- */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;max-width:460px}
.cal .hd{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);text-align:center;padding-bottom:2px}
.cal .d{
  height:40px;border-radius:5px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:12px;border:1px solid transparent;background:var(--sunk);color:var(--ink-3);
  cursor:default;padding:0;line-height:1.1
}
.cal button.d{cursor:pointer;font:inherit;font-family:var(--mono);font-size:12px}
.cal .d.pad{background:transparent}
.cal .d.done{background:var(--good-soft);color:var(--good);border-color:var(--good);font-weight:700}
.cal .d.miss{background:var(--crit-soft);color:var(--crit);border-color:var(--crit);font-weight:700}
.cal .d.today{outline:2px solid var(--accent);outline-offset:1px}
.cal .d .m{font-size:8px;letter-spacing:.03em;opacity:.85}
.legend{display:flex;flex-wrap:wrap;gap:14px;font-size:12.5px;color:var(--ink-3);margin-top:12px;align-items:center}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.chipbtn{
  font:inherit;font-size:12.5px;font-family:var(--mono);background:var(--crit-soft);color:var(--crit);
  border:1px solid transparent;border-radius:5px;padding:7px 10px;cursor:pointer;min-height:36px
}
.chipbtn:hover{border-color:var(--crit)}

/* ---------- entries ---------- */
.item{border:1px solid var(--line);border-radius:8px;background:var(--card);margin-bottom:10px;overflow:hidden}
.item-h{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:baseline;padding:13px 15px;cursor:pointer;min-height:var(--tap)}
.item-h:hover{background:var(--sunk)}
.item-d{font-family:var(--mono);font-size:14px;font-weight:700;white-space:nowrap}
.item-s{flex:1 1 200px;min-width:0;font-size:14px;color:var(--ink-2)}
.item-m{font-family:var(--mono);font-size:12px;color:var(--ink-3);white-space:nowrap}
.item-b{padding:0 15px 15px;border-top:1px solid var(--line)}
.dl{display:grid;grid-template-columns:1fr;gap:2px 14px;font-size:14px;margin-top:12px}
@media (min-width:640px){ .dl{grid-template-columns:140px 1fr;gap:8px 14px} }
.dl dt{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);font-weight:700;padding-top:3px}
.dl dd{margin:0 0 10px;white-space:pre-wrap}
@media (min-width:640px){ .dl dd{margin-bottom:0} }
.edited{font-size:12px;color:var(--ink-3);margin-top:12px;padding-top:10px;border-top:1px dashed var(--line)}

.pill{display:inline-block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  padding:3px 8px;border-radius:4px;white-space:nowrap;margin:0 4px 4px 0}
.p-crit{background:var(--crit-soft);color:var(--crit)}
.p-warn{background:var(--warn-soft);color:var(--warn)}
.p-good{background:var(--good-soft);color:var(--good)}
.p-mute{background:var(--sunk);color:var(--ink-3)}
.p-acc{background:var(--accent-soft);color:var(--accent-ink)}
:root[data-theme="dark"] .p-acc,:root:not([data-theme="light"]) .p-acc{color:var(--accent)}

.strip{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.strip img{width:96px;height:72px;object-fit:cover;border-radius:5px;border:1px solid var(--line-2);background:#fff;cursor:zoom-in}

/* ---------- table (wide screens) ---------- */
.tablewrap{background:var(--card);border:1px solid var(--line);border-radius:8px;overflow-x:auto;box-shadow:var(--shadow);margin-bottom:16px}
table{border-collapse:collapse;width:100%;min-width:640px}
th{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);
  text-align:left;padding:10px;border-bottom:1px solid var(--line);white-space:nowrap;background:var(--card)}
td{padding:11px 10px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:middle}
tbody tr:last-child td{border-bottom:0}
.rail{width:4px;padding:0!important;border-bottom:0!important}
.rail i{display:block;width:4px;height:100%;min-height:44px;background:var(--line-2)}
.r-crit i{background:var(--crit)} .r-warn i{background:var(--warn)} .r-good i{background:var(--good)}
.num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.nm{font-weight:600}
.sub{display:block;font-size:12.5px;color:var(--ink-3);margin-top:2px}

/* ---------- controls ---------- */
input,select,textarea{
  font:inherit;font-size:16px;background:var(--card);color:var(--ink);
  border:1px solid var(--line-2);border-radius:6px;padding:10px 12px;width:100%;min-height:var(--tap)
}
textarea{min-height:88px;resize:vertical;line-height:1.5}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:var(--accent)}
input[type=checkbox]{width:auto;min-height:0;accent-color:var(--accent)}
.btn{
  font:inherit;font-size:14.5px;font-weight:700;border:1px solid var(--line-2);background:var(--card);
  color:var(--ink);padding:11px 16px;border-radius:6px;cursor:pointer;min-height:var(--tap);width:auto
}
.btn:hover{border-color:var(--accent)}
.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.btn.pri{background:var(--accent);border-color:var(--accent);color:#fff}
:root[data-theme="dark"] .btn.pri,:root:not([data-theme="light"]) .btn.pri{color:#0E1418}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .btn.pri{color:#fff}}
.btn.danger{color:var(--crit)} .btn.danger:hover{border-color:var(--crit)}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.btn.sm{font-size:13px;padding:7px 11px;min-height:36px}
.search{flex:1 1 200px;max-width:340px}

/* ---------- forms ---------- */
.f{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.f > label{font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);font-weight:700}
.f .help{font-size:12.5px;color:var(--ink-3);line-height:1.45}
.grid2{display:grid;grid-template-columns:1fr;gap:0 12px}
.grid3{display:grid;grid-template-columns:1fr;gap:0 12px}
@media (min-width:560px){ .grid2{grid-template-columns:1fr 1fr} .grid3{grid-template-columns:1fr 1fr 1fr} }
.note{font-size:13px;color:var(--ink-3);background:var(--sunk);padding:11px 13px;border-radius:6px;line-height:1.5;margin-bottom:14px}
.warnbox{font-size:13px;color:var(--warn);background:var(--warn-soft);padding:11px 13px;border-radius:6px;line-height:1.5;margin-bottom:14px}
.critbox{font-size:13px;color:var(--crit);background:var(--crit-soft);padding:11px 13px;border-radius:6px;line-height:1.5;margin-bottom:14px}
.goodbox{font-size:13px;color:var(--good);background:var(--good-soft);padding:11px 13px;border-radius:6px;line-height:1.5;margin-bottom:14px}

.tradegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.trade{display:flex;align-items:center;gap:8px;background:var(--sunk);border-radius:6px;padding:6px 8px 6px 11px}
.trade span{flex:1;font-size:13px;color:var(--ink-2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trade input{width:58px;min-height:36px;padding:6px;text-align:center;font-family:var(--mono)}
.chipgrid{display:flex;flex-wrap:wrap;gap:7px}
label.chip{
  display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:20px;cursor:pointer;
  border:1px solid var(--line-2);background:var(--card);font-size:14px;color:var(--ink-2);
  text-transform:none;letter-spacing:normal;font-weight:400;min-height:var(--tap)
}
label.chip.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
:root[data-theme="dark"] label.chip.on,:root:not([data-theme="light"]) label.chip.on{color:var(--accent)}

/* checklist */
.cl{display:flex;flex-direction:column;gap:6px}
.clrow{display:flex;align-items:center;gap:10px;background:var(--sunk);border-radius:6px;padding:8px 10px;
  border:1px solid transparent;font-size:14px;flex-wrap:wrap}
.clrow.ok{background:var(--good-soft)}
.clrow.bad{background:var(--crit-soft);border-color:var(--crit)}
.clrow .t{flex:1 1 160px;color:var(--ink-2);min-width:0}
.clrow.ok .t,.clrow.bad .t{color:var(--ink)}
.tri{display:inline-flex;border:1px solid var(--line-2);border-radius:6px;overflow:hidden;background:var(--card)}
.tri button{font:inherit;font-size:13px;font-weight:700;border:0;background:transparent;color:var(--ink-3);
  padding:8px 12px;cursor:pointer;border-left:1px solid var(--line-2);min-height:38px}
.tri button:first-child{border-left:0}
.tri button[aria-pressed="true"]{color:#fff}
.tri button.y[aria-pressed="true"]{background:var(--good)}
.tri button.n[aria-pressed="true"]{background:var(--crit)}
.tri button.a[aria-pressed="true"]{background:var(--ink-3)}
:root[data-theme="dark"] .tri button[aria-pressed="true"],:root:not([data-theme="light"]) .tri button[aria-pressed="true"]{color:#0E1418}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .tri button[aria-pressed="true"]{color:#fff}}

/* photos in forms */
.phgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.ph{border:1px solid var(--line-2);border-radius:6px;overflow:hidden;background:var(--sunk);display:flex;flex-direction:column}
.ph img{display:block;width:100%;height:92px;object-fit:cover;background:#fff;cursor:zoom-in}
.ph input{border:0;border-top:1px solid var(--line-2);border-radius:0;font-size:13px;padding:7px 9px;min-height:38px}
.ph button{font:inherit;font-size:12px;border:0;border-top:1px solid var(--line-2);background:transparent;
  color:var(--crit);cursor:pointer;padding:7px;min-height:34px}
.filepick{border:1px dashed var(--line-2);background:var(--sunk);padding:14px;text-align:center;border-radius:6px}

/* ---------- sheet ---------- */
.scrim{position:fixed;inset:0;background:rgba(10,14,18,.5);display:flex;justify-content:flex-end;z-index:40}
.sheet{
  background:var(--paper);width:min(600px,100%);height:100%;overflow-y:auto;
  padding:20px 18px calc(24px + env(safe-area-inset-bottom));
  -webkit-overflow-scrolling:touch
}
.sheet h2{margin-bottom:6px}
.sheet-actions{
  display:flex;gap:8px;flex-wrap:wrap;margin-top:18px;position:sticky;bottom:0;
  background:var(--paper);padding:14px 0 0;border-top:1px solid var(--line)
}
.sheet-actions .btn{flex:1 1 auto}
.lbx{position:fixed;inset:0;background:rgba(8,11,14,.94);z-index:80;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:12px;padding:20px;cursor:zoom-out}
.lbx img{max-width:100%;max-height:calc(100% - 48px);object-fit:contain;background:#fff;border-radius:5px}
.lbx .cap{color:#E8ECEE;font-size:14px;text-align:center;max-width:60ch}

.toast{
  position:fixed;left:50%;transform:translateX(-50%);bottom:calc(22px + env(safe-area-inset-bottom));
  background:var(--ink);color:var(--paper);font-size:14px;padding:11px 18px;border-radius:8px;z-index:90;
  box-shadow:var(--shadow);max-width:calc(100% - 32px);text-align:center
}
.toast.bad{background:var(--crit);color:#fff}

/* ---------- sign in ---------- */
.signin{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px}
.signin-card{width:100%;max-width:400px;background:var(--card);border:1px solid var(--line);
  border-radius:10px;padding:28px 24px;box-shadow:var(--shadow)}
.signin-card h1{margin-bottom:4px}
.signin-card .s{font-size:13px;color:var(--ink-3);margin-bottom:22px}
footer{margin-top:24px;font-size:12.5px;color:var(--ink-3);line-height:1.6}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}