/* =====================================================
   知运 · 独立测评页（zhiyun.html）纸本杂志风皮肤
   2026-11-10：与养娃页 / mag-skin.css 同一套设计语言——
   米白纸底、墨绿主色、金色细线、直角卡纸、宋体标题、去渐变去投影。
   只覆盖视觉层，不动布局、不动文案、不动交互。
   加载顺序：页面内联 <style> 之后。
   ===================================================== */

:root{
  --bg:#FDFDFB;            /* 纸底 */
  --surface:#FCFAF4;       /* 卡纸 */
  --surface-soft:#EFE9DC;  /* 米色区块 */
  --plum:#1E4A38;          /* 主色改为墨绿 */
  --plum-dark:#20251F;     /* 标题墨色 */
  --rose:#B08A42;          /* 原玫色→金色 */
  --rose-soft:#EFE9DC;
  --gold:#B08A42;
  --gold-soft:#CDB684;
  --ink:#20251F;
  --muted:#4B524A;
  --line:#D9D3C4;
  --success:#1E4A38;
  --radius-lg:2px;
  --radius-md:2px;
  --shadow:0 10px 30px rgba(32,37,31,.06);
  --serif:"Songti SC","STSong","Noto Serif SC","Source Han Serif SC",Georgia,serif;
}

body{background:var(--bg);color:var(--ink)}
button{border-radius:0}

