/* Onboarding form. Builds on style.css tokens. Questions and logic live in form-schema.json and onboarding.js. */
.ob{padding-top:clamp(20px,4vw,40px);padding-bottom:clamp(48px,8vw,88px)}
.ob-nav{display:flex;gap:6px}.ob-nav a{color:var(--ink);text-decoration:none;font-weight:600;font-size:.9375rem;padding:8px 12px;border-radius:var(--r-sm)}.ob-nav a:hover{background:var(--brand-l);color:var(--brand-d)}
@media(max-width:560px){.ob-nav a:first-child{display:none}}

/* progress */
.prog{position:sticky;top:var(--header);z-index:15;background:rgba(247,249,252,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:12px 0 14px;box-shadow:0 1px 0 var(--line)}
.prog-row{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:.9375rem;margin-bottom:9px}.prog-row b{color:var(--ink);font-family:var(--display);font-size:.9688rem;min-width:0}
#save-state{display:inline-flex;align-items:center;gap:7px;color:var(--muted);font-size:.875rem;white-space:nowrap}
#save-state:not(:empty)::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--line-2)}
#save-state[data-k=ok]::before{background:var(--mint)}#save-state[data-k=busy]::before{background:var(--brand);animation:blink 1s infinite}#save-state[data-k=err]::before{background:#D9534F}
@keyframes blink{50%{opacity:.3}}
.bar-track{height:8px;background:#E2E8F0;border-radius:99px;overflow:hidden}#prog-fill{height:100%;width:0;background:var(--btn);border-radius:99px;transition:width .35s ease}
@media(max-width:560px){.prog-row{flex-direction:column;align-items:flex-start;gap:2px}}

/* welcome */
.intro{margin-bottom:clamp(20px,3vw,32px)}.intro h1{font-size:clamp(1.9rem,5vw,2.8rem);max-width:none}
.expect{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:26px 0 0}
.expect div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 18px}.expect b{display:block;color:var(--ink);font-family:var(--display);font-size:.9688rem;margin-bottom:2px}.expect span{color:var(--muted);font-size:.9375rem}
@media(max-width:700px){.expect{grid-template-columns:1fr}}

/* step panel */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:clamp(20px,4vw,40px);box-shadow:var(--sh)}
.panel>h2{margin-bottom:.35em;font-size:clamp(1.45rem,3.2vw,1.9rem)}.panel>.intro-t{color:var(--muted);margin-bottom:2em;max-width:60ch}
.q{margin:0 0 clamp(26px,3.4vw,34px);padding:0;border:0;min-width:0}.q[hidden],.oth[hidden]{display:none}
.ql{display:block;font-weight:800;color:var(--ink);font-size:1.0625rem;line-height:1.35;padding:0;margin-bottom:.3em}
.req{font-weight:700;color:var(--brand-d);background:var(--brand-l);font-size:.75rem;margin-left:10px;padding:2px 8px;border-radius:999px;vertical-align:middle;white-space:nowrap}
.qh{margin:0 0 .6em;color:var(--body);font-size:.9688rem}.qx{margin:0 0 .7em;color:var(--muted);font-size:.9375rem;font-style:italic}
.learn{margin:0 0 .8em;border:0;padding:0;background:none}.learn summary{display:inline;padding:0;min-height:0;color:var(--brand-d);font-weight:700;font-size:.9375rem;cursor:pointer}
.learn summary::after{content:none}.learn p{margin:.5em 0 0;padding:12px 14px;background:var(--brand-l);border-radius:var(--r);font-size:.9375rem;color:var(--ink)}

