@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;500;600;700&display=swap');
:root{--paper:#f5f1e8;--ink:#173c35;--muted:#72766b;--line:#d5d6c7;--red:#ae4c35;--gold:#b49866}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,"Microsoft YaHei",sans-serif;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='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%236b644b' opacity='.035' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid var(--red);outline-offset:5px}header,footer{max-width:1300px;margin:auto;padding:26px 5%;display:flex;justify-content:space-between;align-items:center}header{border-bottom:1px solid var(--line)}.brand{font-family:"Noto Serif SC",serif;font-size:26px;font-weight:700;letter-spacing:5px;color:inherit;text-decoration:none}.brand span{font-family:sans-serif;font-size:10px;letter-spacing:3px;border-left:1px solid var(--line);margin-left:16px;padding-left:17px;font-weight:400}.text-btn{background:none;border:0;color:var(--muted);font-size:12px;padding:10px}.hero{max-width:1200px;margin:auto;display:grid;grid-template-columns:1fr 1fr;min-height:650px;align-items:center;padding:65px 5%;gap:55px}.eyebrow{font-size:10px;letter-spacing:3px;color:var(--muted);text-transform:uppercase}.pill{display:inline-block;border:1px solid var(--line);padding:8px 12px;font-size:11px;letter-spacing:2px;margin-bottom:26px}h1,h2,h3,.serif{font-family:"Noto Serif SC","Songti SC",SimSun,serif}h1{font-size:clamp(44px,5vw,72px);line-height:1.35;letter-spacing:3px;font-weight:500;margin:12px 0 25px}h1 em{font-style:normal;color:var(--red)}p{line-height:1.95}.intro{color:var(--muted);font-size:14px;max-width:390px}.primary{border:0;background:var(--ink);color:#fff;padding:18px 28px;letter-spacing:2px;display:inline-flex;gap:42px;align-items:center;justify-content:center;transition:background .2s,transform .2s}.primary:hover{background:#28594d;transform:translateY(-2px)}.secondary{background:transparent;border:1px solid var(--line);padding:16px 22px;color:var(--ink)}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.fine{font-size:11px;color:var(--muted);line-height:1.8;margin-top:18px}.landscape{position:relative;height:510px;background:#e6e8da;border-radius:240px 240px 6px 6px;overflow:hidden;border:1px solid #cad1bc;box-shadow:20px 20px 0 #eae6db}.landscape svg{width:100%;height:100%}.vertical{position:absolute;top:56px;right:35px;writing-mode:vertical-rl;letter-spacing:9px;font-family:serif;font-size:17px}.seal{position:absolute;bottom:32px;left:30px;border:1px solid #be674c;color:#ae4c35;padding:7px;font:18px serif;writing-mode:vertical-rl;letter-spacing:4px}.artnote{position:absolute;bottom:30px;right:22px;font-size:9px;letter-spacing:2px;color:#e3e6d4}.features{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);max-width:1100px;margin:0 auto 45px;padding:26px 0;gap:25px}.feature{padding:0 25px;border-right:1px solid var(--line)}.feature:last-child{border:0}.feature small{color:var(--red);font-size:10px;letter-spacing:2px}.feature h3{font-size:18px;font-weight:500;margin:10px 0}.feature p{color:var(--muted);font-size:12px;margin:0}footer{font-size:10px;color:var(--muted);letter-spacing:2px}.quiz{max-width:780px;margin:50px auto 75px;padding:0 25px;min-height:600px}.progress-top{display:flex;justify-content:space-between;font-size:11px;letter-spacing:2px}.progress{height:3px;background:#e0e0d4;margin:17px 0 45px}.progress div{height:100%;background:var(--red);transition:width .4s}.scene{color:var(--red);font-size:12px;letter-spacing:4px}.quiz h2{font-size:clamp(25px,4vw,35px);font-weight:500;line-height:1.65;margin:18px 0}.scene-text{color:var(--muted);font-size:14px;margin-bottom:28px}.options{display:grid;gap:12px}.option{display:flex;align-items:center;text-align:left;gap:19px;padding:20px;background:#faf8f1;border:1px solid var(--line);color:var(--ink);line-height:1.7;transition:.2s}.option:hover{border-color:var(--ink);background:#eaf0e3}.option.selected{border-color:var(--ink);background:#e4eadc;box-shadow:inset 3px 0 var(--ink)}.letter{font:italic 17px Georgia;color:var(--gold);border-right:1px solid var(--line);padding-right:18px}.quiz-nav{display:flex;align-items:center;justify-content:space-between;margin-top:25px}button:disabled{opacity:.4;cursor:not-allowed;transform:none}.result{max-width:1060px;margin:50px auto;padding:0 25px}.result-top{text-align:center}.result-top h2{font-size:24px;font-weight:400}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:35px;margin-top:30px}.result-card{background:var(--ink);color:#eee9d9;padding:40px;position:relative;overflow:hidden}.result-card:after{content:'回響';position:absolute;font:160px serif;right:-20px;bottom:20px;opacity:.035;writing-mode:vertical-rl}.result-card .eyebrow{color:#b4c1ac}.result-card h1{font-size:64px;margin:25px 0 4px}.result-card h3{font-size:20px;color:#cbbb91;font-weight:400}.quote{font-family:serif;font-size:22px;border-top:1px solid #597065;padding-top:25px}.result-card p{font-size:13px;color:#cbd2c1}.tag{display:inline-block;border:1px solid #597065;padding:6px 10px;margin:6px 6px 6px 0;font-size:11px}.panel{padding:4px 0}.panel h3{font-size:21px;font-weight:500}.bar-row{display:grid;grid-template-columns:45px 1fr 28px;gap:15px;font-size:12px;align-items:center;margin:19px 0}.bar{height:6px;background:#dfdfd1}.bar i{display:block;height:100%;background:#678172}.notes{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:25px}.note{padding:25px;border:1px solid var(--line)}.note h3{font-size:18px;margin:0 0 12px}.note p{font-size:13px;color:var(--muted);margin:0}.mini{font-size:13px;color:var(--muted);line-height:1.9}.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;padding:15px 22px;font-size:13px;z-index:5;max-width:90%}dialog{background:var(--paper);color:var(--ink);border:1px solid var(--line);padding:30px;max-width:550px;width:90%}dialog::backdrop{background:#152e2ba8}dialog h2{font-size:25px}dialog p{font-size:13px}dialog>button{float:right}@media(max-width:700px){header{padding:20px}.brand span{font-size:9px;letter-spacing:1px;margin-left:10px;padding-left:10px}.hero{grid-template-columns:1fr;padding:35px 25px;gap:36px;min-height:0}.hero h1{font-size:49px}.landscape{height:300px;max-width:380px;width:100%;margin:0 auto 15px;border-radius:190px 190px 6px 6px}.features{margin:20px;gap:0}.feature{padding:0 12px}.feature h3{font-size:15px}.feature p{font-size:11px}.feature small{font-size:8px;letter-spacing:0}.result-grid,.notes{grid-template-columns:1fr}.result-card{padding:30px}.quiz{margin-top:35px}.option{padding:16px;font-size:14px}footer{padding:25px;letter-spacing:0;font-size:9px}.primary{padding:17px 22px}.vertical{font-size:14px;top:25px}.result-top h2{font-size:21px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.vertical{top:105px;right:42px}@media(max-width:700px){.vertical{top:65px;right:40px;font-size:12px;letter-spacing:5px}}