/* The scan (/scan): four steps — photo, where to send it, reading, the reading.
   Forest, greige and near-white only. States read from fills, outlines, icons and words, never from colour alone.
   The live script sets a few inline styles that name old variables; they are pointed at the palette here. */
body[data-app] .mobar{display:none}
.app{--terracotta:var(--ink);--red:var(--ink);--font-mono:var(--f-sans);--ink-soft:var(--muted);--paper:#FFFBF8;
  padding:calc(var(--nav-h) + env(safe-area-inset-top,0px)) 0 clamp(56px,10vh,110px);min-height:100svh}

/* ---------- progress bar under the nav ---------- */
.scan-bar{padding:clamp(18px,3vh,30px) 0 0}
.sb-in{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.sb-count{font-family:var(--f-display);font-weight:700;font-size:1.05rem;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.sb-track{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:12px}
.sb-track i{height:3px;background:var(--hair);position:relative;overflow:hidden}
.sb-track i::after{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
/* app.js copies the step counter ("02 / 04") into data-n */
.sb-track i:nth-child(1)::after,
.sb-track[data-n="2"] i:nth-child(-n+2)::after,
.sb-track[data-n="3"] i:nth-child(-n+3)::after,
.sb-track[data-n="4"] i:nth-child(-n+4)::after{transform:none}
.sb-track.of3{grid-template-columns:repeat(3,1fr)}

.scan-main{padding-top:clamp(30px,6vh,64px)}

/* ---------- steps (the script toggles .active) ---------- */
.step{display:none}
.step.active{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);grid-template-areas:"copy side" "tips side" ". side";grid-template-rows:auto auto 1fr;column-gap:clamp(32px,6vw,96px);align-items:start;animation:stepIn .6s cubic-bezier(.2,.7,.2,1)}
@keyframes stepIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.st-copy{grid-area:copy}
.st-cam,.st-form,.scan-stage,.st-read{grid-area:side}
.st-tips,.st-status{grid-area:tips}
#step-result.active{grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-areas:"photo read"}
.st-photo{grid-area:photo;position:sticky;top:calc(var(--nav-h) + 24px)}
.st-read{grid-area:read}

.step-eyebrow{margin-bottom:18px}
.step-title{font-weight:700;font-size:clamp(2.7rem,6vw,5.2rem);line-height:.96;letter-spacing:-.025em;margin:0 0 22px}
.step-sub{font-size:clamp(1.02rem,1.25vw,1.15rem);color:var(--ink-2);max-width:44ch;margin:0}
/* the hand-drawn underline, as a background so it follows the words across lines */
.app .italic{font-style:normal;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 20' preserveAspectRatio='none'%3E%3Cpath fill='%230F290E' d='M2 12C52 5 128 3 198 5c1.8.7 1.8 4.6-.4 5.2C132 9.8 62 12.4 4.8 17.4 1 17.8-.3 13.6 2 12z'/%3E%3C/svg%3E") 0 1.19em/100% .19em no-repeat;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.concern-chip{width:fit-content;margin:0 0 18px;padding:6px 12px;border:1.5px solid var(--ink);font-stretch:85%;font-weight:600;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase}

/* ---------- buttons: the script builds some of these ---------- */
.app .btn{display:flex;width:100%;justify-content:space-between;text-align:left;font-size:1rem;padding:1.05em 1.3em}
.app .btn-small{justify-content:center;font-size:.92rem;padding:.85em 1.1em;margin-top:10px}
.app .btn-outline{background:transparent;color:var(--ink)}
.app .btn-outline::after{background:var(--ink)}
.app .btn-outline:hover{color:var(--bg)}
.btn-arrow{font-family:var(--f-display);font-weight:700;margin-left:12px}
.btn-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.btn-row .btn-small{margin-top:0}
#btn-capture,#btn-continue{margin-top:14px}

/* ---------- step 1: the camera ---------- */
.camera-frame{position:relative;width:100%;aspect-ratio:4/5;background:var(--forest) url(../img/paper-grain-dk.png) 0 0/160px 160px;overflow:hidden;color:var(--greige)}
.camera-frame video,.camera-frame canvas,.camera-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.camera-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;text-align:center}
.camera-placeholder-icon{width:58px;height:58px;opacity:.5}
.camera-placeholder-text{margin:0;font-stretch:85%;font-weight:600;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;line-height:1.7;opacity:.7}
.camera-brackets{position:absolute;inset:0;pointer-events:none}
.camera-brackets::before,.camera-brackets::after,.camera-brackets>span::before,.camera-brackets>span::after,
.scan-brackets::before,.scan-brackets::after,.scan-brackets>span::before,.scan-brackets>span::after{content:"";position:absolute;width:30px;height:30px;border:0 solid #FFFBF8}
.camera-brackets::before,.scan-brackets::before{top:18px;left:18px;border-top-width:2px;border-left-width:2px}
.camera-brackets::after,.scan-brackets::after{top:18px;right:18px;border-top-width:2px;border-right-width:2px}
.camera-brackets>span::before,.scan-brackets>span::before{bottom:18px;left:18px;border-bottom-width:2px;border-left-width:2px}
.camera-brackets>span::after,.scan-brackets>span::after{bottom:18px;right:18px;border-bottom-width:2px;border-right-width:2px}
.camera-tag,.scan-status-tag{position:absolute;left:14px;bottom:14px;padding:6px 10px;background:rgba(15,41,14,.78);color:#FFFBF8;font-stretch:85%;font-weight:600;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase}
.tips-card{margin-top:clamp(26px,4vh,40px);max-width:52ch}
.tips-card-label{margin-bottom:10px}
.tips-card-body{list-style:none;margin:0;padding:0;border-top:1.5px solid var(--ink)}
.tips-card-body li{position:relative;padding:11px 0 11px 30px;border-bottom:1px solid var(--hair);color:var(--ink-2)}
.tips-card-body li::before{content:"";position:absolute;left:3px;top:18px;width:12px;height:6px;border-left:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(-45deg)}

/* ---------- step 2: where to send it ---------- */
.lead-photo-thumb{display:flex;align-items:center;gap:14px;margin-top:28px}
.lead-photo-thumb img{width:84px;height:84px;object-fit:cover;background:var(--wash)}
.form-row{margin-bottom:18px}
.form-label{display:block;font-stretch:85%;font-weight:600;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.form-input{display:block;width:100%;font:500 1.05rem/1.3 var(--f-sans);color:var(--ink);background:var(--paper);border:1.5px solid var(--line);border-radius:0;padding:.95em 1em;transition:border-color .25s,box-shadow .25s;-webkit-appearance:none;appearance:none}
.form-input::placeholder{color:var(--muted);opacity:.75}
.form-input:focus{outline:0;border-color:var(--ink);box-shadow:0 0 0 3px var(--wash)}
.form-input[style*="border-color"]{border-width:2px;box-shadow:0 0 0 4px var(--deco)}
.form-input[style*="border-color"]::placeholder{color:var(--ink);opacity:1;font-weight:600}
.form-hint{font-size:.85rem;color:var(--muted);margin-top:7px}
.consent-note{font-size:.88rem;color:var(--muted);margin:6px 0 20px;max-width:56ch}
.consent-note a{color:inherit;text-decoration:underline;text-underline-offset:3px}

/* ---------- step 3: reading ---------- */
.scan-status{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"bf label" "bf text" "bf orb";column-gap:18px;align-items:center;margin-top:8px}
.scan-bf{grid-area:bf;--bw:74px;width:var(--bw);height:calc(var(--bw)*.6218);color:var(--ink)}
.scan-bf .bf-wings{display:grid;grid-template-columns:458.94fr 58.7fr 44.72fr 58.7fr 458.94fr;width:100%;height:100%;perspective:300px}
.scan-bf .bf-w{height:100%}
.scan-bf .bf-w svg{width:100%;height:100%;display:block;fill:currentColor;overflow:visible}
.scan-bf .bf-wl{grid-column:1;transform-origin:117.67% 50%;animation:bfL 1.15s ease-in-out infinite}
.scan-bf .bf-wr{grid-column:5;transform-origin:-17.67% 50%;animation:bfR 1.15s ease-in-out infinite}
.scan-bf .bf-body{grid-column:3;background:currentColor;border-radius:999px}
@keyframes bfL{50%{transform:rotateY(62deg)}}
@keyframes bfR{50%{transform:rotateY(-62deg)}}
.scan-status-label{grid-area:label}
#scan-orb{grid-area:orb}
#scan-orb:empty{display:none}
.scan-status-text{grid-area:text;font-family:var(--f-display);font-weight:600;font-size:clamp(1.3rem,2vw,1.6rem);line-height:1.2;margin-top:4px;transition:opacity .16s}
.scan-progress{height:3px;background:var(--hair);margin:26px 0 8px;overflow:hidden}
.scan-progress-fill{height:100%;width:0;background:var(--ink);transition:width 1.3s cubic-bezier(.2,.7,.2,1)}
.scan-checklist{margin-top:18px;border-top:1.5px solid var(--ink)}
.scan-check{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--hair);color:var(--muted);transition:color .3s}
.scan-check.active{color:var(--ink);font-weight:600}
.scan-check.done{color:var(--ink)}
.scan-check-icon{flex:none;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;font-size:.75rem;line-height:1}
.scan-check.active .scan-check-icon{border-color:var(--ink);border-right-color:transparent;animation:chk .8s linear infinite}
@keyframes chk{to{transform:rotate(360deg)}}
.scan-check.done .scan-check-icon{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.scan-check.done .scan-check-icon::after{content:"✓";font-weight:700}
#scan-error{margin-top:26px;padding:22px;border:1.5px solid var(--ink);background:var(--paper)}
#scan-error p:not(.label){margin:10px 0 18px;color:var(--ink-2)}
.scan-stage{position:relative}
.scan-container{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--forest)}
.scan-container img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.scan-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,251,248,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(255,251,248,.16) 1px,transparent 1px);background-size:36px 36px;mix-blend-mode:screen}
.scan-line{position:absolute;left:0;right:0;top:0;height:28%;background:linear-gradient(180deg,rgba(255,251,248,0),rgba(255,251,248,.28) 88%,#FFFBF8 100%);animation:sweep 2.6s cubic-bezier(.45,0,.55,1) infinite alternate}
@keyframes sweep{from{transform:translateY(-100%)}to{transform:translateY(357%)}}
.scan-brackets{position:absolute;inset:0;animation:brk 2.2s ease-in-out infinite}
@keyframes brk{50%{inset:10px}}
.scan-status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#FFFBF8;margin-right:8px;vertical-align:1px;animation:dot 1.2s ease-in-out infinite}
@keyframes dot{50%{opacity:.25}}

/* ---------- step 4: the reading ---------- */
.result-photo{aspect-ratio:4/5;overflow:hidden;background:var(--wash)}
.result-photo img{width:100%;height:100%;object-fit:cover}
.result-meta{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--hair);font-stretch:85%;font-weight:600;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.result-tier-card{display:flex;align-items:center;gap:16px;padding:18px 20px;border:1.5px solid var(--ink);background:var(--paper)}
.result-tier-icon{flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-family:var(--f-display);font-weight:700;font-size:1.3rem;line-height:1;border:1.5px solid var(--ink)}
.result-tier-label{font-stretch:85%;font-weight:600;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.result-tier-name{font-family:var(--f-display);font-weight:700;font-size:1.25rem;line-height:1.2;margin-top:3px}
/* healthy: a solid tick · manageable: a half-filled dot · medical: hatched, with a heavy rule · unclear: a dashed question */
.result-tier-card.healthy .result-tier-icon{background:var(--ink);color:var(--bg)}
.result-tier-card.manageable .result-tier-icon{background:linear-gradient(90deg,var(--ink) 50%,transparent 50%);color:transparent;position:relative}
.result-tier-card.manageable .result-tier-icon::after{content:"";position:absolute;inset:14px;border-radius:50%;background:var(--paper)}
.result-tier-card.medical{border-left-width:6px}
.result-tier-card.medical .result-tier-icon{background:repeating-linear-gradient(45deg,var(--deco) 0 3px,transparent 3px 7px)}
.result-tier-card.unclear{border-style:dashed}
.result-tier-card.unclear .result-tier-icon{border-style:dashed}
.result-tier-card.medical .result-tier-label,.result-tier-card.healthy .result-tier-label{color:var(--ink)}
.result-headline{font-weight:700;font-size:clamp(2.2rem,4.4vw,3.6rem);line-height:1;letter-spacing:-.02em;margin:28px 0 16px}
.result-summary{font-size:clamp(1.05rem,1.3vw,1.2rem);color:var(--ink-2);max-width:52ch;margin:0}
.result-block{margin-top:26px}
.result-block-label{font-stretch:85%;font-weight:600;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);padding-bottom:10px;border-bottom:1.5px solid var(--ink)}
.result-block-body{padding-top:12px;color:var(--ink-2)}
.result-block-body ul{list-style:none;margin:0;padding:0}
.result-block-body li{position:relative;padding:9px 0 9px 26px;border-bottom:1px solid var(--hair)}
.result-block-body li::before{content:"";position:absolute;left:2px;top:17px;width:9px;height:9px;border:1.5px solid var(--ink);transform:rotate(45deg)}
.result-block-medical{padding:18px 20px;border:1.5px solid var(--ink);border-left-width:6px;background:var(--paper)}
.result-block-medical .result-block-label{color:var(--ink);border-bottom-width:1px}
.result-cta-wrap{margin-top:30px}
.report-cta-block{margin-top:12px}
.report-cta-block .btn+.btn{margin-top:10px}
.report-cta-note{text-align:center;font-stretch:85%;font-weight:600;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-top:12px}
.result-restart{display:block;margin:22px auto 0;background:none;border:0;padding:8px;font:600 .95rem var(--f-sans);color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:5px;cursor:pointer}
.result-restart:hover{text-decoration-color:currentColor}

/* ---------- phones ---------- */
@media (max-width:899px){
  .step.active,#step-result.active{grid-template-columns:minmax(0,1fr);grid-template-areas:"copy" "side" "tips";grid-template-rows:auto}
  #step-result.active{grid-template-areas:"photo" "read"}
  .st-cam,.st-form,.scan-stage,.st-read,.st-status{margin-top:26px}
  .st-photo{position:static}
  .result-photo{aspect-ratio:16/10}
  .camera-frame{aspect-ratio:4/3}
  .scan-container{aspect-ratio:1/1}
  .scan-main{padding-top:24px}
  .step-sub{font-size:1rem}
  .step-title{margin-bottom:16px}
  .step-title{font-size:clamp(2.5rem,11vw,3.4rem)}
}
@media (prefers-reduced-motion:reduce){
  .step.active,.scan-bf .bf-w,.scan-line,.scan-brackets,.scan-status-dot,.scan-check.active .scan-check-icon{animation:none}
}

/* =================== free checks (quizzes + polish) =================== */
.st-side{grid-area:side}
.sb-back{text-decoration:none}
.sb-back:hover{text-decoration:underline;text-underline-offset:4px}
.btn-text-wrap{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.btn-meta{font-stretch:85%;font-weight:600;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;opacity:.72}
.intro-meta-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;border-top:1.5px solid var(--ink);border-bottom:1px solid var(--hair)}
.intro-meta-cell{padding:14px 14px 16px 0}
.intro-meta-cell+.intro-meta-cell{padding-left:16px;border-left:1px solid var(--hair)}
.intro-meta-label{font-stretch:85%;font-weight:600;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.intro-meta-value{margin:6px 0 0;font-family:var(--f-display);font-weight:700;font-size:clamp(1.6rem,2.4vw,2.1rem);line-height:1}
.step-honest{margin:22px 0 24px;padding:14px 18px;border-left:3px solid var(--ink);background:var(--wash);color:var(--ink-2);max-width:52ch}
.st-copy .step-honest{margin-bottom:0}

/* questions: one at a time, answering moves on */
.progress{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:6px;margin-bottom:clamp(26px,5vh,48px)}
.progress-dot{height:5px;border:1.5px solid var(--line);transition:background-color .3s,border-color .3s}
.progress-dot.done{background:var(--ink);border-color:var(--ink)}
.progress-dot.active{border-color:var(--ink);background:linear-gradient(90deg,var(--ink) 40%,transparent 40%)}
#step-questions.active{display:block}
.q-screen{display:none}
.q-screen.active{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,480px);grid-template-areas:"num opts" "text opts" ". nav";grid-template-rows:auto auto 1fr;column-gap:clamp(32px,6vw,96px);align-items:start;animation:stepIn .5s cubic-bezier(.2,.7,.2,1)}
.q-num{grid-area:num}
.q-text{grid-area:text;font-family:var(--f-display);font-weight:700;font-size:clamp(2rem,3.9vw,3.4rem);line-height:1.04;letter-spacing:-.018em;margin-top:16px;text-wrap:balance}
.options{grid-area:opts;display:grid;gap:10px}
.option{display:flex;justify-content:space-between;align-items:center;gap:14px;width:100%;text-align:left;padding:18px 20px;border:1.5px solid var(--ink);background:var(--paper);font:500 1.05rem/1.35 var(--f-sans);color:var(--ink);cursor:pointer;transition:background-color .2s,color .2s}
.option:hover{background:var(--wash)}
.option.selected{background:var(--ink);color:var(--bg)}
.option-arrow{font-family:var(--f-display);font-weight:700;opacity:.3;transition:transform .2s,opacity .2s}
.option:hover .option-arrow,.option.selected .option-arrow{opacity:1;transform:translateX(4px)}
.q-nav{grid-area:nav;margin-top:12px}
.q-back{visibility:hidden;background:none;border:0;padding:8px 0;font:600 .95rem var(--f-sans);color:var(--muted);cursor:pointer}
.q-back.show{visibility:visible}
.q-back:hover{color:var(--ink)}

/* working it out */
.calc-visual{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--forest) url(../img/paper-grain-dk.png) 0 0/160px 160px;color:var(--greige);display:grid;place-items:center}
.calc-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(230,221,214,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(230,221,214,.08) 1px,transparent 1px);background-size:36px 36px}
.calc-scan-line{position:absolute;left:0;right:0;top:0;height:26%;background:linear-gradient(180deg,rgba(230,221,214,0),rgba(230,221,214,.14) 88%,rgba(255,251,248,.7) 100%);animation:sweep 2.6s cubic-bezier(.45,0,.55,1) infinite alternate}
.calc-status-tag{position:absolute;right:14px;top:14px;padding:6px 10px;border:1px solid rgba(230,221,214,.3);font-stretch:85%;font-weight:600;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase}
.calc-status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#FFFBF8;margin-right:8px;vertical-align:1px;animation:dot 1.2s ease-in-out infinite}
.calc-read{position:relative;display:flex;align-items:baseline;gap:8px}
.calc-number{font-family:var(--f-display);font-weight:800;font-size:clamp(5.5rem,12vw,10rem);line-height:.9;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:#FFFBF8}
.calc-of,.calc-number-label{font-family:var(--f-display);font-weight:600;font-size:1.4rem;opacity:.6}
.calc-status-text{font-family:var(--f-display);font-weight:600;font-size:clamp(1.3rem,2vw,1.6rem);line-height:1.2;margin-top:6px;transition:opacity .16s}
.calc-progress{height:3px;background:var(--hair);margin:22px 0 8px;overflow:hidden}
.calc-progress-fill{height:100%;width:0;background:var(--ink);transition:width .8s cubic-bezier(.2,.7,.2,1)}
.calc-checklist{margin-top:18px;border-top:1.5px solid var(--ink)}
.calc-check{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--hair);color:var(--muted);transition:color .3s}
.calc-check.active{color:var(--ink);font-weight:600}
.calc-check.done{color:var(--ink)}
.calc-check-icon{flex:none;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;font-size:.75rem;line-height:1}
.calc-check.active .calc-check-icon{border-color:var(--ink);border-right-color:transparent;animation:chk .8s linear infinite}
.calc-check.done .calc-check-icon{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.calc-check.done .calc-check-icon::after{content:"✓";font-weight:700}

/* the read */
.result-score-block{display:flex;align-items:baseline;gap:8px;padding:22px 0 20px}
.result-score-big{font-family:var(--f-display);font-weight:800;font-size:clamp(5.5rem,11vw,9rem);line-height:.86;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.result-score-of{font-family:var(--f-display);font-weight:600;font-size:1.6rem;color:var(--muted)}
.tier-card{display:flex;align-items:center;gap:16px;padding:18px 20px;border:1.5px solid var(--ink);background:var(--paper)}
.tier-icon{flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-family:var(--f-display);font-weight:700;font-size:1.3rem;line-height:1;border:1.5px solid var(--ink)}
.tier-label{font-stretch:85%;font-weight:600;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.tier-name{font-family:var(--f-display);font-weight:700;font-size:1.25rem;line-height:1.2;margin-top:3px}
.tier-card.healthy .tier-icon{background:var(--ink);color:var(--bg)}
.tier-card.manageable .tier-icon{background:linear-gradient(90deg,var(--ink) 50%,transparent 50%);color:transparent;position:relative}
.tier-card.manageable .tier-icon::after{content:"";position:absolute;inset:14px;border-radius:50%;background:var(--paper)}
.tier-card.medical{border-left-width:6px}
.tier-card.medical .tier-icon{background:repeating-linear-gradient(45deg,var(--deco) 0 3px,transparent 3px 7px)}
.tier-card.healthy .tier-label,.tier-card.medical .tier-label{color:var(--ink)}
.app-quiz #step-result .result-headline{margin-top:0}
.result-block-body b{color:var(--ink)}
.result-block-body p{margin:0 0 .6em}
.result-cta-none{text-align:center;padding:14px;border:1px dashed var(--line);font-stretch:85%;font-weight:600;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

/* polish checker */
.input-label{display:block;font-stretch:85%;font-weight:600;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.input-area{display:block;width:100%;min-height:210px;padding:16px;font:500 1rem/1.55 var(--f-sans);color:var(--ink);background:var(--paper);border:1.5px solid var(--line);border-radius:0;resize:vertical;-webkit-appearance:none;appearance:none}
.input-area::placeholder{color:var(--muted);opacity:.7}
.input-area:focus{outline:0;border-color:var(--ink);box-shadow:0 0 0 3px var(--wash)}
.input-hint{font-size:.88rem;color:var(--muted);margin:10px 0 0}
.example-block{margin:20px 0 22px;padding:16px 18px;background:var(--wash);color:var(--ink-2);font-size:.95rem}
.example-label{font-stretch:85%;font-weight:600;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);margin-bottom:6px}
.example-btn{margin-top:8px;background:none;border:0;padding:0;font:600 .95rem var(--f-sans);color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px;cursor:pointer}
.example-btn:hover{text-decoration-color:currentColor}
.result-summary-card{margin-top:22px;padding:22px;border:1.5px solid var(--ink);background:var(--paper)}
.summary-label{font-stretch:85%;font-weight:600;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);display:flex;align-items:center;gap:10px}
.summary-label::before{content:"";flex:none;width:18px;height:18px;border-radius:50%;border:1.5px solid var(--ink)}
.summary-clean .summary-label::before{background:var(--ink)}
.summary-some .summary-label::before{background:linear-gradient(90deg,var(--ink) 50%,transparent 50%)}
.summary-many{border-left-width:6px}
.summary-many .summary-label::before{background:repeating-linear-gradient(45deg,var(--ink) 0 1.5px,transparent 1.5px 4px)}
.summary-line{margin-top:14px}
.summary-count{font-family:var(--f-display);font-weight:800;font-size:4.2rem;line-height:.9;letter-spacing:-.03em}
.summary-count-of{color:var(--muted)}
.summary-message{font-family:var(--f-display);font-weight:700;font-size:clamp(1.4rem,2.2vw,1.8rem);line-height:1.15;margin-top:12px}
.clean-message{margin:0 0 20px;padding:16px 18px;background:var(--wash);color:var(--ink-2)}
.flagged-list{display:grid;gap:12px;margin-bottom:22px}
.flagged-item{padding:18px 20px;border:1.5px solid var(--ink);background:var(--paper)}
.flagged-item.high{border-left-width:6px}
.flagged-name{font-family:var(--f-display);font-weight:700;font-size:1.2rem;line-height:1.25}
.flagged-tags{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 10px}
.flagged-tag{font-stretch:85%;font-weight:600;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;padding:4px 8px;border:1.2px solid var(--ink)}
.flagged-tag.high{background:var(--ink);color:var(--bg)}
.flagged-tag.medium{background:repeating-linear-gradient(45deg,var(--deco) 0 3px,transparent 3px 6px)}
.flagged-tag.category{border-color:var(--line);color:var(--muted)}
.flagged-reason{margin:0;color:var(--ink-2)}
.flagged-eu{margin-top:10px;font-size:.85rem;color:var(--muted)}
#result-content>.btn{margin-top:4px}

@media (max-width:899px){
  .q-screen.active{grid-template-columns:minmax(0,1fr);grid-template-areas:"num" "text" "opts" "nav"}
  .q-text{margin:12px 0 22px;font-size:clamp(1.8rem,8vw,2.4rem)}
  .calc-visual{aspect-ratio:4/3}
  .st-side{margin-top:26px}
  .result-score-block{padding:14px 0}
}
@media (prefers-reduced-motion:reduce){.calc-scan-line,.calc-status-dot,.calc-check.active .calc-check-icon,.q-screen.active{animation:none}}