/* fields */
input[type=text],input[type=email],input[type=tel],input[type=date],textarea,select{width:100%;max-width:580px;min-height:50px;padding:.7em .95em;border:1.5px solid var(--line-2);border-radius:var(--r);font:inherit;color:var(--ink);background:#fff;transition:border-color .15s,box-shadow .15s}
input:focus,textarea:focus,select:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 4px rgba(0,128,246,.18)}
textarea{min-height:120px;resize:vertical;max-width:100%}
input[type=file]{max-width:100%;font:inherit;padding:10px;border:1.5px dashed var(--line-2);border-radius:var(--r);background:#FAFBFD;width:100%}
.opts{display:grid;gap:10px}
.opt{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;min-height:52px;border:1.5px solid var(--line);border-radius:var(--r);cursor:pointer;background:#fff;transition:border-color .15s,background .15s,box-shadow .15s}
.opt:hover{border-color:var(--line-2);background:#FAFBFD}.opt:has(input:checked){border-color:var(--brand);background:var(--brand-l);box-shadow:0 0 0 1px var(--brand) inset}
.opt:has(input:focus-visible){outline:3px solid var(--brand);outline-offset:2px}
.opt input{width:20px;height:20px;margin:2px 0 0;flex:none;accent-color:var(--btn)}
.opt span{display:block;min-width:0;color:var(--ink)}.opt b{font-weight:700}.opt small{display:block;color:var(--muted);font-size:.9rem;margin-top:3px;font-weight:400}
.oth{margin-top:10px}

/* validation */
.q.err input[type=text],.q.err input[type=email],.q.err input[type=tel],.q.err textarea,.q.err select{border-color:var(--bad);box-shadow:0 0 0 3px rgba(180,35,24,.12)}.q.err .opt{border-color:#E7B3AE}
.qe{display:flex;gap:8px;align-items:flex-start;margin:.7em 0 0;color:var(--bad);font-weight:700;font-size:.9375rem}.qe::before{content:"!";flex:none;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--bad);color:#fff;font-size:.8rem;margin-top:1px}
.qe[hidden]{display:none}

/* notes, suggestion, files */
.note{padding:16px 18px;border-left:4px solid #E0A100;background:var(--warn-l);border-radius:0 var(--r) var(--r) 0;margin-bottom:28px}.note b{color:var(--ink)}.note p{margin:.3em 0 0;font-size:.9688rem}
.sug{padding:18px 20px;border-radius:var(--r-lg);background:var(--ok-l);border:1px solid #BFE8D6;color:var(--ink)}
.files-list{list-style:none;padding:0;margin:.7em 0}.files-list li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;border:1px solid var(--line);border-radius:var(--r);margin-bottom:8px;font-size:.9688rem;background:#fff}.files-list li span{min-width:0;overflow-wrap:anywhere}
.linkbtn{background:none;border:0;color:var(--brand-d);font:inherit;font-weight:700;cursor:pointer;padding:6px 4px;text-decoration:underline;min-height:36px}

/* navigation buttons */
.nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:clamp(8px,2vw,16px);padding-top:clamp(18px,3vw,26px);border-top:1px solid var(--line)}
.nav .btn{min-width:130px}.nav .btn.ghost{border-color:var(--line-2)}
@media(max-width:560px){
  .nav{position:sticky;bottom:0;z-index:5;margin:0 calc(-1 * clamp(20px,4vw,40px)) calc(-1 * clamp(20px,4vw,40px));padding:12px clamp(20px,4vw,40px) calc(12px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-top:1px solid var(--line);border-radius:0 0 var(--r-xl) var(--r-xl)}
  .nav .btn{flex:1;min-width:0}
}

.banner{padding:14px 18px;border-radius:var(--r);background:var(--brand-l);margin-bottom:18px;font-size:.9688rem;color:var(--ink)}.banner.bad{background:var(--bad-l);color:#7A1A12}
.sum h3{margin:1.4em 0 .2em;display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:1.0625rem}.sum dl{margin:0;padding:4px 16px 12px;background:#FAFBFD;border:1px solid var(--line);border-radius:var(--r)}.sum dt{font-weight:700;color:var(--ink);font-size:.9375rem;margin-top:.9em}.sum dd{margin:.15em 0 0;white-space:pre-wrap;font-size:.9688rem}
.done{text-align:left}.done h1{font-size:clamp(1.7rem,4vw,2.3rem);max-width:none}.done .btn{margin-top:10px}.startover{margin-top:26px;font-size:.9375rem;color:var(--muted)}