/* Client door. Layout: a sticky dark band (brand + save state), one 34rem column, a fixed action bar at the thumb.
   Phone rules (plan §6): every tap target ≥ 44px, inputs ≥ 16px. System fonts only: the page makes no third-party requests. */
:root{
  --band:#13181d; --band-fg:#eef1ea; --band-muted:#98a39a;
  --lime:#c6f24e; --on-lime:#13181d;
  --bg:#f2f4ee; --surface:#ffffff; --fg:#161b1f; --muted:#59625d; --line:#d6dccf; --chip:#e7ebe0;
  --flag:#9a5208; --flag-bg:#fbefdc; --ok:#2d7238; --ok-bg:#e3f1e2; --bad:#a3271b;
  --display:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --body:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --r:14px;
}
@media (prefers-color-scheme: dark){:root{
  --bg:#0d1114; --surface:#161c20; --fg:#e8ece4; --muted:#9ba59d; --line:#2a3337; --chip:#1f272b;
  --flag:#f2a950; --flag-bg:#2c2215; --ok:#8fd19a; --ok-bg:#16281a; --band:#0a0d10; --bad:#ff8a7a}}

*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{background:var(--bg);color:var(--fg);font:16px/1.5 var(--body);-webkit-text-size-adjust:100%}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--band)}
[hidden]{display:none!important}
button,input,textarea,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--lime);outline-offset:2px}

