/* Approved mobile flow refinements, 2026-09-28. Timeline and chart geometry stay unchanged. */
@media screen {
  /* 农历闰月属于出生日期：桌面独占末行，手机紧跟日期；hidden 仍由历法控制。 */
  .birth-grid > .leap-control {
    display:grid; grid-column:1 / -1; grid-template-columns:78px minmax(0,1fr);
    align-items:center; gap:10px; order:1; justify-content:normal;
    color:var(--theme-text-secondary, #d2d8e4); font-size:14px; cursor:pointer;
  }
  .leap-control .leap-option {
    display:flex; align-items:center; gap:10px; min-width:0; min-height:46px; padding:10px 12px;
    border:1px solid var(--theme-border-control, #52627d); border-radius:8px;
    background:var(--theme-surface-card, rgba(7,20,39,.35));
  }
  .leap-option input { flex:0 0 16px; width:16px; height:16px; margin:0; accent-color:var(--theme-icon-accent, var(--gold-dark)); }
  .leap-option > span { white-space:nowrap; }
  .leap-option:focus-within { outline:2px solid var(--theme-border-accent, #e2bd67); outline-offset:3px; }
  .birth-field-error, #configure-view .option-error {
    display:flex; align-items:flex-start; gap:7px; margin:6px 0 0;
    color:var(--theme-text-error, #ff9c8f); font:400 12px/1.6 var(--sans);
  }
  .birth-field-error::before, #configure-view .option-error::before {
    content:'!'; flex:0 0 14px; height:14px; margin-top:3px; border-radius:50%;
    background:var(--theme-text-error, #ff9c8f); color:var(--theme-text-on-error, #14243b);
    font:bold 11px/14px sans-serif; text-align:center;
  }
  #birth-view [aria-invalid="true"], #configure-view #relationship-status[aria-invalid="true"],
  #yearly-work-options[aria-invalid="true"] .choice-chip span {
    border-color:var(--theme-border-error, #ee8274);
  }
  .birth-form .field, #configure-view .option-section { scroll-margin-block:90px; }
  #birth-view :is(input,button):focus-visible, #report-directory button:focus-visible {
    outline:2px solid var(--theme-border-accent, #e2bd67); outline-offset:3px;
  }

  /* The existing wheel mechanics and dimensions are shared by both themes. */
  .wheel-sheet { color:var(--theme-text-primary, #eef2f8); background:var(--theme-surface-card, #102137); border-color:var(--theme-border-control, #526783); }
  .wheel-head { background:var(--theme-surface-navigation, #102137); border-color:var(--theme-border-subtle, #3b5068); }
  .wheel-head button { color:var(--theme-text-accent, #e8cb83); }
  .wheel-head [data-wheel-action="confirm"] { padding:0 14px; border-radius:8px; background:var(--theme-surface-selected, #e4c981); color:var(--theme-text-primary, #182338); }
  .wheel-modes button { flex:1; min-height:44px; color:var(--theme-text-secondary, #bdcadd); border-color:var(--theme-border-control, #62758e); }
  .wheel-modes button[aria-pressed="true"] { color:var(--theme-text-accent, #f0d58d); background:var(--theme-surface-selected, #283744); border-color:var(--theme-border-accent, #d6b970); }
  .wheel-option { color:var(--theme-text-secondary, #b6c4d8); }
  /* Masked columns form stacking contexts: lift the whole text grid above the single band. */
  .wheel-scroll { --wheel-inline-inset:20px; isolation:isolate; }
  .wheel-columns { position:relative; z-index:1; padding-inline:var(--wheel-inline-inset); }
  .wheel-option.selected { color:var(--theme-text-primary, #f0d58d); background:transparent; }
  .wheel-highlight {
    z-index:0; left:var(--wheel-inline-inset); right:var(--wheel-inline-inset);
    border-color:var(--theme-border-accent, #9f8d62);
    background:var(--theme-surface-selected, #283744); box-shadow:none;
  }
  .wheel-manual label, .wheel-search { color:var(--theme-text-secondary, #bdcadd); }
  .wheel-manual input, .wheel-search input { color:var(--theme-text-primary, #eef2f8); background:var(--theme-surface-card, #182c44); border-color:var(--theme-border-control, #62758e); }
  .wheel-search input::placeholder { color:var(--theme-text-secondary, #aebdd2); opacity:1; }
  .wheel-error { color:var(--theme-text-error, #ffaca1); background:var(--theme-surface-error, #382a34); }

  .report-bottom-bar {
    display:grid; grid-template-columns:repeat(3,minmax(0,230px)); gap:6px 12px;
    background:var(--theme-surface-navigation, #0b182b); border-color:var(--theme-border-subtle, #425369);
  }
  .report-bottom-bar > button { color:var(--theme-text-accent, #eed18b); border-color:var(--theme-border-entry, #ac9460); }
  .report-bottom-bar > .gold-button { color:var(--theme-text-primary, #152236); background:var(--theme-surface-selected, #e0c37e); }
  #report-view { padding-bottom:calc(112px + env(safe-area-inset-bottom)); }
  #report-directory {
    inset:auto auto calc(106px + env(safe-area-inset-bottom)) 50%; margin:0; padding:16px;
    max-height:min(65dvh,calc(100dvh - 138px - env(safe-area-inset-bottom)));
    color:var(--theme-text-primary, #edf2f8); background:var(--theme-surface-card, #102137);
    border-color:var(--theme-border-control, #526783); overflow:hidden;
  }
  #report-directory[open] { display:flex; flex-direction:column; }
  #report-directory::backdrop { background:var(--theme-overlay-scrim, rgba(2,7,18,.62)); }
  .directory-head { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-shrink:0; }
  #report-directory h2 { margin:0; }
  #report-directory #directory-close { width:auto; min-height:44px; padding:8px; border:0; color:var(--theme-text-secondary, #bdcadd); font-size:14px; }
  .directory-links { min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#61748c transparent; padding:4px; }
  #report-directory [data-reading-target], #report-directory #directory-chart {
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    min-height:44px; margin-top:6px; padding:10px 12px; border:1px solid var(--theme-border-control, #40546e);
    border-radius:8px; color:var(--theme-text-primary, #e4ebf5); font-size:14px; line-height:1.6;
  }
  #report-directory [aria-current="location"] { border-color:var(--theme-border-accent, #dec17b); color:var(--theme-text-accent, #eed18b); background:var(--theme-surface-selected, #253548); }
  #report-directory small { flex-shrink:0; font-size:12px; }
  #report-directory #directory-chart { border:0; color:var(--theme-text-secondary, #bdcadd); }

  .generation-status { text-align:left; border:1px solid var(--theme-border-control, #62758e); border-radius:12px; padding:18px; background:var(--theme-surface-card, rgba(13,31,51,.8)); }
  .generation-status #progress-message { margin:0; color:var(--theme-text-primary, #eef2f8); font-size:16px; line-height:1.65; overflow-wrap:anywhere; }
  .generation-status small { display:block; color:var(--theme-text-secondary, #bdcadd); line-height:1.8; }
  .generation-status .progress-track { height:6px; border-radius:3px; margin:16px 0; overflow:hidden; }
  #progress-overlay[data-recovery="true"] .generation-status { border-color:var(--theme-border-error, #c07971); }
  #job-error-details { margin-top:12px; color:var(--theme-text-secondary, #bdcadd); font-size:12px; line-height:1.7; overflow-wrap:anywhere; }
  #job-error-details summary { cursor:pointer; }
  #job-error-detail { white-space:pre-wrap; }
  /* 为背景 Canvas 中唯一的天体留出空间，不再叠加第二套动画。 */
  .generation-visual { height:320px; margin:20px 0 24px; }
  .generating-view .progress-card h2 { margin:0 0 10px; }
  .generating-view #job-context { margin:0; font-size:14px; white-space:pre-line; overflow-wrap:anywhere; }
  .job-actions { display:grid; grid-template-columns:1fr; gap:10px; margin-top:18px; }
  .job-actions button { width:100%; min-height:44px; }
  .job-actions #job-abandon { color:var(--theme-text-secondary, #aebdd2); border-color:transparent; background:transparent; font-size:12px; }
  .job-actions button:disabled { cursor:wait; opacity:.65; }
}
@media screen and (max-width:680px) {
  /* 紧凑主导航：44px触控区域，保留手机实际安全区。 */
  #bottom-nav { padding:4px 20px max(4px,env(safe-area-inset-bottom)); }
  #bottom-nav button { min-height:44px; padding:0; align-content:center; gap:2px; font-size:12px; line-height:14px; }
  #bottom-nav svg { width:20px; height:20px; }
  body[data-signed-in="true"] :is(#home-view,#library-view,#mine-view,#profiles-view) { padding-bottom:calc(73px + env(safe-area-inset-bottom)); }
  .birth-grid > .leap-control { order:0; font-size:12px; }
  .leap-control .leap-option { min-height:44px; padding:9px 8px; gap:6px; }
  .wheel-scroll { --wheel-inline-inset:12px; }
  #birth-view .birth-section-label { flex-direction:column; align-items:flex-start; gap:6px; }
  #birth-view .birth-grid { grid-template-columns:minmax(0,1fr); gap:10px; }
  #birth-view .birth-grid > .field { grid-template-columns:78px minmax(0,1fr); align-items:center; gap:6px 10px; }
  #birth-view .birth-grid > .field > :not(span:first-child):not(.birth-field-error) { grid-column:2; min-width:0; }
  #birth-view :is(.field input:not(.native-select-proxy):not([type="radio"]):not([type="checkbox"]),.wheel-trigger) { min-height:44px; font-size:16px; }
  .birth-form .field > span:first-child { line-height:1.5; }
  #birth-view .birth-grid .birth-field-error { grid-column:2; }
  .wheel-dialog { align-items:end; }
  .wheel-head { gap:8px; }
  .wheel-head h2 { font-size:16px; text-align:center; }
  .generating-view { padding-top:82px; }
  .generating-view .generation-visual { height:clamp(220px,64vw,300px); margin:16px 0 20px; }
  .generating-view .progress-card h2 { font-size:24px; }
  .generation-status { padding:16px; }
  .report-bottom-bar { gap:6px 10px; }
}