:root{
  --paper:#f5efdf;--paper-2:#fbf7ed;--ink:#201b17;--muted:#746b61;--red:#a93f32;--red-dark:#792a23;
  --gold:#b88a45;--line:rgba(61,46,34,.16);--shadow:0 22px 70px rgba(58,41,25,.12);--radius:26px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-height:100vh;background:var(--paper);color:var(--ink);font-family:"Noto Serif SC","Songti SC","STSong","Microsoft YaHei",serif}
button,input{font:inherit}
button{color:inherit}
button:focus-visible,input:focus-visible{outline:3px solid rgba(169,63,50,.24);outline-offset:3px}
.paper-noise{position:fixed;inset:0;pointer-events:none;opacity:.35;background-image:radial-gradient(rgba(83,64,42,.15) .55px,transparent .7px);background-size:7px 7px;mix-blend-mode:multiply;z-index:10}
.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}
.is-hidden{display:none!important}
.gate{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% 18%,#fffaf0 0,transparent 35%),linear-gradient(145deg,#eee3cf,#f8f2e6 55%,#e8dcc5)}
.gate-card{position:relative;width:min(440px,100%);padding:46px 30px 32px;text-align:center;background:rgba(255,252,245,.86);border:1px solid var(--line);border-radius:32px;box-shadow:var(--shadow);backdrop-filter:blur(10px)}
.gate-card:before,.gate-card:after{content:"";position:absolute;width:42px;height:42px;border-color:rgba(169,63,50,.34)}
.gate-card:before{left:12px;top:12px;border-left:1px solid;border-top:1px solid}.gate-card:after{right:12px;bottom:12px;border-right:1px solid;border-bottom:1px solid}
.seal{display:grid;place-items:center;background:var(--red);color:#fff6e5;border:2px solid #fff6e5;box-shadow:0 0 0 2px var(--red);font-family:"FangSong","STFangsong",serif;font-weight:800}
.seal-large{width:72px;height:72px;margin:0 auto 24px;border-radius:10px;font-size:34px;transform:rotate(-2deg)}
.kicker{margin:0 0 10px;color:var(--red);font-family:Arial,sans-serif;font-size:11px;font-weight:800;letter-spacing:.22em;text-transform:uppercase}
.gate h1{font-size:30px;margin:0 0 10px}.gate-card>p:not(.kicker):not(.gate-error){color:var(--muted);font-size:14px}
.access-code{display:block;width:100%;margin:26px 0 14px;padding:15px;border:1px solid var(--line);border-radius:14px;background:#fffdf7;color:var(--red-dark);font-size:30px;font-weight:900;letter-spacing:14px;text-align:center}
.button{min-height:52px;border:0;border-radius:16px;padding:13px 20px;font-weight:800;cursor:pointer;transition:transform .18s,box-shadow .18s,background .18s}
.button:hover{transform:translateY(-2px)}.button:disabled{opacity:.35;cursor:not-allowed;transform:none}
.button-primary{background:linear-gradient(135deg,var(--red),var(--red-dark));color:#fffaf0;box-shadow:0 10px 24px rgba(121,42,35,.22)}
.button-ghost{background:rgba(255,253,247,.8);border:1px solid var(--line);color:#55493e}
.gate .button-primary{width:100%}.text-button{margin-top:14px;border:0;background:none;color:var(--muted);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.gate-error{min-height:22px;margin:10px 0 0;color:var(--red);font-size:13px}
.app{width:min(740px,100%);margin:0 auto;min-height:100vh;padding:0 16px 70px}
.topbar{position:sticky;top:0;z-index:8;display:flex;align-items:center;justify-content:space-between;padding:14px 0;background:linear-gradient(var(--paper) 75%,transparent)}
.brand{display:flex;align-items:center;gap:9px;border:0;background:none;padding:0;font-weight:900;cursor:pointer}.mini-seal{display:grid;place-items:center;width:32px;height:32px;border-radius:7px;background:var(--red);color:#fff7e8}.archive-count{font-size:12px;color:var(--muted)}
.screen{padding:28px 0 10px}.hero-screen{text-align:center}.hero-orbit{position:relative;width:112px;height:112px;margin:14px auto 26px;border:1px solid rgba(169,63,50,.28);border-radius:50%;display:grid;place-items:center}
.hero-orbit:before,.hero-orbit:after{content:"";position:absolute;inset:14px;border:1px dashed rgba(184,138,69,.38);border-radius:50%}.hero-orbit:after{inset:34px;background:var(--red);border:0;box-shadow:0 0 0 4px var(--paper),0 0 0 5px rgba(169,63,50,.3)}
.hero-orbit span{position:absolute;width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#fffaf0;border:1px solid var(--line);color:var(--red);font-weight:900}.hero-orbit span:nth-child(1){z-index:1;color:#fffaf0;background:transparent;border:0;font-size:24px}.hero-orbit span:nth-child(2){left:-8px;top:40px}.hero-orbit span:nth-child(3){right:-8px;top:40px}
.hero-screen h1{margin:0;font-size:clamp(38px,9vw,64px);line-height:1.16;letter-spacing:-.03em}.hero-screen h1 em{color:var(--red);font-style:normal}
.hero-copy{max-width:560px;margin:18px auto 26px;color:#60564d;line-height:1.9;font-size:15px}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0 auto 24px}.facts div{padding:14px 6px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.facts strong{display:block;color:var(--red);font-size:22px}.facts span{font-size:11px;color:var(--muted)}
.hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;text-align:left}.menu-card{position:relative;display:flex;align-items:center;gap:12px;min-height:112px;padding:17px;border:1px solid var(--line);border-radius:20px;background:rgba(255,252,244,.72);cursor:pointer;box-shadow:0 8px 30px rgba(61,46,34,.05);transition:.18s}.menu-card:hover{transform:translateY(-3px);border-color:rgba(169,63,50,.38);box-shadow:0 12px 34px rgba(61,46,34,.1)}.menu-card-main{background:linear-gradient(135deg,#3c3028,#211b17);color:#fff9ed;border:0}.menu-icon{flex:0 0 40px;width:40px;height:40px;display:grid;place-items:center;border-radius:11px;background:rgba(169,63,50,.1);color:var(--red);font-weight:900}.menu-card-main .menu-icon{background:var(--red);color:#fff}.menu-card>span:nth-child(2){flex:1}.menu-card strong,.menu-card small{display:block}.menu-card strong{font-size:15px}.menu-card small{margin-top:5px;color:var(--muted);font-size:10px;line-height:1.5}.menu-card-main small{color:#cfc4b7}.menu-card b{font-size:18px;color:var(--gold)}
.disclaimer{margin:24px auto 0;color:#8b8177;font-size:11px;line-height:1.7}
.step-head{display:flex;justify-content:space-between;color:var(--red);font-size:12px;font-weight:800;letter-spacing:.12em}.screen>h2{font-size:32px;line-height:1.35;margin:22px 0 8px}.screen-copy{color:var(--muted);line-height:1.8;margin:0 0 24px}
.preference-grid{display:grid;gap:12px}.preference{display:grid;grid-template-columns:52px 1fr;gap:2px 14px;text-align:left;padding:18px;border-radius:20px;border:1px solid var(--line);background:rgba(255,252,244,.72);cursor:pointer}.preference>span{grid-row:1/3;display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:#eee3d2;color:var(--red);font-size:20px;font-weight:900}.preference strong{align-self:end}.preference small{color:var(--muted)}.preference.selected{border-color:var(--red);box-shadow:0 0 0 3px rgba(169,63,50,.08);background:#fffaf0}.preference.selected>span{background:var(--red);color:#fff}
.notice-card{margin:20px 0;padding:17px 18px;background:#eee3d2;border-left:4px solid var(--gold);border-radius:13px}.notice-card b{color:var(--red)}.notice-card p{margin:6px 0 0;color:#655b51;line-height:1.7;font-size:13px}
.sticky-actions{position:sticky;bottom:12px;display:grid;grid-template-columns:1fr 2fr;gap:10px;padding:12px;background:rgba(245,239,223,.9);border:1px solid var(--line);border-radius:20px;backdrop-filter:blur(12px);z-index:5}
.quiz-progress{position:sticky;top:58px;z-index:6;padding:12px 0 18px;background:linear-gradient(var(--paper) 75%,transparent)}.progress-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:12px}.progress-meta b{color:var(--red);font-size:16px}.progress-track{height:6px;margin-top:9px;background:#ded3c0;border-radius:99px;overflow:hidden}.progress-track i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--gold),var(--red));transition:width .3s}
.question-card{position:relative;min-height:580px;padding:32px 24px;background:rgba(255,252,244,.76);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.question-card:after{content:"";position:absolute;width:170px;height:170px;right:-100px;top:-100px;border:1px solid rgba(169,63,50,.18);border-radius:50%;box-shadow:0 0 0 25px rgba(169,63,50,.025)}.scene-number{font-size:50px;color:rgba(169,63,50,.14);font-weight:900;line-height:1}.scene-label{color:var(--red);font-size:12px;font-weight:800;letter-spacing:.12em}.question-card h2{font-size:24px;line-height:1.55;margin:10px 0 24px}.answers{display:grid;gap:11px}.answer{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:12px;width:100%;padding:15px;border:1px solid var(--line);border-radius:15px;background:#fffdf7;text-align:left;cursor:pointer;transition:.16s}.answer:hover{transform:translateX(3px);border-color:rgba(169,63,50,.5)}.answer.selected{border-color:var(--red);background:#f8eee4;box-shadow:0 0 0 3px rgba(169,63,50,.08)}.answer-letter{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#eee5d6;color:var(--red);font-weight:900}.answer.selected .answer-letter{background:var(--red);color:#fff}.answer small{display:block;margin-top:4px;color:var(--muted);font-size:11px}
.quiz-nav{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin-top:14px}.quiz-nav span{text-align:center;color:var(--muted);font-size:11px}
.result-screen{padding-top:18px}.result-hero{position:relative;text-align:center;padding:38px 24px 30px;background:rgba(255,252,247,.92);color:var(--ink);border:1px solid var(--line);border-radius:30px;overflow:hidden;box-shadow:var(--shadow)}.result-hero:before{content:"";position:absolute;inset:14px;border:1px solid rgba(169,63,50,.1);border-radius:22px;pointer-events:none}.result-heading{position:relative;margin:0 0 16px;color:var(--red);font-size:18px;font-weight:900;letter-spacing:.05em}.result-icon{position:relative;font-size:45px;line-height:1}.result-hero h1{position:relative;margin:8px 0 7px;font-size:48px;letter-spacing:.06em}.result-meta{color:var(--muted);font-size:14px}.match-score{position:relative;display:flex;justify-content:center;align-items:center;margin:16px 0 14px;color:var(--red)}.match-score>strong{font-family:Arial,sans-serif;font-size:84px;line-height:.9}.match-score>span{font-size:26px;text-align:left}.match-score small{display:block;color:var(--muted);font-size:10px}.tag-row{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:16px}.tag-row span{padding:7px 14px;border:1px solid rgba(169,63,50,.2);border-radius:99px;background:#f4e9df;color:var(--red-dark);font-size:12px;font-weight:800}.dominant-chip{display:inline-block;margin:14px 0 0;padding:8px 15px;border-radius:99px;background:#eee0d2;color:var(--red-dark);font-size:13px;font-weight:900}.voice-box{position:relative;max-width:540px;margin:22px auto 0;padding:18px;border-radius:16px;background:#f1e8da;text-align:left}.voice-box strong{display:block;margin-bottom:10px;color:var(--red-dark);font-size:15px;font-weight:900}.result-hero .voice-box blockquote{margin:0;padding:0;background:transparent;color:#5c5249;line-height:1.85;font-size:15px;text-align:left}
.result-card{position:relative;margin-top:14px;padding:25px;background:rgba(255,252,244,.86);border:1px solid var(--line);border-radius:22px}.section-index{display:inline;color:var(--red-dark);font-family:Arial,sans-serif;font-size:23px;font-weight:900;letter-spacing:.02em}.section-index:after{content:" · "}.result-card h2{display:inline;margin:0;font-size:23px}.result-card>p:not(.section-intro):not(.letter){margin:18px 0 0;color:#5c5249;line-height:2;font-size:15px}.section-intro{margin:12px 0 0;color:var(--muted);font-size:12px;line-height:1.7}
.trait-chart{display:grid;gap:11px}.trait-row{display:grid;grid-template-columns:52px 1fr 30px;align-items:center;gap:10px;color:#5f554b;font-size:12px}.trait-bar{height:7px;background:#e4dac9;border-radius:99px;overflow:hidden}.trait-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--red));border-radius:99px}.trait-row b{color:var(--red)}
.insight-grid{display:grid;grid-template-columns:1fr;gap:12px;margin-top:20px}.insight{padding:20px;background:#f5eee5;border:1px solid var(--line);border-radius:16px}.insight strong{display:block;margin:0 0 12px;color:var(--red-dark);font-size:18px}.insight p{margin:0;color:#62584f;font-size:14px;line-height:1.95}
.runner-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.runner{padding:18px;background:#f5eee5;border:1px solid var(--line);border-radius:16px}.runner-rank{color:var(--red);font-size:11px}.runner h3{margin:6px 0;font-size:22px}.runner .runner-meta{margin:0;color:var(--muted);font-size:12px}.runner .runner-analysis{margin:12px 0 0;color:#62584f;font-size:13px;line-height:1.85}.runner strong{display:block;margin-top:12px;color:var(--red)}
.analysis-stack,.line-stack{display:grid;gap:12px;margin-top:20px}.analysis-note,.character-line{padding:20px;background:#f5eee5;border:1px solid var(--line);border-radius:16px}.analysis-note h3{margin:0 0 12px;color:var(--red-dark);font-size:18px}.analysis-note p,.character-line{margin:0;color:#62584f;font-size:14px;line-height:1.95}.character-line{font-size:16px}.letter{margin:20px 0 0;padding:20px;background:#f2e9da;border-left:4px solid var(--red);border-radius:12px;color:#574c42;line-height:2}.result-actions{display:grid;grid-template-columns:2fr 1fr;gap:10px;margin-top:16px}
.dialog{width:min(620px,calc(100% - 28px));max-height:min(82vh,760px);padding:28px;border:1px solid var(--line);border-radius:26px;background:#fbf7ed;color:var(--ink);box-shadow:0 30px 100px rgba(29,25,21,.35)}.dialog::backdrop{background:rgba(29,25,21,.64);backdrop-filter:blur(3px)}.dialog-close{position:sticky;float:right;top:0;width:40px;height:40px;border:0;border-radius:50%;background:#eee3d2;color:var(--red);font-size:22px;cursor:pointer;z-index:2}.dialog h2{font-size:28px;margin:8px 0 12px}.dialog-copy{color:var(--muted);line-height:1.7;font-size:13px}.method-list{display:grid;gap:10px;margin-top:20px}.method-list>div{display:flex;align-items:center;gap:14px;padding:15px;background:#f1e8d9;border-radius:14px}.method-list b{color:var(--red)}.method-list span,.method-list strong,.method-list small{display:block}.method-list small{margin-top:5px;color:var(--muted);line-height:1.5}.dialog-wide{width:min(760px,calc(100% - 28px))}
.search-box{display:flex;align-items:center;gap:8px;padding:11px 14px;background:#fffdf7;border:1px solid var(--line);border-radius:13px}.search-box input{width:100%;border:0;outline:0;background:transparent}.library-filter{display:flex;gap:6px;overflow:auto;margin:12px 0}.library-filter button{white-space:nowrap;border:1px solid var(--line);border-radius:99px;background:#fffdf7;padding:7px 12px;cursor:pointer;font-size:11px}.library-filter button.active{background:var(--red);color:#fff;border-color:var(--red)}.library-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.library-person{padding:13px;background:#f1e8d9;border-radius:12px}.library-person strong{display:block}.library-person span{display:block;margin-top:4px;color:var(--muted);font-size:10px}.legend-badge{display:inline-block!important;width:max-content;margin-top:6px!important;padding:3px 6px;border-radius:5px;background:#e5d3b5;color:var(--red)!important}.about-list{padding-left:22px;color:#5f554b;line-height:1.9}
.toast{position:fixed;left:50%;bottom:26px;z-index:30;max-width:calc(100% - 28px);padding:11px 16px;border-radius:99px;background:#211b17;color:#fff8ea;opacity:0;transform:translate(-50%,16px);pointer-events:none;transition:.2s;font-size:12px}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:560px){.app{padding-left:12px;padding-right:12px}.hero-actions{grid-template-columns:1fr 1fr;gap:9px}.menu-card{min-height:142px;padding:14px;flex-direction:column;align-items:flex-start}.menu-card>span:nth-child(2){flex:0}.menu-card b{position:absolute;right:13px;top:14px}.menu-card strong{font-size:14px}.menu-card small{font-size:9px}.question-card{min-height:620px;padding:25px 17px}.question-card h2{font-size:21px}.runner-grid{grid-template-columns:1fr}.result-actions{grid-template-columns:1fr}.library-grid{grid-template-columns:1fr}.dialog{padding:22px 18px}.result-hero h1{font-size:42px}.screen>h2{font-size:28px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}