

.r-stage{padding:20px 8px 32px;display:flex;flex-direction:column;align-items:center;gap:20px}
.r-phone{color-scheme:light;--r-paper:#F7F1E5;--r-surface:#FFFCF6;--r-ink:#263B32;--r-muted:#5F685D;--r-brand:#23483F;--r-on-brand:#FFF9EB;--r-soft:#E9EDE1;--r-line:#DDD1B9;--r-control:#818B78;--r-gold:#876637;--r-gold-light:#D8BC83;--r-gold-soft:#F0E8D6;--r-serif:'Songti SC','STSong','Noto Serif SC',serif;--r-sans:'PingFang SC','Microsoft YaHei',system-ui,sans-serif;background:var(--r-paper);color:var(--r-ink);width:min(100%,390px);min-height:800px;border:1px solid var(--r-line);border-radius:20px;box-sizing:border-box;font-family:var(--r-sans);font-size:16px;line-height:1.7;overflow:clip;box-shadow:0 8px 30px #20372A0B}
.r-phone *{box-sizing:border-box}
.r-phone [hidden]{display:none!important}
.r-phone :where(h1,h2,h3,p,figure){margin:0;color:inherit}
.r-phone button,.r-phone input{font:inherit}
.r-top{margin:0 24px;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--r-line)}
.r-brand{font-family:var(--r-serif);font-size:17px;letter-spacing:1px;font-weight:500;color:var(--r-brand)}
.r-top-name{font-size:12px;color:var(--r-muted)}
.r-page{padding:28px 24px 24px;min-height:734px;display:flex;flex-direction:column}
.r-home{padding-top:24px}
.r-home h1{font:500 34px/1.32 var(--r-serif);letter-spacing:1px}
.r-home h1 em{font:inherit;font-style:normal;color:var(--r-brand)}
.r-home .r-subtitle{font-size:15px;line-height:1.8;color:var(--r-muted);margin-top:14px;max-width:300px}
.r-art{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;mix-blend-mode:multiply}
.r-home-art{margin:18px -24px 12px}
.r-home-art .r-art{width:100%;height:auto}
.r-outcomes{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:9px;color:var(--r-muted);font-size:13px;margin:8px 0 24px}
.r-outcomes span+span:before{content:'·';color:var(--r-gold);margin-right:9px}
.r-bottom{margin-top:auto;padding-top:22px}
.r-home .r-bottom{margin-top:0;padding-top:0}
.r-primary{width:100%;min-height:52px;display:flex;align-items:center;justify-content:center;gap:12px;padding:13px 16px;background:var(--r-brand);color:var(--r-on-brand);border:1px solid var(--r-brand);border-radius:12px;font-size:16px;font-weight:500;line-height:1.5;transition:transform 120ms ease,filter 120ms ease;touch-action:manipulation;box-shadow:0 4px 12px #23483F12}
.r-primary:disabled{background:var(--r-line);border-color:var(--r-line);color:var(--r-muted);cursor:default;box-shadow:none}
.r-primary:not(:disabled):active{transform:translateY(1px)}
.r-secondary{background:transparent;color:var(--r-brand);border:1px solid var(--r-control);border-radius:12px;min-height:48px;padding:10px 16px;font-size:15px;line-height:1.5;touch-action:manipulation}
.r-secondary:disabled{opacity:.5;cursor:default}
.r-text-button{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:48px;padding:8px 0;background:transparent;border:0;color:var(--r-brand);font-size:14px;touch-action:manipulation}
.r-phone :where(button,summary,input):focus-visible{outline:3px solid var(--r-brand);outline-offset:4px}
.r-phone button svg{width:17px;height:17px;flex:0 0 auto}
.r-question-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:-12px}
.r-count{font-size:13px;color:var(--r-muted);font-variant-numeric:tabular-nums}
.r-progress{height:3px;background:var(--r-line);margin-top:10px;border-radius:2px}
.r-progress-fill{height:100%;background:var(--r-brand);border-radius:2px;width:0}
.r-question-ornament{margin:22px 0 0;color:var(--r-gold);display:flex;align-items:center;gap:12px;font-size:12px}
.r-question-ornament svg{width:17px;height:17px}
.r-question fieldset{padding:0;border:0;margin:18px 0 0;min-width:0}
.r-question legend{padding:0;width:100%;font:500 22px/1.65 var(--r-serif);min-height:138px;float:none}
.r-q-hint{font-size:14px;color:var(--r-muted);margin:16px 0 22px;line-height:1.7}
.r-options{display:grid;gap:9px}
.r-option{min-height:52px;padding:12px 16px;display:flex;align-items:center;gap:14px;border:1px solid var(--r-control);background:var(--r-surface);border-radius:12px;font-size:16px;line-height:1.5;touch-action:manipulation;transition:background 120ms ease}
.r-option:has(input:checked){background:var(--r-soft);border:2px solid var(--r-brand);padding:11px 15px;color:var(--r-brand);font-weight:500}
.r-option input{accent-color:var(--r-brand);width:20px;height:20px;flex:0 0 auto;margin:0}
.r-question-actions{display:grid;grid-template-columns:104px 1fr;gap:12px;margin-top:22px}
.r-choice-status{min-height:24px;font-size:13px;color:var(--r-muted);margin-top:14px;text-align:center}
.r-question .r-bottom{padding-top:12px}
.r-eyebrow{font-size:12px;letter-spacing:.04em;color:var(--r-gold);margin-bottom:12px}
.r-state h1{font:500 30px/1.5 var(--r-serif)}
.r-state .r-subtitle{color:var(--r-muted);font-size:16px;line-height:1.8;margin-top:18px}
.r-state-mark{display:flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:var(--r-gold-soft);color:var(--r-brand);margin:32px 0 28px;border:1px solid var(--r-line)}
.r-state-mark svg{width:26px;height:26px}
.r-report{display:block;padding-top:26px}
.r-report-cover{text-align:center}
.r-cover-ornament{display:flex;align-items:center;justify-content:center;gap:14px;color:var(--r-gold);margin:8px 0 18px}
.r-cover-ornament:before,.r-cover-ornament:after{content:'';width:42px;height:1px;background:var(--r-gold-light)}
.r-cover-ornament svg{width:19px;height:19px}
.r-report-cover h1{font:500 34px/1.4 var(--r-serif);color:var(--r-brand);letter-spacing:1px}
.r-report-pair{font-size:14px;color:var(--r-muted);margin-top:12px!important;letter-spacing:1px}
.r-report-code{font-family:var(--r-sans);font-size:18px;font-weight:400;letter-spacing:5px;color:var(--r-gold);margin-top:10px}
.r-report-art{margin:14px -24px 20px}
.r-cover-lead{margin:0 0 12px;padding:22px 22px 24px;text-align:left;background:var(--r-brand);color:var(--r-on-brand);border-radius:14px}
.r-cover-lead .r-lead-label{color:#E4D0A7;font-size:12px;letter-spacing:.04em;margin-bottom:10px}
.r-cover-lead p{font-size:16px;line-height:1.9;color:var(--r-on-brand)}
.r-report-tie{font-size:13px;color:var(--r-muted);line-height:1.8;text-align:center;margin:14px 4px 0!important}
.r-chapter{margin-top:38px;padding-top:24px;border-top:1px solid var(--r-line)}
.r-chapter-heading{display:flex;align-items:baseline;gap:12px;margin-bottom:14px}
.r-chapter-no{font-family:var(--r-serif);font-size:20px;color:var(--r-gold);line-height:1.5}
.r-chapter h2{font:500 23px/1.5 var(--r-serif);color:var(--r-brand)}
.r-chapter-intro{font-size:14px;color:var(--r-muted);line-height:1.85;margin-bottom:22px!important}
.r-score-list{list-style:none;margin:0;padding:0;display:grid;gap:17px}
.r-score-row{display:grid;grid-template-columns:76px minmax(0,1fr) 38px;align-items:center;gap:12px;font-size:14px}
.r-dimension-label{display:flex;align-items:baseline;gap:7px;white-space:nowrap}
.r-dimension-label span{font-size:12px;color:var(--r-gold);width:10px}
.r-value{text-align:right;font-variant-numeric:tabular-nums;font-size:14px}
.r-score-track{height:6px;border-radius:3px;background:#DDDCCA}
.r-score-track span{display:block;height:100%;border-radius:3px;background:var(--r-brand)}
.r-score-note{font-size:12px;color:var(--r-muted);line-height:1.8;margin-top:18px!important}
.r-interest-story{padding:20px 0;border-bottom:1px solid var(--r-line)}
.r-interest-story:first-of-type{padding-top:2px}
.r-interest-heading{display:flex;gap:14px;align-items:center;margin-bottom:10px}
.r-interest-letter{width:32px;height:32px;flex:0 0 auto;border:1px solid var(--r-gold-light);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--r-gold);font-size:13px}
.r-interest-heading h3{font:500 19px/1.5 var(--r-serif)}
.r-interest-story p{font-size:15px;color:var(--r-muted);line-height:1.9}
.r-interest-action{margin-top:10px!important;color:var(--r-brand)!important;font-size:14px!important}
.r-career{border-bottom:1px solid var(--r-line)}
.r-career summary{display:flex;align-items:center;gap:14px;min-height:66px;padding:14px 0;list-style:none;touch-action:manipulation}
.r-career summary::-webkit-details-marker{display:none}
.r-career-no{font-size:12px;color:var(--r-gold);font-variant-numeric:tabular-nums;min-width:18px}
.r-career-title{font:500 20px/1.5 var(--r-serif);flex:1}
.r-career-toggle{font-size:22px;color:var(--r-gold);font-weight:400;line-height:1;transition:transform 140ms ease}
.r-career[open] .r-career-toggle{transform:rotate(45deg)}
.r-career-body{padding:0 0 22px 32px}
.r-career-category{font-size:12px;color:var(--r-gold);margin-bottom:8px!important}
.r-career-body p{font-size:15px;color:var(--r-muted);line-height:1.85}
.r-shared{font-size:13px!important;margin-top:10px!important}
.r-practice{margin-top:16px;padding:14px 16px;background:var(--r-gold-soft);border-radius:10px}
.r-practice-label{display:block;font-size:12px;color:var(--r-gold);margin-bottom:6px}
.r-practice p{font-size:14px;line-height:1.85;color:var(--r-ink)}
.r-action-list{margin:0;padding:0;list-style:none}
.r-action-list li{display:flex;gap:14px;padding:15px 0}
.r-action-list li+li{border-top:1px solid var(--r-line)}
.r-action-no{font-size:12px;color:var(--r-gold);font-variant-numeric:tabular-nums;margin-top:3px;min-width:18px}
.r-action-list h3{font-size:16px;font-weight:500;line-height:1.6;margin-bottom:6px}
.r-action-list p{font-size:14px;color:var(--r-muted);line-height:1.85}
.r-supplementary{margin-top:24px;border-top:1px solid var(--r-line);border-bottom:1px solid var(--r-line)}
.r-supplementary summary{min-height:50px;padding:12px 0;font-size:14px;color:var(--r-brand);list-style-position:inside;touch-action:manipulation}
.r-supplementary p{font-size:14px;color:var(--r-muted);line-height:1.85;padding-bottom:18px}
.r-report-ending{margin-top:34px;text-align:center;color:var(--r-gold)}
.r-report-ending svg{width:22px;height:22px}
.r-report-ending p{font:500 19px/1.6 var(--r-serif);color:var(--r-brand);margin-top:12px}
.r-report-notice{font-size:12px;color:var(--r-muted);line-height:1.85;margin-top:24px!important;padding-top:20px;border-top:1px solid var(--r-line)}
@media(hover:hover){.r-primary:not(:disabled):hover{transform:translateY(-1px);filter:brightness(1.06)}.r-option:hover{background:var(--r-soft)}}
@media(max-width:390px){.r-stage{padding:16px 0 24px}.r-page{padding-left:20px;padding-right:20px}.r-top{margin:0 20px}.r-home-art,.r-report-art{margin-left:-20px;margin-right:-20px}.r-home h1{font-size:32px}.r-report-cover h1{font-size:30px}.r-question legend{min-height:160px}.r-question-actions{grid-template-columns:92px 1fr;gap:8px}.r-score-row{gap:8px;grid-template-columns:72px minmax(0,1fr) 34px}.r-cover-lead{padding:20px 18px}}
@media(prefers-reduced-motion:reduce){.r-phone *{transition:none!important;animation:none!important;transform:none!important}}

/* Production layout: a real responsive page, without the preview's phone frame. */
:root{color-scheme:light;background:#F7F1E5;font-family:'PingFang SC','Microsoft YaHei',system-ui,sans-serif}
body{margin:0}
.r-phone{width:min(100%,680px);min-height:100svh;margin:0 auto;border:0;border-radius:0;box-shadow:none;overflow:visible}
.r-top{margin:0 32px;min-height:72px;padding-top:env(safe-area-inset-top)}
button.r-brand{background:none;border:0;padding:10px 0;min-height:44px;text-align:left;cursor:pointer}
.r-page{padding:32px 32px calc(32px + env(safe-area-inset-bottom));min-height:calc(100svh - 72px)}
.r-home{padding-top:36px}
.r-home h1{font-size:42px}
.r-home .r-subtitle{max-width:none}
.r-home-art,.r-report-art{margin-left:-32px;margin-right:-32px}
.r-home-art{margin-top:22px}
.r-art{max-width:600px;margin:0 auto}
.r-home .r-bottom{max-width:480px;width:100%;margin:0 auto}
.r-saved{display:flex;margin:10px auto 0;text-align:center}
.r-phone :where(button,summary,label.r-option){cursor:pointer}
.r-phone button:disabled{cursor:default}
.r-phone :where(button,summary,input){-webkit-tap-highlight-color:transparent}
.r-phone [hidden]{display:none!important}
.r-progress,.r-score-track{display:block;width:100%;appearance:none;-webkit-appearance:none;border:0;overflow:hidden}
.r-progress::-webkit-progress-bar{background:var(--r-line)}
.r-score-track::-webkit-progress-bar{background:#DDDCCA}
.r-progress::-webkit-progress-value,.r-score-track::-webkit-progress-value{background:var(--r-brand);border-radius:3px}
.r-progress::-moz-progress-bar,.r-score-track::-moz-progress-bar{background:var(--r-brand);border-radius:3px}
.r-question legend{min-height:110px;scroll-margin-top:16px}
.r-question .r-bottom{margin-top:0}
.r-question fieldset{width:100%}
.r-question-ornament img{flex:0 0 auto}
.r-state h1{outline:none}
.r-report{padding-top:32px}
.r-cover-ornament img{width:19px;height:19px}
.r-cover-lead{margin-top:4px}
.r-report-code{overflow-wrap:anywhere}
.r-reading-note{margin-top:20px;padding:14px 16px;border-left:2px solid var(--r-gold-light);background:var(--r-gold-soft);font-size:13px;color:var(--r-muted);line-height:1.85}
.r-reading-note p+p{margin-top:8px}
.r-supplementary p+p{padding-top:2px}
.r-supplementary strong{font-weight:500;color:var(--r-brand)}
.r-report-actions{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:28px}
.r-error{color:#8A382B;font-size:14px;line-height:1.8;margin-top:14px!important}
.skip-link{position:fixed;z-index:10;top:-100px;left:16px;padding:12px 18px;background:#23483F;color:#FFF9EB;border-radius:8px}
.skip-link:focus{top:16px}
#content{outline:none}
@media(hover:hover){.r-secondary:hover{background:var(--r-soft)}.r-text-button:hover{color:var(--r-gold)}.r-career summary:hover{color:var(--r-brand)}}
@media(max-width:600px){
  .r-top{margin:0 24px;min-height:64px}
  .r-page{padding:28px 24px calc(24px + env(safe-area-inset-bottom));min-height:calc(100svh - 64px)}
  .r-home{padding-top:24px}
  .r-home h1{font-size:34px}
  .r-home-art,.r-report-art{margin-left:-24px;margin-right:-24px}
  .r-home-art{margin-top:18px}
  .r-question legend{min-height:138px}
  .r-report{padding-top:26px}
}
@media(max-width:390px){
  .r-top{margin:0 20px}
  .r-page{padding-left:20px;padding-right:20px}
  .r-home-art,.r-report-art{margin-left:-20px;margin-right:-20px}
  .r-home h1{font-size:32px}
  .r-question legend{min-height:160px}
}
