:root{
  /* Web-to-App Figma 235:4057 — warm cream canvas */
  --page-bg:#f5f3e8;
  --device-bg:#f5f3e8;
  --canvas:#f5f3e8;
  --bg:#f5f3e8;--bg2:#ebe6d9;--wh:#fff;
  --ink:#0a0a0a;--text:#1e2939;--text2:#364153;--muted:#6a7282;--meta:#4a5565;
  --border:rgba(30,41,57,.12);--seg-off:rgba(54,65,83,.28);--pct:#6a7282;
  --frost:rgba(255,255,255,.6);--frost2:rgba(255,255,255,.8);
  --shadow-card:0 2px 8px rgba(60,50,30,.06),0 1px 2px rgba(0,0,0,.06);
  --shadow-figma-card:0 2px 8px rgba(60,50,30,.06),0 1px 2px rgba(0,0,0,.06);
  --shadow-card-elevated:0 8px 28px rgba(60,50,30,.08),0 2px 8px rgba(0,0,0,.05);
  --purple:#1e2939;--pm:#364153;--pl:rgba(255,255,255,.55);
  --accent:#0a0a0a;
  /* Primary CTA — warm brown on cream */
  --cta-brown:#6d5542;
  --cta-brown-hover:#5c4738;
  --cta-brown-active:#4a3a2e;
  --green:#26a96c;--red:#e04545;--amber:#d98a0a;
  --r:12px;--r-lg:16px;
  --hair:rgba(60,60,67,.29);--hair-light:rgba(60,60,67,.12);
  --fb:"Inter",-apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,"Segoe UI",Roboto,sans-serif;
  --fs:var(--fb);
  --font-display:"Fraunces",Georgia,"Times New Roman",serif;
  --font-landing:"Inter",-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  /* Figma Web-to-App 228:852 / 228:904 — option cards */
  --opt-bg:rgba(255,255,255,.6);
  --opt-bg-sel:#0a0a0a;
  --opt-shadow-sel:0 4px 6px rgba(0,0,0,.1),0 2px 4px rgba(0,0,0,.1);
  --opt-chk-border:#99a1af;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{height:100%;height:100dvh;scroll-behavior:smooth;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
body{background:var(--page-bg);font-family:var(--fb);color:var(--text);min-height:100%;min-height:100dvh;height:100%;max-height:100dvh;overflow:hidden;font-size:15px;line-height:1.47;letter-spacing:-.018em;-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;font-optical-sizing:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:max(8px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-left)) max(8px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-right))}
.shell{width:min(393px, calc(100vw - 20px));max-width:393px;margin:0 auto;height:100%;max-height:min(100dvh - 16px, 880px);min-height:min(100dvh - 16px, 880px);display:flex;flex-direction:column;overflow:hidden;background:var(--device-bg);border-radius:40px;box-shadow:0 4px 24px rgba(60,50,30,.06),0 1px 3px rgba(0,0,0,.06)}
@media (min-width:540px){
  .shell{max-height:min(100dvh - 32px, 900px);min-height:min(100dvh - 32px, 640px)}
}
/* Real phone browser + installed PWA: full viewport after desktop shell rules so this wins */
@media (max-width:480px),(display-mode:standalone){
  body{padding:0;justify-content:flex-start;align-items:stretch}
  .shell{width:100%;max-width:none;margin:0;border-radius:0;box-shadow:none;min-height:100dvh;max-height:100dvh;height:100dvh;height:100svh;max-height:100svh;min-height:100svh}
  .topbar{padding-left:max(14px, env(safe-area-inset-left));padding-right:max(14px, env(safe-area-inset-right))}
  .prog-wrap{padding-left:max(14px, env(safe-area-inset-left));padding-right:max(14px, env(safe-area-inset-right))}
}

