:root{
  font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  font-size:16px;line-height:1.6;color:#2d2940;background:#171327;
  --violet:#5f4ca8;--violet-deep:#2f2459;--violet-soft:#eeeafd;--paper:#fbf9ff;
  --gold:#d5b86f;--ink:#29243f;--muted:#7a748d;--line:#e5e0f1;
}
*{box-sizing:border-box}
html{background:#171327}
body{margin:0;min-width:320px;background:radial-gradient(circle at 50% 0,#342a55,#171327 58%)}
button,input{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.38}
.app-shell{width:min(100%,500px);min-height:100dvh;margin:auto;background:#f1eefb;box-shadow:0 0 70px #0008;overflow:hidden}
.screen{min-height:100dvh}
.site-head{height:58px;display:flex;align-items:center;gap:9px;padding:0 17px;color:#332b5c;background:#fff;border-bottom:1px solid #eae5f7;position:relative;z-index:8}
.brand-mark{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;color:#f2dfaa;background:#493883;font-family:serif;font-weight:900}
.site-head strong{font-size:1rem;letter-spacing:.05em}
.site-head small{margin-left:auto;color:#8a82a9;font-size:.72rem;letter-spacing:.13em;font-weight:700}
.eyebrow{margin:0 0 10px;color:#8875c6;font-size:.75rem;letter-spacing:.18em;font-weight:800;text-transform:uppercase}
.primary,.outline,.text-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 18px;border-radius:13px;font-size:.95rem;font-weight:750;text-decoration:none;transition:transform .16s,background .16s,border-color .16s}
.primary{border:1px solid #6955b6;color:#fff;background:linear-gradient(135deg,#7561c2,#574394);box-shadow:0 9px 20px #59429c38}
.primary:active,.outline:active{transform:scale(.985)}
.outline{border:1px solid #d9d2eb;color:#65598b;background:#fff}
.text-btn{border:0;background:transparent;color:#877caf;min-height:38px;padding:6px 10px}
.wide{width:100%}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Access cover */
.gate-screen{position:relative;color:#fff;background:#2f2459;isolation:isolate}
.gate-screen::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#1e1734aa,#2f2459cc),url('/assets/scenes/rain-house.webp') center/cover;z-index:-2}
.gate-screen::after{content:"";position:absolute;inset:14px;border:1px solid #d8bd7759;z-index:-1;pointer-events:none}
.gate-wrap{min-height:100dvh;padding:32px 23px max(32px,env(safe-area-inset-bottom));display:flex;flex-direction:column;justify-content:space-between}
.gate-brand{display:flex;align-items:center;justify-content:center;gap:10px;color:#ead9ab;font-size:.78rem;letter-spacing:.22em}
.gate-brand i{display:block;width:38px;height:1px;background:#ead9ab88}
.gate-copy{margin:auto 0;text-align:center;padding:12px 0 18px}
.seal{width:56px;height:56px;margin:0 auto 19px;border:1px solid #e3c474;border-radius:7px;display:grid;place-items:center;color:#ead399;font-family:serif;font-size:1.45rem;transform:rotate(-3deg);box-shadow:inset 0 0 0 4px #d3b96b18}
.mystery-kicker{margin:0;color:#ead18a;font-family:"Songti SC","STSong",serif;font-size:.9rem;letter-spacing:.09em}
.mystery-portraits{position:relative;width:280px;height:170px;margin:-4px auto 8px;isolation:isolate}
.mystery-portraits::before{content:"";position:absolute;inset:22px 35px 8px;border-radius:50%;background:#b59ae557;filter:blur(28px);z-index:-1}
.mystery-card{position:absolute;top:11px;width:104px;height:142px;margin:0;overflow:hidden;border:1px solid #e0c57980;border-radius:52px 52px 14px 14px;background:#171126;box-shadow:0 16px 30px #09051499}
.mystery-card.left{left:12px;transform:rotate(-9deg) scale(.9);opacity:.68}.mystery-card.center{left:88px;z-index:2}.mystery-card.right{right:12px;transform:rotate(9deg) scale(.9);opacity:.68}
.mystery-card img{width:100%;height:100%;object-fit:cover;object-position:center 16%;filter:grayscale(.35) brightness(.6) saturate(.7)}
.mystery-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#251b4214 35%,#171025e8)}
.mystery-seal{position:absolute;left:50%;bottom:0;z-index:4;width:48px;height:48px;display:grid;place-items:center;border:1px solid #e0c36f;border-radius:50%;background:#261c46;color:#f0d98f;font-family:"Songti SC","STSong",serif;font-size:1.25rem;box-shadow:0 0 0 5px #261c46cc,0 8px 24px #08040f}
.gate-copy h1{font-family:"Songti SC","STSong",serif;font-size:2.35rem;line-height:1.18;letter-spacing:.1em;margin:6px 0 0;color:#fff9ed;font-weight:600;text-shadow:0 4px 20px #0009}
.gate-copy .subtitle{font-family:"Songti SC","STSong",serif;font-size:1.05rem;letter-spacing:.08em;color:#f0cf76;margin:15px 0 6px;text-shadow:0 2px 12px #0008}
.gate-copy .desc{font-size:.82rem;color:#cfc6e3;margin:0}
.gate-value{margin:12px auto 0!important;padding:8px 10px;border:1px solid #d8bd7740;border-radius:999px;color:#eadfca!important;font-size:.72rem!important;letter-spacing:.03em;max-width:330px;background:#1b153180}
.gate-panel{padding:21px;border:1px solid #cdb7754a;border-radius:21px;background:#211a3ed9;backdrop-filter:blur(12px);box-shadow:0 18px 50px #100a25aa}
.code-row{display:flex;gap:9px}
.code-row input{flex:1;min-width:0;height:52px;border:1px solid #ab96d866;border-radius:12px;background:#fff;color:#4a397f;text-align:center;letter-spacing:.32em;font-size:1.2rem;font-weight:800;outline:none}
.code-row input:focus{border-color:#dcc581;box-shadow:0 0 0 3px #dbc47722}
.code-row .primary{white-space:nowrap}
.gate-help{margin:9px 2px 0;color:#aaa0c2;font-size:.72rem;text-align:center}
.gate-error{margin:8px 2px 0;color:#ffd0da;font-size:.8rem}.gate-error:empty{display:none}

/* Intro */
.intro-wrap{min-height:calc(100dvh - 58px);padding:18px;display:flex;align-items:center}
.intro-card{width:100%;padding:27px 22px;border:1px solid #e6e0f2;border-radius:25px;background:#fff;text-align:center;box-shadow:0 18px 42px #51408f18}
.intro-orbit{width:82px;height:82px;margin:0 auto 18px;border:1px solid #b19edb;border-radius:50%;display:grid;place-items:center;position:relative;color:#5e4ba1;font-family:serif;font-size:1.25rem}
.intro-orbit::before,.intro-orbit::after{content:"";position:absolute;border:1px solid #d8cdee;border-radius:50%;inset:9px}.intro-orbit::after{inset:20px;background:#f4f0ff;border:0}
.intro-orbit span{position:relative;z-index:1}
.intro-card h1{font-family:"Songti SC","STSong",serif;font-size:1.8rem;line-height:1.35;margin:0 0 11px;color:#30274d}
.intro-card>p:not(.eyebrow){margin:0 0 20px;color:#706980;font-size:.9rem}
.intro-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}
.intro-facts div{padding:12px 5px;border-radius:12px;background:#f7f5fe;color:#5b4b91;font-weight:800;font-size:.86rem}
.intro-facts small{display:block;margin-top:2px;color:#9a92ad;font-weight:500;font-size:.68rem}
.intro-note{text-align:left;padding:14px 15px;border-left:3px solid #826dc1;border-radius:4px 12px 12px 4px;background:#f7f4ff;color:#676078;font-size:.82rem;margin:18px 0}
.gender-choices{display:grid;gap:9px;margin:18px 0;text-align:left}
.gender-choice{display:flex;align-items:center;gap:12px;width:100%;min-height:68px;padding:11px 13px;border:1.5px solid #e2dced;border-radius:14px;background:#fbfaff;color:#302b45;text-align:left}
.gender-choice.chosen{border-color:#7965bd;background:#f1edff}
.gender-symbol{width:42px;height:42px;border-radius:12px;background:#e8e1f8;color:#6653a3;display:grid;place-items:center;font-weight:900}
.gender-choice strong,.gender-choice small{display:block}.gender-choice small{font-size:.74rem;color:#8c849d;font-weight:500}
.radio-dot{display:block;flex:none;width:15px;height:15px;border:1.5px solid #9388ae;border-radius:50%;margin-left:auto}
.chosen .radio-dot,.selected .radio-dot{border:4px solid #725eb5;background:#fff}
.intro-actions{display:grid;grid-template-columns:1fr 1.45fr;gap:9px}

/* Story quiz */
.quiz-screen{background:#171329}
.scene-stage{min-height:calc(100dvh - 58px);position:relative;isolation:isolate;background:#282040;overflow:hidden}
.scene-bg{position:absolute;inset:0;background-position:center;background-size:cover;z-index:-3;transform:scale(1.015)}
.scene-stage::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#17132b55 0%,#18132caa 38%,#171329 82%);z-index:-2}
.scene-stage::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 12%,transparent,#15102599 72%);z-index:-1;pointer-events:none}
.quiz-top{display:flex;align-items:center;gap:11px;padding:15px 17px;color:#f5efff}
.back-mini{width:38px;height:38px;display:grid;place-items:center;border:1px solid #ffffff38;border-radius:12px;background:#271f47aa;color:#fff;font-size:1.1rem}
.progress-group{flex:1}.progress-label{display:flex;justify-content:space-between;font-size:.76rem;color:#ded3f2;margin-bottom:6px}.progress-label strong{color:#fff}
.track{height:5px;border-radius:9px;background:#ffffff26;overflow:hidden}.track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#d7ba73,#f0d99d);transition:width .3s}
.story-panel{margin-top:min(18vh,132px);padding:0 14px max(32px,env(safe-area-inset-bottom))}
.chapter-label{display:inline-flex;align-items:center;gap:8px;margin:0 0 9px;color:#ead28f;font-size:.75rem;letter-spacing:.12em}.chapter-label::before{content:"";width:23px;height:1px;background:#d3b56b}
.question-card{padding:20px 16px 16px;border:1px solid #ffffff28;border-radius:23px;background:#fdfbffef;box-shadow:0 18px 50px #0c071c99;backdrop-filter:blur(12px)}
.question-card h1{font-size:1.17rem;line-height:1.55;margin:0 0 7px;color:#2c273f}
.question-card .story-copy{margin:0 0 16px;color:#686176;font-size:.87rem;line-height:1.68}
.previous-effect{display:flex;align-items:flex-start;gap:9px;padding:10px 11px;margin:0 0 13px;border-radius:11px;background:#eee9fb;color:#5e518b;font-size:.78rem;line-height:1.55}
.previous-effect::before{content:"\2726";color:#8d70c8;flex:none}
.options{display:grid;gap:8px}
.option{width:100%;min-height:50px;display:flex;align-items:center;gap:10px;padding:10px 12px;border:1.3px solid #ddd6eb;border-radius:13px;background:#fff;color:#332e45;text-align:left;font-size:.88rem;font-weight:650;line-height:1.45;transition:transform .15s,border-color .15s,background .15s}
.option::before{content:attr(data-letter);width:25px;height:25px;border-radius:8px;display:grid;place-items:center;flex:none;background:#f0ecfa;color:#7967b0;font-size:.72rem;font-weight:900}
.option.selected{border-color:#755db8;background:#ebe5ff;transform:translateY(-1px);box-shadow:0 7px 17px #5b479b24}.option.selected::before{background:#6d58ae;color:#fff}
.option:disabled{cursor:default;opacity:1}.option:disabled:not(.selected){opacity:.5}
.choice-feedback{display:none;width:100%;align-items:center;justify-content:space-between;gap:8px;margin-top:11px;padding:13px 14px;border-radius:12px;background:#302557;color:#f7f1ff;font-size:.84rem;font-weight:800;line-height:1.55;cursor:pointer}.choice-feedback.show{display:flex;animation:fadeUp .22s ease}.choice-feedback::before{content:"\2713";color:#e4c97f;flex:none}.choice-feedback::after{content:"\2192";color:#e4c97f;font-size:1rem;flex:none}.choice-feedback:focus-visible{outline:3px solid #e4c97f;outline-offset:2px}
.next-now{margin-top:2px;font-size:.74rem}
.quiz-footer{display:flex;align-items:center;justify-content:space-between;margin-top:11px;min-height:32px}.quiz-footer span{color:#9a92a9;font-size:.72rem}.skip-wait{display:none;border:0;background:transparent;color:#7765ac;font-size:.76rem}.skip-wait.show{display:block}
.page-flip{position:absolute;inset:0;z-index:20;pointer-events:none;background:linear-gradient(90deg,#251c43,#6f5ca7 48%,#221a3d);transform-origin:left;transform:perspective(900px) rotateY(92deg);opacity:0}
.turning .page-flip{animation:turnPage .88s cubic-bezier(.67,.01,.3,.99)}

/* Ending + reveal */
.ending-screen,.reveal-screen{background:#211a3c;color:#fff;position:relative;overflow:hidden}
.ending-screen::before,.reveal-screen::before{content:"";position:absolute;inset:0;background:linear-gradient(#17122977,#1d1737e6),url('/assets/scenes/after-rain.webp') center/cover;opacity:.85}
.ending-wrap,.reveal-wrap{position:relative;min-height:100dvh;padding:50px 22px max(36px,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:center}
.ending-card{width:100%;padding:25px 21px;border:1px solid #d7bd7359;border-radius:20px;background:#221a3ddf;box-shadow:0 25px 70px #090516a8;backdrop-filter:blur(12px)}
.ending-card .eyebrow{color:#ddc27a}.ending-card h1{font-family:"Songti SC","STSong",serif;font-size:1.75rem;margin:0 0 15px;color:#fff8e9}.ending-card p{color:#e5dff0;font-size:.92rem;line-height:1.9;margin:0 0 19px}.ending-card .primary{border-color:#ccb064;background:linear-gradient(135deg,#8b6d31,#b18d47)}
.reveal-wrap{text-align:center;flex-direction:column}.reveal-copy{position:absolute;top:55px;left:20px;right:20px;z-index:4}.reveal-copy p{color:#d9cce9;font-size:.83rem;letter-spacing:.08em}.reveal-copy button{color:#e5d4a5}
.portrait-stage{width:min(86vw,390px);aspect-ratio:4/5;position:relative;border-radius:28px;overflow:hidden;border:1px solid #e2c98155;background:#171127;box-shadow:0 25px 70px #080411c4}
.portrait-stage::before{content:"";position:absolute;inset:-20%;z-index:2;background:radial-gradient(circle,#a88bd28f,#33224ee8 55%,#171027 72%);filter:blur(20px);opacity:1;animation:inkMist 1.1s ease forwards}
.portrait-stage img{width:100%;height:100%;object-fit:cover;filter:blur(22px) saturate(.65);transform:scale(1.1);opacity:.15;animation:portraitReveal 2.5s .45s ease forwards}
.portrait-stage .silhouette{position:absolute;inset:14% 20% 0;background:#100b1d;border-radius:48% 48% 20% 20%;filter:blur(4px);opacity:0;z-index:1;animation:silhouette 1.35s .25s ease}
.name-reveal{position:absolute;left:14px;right:14px;bottom:16px;z-index:3;padding:38px 12px 12px;background:linear-gradient(transparent,#171128e8);opacity:0;animation:fadeUp .65s 2.15s ease forwards}.name-reveal h1{font-family:"Songti SC","STSong",serif;font-size:2.35rem;letter-spacing:.14em;margin:0;color:#fff8e9}.name-reveal p{margin:3px 0;color:#e2c777;font-size:.86rem;letter-spacing:.08em}.name-reveal .seal-small{display:inline-grid;place-items:center;width:32px;height:32px;margin-left:6px;border:1px solid #d5b567;border-radius:4px;color:#e1c77d;font-size:.7rem;vertical-align:middle;transform:rotate(-4deg)}

/* Result */
.result-screen{background:linear-gradient(180deg,#e9e4f8,#f5f2fc)}
.result-wrap{padding:14px 12px 34px}
.result-hero,.result-card{border:1px solid #e4deef;background:#fff;box-shadow:0 12px 28px #44337212}
.result-hero{position:relative;overflow:hidden;border-radius:23px;background:#2f2459;color:#fff}
.result-portrait{height:380px;position:relative}.result-portrait img{width:100%;height:100%;object-fit:cover;object-position:center 18%}.result-portrait::after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#2f2459 92%)}
.hero-copy{position:relative;margin-top:-105px;padding:0 19px 22px;text-align:center}.hero-copy .eyebrow{color:#e2c87e}.hero-copy h1{font-family:"Songti SC","STSong",serif;font-size:2.5rem;letter-spacing:.12em;margin:0;color:#fff9eb}.hero-copy .hero-title{margin:2px 0 11px;color:#e5d7ff;font-size:1rem}.keyword-row{display:flex;justify-content:center;flex-wrap:wrap;gap:7px}.keyword-row span{padding:5px 10px;border:1px solid #ffffff36;border-radius:999px;background:#ffffff14;color:#f4ecff;font-size:.76rem}.hero-quote{margin:15px 0 0;padding:12px 13px;border:1px solid #d7bc6f40;border-radius:12px;background:#21183c;color:#f1e7cc;text-align:left;font-size:.9rem}.hero-quote small{display:block;margin-bottom:5px;color:#d8bd77;font-size:.65rem;letter-spacing:.1em}.hero-quote p{margin:0;color:#f1e7cc;font-family:"Songti SC","STSong",serif;line-height:1.65}
.result-card{border-radius:18px;padding:18px;margin-top:12px}.section-no{color:#806eb8;font-size:.72rem;font-weight:900;letter-spacing:.14em}.result-card h2{font-size:1.05rem;margin:3px 0 10px;color:#332d49}.result-card p{font-size:.94rem;line-height:1.82;color:#655e75;margin:0}.section-lead{padding-bottom:13px;color:#847c92!important;font-size:.84rem!important}.evidence-list{display:grid;gap:10px}.evidence-item{padding:12px;border-radius:12px;background:#f7f4fd;border:1px solid #ebe6f4}.evidence-item strong{display:block;color:#554788;font-size:.86rem;margin-bottom:5px}.evidence-item p{font-size:.84rem}.pattern-stack{display:grid;gap:10px}.pattern-box{position:relative;overflow:hidden;padding:15px 14px 15px 17px;border-radius:14px;background:#f7f5fd;border:1px solid #ebe6f5}.pattern-box::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:#8b73c6}.pattern-box.pressure::before{background:#c4916c}.pattern-box.seen::before{background:#6d9a96}.pattern-box>span{display:block;margin-bottom:2px;color:#8a7ab3;font-size:.72rem;font-weight:800;letter-spacing:.09em}.pattern-box.pressure>span{color:#a76e4c}.pattern-box.seen>span{color:#56827f}.pattern-box>strong{display:block;margin-bottom:6px;color:#443763;font-size:.91rem}.pattern-box p{font-size:.87rem;line-height:1.78}.advice-list{display:grid;gap:0}.advice-item{display:grid;grid-template-columns:34px 1fr;gap:11px;padding:14px 0;border-bottom:1px solid #eee9f5}.advice-item:first-child{padding-top:3px}.advice-item:last-child{padding-bottom:3px;border-bottom:0}.advice-item i{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#eee9fa;color:#745eae;font-size:.68rem;font-style:normal;font-weight:900}.advice-item strong{display:block;margin-bottom:5px;color:#443763;font-size:.9rem}.advice-item p{font-size:.87rem;line-height:1.78}.second-match{display:flex;gap:12px;align-items:center;padding:13px;border-radius:12px;background:#2f2750;color:#fff}.second-match img{width:62px;height:72px;border-radius:10px;object-fit:cover}.second-match strong{display:block;color:#ead18a}.second-match p{color:#d9d1e8;font-size:.82rem;line-height:1.7}.result-closing{margin:14px 3px 0;padding:18px 17px;border:1px solid #bca56788;border-radius:17px;background:linear-gradient(145deg,#302653,#45356f);color:#fff}.result-closing small{display:block;margin-bottom:6px;color:#e2ca86;font-size:.72rem;letter-spacing:.1em}.result-closing p{margin:0;color:#f0eaf8;font-family:"Songti SC","STSong",serif;font-size:.94rem;line-height:1.85}.result-actions{display:grid;gap:9px;margin:18px 0}.disclaimer{text-align:center;color:#91899f;font-size:.7rem}.modal-layer{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:16px;background:#151023b8;backdrop-filter:blur(6px)}.modal{width:min(100%,430px);max-height:88dvh;overflow:auto;padding:19px;border-radius:20px;background:#fff;box-shadow:0 25px 80px #0006}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.modal-head h2{font-size:1.05rem;margin:0}.modal-close{width:36px;height:36px;border:0;border-radius:50%;background:#f0ecf8;color:#51466e;font-size:1.35rem}.modal p,.modal li{color:#6c6579;font-size:.84rem;line-height:1.7}.modal img{display:block;width:100%;margin:12px 0;border:1px solid #e7e1ef;border-radius:12px}
.modal .save-help{font-size:1rem;line-height:1.6;color:#423754}.modal .save-fallback{font-size:.86rem;line-height:1.6}.modal .share-preview{background:#eee9fa}.modal #share-result,.modal #download-result{margin-top:10px}
.yi-card{margin:14px 3px 0;padding:19px 17px;border:1px solid #cbb36c99;border-radius:18px;background:linear-gradient(145deg,#2e2551,#493873);color:#fff;box-shadow:0 14px 30px #2b1d522b}.yi-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.yi-head span{color:#e2ca86;font-size:.72rem;font-weight:900;letter-spacing:.13em}.yi-head strong{padding:3px 9px;border:1px solid #e0c67966;border-radius:999px;color:#f3dfa4;font-family:"Songti SC","STSong",serif;font-size:.8rem}.yi-card blockquote{margin:14px 0 3px;color:#fff8e8;font-family:"Songti SC","STSong",serif;font-size:1.12rem;line-height:1.72}.yi-card>small{display:block;color:#bdb1d7;font-size:.68rem}.yi-plain,.yi-action{margin-top:13px;padding:12px 13px;border-radius:12px;background:#ffffff0d;border:1px solid #ffffff16}.yi-plain strong,.yi-action strong{display:block;margin-bottom:4px;color:#efd78f;font-size:.78rem;letter-spacing:.08em}.yi-card .yi-plain p,.yi-card .yi-action p{margin:0;color:#f1edf8;font-size:.86rem;line-height:1.75}.yi-card .yi-action{background:#f0d98f12;border-color:#e9cf7f35}.yi-card .yi-note{margin:12px 2px 0;color:#bdb3cf;font-size:.68rem;line-height:1.65}
.reality-card{padding-bottom:15px}.area-grid{display:grid;gap:11px}.area-card{display:grid;grid-template-columns:38px 1fr;gap:11px;padding:14px;border:1px solid #ebe6f4;border-radius:14px;background:#f8f6fc}.area-card>span{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:#eee9fa;color:#735dad;font-size:.72rem;font-weight:900}.area-card strong{display:block;margin:1px 0 5px;color:#40355d;font-size:.92rem}.area-card p{font-size:.86rem;line-height:1.75}.area-card.work{background:#f5f7fd}.area-card.work>span{background:#e7ecfa;color:#5870a2}.area-card.love{background:#fdf6f8}.area-card.love>span{background:#f7e5eb;color:#a55e77}.area-card.future{background:#fffaf0;border-color:#eee2c6}.area-card.future>span{background:#f4e6bd;color:#8e6a24}.future-note{margin-top:12px!important;padding:9px 11px;border-radius:10px;background:#f3eff9;color:#847c92!important;font-size:.72rem!important;line-height:1.6!important}
.trait-list{display:grid;gap:9px;margin-top:14px}.trait-row{display:grid;grid-template-columns:38px 1fr 34px;align-items:center;gap:9px;color:#5d5571;font-size:.78rem}.trait-row>div{height:7px;border-radius:8px;background:#eae6f3;overflow:hidden}.trait-row i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#765fc0,#b196d8)}.trait-row small{color:#8d849f;font-size:.68rem;text-align:right}

@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes turnPage{0%{opacity:0;transform:perspective(900px) rotateY(92deg)}18%{opacity:1}55%{opacity:1;transform:perspective(900px) rotateY(0deg)}100%{opacity:0;transform:perspective(900px) rotateY(-88deg)}}
@keyframes inkMist{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.35)}}
@keyframes silhouette{0%{opacity:0;transform:translateY(18px)}35%{opacity:.9}100%{opacity:0;transform:translateY(0)}}
@keyframes portraitReveal{0%{opacity:.15;filter:blur(22px) saturate(.65);transform:scale(1.1)}100%{opacity:1;filter:blur(0) saturate(1);transform:scale(1)}}
button:focus-visible,input:focus-visible{outline:3px solid #d6c58d;outline-offset:2px}
@media(min-width:700px){body{padding:24px}.app-shell{min-height:calc(100dvh - 48px);border-radius:24px}.screen{min-height:calc(100dvh - 48px)}.gate-wrap,.ending-wrap,.reveal-wrap{min-height:calc(100dvh - 48px)}.scene-stage{min-height:calc(100dvh - 106px)}}
@media(max-width:360px){.gate-copy h1{font-size:2.05rem}.story-panel{margin-top:14vh}.question-card{padding:17px 13px 14px}.question-card h1{font-size:1.05rem}.option{font-size:.82rem;min-height:46px}.result-portrait{height:330px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.page-flip{display:none}}