/* 01 · 共用阅读尺度：装饰、说明、操作和正文各有层级，不按 small/span 标签一刀切。 */
:root {
  --text-body: 16px;
  --text-action: 15px;
  --text-help: 14px;
  --text-caption: 12px;
  --ink-reading: #456079;
  --ink-secondary: #65726f;
  --ink-warm: #79634e;
  --ink-action: #795047;
  --paper-control: #f8f0df;
  --paper-edge: #bba378;
}

/* 02 · 常驻导航能被看见、也有足够点击空间；品牌、主标题和物件装饰不参与放大。 */
.site-header #motion-toggle {
  font-size: var(--text-help);
  line-height: 1.5;
  min-height: 40px;
  padding: 8px 12px;
  color: var(--ink-warm);
  border: 1px solid #b9a78a;
  border-radius: 5px 8px 5px 7px;
  background: #f9f4e9c9;
}
.site-header .nav-link { font-size: var(--text-action); color: var(--ink-reading); padding: 10px 6px; }
.site-header .map-return { font-size: var(--text-action); min-height: 44px; }
.site-header .map-return small { font-size: var(--text-caption); color: var(--ink-warm); }
.site-footer { gap: 14px; flex-wrap: wrap; line-height: 1.8; }
.site-footer > span { font-size: 11px; color: var(--ink-secondary); }
.site-footer .status { font-size: var(--text-caption); }
.skip-animation, .tarot-travel > button, .ticket-atlas-transition > button,
.paper-route-transition > button, .cinema-exit-transition > button {
  font-size: var(--text-help); min-height: 44px; padding: 10px 16px;
}

