:root{--bg:#fafbfd;--bg2:#eef2fb;--panel:#fff;--text:#1f2633;--muted:#566070;--line:#e4e8f0;--accent:#4f7cff;--brand:#3a66ec;--brand2:#2f57d6;--tint:#f5f8ff;--good:#157347;--goodbg:#e8f7ef;--bad:#b42318;--badbg:#fdecea;--focus:#9fb8ff;--r:16px;--sh:0 1px 2px rgba(31,38,51,.04),0 8px 24px rgba(31,38,51,.06);color-scheme:light}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-padding-top:80px}
body{margin:0;font:16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
a{color:var(--brand)}a:hover{color:var(--brand2)}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:6px}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:.5rem 1rem;z-index:30}.skip:focus{left:1rem}
.wrap{max-width:1080px;margin:0 auto;padding:0 1.25rem}.narrow{max-width:760px}
header.site{position:sticky;top:0;z-index:20;background:rgba(250,251,253,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;align-items:center;gap:1rem;min-height:64px}
.logo{display:flex;align-items:center;gap:.55rem;font-weight:750;color:var(--text);text-decoration:none;letter-spacing:-.01em}.logo svg{width:30px;height:30px}
nav.top{margin-left:auto;display:flex;gap:.2rem;font-size:.93rem}
nav.top a{color:var(--muted);text-decoration:none;padding:.45rem .65rem;border-radius:10px}nav.top a:hover{background:var(--bg2);color:var(--text)}nav.top a[aria-current]{color:var(--text);font-weight:650}
@media(max-width:760px){header.site .wrap{flex-wrap:wrap;min-height:0;padding-top:.45rem}nav.top{order:3;width:100%;margin:0 -.65rem;overflow-x:auto;white-space:nowrap;padding-bottom:.3rem}}
.crumbs{font-size:.85rem;color:var(--muted);margin:1.1rem 0 0}.crumbs a{color:var(--muted)}
.hero{position:relative;text-align:center;max-width:720px;margin:0 auto;padding:clamp(2rem,5vw,3.25rem) 0 1.5rem}
.hero.band::before{content:"";position:absolute;z-index:-1;top:0;bottom:-140px;left:50%;width:100vw;margin-left:-50vw;background:linear-gradient(180deg,#e9effe,#f3f6ff);border-bottom:1px solid #e1e8fb}
main{isolation:isolate;overflow-x:clip}
.eyebrow{display:inline-block;margin:0 0 .9rem;padding:.3rem .8rem;border-radius:999px;background:#fff;color:var(--brand2);font-size:.82rem;font-weight:650}
h1{font-size:clamp(1.8rem,4.2vw,2.7rem);line-height:1.15;margin:0 0 .9rem;letter-spacing:-.025em;font-weight:780}
.intro{color:var(--muted);font-size:clamp(1rem,1.6vw,1.12rem);margin:0 auto;max-width:620px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;font:inherit;font-weight:650;border:0;border-radius:12px;padding:.75rem 1.3rem;background:var(--brand);color:#fff;cursor:pointer;text-decoration:none;min-height:44px;transition:background .15s,transform .1s}
.btn:hover{background:var(--brand2);color:#fff}.btn:active{transform:translateY(1px)}
.btn.ghost{background:#fff;color:var(--brand2);box-shadow:inset 0 0 0 1px var(--line)}.btn.ghost:hover{background:var(--tint)}
.dq{background:var(--panel);border:1px solid var(--line);border-radius:22px;box-shadow:var(--sh);padding:clamp(1.1rem,3vw,2rem);max-width:760px;margin:0 auto 2rem}
.dq-app{min-height:300px}.dq-loading{color:var(--muted)}
.dq-kicker{margin:0;color:var(--muted);font-size:.9rem}.dq-title{margin:.15rem 0 1rem;font-size:1.5rem;letter-spacing:-.015em}
.dq-row{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin:.75rem 0}.dq-lbl{font-weight:600;font-size:.93rem}
.seg{display:inline-flex;background:var(--bg2);border-radius:12px;padding:3px}
.seg button{font:inherit;font-size:.9rem;border:0;background:none;padding:.45rem .85rem;border-radius:9px;cursor:pointer;color:var(--muted);min-height:36px}
.seg button.on{background:#fff;color:var(--text);font-weight:650;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.check{display:inline-flex;gap:.5rem;align-items:center;cursor:pointer}.check input{width:18px;height:18px;accent-color:var(--brand)}
.dq-meta{color:var(--muted);font-size:.93rem}
.dq-progress{height:6px;background:var(--bg2);border-radius:9px;overflow:hidden;margin-bottom:.9rem}.dq-progress span{display:block;height:100%;background:var(--accent);transition:width .3s}
.dq-qmeta{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;font-size:.86rem;color:var(--muted)}
.pill{display:inline-block;padding:.12rem .6rem;border-radius:999px;background:var(--tint);color:var(--brand2);font-size:.8rem;font-weight:600}
.pill.d-e{background:#e8f7ef;color:#11643c}.pill.d-h{background:#fdf0e6;color:#9a3d06}
.dq-timer{margin-left:auto;font-weight:700;font-variant-numeric:tabular-nums}.dq-timer.low{color:var(--bad)}
.dq-q{font-size:clamp(1.2rem,2.6vw,1.45rem);line-height:1.35;margin:.7rem 0 1.1rem;outline:none}
.dq-opts{display:grid;gap:.6rem}@media(min-width:620px){.dq-opts{grid-template-columns:1fr 1fr}}
.dq-opt{display:flex;align-items:center;gap:.75rem;text-align:left;font:inherit;font-size:1rem;padding:.85rem 1rem;border-radius:14px;border:1.5px solid var(--line);background:#fff;color:var(--text);cursor:pointer;min-height:56px;transition:border-color .15s,background .15s}
.dq-opt:hover:not(:disabled){border-color:var(--accent);background:var(--tint)}
.dq-opt kbd{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--bg2);font:600 .82rem system-ui;color:var(--muted)}
.dq-opt:disabled{cursor:default}.dq-opt.right{border-color:#2f9e63;background:var(--goodbg)}.dq-opt.right kbd{background:#2f9e63;color:#fff}
.dq-opt.wrong{border-color:#d9483b;background:var(--badbg)}.dq-opt.wrong kbd{background:#d9483b;color:#fff}
.dq-fb{margin-top:1rem}.dq-verdict{font-weight:750;margin:0}.dq-verdict.ok{color:var(--good)}.dq-verdict.no{color:var(--bad)}.dq-x{margin:.3rem 0 1rem;color:var(--muted)}
.dq-card{text-align:center}.dq-score{font-size:1.4rem;margin:.4rem 0 0;color:var(--muted)}.dq-score strong{font-size:3.5rem;color:var(--text);letter-spacing:-.03em}
.dq-msg{font-weight:650;margin:.2rem 0}.dq-grid{font-size:1.5rem;letter-spacing:2px;margin:.5rem 0}.dq-streak{font-weight:650}
.dq-acts{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;margin:1rem 0 .4rem}.dq-status{min-height:1.5em;color:var(--good);font-size:.92rem;white-space:pre-line}
details{border:1px solid var(--line);border-radius:14px;padding:.2rem 1rem;background:#fff;margin:.8rem 0}
details>summary{cursor:pointer;font-weight:650;padding:.6rem 0;list-style-position:outside}
.dq-review ol{padding-left:1.2rem}.dq-review li{margin:.6rem 0}.dq-review li span,.dq-review li small{display:block}.dq-review li.ok span{color:var(--good)}.dq-review li.no span{color:var(--bad)}.dq-review small{color:var(--muted)}
.dq-stats{margin-top:1.2rem;border-top:1px solid var(--line);padding-top:1rem}.dq-stats h3{margin:.2rem 0 .8rem}
.dq-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;text-align:center}.dq-stat-grid strong{display:block;font-size:1.6rem}.dq-stat-grid span{font-size:.8rem;color:var(--muted)}
@media(max-width:480px){.dq-stat-grid{grid-template-columns:repeat(2,1fr)}}
.dq-dist .r{display:flex;align-items:center;gap:.5rem;font-size:.82rem;margin:3px 0}.dq-dist .r span{width:1.4rem;text-align:right}.dq-dist i{display:block;background:var(--accent);color:#fff;font-style:normal;text-align:right;padding:0 .4rem;border-radius:5px;min-width:1.4rem}
.dq-catacc{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.4rem}.dq-catacc li{display:flex;gap:.5rem;align-items:baseline;background:var(--tint);padding:.4rem .7rem;border-radius:10px}.dq-catacc b{margin-left:auto}.dq-catacc small{color:var(--muted)}
.hint{font-size:.85rem;color:var(--muted)}


section.block{padding:2.25rem 0}section.block h2{font-size:clamp(1.35rem,2.6vw,1.75rem);letter-spacing:-.02em;margin:0 0 .8rem}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.8rem;padding:0;list-style:none}
.cards a{display:block;height:100%;padding:1rem 1.1rem;background:#fff;border:1px solid var(--line);border-radius:14px;text-decoration:none;color:var(--text);box-shadow:var(--sh);transition:border-color .15s,transform .15s}
.cards a:hover{border-color:var(--accent);transform:translateY(-2px)}.cards strong{display:block}.cards span{font-size:.88rem;color:var(--muted)}
.feat{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1rem}.feat div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:1rem}.feat h3{margin:.1rem 0 .3rem;font-size:1.02rem}.feat p{margin:0;color:var(--muted);font-size:.93rem}
.dq-archive ol{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.5rem}.dq-archive li{display:flex;align-items:center;gap:.5rem;background:#fff;border:1px solid var(--line);border-radius:12px;padding:.6rem .9rem}.dq-archive li .pill{margin-left:auto}
footer.site{border-top:1px solid var(--line);margin-top:3rem;padding:2rem 0;color:var(--muted);font-size:.9rem}footer.site .cols{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem}footer.site a{color:var(--muted)}
.pack-round{break-inside:avoid}.pack-round ol{padding-left:1.4rem}.pack-round li{margin:.3rem 0}.answers{break-before:page}
.toolbar{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center;margin:1rem 0}
@media print{header.site,footer.site,.toolbar,.no-print,.crumbs,.hero.band::before{display:none!important}body{background:#fff;font-size:12pt}.wrap{max-width:none;padding:0}.hero{padding:0;text-align:left}.answers{break-before:page;page-break-before:always}a{color:#000;text-decoration:none}details{border:0;padding:0}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media(max-width:420px){.dq-grid{font-size:1.15rem;letter-spacing:0}}
/* quiz-first layout */
.top-line{margin:.9rem auto .6rem;max-width:760px}.top-line h1{font-size:clamp(1.1rem,2.4vw,1.4rem);margin:0;letter-spacing:-.01em;line-height:1.3}.top-line h1 small{font-weight:500;color:var(--muted);font-size:.85em}
.dq{padding:clamp(.9rem,2.5vw,1.5rem);margin-bottom:1.5rem}.dq-app{min-height:360px}
.dq-ctl{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .9rem;margin:0 0 .6rem;font-size:.88rem}.dq-ctl .seg button{padding:.3rem .65rem;min-height:32px;font-size:.85rem}.check.sm input{width:16px;height:16px}.dq-sk{margin-left:auto;font-weight:700}
.dq-headline{width:100%;margin:0;color:var(--muted);font-size:.85rem}
.dq-progress{margin-bottom:.6rem}.dq-q{margin:.45rem 0 .8rem}.dq-opt{min-height:50px;padding:.65rem .9rem}
@media(max-width:620px){.dq-opts{gap:.45rem}.dq-q{font-size:1.12rem}}
.below-intro{color:var(--muted);max-width:760px;margin:0 auto 1rem}
.dq-app{min-height:300px}@media(max-width:620px){.dq-app{min-height:420px}}@media(max-width:380px){.dq-app{min-height:450px}}
/* 10-on-a-page list */
.dq-list{list-style:none;margin:0;padding:0}.dq-item{padding:.9rem 0 1.1rem;border-top:1px solid var(--line)}.dq-item:first-child{border-top:0;padding-top:.2rem}
.dq-item.is-ok .dq-q::after{content:" ✓";color:var(--good)}.dq-item.is-no .dq-q::after{content:" ✗";color:var(--bad)}
.dq-item .dq-fb{margin-top:.5rem}.dq-item .dq-fb:empty{display:none}.dq-item .dq-x{margin:.15rem 0 0}
.dq-foot{border-top:1px solid var(--line);padding-top:1rem;margin-top:.2rem}.dq-count{margin:0;color:var(--muted);font-size:.9rem;text-align:center}
.dq-foot .dq-card+.dq-stats{margin-top:1rem}.dq-app{min-height:0}
