/* The /iv pay-first page (Pouria, 2026-10-24 approved mock). Scope the
   layout, the light palette and the header to its renderer so the shared
   shell returns to the intake layout on /join. One scrolling page on the
   /labs chassis: HSA/FSA bar, headline, the two IV cards, the shots and
   supplements folds, the after-pay strip, and the pinned wallet (the labs
   bar's own classes, `lb5-*`, from intake.css). */
.onboarding-shell:has(.iv-care){background:#faf6f0;color-scheme:light;--ink:#2b2420;--muted:#6d625a;--line:#eadfd4}
.msgs:has(.iv-care){max-width:520px;padding:0;gap:0;margin:0 auto}
.onboarding-shell:has(.iv-care) .chat-hdr{height:56px;min-height:56px;padding:0 20px;position:relative;background:#faf6f0;border:0}
/* The header's brand is the logo lockup (2026-10-08). Sized by height for
   this page's header so the IV landing keeps a visible brand. */
.onboarding-shell:has(.iv-care) .chat-hdr-brand img{width:auto;height:30px}
.onboarding-shell:has(.iv-care) .chat-hdr-sub,
.onboarding-shell:has(.iv-care) .onb-progress{display:none}
/* The legal line lives in the pinned bar, under the wallet (Pouria
   2026-10-23); the shell's own footer would say it twice. */
.onboarding-shell:has(.iv-care) .onb-legal{display:none}
/* The HSA/FSA bar is the first thing on the page — above the header, as in
   the approved mock. The shell gives up exactly the bar's height on top. */
.onboarding-shell:has(.iv-care > .hsa-bar){padding-top:var(--hsa-bar-h)}
.iv-care>.hsa-bar{position:absolute;top:0;left:0;right:0;z-index:31}
.iv-care{--iv-cream:#faf6f0;--iv-ink:#2b2420;--iv-green:#2f4a3a;--iv-clay:#a0583a;--iv-muted:#6d625a;--iv-line:#eadfd4;--iv-line-soft:#f1e9e1;--iv-tick:#c9bcb0;--iv-tint:#f3eee6;background:var(--iv-cream);color:var(--iv-ink);font-family:-apple-system,"SF Pro Text",Inter,Helvetica,Arial,sans-serif;line-height:normal;padding-bottom:calc(230px + env(safe-area-inset-bottom))}
.iv-care *{box-sizing:border-box}
.iv-care button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;color:inherit}
.iv-care button:focus-visible,.iv-care a:focus-visible{outline:3px solid var(--iv-clay);outline-offset:3px}
.iv-care h1,.iv-care h2,.iv-care p{margin:0}
.iv-content{padding:14px 20px 0}
.iv-care h1{font-size:30px;font-weight:700;letter-spacing:-.5px;line-height:1.15;text-align:left;color:var(--iv-ink)}
.iv-care .iv-intro{font-size:14px;color:var(--iv-muted);margin:6px 0 18px;line-height:1.35}
.ivp-grp{margin-top:18px}
.ivp-grp-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px;gap:10px}
.ivp-grp-h h2{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--iv-muted);font-weight:600}
.ivp-grp-h span{font-size:12.5px;color:var(--iv-muted);text-align:right}
.ivp-cards{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
/* The comparison matrix under the tier cards (intake.css owns .cmp-matrix). */
.iv-care .cmp-matrix{margin:10px 0 2px}
.ivp-card{min-width:0;background:#fff;border:1.5px solid var(--iv-line);border-radius:16px;padding:14px 16px;transition:border-color .16s,box-shadow .16s}
.ivp-card.on,.ivp-fold.has{border-color:var(--iv-green)}
.ivp-card.on{box-shadow:0 0 0 1px var(--iv-green)}
.iv-care .ivp-pick{display:flex;gap:14px;align-items:flex-start;width:100%;background:none;border:0;padding:0;text-align:left;color:var(--iv-ink)}
.ivp-box{flex:0 0 24px;height:24px;margin-top:1px;border-radius:7px;border:2px solid var(--iv-tick);display:grid;place-items:center;color:transparent;font-size:14px;line-height:1}
.ivp-box.ivp-radio{border-radius:50%}
.ivp-card.on .ivp-box,.ivp-item.on .ivp-box{background:var(--iv-green);border-color:var(--iv-green);color:#fff}
.ivp-txt{flex:1;min-width:0}
.ivp-txt b{display:block;font-size:17px;font-weight:700;line-height:1.25}
.ivp-txt small{display:block;font-size:13.5px;color:var(--iv-muted);margin-top:2px;line-height:1.3}
.ivp-price{flex:none;text-align:right;font-size:12px;color:var(--iv-muted);line-height:1.2}
.ivp-price b{display:block;font-size:20px;font-weight:700;color:var(--iv-ink);font-variant-numeric:tabular-nums}
.iv-care .ivp-det{display:block;width:fit-content;margin:4px 0 -4px 38px;padding:4px 0;background:none;border:0;font-size:13px;line-height:1.2;color:var(--iv-muted);text-decoration:underline;text-underline-offset:3px}
.ivp-panel{margin-top:12px;padding:12px 0 2px 38px;border-top:1px solid var(--iv-line-soft)}
.ivp-panel[hidden]{display:none}
.iv-stats{display:flex;margin:0 0 10px}
.iv-stats>div{flex:1;min-width:0;padding:0 6px;border-left:1px solid var(--iv-line)}
.iv-stats>div:first-child{padding-left:0;border-left:0}
.iv-stats b{display:block;font-size:22px;font-weight:700;letter-spacing:-.4px;color:var(--iv-green);line-height:1.1;white-space:nowrap}
.iv-stats span{display:block;font-size:12px;color:#7a6f66;margin-top:3px;line-height:1.25}
.iv-flow{display:flex;flex-wrap:wrap;align-items:center;row-gap:4px;font-size:12px;color:#3a322c;margin:0}
.iv-flow i{width:7px;height:7px;border-radius:50%;background:var(--iv-green);flex:0 0 7px}
.iv-flow em{flex:1;min-width:6px;height:1px;background:#d9cdc1;margin:0 6px}
.iv-flow span{margin-left:5px}
.ivp-kv{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:13.5px;color:#3a322c}
.ivp-kv span{color:var(--iv-muted)}
.ivp-chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 10px}
.iv-care .ivp-chip{border:1.5px solid var(--iv-line);border-radius:999px;padding:7px 12px;font-size:13px;font-weight:600;background:none;color:var(--iv-muted)}
.iv-care .ivp-chip.on{border-color:var(--iv-green);color:var(--iv-green);background:rgba(47,74,58,.07)}
/* The folds: one row each, an Add pill; open, the rows inside. */
.ivp-fold{background:#fff;border:1.5px solid var(--iv-line);border-radius:16px;overflow:hidden}
.iv-care .ivp-fold-h{display:flex;align-items:center;gap:12px;width:100%;background:none;border:0;padding:14px 16px;text-align:left;color:var(--iv-ink)}
.ivp-cta{flex:none;font-size:14px;font-weight:600;color:var(--iv-clay);border:1.5px solid var(--iv-clay);border-radius:999px;padding:7px 14px;white-space:nowrap}
.ivp-fold.open .ivp-cta,.ivp-fold.has .ivp-cta{background:var(--iv-clay);color:#fff}
.ivp-fold-b{border-top:1px solid var(--iv-line-soft);padding:6px 16px 14px}
.ivp-fold-b[hidden]{display:none}
.ivp-note{font-size:12.5px;color:var(--iv-muted);line-height:1.4;margin:8px 0 10px}
.iv-care .ivp-row{padding:12px 0 0;gap:12px}
.ivp-item{border-top:1px solid var(--iv-line-soft);padding-bottom:10px}
.ivp-item:first-child,.ivp-sub-h+.ivp-item{border-top:0}
.ivp-item .ivp-box{flex:0 0 22px;height:22px}
.ivp-item .ivp-txt b{font-size:15.5px}
.ivp-item .ivp-txt small{font-size:13px}
.ivp-item .ivp-price b{font-size:17px}
.iv-care .ivp-item .ivp-det{margin:2px 0 -2px 34px}
.ivp-item .ivp-panel{padding-left:34px;margin-top:10px;padding-top:10px}
.ivp-item[hidden]{display:none}
.ivp-sub-h{margin:16px 0 0;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:#8a7d72;font-weight:600}
.ivp-sub-h:first-child{margin-top:8px}
.ivp-deliv{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0 2px}
.ivp-deliv div{background:var(--iv-tint);border-radius:12px;padding:10px 12px;font-size:12.5px;line-height:1.35;color:var(--iv-muted)}
.ivp-deliv b{display:block;color:var(--iv-ink);font-size:13px;margin-bottom:2px}
.ivp-deliv div.on{background:rgba(47,74,58,.1);color:#3a322c}
.ivp-review{margin-top:12px;border-top:1px solid var(--iv-line)}
/* After you pay: three dots on a line. */
.ivp-after{margin-top:22px;display:grid;gap:10px}
.ivp-lbl{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#8a7d72;margin:0}
.iv-flow.ivp-flow-big{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;position:relative;font-size:13px;font-weight:500;text-align:center}
.iv-flow.ivp-flow-big::before{content:"";position:absolute;top:4px;left:17%;right:17%;height:1px;background:#d9cdc1}
.iv-flow.ivp-flow-big i,.iv-flow.ivp-flow-big em{display:none}
.iv-flow.ivp-flow-big span{display:block;margin:0;line-height:1.25}
.iv-flow.ivp-flow-big span::before{content:"";position:relative;display:block;width:9px;height:9px;border-radius:50%;background:var(--iv-green);margin:0 auto 7px}
/* The pinned wallet: the labs bar (intake.css `.lb5-pay`), with the
   order's line and total above the wallet. */
.iv-care .ivp-pay{position:fixed;bottom:0;left:0;right:0;z-index:20;padding:10px 20px calc(14px + env(safe-area-inset-bottom));background:#faf6f0f7;border-top:1px solid #e8ddd2;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.iv-care .ivp-pay>*{max-width:480px;margin-left:auto;margin-right:auto}
.ivp-sum{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:var(--iv-muted);margin-bottom:8px;gap:10px}
.ivp-sum small{min-width:0;line-height:1.3}
.ivp-sum b{font-size:22px;color:var(--iv-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.ivp-sum b em{font-style:normal;font-size:12px;color:var(--iv-muted);font-weight:500}
.iv-care .ivp-pay .lab-error:empty{display:none}
.iv-sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:900px){
  .onboarding-shell:has(.iv-care) .chat-hdr{height:72px;max-width:1160px;width:100%;margin:0 auto;padding:0 28px}
  .onboarding-shell:has(.iv-care) .chat-hdr-brand img{height:36px}
  .iv-content{padding-top:40px}
  .iv-care h1{font-size:40px}
}
@media(max-width:350px){
  .onboarding-shell:has(.iv-care) .chat-hdr{padding:0 16px}
  .iv-content{padding:12px 16px 0}
  .iv-care h1{font-size:27px}
  .ivp-card{padding:12px}
  .iv-care .ivp-pick{gap:10px}
  .iv-care .ivp-det{margin-left:34px}
  .ivp-panel{padding-left:34px}
  .ivp-deliv{grid-template-columns:1fr}
  .iv-care .ivp-pay{padding-left:16px;padding-right:16px}
}
@media(prefers-reduced-motion:reduce){.iv-care *{scroll-behavior:auto!important;transition:none!important}}