/* 03 · 欢迎页保留英文眉题、牌名和编号；辅助句可阅读，次要操作改成轻纸签。 */
.tarot-eyebrow { font-size: 10px; color: #806858; }
.tarot-intro > p { font-size: var(--text-help); color: var(--ink-warm); letter-spacing: .06em; }
.tarot-summon-copy small { font-size: 11px; color: var(--ink-warm); letter-spacing: .04em; }
.tarot-summon-copy strong { font-size: 17px; letter-spacing: .1em; }
.tarot-summon { width: 328px; }
.tarot-summon-paper { gap: 12px; padding-inline: 17px; }
.tarot-draw-skip, .tarot-replay {
  font-size: var(--text-help); line-height: 1.5; min-height: 40px;
  padding: 9px 14px; border: 1px solid var(--paper-edge);
  border-radius: 3px 7px 3px 5px; background: #faf4e8e8; color: var(--ink-action);
}
.tarot-replay { bottom: 3%; }
.tarot-guidance { padding-inline: 20px; }
.tarot-instruction { font-size: var(--text-help); color: var(--ink-warm); letter-spacing: .04em; }
.tarot-choice-note { font-size: var(--text-caption); color: var(--ink-secondary); letter-spacing: .05em; }
.tarot-card-route { font-size: var(--text-action); color: var(--ink-action); font-weight: 600; }
.tarot-card-description { font-size: var(--text-caption); color: var(--ink-warm); letter-spacing: 0; line-height: 1.5; }
.tarot-card-label { top: 61%; }
.tarot-card-illustration { height: 47%; }

/* 04 · 验证票：保留小票根质感，把真正的表单入口、错误和核对结果提到阅读层。 */
.paper-verification .back-link {
  display: inline-block; font-size: var(--text-help); padding: 9px 12px;
  border: 1px solid var(--paper-edge); background: #f8f2e5bd; color: var(--ink-action);
}
.paper-verify-intro > span { font-size: 10px; color: #806858; }
.paper-verify-intro > p { font-size: var(--text-help); color: var(--ink-warm); letter-spacing: .06em; }
.paper-ticket-stub p { font-size: var(--text-caption); color: var(--ink-warm); }
.paper-section-number, .paper-ticket-form .demo-badge { font-size: var(--text-caption); color: var(--ink-warm); }
.paper-form-caption { font-size: var(--text-help); color: var(--ink-secondary); }
.credential-tabs button { font-size: var(--text-action); min-height: 46px; padding: 12px 14px; gap: 8px; }
.credential-tabs button[aria-selected=true] { color: var(--ink-action); font-weight: 600; }
.credential-tabs button small { font-size: 9px; }
.credential-page label { font-size: var(--text-help); color: var(--ink-warm); }
.paper-ticket-form .code-field input::placeholder { font-size: var(--text-action); color: #7e786b; }
.paper-ticket-form .demo-help { font-size: var(--text-help); line-height: 1.9; color: var(--ink-secondary); }
.paper-ticket-form .demo-help button {
  display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px;
  font-size: var(--text-action); min-height: 42px; margin-top: 5px; padding: 7px 10px;
  border: 1px solid var(--paper-edge); border-radius: 3px; background: var(--paper-control); color: var(--ink-action);
}
.paper-ticket-form .demo-help button span { font-size: var(--text-caption); color: inherit; }
.paper-ticket-form .upload-zone { min-height: 160px; padding: 14px; gap: 8px; }
.paper-ticket-form .upload-zone strong { font-size: var(--text-action); color: var(--ink-reading); }
.paper-ticket-form .upload-zone > span:not(.paper-file-icon) { font-size: var(--text-help); color: var(--ink-warm); text-align: center; }
.paper-ticket-form .upload-zone small { font-size: var(--text-caption); color: var(--ink-secondary); text-align: center; line-height: 1.8; }
.paper-ticket-form .file-row { font-size: 13px; color: var(--ink-secondary); align-items: center; gap: 10px; }
.paper-ticket-form .file-row button {
  flex-shrink: 0; font-size: var(--text-help); min-height: 40px; padding: 6px 12px;
  border: 1px solid #b48d7d; border-radius: 3px; background: #f9efe4; color: var(--ink-action);
}
.paper-ticket-form .form-error { font-size: var(--text-help); color: #8b3e34; line-height: 1.9; }
.paper-ticket-form .form-error:not(:empty) { padding: 9px 12px; border-left: 3px solid #a86755; background: #ebd2bc55; }
.paper-verification-status { font-size: var(--text-help); color: var(--ink-reading); line-height: 1.8; min-height: 25px; }
.paper-verification[data-ticket-phase=accepted] .paper-verification-status { color: #42654d; font-weight: 600; }
.paper-ticket-submit small { font-size: 11px; color: var(--ink-warm); }
.paper-ticket-submit strong { font-size: var(--text-body); }
.paper-demo-note { font-size: var(--text-caption); color: var(--ink-secondary); line-height: 1.9; }
.paper-verify-footnote { font-size: var(--text-caption); color: var(--ink-warm); letter-spacing: .05em; }

/* 05 · 星图保留散布式构图，入口标签常驻纸面；形状与文字一起表明能进入展区。 */
.map-heading p { font-size: var(--text-help); color: var(--ink-secondary); letter-spacing: .06em; }
.start-caption { font-size: 13px; color: var(--ink-warm); letter-spacing: 0; white-space: normal; line-height: 1.7; }
.chart-caption { font-size: var(--text-caption); color: var(--ink-secondary); letter-spacing: .08em; }
.portal-label > span:first-child {
  display: block; font-size: var(--text-help); line-height: 1.7; color: var(--ink-reading);
  white-space: normal; padding: 5px 10px; border: 1px solid #c5b38c;
  border-radius: 4px 7px 3px 6px; background: #fffaf0eb;
}
.map-portal .portal-drag-hint { font-size: 13px; }
.map-legend { font-size: 13px; color: var(--ink-warm); line-height: 1.9; }
.map-note { color: var(--ink-reading); }
.author-entry-label { font-size: var(--text-action); min-height: 36px; line-height: 1.8; padding: 4px 10px; }
.gap-invitation { font-size: 13px; color: var(--ink-reading); padding: 4px 8px; background: #fffaf0f0; border-radius: 3px; }

/* 06 · 展区的内容、操作与数字分工：作品索引像按钮，当前计数保持只读排版。 */
.exhibition-heading .map-eyebrow { font-size: 10px; color: #806b4c; }
.exhibition-heading p { font-size: var(--text-help); color: var(--ink-secondary); line-height: 1.8; }
.exhibition-side-note { font-size: var(--text-help); color: var(--ink-warm); line-height: 1.8; }
.exhibition-footnote { font-size: var(--text-caption); color: var(--ink-secondary); line-height: 1.9; }
.exhibit-help, .orbit-controls .exhibit-help, .album-help {
  font-size: var(--text-help); line-height: 1.9; color: var(--ink-warm); letter-spacing: 0;
}
.selection-count { font-size: var(--text-caption); color: var(--ink-warm); }
.selection-description { font-size: var(--text-body); color: var(--ink-reading); line-height: 1.9; }
.selection-note .exhibit-open { font-size: var(--text-action); min-height: 44px; }
.orbit-controls button { font-size: var(--text-action); min-height: 44px; }
.compass-work-label { font-size: 15px; color: var(--ink-reading); }
.bearing-mark { font-size: 11px; color: var(--ink-warm); }
.canvas-label small { font-size: var(--text-caption); color: var(--ink-warm); }
.atelier-index { flex-wrap: wrap; gap: 8px; }
.atelier-index button {
  font-size: var(--text-help); min-height: 44px; min-width: 44px;
  padding: 8px 12px; border: 1px solid #c7b794; border-radius: 3px;
  background: #faf5e9; color: var(--ink-reading);
}
.atelier-index button span { font-size: var(--text-help); }
.atelier-index button small { font-size: 13px; color: var(--ink-secondary); }
.atelier-index button[aria-pressed=true], .album-index button[aria-pressed=true] {
  color: var(--ink-action); border-color: #a77a5e; background: #eee0c5; font-weight: 600;
}
.album-cover-prompt, .album-closed-hint { font-size: var(--text-help); color: var(--ink-warm); line-height: 1.8; letter-spacing: 0; }
.album-cover-front > small { color: #f2e4c5; }
/* 蓝布封面的文字沿用浅墨，不能套用奶白纸上的棕色正文。 */
.album-cover-front .album-cover-prompt { color: #fff5df; }
.album-close { font-size: var(--text-help); min-height: 42px; padding: 9px 13px; }
.album-piece-number, .album-note-eyebrow { font-size: var(--text-caption); color: var(--ink-warm); }
.album-note-content p { font-size: var(--text-body); color: var(--ink-reading); line-height: 1.9; }
.album-note-content .album-detail { font-size: var(--text-action); min-height: 44px; padding: 8px 12px; border: 1px solid #baa47b; background: #f8efd9; border-radius: 3px; }
.album-page-count { font-size: var(--text-action); color: var(--ink-warm); }
.album-controls button { min-width: 44px; min-height: 44px; }
.album-index { flex-wrap: wrap; gap: 8px; }
.album-index button { font-size: var(--text-help); min-width: 44px; min-height: 44px; padding: 8px; border: 1px solid #c7b794; border-radius: 3px; background: #faf5e9; color: var(--ink-reading); }

/* 功能区高于可拖动导游，导航仍在最上方；滚动定位给固定页头和评价面板留空间。 */
.exhibition-page :is(.orbit-controls, .selection-note, .atelier-index, .album-open-tools) {
  position: relative; z-index: 26;
}
body[data-gallery-mode=category] .site-header { z-index: 35; }
.exhibition-page :is(button, [role=slider]), .gallery-map a {
  scroll-margin-top: 140px;
  scroll-margin-bottom: calc(var(--feedback-space, 176px) + 24px);
}

/* 07 · 详情与评价：正文留够行距，发送结果单独可见；固定面板高度与预留空间共用变量。 */
.dialog-body > .eyebrow, .dialog-body .demo-badge { font-size: var(--text-caption); color: var(--ink-warm); }
.dialog-body > p, .behind-scenes p { font-size: var(--text-body); line-height: 1.9; color: var(--ink-reading); }
.dialog-body .preview-note { font-size: 13px; color: var(--ink-secondary); }
.behind-scenes h3 { font-size: var(--text-body); }
.locked-detail #dialog-verify { display: inline-block; font-size: var(--text-action); line-height: 1.8; min-height: 44px; padding: 10px 12px; margin-top: 8px; border: 1px solid var(--paper-edge); background: var(--paper-control); color: var(--ink-action); }
.feedback-dock { --feedback-panel-height: 164px; }
.feedback-panel { gap: 7px; }
.feedback-panel label { font-size: var(--text-action); color: var(--ink-reading); }
.feedback-panel textarea { font-size: var(--text-body); }
.feedback-panel textarea::placeholder { color: #737b72; }
.feedback-toggle { font-size: var(--text-help); height: 40px; top: -44px; color: var(--ink-reading); }
.feedback-send { font-size: var(--text-action); min-height: 40px; }
.feedback-counter { font-size: var(--text-caption); color: var(--ink-secondary); }
.feedback-status { font-size: 13px; line-height: 1.7; color: #48654f; }
.guide-chat p { font-size: var(--text-action); line-height: 1.9; color: var(--ink-reading); }
.guide-chat a { display: inline-block; font-size: var(--text-action); min-height: 40px; padding-block: 8px; color: var(--ink-action); text-decoration: underline; text-underline-offset: 5px; }

/* 08 · 影院保留胶片微字和暗场；导航、叙事副句、长按提示与反馈采用独立的暖灰阅读层。 */
.dark-cinema { --cinema-ink: #d7cebc; --cinema-muted: #b2a99a; }
.cinema-nav { font-size: var(--text-help); color: var(--cinema-ink); inset: 20px 28px auto; }
.cinema-nav a, .cinema-nav button { min-height: 44px; padding: 10px; }
.cinema-nav > span { font-size: 10px; color: #9e9483; }
.cinema-chapter { font-size: 13px; color: var(--cinema-muted); }
.cinema-note { font-size: var(--text-body); color: var(--cinema-ink); line-height: 1.9; letter-spacing: .06em; }
.dark-cinema .cinema-hold { font-size: var(--text-body)!important; color: #ede3d2; }
.cinema-interaction p { font-size: 13px; line-height: 1.8; color: var(--cinema-muted); margin: 12px auto; padding-inline: 20px; max-width: 620px; }
.dark-cinema .cinema-next { font-size: var(--text-help)!important; color: var(--cinema-ink)!important; min-height: 44px; border: 1px solid #897b635e; padding: 9px 15px; background: #18161088; }
.cinema-footer { font-size: var(--text-help); color: var(--cinema-ink); bottom: 18px; }
.cinema-footer button { min-height: 44px; padding: 10px 12px; border-bottom: 1px solid #897b635e; }
.dark-cinema .cinema-opening-skip { font-size: var(--text-help)!important; min-height: 44px; }
.cinema-letter label { font-size: var(--text-action); color: var(--cinema-ink); }
.cinema-letter textarea { font-size: var(--text-body); color: #ede3d2; }
.cinema-letter textarea::placeholder { color: #a59c8f; }
.cinema-message-status { font-size: 13px; line-height: 1.8; color: var(--cinema-muted); }
.cinema-letter button { font-size: var(--text-action); min-height: 44px; border: 1px solid #897b6377; padding: 9px 12px; }
.cinema-exit-dialog #cinema-exit-note { font-size: var(--text-help); color: #b9afba; }
.cinema-exit-dialog button { font-size: var(--text-action); min-height: 44px; }
.cinema-exit-dialog .cinema-exit-confirm { color: #c3b6c0; }

/* 09 · 手机保留相同层级，不再把功能字缩回8px；局部换行和空间补偿由各容器承担。 */
@media (max-width: 700px) {
  :root { --text-action: 14px; --text-help: 13px; }
  .site-header nav { gap: 6px; }
  .site-header #motion-toggle { padding: 7px 9px; min-height: 44px; }
  .site-header .nav-link { padding-inline: 3px; }
  .site-header .map-return { font-size: 14px; }
  .site-footer > span, .site-footer .status { font-size: 11px; }
  .tarot-intro > p { font-size: var(--text-help); }
  .tarot-summon { width: 296px; }
  .tarot-summon-copy small { font-size: 11px; }
  .tarot-summon-copy strong { font-size: 16px; }
  .tarot-draw-skip { top: 72px; min-height: 44px; }
  .tarot-replay { bottom: 12px; left: 5%; min-height: 44px; }
  .tarot-guidance { bottom: 75px; padding-inline: 5%; }
  .tarot-card-label { top: 53%; left: 5%; right: 5%; }
  .tarot-card-illustration { height: 39%; }
  .tarot-card-face strong { font-size: clamp(18px,10cqw,25px); line-height: 1.3; }
  .tarot-card-route { font-size: 14px; line-height: 1.4; margin-top: 3px; letter-spacing: 0; }
  .tarot-card-description { font-size: 12px; line-height: 1.4; margin-top: 4px; }
  .tarot-card-foot { top: 5%; bottom: auto; left: auto; right: 6%; }
  .paper-verify-intro > p, .paper-form-caption { font-size: var(--text-help); }
  .paper-ticket .paper-ticket-form { padding: 23px 18px; }
  .credential-tabs { padding-right: 0; gap: 6px; }
  .credential-tabs button { padding: 10px 9px; font-size: 14px; min-height: 46px; gap: 5px; }
  .credential-tabs button small { display: none; }
  .credential-page { padding: 20px 12px 18px; }
  .paper-ticket-submit strong { font-size: var(--text-body); letter-spacing: .03em; }
  .paper-demo-note, .paper-verify-footnote { font-size: var(--text-caption); }
  .map-heading p { font-size: var(--text-help); }
  .start-caption { font-size: var(--text-caption); }
  .portal-label > span:first-child { font-size: var(--text-help); padding: 5px 8px; }
  .chart-caption { font-size: 11px; letter-spacing: 0; }
  .map-legend { font-size: 13px; }
  .gap-invitation { font-size: var(--text-caption); }
  .exhibition-heading .map-eyebrow { font-size: 10px; letter-spacing: .08em; }
  .exhibition-heading p, .exhibition-side-note { font-size: var(--text-help); }
  .exhibition-footnote { font-size: var(--text-caption); }
  .compass-work-label { font-size: 13px; line-height: 1.5; }
  .bearing-mark { font-size: 10px; }
  .orbit-controls button { font-size: var(--text-action); white-space: normal; }
  .selection-description { font-size: var(--text-body); }
  .canvas-label small { font-size: 11px; }
  .atelier-index button { padding: 8px 12px; }
  .album-cover-prompt, .album-closed-hint { font-size: var(--text-help); }
  .album-close { font-size: var(--text-action); min-height: 44px; }
  .album-stage { margin-top: 52px; }
  .album-note-content p { font-size: var(--text-body); }
  .album-mobile-notes .album-note-content p { font-size: var(--text-body); }
  .album-mobile-notes .album-note-eyebrow { font-size: var(--text-caption); color: var(--ink-warm); }
  .album-note-content .album-detail { font-size: var(--text-action); }
  .album-help { font-size: var(--text-help); }
  .feedback-dock { --feedback-panel-height: 176px; }
  .feedback-panel { padding-top: 12px; }
  .feedback-actions { flex-wrap: wrap; gap: 6px 12px; }
  .feedback-status:not(:empty) { flex-basis: 100%; }
  .feedback-counter { margin-left: auto; }
  .cinema-nav { inset: 14px 10px auto; font-size: var(--text-help); }
  .cinema-chapter { font-size: 13px; }
  .cinema-note { font-size: 15px; }
  .cinema-interaction { top: 67%; }
  .cinema-footer { bottom: 12px; left: 12px; right: 12px; font-size: var(--text-help); }
  .cinema-letter { top: 65%; }
  .cinema-letter > div { flex-wrap: wrap; gap: 8px; }
  .cinema-message-status { flex: 1 1 100%; font-size: 13px; }
  .cinema-letter button { margin-left: auto; }
}

/* 10 · 影院绝对定位的阅读区域在矮屏改为可滚动纵向布局，防止放大后操作互相覆盖。 */
@media (max-height: 800px) {
  /* Canvas主句和HTML说明共用720px舞台，一起滚动，避免两套百分比在矮屏相撞。 */
  .dark-cinema { --cinema-reading-height: 720px; }
  .dark-cinema::after { content: ''; display: block; height: 820px; pointer-events: none; }
  .dark-cinema .cinema-canvas { position: absolute; height: var(--cinema-reading-height); }
  .dark-cinema .cinema-chapter { top: 130px; }
  .dark-cinema .cinema-progress { top: 173px; }
  .dark-cinema .cinema-caption { top: 418px; }
  .dark-cinema .cinema-interaction { top: 490px; }
  .dark-cinema .cinema-letter { top: 475px; }
  .dark-cinema .cinema-footer { position: absolute; top: 748px; bottom: auto; }
}

/* 320px窄屏先让出牌内插画空间，保持入口与说明字号，不把正文重新缩成微字。 */
@media (max-width: 360px) {
  .tarot-card-label { top: 47%; }
  .tarot-card-illustration { height: 32%; }
}