:root{--page:#f5f2ec;--paper:#fcfaf6;--ink:#3a322d;--sub:#675d53;--muted:#8c8074;--line:#e1d8cd;--accent:#705348;--soft:#eee5db;--sand:#eee5da;--serif:"Songti SC","STSong","Noto Serif CJK SC","SimSun",serif;--sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--page);color:var(--ink);font:14px/1.85 var(--sans);-webkit-font-smoothing:antialiased}button{font:inherit}button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button:disabled{opacity:.43;cursor:not-allowed}::selection{background:#e6d5c6}.site-shell{min-height:100vh;display:flex;flex-direction:column}.site-header,.site-footer{width:min(1160px,calc(100% - 40px));margin:auto;display:flex;align-items:center;justify-content:space-between}.site-header{height:80px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;border:0;background:none;text-align:left;color:var(--ink);cursor:pointer;padding:0}.brand-mark{width:24px;height:24px;border:2px solid var(--accent);position:relative;display:block}.brand-mark:after{content:"";position:absolute;width:11px;height:11px;background:var(--accent);right:-5px;bottom:-5px}.brand strong{display:block;font-family:var(--serif);font-size:15px;line-height:1.25;letter-spacing:.05em}.brand small{display:block;font:9px/1.5 var(--sans);letter-spacing:.14em;color:var(--muted);margin-top:2px}.site-header nav{display:flex;gap:24px}.nav-link{background:none;border:0;color:var(--sub);font-size:12px;cursor:pointer;padding:9px 0}.nav-link:hover,.nav-link.active{color:var(--accent)}#history-count{font-variant-numeric:tabular-nums;color:var(--muted)}main{flex:1}.site-footer{min-height:68px;border-top:1px solid var(--line);font-size:10px;letter-spacing:.03em;color:var(--muted);gap:20px}.eyebrow{font-size:11px;font-weight:650;letter-spacing:.18em;color:var(--accent);line-height:1.5}.serif{font-family:var(--serif)}.text-muted{color:var(--sub)}.text-small{font-size:12px;color:var(--muted)}.primary,.secondary{border:1px solid var(--accent);min-height:48px;padding:11px 19px;cursor:pointer;transition:background .18s,border-color .18s,color .18s}.primary{color:#fff;background:var(--accent)}.primary:hover:not(:disabled){background:#5b4037}.secondary{background:transparent;color:var(--accent)}.secondary:hover{background:var(--soft)}.primary .arrow{margin-left:44px}.plain-button{background:none;border:0;color:var(--sub);cursor:pointer;padding:10px 0}.plain-button:hover{color:var(--ink)}.action-row{display:flex;align-items:center;gap:13px;flex-wrap:wrap}.landing{width:min(1160px,calc(100% - 40px));margin:0 auto;padding:76px 0 92px}.landing-grid{display:grid;grid-template-columns:1fr .85fr;gap:7.5vw;align-items:center}.landing h1{font:600 clamp(34px,4.1vw,56px)/1.35 var(--serif);letter-spacing:.015em;margin:27px 0 22px;max-width:620px}.landing h1 span{color:var(--accent)}.landing .lead{font-size:15px;line-height:2.1;color:var(--sub);max-width:510px;margin:0 0 28px}.landing .intro-note{font-size:12px;color:var(--muted);line-height:1.9;margin-top:19px}.landing .facts{display:flex;gap:22px;flex-wrap:wrap;margin:34px 0 28px}.fact{padding-right:22px;border-right:1px solid var(--line)}.fact:last-child{border:0}.fact strong{display:block;font:500 22px/1.1 var(--serif);color:var(--ink)}.fact span{font-size:11px;color:var(--muted)}.cover-art{height:420px;background:#e8dfd4;position:relative;overflow:hidden;display:grid;grid-template-columns:61% 39%;grid-template-rows:59% 41%;gap:2px;padding:2px}.cover-art .tile{position:relative;padding:22px;display:flex;align-items:end;font:12px/1.6 var(--sans);letter-spacing:.07em}.cover-art .tile:first-child{grid-row:span 2;background:#705348;color:#fffaf3}.cover-art .tile:nth-child(2){background:#baa797;color:#3e3028}.cover-art .tile:nth-child(3){background:#e1d5c8;color:#5a4c41}.cover-art .big-num{position:absolute;font:400 190px/.8 var(--serif);top:34px;left:17px;opacity:.15}.cover-art .vertical{position:absolute;right:28px;top:35px;writing-mode:vertical-rl;letter-spacing:.27em;font-size:10px}.landing-bottom{margin-top:82px;display:grid;grid-template-columns:210px 1fr;gap:52px;border-top:1px solid var(--line);padding-top:29px}.landing-bottom h2{font:600 20px/1.5 var(--serif);margin:0}.landing-bottom p{margin:0;color:var(--sub);line-height:2}.motifs{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);margin-top:26px}.motifs span{background:var(--page);padding:13px 15px;font-size:12px;color:var(--sub)}.quiz-wrap{width:min(760px,calc(100% - 40px));margin:0 auto;padding:49px 0 100px;min-height:calc(100vh - 150px)}.progress-top{display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:11px;color:var(--muted);letter-spacing:.09em}.progress-track{height:3px;background:#e4d9cd;margin-top:17px;overflow:hidden}.progress-track span{display:block;background:var(--accent);height:100%;transition:width .2s}.question-body{padding:64px 0 0;animation:enter .18s ease}.question-no{font:500 54px/1 var(--serif);color:#cbb8a5;letter-spacing:-.06em}.question-body h1{font:600 clamp(23px,3vw,30px)/1.55 var(--serif);margin:13px 0 10px;max-width:690px}.question-hint{margin:0 0 30px;color:var(--muted);font-size:12px}.choices{display:grid;gap:10px}.choice{width:100%;display:grid;grid-template-columns:24px 1fr 17px;gap:14px;align-items:start;background:var(--paper);border:1px solid var(--line);color:var(--ink);text-align:left;cursor:pointer;padding:16px 18px;min-height:68px;transition:background .16s,border-color .16s}.choice:hover{border-color:#bba998}.choice.selected{background:#efe5dc;border-color:var(--accent)}.choice .letter{color:var(--muted);font-size:11px;font-weight:600;padding-top:3px}.choice .radio{border:1px solid #b9a591;border-radius:50%;width:14px;height:14px;margin-top:5px}.choice.selected .radio{border-color:var(--accent);box-shadow:inset 0 0 0 3px #efe5dc;background:var(--accent)}.quiz-nav{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:31px}.quiz-nav .primary{min-width:140px}.quiz-nav .plain-button{min-width:72px;text-align:left}.supplement-intro{background:var(--soft);padding:15px 18px;margin:0 0 26px;color:var(--sub);font-size:12px;line-height:1.9}.result-wrap{width:min(880px,calc(100% - 40px));margin:0 auto;padding:61px 0 100px}.result-top h1{font:600 clamp(28px,3.6vw,39px)/1.5 var(--serif);margin:16px 0 8px}.result-top .subtitle{color:var(--sub);margin:0;line-height:2}.result-composition{margin-top:37px;display:grid;grid-template-rows:206px 160px;gap:3px}.rank-one,.rank-two,.rank-three{position:relative;padding:23px 28px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.rank-one{background:#705348;color:#fffaf4}.rank-lower{display:grid;grid-template-columns:63% 37%;gap:3px}.rank-two{background:#bea996;color:#352923}.rank-three{background:#e8ddd1;color:#40332c}.rank-label{font-size:11px;letter-spacing:.12em}.rank-name{font:600 clamp(25px,3.4vw,39px)/1.3 var(--serif)}.rank-one .rank-name{font-size:clamp(34px,4vw,47px)}.rank-desc{font-size:12px;line-height:1.5;opacity:.85;margin-top:5px}.rank-ghost{position:absolute;right:25px;top:-25px;font:300 190px/1 var(--serif);opacity:.09}.rank-two .rank-ghost,.rank-three .rank-ghost{font-size:140px}.result-summary{background:#eee5dc;padding:25px 30px;margin:31px 0 0}.result-summary p{font:500 16px/2 var(--serif);text-indent:2em;margin:0}.result-actions{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 56px}.result-actions .secondary{font-size:12px;min-height:42px}.report-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:0 0 15px}.report-heading h2{font:600 24px/1.4 var(--serif);margin:8px 0 0}.report-chapter{padding:32px 35px 27px;background:#fcfaf6;margin-top:8px}.report-chapter:nth-of-type(even){background:#f2eae1}.chapter-head{display:flex;align-items:baseline;gap:18px;margin-bottom:20px}.chapter-head span{font:500 13px var(--serif);color:var(--accent)}.chapter-head h3{font:600 21px/1.5 var(--serif);margin:0}.report-chapter p{font-size:14px;color:#51443b;line-height:2.15;text-indent:2em;margin:0 0 15px}.report-chapter p:last-child{margin-bottom:0}.report-end{margin-top:29px;padding:22px 28px;background:#e8ddd0}.report-end strong{font:600 16px var(--serif)}.report-end p{margin:8px 0 0;color:var(--sub);font-size:12px;line-height:1.9}.history-wrap{width:min(880px,calc(100% - 40px));margin:0 auto;padding:62px 0 110px;min-height:calc(100vh - 150px)}.history-wrap h1{font:600 34px/1.45 var(--serif);margin:14px 0 10px}.history-lead{color:var(--sub);margin:0 0 34px}.history-list{display:grid;gap:8px}.history-item{background:#fcfaf6;padding:21px 24px;display:grid;grid-template-columns:130px 1fr auto;gap:24px;align-items:center}.history-date{font-size:12px;color:var(--muted)}.history-title{font:600 19px/1.4 var(--serif)}.history-ranks{font-size:12px;color:var(--sub);margin-top:3px}.history-item .actions{display:flex;gap:14px}.history-item button{background:none;border:0;color:var(--accent);font-size:12px;cursor:pointer;padding:5px}.history-item button.delete{color:#9b5f52}.empty-state{background:#efe6dd;padding:38px;min-height:220px;display:flex;flex-direction:column;align-items:start;justify-content:center}.empty-state h2{font:600 21px var(--serif);margin:0 0 8px}.empty-state p{color:var(--sub);margin:0 0 18px}#toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,15px);background:var(--ink);color:#fff;padding:8px 17px;font-size:12px;opacity:0;pointer-events:none;transition:opacity .18s,transform .18s;z-index:20}#toast.show{opacity:1;transform:translate(-50%,0)}@keyframes enter{from{opacity:.45;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(max-width:700px){.site-header,.site-footer{width:calc(100% - 36px)}.site-header{height:70px}.site-header nav{gap:15px}.brand strong{font-size:14px}.brand small{font-size:8px}.landing,.quiz-wrap,.result-wrap,.history-wrap{width:calc(100% - 40px)}.landing{padding-top:45px}.landing-grid{grid-template-columns:1fr;gap:43px}.landing h1{font-size:36px}.cover-art{height:255px;grid-template-columns:60% 40%}.cover-art .big-num{font-size:125px;top:24px}.landing-bottom{margin-top:54px;grid-template-columns:1fr;gap:16px}.motifs{grid-template-columns:repeat(2,1fr)}.quiz-wrap{padding-top:31px}.question-body{padding-top:52px}.question-no{font-size:45px}.question-body h1{font-size:24px}.result-wrap{padding-top:42px}.result-composition{grid-template-rows:188px auto}.rank-one{padding:20px 23px}.rank-lower{grid-template-columns:58% 42%;min-height:145px}.rank-two,.rank-three{padding:18px 17px}.rank-two .rank-name,.rank-three .rank-name{font-size:23px}.rank-ghost{font-size:140px}.rank-two .rank-ghost,.rank-three .rank-ghost{font-size:95px}.rank-desc{font-size:11px}.result-summary{padding:21px 23px}.result-summary p{font-size:15px}.report-chapter{padding:27px 23px 25px}.report-chapter p{font-size:13px;line-height:2.1}.history-item{grid-template-columns:1fr;gap:8px}.history-item .actions{margin-top:5px}.site-footer{flex-direction:column;align-items:start;justify-content:center;gap:0;padding:14px 0}}
@media(max-width:390px){.site-header nav{gap:11px}.nav-link{font-size:11px}.brand-mark{width:19px;height:19px}.brand{gap:8px}.brand strong{font-size:13px}.landing h1{font-size:32px}.cover-art{height:228px}.rank-lower{grid-template-columns:56% 44%}.rank-two .rank-name,.rank-three .rank-name{font-size:20px}.rank-two,.rank-three{padding:16px 13px}.rank-desc{font-size:10px}.choice{padding:15px 14px;gap:10px;grid-template-columns:20px 1fr 15px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Homepage editorial cover: clear hierarchy at both narrow and wide widths. */
.cover-art{grid-template-columns:60% 40%;grid-template-rows:55% 45%}
.cover-art .tile{display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;padding:24px}
.cover-art .cover-index{font:600 9px/1.3 var(--sans);letter-spacing:.16em;opacity:.78;white-space:nowrap}
.cover-art .big-num{top:56px;left:18px;font-size:178px;opacity:.17;pointer-events:none}
.cover-art .cover-lead,.cover-art .side-copy{position:relative;z-index:1;display:flex;flex-direction:column;align-items:start}
.cover-art .cover-lead strong{font:600 20px/1.4 var(--serif);letter-spacing:.04em}
.cover-art .cover-lead span{font:600 10px/1.5 var(--sans);letter-spacing:.1em;margin-top:7px;white-space:nowrap}
.cover-art .tile-side strong{font:600 15px/1.5 var(--serif);letter-spacing:.02em}
.cover-art .tile-side small{font:11px/1.6 var(--sans);letter-spacing:.03em;opacity:.78;margin-top:8px}
@media(max-width:700px){
 .cover-art{grid-template-columns:59% 41%;grid-template-rows:55% 45%}
 .cover-art .tile{padding:17px}
 .cover-art .big-num{font-size:113px;top:39px;left:12px}
 .cover-art .cover-lead strong{font-size:15px}
 .cover-art .cover-lead span{font-size:7px;letter-spacing:.07em;margin-top:5px}
 .cover-art .cover-index{font-size:7px;letter-spacing:.08em}
 .cover-art .tile-side strong{font-size:12px;line-height:1.45}
 .cover-art .tile-side small{font-size:9px;margin-top:5px}
}
@media(max-width:390px){.cover-art .tile{padding:13px}.cover-art .cover-lead strong{font-size:14px}.cover-art .cover-lead span{font-size:6.5px}.cover-art .tile-side strong{font-size:11px}.cover-art .cover-index{font-size:6.5px}}

.motifs .motif{width:100%;min-height:62px;display:grid;grid-template-columns:23px 1fr 16px;gap:8px;align-items:center;text-align:left;border:0;background:var(--page);color:var(--ink);padding:12px 15px;cursor:pointer;transition:background .16s,color .16s}
.landing-bottom .motif-hint{font-size:11px;color:var(--muted);margin-top:13px}
.landing-bottom .motifs{margin-top:12px}
.motifs .motif:hover{background:#eee4d9}
.motifs .motif.active{background:#e6d5c6;color:#5a4036}
.motifs .motif span{background:transparent;padding:0}
.motifs .motif-number{font:600 10px/1 var(--sans);color:var(--muted);letter-spacing:.04em}
.motifs .motif-symbol{font:400 18px/1 var(--serif);color:var(--accent);text-align:right}
.path-detail{margin-top:2px;background:#eee4d8;padding:24px 26px;display:grid;grid-template-columns:185px 1fr;gap:30px;animation:enter .18s ease}
.path-detail[hidden]{display:none}
.path-detail-head h3{font:600 23px/1.4 var(--serif);margin:9px 0 0}
.path-detail-head .eyebrow{font-size:9px;letter-spacing:.12em}
.path-detail-copy p{font-size:13px;line-height:1.95;color:#51443b;margin:0 0 9px}
.path-detail-copy small{font-size:11px;line-height:1.8;color:var(--sub)}
@media(max-width:700px){.motifs .motif{min-height:59px;padding:10px 12px;grid-template-columns:17px 1fr 13px;gap:6px;font-size:12px}.motifs .motif-number{font-size:9px}.path-detail{grid-template-columns:1fr;gap:9px;padding:21px 20px}.path-detail-head h3{font-size:20px;margin-top:4px}}