

:root{font-family:system-ui,-apple-system,"Microsoft YaHei",sans-serif;color:#493c34;background:#faf5ec;line-height:1.7;font-size:16px;--purple:#75647d;--line:#d9cfc1;--apricot:#ebc8a9}*{box-sizing:border-box}body{margin:0}button,select{font:inherit;color:inherit}button,a,summary,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;min-height:44px;border:1px solid var(--line);background:transparent;border-radius:5px;padding:9px 18px;line-height:1.5}button:hover{background:#f0e8dc}button:disabled{opacity:.45;cursor:default}:focus-visible{outline:3px solid #75647d;outline-offset:3px}h1:focus,h2:focus{outline:none}a{color:inherit;text-decoration:none}header{max-width:1024px;padding:20px 30px;margin:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:10px}header a{font-size:14px;letter-spacing:1.5px}.text{border:0;font-size:13px;color:#6c5d53;padding:4px 6px;min-height:36px}.primary{background:var(--purple);color:#fff;border-color:var(--purple)}.primary:hover{background:#63526c}.primary span{margin-left:18px}main{max-width:680px;margin:30px auto 0;padding:0 28px}h1,h2,h3{font-family:Georgia,"Songti SC","SimSun",serif;font-weight:400;line-height:1.5}h1{font-size:36px;margin:20px 0 16px}h2{font-size:24px;margin:4px 0 18px}h3{font-size:17px;margin:0 0 8px}p{margin:0 0 14px}.eyebrow,.side-note{font-size:12px;color:#756456}.eyebrow{letter-spacing:2px;margin:0 0 10px}.side-note{margin:9px 0}.scene{display:block;width:100%;height:190px;object-fit:contain;animation:appear .25s ease-out}.hero-scene{height:auto;max-height:280px}.welcome{text-align:center;max-width:620px;margin:auto}.welcome .scene{margin:0 0 20px}.welcome h1{font-size:clamp(27px,4.7vw,38px)}.intro{font-size:15px;margin:0 auto 24px;max-width:350px}.welcome .primary{min-width:230px}.qhead{display:flex;justify-content:space-between;font-size:12px;color:#6e5e70}.progress{height:2px;background:#e6ddd1;margin:9px 0 7px}.progress span{display:block;height:100%;background:var(--purple)}.question-note{font-size:12px}.options{display:grid;gap:9px}.option{display:flex;text-align:left;align-items:center;gap:12px;min-height:48px;background:#fffaf2;padding:10px 14px;border-color:#d9cfc1}.option-index{font-size:12px;color:#77617d}.option>span:nth-child(2){flex:1}.check{width:15px;color:#67546e}.option[aria-pressed=true]{background:#eee7ef;border-color:#89758e}.skip-row{text-align:right;margin-top:4px}.nav{display:flex;justify-content:space-between;gap:12px;margin:12px 0 20px}.nav button{min-width:106px}.result .scene{max-height:230px;margin-bottom:15px}.result-title{font-size:30px;margin:6px 0 14px}.reading{font-size:16px;line-height:1.9}.more{margin-bottom:24px}.more summary{font-size:13px;color:#735e7c}.more p{margin:12px 0}.scores{padding-top:18px;border-top:1px solid var(--line);margin-top:20px}.dimension{margin:14px 0 17px}.dimension-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.dimension-top details{flex:1}.dimension summary{font-size:14px;list-style:none;min-height:28px;width:100%;cursor:pointer}.dimension summary::-webkit-details-marker{display:none}.hint{font-size:12px;margin-left:9px;color:#86718e}.dimension details[open] .hint{display:none}.dimension details p{font-size:13px;color:#66574c;padding:6px 0 0;margin:0;max-width:340px}.score{font-size:14px;white-space:nowrap;font-variant-numeric:tabular-nums}.score small{color:#75675c;font-size:11px}.scale{height:5px;background:repeating-linear-gradient(90deg,#e6ddd1 0,#e6ddd1 calc(10% - 2px),transparent calc(10% - 2px),transparent 10%);margin-top:4px}.scale i{display:block;height:100%;background:#9a86a3}.unscored{height:2px;margin-top:4px;border-top:1px dashed #cbbcae}.try{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;margin:25px 0}.try h3:before{content:'';display:inline-block;width:18px;height:4px;background:var(--apricot);margin:0 10px 4px 0}.try p{font-size:15px;margin:0}.feedback-section>p:first-child{font-size:14px}.feedback{display:flex;gap:10px}.feedback button{flex:1;font-size:14px}.feedback button[aria-pressed=true]{border-color:var(--purple);background:#ede5ee}.status{font-size:13px;color:#6d5876;min-height:10px;margin:10px 0}.basis{border-top:1px solid var(--line);padding:16px 0;margin-top:24px;font-size:13px}.basis p{margin:12px 0}.basis li{margin-bottom:9px}.basis summary{min-height:32px}summary{cursor:pointer}select{display:block;width:100%;border:1px solid #b5a5ba;border-radius:4px;background:#fffaf3;min-height:46px;padding:8px;margin:8px 0;white-space:normal;font-size:14px}label{font-size:14px}#alternative-region{border-left:2px solid var(--apricot);padding-left:14px;margin-top:16px}.alternate-label{font-size:12px;color:#755b7e}footer{max-width:680px;margin:35px auto 20px;padding:0 28px;color:#76665a;font-size:11px;line-height:1.8}footer p{margin:4px 0}h1,h2,p,button,summary{overflow-wrap:anywhere}button{transition:background-color .15s ease}@keyframes appear{from{opacity:.6;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:520px){header{padding:10px 20px;min-height:56px}main{padding:0 20px;margin-top:16px}.scene{height:155px}.hero-scene{height:auto;max-height:240px}.welcome{padding-top:9px}.welcome h1{font-size:27px}.intro{font-size:14px;max-width:290px}.welcome .scene{margin-bottom:13px}.qhead{font-size:12px}h2{font-size:21px;line-height:1.45;margin:4px 0 13px}.options{gap:7px}.option{font-size:15px;min-height:45px;padding:9px 11px;gap:9px}.question-note{margin:4px 0}.nav{margin-top:6px}.result-title{font-size:27px}.result .scene{max-height:190px}.reading{font-size:15px}.score{font-size:12px}.score small{font-size:10px}.dimension{margin:13px 0}.dimension details p{font-size:12px}footer{padding:0 20px;margin-top:28px}.eyebrow{font-size:11px}.feedback button{padding:9px 10px}}@media(max-width:520px) and (max-height:740px){body[data-page=quiz] main{margin-top:8px}.quiz .scene{height:113px}.quiz h2{font-size:19px;margin-bottom:10px}.quiz .option{min-height:43px;padding:8px 10px}.quiz .options{gap:6px}.quiz .text{min-height:30px}.quiz .nav button{min-height:42px}.quiz .nav{margin-bottom:8px}.quiz .question-note{font-size:11px}}
dialog{max-width:calc(100% - 40px);width:360px;border:1px solid #b9a995;background:#faf5ec;color:#493c34;padding:24px;border-radius:5px}dialog::backdrop{background:rgba(55,44,35,.3)}dialog h2{font-size:22px}dialog p{font-size:14px}dialog .nav{margin-bottom:0}
@media(max-width:520px) and (max-height:620px){.quiz .scene{height:86px}}
.choice-habit{margin:22px 0 26px;border-left:2px solid #d5b596;padding-left:16px}.choice-habit h3{font-size:16px}.choice-habit p{font-size:14px;line-height:1.9;margin:0}.dimension-name{font-size:15px}.dimension-reading{font-size:13px;line-height:1.85;color:#66564a;margin:10px 0 0}.dimension{margin-bottom:23px}.gentle-scene{margin:30px 0;padding:23px 0;border-top:1px solid #d9cfc1;border-bottom:1px solid #d9cfc1}.gentle-scene h3{font-size:21px;margin-bottom:13px}.gentle-scene p:last-child{font-size:15px;line-height:2;margin:0}.gentle-scene .eyebrow{font-size:11px;color:#826c56}
.compact-result .scores{margin-top:16px;padding-top:12px}.scores>.side-note span{float:right;font-size:11px}.score-detail{position:relative;margin:0;padding:10px 0;border-bottom:1px solid #e5dbce}.score-detail>summary{display:flex;align-items:center;gap:12px;min-height:28px;list-style:none}.score-detail>summary::-webkit-details-marker{display:none}.score-detail .score{margin-left:auto}.score-toggle{width:12px;font-size:11px;color:#7d6c83}.score-toggle:before{content:'＋'}.score-detail[open] .score-toggle:before{content:'−'}.score-detail .dimension-reading{margin:7px 0 0;font-size:13px}.dimension-meaning{font-size:11px;line-height:1.6;color:#76675c;margin:5px 0 2px}.score-detail:not([open])>.scale,.score-detail:not([open])>.unscored{display:block;position:absolute;bottom:0;left:0;width:100%;height:2px;opacity:.65}.score-detail .scale{margin-top:4px}.small-step{display:flex;align-items:center;gap:16px;border-top:1px solid #d9cfc1;padding:20px 0 4px;margin-top:25px}.result .small-step .scene{width:135px;height:100px;flex-shrink:0;margin:0}.small-step h3{font-size:19px;margin:0 0 8px}.small-step p{font-size:14px;line-height:1.85;margin:0}.compact-result .more{margin-bottom:18px}.compact-result .result-title{font-size:29px}.compact-result .reading{line-height:1.85}@media(max-width:520px){.small-step{gap:8px;align-items:flex-start}.result .small-step .scene{width:95px;height:90px}.small-step h3{font-size:18px}.small-step p{font-size:13px}.compact-result .result-title{font-size:26px}.score-detail .score{font-size:12px}.scores>.side-note span{float:none;display:block;margin-top:3px}.compact-result .result>.scene{height:170px}}
.insight-layer{margin:17px 0}.insight-layer h3,.optional-title{font-family:inherit;font-size:13px;font-weight:500;color:#715e7a;margin:0 0 5px}.insight-layer p,.more>p{font-size:14px;line-height:1.95}.scope-note,.difference-note{border-left:2px solid #d5b596;padding-left:12px}.feedback-section{margin:25px 0;padding-top:20px;border-top:1px solid #d9cfc1}.feedback-section>p{font-size:14px}#mismatch-region{margin-top:14px;padding-left:13px;border-left:2px solid #d5b596}#mismatch-region label{display:block;margin:10px 0 5px}textarea{display:block;width:100%;resize:vertical;min-height:70px;padding:10px;border:1px solid #b5a5ba;background:#fffaf3;font:inherit;color:inherit;border-radius:4px;margin-bottom:10px}.migration{max-width:340px;margin:20px auto 0}.followup .qhead span:first-child{font-size:11px}.quiz .option{font-size:15px}.quiz h2{font-size:22px}.quiz .scene{height:155px}.quiz .options{gap:7px}@media(max-width:520px){.quiz .scene{height:120px}.quiz h2{font-size:20px}.quiz .option{font-size:14px;line-height:1.5;padding:9px 10px}.quiz .options{gap:6px}.result .scene{max-height:180px}}@media(max-width:520px) and (max-height:740px){.quiz .scene{height:85px}.quiz h2{font-size:18px}.quiz .option{font-size:14px;min-height:41px;padding:7px 9px}.quiz .options{gap:5px}.quiz .nav{margin-top:3px}.quiz .question-note{margin:2px 0}}@media(max-width:350px) and (max-height:620px){.quiz .scene{height:65px}.quiz h2{font-size:17px}.quiz .option{font-size:13px;min-height:38px;padding:6px 8px}.quiz .options{gap:4px}.quiz .nav button{min-height:39px}}
