/* Part D: the check is a prescription-pad card, one question at a time, ending on a pressure gauge.
   Palette: aubergine ink on cool lavender paper, amber "pill" highlight, warning red. */
:root{--paper:#f1f0f5;--sheet:#fcfbfe;--ink:#1d1630;--muted:#5d5670;--rule:#d6d2e2;--accent:#5b34a0;--accent-soft:rgba(91,52,160,.09);--on-accent:#fbf9ff;--mark:#f5b73b;--mark-ink:#1d1306;--alert:#b8321f;--alert-soft:rgba(184,50,31,.08)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--paper:#110e19;--sheet:#1a1626;--ink:#ece8f6;--muted:#a8a0bd;--rule:#2e2840;--accent:#b597ee;--accent-soft:rgba(181,151,238,.13);--on-accent:#110e19;--mark:#e9aa33;--mark-ink:#1d1306;--alert:#f08a72;--alert-soft:rgba(240,138,114,.12)}}
:root[data-theme="dark"]{--paper:#110e19;--sheet:#1a1626;--ink:#ece8f6;--muted:#a8a0bd;--rule:#2e2840;--accent:#b597ee;--accent-soft:rgba(181,151,238,.13);--on-accent:#110e19;--mark:#e9aa33;--mark-ink:#1d1306;--alert:#f08a72;--alert-soft:rgba(240,138,114,.12)}

.facts{margin:0;display:grid;gap:0;border-top:1px solid var(--rule)}
.facts div{display:grid;grid-template-columns:8.5em 1fr;gap:16px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--rule)}
.facts dt{font-size:1.15rem;font-weight:500;color:var(--accent)}
.facts dd{margin:0;font-size:.93rem;color:var(--muted)}

.rx{background:var(--sheet);border:1px solid var(--rule);border-radius:var(--r-lg);box-shadow:0 24px 48px -32px rgba(29,22,48,.4);overflow:hidden;position:relative}
.rx-head{display:flex;justify-content:space-between;align-items:center;padding:14px 22px}
.step-count{font-size:.8rem;color:var(--muted)}
.progress{height:4px;background:var(--rule)}
.progress i{display:block;height:100%;width:14%;background:var(--accent);transition:width .35s cubic-bezier(.2,.8,.2,1)}

#quiz{padding:24px 22px 18px;position:relative;z-index:1}
.step{border:0;margin:0;padding:0;display:grid;gap:14px;animation:in .3s cubic-bezier(.2,.8,.2,1)}
.step[hidden]{display:none}
.step legend{font:400 clamp(1.5rem,3vw,1.9rem)/1.15 var(--display);padding:0;margin-bottom:14px;text-wrap:balance}
@keyframes in{from{opacity:.4;transform:translateX(12px)}to{opacity:1;transform:none}}

.opts{display:grid;gap:10px}
.opts.two{grid-template-columns:1fr 1fr}
.opts.four{grid-template-columns:repeat(4,1fr)}
.opts input{position:absolute;opacity:0;pointer-events:none}
.opts label{display:grid;gap:2px;padding:16px 18px;border:1px solid var(--rule);border-radius:10px;cursor:pointer;background:var(--sheet);transition:border-color .15s,background .15s,transform .1s}
.opts label:hover{border-color:var(--accent)}
.opts label:active{transform:scale(.99)}
.opts label b{font-weight:600}
.opts label span{font-size:.88rem;color:var(--muted)}
.opts.four label{text-align:center;padding:16px 8px}
.opts.four label b{font-size:1.6rem;font-weight:500}
.opts input:checked + label{border-color:var(--accent);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent)}
.opts input:focus-visible + label{outline:2px solid var(--accent);outline-offset:2px}
.opts.checks label{grid-template-columns:22px 1fr;column-gap:12px}
.opts.checks label::before{content:"";grid-row:span 2;width:20px;height:20px;border:1.5px solid var(--muted);border-radius:4px;margin-top:2px}
.opts.checks input:checked + label::before{background:var(--accent);border-color:var(--accent);box-shadow:inset 0 0 0 3px var(--sheet)}
.nav{min-height:36px;margin-top:8px}

.result[hidden],#quiz[hidden]{display:none}
.result{padding:8px 22px 24px;display:grid;gap:16px;position:relative;z-index:1}
.gauge-wrap{display:grid;justify-items:center;gap:0;margin-top:8px}
.gauge{width:min(320px,100%);height:auto;overflow:visible}
.g-track{fill:none;stroke:var(--rule);stroke-width:16;stroke-linecap:round}
.g-fill{fill:none;stroke:var(--accent);stroke-width:16;stroke-linecap:round;transition:stroke-dasharray .9s cubic-bezier(.2,.8,.2,1),stroke .3s}
.gauge[data-band=high] .g-fill,.gauge[data-band=very-high] .g-fill{stroke:var(--alert)}
.gauge[data-band=moderate] .g-fill{stroke:var(--mark)}
.g-ticks{display:flex;justify-content:space-between;width:min(320px,100%);font:500 .72rem var(--mono);color:var(--muted);margin-top:4px}
.gauge-label{display:grid;justify-items:center;margin-top:-66px;gap:2px}
.gauge-label strong{font:400 2.2rem/1.1 var(--display)}
.reasons{margin:0;padding:0;list-style:none;counter-reset:r;display:grid;gap:10px}
.reasons li{counter-increment:r;display:grid;grid-template-columns:28px 1fr;gap:10px;font-size:.95rem}
.reasons li::before{content:counter(r,decimal-leading-zero);font:500 .75rem var(--mono);color:var(--accent);padding-top:3px}
.row-actions{display:flex;gap:10px;flex-wrap:wrap}
.row-actions .btn{flex:1 1 180px}

.help-grid{list-style:none;margin:0 0 18px;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--rule)}
.help-grid li{padding:18px 18px 18px 0;display:grid;gap:6px;align-content:start;border-bottom:1px solid var(--rule)}
.help-grid li + li{padding-left:18px;border-left:1px solid var(--rule)}
.help-grid b{font-family:var(--display);font-weight:400;font-size:1.25rem}
.help-grid p{font-size:.93rem;color:var(--muted)}

@media (max-width:880px){
  .facts{order:2}
  .rx{order:1}
  .help-grid{grid-template-columns:1fr 1fr}
  .help-grid li:nth-child(3){padding-left:0;border-left:0}
}
@media (max-width:480px){
  #quiz,.result{padding-left:16px;padding-right:16px}
  .rx-head{padding-left:16px;padding-right:16px}
  .facts div{grid-template-columns:7em 1fr}
  .help-grid{grid-template-columns:1fr}
  .help-grid li + li{padding-left:0;border-left:0}
  .pair{grid-template-columns:1fr}
}
