:root{--mist:#e7ebdf;--paper:#fbf9f0;--paper-deep:#f1efdf;--ink:#27392e;--muted:#627268;--pine:#2f5144;--pine-dark:#213d33;--red:#9d5b48;--gold:#b89768;--line:#cfd5c5;--serif:"Songti SC","Noto Serif SC","STSong",serif}
*{box-sizing:border-box}html{max-width:100%;overflow-x:hidden}body{margin:0;background:var(--mist);color:var(--ink);font-family:var(--serif);-webkit-font-smoothing:antialiased}button,input{font:inherit}button{cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--red);outline-offset:3px}.hidden{display:none!important}
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 12% 10%,rgba(255,255,255,.7),transparent 25%),radial-gradient(circle at 93% 78%,rgba(171,193,169,.33),transparent 30%)}
.site-shell{max-width:1240px;min-height:100vh;margin:auto;padding:0 34px;display:flex;flex-direction:column}.site-header{height:88px;display:flex;align-items:center;gap:25px;border-bottom:1px solid #b9c7b8}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;font-size:17px;font-weight:700;letter-spacing:.11em}.brand-mark{width:44px;height:44px;border:1px solid var(--pine);border-radius:50%;display:grid;place-items:center;font-size:14px;letter-spacing:0}.brand-copy small{display:block;margin-top:4px;font:10px Georgia,serif;letter-spacing:.18em;color:var(--muted)}.header-note{margin-left:auto;font-size:12px;letter-spacing:.24em;color:var(--muted)}.header-archive{font-size:13px;color:var(--pine);text-decoration:none;border-bottom:1px solid var(--pine);padding:5px 0}main{flex:1}.site-footer{display:flex;justify-content:space-between;gap:20px;align-items:center;min-height:76px;border-top:1px solid #b9c7b8;font-size:12px;letter-spacing:.14em;color:var(--muted)}.site-footer a{color:var(--pine);text-decoration:none;border-bottom:1px solid currentColor}
.view{animation:rise .38s ease both}@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.intro-view{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:6%;align-items:center;min-height:calc(100vh - 165px);padding:45px 0 65px}.intro-copy{padding:15px 0 20px}.eyebrow,.step-mark{font-size:12px;color:var(--red);font-weight:700;letter-spacing:.2em}.intro-flower{font-size:55px;color:#91a58e;margin:24px 0 -3px}.intro-copy h1{font-size:clamp(48px,5vw,76px);line-height:1.34;font-weight:600;letter-spacing:.07em;margin:0 0 22px}.intro-copy h1 em{font-style:normal;color:var(--pine)}.lead{font-size:17px;line-height:2;max-width:570px;color:#53675c;margin:0 0 25px}.quick-facts{display:flex;flex-wrap:wrap;gap:0;margin-bottom:29px;color:var(--pine);font-size:13px}.quick-facts span{padding:0 17px;border-left:1px solid var(--gold)}.quick-facts span:first-child{padding-left:0;border:0}.access-panel{background:rgba(251,249,240,.79);border:1px solid #c2cdbd;padding:19px 22px;max-width:535px;box-shadow:0 16px 34px rgba(36,68,51,.06)}.access-panel label{display:block;font-size:12px;letter-spacing:.16em;margin-bottom:9px;color:var(--pine)}.access-row{display:flex;gap:8px}.access-row input{min-width:0;flex:1;height:52px;background:#fffdf5;border:1px solid var(--line);padding:0 13px;font-size:14px}.access-row .button{min-width:178px}.access-panel small{display:block;margin-top:10px;color:var(--muted);font-size:11px}.access-error{color:#a23e2d;font-size:12px;margin:10px 0 0}.access-panel.unlocked label,.access-panel.unlocked input,.access-panel.unlocked small{display:none}.access-panel.unlocked .access-row .button{width:100%}.button{display:inline-flex;justify-content:center;align-items:center;gap:10px;padding:13px 22px;min-height:52px;border:1px solid transparent;text-decoration:none;font-size:15px;font-weight:700;letter-spacing:.1em;transition:background .2s,transform .2s}.button:hover{transform:translateY(-2px)}.button-primary{background:var(--pine);color:#fffaf0}.button-primary:hover{background:var(--pine-dark)}.button-outline{background:transparent;border-color:var(--pine);color:var(--pine)}.text-link{display:inline-flex;gap:8px;align-items:center;background:none;border:0;border-bottom:1px solid currentColor;color:var(--pine);padding:5px 0;text-decoration:none;font-size:13px;letter-spacing:.04em;margin-top:14px}
.intro-gallery{position:relative;padding:23px;background:var(--paper);border:1px solid #aebfae;box-shadow:0 20px 44px rgba(31,62,46,.1)}.intro-gallery:before{content:"";position:absolute;inset:11px;border:1px solid #d4dacb;pointer-events:none}.gallery-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:12px;color:var(--pine);letter-spacing:.12em;margin:2px 0 17px}.gallery-heading b{font-size:11px;color:var(--red);font-weight:400}.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.gallery-person{position:relative;min-width:0;overflow:hidden;background:#dee6d9}.gallery-person .portrait-stage{width:100%;aspect-ratio:266/180}.gallery-person>span{position:absolute;bottom:0;left:0;right:0;padding:20px 8px 7px;background:linear-gradient(transparent,rgba(16,37,25,.76));color:#fffaf2;text-align:center;font-size:13px;letter-spacing:.15em}.gallery-caption{margin:17px 0 2px;text-align:center;font-size:12px;color:var(--muted);letter-spacing:.14em}.portrait-stage{position:relative;overflow:hidden;isolation:isolate;background:#77927e;aspect-ratio:266/180}.portrait-stage img{position:absolute;max-width:none;height:auto;display:block}.portrait-stage .portrait-glyph{position:absolute;inset:0;display:grid;place-items:center;color:#f9f3e4;font-size:68px}
.setup-view,.quiz-view{width:min(100%,800px);margin:0 auto;padding:46px 0 70px;min-height:calc(100vh - 165px)}.section-top,.quiz-top,.result-topline{display:flex;justify-content:space-between;align-items:center;gap:12px}.plain-back{border:0;background:none;color:var(--pine);font-size:12px;letter-spacing:.1em;padding:8px 0}.section-heading{text-align:center;padding:65px 20px 32px}.section-heading>span{color:var(--gold);font-size:44px}.section-heading h2{font-size:clamp(28px,3.4vw,40px);font-weight:600;line-height:1.5;margin:8px 0}.section-heading p{font-size:14px;color:var(--muted)}.mode-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.mode-card{position:relative;min-width:0;min-height:195px;display:flex;flex-direction:column;align-items:flex-start;gap:13px;text-align:left;background:var(--paper);border:1px solid var(--line);padding:22px;color:var(--ink)}.mode-card.selected{border:2px solid var(--pine);padding:21px;background:#f6f8ef}.mode-icon{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--gold);border-radius:50%;color:var(--red);font-size:19px}.mode-copy{min-width:0}.mode-copy strong,.mode-copy small{display:block}.mode-copy strong{font-size:19px}.mode-copy small{font-size:12px;line-height:1.7;color:var(--muted);margin-top:8px}.mode-check{position:absolute;right:16px;top:18px;color:var(--pine);opacity:0}.mode-card.selected .mode-check{opacity:1}.setup-start{width:100%;margin-top:18px}
.quiz-top{margin-bottom:16px}.quiz-top>span{font:15px Georgia,serif;color:var(--pine)}.progress-track{height:4px;background:#cbd4c7}.progress-track span{display:block;height:100%;width:0;background:var(--pine);transition:width .25s}.quiz-paper{position:relative;margin-top:24px;padding:42px 55px 38px;background:var(--paper);border:1px solid #c1cfbe;box-shadow:0 15px 38px rgba(44,72,53,.07)}.quiz-paper:before{content:"";position:absolute;inset:12px;border:1px solid #e2e4d8;pointer-events:none}.chapter-label{font-size:12px;letter-spacing:.19em;color:var(--red);margin:0}.question-ornament{font-size:29px;color:#91a58e;margin:19px 0 4px}.quiz-paper h2{font-size:clamp(26px,3vw,38px);line-height:1.6;font-weight:600;margin:0;min-height:110px}.question-hint{font-size:12px;color:var(--muted);margin:12px 0 24px}.answers{display:grid;gap:0;border-top:1px solid var(--line)}.answer{display:flex;align-items:center;gap:17px;min-height:75px;width:100%;text-align:left;background:transparent;border:0;border-bottom:1px solid var(--line);color:var(--ink);padding:14px 6px}.answer:hover,.answer.selected{background:#e9efe6}.answer-letter{width:32px;height:32px;flex:0 0 32px;border:1px solid #b8c5b4;border-radius:50%;display:grid;place-items:center;color:var(--pine);font:14px Georgia,serif}.answer.selected .answer-letter{background:var(--pine);color:white}.answer-text{font-size:15px;line-height:1.7}.auto-next-note{text-align:center;color:var(--muted);font-size:12px;margin:18px 0 0}
.result-view{width:min(100%,850px);margin:auto;padding:34px 0 55px}.result-topline{margin-bottom:17px;color:var(--pine);font-size:13px;letter-spacing:.14em}.result-hero{display:grid;grid-template-columns:minmax(0,44%) 1fr;align-items:stretch;min-height:330px;background:var(--pine);color:#fffaf0;border:10px solid var(--paper)}.result-photo{width:100%;height:auto;aspect-ratio:266/180;min-height:0;background:#607763;align-self:center}.result-photo .portrait-glyph{font-size:125px}.result-identity{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:38px 38px 38px 45px;position:relative}.result-identity:before{content:"";position:absolute;inset:16px;border:1px solid rgba(244,236,211,.27);pointer-events:none}.result-kicker{font-size:13px;letter-spacing:.2em;color:#d9dfd0}.result-identity h2{font-size:clamp(38px,5vw,60px);font-weight:600;letter-spacing:.12em;margin:14px 0 5px}.result-epithet{font-size:15px;letter-spacing:.1em;color:#eee3c6}.match-chip{display:flex;gap:12px;align-items:baseline;margin-top:25px;border-top:1px solid #8ba394;padding-top:13px;font-size:12px}.match-chip strong{font:28px Georgia,serif;color:#f3d5a4}.result-body{padding:18px 0 0}.paper-card{position:relative;background:var(--paper);border:1px solid var(--line);margin-bottom:13px;padding:28px 34px}.card-heading{display:flex;align-items:center;gap:12px;margin-bottom:17px}.card-heading span{width:28px;height:28px;border:1px solid var(--red);display:grid;place-items:center;color:var(--red);font-size:13px}.card-heading h3{margin:0;font-size:22px;letter-spacing:.1em;font-weight:600}.paper-card>p,.insight-block p,.relationship-grid p{font-size:14px;color:#4a5c4e;line-height:2;margin:0}.trait-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.trait-chips span{background:#e6ede2;color:var(--pine);padding:6px 11px;font-size:12px}.result-reason{border-top:1px solid var(--line);padding-top:15px;margin-top:18px!important}.card-sub{font-size:12px!important;color:var(--muted)!important;margin:-5px 0 20px!important}.trait-bars{display:grid;grid-template-columns:1fr 1fr;gap:16px 28px}.trait-row{display:grid;grid-template-columns:40px 1fr 31px;gap:9px;align-items:center;color:var(--muted);font-size:12px}.bar-track{height:5px;background:#dfe6d9}.bar-track i{display:block;height:100%;background:var(--pine)}.trait-row b{text-align:right;color:var(--pine);font:12px Georgia,serif}.insight-block+ .insight-block{border-top:1px solid var(--line);margin-top:18px;padding-top:16px}.insight-block b,.relationship-grid b{display:block;color:var(--red);font-size:13px;letter-spacing:.1em;margin-bottom:5px}.relationship-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.relationship-grid>div{border-left:2px solid #b7c7ae;padding-left:15px}.letter-card{background:#f5f1e3}.other-match{padding:10px 5px 24px;color:var(--muted);font-size:13px;line-height:1.8}.other-match strong{color:var(--pine)}.result-actions{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:10px}.disclaimer{text-align:center;color:var(--muted);font-size:11px;margin-top:24px}
dialog{border:0;padding:0;box-shadow:0 24px 68px rgba(18,39,27,.25)}dialog::backdrop{background:rgba(20,38,30,.65)}.info-dialog{width:min(92vw,490px);background:var(--paper);color:var(--ink);border:1px solid var(--line)}.dialog-inner{padding:32px;position:relative}.dialog-close{position:absolute;right:12px;top:5px;border:0;background:none;color:var(--pine);font-size:27px}.dialog-inner h2{font-size:26px;line-height:1.5}.dialog-inner p{font-size:14px;line-height:1.9;color:var(--muted)}.dialog-inner .button{width:100%}.image-dialog{width:min(94vw,750px);max-height:95vh;background:var(--paper);overflow:auto}.image-dialog-inner{padding:18px;position:relative;text-align:center}.image-dialog h2{margin:7px 0;font-size:21px}.image-dialog p{font-size:12px;color:var(--muted)}.image-dialog img{display:block;width:100%;height:auto;margin:14px auto;border:1px solid var(--line)}.image-dialog .button{width:100%}
@media(max-width:900px){.site-shell{padding:0 22px}.intro-view{gap:4%}.intro-copy h1{font-size:clamp(42px,5vw,62px)}.intro-gallery{padding:18px}.gallery-grid{gap:7px}.result-actions{grid-template-columns:1fr 1fr}.result-actions .button-primary{grid-column:1/-1}}
@media(max-width:700px){.site-shell{padding:0 16px}.site-header{height:66px}.brand{font-size:14px}.brand-mark{width:34px;height:34px;font-size:11px}.brand-copy small{font-size:8px}.header-note{display:none}.header-archive{margin-left:auto;font-size:11px}.intro-view{display:flex;flex-direction:column;align-items:stretch;min-height:0;gap:26px;padding:27px 0 37px}.intro-copy{padding:0}.eyebrow{font-size:10px}.intro-flower{font-size:34px;margin:12px 0}.intro-copy h1{font-size:clamp(38px,10vw,55px);margin-bottom:12px}.lead{font-size:14px;line-height:1.85;margin-bottom:16px}.quick-facts{font-size:11px;margin-bottom:18px}.quick-facts span{padding:0 9px}.access-panel{padding:13px}.access-row{display:grid}.access-row .button,.access-row input{width:100%}.intro-gallery{padding:15px}.gallery-heading{font-size:10px}.gallery-grid{gap:7px}.gallery-person>span{font-size:11px}.gallery-caption{font-size:10px}.site-footer{min-height:85px;flex-wrap:wrap;justify-content:center;gap:7px 15px;padding:14px 0;text-align:center;font-size:10px}.setup-view,.quiz-view{padding:24px 0 40px;min-height:calc(100vh - 145px)}.section-heading{padding:36px 5px 20px}.section-heading h2{font-size:27px}.mode-list{grid-template-columns:1fr;gap:9px}.mode-card,.mode-card.selected{min-height:0;flex-direction:row;align-items:center;gap:12px;padding:14px}.mode-icon{flex:0 0 40px;width:40px;height:40px}.mode-copy strong{font-size:16px}.mode-copy small{font-size:11px;margin-top:3px}.mode-check{position:static;margin-left:auto}.quiz-paper{padding:26px 19px 24px}.quiz-paper:before{inset:6px}.quiz-paper h2{font-size:25px;min-height:0}.chapter-label{font-size:11px}.question-ornament{margin:10px 0}.answer{min-height:65px;gap:10px}.answer-text{font-size:14px}.result-view{padding:20px 0 35px}.result-hero{display:block;border-width:6px}.result-photo{height:auto;min-height:0;aspect-ratio:266/180}.result-identity{padding:22px 28px 25px}.result-identity:before{inset:9px}.result-identity h2{font-size:42px}.result-kicker{font-size:11px}.result-epithet{font-size:13px}.match-chip{margin-top:10px}.result-body{padding-top:10px}.paper-card{padding:20px;margin-bottom:10px}.card-heading h3{font-size:19px}.trait-bars,.relationship-grid{grid-template-columns:1fr;gap:12px}.result-actions{grid-template-columns:1fr}.result-actions .button-primary{grid-column:auto}.dialog-inner{padding:24px}}
