/* 赛博太医 · 宣纸诊册，1440 × 900 固定画布 */
:root {
  --teal: #A33D2E;
  --ink: #283F35;
  --body: #6F6759;
  --aux: #968570;
  --bg: #F4ECDB;
  --mint: #ECE4CF;
  --line: #D6C6A9;
  --divider: #DACCB5;
  --track: #E2D5BB;
  --gold: #B38A49;
  --figure: #BD8B55;
  --paper: #FFFAEF;
  --card-shadow: 0 10px 30px rgba(79, 58, 30, .05);
  --font-display: 'STKaiti', 'KaiTi', 'Kaiti SC', 'FangSong', 'STSong', 'SimSun', serif;
  --font-copy: 'PingFang SC', 'Microsoft YaHei', 'Segoe UI', sans-serif;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { width: 100%; height: 100%; overflow: hidden; background: var(--bg); color: var(--ink); font-family: var(--font-copy); -webkit-font-smoothing: antialiased; user-select: none; -webkit-user-select: none; touch-action: manipulation; }
[v-cloak] { display: none; }
#app { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.stage { position: relative; width: 1440px; height: 900px; flex: none; overflow: hidden; background-color: var(--bg); background-image: radial-gradient(ellipse at 30% 20%, rgba(255,255,255,.5), transparent 55%), repeating-linear-gradient(45deg, rgba(157,120,65,.025) 0 1px, transparent 1px 5px); }
.stage::before { content: ''; position: absolute; inset: 18px; border: 1px solid rgba(153,118,65,.27); pointer-events: none; z-index: 1; }
.topbar { position: absolute; top: 0; left: 0; right: 0; height: 112px; display: flex; align-items: center; justify-content: space-between; padding: 24px 62px 0; z-index: 10; pointer-events: none; }
.topbar.band { background: transparent; }
.app-logo { display: flex; align-items: center; gap: 17px; }
.app-logo img, .app-logo-svg { display: block; width: 60px; height: 60px; border-radius: 4px; object-fit: contain; }
.brand-signature { font-family: var(--font-display); font-weight: 700; font-size: 25px; letter-spacing: .08em; }
.brand-signature span { display: block; margin-top: 7px; font-family: var(--font-copy); font-size: 12px; font-weight: 400; letter-spacing: .21em; color: var(--aux); }
.progress-pill { background: transparent; border: 1px solid var(--line); border-radius: 4px; padding: 11px 22px; font-size: 17px; color: var(--body); font-variant-numeric: tabular-nums; letter-spacing: .1em; }
.edition-mark { text-align: right; color: var(--aux); font-size: 14px; letter-spacing: .18em; }
.edition-mark span { display: block; margin-top: 7px; font-size: 11px; letter-spacing: .12em; }
.page { position: absolute; inset: 0; display: flex; flex-direction: column; padding: 140px 64px 68px; animation: page-in .3s ease; }
@keyframes page-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
.page-title { font-family: var(--font-display); font-size: 39px; font-weight: 700; color: var(--ink); line-height: 1.35; letter-spacing: .04em; }
.page-intro { margin-top: 10px; font-size: 18px; line-height: 1.5; color: var(--body); }
.page-head-row { display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.tag-chip { display: inline-block; align-self: flex-start; background: #E9E2CD; color: #5C6850; font-size: 17px; padding: 8px 16px; border: 1px solid #D9CEB2; border-radius: 4px; white-space: nowrap; }
.source-chip { margin-left: 18px; font-size: 16px; padding: 5px 14px; vertical-align: middle; }
.page-footer { margin-top: auto; display: flex; align-items: center; justify-content: center; }
.legal-note { position: absolute; bottom: 29px; left: 50px; right: 50px; text-align: center; font-size: 12px; color: #958573; letter-spacing: .03em; z-index: 3; pointer-events: none; }
.btn { appearance: none; border: 1px solid transparent; cursor: pointer; font-family: var(--font-copy); font-size: 24px; font-weight: 500; text-align: center; border-radius: 6px; padding: 16px 32px; min-height: 66px; color: var(--ink); background: var(--paper); transition: transform .15s ease, background-color .2s ease, color .2s ease, border-color .2s ease; }
.btn:active { transform: scale(.98); }
.btn:disabled { cursor: default; }
.btn:disabled:active { transform: none; }
.btn-primary { background: var(--teal); color: #FFF8EA; border-color: #94392C; box-shadow: inset 0 0 0 3px var(--teal), inset 0 0 0 4px rgba(255,248,234,.22); }
.btn-primary:not(:disabled):hover { background: #8D3326; }
.btn-primary:disabled { background: #D8CBB6; color: #9A8B74; border-color: #D8CBB6; box-shadow: none; }
.btn-lg { min-width: 330px; min-height: 68px; font-size: 24px; }
.btn-block { width: 100%; min-height: 68px; font-size: 24px; }
button:focus-visible, .body-label:focus-visible, .page-buff:focus-visible { outline: 3px solid var(--teal); outline-offset: 5px; }
.body-figure { display: block; height: 100%; width: auto; }
.body-figure .regions path { fill: rgba(163,61,46,0); stroke: none; }
.body-figure .regions path.clickable { cursor: pointer; }
.body-figure .regions path.clickable:hover { fill: rgba(163,61,46,.15); }
.body-figure .outline { pointer-events: none; }
.body-figure .leader { pointer-events: none; }
.body-label { cursor: pointer; pointer-events: auto; }
.body-figure .leader-line { stroke: #B19A73; stroke-width: 1; }
.body-figure .leader-pill { fill: #F8F0DF; stroke: #CDBA99; stroke-width: .7; }
.body-label:hover .leader-pill { fill: #E8D9BD; }
.body-figure .leader-text { fill: #725938; font-family: var(--font-copy); font-size: 18px; }
.page-home { flex-direction: row; align-items: center; padding: 110px 92px 68px; gap: 48px; cursor: pointer; }
.home-left { flex: 1; min-width: 0; transition: transform .2s ease, opacity .2s ease; }
.page-home.pressed .home-left { transform: scale(.985); opacity: .9; }
.home-eyebrow { display: flex; align-items: center; gap: 10px; font-size: 15px; letter-spacing: .15em; color: #75806A; margin-bottom: 26px; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: #768965; box-shadow: 0 0 0 4px rgba(118,137,101,.1); }
.home-title { font-family: var(--font-display); line-height: 1.12; font-weight: 700; }
.home-title-ink { display: block; font-size: 86px; color: var(--ink); letter-spacing: .06em; }
.home-title-teal { display: block; margin-top: 17px; font-size: 50px; color: var(--teal); letter-spacing: .04em; }
.home-subtitle { margin-top: 24px; font-size: 21px; line-height: 1.6; color: var(--body); }
.doctor-note { display: flex; align-items: center; gap: 19px; margin-top: 38px; padding: 20px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); max-width: 430px; }
.note-seal { font-family: var(--font-display); font-size: 16px; color: var(--teal); writing-mode: vertical-rl; letter-spacing: .14em; border: 1px solid #BD6652; padding: 8px 5px; transform: rotate(-4deg); }
.doctor-note p { font-family: var(--font-display); font-size: 27px; line-height: 1.65; color: var(--ink); }
.home-hint { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 430px; margin-top: 38px; font-size: 22px; color: var(--teal); }
.hint-arrow { display: inline-flex; justify-content: center; align-items: center; width: 45px; height: 45px; color: #FFF7E5; background: var(--teal); border-radius: 50%; font-size: 25px; }
.home-small { margin-top: 16px; font-size: 13px; color: var(--aux); }
.home-card { position: relative; width: 545px; height: 666px; flex: none; background: #F8F0DF; border: 1px solid #D2BF9B; box-shadow: 9px 9px 0 rgba(203,186,153,.17); display: flex; flex-direction: column; align-items: center; justify-content: center; }
.home-card::before { content: ''; position: absolute; inset: 8px; border: 1px solid rgba(180,147,93,.27); pointer-events: none; }
.figure-heading { display: flex; align-items: center; justify-content: space-between; align-self: stretch; margin: 0 35px 15px; color: #806742; font-family: var(--font-display); font-size: 21px; letter-spacing: .14em; }
.figure-chop { color: var(--teal); font-size: 22px; border: 1px solid var(--teal); padding: 4px 7px; transform: rotate(5deg); }
.home-card .body-figure { height: 515px; max-width: 420px; }
.figure-caption { margin-top: 12px; font-size: 12px; color: #9B8768; letter-spacing: .08em; }
.part-layout { flex: 1; min-height: 0; display: flex; gap: 56px; margin-top: 24px; }
.part-card { width: 812px; flex: none; background: var(--paper); border: 1px solid var(--line); box-shadow: var(--card-shadow); padding: 17px 26px 14px; display: flex; flex-direction: column; }
.seg-control { align-self: center; display: flex; gap: 3px; background: #EEE5D1; border: 1px solid #DFD1B6; border-radius: 5px; padding: 3px; }
.seg-btn { appearance: none; border: none; cursor: pointer; font-family: var(--font-copy); font-size: 19px; color: var(--body); background: transparent; border-radius: 3px; padding: 9px 46px; transition: transform .15s ease, background-color .2s ease, color .2s ease; }
.seg-btn:active { transform: scale(.98); }
.seg-btn.active { background: var(--ink); color: #FFF7E4; }
.part-figure-wrap { flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; padding-top: 10px; }
.part-figure-wrap .body-figure { height: 480px; max-width: 100%; }
.part-side { flex: 1; display: flex; flex-direction: column; justify-content: center; padding-bottom: 16px; }
.side-label { font-size: 17px; letter-spacing: .14em; color: var(--aux); }
.side-part { margin-top: 18px; font-family: var(--font-display); font-size: 54px; font-weight: 700; line-height: 1.3; min-height: 70px; color: var(--ink); }
.side-note { margin-top: 21px; font-size: 19px; line-height: 1.8; color: var(--body); }
.side-divider { height: 1px; background: var(--divider); margin: 28px 0; }
.side-tip { font-size: 13px; text-align: center; line-height: 1.5; color: var(--aux); margin-top: 17px; }
.page-feeling .tag-chip { margin-top: 18px; }
.chips-area { display: grid; grid-template-columns: repeat(3, 260px); gap: 28px 28px; margin: 75px auto 0; }
.opt-chip { appearance: none; cursor: pointer; font-family: var(--font-copy); font-size: 24px; color: var(--ink); background: var(--paper); border: 1px solid var(--line); border-radius: 5px; padding: 22px 40px; min-height: 88px; display: inline-flex; align-items: center; justify-content: center; position: relative; transition: transform .15s ease, background-color .2s ease, color .2s ease, border-color .2s ease; }
.opt-chip:active { transform: scale(.98); }
.opt-chip .opt-check { position: absolute; right: 15px; font-size: 18px; }
.opt-chip.selected { background: #F3E4D7; border-color: #A33D2E; color: #9D382A; box-shadow: inset 0 0 0 3px #F3E4D7, inset 0 0 0 4px rgba(163,61,46,.17); }
.page-feeling .page-footer { margin-top: auto; padding-bottom: 37px; }
.quiz-meta { margin-top: 22px; display: flex; align-items: center; justify-content: space-between; }
.quiz-count { font-size: 17px; color: var(--teal); font-variant-numeric: tabular-nums; }
.quiz-progress { margin-top: 22px; height: 4px; background: var(--track); overflow: hidden; }
.quiz-progress-fill { height: 100%; background: var(--teal); transition: width .3s ease; }
.quiz-body { flex: 1; display: flex; align-items: center; justify-content: center; }
.option-list { width: 540px; display: flex; flex-direction: column; gap: 18px; }
.btn-option { width: 100%; min-height: 78px; background: var(--paper); border: 1px solid var(--line); color: var(--ink); position: relative; display: flex; align-items: center; justify-content: center; padding: 16px 52px; }
.btn-option .opt-check { position: absolute; right: 28px; font-size: 22px; }
.btn-option.selected { background: #F3E4D7; border-color: var(--teal); color: var(--teal); }
.page-summary .tag-chip { margin-top: 18px; }
.summary-wrap { width: 100%; margin-top: 22px; display: flex; flex-direction: column; }
.summary-card { background: var(--paper); border: 1px solid var(--line); box-shadow: var(--card-shadow); padding: 4px 32px 12px; }
.summary-table { width: 100%; border-collapse: collapse; }
.summary-table th { font-size: 17px; font-weight: 400; color: var(--aux); text-align: left; padding: 18px 0 14px; border-bottom: 1px solid var(--divider); }
.summary-table td { font-size: 25px; line-height: 1.5; color: var(--ink); height: 69px; padding: 5px 18px 5px 0; border-bottom: 1px solid var(--divider); }
.summary-table tbody tr:last-child td { border-bottom: none; }
.col-question { width: 49%; }
.col-answer { width: 37%; }
.col-edit { width: 14%; text-align: right; }
.edit-link { appearance: none; border: none; background: none; cursor: pointer; font-family: var(--font-copy); font-size: 19px; color: var(--teal); padding: 10px 4px; border-radius: 4px; transition: transform .15s ease; }
.edit-link:active { transform: scale(.98); }
.summary-actions { margin-top: 25px; display: flex; justify-content: flex-end; }
.scan-card { margin: 24px auto 0; width: 550px; height: 550px; background: var(--paper); border: 1px solid var(--line); position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.scan-card::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(to bottom, transparent 0 59px, rgba(191,165,122,.17) 59px 60px); pointer-events: none; }
.scan-card .body-figure { height: 440px; }
.scan-corner { position: absolute; width: 34px; height: 34px; border-color: #B89259; border-style: solid; }
.scan-corner-tl { top: 18px; left: 18px; border-width: 2px 0 0 2px; }
.scan-corner-br { bottom: 18px; right: 18px; border-width: 0 2px 2px 0; }
.scan-line { position: absolute; left: 20px; right: 20px; top: 6%; height: 2px; background: linear-gradient(90deg, transparent, var(--teal) 25%, var(--teal) 75%, transparent); box-shadow: 0 0 18px rgba(163,61,46,.12); animation: scan-move 2.6s ease-in-out infinite; }
.scan-line.static { top: 50%; animation: none; }
@keyframes scan-move { 0% { top: 6%; } 50% { top: 86%; } 100% { top: 6%; } }
.scan-caption { position: relative; text-align: center; font-family: var(--font-display); color: #806741; font-size: 21px; line-height: 1.5; margin-top: 12px; letter-spacing: .1em; }
.scan-caption span { font-family: var(--font-copy); font-size: 12px; letter-spacing: 0; color: var(--aux); }
.page-report { padding-top: 136px; }
.report-summary { margin-top: 22px; background: var(--paper); border: 1px solid var(--line); padding: 22px 28px; min-height: 122px; display: flex; align-items: center; gap: 28px; }
.facts-row { display: flex; gap: 25px; width: 46%; flex: none; }
.fact-item { flex: 1; min-width: 0; }
.fact-label { font-size: 16px; color: var(--aux); }
.fact-value { margin-top: 10px; font-family: var(--font-display); font-size: 25px; font-weight: 700; color: var(--ink); overflow-wrap: anywhere; }
.v-divider { width: 1px; align-self: stretch; background: var(--divider); flex: none; }
.summary-text { flex: 1; min-width: 0; font-size: 20px; line-height: 1.65; color: var(--body); overflow-wrap: anywhere; }
.report-status { margin-top: 14px; font-size: 16px; }
.report-status .status-ok { color: var(--teal); margin-right: 20px; }
.report-status .status-dim { color: var(--aux); }
.report-suggestions { width: 100%; margin-top: 20px; gap: 22px; }
.report-suggestions.cards { display: flex; }
.report-suggestions.cards .sug-slot { flex: 1; min-width: 0; min-height: 231px; background: #EAE5D4; border: 1px solid #D6CDB1; padding: 22px 27px; }
.report-suggestions.cards .sug-slot:nth-child(2) { background: #F0E1D3; border-color: #DBC2AB; }
.report-suggestions.cards .sug-slot:nth-child(3) { background: #E7E5D1; }
.report-suggestions.list { display: flex; flex-direction: column; gap: 10px; }
.report-suggestions.list .sug-slot { display: flex; align-items: baseline; gap: 20px; min-height: 60px; background: #EEE5D3; border-left: 3px solid #B79A6A; padding: 12px 24px; }
.report-suggestions.list .sug-text { margin-top: 0; flex: 1; }
.sug-num { font-family: Georgia, serif; font-size: 22px; color: var(--teal); white-space: nowrap; }
.sug-title { margin-top: 16px; font-family: var(--font-display); font-size: 29px; font-weight: 700; color: var(--ink); line-height: 1.35; }
.report-suggestions.list .sug-title { margin-top: 0; width: 260px; font-size: 24px; flex: none; }
.sug-text { margin-top: 15px; font-size: 21px; line-height: 1.65; color: var(--body); }
.report-taskbar { width: 100%; margin-top: 26px; display: flex; align-items: center; gap: 28px; background: var(--paper); border: 1px solid var(--line); padding: 22px 28px; min-height: 132px; }
.task-lead { flex: none; min-width: 245px; width: 245px; }
.task-meta { font-size: 16px; color: var(--aux); }
.task-name { margin-top: 10px; font-family: var(--font-display); font-size: 28px; font-weight: 700; color: var(--ink); overflow-wrap: anywhere; }
.task-instructions { flex: 1; min-width: 0; font-size: 20px; line-height: 1.6; color: var(--body); }
.btn-task { flex: none; min-width: 295px; }
.page-report.compact { padding-top: 124px; }
.page-report.compact .report-summary { padding: 18px 28px; min-height: 114px; }
.page-report.compact .report-suggestions.list { gap: 8px; }
.page-report.compact .report-suggestions.list .sug-slot { min-height: 56px; padding: 10px 24px; }
.page-report.compact .report-taskbar { margin-top: 20px; padding: 18px 28px; }
.page-report.compact .task-name { font-size: 25px; }
.skeleton { border-radius: 4px; background: linear-gradient(90deg, #E8DFCB 25%, #F5EEDB 50%, #E8DFCB 75%); background-size: 200% 100%; animation: shimmer 1.4s linear infinite; }
@keyframes shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
.skeleton-summary { width: 70%; height: 64px; }
.skeleton-sug { width: 100%; height: 100%; min-height: 48px; }
.skeleton-task { width: 60%; height: 56px; }
.countdown-wrap { position: relative; width: 440px; height: 440px; margin: 37px auto 0; display: flex; align-items: center; justify-content: center; }
.countdown-wrap::before { content: ''; position: absolute; inset: 28px; border: 1px dashed #BCA67E; border-radius: 50%; }
.ring { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.ring circle { fill: none; stroke-width: 6; stroke-linecap: round; }
.ring-bg { stroke: var(--track); }
.ring-fg { stroke: var(--teal); transition: stroke-dashoffset .3s linear; }
.countdown-center { text-align: center; }
.countdown-number { font-family: Georgia, serif; font-size: 138px; font-weight: 400; color: var(--ink); line-height: 1; font-variant-numeric: tabular-nums; }
.countdown-unit { margin-top: 16px; font-size: 18px; color: var(--aux); letter-spacing: .1em; }
.task-line { max-width: 1000px; margin: 35px auto 0; text-align: center; font-family: var(--font-display); font-size: 29px; line-height: 1.55; color: var(--body); }
.page-buff { background: radial-gradient(ellipse at 50% 40%, #FFF7E1 0, #F2E8D0 62%, #ECE0C3 100%); align-items: center; text-align: center; padding-top: 139px; cursor: pointer; }
.buff-eyebrow { font-family: var(--font-display); font-size: 21px; color: #A0703B; letter-spacing: .2em; margin-bottom: 17px; }
.page-buff.glow { background: radial-gradient(ellipse at 50% 40%, #FFF4DA, #EDDFC2); }
.buff-name { margin-top: 10px; font-family: var(--font-display); font-size: 46px; font-weight: 700; color: var(--ink); }
.buff-text { margin-top: 15px; font-size: 24px; color: var(--teal); }
.buff-reward { margin-top: 23px; font-size: 18px; color: var(--body); }
.buff-countdown { margin-top: 33px; display: inline-block; background: rgba(255,250,239,.6); border: 1px solid #D6C09B; padding: 13px 32px; border-radius: 4px; font-size: 18px; color: var(--body); font-variant-numeric: tabular-nums; }
.reduced-motion .page { animation: none; }
.reduced-motion .scan-line { animation: none; top: 50%; }
.reduced-motion .skeleton { animation: none; background: #E8DFCB; }
.reduced-motion .ring-fg, .reduced-motion .quiz-progress-fill, .reduced-motion .btn, .reduced-motion .opt-chip, .reduced-motion .seg-btn, .reduced-motion .home-left { transition: none; }
@media (prefers-reduced-motion: reduce) { .page { animation: none; } .scan-line { animation: none; top: 50%; } .skeleton { animation: none; background: #E8DFCB; } .ring-fg, .quiz-progress-fill { transition: none; } }
/* 扫码纸条与左右阅读布局。 */
.subjective-layout { display: grid; grid-template-columns: 470px 1fr; gap: 74px; align-items: center; flex: 1; min-height: 0; margin-top: 28px; }
.qr-paper { background: var(--paper); border: 1px solid var(--line); padding: 26px 32px; text-align: center; box-shadow: 8px 8px 0 rgba(203,186,153,.13); }
.paper-eyebrow { font-family: var(--font-display); font-size: 22px; color: var(--ink); letter-spacing: .06em; }
.subjective-qr { display: block; margin: 22px auto 17px; width: 270px; height: 270px; background: white; object-fit: contain; border: 10px solid white; }
.qr-unavailable { min-height: 260px; display: flex; align-items: center; justify-content: center; gap: 22px; font-size: 18px; color: var(--body); line-height: 1.7; }
.qr-unavailable p { max-width: 270px; }
.mobile-entry-link { display: block; font-family: var(--font-copy); font-size: 13px; color: var(--body); overflow-wrap: anywhere; line-height: 1.5; user-select: text; }
.qr-fixed-note { font-size: 12px; color: var(--aux); margin-top: 16px; }
.pairing-code { font-family: Georgia, serif; font-size: 68px; color: var(--teal); letter-spacing: .18em; margin-top: 22px; font-variant-numeric: tabular-nums; }
.subjective-state { display: flex; align-items: center; gap: 11px; font-size: 18px; color: #72815F; margin-top: 21px; }
.subjective-copy { color: var(--body); line-height: 1.8; font-size: 20px; margin-top: 25px; }
.subjective-deadline { color: var(--aux); font-size: 17px; margin-top: 22px; }
.subjective-deadline strong { color: var(--teal); font-weight: 500; font-variant-numeric: tabular-nums; }
.subjective-actions { display: flex; align-items: center; gap: 24px; margin-top: 28px; }
.subjective-note { font-size: 13px; color: var(--aux); margin-top: 18px; }
.inline-error { font-size: 15px; line-height: 1.6; color: #A33D2E; margin-top: 12px; }
.summary-actions { align-items: center; gap: 24px; }
.page-report { padding-top: 129px; }
.page-report .report-summary, .page-report.compact .report-summary { min-height: 100px; padding: 17px 25px; margin-top: 16px; }
.page-report .fact-value { font-size: 22px; }
.page-report .summary-text { font-size: 18px; line-height: 1.6; }
.report-reading { display: grid; grid-template-columns: minmax(0,38fr) minmax(0,62fr); gap: 22px; height: 330px; flex: none; margin-top: 18px; }
.report-quick { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.reading-caption { font-family: var(--font-display); font-size: 22px; line-height: 26px; margin-bottom: 10px; }
.reading-caption span { font-family: var(--font-copy); font-size: 12px; color: var(--aux); margin-left: 12px; }
.report-reading .report-suggestions.list { flex: 1; min-height: 0; margin: 0; gap: 5px; }
.report-reading .report-suggestions.list .sug-slot, .page-report.compact .report-reading .report-suggestions.list .sug-slot { flex: 1; min-height: 0; align-items: center; gap: 16px; padding: 5px 15px; border-left-width: 2px; }
.report-reading .sug-num { font-size: 18px; flex: none; }
.report-reading .suggestion-copy { flex: 1; min-width: 0; }
.report-reading .report-suggestions.list .sug-title { width: auto; font-size: 21px; line-height: 1.3; margin: 0; }
.report-reading .report-suggestions.list .sug-text { font-size: 16px; line-height: 1.45; margin-top: 3px; }
.report-detail-card { min-width: 0; min-height: 0; background: var(--paper); border: 1px solid var(--line); padding: 22px 28px; display: flex; flex-direction: column; }
.detail-card-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.detail-card-head h3 { font-family: var(--font-display); font-size: 28px; font-weight: 700; }
.detail-card-head .source-chip { display: inline-block; margin: 0; background: #E8E6D5; border-radius: 3px; padding: 5px 12px; font-size: 12px; color: #647054; white-space: nowrap; }
.detail-card-head .source-fallback { color: #A06F34; background: #EFE1C7; }
.detail-reading { flex: 1; min-height: 0; margin-top: 15px; font-family: var(--font-display); font-size: 24px; line-height: 1.7; color: var(--ink); white-space: pre-wrap; overflow-y: auto; overflow-wrap: anywhere; user-select: text; }
.writing-cursor { display: inline-block; height: 1em; width: 2px; margin-left: 5px; vertical-align: -.1em; background: var(--teal); animation: pen-blink 1s steps(2,end) infinite; }
@keyframes pen-blink { 50% { opacity: 0; } }
.detail-status { font-family: var(--font-copy); font-size: 12px; color: var(--aux); margin-top: 12px; }
.detail-fallback-note { font-size: 13px; color: var(--aux); margin-top: 9px; }
.retry-link { font-size: 14px; padding: 8px 0 0; text-align: left; }
.retry-link:disabled { color: var(--aux); cursor: default; }
.page-report .report-taskbar, .page-report.compact .report-taskbar { margin-top: 18px; min-height: 120px; padding: 18px 26px; }
.reduced-motion .writing-cursor { animation: none; }
@media (max-width: 760px) {
  html, body { height: auto; min-height: 100%; overflow: auto; }
  #app { height: auto; min-height: 100vh; display: block; }
  .stage.narrow-screen { width: 100%; height: auto; min-height: 100dvh; overflow: visible; }
  .stage.narrow-screen::before { inset: 9px; }
  .narrow-screen .topbar { position: relative; height: 91px; padding: 18px 24px 0; align-items: flex-start; }
  .narrow-screen .app-logo img, .narrow-screen .app-logo-svg { width: 43px !important; height: 43px !important; }
  .narrow-screen .app-logo { gap: 10px; }
  .narrow-screen .brand-signature { font-size: 19px; }
  .narrow-screen .brand-signature span { font-size: 10px; margin-top: 4px; }
  .narrow-screen .progress-pill { font-size: 12px; padding: 7px 10px; }
  .narrow-screen .edition-mark { font-size: 10px; }
  .narrow-screen .page { position: relative; padding: 28px 24px 40px; min-height: calc(100dvh - 138px); }
  .narrow-screen .page-title { font-size: 28px; }
  .narrow-screen .page-intro { font-size: 14px; line-height: 1.7; }
  .narrow-screen .page-head-row { align-items: flex-start; flex-direction: column; gap: 10px; }
  .narrow-screen .tag-chip { font-size: 13px; padding: 6px 10px; white-space: normal; }
  .narrow-screen .page-home { flex-direction: column; gap: 28px; padding-top: 27px; }
  .narrow-screen .home-left { width: 100%; }
  .narrow-screen .home-eyebrow { font-size: 11px; margin-bottom: 18px; }
  .narrow-screen .home-title-ink { font-size: 55px; }
  .narrow-screen .home-title-teal { font-size: 31px; margin-top: 12px; }
  .narrow-screen .home-subtitle { font-size: 16px; margin-top: 17px; }
  .narrow-screen .doctor-note { margin-top: 24px; padding: 16px 0; }
  .narrow-screen .doctor-note p { font-size: 21px; }
  .narrow-screen .home-hint { width: 100%; margin-top: 24px; font-size: 18px; }
  .narrow-screen .home-card { width: 100%; height: 440px; }
  .narrow-screen .figure-heading { font-size: 16px; margin: 0 24px 8px; }
  .narrow-screen .home-card .body-figure { height: 345px; max-width: 80%; }
  .narrow-screen .figure-caption { font-size: 10px; }
  .narrow-screen .part-layout { flex-direction: column; gap: 27px; margin-top: 24px; }
  .narrow-screen .part-card { width: 100%; padding: 12px 7px; }
  .narrow-screen .seg-btn { font-size: 15px; padding: 8px 25px; }
  .narrow-screen .part-figure-wrap .body-figure { height: auto; width: 100%; max-height: 430px; }
  .narrow-screen .part-side { padding: 0; }
  .narrow-screen .side-part { font-size: 36px; min-height: 0; margin-top: 10px; }
  .narrow-screen .side-note { font-size: 14px; margin-top: 12px; }
  .narrow-screen .side-divider { margin: 18px 0; }
  .narrow-screen .btn { min-height: 56px; padding: 13px 18px; font-size: 18px; }
  .narrow-screen .btn-lg { min-width: 0; width: 100%; }
  .narrow-screen .chips-area { width: 100%; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 30px; }
  .narrow-screen .opt-chip { font-size: 18px; padding: 18px 20px; min-height: 67px; }
  .narrow-screen .page-feeling .page-footer { margin-top: 34px; padding: 0; }
  .narrow-screen .quiz-body { margin-top: 27px; }
  .narrow-screen .option-list { width: 100%; gap: 13px; }
  .narrow-screen .quiz-count { font-size: 13px; }
  .narrow-screen .summary-card { padding: 0 12px; }
  .narrow-screen .summary-table th { font-size: 12px; }
  .narrow-screen .summary-table td { font-size: 14px; line-height: 1.6; height: auto; padding: 13px 8px 13px 0; }
  .narrow-screen .summary-table .edit-link { font-size: 12px; white-space: nowrap; }
  .narrow-screen .summary-actions { flex-direction: column; margin-top: 20px; }
  .narrow-screen .subjective-layout { grid-template-columns: 1fr; gap: 32px; margin-top: 24px; }
  .narrow-screen .qr-paper { padding: 22px 18px; }
  .narrow-screen .subjective-qr { width: 240px; height: 240px; }
  .narrow-screen .pairing-code { font-size: 48px; letter-spacing: .15em; }
  .narrow-screen .paper-eyebrow { font-size: 19px; }
  .narrow-screen .subjective-state { font-size: 15px; }
  .narrow-screen .subjective-copy { font-size: 16px; }
  .narrow-screen .subjective-actions { gap: 15px; }
  .narrow-screen .scan-card { width: 100%; height: 450px; }
  .narrow-screen .scan-card .body-figure { height: 340px; }
  .narrow-screen .report-summary { flex-direction: column; gap: 17px; align-items: flex-start; padding: 18px; }
  .narrow-screen .facts-row { width: 100%; gap: 17px; }
  .narrow-screen .fact-value { font-size: 20px; }
  .narrow-screen .v-divider { height: 1px; width: 100%; }
  .narrow-screen .summary-text { font-size: 15px; }
  .narrow-screen .report-reading { grid-template-columns: 1fr; height: auto; gap: 24px; }
  .narrow-screen .report-quick { min-height: 0; }
  .narrow-screen .report-reading .report-suggestions.list .sug-slot { flex: none; min-height: 70px; padding: 13px 16px; }
  .narrow-screen .report-detail-card { min-height: 265px; padding: 22px; }
  .narrow-screen .detail-reading { flex: none; min-height: 145px; font-size: 21px; max-height: none; overflow: visible; }
  .narrow-screen .report-taskbar { flex-direction: column; align-items: stretch; gap: 18px; padding: 22px; }
  .narrow-screen .task-lead { width: auto; min-width: 0; }
  .narrow-screen .task-name { font-size: 24px; }
  .narrow-screen .task-instructions { font-size: 16px; }
  .narrow-screen .btn-task { min-width: 0; width: 100%; }
  .narrow-screen .countdown-wrap { width: 290px; height: 290px; margin: 44px auto 0; }
  .narrow-screen .countdown-number { font-size: 94px; }
  .narrow-screen .task-line { font-size: 22px; margin-top: 32px; }
  .narrow-screen .page-buff { padding-top: 40px; }
  .narrow-screen .badge { width: 270px; height: 270px; }
  .narrow-screen .buff-name { font-size: 32px; }
  .narrow-screen .buff-text { font-size: 18px; }
  .narrow-screen .buff-reward, .narrow-screen .buff-countdown { font-size: 14px; }
  .narrow-screen .buff-countdown { padding: 12px 16px; }
  .narrow-screen .legal-note { position: relative; left: auto; right: auto; bottom: auto; font-size: 10px; line-height: 1.6; margin: 0 24px; padding-bottom: 21px; }
}
/* 200 字正文优先在卡片内完整阅读，长段落仍可滚动。 */
.detail-reading { font-size: 21px; line-height: 1.55; }
.report-detail-card:has(.detail-fallback-note) .detail-reading { font-size: 19px; line-height: 1.5; }
.report-detail-card:has(.detail-fallback-note) { padding-top: 16px; padding-bottom: 16px; }
.report-detail-card:has(.detail-fallback-note) .detail-status { margin-top: 8px; }
.report-detail-card:has(.detail-fallback-note) .detail-fallback-note { margin-top: 5px; }
@media (max-width:760px) { .narrow-screen .detail-reading { font-size:21px; line-height:1.7; } }

.page-queue { display: flex; align-items: center; justify-content: center; }
.queue-panel { width: 880px; padding: 64px; text-align: center; border: 1px solid #d6c8a9; background: #fcf8ed; box-shadow: 0 16px 50px rgba(51,62,48,.06); }
.queue-seal { display:inline-block; border:2px solid #9d4432; color:#9d4432; padding:8px 16px; margin-bottom:24px; font-family:var(--font-display); font-size:30px; }
.queue-number { color:#9d4432; font-size:24px; margin:36px 0; }
.queue-number strong { font-size:60px; margin-left:16px; }
.queue-panel .btn { margin-top:36px; }