:root { color-scheme: light; --ink:#152230; --muted:#5c6f81; --cream:#f2f9ff; --green:#1f8fe0; --green-2:#0f6fb3; --line:#d3e6f5; --white:#fff; --gold:#ffcc33; }
* { box-sizing:border-box; }
body { margin:0; font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--ink); background:var(--cream); }
.topbar { min-height:68px; padding:12px clamp(18px,4vw,40px); display:flex; align-items:center; justify-content:space-between; gap:18px; color:white; background:var(--green); }
.brand-link { display:flex; align-items:center; gap:12px; color:white; text-decoration:none; }.brand-link img { width:116px; height:48px; object-fit:contain; }.brand-link span { opacity:.78; font-size:.78rem; }.topbar nav { display:flex; align-items:center; gap:18px; }.topbar nav a { color:white; text-decoration:none; font-size:.88rem; padding:9px 13px; border-radius:9px; }.topbar nav a.active { background:white; color:var(--green); font-weight:800; }.topbar nav .nav-primary { padding:7px 13px; border-radius:9px; border:2px solid white; background:transparent; color:white; font-weight:800; }.topbar nav .nav-primary.active { background:white; color:var(--green); }.topbar nav .nav-sep { width:1px; align-self:stretch; background:rgba(255,255,255,.32); margin:4px 0; }
.shell { width:min(980px,calc(100% - 28px)); margin:0 auto; padding:42px 0 72px; }
.intro { max-width:690px; margin-bottom:28px; }.eyebrow,.result-label { color:var(--green-2); font-size:.75rem; font-weight:800; letter-spacing:.14em; }
.dashboard-clock { display:flex; align-items:baseline; gap:.55rem; margin:.15rem 0 .75rem; color:var(--green-2); font-weight:800; }.dashboard-clock span:last-child { color:var(--muted); font-size:.8rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
h1 { margin:.25rem 0 .65rem; font-family:Georgia,"Times New Roman",serif; font-size:clamp(2rem,6vw,3.35rem); font-weight:500; line-height:1.05; }.intro p:last-child { color:var(--muted); line-height:1.55; }
.alert,.result-card,.quote-form { border:1px solid var(--line); border-radius:18px; background:var(--white); box-shadow:0 8px 28px rgba(23,77,56,.06); }
.alert { display:flex; flex-direction:column; gap:3px; margin:0 0 20px; padding:16px 18px; color:#872f24; border-color:#e7bcb5; background:#fff7f5; }
.result-card { display:grid; grid-template-columns:1fr 1.35fr; gap:24px; margin-bottom:22px; padding:24px; border-top:5px solid var(--gold); }.price { margin:3px 0; color:var(--green); font-size:clamp(2.6rem,8vw,4.2rem); font-weight:800; }.muted { margin:0; color:var(--muted); }
dl { margin:0; display:grid; grid-template-columns:1fr 1fr; gap:12px; }dl div { padding:12px; border-radius:12px; background:#f4f7f4; }dt { color:var(--muted); font-size:.75rem; }dd { margin:3px 0 0; font-weight:700; }.result-note { grid-column:1/-1; margin:0; padding-top:16px; border-top:1px solid var(--line); color:var(--muted); font-size:.86rem; }
.quote-form { overflow:hidden; }fieldset { margin:0; padding:24px; border:0; border-bottom:1px solid var(--line); }legend { width:100%; padding:0 0 15px; color:var(--green); font-family:Georgia,serif; font-size:1.35rem; }.field-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }.field { min-width:0; }.field-wide { grid-column:1/-1; }
label { display:block; margin-bottom:7px; font-size:.86rem; font-weight:700; }input,select { width:100%; min-height:48px; padding:11px 12px; border:1px solid #bfcac2; border-radius:10px; color:var(--ink); background:white; font:inherit; }input:focus,select:focus { outline:3px solid rgba(15,111,179,.15); border-color:var(--green-2); }select:disabled { color:var(--muted); background:#eef4f9; }small { display:block; margin-top:6px; color:var(--muted); font-size:.75rem; }
.postcode-coverage-message { margin-top:9px; padding:11px 13px; border:1px solid; border-radius:10px; font-size:.86rem; font-weight:700; line-height:1.4; }
.postcode-coverage-message.not-covered { color:#872f24; border-color:#e1a79e; background:#fff1ee; }
.postcode-coverage-message.covered { color:#175f42; border-color:#8fc8aa; background:#edf8f1; }
.postcode-coverage-message.covered-review { color:#765614; border-color:#e1c679; background:#fff9e8; }
.postcode-coverage-message.needs-checking { color:#765614; border-color:#e1c679; background:#fff9e8; }
button { width:calc(100% - 48px); margin:24px; min-height:54px; border:0; border-radius:12px; color:white; background:var(--green); font-size:1rem; font-weight:800; cursor:pointer; }button:hover { background:var(--green-2); }
.expired-flag { color:#b3261e; font-weight:800; }
.status-stepper { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }.status-step { padding:8px 14px; border-radius:999px; background:#eef1ee; color:var(--muted); font-size:.82rem; font-weight:700; }.status-step.done { background:#eaf3ee; color:var(--green-2); }.status-step.current { background:var(--green); color:white; }
.status-form { display:flex; gap:10px; align-items:center; }.status-form select { min-height:44px; padding:9px 12px; border:1px solid #bfcac2; border-radius:10px; font:inherit; }.status-form button { width:auto; min-height:44px; margin:0; padding:0 18px; }
.win-loss-heading { margin-top:20px; }
.compact { margin-bottom:20px; }.compact h1,.page-head h1 { font-size:clamp(2rem,5vw,3rem); }.stat-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:0 0 22px; }.stat-grid article { padding:22px; border:1px solid var(--line); border-radius:16px; background:white; }.stat-grid span { display:block; color:var(--muted); font-size:.82rem; }.stat-grid strong { display:block; margin-top:7px; color:var(--green); font-size:2rem; }.panel { margin-bottom:22px; padding:24px; border:1px solid var(--line); border-radius:18px; background:white; box-shadow:0 8px 28px rgba(23,77,56,.06); }.panel h2 { margin:0 0 14px; font-family:Georgia,serif; font-weight:500; }.panel-head,.page-head { display:flex; align-items:center; justify-content:space-between; gap:20px; }.page-head { margin-bottom:22px; }.page-head h1,.page-head p { margin:.2rem 0; }.panel-head a,.page-head a,table a,.empty a { color:var(--green-2); font-weight:700; }.action-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.action-grid a { min-height:120px; padding:18px; border:1px solid var(--line); border-radius:14px; color:var(--ink); text-decoration:none; background:#fbfcfa; }.action-grid a:not(.disabled):hover { border-color:var(--green-2); transform:translateY(-1px); }.action-grid b,.action-grid span { display:block; }.action-grid span { margin-top:8px; color:var(--muted); font-size:.84rem; line-height:1.45; }.action-grid .disabled { opacity:.58; }.table-wrap { overflow-x:auto; }table { width:100%; border-collapse:collapse; }th,td { padding:13px 10px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; }th { color:var(--muted); font-size:.75rem; text-transform:uppercase; letter-spacing:.06em; }.badge { display:inline-block; padding:5px 9px; border-radius:999px; color:var(--green); background:#eaf3ee; font-size:.74rem; font-weight:800; }.empty { color:var(--muted); }.button-link { display:inline-block; padding:12px 16px; border-radius:10px; color:white!important; background:var(--green); text-decoration:none; }.form-actions { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:24px; }.form-actions button { width:100%; margin:0; }.form-actions .secondary { color:var(--green); border:1px solid var(--green); background:white; }.detail-grid { display:grid; grid-template-columns:1.4fr 1fr; gap:22px; }.total-panel { display:flex; flex-direction:column; justify-content:center; background:var(--green); color:white; }.total-panel span,.total-panel small { opacity:.8; }.total-panel strong { margin:5px 0; font-size:2.7rem; }.details-list { display:grid; grid-template-columns:repeat(2,1fr); gap:0; }.details-list div { padding:12px; border-bottom:1px solid var(--line); }.details-list dt { color:var(--muted); }.details-list dd { margin:4px 0 0; }
@media (max-width:680px) { .shell{padding-top:28px}.result-card,.detail-grid{grid-template-columns:1fr}.field-grid,.stat-grid,.action-grid,.details-list{grid-template-columns:1fr}.field-wide{grid-column:auto}fieldset{padding:20px 16px}button{width:calc(100% - 32px);margin:20px 16px}dl{grid-template-columns:1fr}.topbar{min-height:60px;align-items:flex-start}.topbar nav{gap:10px;flex-wrap:wrap;justify-content:flex-end}.form-actions{grid-template-columns:1fr;padding:16px}.page-head{align-items:flex-end} }
.action-grid.four { grid-template-columns:repeat(4,1fr); }
.checker-form button,.service-search button { width:auto; min-width:150px; margin:18px 0 0; padding:0 22px; }
.coverage-result { display:grid; grid-template-columns:1.2fr 1fr; gap:24px; margin:0 0 22px; padding:24px; border:2px solid var(--line); border-radius:18px; background:white; }
.coverage-result.zone-1 { border-color:#76ad8d; }.coverage-result.zone-2,.coverage-result.zone-3 { border-color:var(--gold); }.coverage-result.zone-0 { border-color:#d88f83; }
.coverage-result h2 { margin:.2rem 0; font:500 2rem Georgia,serif; }.coverage-result p { color:var(--muted); line-height:1.5; }.coverage-result .button-link { grid-column:1/-1; width:max-content; }
.band-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }.band-grid article { padding:15px; border-radius:12px; background:#f4f7f4; }.band-grid b,.band-grid span { display:block; }.band-grid span { margin:5px 0; }
.service-search { display:flex; gap:10px; margin-bottom:22px; }.service-search input { flex:1; }.service-search button { margin:0; }
.service-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }.service-card { padding:22px; border:1px solid var(--line); border-radius:16px; color:var(--ink); text-decoration:none; background:white; box-shadow:0 8px 28px rgba(23,77,56,.05); }.service-card:hover { border-color:var(--green-2); }.service-card h2 { margin:12px 0 8px; font:500 1.55rem Georgia,serif; }.service-card p { color:var(--muted); line-height:1.5; }.service-card small { color:var(--green-2); font-weight:700; }.service-card .service-price { margin-top:8px; color:var(--gold-dark,#8a6d00); font-weight:800; }
.service-heading p { max-width:700px; color:var(--muted); line-height:1.5; }.service-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:22px; }.service-summary article { padding:20px; border-radius:15px; color:white; background:var(--green); }.service-summary span { color:#d9eadf; font-size:.75rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }.service-summary p { line-height:1.5; }
.price-tile-full { margin-bottom:22px; padding:14px 16px; border-radius:12px; background:var(--gold); color:var(--ink); }.price-tile-full > span { display:block; margin-bottom:8px; color:#6b5400; font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }.price-tile-full strong { font-size:1.3rem; }.price-tile-full small { display:block; margin-top:6px; color:#6b5400; }
.price-ladder { width:100%; border-collapse:collapse; }.price-ladder td { padding:6px 10px; border-right:1px solid rgba(0,0,0,.1); font-size:.86rem; white-space:nowrap; }.price-ladder td:last-child { border-right:0; }.price-ladder b { display:block; font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; opacity:.75; }
.guide-columns { display:grid; grid-template-columns:1fr 1fr; gap:20px; }.guide-list { margin:0; padding:0; list-style:none; }.guide-list li { position:relative; padding:10px 0 10px 25px; border-bottom:1px solid var(--line); line-height:1.45; }.guide-list li:before { content:'•'; position:absolute; left:7px; color:var(--green-2); font-weight:900; }.guide-list small { display:inline; color:#8b968e; }
.page-actions { display:flex; gap:12px; flex-wrap:wrap; }.secondary-link { color:var(--green)!important; border:1px solid var(--green); background:white; }.page-actions button.button-link { width:auto; margin:0; min-height:0; font-size:inherit; }
.quote-text-area { width:100%; min-height:220px; padding:14px; border:1px solid var(--line); border-radius:12px; font:inherit; font-size:.88rem; line-height:1.5; color:var(--ink); background:#fbfcfa; resize:vertical; }
@media (max-width:900px) { .action-grid.four,.band-grid{grid-template-columns:repeat(2,1fr)}.brand-link span{display:none}.topbar nav{gap:10px} }
@media (max-width:680px) { .coverage-result,.service-grid,.service-summary,.guide-columns{grid-template-columns:1fr}.service-search{display:block}.service-search button{width:100%;margin:10px 0 0}.band-grid{grid-template-columns:1fr}.brand-link img{width:90px;height:38px}.topbar{display:block}.topbar nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}.topbar nav a{display:flex;align-items:center;justify-content:center;min-height:38px;min-width:0;padding:8px 4px;font-size:.76rem;line-height:1.2;text-align:center;overflow-wrap:break-word}.topbar nav .nav-sep{display:none}.page-actions{display:grid}.action-grid.four{grid-template-columns:1fr} }

/* ---- home-screen app ----
   In standalone mode there is no Safari chrome, so the topbar sits under the
   notch and the page bottom under the home indicator unless we pad for both. */
.topbar { padding-top:calc(12px + env(safe-area-inset-top,0px)); padding-left:max(clamp(18px,4vw,40px),env(safe-area-inset-left,0px)); padding-right:max(clamp(18px,4vw,40px),env(safe-area-inset-right,0px)); }
.shell { padding-bottom:calc(72px + env(safe-area-inset-bottom,0px)); }
.nav-signout { opacity:.8; }

/* ---- sign-in and offline ---- */
.auth-body { min-height:100vh; min-height:100dvh; display:flex; background:var(--green); }
.auth-shell { width:min(420px,calc(100% - 32px)); margin:auto; padding:calc(32px + env(safe-area-inset-top,0px)) 0 calc(32px + env(safe-area-inset-bottom,0px)); }
.auth-logo { display:block; width:150px; height:auto; margin:0 auto 24px; }
.auth-card { padding:28px 24px calc(28px + env(safe-area-inset-bottom,0px)); border-radius:18px; background:var(--white); box-shadow:0 8px 28px rgba(23,77,56,.14); }
.auth-title { margin:.2rem 0 1.1rem; font-size:2rem; }
.auth-field { margin-bottom:16px; }
.auth-card button { width:100%; margin:8px 0 0; }
.auth-card .alert { margin-bottom:18px; }
.auth-card .muted { margin:0 0 20px; line-height:1.55; }

/* ---- WhatsApp quotes and bookings ---- */
.badge.urgent { color:#7a0016; background:#fbe2e5; }.badge.warn { color:#765614; background:#fff3cf; }.badge.good { color:#175f42; background:#e3f4ea; }.badge.muted { color:var(--muted); background:#eef1f4; }
.wa-list { display:grid; gap:10px; }
.wa-card { display:block; padding:14px 16px; border:1px solid var(--line); border-radius:14px; color:var(--ink); text-decoration:none; background:#fbfdff; }.wa-card:hover { border-color:var(--green-2); }
.wa-card-top { display:flex; align-items:center; justify-content:space-between; gap:10px; }.wa-card-line { margin-top:5px; font-size:.86rem; line-height:1.4; }.wa-card-line.muted { color:var(--muted); }
.wa-actions { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.wa-action { display:block; padding:14px 16px; border:1px solid var(--green); border-radius:12px; color:var(--green); font-weight:800; text-decoration:none; background:white; }.wa-action small { margin-top:4px; font-weight:500; }
.wa-action.primary { color:white; background:var(--green); }.wa-action.primary small { color:#e3f1fc; }.wa-action.danger { color:#b00020; border-color:#b00020; }
.chat { display:flex; flex-direction:column; gap:8px; }
.bubble { max-width:82%; padding:10px 13px; border-radius:14px; font-size:.9rem; line-height:1.45; white-space:pre-wrap; overflow-wrap:anywhere; }
.bubble.customer { align-self:flex-start; background:#eef1f4; border-bottom-left-radius:4px; }.bubble.luuba { align-self:flex-end; color:white; background:var(--green); border-bottom-right-radius:4px; }.bubble.note { align-self:center; max-width:94%; color:#765614; background:#fff3cf; font-size:.8rem; text-align:center; }
.eyebrow a { color:inherit; }
@media (max-width:680px) { .wa-actions{grid-template-columns:1fr}.bubble{max-width:92%} }

/* ---- app title ---- */
.brand-link .app-title { opacity:1; font-family:Georgia,"Times New Roman",serif; font-size:clamp(1.35rem,3vw,1.9rem); font-weight:700; line-height:1.1; letter-spacing:.01em; }
@media (max-width:900px) { .brand-link .app-title { display:inline; } }
@media (max-width:680px) { .brand-link { flex-direction:column; align-items:flex-start; gap:4px; } .brand-link .app-title { font-size:1.55rem; } .topbar nav { margin-top:14px; } }

/* ---- bookings ---- */
.booking-card.is-cancelled { opacity:.6; }.booking-card.is-cancelled b:first-child { text-decoration:line-through; }
.booking-card:target { border-color:var(--gold); box-shadow:0 0 0 3px rgba(255,204,51,.45); }
.cal-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }.cal-head h2 { margin:0; text-align:center; flex:1; }
.cal-nav { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border:1px solid var(--line); border-radius:12px; color:var(--green-2); font-size:1.6rem; text-decoration:none; }
.cal-today { margin:8px 0 0; text-align:center; font-size:.86rem; }.cal-today a { color:var(--green-2); font-weight:700; }
.calendar { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; margin-top:16px; }
.cal-dow { padding:4px 0; color:var(--muted); font-size:.7rem; font-weight:800; text-align:center; text-transform:uppercase; letter-spacing:.05em; }
.cal-day { min-height:84px; padding:5px; border:1px solid var(--line); border-radius:10px; background:#fbfdff; overflow:hidden; }
.cal-day.out { opacity:.4; }.cal-day.today { border:2px solid var(--green); }.cal-day.busy { background:#eaf4fd; }
.cal-num { display:block; font-size:.8rem; font-weight:800; }.cal-day.today .cal-num { color:var(--green); }
.cal-chip { display:block; margin-top:3px; padding:3px 5px; border-radius:6px; color:white; background:var(--green); font-size:.7rem; line-height:1.25; text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cal-chip.cancelled { color:var(--muted); background:#eef1f4; text-decoration:line-through; }
.cal-list-head { margin:22px 0 10px; font-family:Georgia,serif; font-weight:500; font-size:1.2rem; }
@media (max-width:680px) { .calendar{gap:2px}.cal-day{min-height:58px;padding:3px;border-radius:7px}.cal-chip{padding:2px 3px;font-size:.62rem}.cal-chip .cal-name{display:none} }

/* ---- clients ---- */
.client-filters { display:grid; grid-template-columns:2fr 1fr; gap:10px; }
.client-count { margin:12px 0 6px; font-size:.84rem; }
.client-table td small { display:block; margin-top:3px; color:var(--muted); font-size:.78rem; }
.client-table tr[hidden] { display:none; }
@media (max-width:680px) {
  .client-filters { grid-template-columns:1fr; }
  .client-table thead { display:none; }
  .client-table table, .client-table tbody, .client-table tr, .client-table td { display:block; width:100%; }
  .client-table tr { margin-bottom:10px; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:#fbfdff; }
  .client-table td { padding:4px 0; border:0; white-space:normal; display:flex; justify-content:space-between; gap:12px; text-align:right; }
  .client-table td::before { content:attr(data-label); color:var(--muted); font-size:.75rem; font-weight:700; text-align:left; }
  .client-table td[data-label="Client"] { display:block; text-align:left; font-size:1rem; }
  .client-table td[data-label="Client"]::before { content:none; }
  .client-table tr[hidden] { display:none; }
}

/* ---- booked-job photo consent and records ---- */
.photo-consent > p { color:var(--muted); line-height:1.5; }
.consent-badges { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
.permission-message { width:100%; min-height:130px; padding:12px; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:#f7fbfe; font:inherit; line-height:1.5; resize:vertical; }
.copy-permission { width:auto; min-height:42px; margin:8px 0 18px; }
.photo-permission-form { display:grid; grid-template-columns:1fr 1.5fr auto; gap:12px; align-items:end; padding-top:16px; border-top:1px solid var(--line); }
.photo-permission-form.two-consents { grid-template-columns:1fr 1fr 1.5fr auto; }
.photo-permission-form label { margin:0; }
.photo-permission-form input,.photo-permission-form select { margin-top:6px; }
.photo-permission-form button { width:auto; min-height:48px; margin:0; padding:0 18px; }
.photo-phase-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.photo-phase form { padding-bottom:18px; border-bottom:1px solid var(--line); }
.photo-phase input[type=file] { padding:9px; }
.photo-phase form button { width:100%; min-height:46px; margin:12px 0 0; }
.job-photo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:16px; }
.job-photo-grid a { min-width:0; color:var(--ink); text-decoration:none; }
.job-photo-grid img { display:block; width:100%; aspect-ratio:4/3; border-radius:10px; object-fit:cover; background:#eef4f9; }
.job-photo-grid span { display:block; margin-top:5px; font-size:.72rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.job-photo-grid .empty { grid-column:1/-1; }
.photo-locked { margin-top:0; }
@media (max-width:680px) {
  .photo-permission-form,.photo-permission-form.two-consents,.photo-phase-grid { grid-template-columns:1fr; }
  .consent-badges { justify-content:flex-start; }
  .photo-permission-form button { width:100%; }
}
.stat-link { color:inherit; text-decoration:none; }.stat-link article { height:100%; }.stat-link:hover article { border-color:var(--green-2); }

/* ---- dashboard numbers and client views ---- */
.numbers .panel-head { align-items:flex-start; }.numbers h2 { margin:.2rem 0 0; }
.period-form select { min-height:44px; min-width:170px; font-weight:700; }
.number-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:16px; }
.number-grid article { height:100%; padding:18px; border:1px solid var(--line); border-radius:14px; background:#fbfdff; }
.number-grid span { display:block; color:var(--muted); font-size:.82rem; font-weight:700; }.number-grid strong { display:block; margin:6px 0 4px; color:var(--green); font-size:2.2rem; }.number-grid small { margin:0; }
.numbers-note { margin:12px 0 0; font-size:.8rem; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.view-tabs { display:flex; gap:8px; margin:0 0 14px; }.view-tabs a { padding:10px 14px; border:1px solid var(--line); border-radius:999px; color:var(--green-2); font-weight:800; font-size:.88rem; text-decoration:none; background:white; }.view-tabs a.active { color:white; border-color:var(--green); background:var(--green); }
.client-count a { color:var(--green-2); font-weight:700; }
@media (max-width:900px) { .number-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:680px) { .numbers .panel-head { display:block; } .period-form { margin-top:10px; } .period-form select { width:100%; } .number-grid { grid-template-columns:1fr 1fr; gap:8px; } .number-grid article { padding:14px; } .number-grid strong { font-size:1.8rem; } }

/* ---- finances ---- */
.alert.ok { color:#175f42; border-color:#8fc8aa; background:#edf8f1; }
.split-bar { display:flex; height:14px; margin-top:16px; border-radius:999px; overflow:hidden; background:#e3f4ea; }
.split-bar span { display:block; height:100%; }.s-staff,.k-staff::before { background:#1f8fe0; }.s-mat,.k-mat::before { background:#ffcc33; }.s-fuel,.k-fuel::before { background:#b00020; }.k-profit::before { background:#e3f4ea; border:1px solid #8fc8aa; }
.split-key { display:flex; flex-wrap:wrap; gap:14px; margin:8px 0 0; font-size:.8rem; color:var(--muted); }.split-key span::before { content:''; display:inline-block; width:10px; height:10px; margin-right:5px; border-radius:3px; vertical-align:-1px; }
.fin-hint { margin:0 0 12px; font-size:.84rem; }
.fin-table td small { display:block; color:var(--muted); font-size:.75rem; }
.fin-settings { display:grid; grid-template-columns:repeat(3,1fr); gap:12px 16px; align-items:end; }
.fin-settings label { margin:0; font-size:.84rem; }.fin-settings input { margin-top:6px; }.fin-settings .wide { grid-column:1/-1; }
.fin-settings .check { display:flex; align-items:center; gap:8px; min-height:48px; }.fin-settings .check input { width:22px; min-height:22px; margin:0; }
.fin-settings button { grid-column:1/-1; width:100%; margin:6px 0 0; }
.fin-breakdown { width:100%; }.fin-breakdown td { padding:10px 0; white-space:normal; vertical-align:top; }.fin-breakdown td:last-child { text-align:right; font-weight:700; white-space:nowrap; padding-left:12px; }
.fin-breakdown small { display:block; margin-top:3px; color:var(--muted); font-size:.78rem; line-height:1.4; }.fin-breakdown tr.sum td { border-top:2px solid var(--ink); font-weight:800; }
@media (max-width:680px) { .fin-settings { grid-template-columns:1fr 1fr; } .fin-settings .check { grid-column:1/-1; } }
.total-panel small { color:#e3f1fc; opacity:1; }
@media (max-width:680px) {
  .client-table td[data-label="Job"] { display:block; text-align:left; font-size:1rem; }
  .client-table td[data-label="Job"]::before { content:none; }
  .fin-table td > span { text-align:right; }
}
.money-head { display:flex; align-items:baseline; justify-content:space-between; margin:20px 0 0; padding-top:16px; border-top:1px solid var(--line); }
.money-head h3 { margin:0; font-family:Georgia,serif; font-weight:500; font-size:1.2rem; }.money-head a { color:var(--green-2); font-weight:700; font-size:.86rem; }
.money-grid { grid-template-columns:repeat(3,1fr); margin-top:10px; }
.number-grid strong.m-low { color:#b00020; }.number-grid strong.m-thin { color:#8a6d00; }.number-grid strong.m-good { color:#1e7e34; }
@media (max-width:680px) { .money-grid { grid-template-columns:1fr 1fr; } .money-grid .stat-link:last-child { grid-column:1/-1; } }

/* ---- staff ---- */
.alert.warn-box { color:#765614; border-color:#e1c679; background:#fff9e8; }
.staff-row { display:grid; grid-template-columns:1.2fr 1fr auto 1.3fr; gap:10px 14px; align-items:end; padding:10px 0; border-bottom:1px solid var(--line); }
.staff-row label { margin:0; font-size:.84rem; }.staff-row input { margin-top:6px; }
.staff-row .check { display:flex; align-items:center; gap:8px; min-height:48px; white-space:nowrap; }.staff-row .check input { width:22px; min-height:22px; margin:0; }
.staff-form .add-row { width:auto; min-height:44px; margin:14px 0 6px; padding:0 18px; color:var(--green); border:1px solid var(--green); background:white; }
.staff-form button[type=submit] { width:100%; margin:10px 0 0; }
.staff-pick { margin-top:6px; padding:9px 14px; font-size:.86rem; }
.how { margin:0; padding-left:20px; line-height:1.55; }.how li { margin-bottom:8px; }
@media (max-width:680px) { .staff-row { grid-template-columns:1fr 1fr; } .staff-row .check { grid-column:1/-1; min-height:32px; } .staff-row .away { grid-column:1/-1; } }
.rules-form h3 { margin:18px 0 6px; font-size:1rem; }
.rules-table { width:100%; border-collapse:collapse; font-size:.9rem; }
.rules-table th { text-align:left; font-weight:600; color:var(--muted, #666); padding:4px 6px 4px 0; font-size:.8rem; }
.rules-table td { padding:4px 6px 4px 0; }
.rules-table td:first-child { width:22%; font-weight:600; }
.rules-table input { width:100%; min-height:40px; margin:0; text-align:center; }
.rules-form button[type=submit] { width:100%; margin:10px 0 0; }
.back-link { display:inline-flex; align-items:center; gap:4px; margin:0 0 10px; padding:8px 14px 8px 10px; border:1px solid var(--line); border-radius:999px; color:var(--green-2); background:white; font-weight:700; font-size:.9rem; text-decoration:none; }
.chat-list { display:flex; flex-direction:column; }
.chat-row { display:flex; gap:12px; padding:12px 4px; border-bottom:1px solid var(--line); color:inherit; text-decoration:none; }
.chat-row:hover { background:var(--cream); }
.chat-avatar { flex:0 0 42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:white; background:var(--green); font-weight:800; }
.chat-main { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.chat-top { display:flex; justify-content:space-between; gap:8px; }.chat-top small { color:var(--muted); white-space:nowrap; }
.chat-snippet { color:var(--muted); font-size:.88rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chat-tags { display:flex; flex-wrap:wrap; gap:6px; }
.bubble.jasmine { align-self:flex-end; color:white; background:#1e7e34; border-bottom-right-radius:4px; }
.bubble .who { display:block; font-size:.7rem; opacity:.8; font-weight:700; margin-bottom:2px; }
.chat-photo { display:block; max-width:100%; max-height:320px; margin-top:6px; border-radius:10px; }
.chat-file { display:inline-block; margin-top:6px; color:inherit; font-weight:700; }
.chat-reply textarea { width:100%; box-sizing:border-box; min-height:84px; font:inherit; padding:10px; border:1px solid var(--line); border-radius:10px; }
.chat-reply button { width:100%; margin:8px 0 0; }
.chat-buttons { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }.chat-buttons form { margin:0; }.chat-buttons button { width:auto; margin:0; }
#thread { max-height:65vh; overflow-y:auto; }
.job-pick select { width:100%; max-width:640px; }
.picked-job { margin-top:14px; }
.picked-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:10px; }
.picked-head small { display:block; color:var(--muted); margin-top:3px; }
@media (max-width:680px) { .picked-head { flex-direction:column; } }
.staff-row .away { margin:0; font-size:.84rem; }
.week-nav { display:flex; gap:8px; }
.net-grid { grid-template-columns:repeat(2,1fr); margin-top:10px; }
.oh-row { display:grid; grid-template-columns:2fr 1fr; gap:10px 14px; padding:8px 0; border-bottom:1px solid var(--line); }
.oh-row label { margin:0; font-size:.84rem; }
.oh-form .add-row { width:auto; min-height:44px; margin:14px 0 6px; padding:0 18px; color:var(--green); border:1px solid var(--green); background:white; }
.oh-form button[type=submit] { width:100%; margin:10px 0 0; }
.qr-chips { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; }
.qr-chip { width:auto; min-height:34px; margin:0; padding:4px 12px; border:1px solid var(--green); border-radius:999px; color:var(--green-2); background:white; font-size:.84rem; font-weight:700; }
.qr-row { display:grid; grid-template-columns:1fr 3fr; gap:10px 14px; padding:8px 0; border-bottom:1px solid var(--line); }
.qr-row label { margin:0; font-size:.84rem; }.qr-row textarea { width:100%; box-sizing:border-box; font:inherit; padding:8px; border:1px solid var(--line); border-radius:8px; }
.qr-form .add-row { width:auto; min-height:44px; margin:14px 0 6px; padding:0 18px; color:var(--green); border:1px solid var(--green); background:white; }
.qr-form button[type=submit] { width:100%; margin:10px 0 0; }
@media (max-width:680px) { .qr-row { grid-template-columns:1fr; } .qr-chip { width:auto; margin:0; } }
.plain-list { margin:0; padding-left:18px; line-height:1.6; }

/* ---- marketing outreach ---- */
.marketing-head-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.marketing-head-actions .button-link { white-space:nowrap; }
.secondary-link { color:var(--green-2)!important; border:1px solid var(--green); background:white; }
.marketing-stats { grid-template-columns:repeat(5,1fr); }
.marketing-stats article.attention { border-color:#e1c679; background:#fff9e8; }
.marketing-stats small { margin-top:6px; line-height:1.35; }
.marketing-filters { display:grid; grid-template-columns:2fr 1.25fr 1.25fr auto auto auto; gap:10px; align-items:center; }
.marketing-filters label { margin:0; }
.marketing-filters button { width:auto; min-height:48px; margin:0; padding:0 18px; }
.marketing-check { display:flex; align-items:center; gap:7px; min-height:48px; white-space:nowrap; }
.marketing-check input { width:20px; min-height:20px; margin:0; }
.clear-filter { color:var(--green-2); font-weight:800; }
.marketing-table td { vertical-align:top; }
.marketing-table td small { display:block; max-width:260px; margin-top:4px; overflow:hidden; color:var(--muted); font-size:.75rem; text-overflow:ellipsis; }
.quick-status { display:flex; gap:7px; align-items:center; }
.quick-status select { min-width:150px; min-height:40px; padding:7px 9px; font-size:.82rem; }
.quick-status button { width:auto; min-height:40px; margin:0; padding:0 12px; font-size:.82rem; }
.marketing-status.status-not-contacted { color:var(--muted); background:#eef1f4; }
.marketing-status.status-draft-prepared,.marketing-status.status-follow-up-due { color:#765614; background:#fff3cf; }
.marketing-status.status-replied,.marketing-status.status-interested,.marketing-status.status-meeting-booked,.marketing-status.status-quote-requested,.marketing-status.status-won { color:#175f42; background:#e3f4ea; }
.marketing-status.status-not-interested,.marketing-status.status-bounced,.marketing-status.status-do-not-contact { color:#872f24; background:#fff1ee; }
.candidate-status.status-new-applicant { color:var(--muted); background:#eef1f4; }
.candidate-status.status-contacted,.candidate-status.status-interview-booked { color:#765614; background:#fff3cf; }
.candidate-status.status-interviewed,.candidate-status.status-hired { color:#175f42; background:#e3f4ea; }
.candidate-status.status-not-suitable,.candidate-status.status-no-response,.candidate-status.status-withdrew { color:#872f24; background:#fff1ee; }
.marketing-detail textarea { width:100%; padding:11px 12px; border:1px solid #bfcac2; border-radius:10px; color:var(--ink); background:white; font:inherit; resize:vertical; }
.marketing-detail .form-actions a { display:flex; align-items:center; justify-content:center; }
.prospect-info dl { grid-template-columns:1fr; }
.prospect-info dd { white-space:pre-line; overflow-wrap:anywhere; }
.prospect-link { margin-top:14px; }
.prospect-info details { margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.prospect-info summary { color:var(--green-2); font-weight:800; cursor:pointer; }
.prospect-info details p { color:var(--muted); line-height:1.5; white-space:pre-line; overflow-wrap:anywhere; }
.activity-list article { display:flex; gap:12px; align-items:flex-start; padding:12px 0; border-bottom:1px solid var(--line); }
.activity-list article:last-child { border-bottom:0; }
.activity-list article div { flex:1; min-width:0; }
.activity-list article b { font-size:.82rem; }
.activity-list article p { margin:4px 0 0; color:var(--muted); line-height:1.4; overflow-wrap:anywhere; }
@media (max-width:900px) { .marketing-stats { grid-template-columns:repeat(3,1fr); } .marketing-filters { grid-template-columns:1fr 1fr; } }
@media (max-width:680px) {
  .marketing-head-actions { justify-content:flex-start; }
  .marketing-stats { grid-template-columns:1fr 1fr; }
  .marketing-filters { grid-template-columns:1fr; }
  .marketing-table thead { display:none; }
  .marketing-table table,.marketing-table tbody,.marketing-table tr,.marketing-table td { display:block; width:100%; }
  .marketing-table tr { margin-bottom:12px; padding:12px; border:1px solid var(--line); border-radius:12px; background:#fbfdff; }
  .marketing-table td { padding:5px 0; border:0; white-space:normal; display:flex; justify-content:space-between; gap:12px; text-align:right; }
  .marketing-table td::before { content:attr(data-label); color:var(--muted); font-size:.75rem; font-weight:700; text-align:left; }
  .marketing-table td[data-label="Company"] { display:block; text-align:left; font-size:1rem; }
  .marketing-table td[data-label="Company"]::before { content:none; }
  .quick-status { justify-content:flex-end; }
  .quick-status select { min-width:0; }
}

/* ---- document library ---- */
.document-jump { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 18px; }
.document-jump a { padding:9px 13px; border:1px solid var(--line); border-radius:999px; color:var(--green-2); background:white; font-size:.84rem; font-weight:800; text-decoration:none; }
.document-group { scroll-margin-top:90px; }
.document-group .panel-head p { margin:.25rem 0 0; }
.document-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.document-card { display:flex; min-width:0; flex-direction:column; padding:18px; border:1px solid var(--line); border-radius:14px; background:#fbfdff; scroll-margin-top:90px; }
.document-card h3 { margin:0 0 6px; color:var(--green); font-size:1.05rem; }
.document-card p { margin:0 0 8px; color:var(--muted); line-height:1.45; }
.document-source { display:block; overflow-wrap:anywhere; color:var(--muted); font-size:.72rem; }
.document-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:auto; padding-top:14px; }
.document-actions .button-link { width:auto; min-height:42px; margin:0; padding:10px 14px; }
.document-unavailable { display:inline-flex; align-items:center; padding:8px 10px; border-radius:8px; color:var(--muted); background:#eef1f2; font-size:.78rem; font-weight:700; }
.edit-request { margin-top:14px; padding-top:12px; border-top:1px solid var(--line); }
.edit-request summary { color:var(--green-2); font-weight:800; cursor:pointer; }
.edit-request form { margin-top:12px; }
.edit-request label { font-size:.84rem; }
.edit-request textarea { width:100%; box-sizing:border-box; margin-top:6px; padding:10px; border:1px solid var(--line); border-radius:9px; font:inherit; resize:vertical; }
.edit-request button { width:100%; margin:10px 0 7px; }
.edit-request small { color:var(--muted); line-height:1.4; }
.document-request-list article { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid var(--line); }
.document-request-list article:last-child { border-bottom:0; }
.document-request-list p { margin:4px 0; white-space:pre-wrap; }
.document-request-list small { color:var(--muted); }
.version-history { margin-top:14px; padding-top:12px; border-top:1px solid var(--line); }
.version-history > summary,.version-status-form > summary { color:var(--green-2); font-weight:800; cursor:pointer; }
.version-note { margin:10px 0; padding:9px 11px; border-radius:9px; color:#60480c!important; background:#fff9e8; font-size:.8rem; }
.version-list { display:grid; gap:10px; }
.version-row { padding:12px; border:1px solid var(--line); border-radius:10px; background:white; }
.version-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.version-head b,.version-head small { display:block; }.version-head small { margin-top:2px; color:var(--muted); }
.version-row > p { margin:8px 0; font-size:.82rem; white-space:pre-wrap; }
.version-approval { padding:8px 10px; border-left:3px solid var(--green); color:var(--ink)!important; background:#edf8f1; }
.version-actions { display:flex; flex-wrap:wrap; gap:12px; }.version-actions a { color:var(--green-2); font-size:.8rem; font-weight:800; }
.badge.version-approved,.badge.version-signed_off { color:#175f42; background:#dff2e7; }.badge.version-superseded { color:#5d6870; background:#e9eef1; }.badge.version-draft { color:#765614; background:#fff1bf; }
.version-status-form { margin-top:10px; padding-top:9px; border-top:1px dashed var(--line); }
.version-status-form form { margin-top:10px; }.version-status-form label { margin-top:9px; font-size:.78rem; }.version-status-form input,.version-status-form select,.version-status-form textarea { margin-top:5px; }.version-status-form textarea { width:100%; box-sizing:border-box; padding:9px; border:1px solid var(--line); border-radius:8px; font:inherit; }.version-status-form button { width:100%; margin:10px 0 6px; }.version-status-form small { color:var(--muted); line-height:1.4; }
.version-approval-fields { display:grid; grid-template-columns:1.5fr 1fr; gap:10px; }
.pdf-view-head { align-items:flex-end; }.pdf-view-actions { display:flex; flex-wrap:wrap; gap:8px; }.pdf-view-actions .button-link { width:auto; margin:0; }
.pdf-view-panel { padding:10px; }.pdf-view-panel iframe { display:block; width:100%; height:calc(100vh - 245px); min-height:620px; border:0; border-radius:9px; background:#eef3f5; }.pdf-fallback { margin:10px 8px 4px; color:var(--muted); font-size:.8rem; }
@media (max-width:760px) { .document-grid { grid-template-columns:1fr; } .document-request-list article { flex-direction:column; } }
@media (max-width:760px) { .version-approval-fields { grid-template-columns:1fr; }.pdf-view-head { align-items:flex-start; }.pdf-view-actions { width:100%; }.pdf-view-actions .button-link { flex:1; text-align:center; }.pdf-view-panel iframe { height:70vh; min-height:480px; } }

/* ---- cleaning checklists ---- */
.onboarding-start { border-top:4px solid var(--green); }
.onboarding-fields { display:grid; grid-template-columns:2fr 1fr 2fr; gap:14px; margin-top:16px; }
.onboarding-fields label { margin:0; }
.onboarding-fields input { margin-top:7px; }
.compact-fields { padding-top:16px; border-top:1px solid var(--line); }
.onboarding-warning ul { margin:10px 0 0; padding-left:20px; line-height:1.55; }
.onboarding-summary { width:100%; min-width:680px; border-collapse:collapse; }
.onboarding-summary th,.onboarding-summary td { padding:9px 8px; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; }
.onboarding-summary th { color:var(--muted); font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; }
.onboarding-summary input,.onboarding-summary select { min-height:40px; margin:0; }
.staff-onboarding-form { margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }
.staff-onboarding-form h3,.staff-documents h3 { margin:20px 0 8px; color:var(--green-2); }
.staff-details-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px 14px; }
.staff-details-grid label,.staff-document-upload label { margin:0; }
.staff-details-grid input,.staff-details-grid select,.staff-details-grid textarea,.staff-onboarding-form > label textarea,.staff-document-upload input,.staff-document-upload select { margin-top:7px; }
.staff-details-grid textarea,.staff-onboarding-form textarea { width:100%; box-sizing:border-box; padding:10px; border:1px solid var(--line); border-radius:8px; font:inherit; }
.staff-onboarding-form > button,.staff-document-upload > button { width:100%; margin-top:14px; }
.staff-documents { margin-top:24px; padding-top:18px; border-top:1px solid var(--line); }
.staff-document-upload { display:grid; grid-template-columns:1fr 2fr; gap:12px 14px; align-items:end; }
.staff-document-upload > button,.staff-document-upload > p { grid-column:1/-1; }
.staff-upload-hint { margin-top:18px; }
.quality-form h3 { margin:22px 0 8px; color:var(--green-2); }
.quality-items { display:grid; gap:10px; }
.quality-item { display:grid; grid-template-columns:2fr 1fr 2fr; gap:12px; align-items:end; padding:12px; border:1px solid var(--line); border-radius:12px; background:#fbfcfa; }
.quality-item p { align-self:center; margin:0; font-weight:700; line-height:1.4; }
.quality-item label { margin:0; font-size:.82rem; }
.quality-item input,.quality-item select { margin-top:6px; }
.quality-meta { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:14px 0; }
.quality-meta label { margin:0; }
.quality-meta input,.quality-meta select,.quality-meta textarea { margin-top:7px; }
.quality-meta textarea,#customer-followup textarea { width:100%; box-sizing:border-box; padding:10px; border:1px solid var(--line); border-radius:8px; font:inherit; }
.quality-actions label:first-child,.quality-actions label:nth-child(2) { grid-column:span 1; }
.quality-review-check { display:flex; align-items:center; gap:10px; padding-top:28px; font-weight:700; }
.quality-review-check input { width:22px; min-height:22px; margin:0; }
.quality-live-score { margin:14px 0; padding:12px 14px; border:1px solid #e1c679; border-radius:10px; color:#60480c; background:#fff9e8; font-weight:800; }
.quality-live-score.complete { border-color:#8fc8aa; color:var(--green); background:#eaf3ee; }
.quality-live-score.failed { border-color:#df9b9b; color:#8b1e1e; background:#fff0f0; }
.check-signoff textarea { width:100%; box-sizing:border-box; margin-top:7px; padding:10px; border:1px solid var(--line); border-radius:8px; font:inherit; }
.checklist-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:0 0 18px; padding:14px 16px; border:1px solid var(--line); border-radius:14px; background:white; }
.checklist-toolbar > span { color:var(--green-2); font-weight:800; }
.checklist-toolbar > div { display:flex; gap:8px; }
.checklist-toolbar .button-link { width:auto; min-height:42px; margin:0; padding:10px 14px; font-size:.84rem; }
.checklist-section h2 { padding-bottom:10px; border-bottom:1px solid var(--line); }
.check-items { display:grid; gap:2px; }
.check-item { display:flex; align-items:flex-start; gap:12px; margin:0; padding:12px 4px; border-bottom:1px solid var(--line); font-size:.94rem; font-weight:600; line-height:1.45; cursor:pointer; }
.check-item:last-child { border-bottom:0; }
.check-item input { flex:0 0 24px; width:24px; min-height:24px; margin:0; accent-color:var(--green); }
.check-item input:checked + span { color:var(--muted); text-decoration:line-through; }
.check-exclusions { margin-bottom:22px; padding:18px 20px; border:1px solid #e1c679; border-left:5px solid var(--gold); border-radius:14px; color:#60480c; background:#fff9e8; }
.check-exclusions strong { display:block; margin-bottom:6px; color:#765614; }
.check-exclusions p { margin:0; line-height:1.55; }
.check-signoff > div { display:grid; grid-template-columns:2fr repeat(3,1fr); gap:14px; }
.check-signoff label { margin:0; }
.check-signoff input { margin-top:7px; }
@media (max-width:680px) {
  .onboarding-fields { grid-template-columns:1fr; }
  .staff-details-grid,.staff-document-upload { grid-template-columns:1fr; }
  .quality-item,.quality-meta { grid-template-columns:1fr; }
  .quality-review-check { padding-top:0; }
  .checklist-toolbar { align-items:flex-start; flex-direction:column; }
  .checklist-toolbar > div { width:100%; }
  .checklist-toolbar .button-link { flex:1; text-align:center; }
  .check-signoff > div { grid-template-columns:1fr; }
}
@media print {
  .topbar,.back-link,.checklist-toolbar,.page-head > a { display:none!important; }
  body,.shell { background:white; }
  .shell { width:100%; padding:0; }
  .page-head { margin-bottom:12px; }
  .panel,.check-exclusions { break-inside:avoid; box-shadow:none; }
}

/* ---- checklists attached to booked jobs ---- */
.booking-checklist-link { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-top:10px; padding-top:10px; border-top:1px solid var(--line); }
.booking-checklist-link a { color:var(--green-2); font-weight:800; text-decoration:none; }
.booking-checklist-link small { margin:0; text-align:right; }
.complaint-stats { margin-bottom:22px; }
.complaint-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:16px; }
.complaint-toolbar > div { display:flex; gap:6px; }
.complaint-toolbar > div a { padding:8px 11px; border-radius:9px; color:var(--muted); font-weight:800; text-decoration:none; }
.complaint-toolbar > div a.active { color:white; background:var(--green); }
.complaint-toolbar form { display:flex; gap:8px; margin:0; }
.complaint-toolbar input { min-width:260px; margin:0; }
.complaint-toolbar button { width:auto; margin:0; }
.complaint-list { display:grid; gap:10px; }
.complaint-row { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:16px; border:1px solid var(--line); border-radius:12px; color:var(--ink); background:#fbfcfa; text-decoration:none; }
.complaint-row:hover { border-color:var(--green); }
.complaint-row h2 { display:inline; margin:0 8px; font-size:1rem; }
.complaint-row p { margin:8px 0 4px; }.complaint-row small { color:var(--muted); }
.badge.complaint-open,.badge.complaint-investigating,.badge.complaint-awaiting_customer,.badge.complaint-remedy_agreed { color:#765614; background:#fff1bf; }
.badge.complaint-resolved,.badge.complaint-closed { color:#175f42; background:#dff2e7; }
.badge.danger { color:#8b1e1e; background:#ffe1e1; }
.complaint-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:14px 0; }
.complaint-fields label { margin:0; }.complaint-fields input,.complaint-fields select { margin-top:7px; }
.complaint-form textarea { width:100%; box-sizing:border-box; margin-top:7px; padding:10px; border:1px solid var(--line); border-radius:8px; font:inherit; }
.complaint-form > .panel > button { width:100%; margin-top:16px; }
.complaint-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:22px; }
.complaint-summary-grid article { padding:16px; border:1px solid var(--line); border-radius:12px; background:white; }
.complaint-summary-grid span,.complaint-summary-grid strong { display:block; }.complaint-summary-grid span { color:var(--muted); font-size:.78rem; }.complaint-summary-grid strong { margin-top:5px; }
.complaint-report { white-space:pre-wrap; line-height:1.55; }
.complaint-contact { display:flex; flex-wrap:wrap; gap:10px 18px; margin-top:14px; padding-top:12px; border-top:1px solid var(--line); color:var(--muted); }
.complaint-links { display:grid; gap:8px; }.complaint-links a { display:flex; justify-content:space-between; gap:12px; padding:11px 12px; border:1px solid var(--line); border-radius:9px; text-decoration:none; }.complaint-links span { color:var(--muted); }
.complaint-photo-form { display:grid; grid-template-columns:1fr 1fr; gap:12px 14px; align-items:end; }
.complaint-photo-form label { margin:0; }.complaint-photo-form input { margin-top:7px; }
.complaint-photo-form small,.complaint-photo-form button { grid-column:1/-1; }.complaint-photo-form button { width:100%; margin:0; }
.complaint-photo-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; margin-top:18px; }
.complaint-photo-grid a { display:flex; flex-direction:column; gap:5px; padding:8px; border:1px solid var(--line); border-radius:10px; color:var(--ink); text-decoration:none; }
.complaint-photo-grid img { width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:7px; background:#eef3f5; }
.complaint-photo-grid b,.complaint-photo-grid span,.complaint-photo-grid small { overflow-wrap:anywhere; }.complaint-photo-grid span,.complaint-photo-grid small { color:var(--muted); font-size:.74rem; }
.booking-context p { margin:0; color:var(--muted); }
.job-check-item { padding:4px 0 10px; border-bottom:1px solid var(--line); }
.job-check-item:last-child { border-bottom:0; }
.job-check-item .check-item { border-bottom:0; }
.skip-reason { margin:0 4px 4px 40px; color:var(--muted); font-size:.76rem; font-weight:700; }
.skip-reason span { display:block; margin-bottom:5px; }
.skip-reason input { min-height:40px; padding:8px 10px; font-size:.84rem; }
.job-checklist-form .checklist-toolbar button { width:auto; }
.check-complete-note { margin:16px 0 0; padding:12px 14px; border-radius:10px; color:#175f42; background:#edf8f1; font-weight:800; }
.sticky-save { position:sticky; bottom:calc(8px + env(safe-area-inset-bottom,0px)); z-index:3; margin-top:18px; padding:10px; border:1px solid var(--line); border-radius:14px; background:rgba(255,255,255,.95); box-shadow:0 8px 28px rgba(23,77,56,.14); backdrop-filter:blur(8px); }
.sticky-save button { width:100%; min-height:48px; margin:0; }
@media (max-width:680px) {
  .complaint-toolbar { align-items:stretch; flex-direction:column; }
  .complaint-toolbar form { display:grid; grid-template-columns:1fr auto; }
  .complaint-toolbar input { min-width:0; }
  .complaint-fields,.complaint-summary-grid { grid-template-columns:1fr; }
  .complaint-photo-form { grid-template-columns:1fr; }
  .complaint-row,.complaint-links a { align-items:flex-start; flex-direction:column; }
  .booking-checklist-link { align-items:flex-start; flex-direction:column; gap:4px; }
  .booking-checklist-link small { text-align:left; }
  .job-checklist-form .checklist-toolbar > div { display:grid; grid-template-columns:1fr 1fr; }
}

/* Compact menu (27 Sep 2026): small wrapping chips under the logo instead of one very wide row / tall phone grid. */
.topbar { flex-wrap:wrap; align-items:center; row-gap:10px; }
.topbar nav { flex:1 1 100%; flex-wrap:wrap; gap:6px; justify-content:flex-start; min-width:0; }
.topbar nav a { font-size:.8rem; padding:6px 10px; border-radius:8px; line-height:1.2; }
.topbar nav .nav-primary { padding:4px 10px; }
.topbar nav .nav-sep { margin:4px 2px; }
@media (max-width:680px) {
  .topbar nav { display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-start; margin-top:12px; }
  .topbar nav a { display:inline-flex; min-height:32px; padding:6px 10px; font-size:.78rem; background:rgba(255,255,255,.12); }
  .topbar nav a.active, .topbar nav .nav-primary.active { background:white; }
  .topbar nav .nav-primary { background:transparent; }
}

/* Refresh button, same look as the ATLAS Command Centre one. */
.intro:has(.date-row) { max-width:840px; }
.date-row { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.date-row h1 { margin-bottom:.2rem; }
.refresh-btn { display:inline-flex; align-items:center; gap:7px; flex:none; margin-top:.5rem; padding:6px 12px; min-height:36px; border-radius:11px;
  color:var(--green-2); font-size:.85rem; font-weight:700; text-decoration:none; background:transparent; box-shadow:inset 0 0 0 1.5px var(--line); }
.refresh-btn:hover { background:#e6f2fc; }
.refresh-btn svg { width:17px; height:17px; }
/* Back + Refresh row at the top of every page except the dashboard (which has Refresh beside the date). */
.page-tools { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 10px; }
.page-tools .back-link, .page-tools .refresh-btn { margin:0; }
@media print { .page-tools { display:none!important; } }
/* Marketing summary tiles are filters; the chosen one is outlined. */
.marketing-stats .stat-link.selected article { border-color:var(--green-2); box-shadow:inset 0 0 0 1px var(--green-2); }

/* Before day one panel (per staff record) */
.prestart { margin-top:26px; padding-top:18px; border-top:1px solid var(--line); }
.prestart-card { margin:12px 0; padding:16px; border:1px solid var(--line); border-radius:14px; background:#fbfdff; }
.prestart-card.is-done { background:#f3faf6; border-color:#cfe8da; }
.prestart-top { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.prestart-top h3 { margin:0; font-size:1rem; }
.prestart-links { display:flex; flex-wrap:wrap; gap:8px; margin:10px 0; }
.prestart-links a { padding:6px 10px; border:1px solid var(--line); border-radius:9px; background:white; color:var(--green-2); font-size:.84rem; font-weight:700; text-decoration:none; }
.prestart-form .staff-details-grid { margin-top:10px; }
.prestart-form label small { display:block; margin-top:4px; font-weight:400; }
.prestart-actions { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:12px; }
.prestart-actions button { width:auto; margin:0; }
.prestart-actions .secondary, .prestart-done .secondary { color:var(--green); border:1px solid var(--green); background:white; }
.prestart-files { list-style:none; margin:12px 0 0; padding:0; }
.prestart-files li { display:flex; justify-content:space-between; gap:10px; padding:8px 0; border-top:1px solid var(--line); }
.prestart-files a { margin-left:10px; color:var(--green-2); font-weight:700; }
.prestart-done { margin-top:10px; }
.prestart-done button { width:auto; margin:0; }
.link-button { background:none!important; border:0!important; color:var(--green-2)!important; padding:0!important; text-decoration:underline; min-height:0!important; }
.small-note { font-size:.84rem; margin:6px 0; }
@media (max-width:680px) { .prestart-card { padding:12px; } .prestart-actions button, .prestart-done button { width:100%; } .prestart-files li { flex-direction:column; } }
@media print { .prestart { display:none!important; } }
.prestart [hidden] { display:none!important; }

/* Onboarding sections 1-6: tap the headline to open the detail. */
details.checklist-section { padding:0; }
details.checklist-section > summary { display:flex; align-items:center; gap:12px; padding:18px 22px; cursor:pointer; list-style:none; }
details.checklist-section > summary::-webkit-details-marker { display:none; }
details.checklist-section > summary h2 { flex:1; margin:0; padding:0; border:0; font-size:1.25rem; }
details.checklist-section .section-count { padding:4px 10px; border-radius:999px; background:#eaf3fb; color:var(--green-2); font-size:.78rem; font-weight:800; white-space:nowrap; }
details.checklist-section .section-count.complete { background:#e3f4ea; color:#1d7a4a; }
details.checklist-section .section-chevron { font-size:1.5rem; line-height:1; color:var(--green-2); transition:transform .15s; }
details.checklist-section[open] .section-chevron { transform:rotate(90deg); }
details.checklist-section[open] > summary { border-bottom:1px solid var(--line); }
details.checklist-section .section-body { padding:16px 22px 22px; }
@media (max-width:680px) { details.checklist-section > summary { padding:14px 16px; } details.checklist-section > summary h2 { font-size:1.05rem; } details.checklist-section .section-body { padding:12px 16px 16px; } }

/* Drop-down panels (Insurance, DBS tracker, sign-offs) share the checklist-section look. */
details.fold-panel { padding:0; }
details.fold-panel > summary { display:flex; align-items:center; gap:12px; padding:18px 22px; cursor:pointer; list-style:none; }
details.fold-panel > summary::-webkit-details-marker { display:none; }
details.fold-panel > summary h2 { flex:1; margin:0; padding:0; border:0; font-size:1.25rem; }
details.fold-panel[open] > summary { border-bottom:1px solid var(--line); }
details.fold-panel[open] .section-chevron, details.prestart-card[open] > summary .section-chevron { transform:rotate(90deg); }
details.fold-panel > .section-body { padding:16px 22px 22px; }
.section-chevron { font-size:1.5rem; line-height:1; color:var(--green-2); transition:transform .15s; }

/* Staff record sub-sections (Personal details, Home address, ...) and Documents. */
details.fold { margin:10px 0; border:1px solid var(--line); border-radius:12px; background:white; }
details.fold > summary { display:flex; align-items:center; gap:10px; padding:12px 16px; cursor:pointer; list-style:none; font-weight:800; color:var(--ink); }
details.fold > summary::-webkit-details-marker { display:none; }
details.fold > summary::after { content:"›"; margin-left:auto; font-size:1.35rem; line-height:1; color:var(--green-2); transition:transform .15s; }
details.fold[open] > summary::after { transform:rotate(90deg); }
details.fold[open] > summary { border-bottom:1px solid var(--line); }
details.fold > .staff-details-grid { padding:12px 16px 16px; margin:0; }
details.fold.staff-documents > :not(summary) { margin-left:16px; margin-right:16px; }
.fold-count { padding:2px 8px; border-radius:999px; background:#eaf3fb; color:var(--green-2); font-size:.75rem; }

/* Before-day-one cards open from their headline too. */
details.prestart-card > summary { cursor:pointer; list-style:none; align-items:center; }
details.prestart-card > summary::-webkit-details-marker { display:none; }
details.prestart-card > summary h3 { flex:1; }
details.prestart-card[open] > summary { margin-bottom:8px; }
@media (max-width:680px) { details.fold-panel > summary { padding:14px 16px; } details.fold-panel > summary h2 { font-size:1.05rem; } details.fold-panel > .section-body { padding:12px 16px 16px; } }
.check-signoff > .section-body { display:block; }
.check-signoff > .section-body > div { display:grid; grid-template-columns:2fr repeat(3,1fr); gap:14px; }
@media (max-width:680px) { .check-signoff > .section-body > div { grid-template-columns:1fr; } }
/* Site-wide drop-downs made by fold.js */
details.fold-panel > summary > :first-child { flex:1; min-width:0; }
details.fold-panel > summary .eyebrow { margin:0 0 2px; }
details.fold-panel > .section-body > .panel-head { justify-content:flex-end; margin-bottom:12px; }
.complaint-form > .panel > .section-body > button { width:100%; margin-top:16px; }
/* Interview scheduling: Jasmine's panel on a candidate, and the candidate's own page */
.interview-card { padding:12px 14px; margin:0 0 14px; border:1px solid var(--line,#e3e3df); border-radius:12px; }
.interview-card ul { margin:.3rem 0 .6rem 1.1rem; }
.interview-card form { margin:8px 0 0; }
.interview-form { margin-top:10px; }
.interview-pick form { margin:0 0 10px; }
.interview-pick details { margin:14px 0 6px; }
.interview-pick summary { cursor:pointer; color:#555; }
.interview-pick .muted { font-size:.9rem; }
.interview-card button.secondary,.interview-pick button.secondary { color:var(--green); border:1px solid var(--green); background:white; }

/* ---------------------------------------------------------------------------------------
   Compact layout (5 Oct 2026). One slim header: the 20 page links are grouped into four
   menus on a wide screen and tucked behind a Menu button on a phone, so a page starts at
   its heading instead of half a screen of buttons. Headings, cards and tables are tightened
   to match. Everything here overrides the rules above; nothing above was removed.
   --------------------------------------------------------------------------------------- */
.topbar { position:relative; display:flex; justify-content:flex-start; flex-wrap:wrap; align-items:center; row-gap:0; column-gap:10px; min-height:0; padding:8px clamp(14px,3vw,28px); }
.brand-link { flex-direction:row; align-items:center; gap:10px; margin-right:auto; }
.brand-link img { width:78px; height:32px; }
.brand-link .app-title { display:inline; font-size:1.05rem; font-weight:700; letter-spacing:0; line-height:1.1; white-space:nowrap; }
.topbar .nav-new { order:2; padding:6px 12px; border:2px solid white; border-radius:9px; color:white; font-size:.82rem; font-weight:800; text-decoration:none; white-space:nowrap; }
.topbar .nav-new.active { background:white; color:var(--green); }
.topbar .nav-toggle { order:3; display:none; width:auto; min-height:0; margin:0; padding:7px 14px; border:0; border-radius:9px; background:white; color:var(--green); font:inherit; font-size:.82rem; font-weight:800; cursor:pointer; }
.topbar nav { order:1; flex:0 1 auto; display:flex; flex-wrap:nowrap; align-items:center; gap:2px; margin:0; min-width:0; }
.topbar nav > a, .topbar .nav-label { display:inline-flex; align-items:center; min-height:0; margin:0; padding:7px 10px; border:0; border-radius:8px; background:transparent; color:white; font:inherit; font-size:.84rem; font-weight:600; line-height:1.2; text-decoration:none; white-space:nowrap; cursor:pointer; }
.topbar .nav-label { width:auto; }
.topbar .nav-label::after { content:""; width:6px; height:6px; margin:-3px 0 0 7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); opacity:.8; }
.topbar nav > a:hover, .topbar .nav-label:hover, .topbar .nav-group.open > .nav-label { background:rgba(255,255,255,.16); }
.topbar nav > a.active, .topbar .nav-group.current > .nav-label { background:white; color:var(--green); font-weight:800; }
.topbar nav > .nav-signout { opacity:.8; font-weight:500; }
.topbar .nav-group { position:relative; }
.topbar .nav-menu { display:none; position:absolute; z-index:60; top:calc(100% + 6px); left:0; min-width:190px; padding:6px; border:1px solid var(--line); border-radius:12px; background:white; box-shadow:0 14px 34px rgba(21,34,48,.18); }
.topbar .nav-group.open > .nav-menu { display:block; }
.topbar nav .nav-menu a { display:block; padding:9px 12px; border-radius:8px; background:transparent; color:var(--ink); font-size:.9rem; font-weight:500; line-height:1.25; text-decoration:none; white-space:nowrap; }
.topbar nav .nav-menu a:hover { background:#eef6fd; }
.topbar nav .nav-menu a.active { background:#e1effb; color:var(--green-2); font-weight:800; }
@media (hover:hover) and (min-width:901px) { .topbar .nav-group:hover > .nav-menu { display:block; } .topbar .nav-menu::before { content:""; position:absolute; left:0; right:0; top:-8px; height:8px; } }
@media (max-width:1040px) and (min-width:901px) { .brand-link .app-title-long { display:none; } }

@media (max-width:900px) {
  .brand-link .app-title-long { display:none; }
  .brand-link .app-title { font-size:1rem; }
  .topbar .nav-toggle { display:inline-flex; }
  .topbar nav { order:4; flex:1 1 100%; display:none; flex-direction:column; align-items:stretch; gap:10px; margin:10px 0 4px; padding-top:10px; border-top:1px solid rgba(255,255,255,.28); }
  .topbar.menu-open nav { display:flex; }
  .topbar nav > a { justify-content:center; min-height:40px; padding:8px 12px; background:rgba(255,255,255,.14); font-size:.9rem; }
  .topbar nav > a.active { background:white; }
  .topbar .nav-group { position:static; }
  .topbar .nav-label { width:100%; justify-content:flex-start; padding:0 2px 5px; background:transparent!important; color:rgba(255,255,255,.82)!important; font-size:.7rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; cursor:default; pointer-events:none; }
  .topbar .nav-label::after { display:none; }
  .topbar .nav-menu { display:grid!important; position:static; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; min-width:0; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
  .topbar nav .nav-menu a { display:flex; align-items:center; justify-content:center; min-height:40px; padding:8px 10px; background:rgba(255,255,255,.14); color:white; font-size:.88rem; font-weight:600; text-align:center; white-space:normal; }
  .topbar nav .nav-menu a:hover { background:rgba(255,255,255,.22); }
  .topbar nav .nav-menu a.active { background:white; color:var(--green); font-weight:800; }
}

/* Page body: tighter headings, cards and tables */
.shell { padding-top:20px; }
h1 { margin:.15rem 0 .4rem; font-size:clamp(1.55rem,4.2vw,2.15rem); line-height:1.12; }
.compact h1, .page-head h1 { font-size:clamp(1.5rem,4vw,2rem); }
.intro { margin-bottom:16px; }
.page-head { margin-bottom:12px; gap:14px; }
.page-head p, .intro p { line-height:1.45; }
.eyebrow, .result-label { font-size:.68rem; letter-spacing:.12em; }
.page-tools { margin:0 0 8px; }
.back-link { padding:5px 11px 5px 8px; font-size:.82rem; }
.refresh-btn { min-height:30px; padding:4px 10px; font-size:.82rem; }
.alert { margin:0 0 12px; padding:10px 14px; border-radius:12px; font-size:.92rem; }
.panel { margin-bottom:14px; padding:16px 18px; border-radius:14px; }
.panel h2 { margin:0 0 10px; font-size:1.2rem; }
.stat-grid { gap:10px; margin:0 0 14px; }
.stat-grid article { padding:11px 14px; border-radius:12px; }
.stat-grid span { font-size:.76rem; }
.stat-grid strong { margin-top:1px; font-size:1.5rem; line-height:1.15; }
.stat-grid small { display:block; margin-top:2px; color:var(--muted); font-size:.72rem; line-height:1.3; }
th, td { padding:8px 10px; }
th { font-size:.7rem; }
.activity-list article { padding-top:8px; padding-bottom:8px; }
details.fold-panel > summary, details.checklist-section > summary { padding-top:11px; padding-bottom:11px; }
details.fold-panel > .section-body, details.checklist-section .section-body { padding-top:12px; padding-bottom:16px; }
.dashboard-clock { margin:.1rem 0 .4rem; }
@media (max-width:680px) {
  .shell { width:calc(100% - 20px); padding-top:12px; }
  .panel { padding:13px 13px; }
  .stat-grid, .marketing-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .page-head { flex-wrap:wrap; }
}
@media print { .topbar { display:none!important; } }
@media (max-width:480px) { .brand-link .app-title { display:none; } .brand-link img { width:88px; height:36px; } }
.brand-link .app-title-long { opacity:1; font-size:inherit; }
