/* Story v1.1 inherits the actual production card, typography, accents and first three copy styles. */
.story-progress{display:flex;gap:6px;margin-bottom:20px;width:100%;max-width:124px}
.story-progress span{flex:1;height:3px;border-radius:4px;background:#e6eaf1;transition:background .15s}
.story-progress span.on{background:var(--accent)}
.story-kicker{margin:6px 0 18px;font-size:11px;color:#64748b;font-weight:800;letter-spacing:.16em;text-transform:uppercase;display:flex;justify-content:space-between}
.story-screen h2{font-size:clamp(29px,7.5vw,41px);margin:12px 0 20px}
.story-screen h1{margin-top:16px}
.story-narrative{margin:18px 0 6px}.story-narrative p{font-size:clamp(17px,4.35vw,19px);line-height:1.48;color:var(--ink);margin:13px 0}
.story-narrative .story-quote{font-size:clamp(21px,5.3vw,26px);font-weight:820;letter-spacing:-.035em;line-height:1.25;padding-left:15px;border-left:3px solid var(--accent);margin:18px 0}
.story-narrative .final-quote{margin-bottom:26px}
.story-moral{font-weight:750;white-space:normal}
.story-moral br{display:block;content:"";margin:6px 0}
.story-choice-stack{margin-top:28px}.story-choice-stack .btn{display:flex;flex-direction:column;gap:5px;min-height:64px;font-size:16px}
.story-choice-stack .btn small{font-size:12px;line-height:1.2;font-weight:580;opacity:.85;letter-spacing:0}
.story-choice-stack .btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent2))}
.story-back{margin:15px auto 0;padding:10px 12px;display:block;border:0;background:transparent;color:#64748b;font:inherit;font-size:13px;font-weight:680;cursor:pointer;min-height:40px}
.story-back:hover{text-decoration:underline}.story-text-link{display:block;text-align:center;color:var(--ink);font-weight:750;font-size:14px;text-underline-offset:4px;padding:6px}
.story-credit{margin-top:clamp(104px,14vh,160px);border-top:1px solid var(--line);padding-top:20px;text-align:center;font-size:11.5px;line-height:1.45;font-weight:650}
.story-credit a{color:#687386;text-decoration:none}.story-credit a:hover{text-decoration:underline}.story-credit a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
body.public .legal{font-size:11px;line-height:1.45;color:#6b778c;margin-top:14px}.fiction-label{display:block;margin-bottom:5px}
.funnel-form{margin-top:18px;display:grid;gap:13px}.funnel-form label{font-size:13px;font-weight:720;color:var(--ink);display:grid;gap:7px}
.funnel-form input:not([type=checkbox]),.funnel-form select,.funnel-form textarea{background:white;border:1px solid #cbd5e1;border-radius:12px;padding:13px 12px;font:inherit;font-size:16px;color:var(--ink);width:100%;min-height:48px}
.funnel-form textarea{resize:vertical}.funnel-form :is(input,textarea,select):focus-visible{outline:3px solid rgba(37,99,235,.3);border-color:var(--accent)}
.funnel-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.funnel-check{display:flex!important;align-items:flex-start;gap:9px!important;font-weight:520!important;line-height:1.35;color:#475569!important}.funnel-check input{width:18px;height:18px;flex:0 0 18px;margin:0;accent-color:var(--accent)}
.funnel-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.funnel-error{margin:0;font-size:13px;color:#b42318!important;font-weight:650}
.story-screen h3{font-size:20px;letter-spacing:-.03em;line-height:1.2;margin:22px 0 10px}
.story-screen .btn:focus-visible,.story-back:focus-visible{outline:3px solid #111827;outline-offset:3px}
.story-screen .btn:disabled{opacity:.55;cursor:progress}
.match-stack .btn{font-size:14.5px;min-height:54px;line-height:1.3;padding:13px 14px}
@media(max-width:560px){.card{justify-content:center;padding-top:24px;padding-bottom:32px}.story-screen .stack{margin-top:22px}.story-screen .divider{margin:20px 0}.story-credit{margin-top:clamp(88px,11vh,130px)}}
@media(max-width:380px){.funnel-two{grid-template-columns:1fr}.story-screen h1{font-size:clamp(35px,11vw,43px)}.story-screen .btn{min-height:52px;padding:13px}.story-narrative p{font-size:16px}.story-narrative .story-quote{font-size:20px}}
@media(prefers-reduced-motion:reduce){.step{animation:none!important}.btn{transition:none!important}.story-progress span{transition:none!important}}

/* V1.1.2: Strong primary story readability while preserving quiet metadata. */
body.story-mode .story-screen .story-narrative p,
body.story-mode .story-screen > p:not(.story-kicker):not(.micro),
body.story-mode .story-screen #matchResultBody { color:#101828; }
body.story-mode .story-screen .story-quote {color:#0b1220;}
body.story-mode .story-kicker,
body.story-mode .story-back {color:#536176;}
body.story-mode .story-credit a {color:#576477;}
body.story-mode .story-credit a:hover {color:#101828;}
/* Keep the footer credit separated from all CTAs on every story step. */
body.story-mode .story-credit { flex:none; }

/* Preserve author-entered line breaks and blank lines in the opening story. */
#introStep .story-narrative > p { white-space: pre-wrap; }

/* V1.6 — Render editor line breaks consistently without adding automatic paragraph gaps. */
body.story-mode .story-screen :is(h1,h2,h3,p,.btn,small,.story-text-link,.funnel-check span){white-space:pre-line}
body.story-mode .story-narrative p{white-space:pre-line}
body.story-mode .story-narrative .story-moral{white-space:pre-line}
body.story-mode .story-text-first{margin-top:22px}
body.story-mode .story-text-first h3{margin-bottom:7px}
body.story-mode .story-text-first .micro{margin-top:0}
body.story-mode .story-direct-text{margin-top:19px;display:grid;gap:10px;text-align:center}
body.story-mode .story-direct-text .btn{margin-top:0}

body.story-mode .story-credit{white-space:pre-line}
