:root{--bg:#faf7f2;--fg:#231f1c;--muted:#6b625a;--accent:#a4492a;--accent-fg:#fff;--card:#fff;--border:#e4dccf;--radius:14px;--font-display:Georgia,"Iowan Old Style","Palatino Linotype",serif;--font-body:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--maxw:760px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font-body);font-size:18px;line-height:1.65}
a{color:var(--accent)}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-999px;top:0;background:var(--fg);color:var(--bg);padding:10px 14px;z-index:9}
.skip:focus{left:8px;top:8px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.site-head{border-bottom:1px solid var(--border);background:var(--bg)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:14px;padding-bottom:14px}
.brand{font-family:var(--font-display);font-weight:700;font-size:1.25rem;color:var(--fg);text-decoration:none;letter-spacing:.01em}
.brand span{color:var(--accent)}
.nav{display:flex;gap:18px;flex-wrap:wrap;font-size:.95rem}
.nav a{color:var(--muted);text-decoration:none}
.nav a:hover{color:var(--fg);text-decoration:underline}
main{padding:36px 0 56px}
h1,h2,h3{font-family:var(--font-display);line-height:1.2;margin:0 0 .5em}
h1{font-size:clamp(2rem,6vw,3rem)}
h2{font-size:clamp(1.4rem,3.6vw,1.8rem);margin-top:1.8em}
h3{font-size:1.2rem;margin-top:1.4em}
p{margin:0 0 1em}
.lead{font-size:1.2rem;color:var(--muted)}
.eyebrow{font-size:.85rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 .6em}
.crumbs{font-size:.9rem;color:var(--muted);margin-bottom:18px}
.crumbs a{color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 22px;border-radius:999px;border:2px solid var(--border);background:var(--card);color:var(--fg);font:inherit;font-weight:600;font-size:1rem;cursor:pointer;text-decoration:none}
.btn:hover{border-color:var(--accent)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.btn.primary:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 8px}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:22px}
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));margin:24px 0}
.tile{display:block;padding:22px;border-radius:var(--radius);border:2px solid var(--border);background:var(--card);color:var(--fg);text-decoration:none}
.tile:hover{border-color:var(--accent)}
.tile h3{margin:0 0 6px;font-size:1.25rem}
.tile p{margin:0;color:var(--muted);font-size:.98rem}
.tile .meta{margin-top:10px;font-size:.85rem;color:var(--muted)}
.swatch{display:inline-block;width:14px;height:14px;border-radius:50%;margin-right:8px;vertical-align:-1px}
/* quiz */
.progress{height:8px;background:var(--border);border-radius:99px;overflow:hidden;margin:6px 0 22px}
.progress-fill{height:100%;background:var(--accent);transition:width .25s ease}
.q-count{color:var(--muted);font-size:.95rem;margin:0 0 .4em}
.q-text{font-size:clamp(1.35rem,4vw,1.8rem);min-height:3.4em;margin:0 0 1em}
.choices{display:grid;gap:10px}
.choice{display:flex;align-items:center;gap:14px;width:100%;text-align:left;min-height:54px;padding:10px 16px;border-radius:12px;border:2px solid var(--border);background:var(--card);color:var(--fg);font:inherit;cursor:pointer}
.choice:hover{border-color:var(--accent)}
.choice.selected{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--card))}
.choice-num{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;border:2px solid var(--border);font-weight:700;font-size:.9rem;flex:none}
.q-nav{margin-top:18px}
.hint{color:var(--muted);font-size:.9rem;margin-top:14px}
.result-card{background:var(--card);border:2px solid var(--accent);border-radius:var(--radius);padding:26px}
.result-name{font-size:clamp(1.8rem,6vw,2.6rem);margin:.1em 0 .2em;color:var(--accent)}
.result-tagline{font-size:1.15rem;color:var(--muted)}
.spread{display:grid;gap:10px;margin:18px 0}
.spread-row{display:grid;grid-template-columns:110px 1fr 46px;gap:12px;align-items:center;font-size:.95rem}
.spread-track{height:12px;background:var(--border);border-radius:99px;overflow:hidden}
.spread-fill{height:100%;border-radius:99px}
.spread-pct{text-align:right;color:var(--muted)}
.axis{margin:18px 0}
.axis-labels{display:flex;justify-content:space-between;font-size:.9rem;color:var(--muted);margin-bottom:6px}
.axis-track{position:relative;height:12px;background:var(--border);border-radius:99px}
.axis-dot{position:absolute;top:50%;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:var(--accent);border:3px solid var(--card)}
.fine{font-size:.88rem;color:var(--muted);margin-top:14px}
.second{margin-top:6px}
/* article */
.prose h2{border-top:1px solid var(--border);padding-top:1.1em}
.prose ul{padding-left:1.2em;margin:0 0 1em}
.prose li{margin:.3em 0}
details.faq{border:1px solid var(--border);border-radius:12px;padding:12px 16px;margin:10px 0;background:var(--card)}
details.faq summary{cursor:pointer;font-weight:600}
details.faq p{margin:.6em 0 0}
.more{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));margin:14px 0 0}
.notice{border-left:4px solid var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--card));padding:12px 16px;border-radius:0 10px 10px 0;font-size:.95rem;color:var(--muted)}
.site-foot{border-top:1px solid var(--border);padding:28px 0 40px;color:var(--muted);font-size:.92rem}
.site-foot .wrap{display:grid;gap:10px}
.site-foot a{color:var(--muted)}
.foot-links{display:flex;gap:16px;flex-wrap:wrap}
@media(max-width:560px){body{font-size:17px}.site-head .wrap{flex-direction:column;align-items:flex-start;gap:6px}.nav{gap:4px 16px;font-size:.9rem}.spread-row{grid-template-columns:92px 1fr 42px}.actions .btn{flex:1 1 100%}main{padding-top:24px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.q-text:focus,.result-name:focus{outline:none}

/* One theme per quiz. The skeleton (base.css) stays the same. */
body.theme-home{--bg:#f7f4ee;--accent:#2f6f5e;--border:#dcd6c8}
body.theme-soul{--bg:#0b0d12;--fg:#e9ecf3;--muted:#9aa3b5;--accent:#7be3a6;--accent-fg:#06130c;--card:#12161f;--border:#262c3a;--radius:4px;--font-display:ui-monospace,"SF Mono",Menlo,Consolas,monospace;--font-body:ui-monospace,"SF Mono",Menlo,Consolas,monospace}
body.theme-soul h1,body.theme-soul h2,body.theme-soul h3{letter-spacing:.02em;text-transform:none}
body.theme-soul .btn,body.theme-soul .choice,body.theme-soul .tile,body.theme-soul .card,body.theme-soul .result-card{border-radius:4px;box-shadow:4px 4px 0 var(--border)}
body.theme-soul .btn{border-radius:4px}
body.theme-soul .progress,body.theme-soul .progress-fill,body.theme-soul .spread-track,body.theme-soul .spread-fill{border-radius:0}
body.theme-soul .site-head{background:#080a0e}
body.theme-soul .pixel-heart{display:block;margin:0 0 14px;image-rendering:pixelated}
body.theme-love{--bg:#fff5f1;--fg:#3a2327;--muted:#7a5d62;--accent:#c8445f;--accent-fg:#fff;--card:#fffdfc;--border:#f0d6d2;--radius:22px}
body.theme-love .btn{border-radius:999px}
body.theme-attach{--bg:#eef3f6;--fg:#1f2d38;--muted:#566876;--accent:#3d6f8f;--accent-fg:#fff;--card:#fbfdfe;--border:#d3dfe7;--radius:18px;--font-display:"Avenir Next",Avenir,"Segoe UI",system-ui,sans-serif}
body.theme-attach h1,body.theme-attach h2,body.theme-attach h3{font-weight:600}
body.theme-align{--bg:#f1e6cf;--fg:#2c2418;--muted:#6b5a3d;--accent:#7d2e1e;--accent-fg:#fbf3e2;--card:#f9f0dc;--border:#cdb88c;--radius:6px;--font-display:"Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;--font-body:Georgia,"Times New Roman",serif}
body.theme-align .btn,body.theme-align .choice,body.theme-align .tile,body.theme-align .card,body.theme-align .result-card{border-radius:6px}
body.theme-align .btn{border-radius:6px}
.align-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:18px 0;max-width:420px}
.align-grid div{border:2px solid var(--border);border-radius:6px;padding:10px 4px;text-align:center;font-size:.8rem;line-height:1.2;background:var(--card)}
.align-grid .on{background:var(--accent);color:var(--accent-fg);border-color:var(--accent);font-weight:700}
body.theme-nd{--bg:#f4f0e8;--fg:#2b2622;--muted:#6f655b;--accent:#a4492a;--accent-fg:#fff;--card:#fffdf8;--border:#e2d9ca;--radius:12px;--font-display:"Newsreader",Georgia,"Times New Roman",serif}
