:root{
  --ink:#101619; --slate:#223138; --steel:#5A6B74; --paper:#E9EDEB; --card:#fff;
  --rule:#D0D8D5; --rule-hard:#8FA0A4; --hazard:#F2C300; --teal:#0E6E63; --teal-dk:#0A5148;
  --red:#A93520; --ok:#2E6B3F;
  --disp:"Barlow Condensed","Arial Narrow",sans-serif;
  --body:system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:ui-monospace,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:14px;line-height:1.45;padding-bottom:64px}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
button{cursor:pointer}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.hint{font-size:12px;color:var(--steel)}
[hidden]{display:none !important}

/* ---- sign-in gate ---- */
.gate{min-height:100vh;display:grid;place-items:center;background:var(--slate);padding:20px}
.gate-card{background:var(--card);border-top:5px solid var(--hazard);padding:34px 30px;max-width:380px;width:100%;text-align:center}
.gate-card h1{font-family:var(--disp);text-transform:uppercase;letter-spacing:.05em;font-size:30px;margin:0 0 4px}
.gate-sub{color:var(--steel);margin:0 0 22px}
.gate-error{background:#FBEAE6;border-left:3px solid var(--red);color:var(--red);padding:9px 11px;text-align:left;font-size:13px;margin:0 0 16px}

/* ---- header ---- */
header{background:var(--slate);color:#EFF3F1;border-bottom:3px solid var(--hazard);position:sticky;top:0;z-index:30}
.hd{max-width:1320px;margin:0 auto;padding:10px 18px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.hd h1{font-family:var(--disp);font-weight:700;font-size:24px;letter-spacing:.04em;text-transform:uppercase;margin:0;white-space:nowrap}
.jobpick{background:transparent;border:1px solid #47585F;color:var(--hazard);font-family:var(--disp);font-size:17px;letter-spacing:.05em;text-transform:uppercase;padding:4px 10px;display:flex;gap:8px;align-items:center;max-width:min(52vw,460px)}
.jobpick:hover{border-color:var(--hazard)}
.jobpick #jobLabel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.caret{opacity:.7;font-size:12px}
.rev{font-size:11px;color:#9DB0B4;font-family:var(--mono)}
.who{margin-left:auto;font-size:12px;color:#9DB0B4}
.linkbtn{background:none;border:0;color:#9DB0B4;text-decoration:underline;font-size:12px;padding:0}
.linkbtn:hover{color:#fff}
.tabs{max-width:1320px;margin:0 auto;padding:0 18px;display:flex;gap:2px}
.tab{background:#1A262C;border:0;color:#9DB0B4;font-family:var(--disp);text-transform:uppercase;letter-spacing:.06em;font-size:15px;padding:7px 18px}
.tab.on{background:var(--paper);color:var(--ink)}

main{max-width:1320px;margin:0 auto;padding:18px}

/* ---- cards ---- */
.card{background:var(--card);border:1px solid var(--rule);margin-bottom:16px}
.card>h2{font-family:var(--disp);text-transform:uppercase;letter-spacing:.06em;font-size:16px;margin:0;padding:9px 14px;background:#F4F7F5;border-bottom:1px solid var(--rule);display:flex;align-items:center;gap:10px}
.card>h2 .sub{font-family:var(--body);text-transform:none;letter-spacing:0;font-size:12px;color:var(--steel);font-weight:400}
.card>h2 .right{margin-left:auto;display:flex;gap:6px}
.cardbody{padding:12px 14px}
.empty{color:var(--steel);padding:16px 14px;font-size:13px}

/* ---- buttons ---- */
.btn{background:#fff;border:1px solid var(--rule-hard);padding:6px 12px;font-size:13px;white-space:nowrap}
.btn:hover{border-color:var(--slate)}
.btn.primary{background:var(--teal);border-color:var(--teal-dk);color:#fff}
.btn.primary:hover{background:var(--teal-dk)}
.btn.big{display:inline-block;padding:11px 20px;font-size:15px;text-decoration:none}
.btn.ghost{background:transparent}
.btn.danger{color:var(--red);border-color:#D8B6AE}
.btn.danger:hover{background:#FBEAE6}
.btn:disabled{opacity:.5;cursor:not-allowed}
.x{background:none;border:0;color:var(--steel);font-size:16px;line-height:1;padding:2px 5px}
.x:hover{color:var(--red)}

/* ---- fields ---- */
input[type=text],input[type=number],input[type=date],input[type=time],select,textarea{
  border:1px solid var(--rule-hard);background:#fff;padding:6px 8px;width:100%;border-radius:0}
input:focus,select:focus,textarea:focus{outline:2px solid var(--teal);outline-offset:-1px;border-color:var(--teal)}
textarea{resize:vertical;min-height:74px;line-height:1.5}
.fld{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--steel)}
.fld span{text-transform:uppercase;letter-spacing:.05em;font-size:11px}
.grid{display:grid;gap:12px}
.grid.two{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.grid.three{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}

/* ---- day sheet ---- */
.sheet{display:grid;grid-template-columns:236px 1fr;gap:16px;align-items:start}
@media (max-width:900px){.sheet{grid-template-columns:1fr}}
.rail{background:var(--card);border:1px solid var(--rule);position:sticky;top:96px}
.rail h2{font-family:var(--disp);text-transform:uppercase;letter-spacing:.06em;font-size:15px;margin:0;padding:9px 12px;background:#F4F7F5;border-bottom:1px solid var(--rule)}
.rail .days{max-height:52vh;overflow:auto}
.dayrow{display:flex;justify-content:space-between;gap:8px;width:100%;background:none;border:0;border-bottom:1px solid var(--rule);padding:8px 12px;text-align:left;font-size:13px}
.dayrow:hover{background:#F4F7F5}
.dayrow.on{background:var(--slate);color:#fff}
.dayrow.on .d-amt{color:var(--hazard)}
.dayrow .d-amt{color:var(--steel);font-size:12px}
.railadd{padding:10px 12px;border-top:1px solid var(--rule);display:flex;gap:6px}
.railadd input{flex:1}

/* ---- line tables ---- */
.tblwrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:13px}
th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--steel);font-weight:600;padding:6px 4px;border-bottom:1px solid var(--rule)}
td{padding:4px;border-bottom:1px solid #EDF1EF;vertical-align:middle}
th.num,td.num{text-align:right}
.crewtbl{min-width:1040px}
.crewtbl td:last-child{white-space:nowrap;text-align:right}
.crewtbl td:last-child .btn{font-size:11px;padding:3px 7px;letter-spacing:.02em}
.crewtbl td:last-child .x{font-size:15px;padding:2px 4px}
.crewtbl td,.crewtbl th{padding-left:5px;padding-right:5px}
.crewtbl th.num,.crewtbl td.num{min-width:54px}
.crewtbl select,.crewtbl input{padding:5px 6px}
.itemtbl{min-width:620px}
.calc{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--ink)}
.calc.zero{color:#AEBAB8}
.amt{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:600}
tr.ot .calc.ot,tr.ot .calc.prem{color:var(--red);font-weight:600}
.shift{display:inline-block;background:#E4EBE8;color:var(--steel);font-size:10px;letter-spacing:.04em;padding:1px 5px;margin-left:5px;vertical-align:middle}
.foot td{border-top:2px solid var(--ink);border-bottom:0;font-weight:700;padding-top:7px}

/* ---- item picker ---- */
.picker{position:relative}
.results{position:absolute;z-index:40;left:0;right:0;top:100%;background:#fff;border:1px solid var(--rule-hard);max-height:280px;overflow:auto;box-shadow:0 8px 20px rgba(16,22,25,.16)}
.results button{display:block;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid #EDF1EF;padding:7px 10px;font-size:13px}
.results button:hover,.results button.hi{background:#EAF2F0}
.results .r-price{color:var(--steel);font-size:12px;margin-left:6px}
.results .r-none{padding:10px;color:var(--steel);font-size:13px}

/* ---- jobs list ---- */
.jobs{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.jobcard{background:var(--card);border:1px solid var(--rule);border-left:4px solid var(--hazard);padding:13px 15px;text-align:left;width:100%}
.jobcard:hover{border-color:var(--slate);box-shadow:0 2px 8px rgba(16,22,25,.09)}
.jobcard h3{font-family:var(--disp);text-transform:uppercase;letter-spacing:.04em;font-size:18px;margin:0 0 3px}
.jobcard .meta{font-size:12px;color:var(--steel)}
.jobcard .fig{margin-top:8px;display:flex;gap:14px;font-family:var(--mono);font-size:13px}
.tag{display:inline-block;background:#E4EBE8;color:var(--steel);font-size:10px;text-transform:uppercase;letter-spacing:.06em;padding:1px 6px;margin-left:6px}

/* ---- report ---- */
.repgrid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.sumtbl td{padding:5px 4px}

/* ---- running total tape ---- */
.tape{position:fixed;left:0;right:0;bottom:0;background:var(--slate);color:#EFF3F1;border-top:3px solid var(--hazard);z-index:35}
.tape-in{max-width:1320px;margin:0 auto;padding:9px 18px;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.t-lab{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#9DB0B4}
.t-val{font-size:15px}
.t-val.strong{color:var(--hazard);font-size:17px;font-weight:700}
.t-sep{width:1px;height:15px;background:#47585F;margin:0 6px}
.t-status{margin-left:auto;font-size:12px;color:#9DB0B4;min-width:64px;text-align:right}
.t-status.saving{color:var(--hazard)}

/* ---- toast ---- */
.toast{position:fixed;bottom:74px;left:50%;transform:translateX(-50%) translateY(14px);background:var(--ink);color:#fff;padding:10px 18px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .18s,transform .18s;z-index:60;max-width:90vw}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.bad{background:var(--red)}

/* ---- modal ---- */
.modal{position:fixed;inset:0;background:rgba(16,22,25,.55);display:grid;place-items:center;z-index:50;padding:18px}
.modal-card{background:#fff;border-top:4px solid var(--hazard);max-width:520px;width:100%;max-height:86vh;overflow:auto}
.modal-card h2{font-family:var(--disp);text-transform:uppercase;letter-spacing:.05em;font-size:19px;margin:0;padding:12px 16px;border-bottom:1px solid var(--rule)}
.modal-body{padding:16px}
.modal-foot{padding:12px 16px;border-top:1px solid var(--rule);display:flex;gap:8px;justify-content:flex-end}