/* ============================================================================
   css/onboard.css — the client onboarding wizard at georgy.finance/onboard
   ----------------------------------------------------------------------------
   Loaded ONLY by the portal-onboarding Worker (workers/onboarding/worker.js),
   after fonts.css + tokens.css + refined.css — the same way the four
   calculators load tools.css after them.

   WHY THIS FILE EXISTS, and why it is small.

   /onboard is a Worker on a zone route, so it renders its own HTML rather than
   being a page in this repo. Until 2026-09-01 it therefore carried its own COPY
   of the site's chrome — .site-head, .menu, .burger, .btn, .hero, .wrap and all
   the form-control styling, ~13.5 KB inlined in a <style> block. A copy is a
   thing that drifts, and this one had:

     * a focus ring of rgba(201,168,76,.22) and a select caret stroked #7d6720.
       That is #c9a84c and --gold-dk — the gold the site retired on 2026-08-31.
       layout.mjs fails the build on gold in any property, but layout.mjs only
       ever saw Pages, never this Worker.
     * nine hardcoded hex values, where the site's inline-value budget is 0.
     * Google Fonts <link>s, when the site self-hosts IBM Plex precisely because
       those are CSP-blocked and fail silently.

   None of it was visible to any gate. So the copy is gone: the Worker now LINKS
   /css/fonts.css, /css/tokens.css and /css/refined.css — the same files, same
   immutable cache, same ?v= tag as every page — and this file holds only what is
   genuinely specific to the wizard. Every selector below was checked against
   refined.css; none of them exist there.

   The chrome was inlined originally because of georgy.finance's
   Cross-Origin-Resource-Policy: same-origin. That objection died with the
   one-domain cutover on 2026-08-29 — /onboard is the SAME origin as /css now.

   Rules: tokens only, and no gold. The single literal below, #7a2b2b, is not an
   exception being smuggled in — it is refined.css's own .form-msg.err colour,
   copied deliberately because the estate has no error token to reference.

   scripts/harness/onboard.mjs asserts all of this against the rendered page.
   ============================================================================ */

/* Supplement only. Everything above is css/tokens.css verbatim, synced by
   npm run sync:tokens, from the website repo — the estate's one source. The
   :root this replaces hand-copied the site's ink, paper, green and type stacks
   and then added gold beside them, which is how the wizard was still gold on
   2026-08-31 while the site had been green since morning. */
