:root{--bg:#0b0d17;--panel:#121625;--panel2:#171c2d;--text:#f4f4fa;--muted:#a4abc1;--line:rgba(205,213,255,.13);--violet:#a99bff;--cyan:#9de7ed;--pink:#f4a9d3;--font:'DM Sans',sans-serif;--display:'Space Grotesk',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);line-height:1.6;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 75% 12%,rgba(103,89,202,.15),transparent 35%),radial-gradient(ellipse at 5% 65%,rgba(62,135,161,.08),transparent 34%);z-index:-1}.grain{position:fixed;inset:0;pointer-events:none;opacity:.035;z-index:9;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E")}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 7.2%;border-bottom:1px solid var(--line);position:relative;z-index:2}.brand{font-family:var(--display);font-size:12px;font-weight:700;letter-spacing:.13em;color:var(--text);text-decoration:none;display:flex;align-items:center;gap:10px}.brand-mark{color:var(--violet);font-size:20px}.brand-divider{color:#596078;margin:0 2px}.brand-sub{color:var(--muted);font-size:10px;letter-spacing:.12em}.top-link,.text-link{color:var(--muted);font-size:12px;text-decoration:none;transition:color .2s}.top-link span{color:var(--violet);padding-left:6px}.top-link:hover,.text-link:hover{color:var(--text)}.hero{min-height:610px;display:grid;grid-template-columns:1fr .9fr;align-items:center;gap:6%;padding:72px 9.5% 64px}.eyebrow{font-family:var(--display);font-size:10px;letter-spacing:.2em;font-weight:700;color:var(--violet);margin:0 0 20px}.pulse{display:inline-block;width:6px;height:6px;background:var(--cyan);border-radius:50%;margin-right:9px;box-shadow:0 0 14px var(--cyan)}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:var(--display);letter-spacing:-.055em;line-height:1.06}h1{font-size:clamp(48px,6vw,78px);margin-bottom:23px;font-weight:600}h1 span,h2 span,.closing h2 span{color:var(--violet)}.hero-text{color:var(--muted);font-size:15px;max-width:435px;line-height:1.8;margin-bottom:28px}.hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.btn{font-family:var(--font);border:0;cursor:pointer;font-weight:700;font-size:12px;border-radius:5px;padding:15px 19px;transition:transform .2s,filter .2s}.btn:hover{transform:translateY(-2px);filter:brightness(1.1)}.btn-primary{background:var(--violet);color:#111222}.btn-primary span{margin-left:16px;font-size:16px}.hero-note{display:flex;gap:11px;align-items:center;color:#838ba4;font-size:10px;margin-top:28px}.note-icon{color:var(--cyan);font-size:17px}.hero-art{height:470px;position:relative;display:flex;align-items:center;justify-content:center}.art-glow{position:absolute;width:330px;height:390px;background:linear-gradient(135deg,rgba(137,116,255,.26),rgba(89,202,220,.09));filter:blur(42px);border-radius:50%;transform:rotate(20deg)}.hero-character{position:relative;z-index:1;max-width:100%;height:430px;object-fit:contain;filter:drop-shadow(0 24px 40px rgba(0,0,0,.45));mask-image:linear-gradient(to bottom,black 78%,transparent 100%)}.art-chip{position:absolute;z-index:2;background:rgba(17,21,36,.88);border:1px solid var(--line);padding:11px 14px;font-size:9px;letter-spacing:.1em;color:#d8dcef;backdrop-filter:blur(12px)}.chip-top{top:53px;right:-12px}.chip-dot{display:inline-block;width:5px;height:5px;background:var(--cyan);border-radius:50%;margin-right:7px}.chip-bottom{bottom:37px;left:0;color:var(--muted);letter-spacing:.03em}.chip-bottom span{color:var(--violet);margin-right:10px}.vertical-label{position:absolute;right:-25px;top:45%;writing-mode:vertical-rl;font-size:8px;letter-spacing:.25em;color:#626a84}.intro-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:23px 9.5%;display:flex;justify-content:space-between;gap:18px;color:#d0d4e5;font-size:11px}.intro-strip>div{display:flex;gap:13px;align-items:center}.strip-num{font-family:var(--display);color:var(--violet);font-size:10px}.quiz-section,.screenings{padding:105px 9.5% 100px}.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:45px;margin-bottom:42px}.section-head h2,.closing h2{font-size:clamp(35px,4.5vw,53px);margin:0}.section-desc{max-width:410px;color:var(--muted);font-size:12px;line-height:1.9;margin:0 0 5px}.quiz-shell{min-height:360px;background:linear-gradient(130deg,rgba(27,32,53,.94),rgba(16,19,32,.96));border:1px solid var(--line);border-radius:9px;position:relative;overflow:hidden}.quiz-shell:before{content:"";position:absolute;right:-90px;top:-150px;width:330px;height:330px;border:1px solid rgba(169,155,255,.12);border-radius:50%;box-shadow:0 0 0 35px rgba(169,155,255,.025),0 0 0 75px rgba(169,155,255,.02)}.quiz-welcome{position:relative;text-align:center;max-width:560px;padding:50px 25px;margin:auto}.quiz-orb{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(169,155,255,.5);color:var(--violet);font-size:21px;margin:0 auto 22px;box-shadow:0 0 30px rgba(169,155,255,.1)}.quiz-welcome h3{font-size:35px;margin-bottom:17px}.quiz-welcome p:not(.eyebrow){font-size:12px;color:var(--muted);line-height:1.9;max-width:430px;margin:0 auto 24px}.tiny-note{display:block;color:#727b95;font-size:10px;margin-top:17px}.quiz-progress{display:flex;align-items:center;gap:14px;padding:23px 28px;border-bottom:1px solid var(--line);font-size:10px;color:var(--muted)}.progress-track{height:3px;flex:1;background:#292e43;border-radius:9px;overflow:hidden}.progress-fill{height:100%;width:0;background:linear-gradient(90deg,var(--violet),var(--cyan));transition:width .3s}.question-content{padding:35px clamp(20px,5vw,55px) 40px;position:relative}.question-content h3{font-size:clamp(23px,3vw,34px);max-width:720px;margin-bottom:10px;line-height:1.2}.question-sub{font-size:11px;color:var(--muted);margin-bottom:25px}.answer-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}.answer-option{border:1px solid var(--line);background:rgba(255,255,255,.018);color:#dfe2f1;padding:15px;text-align:left;border-radius:5px;cursor:pointer;font:inherit;font-size:12px;transition:all .2s}.answer-option:hover,.answer-option.selected{border-color:var(--violet);background:rgba(169,155,255,.1)}.answer-option .answer-letter{color:var(--violet);font-family:var(--display);margin-right:10px}.quiz-controls{display:flex;justify-content:space-between;align-items:center;margin-top:25px}.btn-quiet{border:1px solid var(--line);background:transparent;color:var(--muted)}.btn:disabled{opacity:.35;cursor:not-allowed;transform:none}.result-layout{display:grid;grid-template-columns:.7fr 1fr;gap:35px;align-items:center;padding:35px}.result-art{min-height:290px;background:radial-gradient(ellipse,rgba(169,155,255,.2),transparent 70%);display:flex;align-items:center;justify-content:center}.result-art img{height:300px;max-width:100%;object-fit:contain;filter:drop-shadow(0 20px 30px #0008)}.result-copy .eyebrow{margin-bottom:12px}.result-copy h3{font-size:clamp(30px,4vw,45px);margin-bottom:14px}.result-copy p{color:var(--muted);font-size:12px;line-height:1.9}.result-tags{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.result-tag{border:1px solid var(--line);padding:6px 10px;border-radius:20px;font-size:9px;color:#cbd0e3}.result-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.result-disclaimer{font-size:10px!important;color:#8e96ad!important;border-top:1px solid var(--line);padding-top:15px;margin-top:20px}.topic-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.topic-card{position:relative;display:flex;flex-direction:column;min-height:155px;padding:19px 17px;background:rgba(255,255,255,.025);border:1px solid var(--line);border-radius:6px;color:var(--text);text-decoration:none;transition:transform .2s,border-color .2s,background .2s}.topic-card:hover{transform:translateY(-3px);border-color:rgba(169,155,255,.55);background:rgba(169,155,255,.06)}.topic-icon{color:var(--violet);font-size:20px;margin-bottom:17px}.topic-card strong{font-family:var(--display);font-size:14px;font-weight:600;margin-bottom:6px}.topic-card small{font-size:10px;color:var(--muted);line-height:1.6}.topic-arrow{position:absolute;right:15px;top:15px;color:#69718b;font-size:14px}.screening-footnote{font-size:10px;color:#838ba2;line-height:1.9;margin-top:24px;max-width:900px}.closing{text-align:center;padding:90px 20px 100px;border-top:1px solid var(--line);background:radial-gradient(ellipse at 50% 100%,rgba(106,91,187,.12),transparent 55%)}.closing-symbol{font-size:30px;color:var(--violet);margin-bottom:18px}.closing h2{margin-bottom:20px}.closing>p:not(.eyebrow){font-size:12px;color:var(--muted);max-width:510px;margin:0 auto 23px;line-height:1.9}.closing .text-link{display:inline-block;margin-top:7px}footer{padding:25px 7.2%;display:flex;justify-content:space-between;gap:15px;align-items:center;border-top:1px solid var(--line);font-size:9px;color:#707891}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:#e6e2ff;color:#111222;padding:12px 18px;border-radius:5px;font-size:12px;opacity:0;pointer-events:none;transition:.25s;z-index:20}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:900px){.hero{padding-left:6%;padding-right:6%;gap:2%}.hero-art{height:390px}.hero-character{height:360px}.chip-top{right:-5px}.vertical-label{right:-16px}.quiz-section,.screenings{padding:80px 6%}.topic-grid{grid-template-columns:repeat(3,1fr)}.section-head{gap:25px}}
@media(max-width:620px){.topbar{height:64px;padding:0 5%}.brand{font-size:10px;gap:6px}.brand-sub{font-size:8px}.top-link{font-size:10px}.hero{display:flex;flex-direction:column;padding:56px 7% 42px;align-items:stretch;gap:5px}.hero-copy{position:relative;z-index:2}.hero-art{height:290px;margin-top:2px}.hero-character{height:300px}.art-glow{width:230px;height:250px}.chip-top{top:14px;right:0}.chip-bottom{bottom:8px;left:0}.vertical-label{right:0;font-size:7px}.hero-text{font-size:13px}.intro-strip{padding:18px 7%;display:grid;grid-template-columns:1fr;gap:12px}.intro-strip>div{gap:10px}.quiz-section,.screenings{padding:65px 6%}.section-head{display:block;margin-bottom:28px}.section-head h2{margin-bottom:20px}.section-desc{font-size:12px}.quiz-welcome{padding:38px 20px}.quiz-welcome h3{font-size:29px}.answer-list{grid-template-columns:1fr}.question-content{padding:25px 18px}.quiz-progress{padding:17px}.result-layout{grid-template-columns:1fr;gap:5px;padding:20px}.result-art{min-height:220px}.result-art img{height:230px}.result-copy h3{font-size:33px}.topic-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.topic-card{padding:15px 12px;min-height:145px}.topic-card strong{font-size:13px}.topic-card small{font-size:9px}.topic-icon{margin-bottom:12px}.closing{padding:70px 7%}.closing h2{font-size:37px}footer{padding:22px 6%;flex-wrap:wrap}footer>span:last-child{width:100%}}
.score-breakdown{margin:20px 0;padding:16px;border:1px solid var(--line);border-radius:6px;background:rgba(255,255,255,.02)}.score-heading{font-size:11px!important;color:#e2e4f2!important;font-weight:700;margin-bottom:14px!important}.score-heading span{font-weight:400;color:var(--muted)}.score-row{margin:12px 0}.score-label{display:flex;justify-content:space-between;gap:12px;font-size:10px;color:var(--muted);margin-bottom:6px}.score-label strong{color:#e2e4f2}.score-track{height:5px;border-radius:8px;background:#292e43;overflow:hidden}.score-fill{height:100%;background:linear-gradient(90deg,var(--violet),var(--cyan));border-radius:8px}.result-link{margin-top:12px}.result-link a{color:var(--cyan);font-size:11px;text-underline-offset:3px}
/* More human, supportive result interpretation */
.care-note{font-family:var(--display);font-size:11px!important;letter-spacing:.08em;text-transform:uppercase;color:var(--cyan)!important;margin:18px 0 5px!important}
.archetype-note{border-left:2px solid var(--violet);background:rgba(169,155,255,.07);padding:14px 16px;margin:18px 0;border-radius:0 5px 5px 0}
.archetype-note strong{font-family:var(--display);font-size:12px;color:#e7e3ff}
.archetype-note p{margin:5px 0 0!important;font-size:11px!important}
.relationship-breakdown{margin-top:16px;padding:16px;border:1px solid var(--line,rgba(255,255,255,.12));border-radius:8px;background:rgba(255,255,255,.025)}
.relationship-intro{font-size:.88rem;line-height:1.7;color:var(--muted,#a9aec4);margin:8px 0 14px}
.relationship-result{display:grid;grid-template-columns:96px minmax(0,1fr);gap:14px;padding:14px 0;border-top:1px solid rgba(255,255,255,.08)}
.relationship-art{height:104px;overflow:hidden;border-radius:6px;background:#171b2b}
.relationship-art img{width:100%;height:100%;object-fit:cover;object-position:center 25%}
.relationship-result p{font-size:.88rem;line-height:1.7;margin:7px 0;color:var(--muted,#a9aec4)}
.relationship-result small{font-size:.75rem;color:#aaa2f7}
@media(max-width:560px){.relationship-result{grid-template-columns:72px minmax(0,1fr);gap:10px}.relationship-art{height:84px}}

/* Genshin-inspired start, question and reveal treatment */
:root{--bg:#080711;--panel:#100d20;--panel2:#211a32;--violet:#b6a0ff;--cyan:#e9cf91;--pink:#e4b6ff}
body{background:radial-gradient(ellipse at 50% 0%,#241446 0,#100d20 38%,#080711 78%)}
.topbar{max-width:1200px;margin:auto;border-bottom-color:rgba(180,151,255,.2)}
.hero{max-width:1200px;margin:20px auto 30px;min-height:500px;border:1px solid rgba(180,151,255,.24);border-radius:22px;background:#100d20;box-shadow:0 18px 60px #0007;padding:60px 7%;grid-template-columns:1.1fr .9fr;position:relative;isolation:isolate;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#090713 0%,rgba(9,7,19,.95) 36%,rgba(9,7,19,.45) 72%,rgba(9,7,19,.2) 100%),url("assets/backgrounds/mindscape-reveal.webp") right center/auto 100% no-repeat;z-index:-1;opacity:.96}
.hero-copy{max-width:650px}.hero-art{height:390px}.hero-character{height:100%;width:100%;max-width:100%;object-fit:contain;opacity:.08;filter:none;mask-image:none}.art-glow{background:linear-gradient(135deg,rgba(137,116,255,.16),rgba(233,207,145,.06))}.art-chip{border-radius:10px;border-color:rgba(180,151,255,.24)}
.intro-strip{max-width:1200px;margin:auto;border-color:rgba(180,151,255,.2)}
.quiz-section,.screenings{max-width:1200px;margin:auto}
.quiz-shell{border:1px solid rgba(180,151,255,.24);border-radius:20px;background:linear-gradient(135deg,rgba(17,15,31,.94),rgba(12,9,24,.98));box-shadow:0 16px 44px #0004;backdrop-filter:blur(12px)}
.quiz-shell:before{content:"";position:absolute;inset:0;background:url("assets/backgrounds/mindscape-reveal.webp") center/cover no-repeat;opacity:.075;pointer-events:none}
.quiz-welcome,.question-content,.quiz-progress,.result-layout{position:relative;z-index:1}
.quiz-welcome{max-width:680px;margin:auto;padding:clamp(28px,6vw,62px);text-align:center}.quiz-orb{width:58px;height:58px;margin:0 auto 22px;border-radius:18px;display:grid;place-items:center;font-size:27px;color:#160d27;background:linear-gradient(130deg,#e9cf91,#b6a0ff);box-shadow:0 0 35px #a78bfa35}
.quiz-welcome h3{font-size:clamp(30px,4vw,46px);margin-bottom:14px}.quiz-welcome>p:not(.eyebrow){color:#d0c5e0;font-size:14px;max-width:490px;margin:0 auto 25px;line-height:1.8}.tiny-note{display:block;margin-top:15px;font-size:10px;color:#a99abb}
.quiz-progress{display:flex;align-items:center;gap:13px;padding:22px 26px 0;font-size:10px;color:#d7cbed;letter-spacing:.08em}.quiz-progress .progress-track{flex:1;height:6px;border-radius:99px;background:#29223b;overflow:hidden}.quiz-progress .progress-fill{height:100%;background:linear-gradient(90deg,#7c3aed,#b6a0ff,#e9cf91);border-radius:99px}
.question-content{padding:clamp(24px,5vw,48px);max-width:900px;margin:auto}.question-content .eyebrow{color:#e9cf91}.question-content h3{font-size:clamp(25px,4vw,38px);line-height:1.2;letter-spacing:-.035em;max-width:760px;margin-bottom:13px}.question-sub{color:#b6adc9;font-size:12px;line-height:1.7;margin-bottom:24px}.answer-list{display:grid;grid-template-columns:1fr 1fr;gap:11px}.answer-option{min-height:72px;text-align:left;cursor:pointer;padding:15px;border:1px solid #ffffff19;border-radius:13px;color:var(--text);background:linear-gradient(140deg,#201a32,#12101f);transition:border-color .15s,transform .15s,background .15s;display:flex;gap:12px;align-items:center;font-size:13px;font-weight:650}.answer-option:hover,.answer-option.selected{border-color:#b7a0ff;background:linear-gradient(135deg,#302448,#171326);transform:translateY(-1px)}.answer-letter{flex:0 0 29px;height:29px;border-radius:9px;display:grid;place-items:center;background:#a78bfa1c;color:#e9cf91;font-size:10px;font-weight:900}.quiz-controls{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:22px}.btn{border-radius:12px}.btn-primary{background:linear-gradient(110deg,#e9cf91,#b6a0ff 75%);box-shadow:0 8px 26px #8c65ee25}.btn-primary:disabled{opacity:.4;cursor:not-allowed;transform:none}
.result-layout{display:grid;grid-template-columns:minmax(230px,.78fr) minmax(0,1.22fr);gap:0;position:relative;padding:clamp(14px,3vw,28px);background:#0c0918 url("assets/backgrounds/mindscape-reveal.webp") center/cover no-repeat;border-radius:18px}.result-layout:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#090713e8,#090713bd);border-radius:18px;pointer-events:none}.result-art,.result-copy{position:relative;z-index:1;min-width:0}.result-art{align-self:stretch;min-height:420px;display:flex;align-items:center;justify-content:center;padding:14px}.result-art img{width:100%;height:100%;max-height:600px;object-fit:contain;object-position:center center;filter:drop-shadow(0 16px 32px #0008)}.result-copy{padding:clamp(16px,3vw,32px)}.result-copy>h3{font-size:clamp(30px,4.5vw,49px);color:#fff;line-height:1.02;margin:10px 0 12px}.result-copy>p{color:#d8d0e7;line-height:1.8;font-size:13px}.result-copy>p strong{color:#e9cf91}.archetype-note{border:1px solid #bba0ff45;border-left:3px solid #e9cf91;background:linear-gradient(130deg,#a78bfa14,#ffffff05);border-radius:12px;padding:16px}.archetype-note strong{font-size:11px;letter-spacing:.12em;color:#e9cf91}.score-breakdown,.relationship-breakdown{border:1px solid #ffffff18;background:#100d20c9;border-radius:14px;padding:16px;margin-top:14px}.score-heading{font-size:11px;color:#f0eaff;font-weight:800}.score-heading span{color:#a99abb;font-weight:500}.score-label{font-size:11px}.score-fill{background:linear-gradient(90deg,#7c3aed,#b6a0ff,#e9cf91)}.result-actions{margin-top:18px}.result-disclaimer{font-size:10px!important;color:#a99abb!important}.result-link a{color:#e9cf91}.relationship-result{grid-template-columns:84px minmax(0,1fr)}
@media(max-width:850px){.hero{margin:12px 12px 22px;padding:36px 5%;min-height:400px}.hero-art{height:280px}.quiz-section,.screenings{padding:70px 18px}.section-head{align-items:flex-start;flex-direction:column;gap:15px}.result-layout{grid-template-columns:1fr}.result-art{min-height:220px;max-height:320px}.result-art img{max-height:320px}.result-copy{padding:12px}}
@media(max-width:560px){.topbar{height:62px;padding:0 14px}.brand{font-size:9px;gap:6px}.brand-sub{font-size:8px}.top-link{font-size:10px}.hero{grid-template-columns:1fr;min-height:0;padding:0;margin:10px 9px 20px}.hero:before{background:linear-gradient(180deg,rgba(8,7,17,.45) 0%,rgba(8,7,17,.88) 30%,#090713 70%),url("assets/backgrounds/mindscape-reveal.webp") center top/100% auto no-repeat}.hero-copy{padding:30px 22px 10px}.hero-art{height:110px}.hero-character{display:none}.chip-top{top:0;right:14px}.chip-bottom{bottom:10px;left:14px}.vertical-label{display:none}.intro-strip{padding:15px 18px;flex-wrap:wrap;font-size:10px}.intro-strip>div{width:100%}.quiz-section,.screenings{padding:56px 12px}.quiz-progress{padding:18px 16px 0;gap:8px;font-size:9px}.question-content{padding:22px 16px}.answer-list{grid-template-columns:1fr;gap:8px}.answer-option{min-height:58px;padding:12px;font-size:12px}.quiz-controls .btn{padding:12px 13px}.result-layout{padding:8px}.result-art{min-height:190px;max-height:230px}.result-art img{max-height:230px}.result-copy{padding:14px 10px}.result-copy>h3{font-size:31px}.relationship-result{grid-template-columns:68px minmax(0,1fr);gap:10px}.relationship-art{height:78px}}

/* Dedicated page flow: landing, question journey, and reveal are separate views. */
[hidden]{display:none!important}
body[data-view="home"] .hero{display:grid}
body[data-view="quiz"],body[data-view="result"]{min-height:100vh}
body[data-view="quiz"] .topbar,body[data-view="result"] .topbar{height:66px}
.quiz-section,.result-page{max-width:1200px;margin:0 auto;padding:28px 9.5% 70px;min-height:calc(100vh - 130px)}
.quiz-page-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 18px}
.quiz-page-label{font-family:var(--display);font-size:10px;font-weight:700;letter-spacing:.17em;color:#a99abb}
.quiz-section .quiz-shell{min-height:calc(100vh - 190px)}
.quiz-section .question-content{padding-top:clamp(42px,8vh,90px);padding-bottom:clamp(35px,7vh,70px)}
.quiz-section .question-content h3{font-size:clamp(28px,4vw,44px);max-width:780px}
.result-page .quiz-shell{overflow:visible}
.result-page .result-layout{min-height:calc(100vh - 190px)}
.result-page .result-copy{padding-top:clamp(20px,4vh,44px);padding-bottom:clamp(20px,4vh,44px)}
body[data-view="home"] footer{margin-top:20px}
body[data-view="quiz"] footer,body[data-view="result"] footer{margin-top:0}
@media(max-width:850px){.quiz-section,.result-page{padding:22px 18px 45px}.quiz-section .quiz-shell{min-height:calc(100vh - 160px)}.result-page .result-layout{min-height:0}}
@media(max-width:560px){.quiz-section,.result-page{padding:15px 12px 35px}.quiz-page-head{margin-bottom:12px}.quiz-page-label{font-size:8px;letter-spacing:.1em}.quiz-section .quiz-shell{min-height:calc(100vh - 140px)}.quiz-section .question-content{padding-top:40px}.result-page .result-layout{padding:8px}}


/* v8 reveal layout: clean, aligned artwork and readable result column. */
.result-page{max-width:1240px}
.result-page .quiz-shell{background:transparent;border:0;min-height:0;overflow:visible}
.result-page .quiz-shell:before{display:none}
.result-page .result-layout{grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);align-items:start;gap:0;min-height:0;padding:22px;background:#0d0b18 url("assets/backgrounds/mindscape-reveal.webp") center/cover no-repeat;border:1px solid rgba(205,213,255,.16);border-radius:18px;overflow:hidden}
.result-page .result-layout:before{background:linear-gradient(90deg,rgba(8,7,17,.72),rgba(8,7,17,.88) 38%,rgba(8,7,17,.92));}
.result-page .result-art{align-self:start;position:sticky;top:22px;min-height:0;height:auto;max-height:none;padding:10px 20px 10px 4px;display:flex;align-items:flex-start;justify-content:center}
.result-page .result-art img{display:block;width:100%;height:auto;max-height:500px;object-fit:contain;object-position:top center;border-radius:12px;filter:drop-shadow(0 16px 28px #0008)}
.result-page .result-copy{padding:16px 8px 18px 24px;min-width:0}
.result-page .result-copy>h3{max-width:680px;font-size:clamp(32px,4vw,48px);line-height:1.04}
.result-page .care-note{margin:20px 0 4px;color:#e9cf91;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.result-page .result-copy>p{max-width:760px}
.result-page .score-breakdown,.result-page .relationship-breakdown{background:rgba(11,9,22,.82)}
.result-page .relationship-result{display:grid;grid-template-columns:76px minmax(0,1fr);align-items:start;gap:14px}
.result-page .relationship-art{height:90px;width:76px;overflow:hidden;border-radius:8px}
.result-page .relationship-art img{width:100%;height:100%;object-fit:cover}
.result-page .result-actions{display:flex;flex-wrap:wrap;gap:10px}
@media(max-width:850px){.result-page .result-layout{grid-template-columns:1fr;padding:16px}.result-page .result-art{position:relative;top:auto;min-height:0;max-height:none;padding:0;justify-content:flex-start}.result-page .result-art img{width:auto;max-width:100%;height:auto;max-height:300px;object-position:left top}.result-page .result-copy{padding:24px 2px 6px}}
@media(max-width:560px){.result-page .result-layout{padding:12px}.result-page .result-art img{max-height:240px;margin:0 auto}.result-page .result-copy{padding:18px 2px 4px}.result-page .result-copy>h3{font-size:32px}.result-page .relationship-result{grid-template-columns:62px minmax(0,1fr);gap:10px}.result-page .relationship-art{height:72px;width:62px}}

/* v9: polished reveal card — centered artwork header, full-width readable content */
.result-page{max-width:1080px;padding:24px 24px 64px;width:100%;}
.result-page .quiz-page-head{max-width:100%;}
.result-page .quiz-shell{width:100%;max-width:100%;overflow:visible;}
.result-page .result-layout{display:block;width:100%;max-width:100%;min-width:0;padding:0;overflow:hidden;background:#0d0b18 url("assets/backgrounds/mindscape-reveal.webp") center/cover no-repeat;border:1px solid rgba(205,213,255,.17);border-radius:18px;}
.result-page .result-layout:before{background:linear-gradient(180deg,rgba(8,7,17,.40),rgba(8,7,17,.90) 300px,rgba(8,7,17,.96));}
.result-page .result-art{position:relative;top:auto;width:100%;height:260px;min-height:0;max-height:none;padding:22px 24px 0;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(ellipse at 50% 70%,rgba(169,155,255,.20),transparent 65%);}
.result-page .result-art img{display:block;width:auto;max-width:min(100%,360px);height:100%;max-height:238px;object-fit:contain;object-position:center bottom;border-radius:10px 10px 0 0;filter:drop-shadow(0 12px 25px #0009);}
.result-page .result-copy{position:relative;z-index:1;width:100%;min-width:0;padding:24px clamp(20px,4vw,48px) 32px;}
.result-page .result-copy>.eyebrow{text-align:center;margin:0 0 12px;}
.result-page .result-copy>h3{text-align:center;max-width:820px;margin:0 auto 12px;font-size:clamp(32px,4.4vw,48px);line-height:1.06;overflow-wrap:anywhere;}
.result-page .result-copy>p:nth-of-type(1){text-align:center;font-size:13px;color:#e9cf91;margin:0 auto 16px;}
.result-page .care-note{margin:20px 0 8px;}
.result-page .result-copy>p:not(.eyebrow):not(.care-note):not(.result-disclaimer):not(.result-link){max-width:850px;margin-left:auto;margin-right:auto;}
.result-page .archetype-note{max-width:850px;margin:18px auto;padding:17px 20px;}
.result-page .score-breakdown{max-width:100%;margin:20px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;align-items:start;}
.result-page .score-heading{grid-column:1/-1;margin-bottom:8px!important;}
.result-page .score-row{min-width:0;margin:10px 0;}
.result-page .score-label{align-items:flex-start;}
.result-page .score-label span{overflow-wrap:anywhere;}
.result-page .relationship-breakdown{max-width:100%;margin:16px 0 0;}
.result-page .relationship-intro{max-width:850px;}
.result-page .relationship-result{grid-template-columns:76px minmax(0,1fr);}
.result-page .result-actions{justify-content:center;margin-top:22px;}
.result-page .result-disclaimer,.result-page .result-link{text-align:center;max-width:850px;margin-left:auto;margin-right:auto;}
@media(max-width:650px){.result-page{padding:14px 12px 38px}.result-page .result-art{height:210px;padding:18px 14px 0}.result-page .result-art img{max-height:190px}.result-page .result-copy{padding:20px 15px 24px}.result-page .result-copy>h3{font-size:31px}.result-page .score-breakdown{grid-template-columns:1fr;padding:14px}.result-page .score-heading{grid-column:1}.result-page .relationship-result{grid-template-columns:64px minmax(0,1fr);gap:10px}.result-page .relationship-art{width:64px;height:76px}}

/* v10: answer-click navigation and dynamic relationship companions */
.answer-hint{font-size:11px;color:#a99abb;text-align:right}
.answer-option{transition:border-color .15s,transform .15s,background .15s,opacity .1s}
.answer-option:disabled{cursor:default;opacity:.82}
.answer-option.answer-picked{border-color:#e9cf91;background:linear-gradient(135deg,#42314a,#21182f);box-shadow:0 0 0 1px #e9cf9140}
.relationship-result{padding:14px 0;border-top:1px solid #ffffff15}
.relationship-art{flex-shrink:0;background:radial-gradient(ellipse,rgba(169,155,255,.18),transparent 72%)}
.relationship-art img{display:block}
@media(max-width:560px){.answer-hint{font-size:9px;max-width:55%;line-height:1.4}.quiz-controls{margin-top:18px}}

/* v11: text-only landing page; remove all start-page character artwork */
.hero{display:block;min-height:0;max-width:980px;margin:0 auto;padding:clamp(70px,10vw,130px) 9.5% clamp(65px,8vw,100px)}
.hero-copy{max-width:760px;margin:0 auto;text-align:center}
.hero-copy .eyebrow{margin-bottom:22px}
.hero-copy h1{font-size:clamp(46px,7vw,78px);max-width:760px;margin-left:auto;margin-right:auto}
.hero-text{max-width:650px;margin:0 auto 30px;font-size:15px}
.hero-actions{justify-content:center}
.hero-note{justify-content:center;margin-top:26px}
@media(max-width:620px){.hero{padding:64px 7% 52px}.hero-copy h1{font-size:clamp(40px,11vw,58px)}.hero-text{font-size:14px}.hero-note{font-size:10px}}
.result-page .more-tests{margin:26px auto 0;max-width:850px;padding:22px 0 0;border-top:1px solid var(--line);text-align:center}
.result-page .more-tests h4{font:600 18px var(--display);letter-spacing:-.02em;margin:0 0 7px}
.result-page .more-tests p{font-size:11px;color:var(--muted);margin:0 0 15px}
.result-page .more-tests-links{display:flex;justify-content:center;flex-wrap:wrap;gap:9px}
.result-page .more-tests-links a{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:5px;padding:9px 12px;color:#ded8ff;text-decoration:none;font-size:11px;transition:background .2s,border-color .2s}
.result-page .more-tests-links a:hover{background:rgba(169,155,255,.1);border-color:var(--violet)}


/* v12 FIX: hard-disable any legacy start-page artwork/background, including pseudo-element CSS overrides. */
body[data-view="home"] .hero::before, body[data-view="home"] .hero::after, .hero::before, .hero::after { content: none !important; display: none !important; background: none !important; background-image: none !important; }
body[data-view="home"] .hero, body[data-view="home"] .hero-copy { background-image: none !important; }

/* v13: framed anime portrait on the reveal card */
.result-page .result-art{isolation:isolate;}
.result-page .result-art::before{content:"✦";position:absolute;z-index:3;top:8px;left:50%;transform:translateX(-50%);width:34px;height:34px;display:grid;place-items:center;color:#f7d98d;font-size:23px;text-shadow:0 0 12px #d7a84c;pointer-events:none;}
.result-page .result-art::after{content:"";position:absolute;z-index:0;left:50%;top:50%;transform:translate(-50%,-48%);width:clamp(150px,26vw,230px);height:clamp(195px,31vw,255px);border:2px solid #d7b66b;border-radius:22px 22px 16px 16px;box-shadow:0 0 0 2px rgba(169,155,255,.72),0 0 0 7px rgba(12,10,26,.78),0 0 30px rgba(215,182,107,.2),inset 0 0 0 5px rgba(215,182,107,.16);background:linear-gradient(145deg,rgba(215,182,107,.13),rgba(169,155,255,.08));pointer-events:none;}
.result-page .result-art img{position:relative;z-index:1;height:clamp(175px,29vw,235px);max-height:235px;max-width:calc(100% - 24px);padding:7px;border:1px solid rgba(247,217,141,.85);border-radius:17px 17px 10px 10px;background:linear-gradient(145deg,rgba(24,20,43,.98),rgba(10,13,28,.98));box-shadow:0 12px 25px #0009, inset 0 0 0 1px rgba(169,155,255,.42);}
@media(max-width:650px){.result-page .result-art{height:235px;padding-top:18px}.result-page .result-art::after{width:165px;height:195px}.result-page .result-art::before{top:8px}.result-page .result-art img{height:180px;max-height:180px;max-width:calc(100% - 28px);padding:6px}}

/* Relationship reflection cards: tier-specific content and cleaner hierarchy. */
.result-page .relationship-tier{font-size:10px;font-weight:800;letter-spacing:.04em;color:#e9cf91;margin:3px 0 5px}
.result-page .relationship-result .relationship-art{border:1px solid rgba(184,157,255,.48);padding:3px;background:linear-gradient(145deg,rgba(185,155,255,.2),rgba(233,207,145,.13));box-shadow:0 4px 18px rgba(0,0,0,.22)}
.result-page .relationship-result .relationship-art img{border-radius:5px}
.result-page .relationship-result.tier-0 .relationship-art{border-color:rgba(128,203,183,.6)}
.result-page .relationship-result.tier-1 .relationship-art{border-color:rgba(184,157,255,.7)}
.result-page .relationship-result.tier-2 .relationship-art{border-color:rgba(233,168,145,.75)}


/* Featured Genshin personality-test CTA on the Genshin Mindscape result page */
.result-page .more-tests-links a.featured-genshin-test{
  grid-column:1/-1;
  position:relative;
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:15px 17px;
  border:1px solid rgba(240,207,126,.9);
  border-radius:13px;
  color:#fff3c7;
  font-weight:800;
  letter-spacing:.01em;
  background:linear-gradient(110deg,rgba(115,79,184,.42),rgba(35,29,64,.96) 54%,rgba(143,101,42,.3));
  box-shadow:0 0 0 1px rgba(177,147,255,.18),0 8px 24px rgba(0,0,0,.28),inset 0 0 22px rgba(240,207,126,.07);
  text-decoration:none;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.result-page .more-tests-links a.featured-genshin-test:hover{
  transform:translateY(-2px);
  border-color:#ffe6a0;
  box-shadow:0 0 0 2px rgba(240,207,126,.14),0 12px 28px rgba(0,0,0,.34),0 0 22px rgba(240,207,126,.12);
}
.result-page .more-tests-links a.featured-genshin-test span{
  color:#c9bee8;
  font-size:11px;
  font-weight:600;
  letter-spacing:0;
}
@media(max-width:650px){
 .result-page .more-tests-links a.featured-genshin-test{padding:13px 14px}
}