/* Shared presentation layer for 时光笺. It changes no timeline behaviour. */
.timeline-page, .timeline-stage-page, .timeline-point-page {
  --timeline-ink: var(--lab-ink, #202635);
  --timeline-muted: var(--lab-muted, #6c7484);
  --timeline-line: var(--lab-line, #e5e8ef);
  --timeline-accent: var(--lab-accent, #4257c8);
  color: var(--timeline-ink);
}
.timeline-page h3, .timeline-page h5, .timeline-page h6 { color: var(--timeline-ink); }
.timeline-panel, .timeline-stage-panel, .timeline-point-panel {
  display: block;
  border: 1px solid var(--timeline-line) !important;
  border-radius: var(--lab-radius-md, 18px) !important;
  background: #fff;
  box-shadow: 0 8px 22px rgba(32, 38, 53, .045) !important;
}
.timeline-page-header { padding-bottom: .85rem; border-bottom: 1px solid var(--timeline-line) !important; }
.timeline-icon-button, .timeline-secondary-button, .timeline-edit-button {
  border-color: var(--timeline-line) !important;
  border-radius: 10px !important;
  color: var(--timeline-muted) !important;
}
.timeline-primary-button, .timeline-stage-action, .timeline-point-action {
  border-color: var(--timeline-accent) !important;
  border-radius: 10px !important;
  background: var(--timeline-accent) !important;
  color: #fff !important;
  box-shadow: none !important;
}
.timeline-primary-button:hover, .timeline-stage-action:hover, .timeline-point-action:hover {
  border-color: #3449bb !important;
  background: #3449bb !important;
  color: #fff !important;
}
.timeline-summary .border-end { border-color: var(--timeline-line) !important; }
.timeline-meta, .timeline-record-meta { color: var(--timeline-muted) !important; }
.timeline-group-icon, .timeline-date { border-color: var(--timeline-line) !important; border-radius: 10px !important; background: #f8f9fc !important; }
.group-card, .timeline-record-card, .timeline-stage-record { transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease; }
.group-card:hover, .timeline-record-card:hover, .timeline-stage-record:hover { transform: translateY(-1px); background: #fbfcff !important; box-shadow: var(--lab-shadow, 0 12px 30px rgba(32, 38, 53, .08)) !important; }
.timeline-narrative { padding: 1.15rem !important; }.timeline-narrative-empty { border-color: #aab5e9 !important; border-radius: var(--lab-radius-md, 18px) !important; color: var(--timeline-accent) !important; background: #f8f9ff !important; }.timeline-narrative .wr-preview, .timeline-narrative .wr-action { color: var(--timeline-muted) !important; }
.timeline-modal { border-color: var(--timeline-line) !important; border-radius: var(--lab-radius-md, 18px) !important; }.timeline-modal .modal-header { border-color: var(--timeline-line) !important; }
.timeline-page .form-control:focus, .timeline-stage-page .form-control:focus, .timeline-point-page .form-control:focus { border-color: #aab5e9; box-shadow: 0 0 0 .2rem rgba(66, 87, 200, .12); }
.timeline-stage-page { max-width: 760px; }.timeline-stage-page .stage-highlight { border-left-color: var(--timeline-accent) !important; }.timeline-stage-page .stage-analysis-block { border-left-color: #aab5e9 !important; }.timeline-point-page { max-width: 760px; margin: 0 auto; }.timeline-point-page h3 { color: var(--timeline-ink) !important; }

/* Preview-aligned editorial layer: shared by the live timeline pages. */
.timeline-page, .timeline-stage-page, .timeline-point-page, .timeline-global-container { --timeline-ink: #23332d; --timeline-muted: #718078; --timeline-line: #dfe8e2; --timeline-accent: #247264; --timeline-wash: #f2f8f4; }
.timeline-page, .timeline-stage-page, .timeline-point-page, .timeline-global-container { color: var(--timeline-ink); }
.timeline-page-header { padding-bottom: 1.25rem; margin-bottom: 2.25rem !important; border-bottom: 1px solid var(--timeline-line) !important; }
.timeline-panel, .timeline-stage-panel, .timeline-point-panel { border-color: var(--timeline-line) !important; border-radius: 8px !important; box-shadow: none !important; }
.timeline-page h3, .timeline-page h5, .timeline-page h6, .timeline-stage-page h3, .timeline-stage-page h4, .timeline-point-page h3 { color: var(--timeline-ink) !important; letter-spacing: -.02em; }
.timeline-icon-button, .timeline-secondary-button, .timeline-edit-button { border-color: var(--timeline-line) !important; border-radius: 6px !important; color: var(--timeline-ink) !important; background: #fff !important; }
.timeline-primary-button, .timeline-stage-action, .timeline-point-action { border-color: var(--timeline-accent) !important; border-radius: 6px !important; background: var(--timeline-accent) !important; color: #fff !important; box-shadow: none !important; }
.timeline-primary-button:hover, .timeline-stage-action:hover, .timeline-point-action:hover { background: #1d5b50 !important; }
.timeline-meta, .timeline-record-meta, .timeline-page .text-muted, .timeline-stage-page .text-muted, .timeline-point-page .text-muted { color: var(--timeline-muted) !important; }
.timeline-summary { background: transparent !important; border: 0 !important; }
.timeline-summary .border-end { border-color: var(--timeline-line) !important; }
.timeline-summary .h3 { font-weight: 550 !important; }
.group-card, .timeline-record-card, .timeline-stage-record { border-radius: 0 !important; border-width: 0 0 1px !important; transition: color .16s ease, background-color .16s ease; }
.group-card:hover, .timeline-record-card:hover, .timeline-stage-record:hover { transform: none !important; background: var(--timeline-wash) !important; box-shadow: none !important; }
.timeline-narrative { padding: 1.5rem !important; border-radius: 8px !important; background: var(--timeline-wash) !important; border-color: var(--timeline-line) !important; }
.timeline-narrative-empty { border: 1px solid var(--timeline-line) !important; border-radius: 8px !important; color: var(--timeline-accent) !important; background: var(--timeline-wash) !important; }
.timeline-modal { border-color: var(--timeline-line) !important; border-radius: 8px !important; }.timeline-modal .modal-header { border-color: var(--timeline-line) !important; }
.timeline-page .form-control:focus, .timeline-stage-page .form-control:focus, .timeline-point-page .form-control:focus { border-color: #8ab7aa !important; box-shadow: 0 0 0 .2rem rgba(36,114,100,.12) !important; }
.timeline-filter-bar { border-bottom: 1px solid var(--timeline-line); padding-bottom: .8rem; }
.timeline-filter-button { border: 0 !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important; color: var(--timeline-muted) !important; background: transparent !important; }
.timeline-filter-button.active, .timeline-filter-button:hover { border-bottom-color: var(--timeline-accent) !important; color: var(--timeline-accent) !important; }
.review-kicker { display: block; color: var(--timeline-accent); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; margin-bottom: .4rem; }
.review-boundary { display: flex; align-items: center; gap: .45rem; margin-top: 1rem; padding-top: .8rem; border-top: 1px solid var(--timeline-line); color: var(--timeline-muted); font-size: .75rem; }
.review-boundary span:first-child { color: var(--timeline-accent); font-size: 1rem; }
.timeline-stage-page .analysis-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-top: 1rem; }
.timeline-stage-page .analysis-grid .stage-analysis-block + .stage-analysis-block { border-left: 1px solid var(--timeline-line); border-top: 0; padding-left: 2rem; }
.timeline-stage-page { max-width: 800px; }.timeline-stage-page .timeline-stage-panel { background: var(--timeline-wash); }.timeline-stage-page .stage-highlight { border-left-color: var(--timeline-accent) !important; }.timeline-stage-page .stage-analysis-block { border-left-color: #8ab7aa !important; }
.timeline-point-page { max-width: 800px; }.timeline-point-page .card-footer { border-top: 1px solid var(--timeline-line) !important; background: #fff !important; }
.timeline-global-container { max-width: 960px; margin-inline: auto; }.timeline-global-container .card { border: 0 !important; border-bottom: 1px solid var(--timeline-line) !important; border-radius: 0 !important; box-shadow: none !important; }.timeline-global-container .badge { border-radius: 4px !important; }
@media (max-width: 600px) { .timeline-page-header { align-items: flex-start !important; }.timeline-header-actions { width: 100%; justify-content: flex-start !important; }.timeline-stage-page, .timeline-point-page { padding-inline: 1rem; }.timeline-narrative { padding: 1.1rem !important; }.timeline-stage-page .analysis-grid { grid-template-columns: 1fr; gap: 1.25rem; }.timeline-stage-page .analysis-grid .stage-analysis-block + .stage-analysis-block { border-left: 0; border-top: 1px solid var(--timeline-line); padding-left: 0; padding-top: 1.25rem; } }