:root{
  --hair:var(--rule);
  /* The site has no red — it never needs one. This is the same value the admin
     console and the client portal carry as --red, so the estate has one red. */
  --red:#7a2b2b;
}
.sub{color:var(--ink-mute);font-size:1.05rem;line-height:1.55;max-width:56ch}
.paper{background-color:var(--paper-alt);border-top:1px solid var(--hair);
padding:2.6rem 0 3.2rem;color:var(--ink-body)}
.card{background:var(--paper);border:1px solid var(--hair);
padding:2rem 1.9rem 1.5rem;margin-bottom:1.3rem}
.sec{display:flex;align-items:baseline;gap:.9rem;border-bottom:1px solid var(--rule);
padding-bottom:1rem;margin-bottom:1.9rem}
.sec .n{font-family:var(--disp);font-style:normal;font-weight:600;font-size:1.3rem;color:var(--green)}
.sec .t{font-family:var(--mono);font-size:.78rem;font-weight:600;letter-spacing:.09em;
text-transform:uppercase;color:var(--ink)}
.f{margin-bottom:1.5rem}
.f .hint{display:block;font-size:.88rem;color:var(--ink-faint);margin-top:.4rem}
.f .err{display:none;font-size:.88rem;color:#7a2b2b;margin-top:.4rem}
.f.bad .err{display:block}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 1.3rem}
.cond{display:none}
.cond.on{display:block}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:.7rem 1rem;margin-top:.3rem}
.terms{background:var(--paper-alt);border:1px solid var(--rule);max-height:16rem;overflow-y:auto;
padding:1.5rem 1.6rem;font-size:.98rem;line-height:1.75;color:var(--ink-body);
margin-bottom:.8rem}
.terms h4{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;
text-transform:uppercase;color:var(--green);margin:1.3rem 0 .4rem}
.terms h4:first-child{margin-top:0}
.terms p{margin-bottom:.5rem}
.scrollmsg{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;
color:var(--ink-faint);margin-bottom:1.4rem}
.scrollmsg.done{color:var(--green)}
.agree{display:flex;gap:.75rem;align-items:flex-start;font-size:1.02rem;
color:var(--ink-body);margin:1.2rem 0 .4rem;cursor:pointer;line-height:1.6}
.agree input{width:1.05rem;height:1.05rem;accent-color:var(--green);
margin-top:.22rem;flex:none}
.submit-row .back{background:none;border:1px solid var(--rule-mid);color:var(--ink);font-family:var(--mono);font-size:.78rem;font-weight:600;padding:.85rem 1.4rem;cursor:pointer}
.submit-row{display:none;padding:.6rem 0 0;text-align:center;justify-content:center;gap:1rem;align-items:center}
.submit-row.on{display:flex}
.formerr{display:none;font-size:.9rem;color:#7a2b2b;margin-top:1rem}
.steperr{text-align:right;margin-top:.6rem}
.formerr.on{display:block}
.done-card{display:none;background:var(--paper);border:1px solid var(--hair);
padding:2.8rem 2.2rem;text-align:center}
.done-card.on{display:block}
.done-card .mark{font-family:var(--disp);font-weight:600;font-size:2.2rem;color:var(--green);
margin-bottom:.8rem}
.done-card h2{font-family:var(--disp);font-weight:600;font-size:1.5rem;
color:var(--ink);margin-bottom:.6rem}
.done-card p{color:var(--ink-mute);max-width:34rem;margin:0 auto;line-height:1.55}
.subs-intro{font-size:.98rem;color:var(--ink-mute);margin-bottom:1.2rem}
.subrow{border:1px solid var(--rule);background:var(--paper-alt);padding:1.2rem 1.2rem .3rem;
margin-bottom:1rem;position:relative}
.subrow .rm{position:absolute;top:.6rem;right:.7rem;background:none;border:0;
color:var(--green);font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;
text-transform:uppercase;cursor:pointer}
.subrow .rm:hover{color:#7a2b2b}
.addsub{background:none;border:1px dashed var(--rule-mid);color:var(--green);width:100%;
padding:.85rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;
text-transform:uppercase;cursor:pointer;transition:border-color .2s,color .2s}
.addsub:hover{border-color:var(--green);color:var(--green-dk)}
/* \u2500\u2500 stepped wizard (owner 2026-08-30): one card at a time, a rail like /book's */
/* A grid, not wrapping flex — the same fix /book's four steps needed on
   2026-08-31. Wrapping flex leaves a ragged last row whose items sit at
   arbitrary positions; equal columns give one arrangement per width and the
   same left edges on every row. Five across, then three, then two.
   auto columns on one row (nothing to align against, and equal columns made
   "Your business" wrap); equal columns once there are rows to line up. */
.obsteps{list-style:none;display:grid;grid-template-columns:repeat(5,auto);justify-content:start;gap:.7rem 1.1rem;margin:0 0 1.3rem}
@media(max-width:820px){.obsteps{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:520px){.obsteps{grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem .8rem}}
.obstep{display:flex;align-items:center;gap:.5rem;min-width:0;font-family:var(--mono);font-size:.78rem;font-weight:500;color:var(--ink-mute)}
.obstep-n{display:inline-flex;width:1.6rem;height:1.6rem;align-items:center;justify-content:center;background:var(--paper-deep);font-size:.72rem;font-weight:600;color:var(--ink)}
.obstep.is-current{color:var(--ink);font-weight:600}
.obstep.is-current .obstep-n{background:var(--ink);color:var(--paper)}
.obstep.is-done .obstep-n{background:var(--green);color:var(--paper)}
.stepcard{display:none}
.stepcard.on{display:block}
.stepnav{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-top:.4rem}
.stepnav .back{background:none;border:1px solid var(--rule-mid);color:var(--ink);font-family:var(--mono);font-size:.78rem;font-weight:600;padding:.85rem 1.4rem;cursor:pointer}
.stepnav .back:hover{border-color:var(--ink)}
.stepnav .sp{flex:1}
@media(max-width:720px){
.grid2,.checks{grid-template-columns:1fr}
.card{padding:1.9rem 1.3rem 1.4rem}
}
/* ── site header ───────────────────────────────────────────────────────────
   The nav from georgy.finance, carried onto this page so the form does not feel
   detached from the site. Links leave for the marketing domain, which is the
   intent — this page is a destination, not a section of it. */

/* Deliberately NOT redefined here: *, .btn, .hero and .site-head.
   css/onboard.css loads AFTER refined.css, so anything it names wins — which
   makes every shared selector a silent override of the site, and a new place for
   the page to drift. The four that were inherited from the old inlined block are
   gone: a global reset refined.css already performs, .btn{width:100%} which
   would have resized every button on the page including the header's, and
   .hero/.site-head paddings that fought the site's own. If the wizard ever needs
   one of these, scope it (.stepcard .btn), never redefine the base. */