/* ---------- 报头 ---------- */
.brand-mark{border-radius:2px;background:var(--plum);box-shadow:none;
  color:#F2EBDD;font-family:var(--serif);font-size:22px}
.brand-name{font-family:var(--serif);font-weight:500;letter-spacing:.2em;color:var(--ink);font-size:17px}
.brand-sub{color:var(--ink-3,#8B8D82);letter-spacing:.18em}
.header-note{color:#8B8D82}
.header-badge h1{font-family:var(--serif);font-weight:600;letter-spacing:.02em;color:var(--ink)}
.header-badge p{color:var(--muted)}
.eyebrow{color:var(--gold);letter-spacing:.28em;font-weight:500;text-transform:uppercase;font-size:11.5px}
.eyebrow::before{width:22px;height:1px;background:var(--gold)}

/* ---------- 按钮 / 输入 ---------- */
.btn{border-radius:2px;font-weight:500;letter-spacing:.18em;font-size:14px}
.btn:active{transform:none;opacity:.85}
.btn-primary{background:var(--plum);color:#F2EBDD;box-shadow:none;
  outline:1px solid var(--gold-soft);outline-offset:3px}
.btn-primary:hover{box-shadow:none;opacity:.92}
.btn-outline{color:var(--ink);border-color:var(--line);background:transparent}
.btn-outline:hover{background:transparent;border-color:var(--gold-soft);color:var(--plum)}
.btn-gray{background:var(--surface-soft);color:#8B8D82}
.input-group input{border-radius:2px;border:1px solid var(--line);background:#FCFAF4;color:var(--ink)}
.input-group input::placeholder{color:#9A9C90}
.input-group input:focus{border-color:var(--plum);box-shadow:none}
.times-left{color:var(--plum);letter-spacing:.04em}

/* ---------- 欢迎页 ---------- */
.splash-kicker{background:none;border:0;border-radius:0;padding:0;
  color:var(--gold);letter-spacing:.26em;font-size:11.5px;font-weight:500}
.splash-line{font-family:var(--serif);font-weight:600;letter-spacing:.02em;line-height:1.32;color:var(--ink)}
.splash-line .highlight{color:var(--plum)}
.splash-sub{color:var(--muted);letter-spacing:.02em}
.splash-quote{font-family:var(--serif);color:var(--gold);letter-spacing:.18em}
.splash-art{border-radius:2px;background:var(--surface-soft);
  border:1px solid var(--gold-soft);box-shadow:none}
.splash-art::before,.splash-art::after{border-color:rgba(176,138,66,.32)}
.moon{border-radius:50%;background:radial-gradient(circle at 38% 34%,#FBF5E7,#E6D7BC 72%);
  box-shadow:none;border:1px solid var(--gold-soft)}
.moon::after{background:rgba(255,255,255,.55)}
.orbit-star{color:var(--gold)}
.art-caption{font-family:var(--serif);color:#8B8D82;letter-spacing:.2em}
.footer-note{color:#8B8D82;letter-spacing:.06em}

/* ---------- 体验码 ---------- */
.password-shell{border-radius:2px;background:var(--surface);border:1px solid var(--line);box-shadow:none}
.logo-circle{border-radius:2px;background:var(--plum);box-shadow:none;
  color:#F2EBDD;font-family:var(--serif);font-size:30px}
.password-box h2{font-family:var(--serif);font-weight:600;color:var(--ink);letter-spacing:.03em}
.password-box .sub{color:var(--muted)}

/* ---------- 类型选择 ---------- */
.type-card{border-radius:2px;background:var(--surface);border:1px solid var(--line);box-shadow:none}
.type-card:hover{transform:translateY(-3px);border-color:var(--gold-soft);box-shadow:var(--shadow)}
.type-card .icon{border-radius:2px;background:var(--surface-soft)}
.type-card[data-type="children"] .icon,.type-card[data-type="self"] .icon{background:var(--surface-soft)}
.type-card h3{font-family:var(--serif);font-weight:600;color:var(--ink);letter-spacing:.03em}
.type-card p{color:var(--muted)}
.type-tags span{border-radius:2px;background:var(--surface-soft);border:1px solid var(--line);
  color:var(--gold);letter-spacing:.1em;font-size:11px}
.type-arrow{color:var(--gold)}
.type-footnote{color:#8B8D82}

/* ---------- 答题 ---------- */
.question-count{color:var(--plum);letter-spacing:.06em;font-weight:500}
.quiz-progress{height:2px;border-radius:0;background:var(--line)}
.quiz-progress-bar{border-radius:0;background:var(--plum)}
.question-dimension{border-radius:2px;background:var(--surface-soft);border:1px solid var(--line);
  color:var(--gold);letter-spacing:.14em;font-size:11px}
.question-text{font-family:var(--serif);font-weight:600;color:var(--ink);
  border-radius:2px;background:var(--surface);border:1px solid var(--line);box-shadow:none;letter-spacing:.02em}
.option-item{border-radius:2px;background:var(--surface);border:1px solid var(--line);color:#4B524A}
.option-item:hover{border-color:var(--gold-soft)}
.option-item.selected{border-color:var(--plum);background:#F1F4EF;box-shadow:none;color:var(--ink)}
.option-item-neutral{background:var(--surface-soft);border-style:dashed;color:#8B8D82}
.result-method-note{background:var(--surface-soft)}
.option-label{border-radius:2px;background:var(--surface-soft);color:#8B8D82}
.option-item.selected .option-label{background:var(--plum);color:#F2EBDD}
.quiz-nav{border-top:1px solid var(--line)}
.auto-next-note{color:#8B8D82}

/* ---------- 结果 ---------- */
.result-header{background:none;border-radius:0;padding:24px 18px 20px}
.result-header .badge{border-radius:2px;background:var(--surface-soft);border:1px solid var(--line);
  color:var(--plum);letter-spacing:.14em;font-weight:500}
.result-header h1{font-family:var(--serif);font-weight:600;color:var(--ink);letter-spacing:.03em}
.result-header .subtitle{color:var(--muted)}
.result-card{border-radius:2px;background:var(--surface);
  border-top:1px solid var(--gold);border-bottom:1px solid var(--gold-soft);
  border-left:1px solid var(--line);border-right:1px solid var(--line);box-shadow:none}
.result-type{border-bottom:1px solid var(--line)}
.result-type h2{font-family:var(--serif);font-weight:600;color:var(--plum);letter-spacing:.03em}
.result-type .score-badge{border-radius:2px;background:var(--surface-soft);border:1px solid var(--line);
  color:var(--plum);letter-spacing:.1em}
.result-emblem{filter:none}
.share-card-footer{border-top:1px solid var(--line);color:#8B8D82}
.share-card-footer .share-brand{color:var(--plum);font-family:var(--serif);font-weight:500;letter-spacing:.22em}
.share-card-footer .share-tagline{color:#8B8D82}
.result-tags{gap:10px}
.result-tag{border-radius:2px;border:1px solid var(--line);background:var(--surface-soft);
  color:var(--plum);letter-spacing:.1em}
.result-section{border-radius:2px;border:1px solid var(--line);background:var(--surface)}
.result-section h3{font-family:var(--serif);font-weight:600;color:var(--ink);letter-spacing:.06em}
.result-section h3 .section-mark{border-radius:2px;background:var(--surface-soft)}
.result-section p{color:#4B524A}
.result-disclaimer{color:#8B8D82}
.back-link{border-radius:2px;border:1px solid var(--line);background:transparent;
  color:var(--plum);font-weight:500;letter-spacing:.06em}
.back-link:hover{background:transparent;border-color:var(--gold-soft)}
.quiz-topbar .brand-mini{font-family:var(--serif);font-weight:500;color:var(--ink);letter-spacing:.16em}

/* 维度条 */
.dimension-score-top{color:#4B524A}
.dimension-score-top strong{color:var(--ink)}
.dimension-score-top span{color:#8B8D82}
.dimension-track{height:2px;border-radius:0;background:var(--line)}
.dimension-fill{border-radius:0;background:var(--plum)}
.dimension-score-row.is-unknown .dimension-track{background:repeating-linear-gradient(135deg,#E7E1D4 0,#E7E1D4 6px,#FDFDFB 6px,#FDFDFB 12px)}
.result-contrast{color:#8B8D82}
.dim-read-card{border-radius:2px;border:1px solid var(--line);background:var(--surface)}
.dim-read-card.is-unknown{background:var(--surface-soft)}
.dim-art{border-radius:2px;background:var(--surface-soft)}
.dim-read-titles strong{color:var(--ink)}
.dim-band{color:#8B8D82}
.dim-read-text{color:#4B524A}
.dim-read-tip{border-radius:2px;background:var(--surface-soft);color:#4B524A}
.dim-read-tip b{color:var(--gold)}

/* ---------- 弹窗 / toast ---------- */
.modal-content{border-radius:2px;background:var(--surface);border:1px solid var(--line);box-shadow:none}
.modal-content h3{font-family:var(--serif);font-weight:600;color:var(--ink)}
.modal-content p{color:var(--muted)}
.toast{border-radius:2px;background:var(--plum);color:#F2EBDD;box-shadow:none;letter-spacing:.04em}
.image-preview-content img{border-radius:2px;border:1px solid var(--line);background:#FCFAF4}

/* ---------- 家庭对照 / 复测 ---------- */
.retest-note{border-radius:2px;background:var(--surface-soft);border:1px solid var(--line);color:#4B524A}
.retest-note b{color:var(--ink);font-family:var(--serif);font-weight:600}
.retest-note button{border-radius:2px;background:var(--plum);color:#F2EBDD;letter-spacing:.1em}
.retest-note button:hover{background:#2A5C47}
.family-link{color:var(--plum);text-decoration-color:var(--gold-soft)}
.fam-board{border-radius:2px;background:var(--bg);border:1px solid var(--line)}
.fam-track{border-radius:2px;background:var(--surface);border:1px solid var(--line);box-shadow:none}
.fam-track.is-empty{background:var(--surface-soft);border-style:dashed}
.fam-who{font-family:var(--serif);font-weight:600;color:var(--ink);letter-spacing:.04em}
.fam-date,.fam-contrast,.fam-dim,.fam-dim em{color:#8B8D82}
.fam-headline{color:var(--ink)}
.fam-dim-bar{border-radius:0;background:var(--line)}
.fam-dim-bar i{border-radius:0;background:var(--plum)}
.fam-tags span{border-radius:2px;background:var(--surface-soft);color:var(--plum);letter-spacing:.06em}
.fam-summary{border-radius:2px;background:var(--surface-soft);border:1px solid var(--line);color:#4B524A}
.fam-summary b{color:var(--ink)}

/* ---------- 分享小卡（#miniCard 离屏渲染） ---------- */
#miniCard{background:#FDFDFB;border:1px solid var(--gold-soft);border-radius:2px}
.mc-brand{color:#8B8D82;letter-spacing:.22em}
.mc-mark{border-radius:2px;background:var(--plum);color:#F2EBDD;font-family:var(--serif);font-weight:400}
.mc-eyebrow{color:var(--gold);letter-spacing:.3em}
.mc-title{font-family:var(--serif);font-weight:600;color:var(--ink);letter-spacing:.02em}
.mc-contrast{color:#8B8D82}
.mc-tag{border-radius:2px;border:1px solid var(--line);background:var(--surface-soft);color:var(--plum);letter-spacing:.08em}
.mc-dim-top{color:#4B524A}
.mc-dim-band{color:#8B8D82}
.mc-track{border-radius:0;background:var(--line)}
.mc-fill{border-radius:0;background:var(--plum)}
.mc-foot{border-top:1px dashed var(--line);color:#8B8D82;letter-spacing:.16em}

/* ---------- 窄屏：直角与留白贴合养娃页 ---------- */
@media(max-width:640px){
  .splash-art{border-radius:2px}
  .type-card{border-radius:2px}
  .question-text{border-radius:2px}
  .option-item{border-radius:2px}
  .result-card{border-radius:2px}
  .result-section{border-radius:2px}
  .password-shell{border-radius:2px}
  .dim-read-card{border-radius:2px}
  .brand-mark{border-radius:2px}
  .type-card .icon{border-radius:2px}
  .option-label{border-radius:2px}
}