/* ── Topbar / progress (5 segments on landing/results; continuous on quiz) ── */
.topbar{padding:max(10px, env(safe-area-inset-top)) 16px 0;position:relative;z-index:10;background:var(--canvas);flex-shrink:0}
.prog-head{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:22px}
.prog-slot{flex:1;min-width:0;display:flex;align-items:center;min-height:5px;overflow:visible}
.prog-track--segments{display:none;flex:1;gap:6px;align-items:stretch;min-width:0;height:5px}
.prog-seg{flex:1;min-width:0;height:5px;border-radius:999px;background:var(--seg-off);transition:background .4s cubic-bezier(.4,0,.2,1),box-shadow .35s ease}
.prog-seg.is-on{background:#0a0a0a;box-shadow:0 0 0 1px rgba(10,10,10,.08)}
.prog-track--continuous{display:none;flex:1;height:5px;min-width:0;border-radius:999px;background:var(--seg-off);overflow:hidden}
.prog-fill{height:100%;width:0;border-radius:999px;background:#0a0a0a;transition:width .45s cubic-bezier(.4,0,.2,1)}
.topbar.prog-style-segments .prog-track--segments{display:flex}
.topbar.prog-style-segments .prog-track--continuous{display:none!important}
.topbar:not(.prog-style-segments) .prog-track--continuous{display:block}
.topbar:not(.prog-style-segments) .prog-track--segments{display:none!important}
.prog-pct{font-size:13px;font-weight:500;color:var(--pct);flex-shrink:0;min-width:2.5rem;text-align:right;letter-spacing:-.1504px;font-variant-numeric:tabular-nums;line-height:1.25;padding:2px 0}

.brand-bar{display:none;align-items:center;justify-content:center;gap:10px;padding:12px 18px 8px;flex-shrink:0;background:var(--canvas)}
.brand-bar.show{display:flex;border-bottom:1px solid rgba(30,41,57,.06)}
.brand-img{width:28px;height:28px;object-fit:contain;border-radius:22%}
.brand-word{font-size:13px;font-weight:600;letter-spacing:.22em;color:var(--text)}

.phase-pill{font-size:10px;font-weight:600;color:var(--text2);background:transparent;padding:2px 6px;border-radius:0;letter-spacing:.07em;text-transform:uppercase;text-align:center;max-width:100%;line-height:1.3;text-wrap:balance}

/* ── Progress meta row ── */
.prog-wrap{padding:2px 16px 0;flex-shrink:0;background:var(--canvas)}
.prog-meta{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;margin-top:6px}
.back-btn{background:none;border:none;font-size:15px;font-weight:500;color:var(--cta-brown);cursor:pointer;font-family:var(--fb);padding:8px 10px 8px 4px;margin:-8px 0 -8px -4px;min-height:44px;min-width:44px;display:inline-flex;align-items:center;transition:color .15s,opacity .15s,background .15s;justify-self:start;-webkit-tap-highlight-color:transparent;touch-action:manipulation;border-radius:10px}
.back-btn:hover{color:var(--cta-brown-hover);opacity:.92;background:rgba(109,85,66,.06)}
.back-btn:active{background:rgba(109,85,66,.1)}
#phasePill{justify-self:center;text-align:center;grid-column:2;width:100%;max-width:100%;line-height:1.25}
.prog-meta-end{grid-column:3;min-width:0}

/* ── Toast ── */
.mToast{position:fixed;bottom:max(58px, calc(54px + env(safe-area-inset-bottom)));left:50%;transform:translateX(-50%) translateY(16px) scale(.97);background:rgba(28,28,30,.92);color:#fff;font-size:14px;font-weight:500;padding:11px 18px;border-radius:14px;opacity:0;transition:opacity .32s cubic-bezier(.22,1,.36,1),transform .32s cubic-bezier(.22,1,.36,1);z-index:100;max-width:calc(100% - 32px);text-align:center;pointer-events:none;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 8px 32px rgba(0,0,0,.2)}
.mToast.show{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}

/* ── Stage (viewport quiz area; scroll inside, not whole page) ── */
.stage{flex:1;min-height:0;position:relative;display:block;background:var(--canvas)}

/* ── Screens ── */
@keyframes screenIn{
  from{opacity:0;transform:translate3d(0,20px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes screenOut{
  from{opacity:1;transform:translate3d(0,0,0)}
  to{opacity:0;transform:translate3d(0,-14px,0)}
}
.screen{display:none;flex-direction:column;position:absolute;left:0;right:0;top:0;bottom:0;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;scroll-padding-bottom:calc(58px + env(safe-area-inset-bottom));padding:12px 16px 4px}
/* Tap-to-advance quiz steps: hide redundant Continue strip */
.screen--auto > .cta-wrap{display:none!important}
.screen--auto{scroll-padding-bottom:calc(12px + env(safe-area-inset-bottom))}
.screen.active{display:flex;flex-direction:column}
.screen.active:not(.is-out){animation:screenIn .55s cubic-bezier(.22,1,.36,1) both}
.screen.active.is-out{animation:screenOut .38s cubic-bezier(.4,0,.2,1) forwards;pointer-events:none}
.inter{text-align:center;align-items:center}
@media (prefers-reduced-motion:reduce){
  .screen.active:not(.is-out),.screen.active.is-out{animation-duration:.001ms;animation-iteration-count:1}
  .echo.show{animation:none}
  .val-msg.show{animation:none}
  .mToast,.mToast.show{transition:opacity .15s}
  .screen.active:not(.is-out) .choices .choice,.screen.active:not(.is-out) .scale-row .scale-btn,.screen.active:not(.is-out) .grid2 .gchoice{animation:none!important}
}

/* ── Type — one rhythm with options (hed ≈ body scale) ── */
.eyebrow{font-size:11px;font-weight:600;letter-spacing:-.01em;text-transform:none;color:var(--muted);margin-bottom:2px}
.hed{font-family:var(--fs);font-size:clamp(14px,3.85vw,17px);font-weight:600;line-height:1.24;color:var(--text);margin-bottom:8px;letter-spacing:-.02em;text-wrap:balance;text-align:center;max-width:22rem;margin-left:auto;margin-right:auto;padding:0 4px}
.hed em{font-style:italic;font-weight:600}
.sub{font-size:12px;color:var(--text2);line-height:1.38;margin-bottom:8px;letter-spacing:-.01em}
h2.hed + .sub{text-align:center;max-width:22rem;margin-left:auto;margin-right:auto}

/* ── Echo card (match option row type + padding) ── */
.echo{background:var(--wh);border:1px solid var(--hair-light);border-left:3px solid var(--accent);border-radius:0 12px 12px 0;padding:10px 12px;margin:0 0 8px;font-size:14px;line-height:1.34;font-weight:400;color:var(--text2);display:none;box-shadow:var(--shadow-card)}
.echo.show{display:block;animation:echoIn .48s cubic-bezier(.22,1,.36,1) both}
@keyframes echoIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.echo strong{color:var(--text);font-weight:600}
.echo .echo-main{margin:0 0 6px}

/* ── Validation ── */
.val-msg{font-size:11px;color:var(--green);margin-top:8px;display:none;align-items:center;gap:4px;font-weight:500}
.val-msg.show{display:flex;animation:valPop .4s cubic-bezier(.22,1,.36,1) both}
@keyframes valPop{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}

/* ── Choices (Figma 228:852 selected / default; compact) ── */
.choices{display:flex;flex-direction:column;gap:9px;margin:8px 0;background:transparent;border:none;box-shadow:none;border-radius:0;overflow:visible}
.choice{display:flex;align-items:center;gap:10px;min-height:48px;padding:12px 14px;background:var(--wh);border:1px solid rgba(30,41,57,.08);border-radius:14px;cursor:pointer;font-size:14px;font-weight:500;color:#1e2939;letter-spacing:-.24px;line-height:1.28;transition:transform .12s ease,box-shadow .22s ease,background .22s ease,color .22s ease,border-color .22s ease;user-select:none;box-shadow:0 1px 3px rgba(60,50,30,.05);-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.choice:active{transform:scale(.992)}
.choice:hover{box-shadow:0 2px 10px rgba(60,50,30,.08);border-color:rgba(30,41,57,.12)}
.choice:focus-visible{outline:2px solid var(--cta-brown);outline-offset:2px}
.choice.sel{background:var(--opt-bg-sel);color:#fff;border-color:transparent;box-shadow:var(--opt-shadow-sel);font-weight:500}
.choice.sel .ct,.choice.sel .ct small{color:rgba(255,255,255,.88);font-weight:400}
.ci{font-size:15px;min-width:20px;text-align:center;line-height:1.1;flex-shrink:0}
.ct{flex:1;line-height:1.28;min-width:0}
.ct small{display:block;font-size:12px;color:var(--muted);font-weight:400;margin-top:2px;line-height:1.28;letter-spacing:-.01em}
.chk{order:-1;width:16px;height:16px;border-radius:3px;border:1.5px solid var(--opt-chk-border);background:transparent;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:background .2s ease,border-color .2s ease,box-shadow .2s ease;margin:0;box-sizing:border-box}
.choice.sel .chk{background:#fff;border-color:#fff;box-shadow:none}
.choice.sel .chk::after{content:'';width:4px;height:8px;border:solid #0a0a0a;border-width:0 1.75px 1.75px 0;margin-top:-2px;transform:rotate(45deg);border-radius:0}
/* Single-select lists: no checkbox (reads as one answer); multi keeps .chk */
.choices--single .chk{display:none}
/* Long single-select lists — pull question + options together (less scroll) */
#s0 .hed,#s2 .hed{margin-bottom:3px}
#s0 .sub,#s2 .sub{margin-bottom:5px}
#s0 .choices,#s2 .choices{margin-top:2px;margin-bottom:4px}
#s0{padding-bottom:max(12px, env(safe-area-inset-bottom))}
.hint{font-size:11px;color:var(--meta);text-align:center;margin-top:6px}

/* ── Scale (Figma 228:904 — compact) ── */
.scale-row{display:flex;flex-direction:column;align-items:stretch;gap:9px;margin:8px 0;background:transparent;border:none;overflow:visible;width:100%}
.scale-btn{
  width:100%;max-width:100%;box-sizing:border-box;
  min-height:48px;padding:12px 14px;
  background:var(--wh);border:1px solid rgba(30,41,57,.08);border-radius:14px;cursor:pointer;
  font-size:14px;font-weight:500;color:#1e2939;letter-spacing:-.24px;
  transition:transform .12s ease,box-shadow .22s ease,background .22s ease,color .22s ease,border-color .22s ease;
  text-align:left;display:flex;flex-direction:row;align-items:center;gap:10px;
  box-shadow:0 1px 3px rgba(60,50,30,.05);-webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.scale-btn span{font-size:17px;flex-shrink:0;width:28px;text-align:center;line-height:1}
.scale-btn:active{transform:scale(.992)}
.scale-btn:hover{box-shadow:0 2px 10px rgba(60,50,30,.08);border-color:rgba(30,41,57,.12)}
.scale-btn:focus-visible{outline:2px solid var(--cta-brown);outline-offset:2px}
.scale-btn.sel{background:var(--opt-bg-sel);color:#fff;border-color:transparent;box-shadow:var(--opt-shadow-sel);font-weight:500}

/* ── Grid 2 (align with option card tokens) ── */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:6px 0}
.gchoice{display:flex;flex-direction:column;align-items:center;gap:3px;padding:10px 6px;background:var(--wh);border:1px solid rgba(30,41,57,.08);border-radius:14px;cursor:pointer;text-align:center;transition:transform .12s ease,background .2s ease,color .2s ease,box-shadow .2s ease,border-color .2s ease;user-select:none;box-shadow:0 1px 3px rgba(60,50,30,.05);-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.gchoice:active{transform:scale(.98)}
.gchoice:hover{box-shadow:0 2px 10px rgba(60,50,30,.08);border-color:rgba(30,41,57,.12)}
.gchoice:focus-visible{outline:2px solid var(--cta-brown);outline-offset:2px}
.gchoice.sel{background:var(--opt-bg-sel);color:#fff;border-color:transparent;box-shadow:var(--opt-shadow-sel)}
.gchoice.sel .gl,.gchoice.sel .gs{color:rgba(255,255,255,.9)}
.gi{font-size:16px}.gl{font-size:12px;font-weight:600;color:#1e2939;letter-spacing:-.02em}.gs{font-size:11px;color:var(--muted);line-height:1.28}
.gchoice.sel .gs{color:rgba(255,255,255,.75)}

/* Stagger option rows on enter (complements .screen screenIn) */
@keyframes optionFadeIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
.screen.active:not(.is-out) .choices .choice,.screen.active:not(.is-out) .scale-row .scale-btn,.screen.active:not(.is-out) .grid2 .gchoice{animation:optionFadeIn .44s cubic-bezier(.22,1,.36,1) backwards}
.screen.active:not(.is-out) .choices .choice:nth-child(1),.screen.active:not(.is-out) .scale-row .scale-btn:nth-child(1),.screen.active:not(.is-out) .grid2 .gchoice:nth-child(1){animation-delay:.04s}
.screen.active:not(.is-out) .choices .choice:nth-child(2),.screen.active:not(.is-out) .scale-row .scale-btn:nth-child(2),.screen.active:not(.is-out) .grid2 .gchoice:nth-child(2){animation-delay:.08s}
.screen.active:not(.is-out) .choices .choice:nth-child(3),.screen.active:not(.is-out) .scale-row .scale-btn:nth-child(3),.screen.active:not(.is-out) .grid2 .gchoice:nth-child(3){animation-delay:.12s}
.screen.active:not(.is-out) .choices .choice:nth-child(4),.screen.active:not(.is-out) .scale-row .scale-btn:nth-child(4),.screen.active:not(.is-out) .grid2 .gchoice:nth-child(4){animation-delay:.16s}
.screen.active:not(.is-out) .choices .choice:nth-child(5),.screen.active:not(.is-out) .scale-row .scale-btn:nth-child(5),.screen.active:not(.is-out) .grid2 .gchoice:nth-child(5){animation-delay:.2s}
.screen.active:not(.is-out) .choices .choice:nth-child(6),.screen.active:not(.is-out) .scale-row .scale-btn:nth-child(6),.screen.active:not(.is-out) .grid2 .gchoice:nth-child(6){animation-delay:.24s}
.screen.active:not(.is-out) .choices .choice:nth-child(7),.screen.active:not(.is-out) .scale-row .scale-btn:nth-child(7),.screen.active:not(.is-out) .grid2 .gchoice:nth-child(7){animation-delay:.28s}
.screen.active:not(.is-out) .choices .choice:nth-child(8),.screen.active:not(.is-out) .scale-row .scale-btn:nth-child(8),.screen.active:not(.is-out) .grid2 .gchoice:nth-child(8){animation-delay:.32s}
.screen.active:not(.is-out) .choices .choice:nth-child(9),.screen.active:not(.is-out) .scale-row .scale-btn:nth-child(9){animation-delay:.36s}
.screen.active:not(.is-out) .choices .choice:nth-child(10){animation-delay:.4s}

/* ── CTA (frosted bottom bar, native-style primary) ── */
.spacer{flex:1 1 auto;min-height:0}
.cta-wrap{position:sticky;bottom:0;z-index:6;flex-shrink:0;align-self:stretch;margin-top:auto;padding:10px 0 calc(10px + env(safe-area-inset-bottom));margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px;background:linear-gradient(to top,rgba(245,243,232,.99) 0%,rgba(245,243,232,.94) 32%,rgba(245,243,232,.72) 58%,rgba(245,243,232,0) 100%);backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px);border-top:1px solid rgba(30,41,57,.06);box-shadow:0 -12px 36px rgba(60,50,30,.06);display:flex;flex-direction:column;gap:6px}
.btn{width:100%;min-height:44px;padding:10px 18px;background:var(--cta-brown);color:#fff;border:none;border-radius:999px;font-family:var(--fb);font-size:14px;font-weight:600;cursor:pointer;transition:transform .1s ease,background .15s ease,color .15s ease,box-shadow .2s ease;letter-spacing:-.02em;-webkit-tap-highlight-color:transparent;touch-action:manipulation;box-shadow:0 2px 8px rgba(77,58,46,.22)}
.btn:hover{background:var(--cta-brown-hover)}
.btn:active{transform:scale(.985);background:var(--cta-brown-active)}
.btn:disabled{opacity:1;background:#aea89e;color:rgba(255,255,255,.94);cursor:not-allowed;transform:none;box-shadow:0 1px 4px rgba(60,50,30,.08)}
.btn:disabled:hover,.btn:disabled:active{background:#aea89e;transform:none}
.btn:focus-visible{outline:2px solid var(--text);outline-offset:3px}
.back-btn:focus-visible{outline:2px solid var(--text);outline-offset:2px;border-radius:10px}
.btn-sub{font-size:11px;color:var(--muted);text-align:center;line-height:1.35;letter-spacing:-.01em}

/* ── Landing (Figma Web-to-App 235:4057) — compact ── */
#s-land{font-family:var(--font-landing)}
.lp-hero{text-align:center;margin-bottom:0;padding:0 2px}
.lp-badge{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:30px;background:rgba(255,255,255,.6);border-radius:999px;padding:5px 12px 5px 10px;margin:0 auto 10px;box-shadow:none}
.lp-badge-ic{font-size:14px;line-height:1;display:inline-flex;color:#0a0a0a}
.lp-badge-txt{font-size:12px;font-weight:400;color:#364153;letter-spacing:-.12px;line-height:17px}
.lp-h1{font-family:var(--font-landing);font-size:clamp(19px,5.4vw,24px);font-weight:500;line-height:1.2;color:#1e2939;margin:0 auto;max-width:300px;letter-spacing:.24px}
.lp-h1-line{display:inline-block;letter-spacing:.28px}
.lp-h1 em{display:block;margin-top:.12em;font-style:italic;font-weight:500;letter-spacing:0}
.lp-sub{font-size:12px;color:var(--text2);line-height:1.45;letter-spacing:-.01em;max-width:300px;margin:10px auto 0;text-wrap:balance}
.sp-strip{display:flex;align-items:flex-start;justify-content:space-between;gap:5px;padding:0;margin:12px 0 10px}
.sp-item{text-align:center;flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:4px}
.sp-n{font-family:var(--font-landing);font-size:18px;font-weight:400;color:#1e2939;line-height:22px;letter-spacing:.05px}
.sp-l{font-size:12px;font-weight:400;color:#6a7282;line-height:16px;margin:0;max-width:6.5rem}
.contrast-strip{display:flex;flex-direction:column;gap:8px;margin:0 0 4px;padding:0 2px}
.contrast-row{display:flex;flex-direction:row;align-items:flex-start;gap:0;background:rgba(255,255,255,.8);border-radius:12px;padding:11px 12px 10px;box-shadow:var(--shadow-figma-card);border:none}
.cr-col{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.cr-other{padding-right:6px}
.cr-ml{padding-left:6px}
.cr-label{display:block;font-size:11px;font-weight:400;color:#6a7282;text-transform:uppercase;letter-spacing:.28px;line-height:14px}
.cr-label--brand{font-weight:600;color:#1e2939;letter-spacing:.28px}
.cr-body{margin:0;font-size:12px;font-weight:400;line-height:16px;color:#364153;letter-spacing:-.12px}
.cr-body--brand{font-weight:600;color:#1e2939;letter-spacing:-.12px}
#s-land .sp-l{font-size:12px;line-height:1.32;color:#4a5565;max-width:none;padding:0 2px;text-wrap:balance}
#s-land .contrast-strip{gap:8px;margin-bottom:10px}
#s-land .contrast-row{padding:11px 12px 10px}
#s-land .cr-other{padding-right:10px}
#s-land .cr-ml{padding-left:10px}
#s-land .cta-wrap--land{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border-top:none;box-shadow:none;margin-left:0;margin-right:0;padding-left:0;padding-right:0;margin-top:0;padding-top:10px;padding-bottom:max(10px, env(safe-area-inset-bottom))}
#s-land .btn--land{min-height:48px;padding:12px 18px;border-radius:12px;font-family:var(--font-landing);font-size:15px;font-weight:500;line-height:22px;letter-spacing:-.3px;background:var(--cta-brown);box-shadow:0 1px 3px rgba(77,58,46,.18),0 1px 2px rgba(77,58,46,.12)}
#s-land .btn--land:hover{background:var(--cta-brown-hover)}
.lp-cta-hint{font-size:12px;color:var(--muted);text-align:center;margin-top:12px;line-height:1.4;max-width:280px;margin-left:auto;margin-right:auto;letter-spacing:-.01em}
.lp-cta-hint strong{color:var(--text2);font-weight:600}

/* Category contrast (quiz / legacy rows elsewhere) */
.contrast-row--legacy{display:flex;align-items:stretch;border-radius:var(--r-lg);overflow:hidden;background:var(--wh);border:1px solid var(--hair-light);box-shadow:var(--shadow-card)}
.cr-left{flex:1;padding:12px 14px;font-size:14px;color:var(--text2);line-height:1.32;border-right:.5px solid var(--hair-light)}
.cr-left strong{display:block;font-size:12px;font-weight:400;color:var(--muted);text-transform:uppercase;letter-spacing:.3px;margin-bottom:6px}
.cr-right{flex:1;padding:12px 14px;font-size:14px;color:var(--text);font-weight:600;line-height:1.32}
.cr-right strong{display:block;font-size:12px;font-weight:600;color:var(--text);text-transform:uppercase;letter-spacing:.3px;margin-bottom:6px}
.sp-div{display:none}

/* benefit tiles */
.benefit-list{display:flex;flex-direction:column;gap:0;margin:6px 0;border-radius:var(--r-lg);overflow:hidden;background:var(--wh);box-shadow:var(--shadow-card);border:1px solid var(--hair-light)}
.benefit-item{display:flex;align-items:flex-start;gap:10px;padding:11px 12px 11px 14px;background:transparent;border:none;border-bottom:.5px solid var(--hair-light);border-radius:0;box-shadow:none}
.benefit-item:last-child{border-bottom:none}
.bi-icon{font-size:21px;flex-shrink:0;margin-top:0;line-height:1}
.bi-text strong{font-size:15px;font-weight:600;display:block;margin-bottom:3px;color:var(--text);letter-spacing:-.02em}
.bi-text span{font-size:13px;color:var(--muted);line-height:1.36;letter-spacing:-.01em}

.quiz-meta{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin-top:8px;letter-spacing:-.01em}
.press-strip{display:none}

/* Long scroll screens: no final sticky CTA — keep home-indicator clearance */
#s-result{padding-bottom:max(28px, env(safe-area-inset-bottom))}

/* ── Interstitial cards ── */
.icard{background:var(--wh);border:1px solid var(--hair-light);border-radius:var(--r-lg);padding:11px 12px;margin:4px 0;text-align:left;box-shadow:var(--shadow-card)}
.icard-head{font-size:11px;font-weight:600;color:var(--text);margin-bottom:6px;text-transform:uppercase;letter-spacing:.06em;display:flex;align-items:center;gap:5px}
.icard p{font-size:13px;color:var(--text2);line-height:1.55}
.icard strong{color:var(--text)}
.icard-stat{background:rgba(60,60,67,.05);border-radius:var(--r);padding:10px 12px;margin-top:8px;text-align:center}
.icard-n{font-family:var(--fs);font-size:28px;font-weight:500;color:var(--text)}
.icard-l{font-size:12px;color:var(--text2);line-height:1.38}

/* Mid-quiz insight A — subtle color on cream */
#mqi-a .eyebrow{color:#5a6d62}
#mqi-a .hed em{color:#6d5542}
#mqi-a #mqi-a-card{
  background:linear-gradient(165deg, #fff 0%, #faf9f5 45%, #f4f2ec 100%);
  border:1px solid rgba(109,85,66,.18);
  border-left:3px solid var(--cta-brown);
  box-shadow:0 2px 12px rgba(109,85,66,.06),var(--shadow-card);
}
#mqi-a #mqi-a-card .icard-head{color:#5c5348}
#mqi-a #mqi-a-card #mqi-a-text{line-height:1.4;margin:0 0 6px}
#mqi-a .icard:not(#mqi-a-card) #mqi-a-fact{line-height:1.4;margin:0}
#mqi-a #mqi-a-card .icard-stat{
  background:linear-gradient(180deg, rgba(38,169,108,.14) 0%, rgba(38,169,108,.06) 100%);
  border:1px solid rgba(38,169,108,.22);
}
#mqi-a #mqi-a-card .icard-n{color:#1f6b4a}
#mqi-a #mqi-a-card .icard-l{color:#3d5c50}
#mqi-a .icard:not(#mqi-a-card){
  background:linear-gradient(180deg, #f7f6fb 0%, #fff 55%);
  border:1px solid rgba(95,90,140,.14);
  border-left:3px solid #7b6fa3;
  box-shadow:0 2px 12px rgba(95,90,140,.05),var(--shadow-card);
}
#mqi-a .icard:not(#mqi-a-card) .icard-head{color:#5a5478}

/* Mid-quiz insight B — core loop type (two stacked cards) */
#mqi-b{padding-bottom:max(8px, env(safe-area-inset-bottom))}
#mqi-b .hed{margin-bottom:4px}
#mqi-b .hed em{color:var(--cta-brown)}
#mqi-b > .icard:nth-child(2){
  background:linear-gradient(165deg, #fff 0%, #f9f7fd 45%, #f0ecf7 100%);
  border:1px solid rgba(107,90,150,.16);
  border-left:3px solid #7b6fa3;
  box-shadow:0 2px 14px rgba(95,80,130,.07),var(--shadow-card);
  padding:6px 10px;
  margin-bottom:14px;
}
#mqi-b > .icard:nth-child(2) .icard-head{color:#57496e;margin-bottom:2px}
#mqi-b > .icard:nth-child(2) #mqi-b-text{margin:0;line-height:1.36}
#mqi-b > .icard:nth-child(2) p strong{color:#3d3250}
#mqi-b > .icard:nth-child(3){
  background:linear-gradient(165deg, #fff 0%, #faf9f5 45%, #f3f1ea 100%);
  border:1px solid rgba(109,85,66,.15);
  border-left:3px solid var(--cta-brown);
  box-shadow:0 2px 14px rgba(77,58,46,.07),var(--shadow-card);
  padding:6px 10px;
  margin-top:0;
}
#mqi-b > .icard:nth-child(3) .icard-head{color:#5c4d42;margin-bottom:2px}
#mqi-b > .icard:nth-child(3) #mqi-b-implication{margin:0 0 3px;line-height:1.36}
#mqi-b > .icard:nth-child(3) p strong{color:#4a3f36}
#mqi-b > .icard:nth-child(3) .icard-stat{
  background:linear-gradient(180deg, rgba(38,169,108,.13) 0%, rgba(38,169,108,.05) 100%);
  border:1px solid rgba(38,169,108,.24);
  box-shadow:0 2px 10px rgba(38,169,108,.08);
  margin-top:4px;
  padding:7px 10px;
}
#mqi-b > .icard:nth-child(3) .icard-n{color:#157a4d}
#mqi-b > .icard:nth-child(3) .icard-l{color:#3d5c50}

/* ── The big idea card ── */
.idea-card{background:var(--ink);border-radius:var(--r);padding:18px 16px;margin:8px 0;text-align:center;box-shadow:var(--shadow-card)}
.idea-card .idea-label{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:8px}
.idea-card .idea-hed{font-family:var(--font-display);font-size:17px;font-weight:600;line-height:1.3;color:#fff;margin-bottom:8px;font-style:italic;letter-spacing:-.02em}
.idea-card .idea-sub{font-size:13px;color:rgba(255,255,255,.72);line-height:1.5}

/* ── Thought loop viz ── */
.loop-viz{display:flex;flex-direction:column;align-items:center;gap:0;margin:12px 0;position:relative}
.loop-node{background:var(--frost2);border:1px solid rgba(30,41,57,.1);border-radius:var(--r);padding:10px 14px;font-size:13px;font-weight:500;color:var(--text);text-align:center;width:88%;max-width:320px;position:relative;z-index:1;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.loop-node.target{border-color:rgba(10,10,10,.2);background:var(--frost2);color:var(--text);box-shadow:var(--shadow-card)}
.loop-arrow{font-size:16px;color:var(--seg-off);line-height:1;margin:3px 0;z-index:0}
.loop-arrow.target{color:var(--text)}
.loop-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--green);background:#edf9f3;border:1px solid #c3edd9;border-radius:99px;padding:4px 12px;margin-top:-2px;margin-bottom:6px;z-index:2}

/* s4 — What TRT is: warmer hero + clearer flow (only screen using idea-card / this viz) */
#s4{padding-bottom:max(8px, env(safe-area-inset-bottom))}
#s4 .hed{margin-bottom:8px}
#s4 .hed em{color:var(--cta-brown)}
#s4 .idea-card{
  background:linear-gradient(155deg, #3d2e26 0%, #524031 38%, var(--cta-brown) 100%);
  border-radius:14px;
  padding:16px 14px;
  margin:8px 0 10px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 10px 32px rgba(77,58,46,.22),0 2px 10px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.08);
}
#s4 .idea-card .idea-label{color:rgba(255,245,235,.62);letter-spacing:.12em}
#s4 .idea-card .idea-hed{font-size:clamp(15px,4vw,18px);line-height:1.35;color:#fff;font-weight:500}
#s4 .idea-card .idea-sub{color:rgba(255,250,245,.78);max-width:28em;margin:0 auto}
#s4 .loop-viz{
  width:100%;
  max-width:320px;
  margin-left:auto;
  margin-right:auto;
  margin-top:2px;
  padding:10px 10px 9px;
  background:linear-gradient(180deg, rgba(255,255,255,.72) 0%, rgba(245,243,232,.92) 100%);
  border:1px solid rgba(109,85,66,.14);
  border-radius:14px;
  box-shadow:0 4px 20px rgba(60,50,30,.06),inset 0 1px 0 rgba(255,255,255,.8);
}
#s4 .loop-viz .loop-node{
  width:100%;
  max-width:none;
  border-radius:10px;
  padding:7px 10px 7px 12px;
  text-align:left;
  font-size:12px;
  font-weight:600;
  line-height:1.25;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(30,41,57,.08);
  box-shadow:0 1px 3px rgba(60,50,30,.05);
}
#s4 .loop-viz > .loop-node:nth-child(1){border-left:3px solid #8b9b8e}
#s4 .loop-viz > .loop-node:nth-child(3){border-left:3px solid #a8987a}
#s4 .loop-viz > .loop-node:nth-child(5){border-left:3px solid #c4a35a}
#s4 .loop-viz > .loop-node:nth-child(7){border-left:3px solid #b87a5c}
#s4 .loop-viz .loop-arrow{font-size:11px;color:#99a1af;margin:0;letter-spacing:.02em;line-height:1}
#s4 .loop-viz .loop-arrow.target{
  font-size:10px;
  font-weight:600;
  color:#5c5348;
  margin:5px 0 3px;
  padding:5px 8px;
  background:rgba(109,85,66,.08);
  border-radius:8px;
  border:1px dashed rgba(109,85,66,.25);
  width:100%;
  max-width:none;
  text-align:center;
  line-height:1.3;
}
#s4 .loop-viz .loop-label{
  font-size:8px;
  letter-spacing:.09em;
  padding:4px 10px;
  margin-top:-1px;
  margin-bottom:4px;
  background:linear-gradient(180deg, #e8f7ef 0%, #d8f0e4 100%);
  border-color:rgba(38,169,108,.35);
  color:#157a4d;
  box-shadow:0 1px 5px rgba(38,169,108,.1);
}
#s4 .loop-viz .loop-node.target{
  background:linear-gradient(135deg, #f0faf5 0%, #e8f5ee 100%);
  border:1px solid rgba(38,169,108,.35);
  border-left:3px solid var(--green);
  color:#1a3d2e;
  font-weight:600;
  font-size:12px;
  padding:8px 10px;
  box-shadow:0 2px 10px rgba(38,169,108,.1);
  text-align:center;
}

/* s18 — what would change (two-line centered title) */
#s18 .hed{text-align:center;margin-left:auto;margin-right:auto;max-width:20em;margin-bottom:12px;line-height:1.3;padding:0 4px}
#s18 .hed em{color:var(--cta-brown)}
#s18 .choices{margin-top:4px}

/* s20 — You're not alone (Figma 235:4751 layout; illustration 235:4774) */
#s20{
  padding:8px 14px max(8px, env(safe-area-inset-bottom));
  justify-content:space-between;
}
#s20 .s20-stack{
  display:flex;flex-direction:column;align-items:center;gap:18px;width:100%;
  flex:1 1 auto;min-height:0;padding-top:2px;
}
#s20 .s20-hed{
  font-family:var(--fb);font-size:clamp(18px,5vw,26px);font-weight:500;line-height:1.22;
  letter-spacing:.01em;color:#1e2939;text-align:center;max-width:21rem;margin:0;padding:0 2px;
}
#s20 .s20-illustration-wrap{
  width:100%;max-width:272px;margin:0 auto;border-radius:14px;overflow:hidden;
  background:#fff;
  box-shadow:0 3px 18px rgba(0,0,0,.07);
}
#s20 .s20-illustration{display:block;width:100%;height:auto;aspect-ratio:481/306;object-fit:contain}
#s20 .s20-lead{
  font-family:var(--fb);font-size:clamp(14px,3.6vw,19px);font-weight:500;line-height:1.4;
  max-width:20.5rem;margin:0;padding:0 2px;text-align:center;color:#1e2939;letter-spacing:-.01em;
}
#s20 .s20-lead strong{font-weight:600}
#s20 .cta-wrap{padding-top:4px}
#s20 .cta-wrap .btn{
  min-height:46px;padding:12px 18px;font-size:16px;font-weight:500;letter-spacing:-.02em;
  border-radius:999px;background:#0a0a0a;color:#fff;
  box-shadow:0 3px 12px rgba(0,0,0,.12);
}
#s20 .cta-wrap .btn:hover{background:#262626}
#s20 .cta-wrap .btn:active{background:#141414}

/* ── Milestone ── */
.milestone{background:var(--frost2);border:none;border-radius:var(--r);padding:16px 14px;text-align:center;margin:6px 0;box-shadow:var(--shadow-card)}
.ms-icon{font-size:30px;margin-bottom:8px}
.ms-title{font-family:var(--font-display);font-size:18px;font-weight:600;color:var(--text);margin-bottom:4px;letter-spacing:-.02em;line-height:1.25}
.ms-sub{font-size:13px;color:var(--text2)}
.ms-bar-wrap{background:rgba(209,213,220,.5);border-radius:99px;height:6px;margin:10px 0 4px;overflow:hidden}
.ms-bar{height:100%;border-radius:99px;background:var(--ink);transition:width 1s cubic-bezier(.4,0,.2,1)}
.milestone--checkpoint{background:var(--wh);border:1px solid rgba(109,85,66,.14);border-radius:var(--r-lg);padding:18px 16px;margin:8px 0;box-shadow:var(--shadow-card)}
.milestone--checkpoint .ms-bar-wrap{height:8px;margin:14px 0 6px;background:rgba(209,213,220,.55)}
.milestone--checkpoint .ms-bar{background:linear-gradient(90deg,#0a0a0a 0%,#2d3748 100%)}
.ms-icon--checkpoint{
  width:52px;height:52px;margin-left:auto;margin-right:auto;border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(145deg,rgba(30,41,57,.08) 0%,rgba(109,85,66,.1) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 2px 10px rgba(60,50,30,.06);
  font-size:26px;line-height:1;margin-bottom:10px;
}
#ms2{justify-content:space-between;padding-top:10px}
#ms2 .checkpoint-stack{display:flex;flex-direction:column;align-items:center;width:100%;max-width:21.5rem;margin:0 auto}
#ms2 .ms2-lead{font-family:var(--font-display);font-size:17px;font-weight:600;color:var(--text);text-align:center;margin:14px 0 0;line-height:1.35;letter-spacing:-.02em;text-wrap:balance}
#ms2 .ms2-sub{font-size:13px;color:var(--text2);text-align:center;margin-top:8px;line-height:1.45;max-width:20rem;text-wrap:balance}
#ms2 .cta-wrap--checkpoint{margin-top:20px}
#ms2 .btn-sub{color:var(--text2)}

/* ── Testimonial ── */
.testimonial{background:var(--wh);border:1px solid var(--hair-light);border-radius:18px;padding:16px 16px 14px;margin:0;box-shadow:var(--shadow-card)}
.stars{color:#c9a227;font-size:13px;letter-spacing:3px;line-height:1}
.tq{font-family:var(--font-display);font-size:15px;font-weight:500;line-height:1.55;color:var(--text);font-style:italic;margin:10px 0 12px;letter-spacing:-.015em;text-wrap:balance}
.ta{display:flex;align-items:center;gap:12px}
.ta-av{width:36px;height:36px;border-radius:50%;background:var(--frost);display:flex;align-items:center;justify-content:center;font-size:18px}
.ta-name{font-size:13px;font-weight:600;color:var(--text)}
.ta-role{font-size:12px;color:var(--muted)}

/* Real results (s26) — stacked cards, editorial headline, elevated cards */
#s26.inter{align-items:stretch;text-align:left}
#s26 .hed{
  font-family:var(--font-display);
  font-size:clamp(1.2rem, 4.5vw, 1.45rem);
  font-weight:600;
  line-height:1.3;
  letter-spacing:-.03em;
  text-align:center;
  margin-bottom:20px;
  margin-top:2px;
  max-width:21rem;
  margin-left:auto;
  margin-right:auto;
  padding:0 10px;
  color:#1a2332;
}
#s26 .hed em{font-style:italic;font-weight:600;color:#141c28}
#s26 .testimonial{
  align-self:stretch;width:100%;max-width:100%;min-width:0;margin:0 0 16px;text-align:left;box-sizing:border-box;
  position:relative;overflow:hidden;
  background:linear-gradient(165deg,#fff 0%,#faf8f5 55%,#f7f4ee 100%);
  border:1px solid rgba(30,41,57,.08);
  border-radius:20px;
  padding:18px 18px 16px 20px;
  box-shadow:
    0 1px 0 rgba(255,255,255,.95) inset,
    0 10px 32px rgba(30,41,57,.07),
    0 2px 10px rgba(60,50,30,.05);
}
#s26 .testimonial::before{
  content:'';
  position:absolute;left:0;top:12px;bottom:12px;width:3px;border-radius:0 3px 3px 0;
  background:linear-gradient(180deg,rgba(109,85,66,.55) 0%,rgba(109,85,66,.2) 100%);
}
#s26 .testimonial:last-of-type{margin-bottom:10px}
#s26 .stars{
  display:block;
  font-size:13px;
  letter-spacing:2px;
  line-height:1;
  color:#b8891e;
  text-shadow:0 1px 0 rgba(255,255,255,.45),0 -1px 0 rgba(90,70,20,.12);
}
#s26 .tq{
  overflow-wrap:break-word;
  margin:12px 0 16px;
  font-size:15px;
  line-height:1.62;
  color:#1e2939;
  letter-spacing:-.012em;
}
#s26 .ta{gap:14px}
#s26 .ta-av{
  width:42px;height:42px;font-size:19px;
  background:linear-gradient(160deg,rgba(255,255,255,.95) 0%,rgba(245,243,232,.98) 100%);
  box-shadow:0 0 0 2px rgba(255,255,255,.95),0 4px 14px rgba(30,41,57,.1);
}
#s26 .ta-name{font-size:13px;font-weight:600;letter-spacing:-.02em}
#s26 .ta-role{font-size:12px;color:var(--muted);line-height:1.35}
#s26 .spacer{flex:1 1 auto;min-height:12px}
#s26 .cta-wrap{background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;border-top:none!important;box-shadow:none!important;margin-left:0!important;margin-right:0!important;padding-left:0!important;padding-right:0!important;padding-top:18px;padding-bottom:max(12px, env(safe-area-inset-bottom))}
#s26 .btn{min-height:50px;padding:14px 20px;font-size:15px;font-weight:600;letter-spacing:-.02em;box-shadow:0 3px 14px rgba(77,58,46,.28),0 1px 0 rgba(255,255,255,.12) inset}
#s26 .btn:hover{background:var(--cta-brown-hover);box-shadow:0 4px 18px rgba(77,58,46,.32)}
#s26 .btn:active{background:var(--cta-brown-active);transform:scale(.992)}
@keyframes s26CardIn{from{opacity:0;transform:translate3d(0,14px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
#s26.active:not(.is-out) .testimonial:nth-child(2){animation:s26CardIn .52s cubic-bezier(.22,1,.36,1) .06s both}
#s26.active:not(.is-out) .testimonial:nth-child(3){animation:s26CardIn .52s cubic-bezier(.22,1,.36,1) .14s both}
@media (prefers-reduced-motion:reduce){
  #s26.active:not(.is-out) .testimonial:nth-child(2),
  #s26.active:not(.is-out) .testimonial:nth-child(3){animation:none}
}

/* ── Loading ── */
.loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;min-height:0;padding:16px 14px;text-align:center}
.loader-ring{width:48px;height:48px;border-radius:50%;border:3px solid rgba(209,213,220,.6);border-top-color:var(--ink);animation:spin .85s linear infinite;margin-bottom:14px}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-for{font-family:var(--font-display);font-size:clamp(19px,4.8vw,22px);font-weight:600;color:var(--text);margin-bottom:6px;letter-spacing:-.02em;line-height:1.25}
.ls-wrap{width:100%;margin:14px 0;display:flex;flex-direction:column;gap:8px}
.ls-item{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--frost2);border:none;border-radius:var(--r);font-size:13px;color:var(--muted);transition:all .4s;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.ls-item.done{color:var(--text);box-shadow:var(--shadow-card)}
.ls-item.act{color:var(--text);border:1px solid rgba(10,10,10,.15);box-shadow:var(--shadow-card)}
.ls-dot{width:20px;height:20px;border-radius:50%;background:rgba(209,213,220,.6);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:10px;transition:all .4s}
.ls-item.done .ls-dot{background:var(--green);color:#fff}
.ls-item.act .ls-dot{background:var(--ink);animation:pulse 1s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.45}}
.loading-sub{font-size:13px;color:var(--muted);line-height:1.45;max-width:22rem;margin:0 auto;text-wrap:balance}
#s-loading .loading-screen{min-height:100%;padding-bottom:max(20px, env(safe-area-inset-bottom))}
/* Final name step */
#s34{padding-top:max(4px, env(safe-area-inset-top))}
#s34 .eyebrow{text-align:center;margin-bottom:6px}
#s34 .val-msg{margin-top:8px}
#s34 .text-input{margin-bottom:4px;text-align:left}

/* ── Analysis scores (Figma 235:5534) ── */
.analysis-head-eyebrow{text-align:center;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#4a5565;margin-bottom:8px}
.analysis-head-title{font-family:var(--font-display);text-align:center;font-size:clamp(26px,6vw,30px);font-weight:600;line-height:1.2;color:#1e2939;margin:0 0 8px;letter-spacing:-.025em}
.analysis-head-sub{text-align:center;font-size:14px;color:#6a7282;margin:0 0 4px;line-height:1.4}
.analysis-scores-card{background:rgba(255,255,255,.8);border-radius:20px;padding:16px 18px;box-shadow:var(--shadow-card);margin:12px 0 10px}
.analysis-scores-title{font-size:18px;font-weight:600;color:#1e2939;margin:0 0 20px;letter-spacing:-.02em}
.analysis-score-row{margin-bottom:14px}
.analysis-score-row:last-child{margin-bottom:0}
.analysis-score-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:8px}
.analysis-score-lbl-wrap{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.analysis-score-lbl{font-size:14px;font-weight:600;color:#1e2939;letter-spacing:-.02em;line-height:1.25}
.analysis-score-hint{font-size:12px;font-weight:400;color:#6a7282;line-height:1.35;letter-spacing:-.01em;text-wrap:balance}
.analysis-score-val{font-size:14px;font-weight:600;color:#1e2939;flex-shrink:0;line-height:1.2;padding-top:1px}
.analysis-score-track{height:8px;background:rgba(229,231,235,.6);border-radius:999px;overflow:hidden}
.analysis-score-fill{height:100%;border-radius:999px;transition:width 1.2s cubic-bezier(.4,0,.2,1);min-width:0}
.analysis-score-fill--loop{background:#ff6467}
.analysis-score-fill--exit{background:#0a0a0a}
.analysis-score-fill--comp{background:#00c950}
.analysis-score-fill--meta{background:#ff8904}
.analysis-score-fill--threat{background:#0a0a0a}
.analysis-score-fill--stick{background:#6366f1}
#s-analysis .summary-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
  margin:4px 0 10px;
}
#s-analysis .analysis-scores-card{
  background:var(--wh);
  border:1px solid rgba(30,41,57,.08);
  border-radius:16px;
  box-shadow:0 2px 12px rgba(60,50,30,.06);
  padding:16px 16px 14px;
}
#s-analysis .analysis-scores-title{font-size:15px;font-weight:600;margin:0 0 14px;letter-spacing:-.02em;color:var(--text)}
#s-analysis .analysis-score-row{margin-bottom:12px}
#s-analysis .analysis-score-lbl{font-size:13px;color:var(--text)}
#s-analysis .analysis-score-hint{font-size:11px;color:var(--meta);line-height:1.38}
#s-analysis .analysis-score-val{font-size:13px;align-self:flex-start}
#s-analysis .analysis-score-track{height:7px;border-radius:999px;background:rgba(229,231,235,.85)}
#s-analysis .summary-tile,#s-analysis .result-loop-card{background:var(--wh)}
#s-analysis .result-loop-card{margin:0 0 10px}
#s-analysis .analysis-head-title{margin-bottom:6px}
#s-analysis .analysis-head-sub{margin-bottom:4px}
#s-analysis .summary-tile{padding:6px 8px 7px}
#s-analysis .summary-tile-head{margin-bottom:2px}
#s-analysis{padding-bottom:max(12px, env(safe-area-inset-bottom))}
#s-analysis .cta-wrap .btn{
  min-height:48px;padding:12px 20px;font-size:14px;border-radius:999px;
  background:var(--ink);box-shadow:0 2px 8px rgba(0,0,0,.12);
}
#s-analysis .cta-wrap .btn:hover{background:#262626}
#s-analysis .cta-wrap .btn:active{background:#141414}

.intervention-line{text-align:center;font-size:13px;color:var(--meta);margin:-4px 0 16px;line-height:1.45}
.intervention-line strong{color:var(--text);font-weight:600}

/* ── Result summary (Figma 235:5609) ── */
.result-hero{text-align:center;margin-bottom:12px}
.result-hero-eyebrow{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#4a5565;margin-bottom:8px}
.result-hero-title{font-family:var(--font-display);font-size:clamp(26px,6vw,30px);font-weight:600;line-height:1.2;color:#1e2939;margin:0 0 8px;letter-spacing:-.025em}
.result-hero-title em{font-style:italic;font-weight:600}
.result-hero-sub{font-size:14px;color:#6a7282;margin:0}
.summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 10px}
.summary-tile{background:var(--wh);border:1px solid rgba(30,41,57,.08);border-radius:14px;padding:9px 10px 10px;box-shadow:0 1px 4px rgba(60,50,30,.05);min-height:0;display:flex;flex-direction:column;align-items:stretch;gap:0}
.summary-tile-head{display:flex;align-items:flex-start;gap:6px;margin-bottom:4px}
.summary-tile-ic{font-size:18px;line-height:1.2;flex-shrink:0;margin-top:1px}
.summary-tile-lbl{font-size:10px;font-weight:600;color:#6a7282;text-transform:uppercase;letter-spacing:.08em;margin:0;line-height:1.35;flex:1;min-width:0}
.summary-tile-val{font-size:14px;font-weight:600;color:#1e2939;line-height:1.35;word-break:break-word;text-wrap:balance}
.result-loop-card{background:var(--wh);border:1px solid rgba(30,41,57,.08);border-radius:16px;padding:12px 14px 14px;box-shadow:0 2px 12px rgba(60,50,30,.06);margin:0 0 12px;text-align:left}
.result-loop-card .rl-head{display:flex;align-items:center;gap:8px;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid rgba(30,41,57,.08);font-size:15px;font-weight:600;color:#1e2939;letter-spacing:-.02em;line-height:1.3}
.result-loop-card .rl-head .ic{font-size:22px;line-height:1;flex-shrink:0}
.result-loop-card .rl-body{font-size:14px;line-height:1.55;color:#364153;margin:0;text-wrap:pretty}

/* s-result — training plan summary (matches app-style plan screen) */
#s-result .result-hero{margin-bottom:14px}
#s-result .plan-card{
  background:rgba(255,255,255,.94);
  border:1px solid rgba(30,41,57,.09);
  border-radius:16px;
  padding:16px 16px 14px;
  margin:0 0 12px;
  box-shadow:0 2px 14px rgba(60,50,30,.06),var(--shadow-card);
}
#s-result .plan-card--meter .meter-wrap{margin:0}
#s-result .plan-card--meter .meter-label-row{margin-bottom:4px;justify-content:center}
#s-result .plan-card--meter .meter-lbl{font-size:13px;font-weight:600;text-align:center;width:100%}
#s-result .meter-badge-center{text-align:center;margin:2px 0 12px;min-height:1.5em}
#s-result .meter-badge-center .meter-badge{vertical-align:middle}
#s-result .summary-grid{margin:2px 0 8px;gap:6px}
#s-result .summary-tile{
  justify-content:flex-start;
  padding:6px 8px 7px;
  gap:0;
}
#s-result .summary-tile-head{margin-bottom:2px}
#s-result .summary-tile-val{font-size:14px;line-height:1.25}
#s-result .plan-daily-note{
  font-size:12px;color:#6a7282;text-align:center;margin:-4px 0 14px;line-height:1.4;
}
#s-result .plan-downloads{
  text-align:center;padding:4px 0 22px;margin-top:10px;
}
#result-plan-downloads{scroll-margin-top:96px}
#s-result .plan-downloads-inner{
  background:var(--wh);
  border:1px solid rgba(30,41,57,.1);
  border-radius:18px;
  padding:20px 16px 18px;
  box-shadow:0 4px 22px rgba(60,50,30,.08),0 1px 3px rgba(0,0,0,.04);
}
#s-result .plan-downloads-eyebrow{
  font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#157a4d;margin:0 0 8px;
}
#s-result .plan-dl-title{
  font-family:var(--font-display);font-size:clamp(19px,5vw,22px);font-weight:600;line-height:1.25;color:var(--text);
  margin:0 0 8px;letter-spacing:-.03em;text-wrap:balance;
}
#s-result .plan-dl-sub{
  font-size:14px;line-height:1.45;color:var(--text2);margin:0 0 12px;text-wrap:balance;
}
#s-result .plan-dl-trust{
  font-size:12px;font-weight:500;color:var(--meta);margin:0 0 16px;line-height:1.35;
}
#s-result .plan-dl-trust strong{color:var(--text2);font-weight:600}
#s-result .store-badges{display:flex;flex-direction:column;gap:12px;align-items:stretch;max-width:300px;margin:0 auto}
#s-result .store-badge{
  display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:14px;
  width:100%;padding:14px 16px;border-radius:14px;
  font-size:13px;font-weight:600;text-align:left;text-decoration:none;color:#fff;
  border:1px solid transparent;
  box-shadow:0 4px 16px rgba(0,0,0,.2);
  transition:transform .12s ease,box-shadow .2s ease,filter .15s ease;
  -webkit-tap-highlight-color:transparent;
}
#s-result .store-badge:hover{filter:brightness(1.05);box-shadow:0 6px 22px rgba(0,0,0,.25)}
#s-result .store-badge:active{transform:scale(.987)}
#s-result .store-badges > .store-badge:first-child{
  padding:15px 17px;border-radius:15px;
  box-shadow:0 6px 22px rgba(0,0,0,.24);
}
#s-result .store-badge--ios{
  background:linear-gradient(180deg,#2c2c2e 0%,#000 100%);
  border-color:rgba(255,255,255,.1);
}
#s-result .store-badge--gp{
  background:linear-gradient(180deg,#00c853 0%,#01875f 100%);
  border-color:rgba(0,0,0,.12);
}
#s-result .store-badge-ic{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px}
#s-result .store-badge-ic svg{width:28px;height:28px;display:block}
#s-result .store-badge-labels{display:flex;flex-direction:column;align-items:flex-start;gap:2px;line-height:1.2}
#s-result .store-badge-small{font-size:11px;font-weight:500;opacity:.9}
#s-result .store-badge-strong{font-size:15px;font-weight:700;letter-spacing:-.02em}

/* Legacy chart (unused on analysis; kept for any other reference) */
.chart-section{background:var(--frost2);border:none;border-radius:var(--r);padding:20px;margin:12px 0;box-shadow:var(--shadow-card)}
.chart-title{font-size:14px;font-weight:600;color:var(--text);margin-bottom:16px}
.chart-row{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.chart-row:last-child{margin-bottom:0}
.chart-lbl{font-size:12px;color:var(--muted);width:88px;flex-shrink:0;text-align:right}
.chart-bar-wrap{flex:1;height:8px;background:rgba(209,213,220,.45);border-radius:99px;overflow:hidden}
.chart-bar{height:100%;border-radius:99px;transition:width 1.3s cubic-bezier(.4,0,.2,1)}
.chart-val{font-size:12px;font-weight:600;color:var(--text);width:34px;flex-shrink:0}

/* ── Stat grid ── */
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.stat-tile{background:var(--frost2);border:none;border-radius:var(--r);padding:14px 12px;display:flex;gap:10px;align-items:flex-start;box-shadow:var(--shadow-card)}
.st-icon{width:34px;height:34px;border-radius:10px;background:var(--frost);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}
.st-lbl{font-size:10px;color:var(--muted);margin-bottom:3px;text-transform:uppercase;letter-spacing:.04em}
.st-val{font-size:13px;font-weight:600;color:var(--text);line-height:1.3}

/* ── Meter ── */
.meter-wrap{margin:10px 0}
.meter-label-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.meter-lbl{font-size:14px;font-weight:600;color:var(--text)}
.meter-badge{padding:4px 12px;border-radius:99px;font-size:12px;font-weight:700}
.meter-track{height:13px;border-radius:99px;background:linear-gradient(90deg,#26a96c,#a8e063,#ffd84a,#ffaa3b,#e04545);position:relative;overflow:visible}
.meter-thumb{position:absolute;top:50%;width:20px;height:20px;background:#fff;border-radius:50%;border:2px solid rgba(0,0,0,.12);box-shadow:0 2px 8px rgba(0,0,0,.12);transform:translate(-50%,-50%);transition:left 1.5s cubic-bezier(.4,0,.2,1)}

/* ── Inputs ── */
.text-input{width:100%;padding:12px 14px;background:var(--wh);border:1px solid var(--hair-light);border-radius:var(--r);font-family:var(--fb);font-size:16px;color:var(--text);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:6px;box-shadow:var(--shadow-card)}
.text-input::placeholder{color:var(--pct)}
.text-input:focus{border-color:rgba(109,85,66,.42);box-shadow:0 0 0 3px rgba(109,85,66,.1),inset 0 1px 2px rgba(60,50,30,.04)}

/* Prevent accidental horizontal overflow on mobile content */
img,svg,video,canvas{max-width:100%;height:auto}

/* ── Mobile optimization: narrow phone widths ── */
@media (max-width:390px){
  .topbar{padding-top:max(8px, env(safe-area-inset-top));padding-left:max(12px, env(safe-area-inset-left));padding-right:max(12px, env(safe-area-inset-right))}
  .prog-wrap{padding-left:max(12px, env(safe-area-inset-left));padding-right:max(12px, env(safe-area-inset-right))}
  .screen{padding:10px 12px 4px}
  .cta-wrap{margin-left:-12px;margin-right:-12px;padding-left:12px;padding-right:12px}
  .prog-meta{grid-template-columns:auto 1fr auto;gap:6px}
  #phasePill{font-size:9px;letter-spacing:.06em}
  .back-btn{font-size:14px}
  .lp-h1{max-width:100%;font-size:clamp(18px,6.2vw,22px);line-height:1.18}
  .lp-sub{max-width:100%}
  .summary-grid{grid-template-columns:1fr;gap:7px}
  #s-analysis .summary-grid{grid-template-columns:1fr;gap:7px}
  #s-result .summary-grid{grid-template-columns:1fr;gap:7px}
  #s20 .s20-stack{gap:14px}
  #s20 .s20-illustration-wrap{max-width:250px}
  #s-result .store-badges{max-width:100%}
}

/* Smallest phones */
@media (max-width:340px){
  .choice,.scale-btn{padding:11px 12px}
  .ct{font-size:13px}
  .ct small{font-size:11px}
  .lp-badge-txt,.lp-sub,.btn-sub{font-size:11px}
  #s20 .s20-hed{font-size:clamp(17px,6.5vw,21px)}
}

/* ── Responsive: tablet + desktop ── */
@media (min-width:600px){
  .shell{width:min(400px, calc(100vw - 40px));max-width:400px}
  .hed{font-size:clamp(15px,2.2vw,18px)}
  .lp-h1{font-size:clamp(21px,2.8vw,26px)}
}
@media (min-width:768px){
  .shell{width:min(420px, calc(100vw - 48px));max-width:420px}
  .topbar{padding:18px 24px 0}
  .prog-wrap{padding:6px 24px 0}
  .screen{padding:12px 24px 0;scroll-padding-bottom:calc(62px + env(safe-area-inset-bottom))}
  .screen--auto{scroll-padding-bottom:calc(14px + env(safe-area-inset-bottom))}
  .cta-wrap{margin-left:-24px;margin-right:-24px;padding-left:24px;padding-right:24px}
  .brand-bar{padding:16px 32px 8px}
  .grid2{grid-template-columns:repeat(3,1fr);gap:12px}
  #c21.grid2,#c22.grid2{grid-template-columns:repeat(2,1fr)}
  .contrast-strip{flex-direction:row;flex-wrap:wrap;gap:12px}
  .contrast-row{flex:1 1 calc(33.333% - 8px);min-width:min(100%,220px)}
  #s-land .contrast-strip{flex-direction:column;flex-wrap:nowrap}
  #s-land .contrast-row{flex:none;width:100%;min-width:0}
  .benefit-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;background:transparent;border:none;box-shadow:none}
  .benefit-item{border:1px solid var(--hair-light);border-radius:var(--r-lg);box-shadow:var(--shadow-card)}
  .benefit-list .benefit-item:last-child:nth-child(3){grid-column:1/-1;max-width:min(100%,420px);justify-self:center}
  .loop-node{max-width:380px}
  .analysis-head-title{font-size:clamp(28px,3.2vw,34px)}
  .result-hero-title{font-size:clamp(28px,3.2vw,34px)}
}
@media (min-width:1024px){
  .shell{width:min(440px, calc(100vw - 64px));max-width:440px}
  .topbar{padding:20px 28px 0}
  .prog-wrap{padding:6px 28px 0}
  .screen{padding:14px 28px 0;scroll-padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  .screen--auto{scroll-padding-bottom:calc(16px + env(safe-area-inset-bottom))}
  .cta-wrap{margin-left:-28px;margin-right:-28px;padding-left:28px;padding-right:28px}
  .brand-bar{padding:16px 40px 8px}
  #c21.grid2,#c22.grid2{grid-template-columns:repeat(4,1fr);gap:12px}
  .summary-grid{grid-template-columns:repeat(4,1fr);gap:10px}
  #s-analysis .summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  #s-analysis .summary-tile{padding:7px 9px 8px}
  #s-analysis .summary-tile-head{margin-bottom:2px}
  #s-result .summary-grid{grid-template-columns:1fr 1fr;gap:6px}
  #s-result .summary-tile{padding:7px 9px 8px}
  .summary-tile{padding:10px 11px 11px}
  .stat-grid{grid-template-columns:repeat(4,1fr);gap:12px}
  .cta-wrap .btn{max-width:420px;margin-left:auto;margin-right:auto}
  .mToast{max-width:min(420px,calc(100% - 40px))}
}
@media (min-width:1280px){
  .shell{width:min(440px, calc(100vw - 80px));max-width:440px}
}