:root {
  color-scheme: light;
  --ink:#421725;
  --muted:#65545a;
  --paper:#fffdf9;
  --ground:#faf5ef;
  --line:#e2d5ce;
  --gold:#dfbc82;
  --forest:#5d2338;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ink);
  background:var(--ground);
}
* { box-sizing:border-box; }
body { margin:0; min-width:280px; }
.wrap { width:min(1100px,calc(100% - 64px)); margin-inline:auto; }
.site-header { background:var(--paper); border-bottom:1px solid var(--line); }
.header-inner { display:flex; align-items:center; gap:13px; min-height:76px; }
.brand-logo { flex:none; width:58px; height:46px; object-fit:contain; padding:6px; border-radius:8px; background:var(--ink); }
.brand { font-family:Georgia,serif; font-weight:bold; font-size:20px; }
.brand small,.header-note,.eyebrow,.footer,.progress-label,.art-caption { font-family:system-ui,sans-serif; font-size:11px; font-weight:700; letter-spacing:.14em; }
.brand small { display:block; font-size:8px; letter-spacing:.15em; margin-top:3px; }
.header-note { margin-left:auto; color:var(--muted); }
main { padding-top:45px; }
.hero,.result-banner { color:#fff9ee; background:radial-gradient(ellipse at 83% 42%,#762b46 0%,#421725 58%,#36111e 100%); border-radius:24px; }
.hero { display:grid; grid-template-columns:1.35fr 1fr; align-items:center; overflow:hidden; }
.hero-copy { padding:58px 0 55px 58px; }
.eyebrow { margin:0; color:#765824; }
.hero .eyebrow,.result-banner .eyebrow { color:var(--gold); }
.eyebrow span { display:inline-block; width:19px; height:1px; margin:0 8px 3px 0; background:currentColor; }
h1,h2 { font-family:Georgia,"Times New Roman",serif; letter-spacing:-.034em; font-weight:500; }
h1 { font-size:clamp(39px,5vw,68px); line-height:1.02; margin:22px 0; }
h1:focus { outline:none; }
h1 em { color:var(--gold); }
h2 { font-size:32px; margin:0 0 10px; line-height:1.1; }
.intro { color:#f4e5e9; max-width:40ch; line-height:1.65; margin:0 0 27px; }
button { font:inherit; font-weight:700; cursor:pointer; min-height:49px; border-radius:10px; padding:11px 20px; }
button span { margin-left:8px; }
button:focus-visible { outline:3px solid #ae7835; outline-offset:4px; }
.primary { background:var(--ink); color:white; border:1px solid transparent; }
.primary:hover:not(:disabled) { background:#6b2841; }
.hero .primary { background:var(--gold); color:#37111f; }
.hero .primary:hover { background:#f0cf9c; }
.primary:disabled { background:#eee5e1; color:#6d5961; cursor:default; }
.secondary { color:var(--ink); background:transparent; border:1px solid var(--line); }
.secondary:hover { background:#f6ece9; }
.secondary span:first-child { margin-left:0; }
.meta { margin:14px 0 0; color:#e5dbc6; font-size:13px; }
.meta span { padding:0 6px; }
.hero-art { text-align:center; padding:25px 32px; }
.hero-medallion { display:grid; place-items:center; width:min(100%,305px); aspect-ratio:1; margin:0 auto 16px; border-radius:50%; border:1px solid #d1af7866; box-shadow:inset 0 0 0 10px #e2b9850b,0 0 0 8px #e2b9850b; }
.hero-medallion img { width:68%; height:auto; }
.art-caption { color:#ead3a9; display:block; margin:3px 0 0; font-size:9px; }
.overview { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:17px; }
.profile-chip { display:flex; gap:12px; align-items:center; padding:15px; border:1px solid var(--line); border-radius:14px; background:var(--paper); min-width:0; }
.profile-chip strong { display:block; font-family:Georgia,serif; font-size:21px; }
.profile-chip small,.score-label small { color:var(--muted); }
.profile-icon { display:grid; place-items:center; flex:none; width:42px; height:42px; border-radius:50%; background:#f5f1e9; color:var(--accent); }
.profile-icon svg,.score-label svg { width:23px; height:23px; }
.footer { display:flex; justify-content:space-between; gap:12px; margin-top:34px; padding:20px 0 24px; border-top:1px solid var(--line); color:var(--muted); }
.footer span:last-child { letter-spacing:.02em; }
.quiz { max-width:680px; margin:auto; }
.progress-label { display:flex; justify-content:space-between; gap:12px; margin-bottom:9px; }
.progress-label span:last-child { color:var(--muted); letter-spacing:.02em; }
progress { width:100%; height:7px; appearance:none; display:block; border:0; background:#e6e0d2; border-radius:100px; overflow:hidden; margin-bottom:19px; }
progress::-webkit-progress-bar { background:#e6e0d2; }
progress::-webkit-progress-value { background:#78304a; }
progress::-moz-progress-bar { background:#78304a; }
.paper { border:1px solid var(--line); border-radius:18px; background:var(--paper); padding:clamp(19px,4vw,36px); }
.quiz h1 { font-size:clamp(32px,4.4vw,49px); margin:0 0 9px; }
.hint { color:var(--muted); font-size:14px; line-height:1.55; margin:0; }
.options { display:grid; gap:9px; margin:23px 0; }
.option { display:grid; grid-template-columns:26px minmax(0,1fr) 18px; align-items:center; gap:10px; min-height:57px; padding:12px 14px; position:relative; cursor:pointer; border:1px solid var(--line); border-radius:10px; }
.option:hover { background:#f7f5ed; }
.option:has(input:checked) { background:#f8edf0; border-color:#8a4560; }
.option:has(input:focus-visible) { outline:3px solid #ae7835; outline-offset:2px; }
.option input { position:absolute; width:1px; height:1px; opacity:0; }
.option-number { font-size:11px; font-weight:700; color:#6d5a3a; }
.radio-mark { width:18px; height:18px; border-radius:50%; border:1px solid #a48f96; }
input:checked ~ .radio-mark { background:#78304a; border:4px solid #f8edf0; outline:1px solid #78304a; outline-offset:-1px; }
.actions,.result-actions { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.actions .secondary span { margin-right:5px; }
.result-banner { padding:clamp(24px,5vw,48px); margin-bottom:18px; }
.result-banner h1 { margin:13px 0; color:var(--gold); }
.result-banner p:last-child { margin:0; color:#f4e5e9; }
.result-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:18px; align-items:start; }
.scores { margin:22px 0 0; list-style:none; padding:0; display:grid; gap:17px; }
.score-label,.score-label span { display:flex; align-items:center; gap:7px; }
.score-label { justify-content:space-between; }
.score-label svg { color:var(--accent); }
.bar { background:#ece8dc; border-radius:8px; height:7px; margin:7px 0 4px; overflow:hidden; }
.bar span { display:block; height:100%; background:var(--accent); border-radius:8px; }
.scores li > small { color:var(--muted); }
.profile-guide { margin:12px 0 0; color:var(--muted); font-size:14px; line-height:1.55; }
.summaries { display:grid; gap:14px; }
.profile-nav { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:8px; }
.profile-nav button { padding:8px 12px; min-height:44px; font-size:14px; }
.profile-nav button[hidden] { display:block; visibility:hidden; }
#previous-profile { justify-self:start; }
#next-profile { justify-self:end; }
#profile-position { white-space:nowrap; }
.summary h2 { margin-top:9px; }
.summary h2:focus { outline:none; }
.summary h2 small { font:600 14px system-ui,sans-serif; color:var(--muted); }
.summary p:not(.eyebrow),.summary dd { line-height:1.55; color:#563f49; }
.summary dl { margin-bottom:0; }
.summary dt { font-size:14px; font-weight:750; margin-top:13px; }
.summary dd { margin:3px 0 0; font-size:14px; }
.report-panel { display:grid; grid-template-columns:1fr auto; align-items:center; gap:12px 20px; margin-top:18px; }
.report-panel h2 { font-size:clamp(23px,3vw,30px); }
.report-panel .hint { max-width:62ch; }
.report-buttons { display:flex; flex-wrap:wrap; gap:8px; }
.report-download { display:inline-flex; min-height:49px; align-items:center; gap:8px; padding:11px 20px; border-radius:10px; text-decoration:none; font-weight:700; }
.report-download[hidden] { display:none; }
.report-download:focus-visible { outline:3px solid #ae7835; outline-offset:4px; }
.report-buttons button:disabled { opacity:.55; cursor:default; }
#report-status { grid-column:1 / -1; }
.result-actions { margin-top:17px; }
.result-actions button { flex:none; }
@media (max-width:850px) {
  .hero-copy { padding:43px 0 43px 35px; }
  .hero-art { padding-inline:19px; }
  .profile-chip { padding:10px; gap:7px; }
}
@media (max-width:640px) {
  .wrap { width:calc(100% - 28px); }
  .header-inner { min-height:63px; }
  .header-note { display:none; }
  main { padding-top:19px; }
  .hero { grid-template-columns:1fr; }
  .hero-copy { padding:30px 23px; }
  .hero-art { display:none; }
  .report-panel { grid-template-columns:1fr; }
  .report-buttons button,.report-download { font-size:14px; padding-inline:12px; }
  .overview { grid-template-columns:repeat(2,1fr); gap:8px; margin-top:10px; }
  .profile-chip strong { font-size:18px; }
  .profile-icon { width:35px; height:35px; }
  .result-grid { grid-template-columns:1fr; }
  .result-actions { align-items:flex-start; flex-direction:column; }
  .actions button { padding:10px 12px; font-size:14px; }
  .footer { margin-top:25px; font-size:9px; }
}