.band{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--band);color:var(--band-fg);
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:12px 10px}
.band-row{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:34rem;margin:0 auto;min-height:32px}
.wordmark{font:800 13px/1 var(--display);letter-spacing:.16em}
.wordmark b{color:var(--lime);font-weight:800}
.save{font-size:13px;color:var(--band-muted);display:flex;align-items:center;gap:6px;white-space:nowrap}
.save i{width:8px;height:8px;border-radius:50%;background:var(--lime)}
.save.saving i,.save.retrying i{background:var(--band-muted);animation:pulse .8s infinite alternate}
.save.inactive i,.save.error i{background:#ff8a7a}
@keyframes pulse{to{opacity:.3}}
.crumb{max-width:34rem;margin:6px auto 0;font-size:13px;color:var(--band-muted);display:flex;justify-content:space-between;gap:8px}
.crumb span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar{height:4px;background:#2a3238;margin:10px auto 0;max-width:34rem;border-radius:2px;overflow:hidden}
.bar>div{height:100%;background:var(--lime);transition:width .25s}

.dead-banner{position:sticky;top:0;z-index:4;background:var(--flag-bg);color:var(--fg);border-bottom:2px solid var(--flag);
  padding:12px max(16px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;gap:2px;font-size:15px}

main{max-width:34rem;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:20px 140px}
.section-title{font:700 13px/1.2 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 4px}
h1{font:800 clamp(28px,7.5vw,38px)/1.08 var(--display);margin:0 0 12px;text-wrap:balance;letter-spacing:-.01em}
h2{font:750 22px/1.2 var(--display);margin:0 0 8px;text-wrap:balance}
p{margin:0}
.lede{color:var(--muted)}
.stack{display:flex;flex-direction:column;gap:28px}
.qs{margin-top:12px}

.q{display:flex;flex-direction:column;gap:10px}
.q-label{font:650 18px/1.3 var(--body);text-wrap:balance}
.q-help{color:var(--muted);font-size:15px}
.note{font-size:14px;padding:8px 12px;border-radius:10px;background:var(--chip);color:var(--fg)}
.note.lock::before{content:"✓ ";color:var(--ok);font-weight:700}

input[type=text],input[type=tel],input[type=email],input[type=url],input[type=time],textarea{
  width:100%;min-height:48px;font-size:16px;padding:11px 14px;border:1.5px solid var(--line);border-radius:12px;background:var(--surface)}
textarea{min-height:120px;resize:vertical}
input:focus,textarea:focus{border-color:var(--fg);outline:none}

.cards{display:flex;flex-direction:column;gap:8px}
.card{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:12px 14px;text-align:left;
  background:var(--surface);border:1.5px solid var(--line);border-radius:12px;cursor:pointer;font-size:16px}
.card .tick{flex:none;width:22px;height:22px;border:1.5px solid var(--muted);display:grid;place-items:center;font-size:14px;font-weight:800}
.card[data-kind=one] .tick{border-radius:50%}
.card[data-kind=many] .tick{border-radius:6px}
.card[aria-pressed=true]{border-color:var(--fg);background:var(--lime);color:var(--on-lime)}
.card[aria-pressed=true] .tick{border-color:var(--on-lime);background:var(--on-lime);color:var(--lime)}
.yn{display:grid;grid-template-columns:1fr 1fr;gap:8px}

.found{border:1.5px solid var(--line);border-radius:var(--r);background:var(--surface);padding:14px;display:flex;flex-direction:column;gap:10px}
.found.sib{border-style:dashed}
.found-src{font-size:14px;color:var(--muted)}
.found-val{font-weight:600;white-space:pre-line;overflow-wrap:anywhere}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.btn{min-height:48px;padding:10px 18px;border-radius:12px;border:1.5px solid var(--fg);background:transparent;cursor:pointer;font-weight:650}
.btn.primary{background:var(--lime);border-color:var(--lime);color:var(--on-lime)}
.btn.dark{background:var(--fg);border-color:var(--fg);color:var(--bg)}
.btn.small{min-height:44px;padding:8px 14px;font-size:15px}
.btn:disabled{opacity:.6;cursor:default}
.confirmed{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;background:var(--ok-bg)}
.confirmed span{min-width:0;overflow-wrap:anywhere;white-space:pre-line}
.confirmed button{flex:none}

.skips{display:flex;flex-wrap:wrap;align-items:center;gap:0 6px;margin-top:-4px}
.skip{min-height:44px;padding:0 10px;border:0;background:none;color:var(--muted);font-size:15px;cursor:pointer;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}
.skip:first-child{padding-left:0}
.skip.later{color:var(--fg);font-weight:600}
.pill{font-size:13px;font-weight:700;padding:4px 10px;border-radius:999px;background:var(--chip);white-space:nowrap}
.pill.flag{background:var(--flag-bg);color:var(--flag)}
.pill.done{background:var(--ok-bg);color:var(--ok)}
.q.skipped .control,.q.skipped .found{opacity:.5}

.hours{display:flex;flex-direction:column;gap:6px}
.hrow{display:grid;grid-template-columns:2.6rem 4.6rem minmax(0,1fr) minmax(0,1fr);gap:6px;align-items:center}
.hrow b{font-weight:650}
.hrow .tog{min-height:44px;border-radius:10px;border:1.5px solid var(--line);background:var(--surface);font-size:14px;font-weight:650;cursor:pointer}
.hrow .tog[aria-pressed=true]{background:var(--chip);color:var(--muted)}
.hrow input{padding:8px 6px;min-width:0}
.hrow .shut{grid-column:3/5;color:var(--muted);font-size:14px}

.lrow{display:flex;gap:6px}
.lrow input{flex:1;min-width:0}
.icon{flex:none;width:48px;min-height:48px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);cursor:pointer;font-size:20px}
.lcard{border:1.5px solid var(--line);border-radius:var(--r);background:var(--surface);padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.lcard label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted);min-width:0}
.lcard label.wide{grid-column:1/-1}
.lcard .rm{grid-column:1/-1;justify-self:end}

.filebtn{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;min-height:56px;border:1.5px dashed var(--muted);border-radius:12px;cursor:pointer;font-weight:650;background:var(--surface)}
.filebtn.busy{opacity:.7;cursor:progress}
.filebtn input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.files{margin:0;padding:0;list-style:none;font-size:15px;color:var(--ok)}
.msg{color:var(--bad);font-size:15px}
.okmsg{color:var(--ok);font-size:15px;font-weight:600}
.clist{display:flex;flex-direction:column;gap:10px}
.clist .or{font-size:14px;color:var(--muted)}

.actions{position:fixed;left:0;right:0;bottom:0;z-index:6;background:var(--surface);border-top:1px solid var(--line);
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-top:10px;padding-bottom:calc(10px + env(safe-area-inset-bottom,0px))}
.actions-in{max-width:34rem;margin:0 auto;display:grid;grid-template-columns:auto 1fr;gap:8px}
#back[hidden]+#next{grid-column:1/-1}

.biz{display:flex;flex-direction:column;gap:10px;padding:16px;border:1.5px solid var(--line);border-radius:var(--r);background:var(--surface);text-align:left;cursor:pointer;width:100%;min-height:44px}
.biz-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.biz-name{font:750 20px/1.2 var(--display)}
.biz-kind{font-size:14px;color:var(--muted)}
.small-biz .biz-name{font-size:17px}
.meter{display:block;height:6px;border-radius:3px;background:var(--chip);overflow:hidden}
.meter>span{display:block;height:100%;background:var(--fg)}
.biz-stat{font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums}

.welcome-band{background:var(--band);color:var(--band-fg);border-radius:var(--r);padding:22px 18px;display:flex;flex-direction:column;gap:12px}
.welcome-band .lede{color:var(--band-muted)}
.meta{font-size:15px;color:var(--lime);font-weight:650}
.promise{border:1.5px solid var(--fg);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:6px}
.promise strong{font:750 17px/1.3 var(--display)}

.sum{display:flex;flex-direction:column;gap:8px}
.sum h3{font:700 13px/1.2 var(--display);letter-spacing:.12em;text-transform:uppercase;margin:12px 0 0;color:var(--muted)}
.sum ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.sum li{padding:10px 12px;border-radius:10px;background:var(--surface);border:1px solid var(--line);font-size:15px;display:flex;justify-content:space-between;gap:10px}
.sum li em{font-style:normal;color:var(--muted);font-size:13px;white-space:nowrap}
.flagged li{border-left:4px solid var(--flag)}
.owed li{border-left:4px solid var(--fg)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}