:root{--paper:#f2eee4;--ink:#171713;--muted:#6f6b62;--line:#cbc4b5;--signal:#e84a2a;--dark:#171713;--light:#fffdf7}
*{box-sizing:border-box}
html{background:var(--paper);color:var(--ink);font-family:"Newsreader",Georgia,serif}
body{margin:0;min-height:100vh;background:radial-gradient(circle at 12% 8%,#fffdf7 0,transparent 38%),var(--paper)}
button,input{font:inherit}
.app{min-height:100vh}
.screen{min-height:100svh;display:grid;place-items:center;padding:clamp(28px,6vw,80px) 22px}
.screen[hidden],.results[hidden]{display:none}
.measure{width:min(100%,760px)}
p{font-size:clamp(1.22rem,2.3vw,1.65rem);line-height:1.43;margin:0 0 1.35em}
.display{font-size:clamp(2.35rem,7vw,5.4rem);line-height:.98;letter-spacing:-.045em;margin-bottom:.55em;text-wrap:balance}
.progress{font:500 .72rem/1 "DM Mono",monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:2.4rem}
.prompt p:first-child{font-size:clamp(1.75rem,4.4vw,3.45rem);line-height:1.08;letter-spacing:-.028em}
.prompt p:last-child:not(:first-child){font-size:clamp(1.25rem,2.6vw,1.8rem);font-weight:600}
.options{display:grid;gap:12px;margin:2.1rem 0}
.option,.primary{border:1.5px solid var(--ink);background:transparent;color:var(--ink);padding:18px 20px;text-align:left;cursor:pointer;font:600 clamp(1rem,2vw,1.2rem)/1.3 "DM Sans",sans-serif;transition:transform .15s,background .15s,color .15s}
.option:hover,.option:focus-visible,.option.selected{background:var(--ink);color:var(--light);transform:translateY(-2px)}
.option:disabled{cursor:default;transform:none}
.primary{display:inline-block;background:var(--signal);border-color:var(--signal);color:white;padding:15px 24px;text-align:center}
.primary:hover,.primary:focus-visible{background:var(--ink);border-color:var(--ink);transform:translateY(-2px)}
.split{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;margin:1.6rem 0;font:500 .82rem/1.5 "DM Mono",monospace;text-transform:uppercase;letter-spacing:.06em}
.split-row{display:grid;grid-template-columns:22px 1fr auto;align-items:center;gap:10px;margin:8px 0}
.bar{height:8px;background:#ddd6c8;overflow:hidden}.bar>span{display:block;height:100%;background:var(--signal)}
.branch{font-size:clamp(1.45rem,3vw,2.15rem);line-height:1.25;margin-top:1.7rem}
.four .option{font-size:clamp(.95rem,1.8vw,1.08rem)}
.wall-form{display:grid;gap:18px}.wall-form label{margin-bottom:.25em}
input[type=email]{width:100%;border:0;border-bottom:2px solid var(--ink);background:transparent;color:var(--ink);padding:15px 4px;font:500 clamp(1.15rem,3vw,1.65rem)/1.2 "DM Sans",sans-serif;outline:none}
input[type=email]:focus{border-color:var(--signal)}
.wall-form .primary{justify-self:start}
.results{padding:clamp(44px,8vw,100px) 22px 100px}.results-head,.results-list{width:min(100%,900px);margin:auto}
.results-head h1{font-size:clamp(2.8rem,8vw,6rem);line-height:.93;letter-spacing:-.05em;margin:0 0 1em;text-wrap:balance}
.result-card{padding:32px 0;border-top:1px solid var(--line)}
.result-card h2{font-size:clamp(1.35rem,3vw,2rem);line-height:1.15;margin:0 0 1.25rem;font-weight:500}
.result-card .split{margin:0;border:0;padding:0}
noscript{position:fixed;inset:auto 0 0;background:var(--dark);color:white;padding:12px;text-align:center}
@media(min-width:700px){.options:not(.four){grid-template-columns:1fr 1fr}.four{grid-template-columns:1fr 1fr}.option{min-height:86px}.screen{padding-bottom:10vh}}
@media(min-width:700px) and (max-height:760px){.screen{padding:28px 22px}.display{font-size:clamp(2.35rem,5.5vw,4.4rem)}p{font-size:clamp(1.1rem,1.8vw,1.4rem);margin-bottom:1em}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
