:root{--bg:#08070c;--panel:#111018;--panel2:#17131d;--line:rgba(255,255,255,.11);--text:#f8f5f1;--muted:#a49daa;--accent:#9b6cff;--accent2:#6fa8ff;--good:#c9c3ff;--danger:#9aa8ff}*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;background:#07070c;position:relative;isolation:isolate;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;min-height:100vh;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;background:radial-gradient(circle at 18% 42%,rgba(104,62,154,.24),transparent 28%),radial-gradient(circle at 79% 25%,rgba(111,168,255,.10),transparent 24%),radial-gradient(circle at 60% 75%,rgba(75,44,114,.12),transparent 30%),linear-gradient(135deg,#06060a 0%,#0b0711 38%,#0c0812 63%,#07070c 100%)}body:after{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background-image:radial-gradient(rgba(139,155,255,.14) .7px,transparent .8px);background-size:180px 180px;opacity:.14}button{font:inherit}button:focus-visible{outline:2px solid #fff;outline-offset:3px}.shell{position:relative;z-index:1;width:100%;min-height:100vh;margin:0;padding:0}.topbar{display:none}.brand{font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:900;color:#d4cbd8}.pill{border:1px solid var(--line);padding:7px 10px;border-radius:999px;color:#8f8794;font-size:10px;font-weight:800}.screen{display:none}.screen.active{display:block}.hero{min-height:100svh;width:100%;display:flex;align-items:stretch;justify-content:stretch;position:relative;overflow:hidden;background:transparent}.hero:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 28% 48%,rgba(126,78,183,.13),transparent 30%),radial-gradient(circle at 75% 35%,rgba(155,108,255,.07),transparent 26%) }.hero-card{position:relative;z-index:1;width:100%;min-height:100svh;display:grid;grid-template-columns:minmax(360px,46%) minmax(0,54%);align-items:center;padding:42px clamp(28px,6vw,92px);gap:clamp(24px,5vw,72px);text-align:left}.hero-art{position:relative;height:min(82vh,700px);min-height:500px;display:flex;align-items:center;justify-content:center}.hero-art:before{content:"";position:absolute;width:min(42vw,570px);height:min(70vh,600px);border-radius:50%;background:radial-gradient(circle,rgba(116,78,174,.38),rgba(70,47,105,.14) 42%,transparent 70%);filter:blur(18px)}.eyebrow{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#b6c5ff;font-weight:900;margin-bottom:17px}.hero h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(48px,6.6vw,92px);line-height:.91;letter-spacing:-.055em;margin:0 0 28px;max-width:760px;color:#f4efe8;text-transform:uppercase}.hero h1 span{display:block;color:#b8a6ff}.subtitle{max-width:600px;margin:0;color:#a9adb0;line-height:1.55;font-size:15px}.mascot{position:relative;z-index:2;height:min(82vh,690px);width:auto;max-width:80%;object-fit:contain;display:block;margin:0 auto;filter:drop-shadow(0 28px 34px rgba(0,0,0,.68)) drop-shadow(0 0 28px rgba(112,78,167,.16))}.hero-copy{align-self:center;max-width:760px}.hero-stats{display:flex;gap:14px;position:absolute;inset:0;pointer-events:none}.hero-stat{position:absolute;min-width:86px;padding:12px 14px;border:1px solid rgba(220,173,255,.24);border-radius:12px;background:rgba(9,7,13,.42);box-shadow:0 15px 35px rgba(0,0,0,.18);backdrop-filter:blur(4px)}.hero-stat small{display:block;color:#b7b0b8;font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.hero-stat strong{display:block;color:#b8b0ff;font:700 22px Georgia,serif;margin-top:5px}.hero-stat.s1{left:2%;top:28%}.hero-stat.s2{right:1%;top:43%}.hero-stat.s3{left:7%;bottom:23%}.start-btn,.share-btn,.again-btn{border:0;border-radius:10px;padding:15px 23px;font-weight:950;letter-spacing:.04em;cursor:pointer}.start-btn{margin-top:24px;background:linear-gradient(135deg,#8e63ff,#5f8eea);color:#ffffff;box-shadow:0 14px 34px rgba(118,95,235,.28);min-width:190px;border:1px solid rgba(255,255,255,.18)}.fine{font-size:10px;color:#716976;margin-top:14px}.ad-slot{min-height:0;margin:12px 0}.quiz-wrap{width:min(760px,100%);margin:auto;padding:28px 24px 46px;border-radius:26px;background:rgba(9,8,13,.52);border:1px solid rgba(214,164,255,.18);box-shadow:0 24px 70px rgba(0,0,0,.22);backdrop-filter:blur(2px)}.progress-head{display:flex;justify-content:space-between;color:#8f8794;font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;margin:6px 0 10px}.progress{height:4px;background:#211d27;border-radius:99px;overflow:hidden}.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,#7b6cff,#a66cff);transition:width .35s ease}.question-card{margin-top:26px}.q-label{color:#b08cff;font-size:10px;font-weight:950;letter-spacing:.2em;text-transform:uppercase}.question{font-family:Georgia,serif;font-size:clamp(29px,5vw,44px);line-height:1.05;margin:9px 0 22px;letter-spacing:-.03em}.answers{display:grid;gap:10px}.answer{width:100%;text-align:left;border:1px solid var(--line);background:linear-gradient(180deg,#15121a,#100e14);color:#f3eef5;padding:18px 19px;border-radius:15px;cursor:pointer;transition:.18s transform,.18s border-color,.18s background,.18s box-shadow;min-height:58px;display:flex;align-items:center}.answer:hover{transform:translateY(-2px);border-color:rgba(156,108,255,.58);background:#19151f;box-shadow:0 10px 28px rgba(103,72,188,.14)}.answer strong{font-size:14px;line-height:1.35;font-weight:800}.reveal{text-align:center}.result-card{position:relative;overflow:hidden;margin:14px auto 18px;border:1px solid rgba(156,108,255,.34);border-radius:26px;background:radial-gradient(circle at 50% 0,#2a1724,#141018 52%,#0c0a10);padding:25px 20px 23px;box-shadow:0 25px 70px rgba(0,0,0,.4)}.result-card:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 25%,rgba(255,255,255,.045) 50%,transparent 75%);transform:translateX(-100%);animation:sheen 4s ease-in-out infinite}.result-kicker{position:relative;color:#b995ff;font-size:10px;font-weight:950;letter-spacing:.24em;text-transform:uppercase}.result-img{position:relative;width:min(330px,78vw);height:330px;object-fit:contain;display:block;margin:8px auto -2px;filter:drop-shadow(0 22px 30px rgba(0,0,0,.6))}.result-card h2{position:relative;font-family:Georgia,serif;font-size:clamp(38px,8vw,65px);margin:0;letter-spacing:-.04em}.result-sub{position:relative;color:#a9a0ad;margin:7px auto 15px;max-width:550px;font-size:14px;line-height:1.55}.tags{position:relative;display:flex;justify-content:center;gap:7px;flex-wrap:wrap}.tag{border:1px solid var(--line);border-radius:999px;padding:7px 10px;color:#d5ccd9;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.section{margin-top:16px;border:1px solid rgba(195,139,255,.22);border-radius:19px;background:rgba(11,8,17,.38);padding:19px;text-align:left;box-shadow:0 20px 55px rgba(0,0,0,.14)}.section h3{margin:0 0 11px;font-size:11px;letter-spacing:.17em;text-transform:uppercase;color:#b995ff}.section p{margin:0;color:#b6adb9;line-height:1.7;font-size:13px}.trait{margin:13px 0}.trait-top{display:flex;justify-content:space-between;font-size:11px;color:#cfc6d1;font-weight:800}.bar{height:6px;background:#24202b;border-radius:99px;overflow:hidden;margin-top:6px}.bar i{display:block;height:100%;background:linear-gradient(90deg,#7c69ff,#61a7ff);border-radius:99px}.close-grid{display:grid;gap:9px}.close-row{display:grid;grid-template-columns:46px 1fr auto;align-items:center;gap:10px;padding:9px;border:1px solid var(--line);border-radius:13px}.close-row img{width:46px;height:46px;object-fit:contain;background:#0d0b11;border-radius:10px}.close-row strong{font-size:12px}.close-row span{display:block;color:#817986;font-size:10px;margin-top:2px}.pct{font-weight:950;font-size:13px;color:#b8a0ff}.share-btn{width:100%;background:linear-gradient(135deg,#805cff,#5f8eea);color:#fff;margin-top:17px;border:1px solid rgba(255,255,255,.18);box-shadow:0 12px 28px rgba(105,82,218,.24)}.again-btn{background:#19151e;border:1px solid var(--line);color:#eee;margin-top:10px;width:100%}.share-note{text-align:center;color:#746c78;font-size:10px;margin-top:9px}.footer{text-align:center;color:#5e5762;font-size:9px;margin-top:25px}.toast{position:fixed;left:50%;bottom:20px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#f4eee8;color:#161118;padding:11px 15px;border-radius:999px;font-size:11px;font-weight:900;transition:.25s;z-index:30}.toast.show{opacity:1;transform:translate(-50%,0)}@keyframes sheen{0%,55%{transform:translateX(-100%)}75%,100%{transform:translateX(100%)}}@media(max-width:800px){.quiz-wrap{padding:22px 15px 34px}.hero-card{grid-template-columns:1fr;padding:28px 22px 42px;gap:0;align-content:center}.hero-art{height:46svh;min-height:330px;max-height:500px}.mascot{height:100%;max-width:72%}.hero-copy{text-align:center}.eyebrow{font-size:9px;margin-bottom:12px}.hero h1{font-size:clamp(42px,11vw,68px);margin-bottom:18px}.subtitle{font-size:13px;max-width:520px;margin:auto}.start-btn{margin-top:19px}.fine{margin-top:10px}.hero-stat.s1{left:2%;top:27%}.hero-stat.s2{right:2%;top:44%}.hero-stat.s3{left:6%;bottom:20%}}@media(max-width:600px){.hero-card{padding:20px 15px 32px}.hero-art{height:43svh;min-height:285px}.mascot{max-width:78%}.hero-stat{min-width:73px;padding:9px 10px}.hero-stat small{font-size:7px}.hero-stat strong{font-size:18px}.hero-stat.s1{left:0;top:25%}.hero-stat.s2{right:0;top:43%}.hero-stat.s3{left:2%;bottom:18%}.question-card{margin-top:21px}.result-img{height:270px}.section{padding:16px}.close-row{grid-template-columns:42px 1fr auto}.close-row img{width:42px;height:42px}}

/* HALLOWEEN REVEAL — Apothecary-style final result */
.reveal{width:min(100%,1100px);margin:0 auto;padding-bottom:50px}
.result-hero{position:relative;min-height:740px;overflow:hidden;border:1px solid rgba(210,157,255,.36);border-radius:0 0 34px 34px;background:#100d18;isolation:isolate;box-shadow:0 25px 70px rgba(0,0,0,.34)}
.result-hero-bg{display:none!important}
.result-hero:before{content:"";position:absolute;inset:-10px;z-index:0;pointer-events:none;background:url("assets/halloween box background.webp") center center / cover no-repeat;filter:blur(3px);transform:scale(1.025);opacity:.94}
.result-hero:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(7,5,12,.08) 0%,rgba(7,5,12,.04) 45%,rgba(7,5,12,.12) 100%)}
.result-hero-inner{position:relative;z-index:2;min-height:740px;padding:25px 24px 30px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center}
.result-brand{font-size:10px;letter-spacing:.25em;color:#f0b26b;font-weight:900;margin:8px 0 18px;text-transform:uppercase}
.portrait-ring{width:250px;height:250px;border-radius:50%;padding:7px;border:1px solid rgba(220,171,255,.75);background:linear-gradient(135deg,rgba(255,177,82,.55),rgba(150,89,221,.65));box-shadow:0 0 0 4px rgba(12,8,17,.7),0 0 40px rgba(145,91,202,.3);display:grid;place-items:center;overflow:hidden}
.result-portrait{width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:center center;background:#120c16;display:block;transform:scale(1.015);filter:drop-shadow(0 12px 20px rgba(0,0,0,.55))}
.resonance{font-size:9px;letter-spacing:.25em;color:#9e91a9;margin-top:19px;text-transform:uppercase;font-weight:900}
.result-hero h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(45px,7vw,70px);line-height:.95;margin:7px 0 2px;letter-spacing:-.045em;color:#fff8f1}
.result-hero h2.long-name{font-size:clamp(34px,5vw,56px);line-height:.98;max-width:96%;letter-spacing:-.035em;text-wrap:balance}
@media(max-width:700px){.result-hero h2.long-name{font-size:clamp(30px,8.5vw,46px);max-width:100%}}
.result-title{font:italic 600 21px Georgia,serif;color:#d4a0ef;margin-bottom:13px}
.result-description{max-width:700px;color:#ddd5df;font-size:13px;line-height:1.5;margin:0 auto 11px}
.result-hero .tags{margin-bottom:4px}
.result-hero .tag{background:rgba(23,13,32,.5);border-color:rgba(206,145,255,.45);font-size:9px;padding:6px 10px}
.match{display:flex;align-items:baseline;justify-content:center;gap:11px;margin:4px 0 12px}
.match strong{font:700 40px Georgia,serif;color:#bfa8ff}
.match span{font-size:9px;letter-spacing:.22em;color:#9f94a5;font-weight:900}
.result-hero .share-btn{width:min(390px,90vw);margin:0;background:linear-gradient(135deg,#8e7dff,#5f8eea);color:#11101a;border-radius:28px;border:1px solid rgba(255,255,255,.65);box-shadow:0 12px 32px rgba(100,115,220,.22);padding:14px 22px}
.profile-link{border:0;background:transparent;color:#c8b9cc;font-size:9px;letter-spacing:.15em;font-weight:900;margin-top:12px;cursor:pointer;text-transform:uppercase}
.profile-link span{font-size:13px;margin-left:4px}
.result-footer{font-size:8px;letter-spacing:.18em;color:#635b68;margin-top:15px}
.trait-section{margin-top:18px!important;padding:27px 30px!important;background:rgba(11,8,17,.38)!important;border-color:rgba(180,115,255,.3)!important}
.trait-section h3,.section h3{color:#e2b2f3}
.trait-intro{font-size:11px!important;color:#8e8297!important;line-height:1.6!important;margin:0 0 2px!important}.trait-bars{margin-top:18px;display:grid;gap:15px}
.trait-row{display:grid;grid-template-columns:155px minmax(180px,1fr) 155px;align-items:center;gap:13px;min-height:20px}
.trait-label{font-size:11px;color:#756d7e;font-weight:650;letter-spacing:.01em;white-space:nowrap}.trait-label.active{letter-spacing:.01em}.trait-label.left{text-align:right}.trait-label.right{text-align:left}.trait-label.active{color:#f0e8f2;font-weight:900}
.trait-track{height:8px;background:#4a395b;border-radius:999px;position:relative;overflow:visible;box-shadow:inset 0 0 0 1px rgba(255,255,255,.035)}
.trait-track:after{content:"";position:absolute;left:50%;top:-5px;height:18px;width:1px;background:rgba(246,237,250,.46);box-shadow:0 0 8px rgba(220,170,255,.14)}
.trait-track b{position:absolute;top:0;height:100%;border-radius:999px;background:linear-gradient(90deg,#bd70f4,#9857cf);box-shadow:0 0 13px rgba(181,108,242,.3);transition:left .35s ease,width .35s ease}
.trait-track i{position:absolute;top:-5.5px;width:19px;height:19px;border-radius:50%;background:#f4c16a;border:2px solid #aa69df;box-shadow:0 0 14px rgba(194,111,241,.66);transform:translateX(-50%);z-index:3;transition:left .35s ease}
.section-intro{font-size:11px!important;color:#8e8297!important;margin-bottom:15px!important}
.close-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important}
.close-row{display:block!important;padding:10px!important;text-align:left}.close-row img{width:100%!important;height:150px!important;display:block;object-fit:contain!important;background:radial-gradient(circle,#251932,#0c0910)!important;border:1px solid rgba(198,139,255,.25)}.close-row>div:nth-child(2){padding:9px 2px 2px}.close-row strong{font-size:12px}.close-row .pct{display:block;margin-top:5px}
.profile-section{scroll-margin-top:15px}
.profile-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:17px}.profile-stat span{font-size:10px;color:#8f8496}.profile-stat strong{float:right;font-size:11px}.profile-stat .bar{clear:both}
.dark-side{margin-top:18px!important;padding-top:16px;border-top:1px solid var(--line)}
.reveal .again-btn{max-width:420px;display:block;margin:16px auto 0}
@media(max-width:800px){.result-hero,.result-hero-inner{min-height:690px}.portrait-ring{width:210px;height:210px}.trait-row{grid-template-columns:105px minmax(100px,1fr) 105px;gap:8px}.close-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.close-row img{height:145px!important}}
@media(max-width:560px){.result-hero{border-radius:0 0 23px 23px}.result-hero-inner{padding:21px 15px 24px;min-height:650px}.result-brand{font-size:8px;letter-spacing:.18em}.portrait-ring{width:175px;height:175px}.result-hero h2{font-size:44px}.result-title{font-size:18px}.result-description{font-size:12px;max-width:360px}.match strong{font-size:34px}.trait-section{padding:20px 12px!important}.trait-row{grid-template-columns:83px minmax(85px,1fr) 83px}.trait-label{font-size:8px}.trait-track{height:7px}.trait-track i{width:15px;height:15px;top:-4px}.close-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.close-row img{height:120px!important}.profile-grid{grid-template-columns:1fr}}

/* v7 trait reading refinement */
@media(max-width:800px){.trait-row{grid-template-columns:108px minmax(90px,1fr) 108px;gap:9px}.trait-label{font-size:9px}.trait-section{padding:25px 18px!important}}
@media(max-width:560px){.portrait-ring{width:182px;height:182px}.result-portrait{transform:scale(1.025)}.trait-section{padding:20px 13px!important}.trait-bars{gap:13px}.trait-row{grid-template-columns:78px minmax(84px,1fr) 78px;gap:7px}.trait-label{font-size:8px}.trait-track{height:7px}.trait-track i{width:16px;height:16px;top:-4.5px}}

.ad-slot{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:0;margin:18px 0 6px;gap:7px}.ad-label{font-size:8px;font-weight:800;letter-spacing:.18em;color:#6f6680;text-transform:uppercase}.native-ad-slot{width:min(100%,360px);min-height:0;display:flex;justify-content:center;align-items:center;overflow:hidden}.native-ad-slot script{display:none}.native-ad-slot>div{width:100%;min-height:110px}.final-ad-slot{margin:22px auto 10px;padding:14px 12px;border:1px solid rgba(169,115,255,.16);border-radius:16px;background:rgba(10,8,15,.28);display:flex;flex-direction:column;align-items:center;gap:8px}.final-ad-slot .native-ad-slot{width:min(100%,640px)}.final-ad-slot iframe{max-width:100%}@media(max-width:600px){.final-ad-slot{margin-top:18px}.native-ad-slot{width:100%}.native-ad-global{width:100%;margin-bottom:12px;padding:6px 8px;border-radius:0 0 12px 12px}}
.native-ad-global{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;width:min(100%,720px);margin:0 auto 18px;padding:8px 12px;border:1px solid rgba(169,115,255,.16);border-radius:0 0 16px 16px;background:rgba(10,8,15,.92);overflow:hidden;position:sticky;top:0;z-index:20;backdrop-filter:blur(10px);box-shadow:0 8px 24px rgba(0,0,0,.18)}.native-ad-global .native-ad-slot{width:min(100%,640px);min-height:110px;display:flex;justify-content:center;align-items:center;overflow:hidden}.native-ad-global .native-ad-slot>div{width:100%;min-height:110px}.native-ad-global .ad-label{font-size:8px;font-weight:800;letter-spacing:.18em;color:#6f6680;text-transform:uppercase}.native-ad-global iframe{max-width:100%}
