@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fraunces:opsz,wght@9..144,600;9..144,700&display=swap');

:root{--ink:#15233d;--ink-2:#20375d;--paper:#fafcff;--cream:#eaf5fc;--sun:#f5b82e;--coral:#ff806c;--mint:#a9d8f5;--sky:#cfeaff;--line:#b7c9dc;--muted:#58677c;--white:#fff;--shadow:0 18px 50px rgba(36,87,214,.12)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif;min-height:100vh}
button,input,textarea{font:inherit}
button,a{touch-action:manipulation}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--sun);outline-offset:3px}
.site-header{min-height:76px;display:flex;align-items:center;justify-content:space-between;padding:14px clamp(20px,5vw,74px);border-bottom:1px solid var(--line);background:rgba(255,253,247,.94);position:sticky;top:0;z-index:20;backdrop-filter:blur(10px)}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);font-weight:600;font-size:18px}.brand strong{color:#b74838}.brand-mark{width:42px;height:42px;display:grid;place-items:center;background:var(--ink);border-radius:50%}.brand-mark svg{width:30px;fill:none;stroke:var(--sun);stroke-width:2.3}
.text-button{border:0;background:none;color:var(--ink);font-weight:700;text-decoration:underline;text-decoration-color:var(--coral);text-underline-offset:5px;cursor:pointer;padding:10px}
main{min-height:calc(100vh - 150px)}
.screen{display:none}.screen.is-active{display:grid}
.welcome{min-height:calc(100vh - 150px);grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);align-items:center;gap:clamp(30px,5vw,90px);padding:clamp(52px,8vw,110px) clamp(22px,7vw,110px);overflow:hidden;background:linear-gradient(90deg,var(--paper) 0 59%,var(--cream) 59%)}
.welcome-copy{max-width:720px;position:relative;z-index:2}.hand-note{display:inline-block;font-weight:700;color:#a33f32;transform:rotate(-2deg);border-bottom:3px solid var(--sun);padding-bottom:3px;margin:0 0 22px}
h1,h2,h3{font-family:"Fraunces",Georgia,serif;letter-spacing:-.045em}h1{font-size:clamp(48px,7vw,94px);line-height:.96;margin:0 0 28px;max-width:850px}h1 span{position:relative;white-space:nowrap}h1 span:after{content:"";position:absolute;left:0;right:0;bottom:2px;height:13px;background:var(--sun);z-index:-1;transform:rotate(-2deg)}
.lead{font-size:clamp(18px,2vw,23px);line-height:1.5;color:var(--muted);max-width:620px;margin:0 0 32px}.privacy-note{font-size:13px;color:var(--muted);margin:16px 0 0}
.primary-button,.secondary-button{border-radius:8px;padding:14px 20px;min-height:50px;font-weight:700;cursor:pointer;border:2px solid var(--ink)}.primary-button{background:var(--ink);color:var(--white);box-shadow:5px 5px 0 var(--sun)}.primary-button:hover{background:var(--ink-2);transform:translate(-1px,-1px)}.secondary-button{background:transparent;color:var(--ink)}.secondary-button:hover{background:var(--cream)}
.map-visual{height:520px;position:relative;max-width:620px;width:100%;justify-self:center;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.8) 0 3px,transparent 4px),linear-gradient(118deg,transparent 0 47%,rgba(24,51,47,.06) 48% 51%,transparent 52%);background-size:28px 28px,100% 100%;border:1px solid rgba(24,51,47,.14);transform:rotate(1deg)}
.route{position:absolute;border:4px dashed var(--coral);border-color:var(--coral) transparent transparent var(--coral);border-radius:50%;transform:rotate(20deg)}.route-a{width:390px;height:220px;left:55px;top:130px}.route-b{width:280px;height:150px;right:30px;bottom:25px;transform:rotate(190deg);border-color:var(--ink) transparent transparent var(--ink)}
.map-word{position:absolute;font-weight:800;letter-spacing:-.03em;background:var(--paper);padding:6px 9px;box-shadow:3px 3px 0 var(--sun)}.word-you{left:25px;top:90px}.word-people{right:22px;top:130px}.word-lane{left:80px;bottom:45px}.map-pin{position:absolute;width:23px;height:23px;border:6px solid var(--ink);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}.pin-one{left:160px;top:210px}.pin-two{right:110px;bottom:115px;border-color:var(--coral)}
.compass-large{position:absolute;display:grid;place-items:center;width:185px;height:185px;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-7deg);background:var(--sun);border-radius:50%;box-shadow:12px 14px 0 rgba(24,51,47,.14)}.compass-large svg{width:145px;fill:none;stroke:var(--ink);stroke-width:4}
.quiz{min-height:calc(100vh - 150px);grid-template-columns:minmax(140px,.3fr) minmax(0,1fr);gap:clamp(30px,7vw,120px);padding:clamp(40px,6vw,85px) clamp(22px,8vw,130px);background:linear-gradient(90deg,var(--cream) 0 28%,var(--paper) 28%)}
.progress-wrap{align-self:start;position:sticky;top:120px}.progress-wrap p{font-weight:600;margin:0 0 14px}.progress-wrap p span{font-family:"Fraunces",serif;font-size:54px;color:#a33f32}.progress{width:100%;height:7px;background:#d9d2bf;border-radius:10px;overflow:hidden}.progress i{display:block;height:100%;background:var(--coral)}
.question-card{max-width:860px;padding:clamp(10px,2vw,28px) 0}.question-kicker{font-weight:800;color:#a33f32;margin:0 0 12px}.question-card h2,.results-intro h2{font-size:clamp(40px,5vw,68px);line-height:1.03;margin:0 0 18px}.question-card>p:not(.question-kicker):not(.field-help){font-size:18px;line-height:1.55;color:var(--muted);max-width:700px;margin:0 0 30px}
label{display:block;font-weight:700;margin:25px 0 9px}textarea,input{width:100%;border:2px solid var(--ink);border-radius:7px;background:white;color:var(--ink);padding:15px 16px;font-size:17px}textarea{resize:vertical;min-height:125px}.field-help{font-size:14px;color:var(--muted);min-height:21px}.field-help.error{color:#a32825;font-weight:700}
.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:28px 0 18px}.choice{position:relative;text-align:left;padding:17px 18px;border:2px solid #afa891;border-radius:7px;background:var(--white);color:var(--ink);cursor:pointer;min-height:92px}.choice strong,.choice span{display:block}.choice strong{font-size:16px;margin-bottom:5px}.choice span{font-size:14px;color:var(--muted);line-height:1.35}.choice:hover{border-color:var(--ink);background:#fff8de}.choice.is-selected{border-color:var(--ink);background:var(--sun);box-shadow:4px 4px 0 var(--ink)}.choice.is-selected span{color:var(--ink)}
.button-row{display:flex;justify-content:space-between;gap:14px;margin-top:34px}.button-row .next,.button-row #reveal{margin-left:auto}
.results-screen{padding:clamp(46px,7vw,90px) clamp(20px,7vw,100px);justify-items:center;background:linear-gradient(180deg,var(--cream),var(--paper) 52%)}.results-intro{text-align:center;margin-bottom:34px}.results-intro p:last-child{color:var(--muted);font-size:18px}.clarity-card{width:min(900px,100%);background:var(--paper);border:2px solid var(--ink);box-shadow:12px 14px 0 var(--ink);padding:clamp(24px,5vw,56px);position:relative;overflow:hidden}.clarity-card:after{content:"";width:170px;height:170px;position:absolute;right:-70px;top:-75px;background:var(--sun);border-radius:50%;z-index:0}.card-top{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding-bottom:15px;position:relative;z-index:1}.card-top p{font-weight:800;margin:0}.card-top span:last-child{margin-left:auto;color:var(--muted);font-size:13px}.mini-compass{font-size:22px;color:#a33f32}.card-title{padding:38px 0 28px}.card-title p,.first-move p{color:#a33f32;font-weight:700;margin:0 0 7px}.card-title h3{font-size:clamp(32px,5vw,58px);line-height:1.02;margin:0;max-width:740px}.clarity-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:0;border-block:1px solid var(--line)}.clarity-facts div{padding:18px;border-right:1px solid var(--line)}.clarity-facts div:last-child{border:0}.clarity-facts dt{font-size:13px;color:var(--muted);margin-bottom:6px}.clarity-facts dd{margin:0;font-weight:700;line-height:1.35}.ideas-block{padding:30px 0 18px}.ideas-block h4{font-family:"Fraunces",serif;font-size:25px;margin:0 0 17px}.ideas-block ol{display:grid;gap:14px;padding-left:25px}.ideas-block li{padding-left:8px;line-height:1.5}.ideas-block li strong{display:block;color:#a33f32}.first-move{background:var(--mint);padding:20px 22px;border-left:6px solid var(--ink)}.first-move strong{line-height:1.5}
.result-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:40px 0}.next-step{width:min(760px,100%);background:var(--ink);color:white;padding:28px 30px;display:grid;grid-template-columns:1fr auto;gap:8px 25px;align-items:center}.next-step p{font-family:"Fraunces",serif;font-size:25px;margin:0}.next-step span{color:#d6e5df;line-height:1.5}.next-step a{grid-column:2;grid-row:1/3;background:var(--sun);color:var(--ink);font-weight:800;text-decoration:none;padding:14px 18px;border-radius:6px;text-align:center}.restart-bottom{margin-top:25px}.toast{min-height:24px;font-weight:700;color:#a33f32}
footer{min-height:74px;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px clamp(22px,5vw,74px);background:var(--ink);color:#d9e6e2;font-size:13px}footer p{margin:0}
@media(max-width:850px){.welcome{grid-template-columns:1fr;background:var(--paper)}.map-visual{height:360px;background-color:var(--cream)}.quiz{grid-template-columns:1fr;background:var(--paper)}.progress-wrap{position:static}.progress-wrap p span{font-size:34px}.clarity-facts{grid-template-columns:1fr}.clarity-facts div{border-right:0;border-bottom:1px solid var(--line)}.next-step{grid-template-columns:1fr}.next-step a{grid-column:1;grid-row:auto;margin-top:10px}}
@media(max-width:600px){.site-header{min-height:66px}.brand{font-size:16px}.brand-mark{width:36px;height:36px}.welcome,.quiz{padding:40px 20px}.map-visual{height:310px}.compass-large{width:135px;height:135px}.compass-large svg{width:106px}.choice-grid{grid-template-columns:1fr}.choice{min-height:82px}.button-row{flex-direction:column-reverse}.button-row button{width:100%}.clarity-card{box-shadow:7px 8px 0 var(--ink)}.result-actions{display:grid;width:100%}.result-actions button{width:100%}footer{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:no-preference){.screen.is-active .question-card,.screen.is-active .results-intro{animation:arrive .35s ease-out both}@keyframes arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}}
@media print{.site-header,.results-intro,.result-actions,.next-step,.restart-bottom,.toast,footer{display:none!important}body{background:white}.screen{display:none!important}.results-screen.is-active{display:block!important;padding:0}.clarity-card{box-shadow:none;width:100%;border:1px solid #222;break-inside:avoid}}

/* Anchor-topic update: one main subject, supporting interests kept separate. */
.clarity-facts{grid-template-columns:repeat(4,1fr)}
.supporting-topics{display:flex;gap:12px;align-items:baseline;padding:16px 18px;background:#f6f1e3;border-bottom:1px solid var(--line)}
.supporting-topics p{font-size:13px;color:var(--muted);margin:0;white-space:nowrap}
.supporting-topics span{font-weight:700}
@media(max-width:850px){.clarity-facts{grid-template-columns:1fr}.supporting-topics{align-items:flex-start;flex-direction:column}}

/* Header navigation, FAQ, footer, and theme controls. */
.site-header{display:grid;grid-template-columns:1fr auto 1fr;gap:20px}
.campaign-header-link{justify-self:center;color:#a33f32;font-size:13px;font-weight:700;text-align:center;text-underline-offset:4px}
.header-actions{justify-self:end;display:flex;align-items:center;gap:8px}
.theme-button{min-height:40px;border:1px solid var(--line);border-radius:7px;background:var(--paper);color:var(--ink);padding:8px 11px;font-weight:700;cursor:pointer}
.faq-screen{width:min(940px,100%);margin:0 auto;padding:clamp(48px,7vw,90px) clamp(20px,5vw,60px);grid-template-columns:1fr}
.faq-intro{margin-bottom:30px}.faq-intro h2{font-size:clamp(40px,5vw,66px);line-height:1.03;margin:0 0 14px}.faq-intro>p:last-child{color:var(--muted);font-size:18px}
.faq-list{display:grid;gap:10px;margin-bottom:32px}.faq-list details{border:1px solid var(--line);background:var(--white);border-radius:7px;padding:0 18px}.faq-list summary{cursor:pointer;font-weight:700;padding:18px 38px 18px 0;position:relative;list-style:none}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:"+";position:absolute;right:4px;top:13px;font-size:26px;color:#a33f32}.faq-list details[open] summary:after{content:"−"}.faq-list details p{margin:0;padding:0 32px 18px 0;color:var(--muted);line-height:1.6;max-width:760px}.faq-list a{color:inherit;font-weight:700}
.site-footer{display:block;padding:26px clamp(22px,5vw,74px);font-size:14px}.footer-main{display:flex;justify-content:space-between;align-items:flex-start;gap:32px}.footer-main>p{max-width:440px;line-height:1.5}.footer-main nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px 22px}.site-footer a{color:#fff2b7;text-underline-offset:4px}.footer-disclaimer{border-top:1px solid rgba(255,255,255,.22);margin:22px 0 0;padding-top:18px;line-height:1.55;color:#c8d8d2;max-width:1050px}

html[data-theme="dark"]{color-scheme:dark;--ink:#eef4ff;--ink-2:#cfdbf6;--paper:#101a32;--cream:#172447;--line:#425681;--muted:#b8c5e2;--white:#172447;--mint:#254778;--shadow:0 18px 50px rgba(0,0,0,.38)}
html[data-theme="dark"] .site-header{background:rgba(16,26,50,.95)}
html[data-theme="dark"] textarea,html[data-theme="dark"] input,html[data-theme="dark"] .choice{background:#172447;color:var(--ink)}
html[data-theme="dark"] .choice:hover{background:#20315b}
html[data-theme="dark"] .choice.is-selected{background:#2457d6;color:#fff;box-shadow:4px 4px 0 #a9d8f5}
html[data-theme="dark"] .choice.is-selected span{color:#fff}
html[data-theme="dark"] .supporting-topics{background:#172447}
html[data-theme="dark"] .next-step,html[data-theme="dark"] .site-footer{background:#0a1124}
html[data-theme="dark"] .next-step{color:#f5f8ff}
html[data-theme="dark"] .map-word{background:#101a32}
html[data-theme="dark"] .primary-button{background:#eef4ff;color:#101a32}
html[data-theme="dark"] .secondary-button{border-color:#eef4ff;color:#eef4ff}
html[data-theme="dark"] .secondary-button:hover{background:#20315b}

@media(max-width:950px){.site-header{display:flex;flex-wrap:wrap}.header-actions{margin-left:auto}.campaign-header-link{order:3;width:100%;padding-top:3px}}
@media(max-width:700px){.header-actions{width:100%;justify-content:space-between;border-top:1px solid var(--line);padding-top:8px}.header-actions .text-button,.theme-button{font-size:13px}.footer-main{flex-direction:column}.footer-main nav{justify-content:flex-start}.faq-screen{padding-top:40px}}

/* Clear Blue palette details. */
.site-header{background:rgba(250,252,255,.95)}
.brand strong,.hand-note,.question-kicker,.progress-wrap p span,.card-title p,.first-move p,.ideas-block li strong,.faq-list summary:after,.campaign-header-link{color:#2457d6}
.choice{border-color:#9fb3ca}.choice:hover{background:#eef7ff}.choice.is-selected{background:#a9d8f5;box-shadow:4px 4px 0 #2457d6}.choice.is-selected span{color:#15233d}
.progress{background:#d7e4f0}.supporting-topics{background:#edf6fc}
.site-footer a{color:#ffe18a}.footer-disclaimer{color:#d8e3f7}
html[data-theme="dark"] .brand strong,html[data-theme="dark"] .hand-note,html[data-theme="dark"] .question-kicker,html[data-theme="dark"] .progress-wrap p span,html[data-theme="dark"] .card-title p,html[data-theme="dark"] .first-move p,html[data-theme="dark"] .ideas-block li strong,html[data-theme="dark"] .faq-list summary:after,html[data-theme="dark"] .campaign-header-link{color:#a9d8f5}

/* Approved centered Niche Navigator map image. */
.map-visual{height:auto;width:100%;max-width:660px;margin:0;justify-self:center;background:none;border:0;transform:none;overflow:hidden;border-radius:10px;box-shadow:0 20px 48px rgba(21,35,61,.2)}
.map-visual img{display:block;width:100%;height:auto;object-fit:contain}
@media(max-width:850px){.map-visual{height:auto;max-width:720px;background:none}}
@media(max-width:600px){.map-visual{height:auto}}