/**
 * Day Drawer · 日舞台
 * 与折叠 / 身体页同属 cosmos 家族：cyan–pink–lime + 轻玻璃，仍是抽屉简报
 */

.day-drawer__panel--day-stage {
  --stage-cyan: #00d2ff;
  --stage-pink: #ff6ec7;
  --stage-lime: #c8ff3a;
  --stage-cyan-soft: rgba(0, 210, 255, 0.55);
  --stage-pink-soft: rgba(255, 110, 199, 0.4);
  --stage-glass: rgba(255, 255, 255, 0.045);
  --stage-line-glow: rgba(255, 255, 255, 0.08);
  position: relative;
  isolation: isolate;
}

.day-drawer__panel--day-stage::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  border-radius: inherit;
  background:
    radial-gradient(ellipse 80% 50% at 8% -5%, rgba(0, 210, 255, 0.14) 0%, transparent 55%),
    radial-gradient(ellipse 70% 45% at 96% 105%, rgba(255, 110, 199, 0.1) 0%, transparent 50%);
  opacity: 0.85;
}

.day-drawer__panel--day-stage > * {
  position: relative;
  z-index: 1;
}

.day-drawer-stage {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0.15rem 0.85rem 1.1rem;
}

.day-drawer-stage[hidden] {
  display: none !important;
}

/* 双屏互斥：避免舞台 / 九宫叠在同一视口 */
.day-drawer__panel--board-stage .day-drawer-stage {
  display: none !important;
}

.day-drawer__panel--day-stage .day-drawer-board-stage {
  display: none !important;
}

.day-drawer__panel:not(.day-drawer__panel--board-stage):not(.day-drawer__panel--day-stage) .day-drawer-stage,
.day-drawer__panel:not(.day-drawer__panel--board-stage):not(.day-drawer__panel--day-stage) .day-drawer-board-stage {
  display: none !important;
}

.day-drawer-stage--entering {
  animation: day-stage-enter 0.42s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes day-stage-enter {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.day-drawer__panel--day-stage .day-drawer__title-main {
  letter-spacing: 0.12em;
  font-weight: 620;
  text-transform: uppercase;
  font-size: 0.82rem;
  background: linear-gradient(118deg, var(--stage-cyan) 0%, #b8e8ff 42%, var(--stage-lime) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.day-drawer__panel--day-stage .day-drawer__title-sub {
  letter-spacing: 0.06em;
  opacity: 0.72;
}

.day-stage__eyebrow,
.day-stage__posture-label,
.day-stage__record-label,
.day-stage__shichen-eyebrow,
.day-drawer-stage .growth-line-strip__eyebrow {
  display: block;
  margin: 0 0 0.35rem;
  font-size: 0.65rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 560;
  color: var(--stage-cyan-soft);
  opacity: 1;
}

.day-stage__signal {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: 0.35rem 0 0.15rem;
}

.day-stage__date {
  margin: 0;
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  opacity: 0.55;
  color: rgba(180, 230, 255, 0.7);
}

.day-stage__ganzhi {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.2rem 0.35rem;
  font-size: clamp(1.5rem, 5vw, 1.95rem);
  font-weight: 620;
  line-height: 1.2;
  letter-spacing: 0.04em;
}

.day-stage__ganzhi-sep {
  font-size: 0.72em;
  font-weight: 450;
  opacity: 0.55;
}

.day-stage__ganzhi-dot {
  opacity: 0.35;
  margin: 0 0.1rem;
}

.day-stage__gz {
  display: inline-flex;
  gap: 0.02em;
}

.day-stage__gz-stem,
.day-stage__gz-branch {
  transition: color 0.2s ease;
}

.day-stage__gz--wood { color: var(--wx-wood, #5dd39e); }
.day-stage__gz--fire { color: var(--wx-fire, #ff9f85); }
.day-stage__gz--earth { color: var(--wx-earth, #cfaf82); }
.day-stage__gz--metal { color: var(--wx-metal, #9eb4c8); }
.day-stage__gz--water { color: var(--wx-water, #5ac8fa); }

/* 轻玻璃卡 · 对齐 fold-glass，强度降低 */
.day-stage__glass {
  position: relative;
  border-radius: 1.45rem;
  background: var(--stage-glass);
  backdrop-filter: blur(14px) saturate(1.15);
  -webkit-backdrop-filter: blur(14px) saturate(1.15);
  border: 1px solid var(--stage-line-glow);
  box-shadow:
    0 0 0 1px rgba(0, 210, 255, 0.04),
    0 -12px 36px rgba(0, 210, 255, 0.06),
    0 14px 32px rgba(255, 110, 199, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
  overflow: hidden;
}

.day-stage__glass::before,
.day-stage__glass::after {
  content: '';
  position: absolute;
  left: 14%;
  right: 14%;
  height: 1px;
  border-radius: 1px;
  pointer-events: none;
  opacity: 0.75;
}

.day-stage__glass::before {
  top: 0;
  background: linear-gradient(90deg, transparent, rgba(0, 210, 255, 0.55), transparent);
  box-shadow: 0 0 12px rgba(0, 210, 255, 0.35);
}

.day-stage__glass::after {
  bottom: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 110, 199, 0.4), transparent);
  box-shadow: 0 0 10px rgba(255, 110, 199, 0.25);
}

.day-stage__mini-pan.day-stage__glass {
  margin: 0.45rem 0 0.1rem;
  padding: 0.55rem 0.45rem 0.65rem;
}

.day-stage__mini-pan .bazi-pan {
  margin-top: 0;
}

.day-stage__mini-pan .bazi-pan__board {
  padding: 0.05rem 0 0.15rem;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.day-stage__mini-pan .bazi-pan__board--full {
  min-width: 18.5rem;
}

.day-stage__mini-pan .bazi-pan .liuyue-pillar__meta {
  min-height: 1.35rem;
  margin-bottom: 0.18rem;
  font-size: 0.56rem;
}

.day-stage__mini-pan .bazi-pan .liuyue-pillar__stem,
.day-stage__mini-pan .bazi-pan .liuyue-pillar__branch {
  font-size: clamp(0.95rem, 3.6vw, 1.15rem);
  line-height: 1.15;
}

.day-stage__mini-pan .bazi-pan__hidden,
.day-stage__mini-pan .bazi-pan__hidden--spacer {
  display: none;
}

.day-stage__mini-pan .bazi-pan__meta {
  margin-top: 0.35rem;
  font-size: 0.64rem;
  opacity: 0.55;
}

.day-stage__mini-pan-core {
  display: inline-block;
  margin-top: 0.35rem;
  font-size: 0.72rem;
  opacity: 0.72;
  color: var(--stage-cyan-soft);
  text-decoration: underline;
  text-decoration-color: rgba(0, 210, 255, 0.28);
  text-underline-offset: 0.15em;
}

.day-stage__mini-pan-core:hover {
  opacity: 0.95;
  color: var(--stage-lime);
}

.day-stage__mini-pan--empty {
  padding: 0.65rem 0.75rem;
}

.day-stage__mini-pan-empty {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.45;
  opacity: 0.68;
}

.day-stage__posture.day-stage__glass {
  margin: 0.45rem 0 0;
  padding: 0.7rem 0.85rem 0.75rem;
}

.day-stage__posture-text {
  font-size: 0.95rem;
  line-height: 1.55;
  opacity: 0.92;
}

.day-stage__shichen {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.day-stage__shichen-head {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.day-stage__shichen-selected {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.4;
  opacity: 0.9;
}

.day-stage__shichen-range {
  opacity: 0.55;
  font-size: 0.82em;
}

.day-stage__shichen-track {
  display: flex;
  gap: 0.3rem;
  overflow-x: auto;
  padding: 0.15rem 0 0.35rem;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
}

.day-stage__shichen-chip {
  flex: 0 0 auto;
  scroll-snap-align: start;
  min-width: 2.7rem;
  padding: 0.45rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.03);
  color: inherit;
  font: inherit;
  font-size: 0.74rem;
  opacity: 0.72;
  cursor: pointer;
  transition:
    background 0.2s ease,
    border-color 0.2s ease,
    opacity 0.2s ease,
    transform 0.2s ease,
    box-shadow 0.2s ease,
    color 0.2s ease;
}

.day-stage__shichen-chip:hover {
  opacity: 0.92;
  background: rgba(0, 210, 255, 0.08);
  border-color: rgba(0, 210, 255, 0.28);
}

.day-stage__shichen-chip.is-now {
  border-color: rgba(var(--ambient-dom-r, 0), var(--ambient-dom-g, 210), var(--ambient-dom-b, 255), 0.45);
  box-shadow: 0 0 0 1px rgba(0, 210, 255, 0.12);
}

.day-stage__shichen-chip.is-active {
  opacity: 1;
  color: #061830;
  font-weight: 700;
  background: linear-gradient(135deg, rgba(0, 210, 255, 0.92), rgba(200, 255, 58, 0.82));
  border-color: transparent;
  box-shadow: 0 0 16px rgba(0, 210, 255, 0.35);
  transform: translateY(-1px);
}

.day-drawer-stage__cycle-update {
  margin: 0;
}

.day-stage__transit {
  margin-top: 0.15rem;
}

.day-stage__transit .transit-companion {
  padding: 0.65rem 0.8rem;
  border-radius: 1.35rem;
  border-color: var(--stage-line-glow);
  background: var(--stage-glass);
}

.day-stage__transit .transit-companion__list,
.day-stage__transit .transit-companion__prompts,
.day-stage__transit .transit-companion__mechanism,
.day-stage__transit .transit-companion__foot {
  display: none;
}

.day-stage__record {
  margin-top: 0.15rem;
  background: var(--stage-glass) !important;
  border: 1px solid var(--stage-line-glow) !important;
  box-shadow:
    0 0 0 1px rgba(0, 210, 255, 0.04),
    0 -10px 28px rgba(0, 210, 255, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
  border-radius: 1.45rem;
  padding: 0.9rem 0.95rem 1.05rem;
}

.day-drawer-stage .decision-capture__meta,
.day-drawer-stage .decision-capture__note,
.day-drawer-stage .decision-capture__quota,
.day-drawer-stage .decision-capture__total {
  display: none !important;
}

.day-drawer-stage .day-stage__mercury-tip {
  display: none !important;
}

.day-drawer-stage .decision-feedback-trigger {
  display: none !important;
}

.day-drawer-stage .decision-feedback-trigger.decision-feedback-trigger--ready {
  display: inline-flex !important;
  margin-top: 0.35rem;
  padding: 0;
  border: none;
  background: transparent;
  box-shadow: none;
  font-size: 0.78rem;
  opacity: 0.55;
  text-decoration: underline;
  text-decoration-color: rgba(0, 210, 255, 0.28);
  text-underline-offset: 0.16em;
  color: var(--stage-cyan-soft);
}

body.theme-day .day-drawer-stage .decision-feedback-trigger.decision-feedback-trigger--ready {
  text-decoration-color: rgba(0, 140, 180, 0.35);
  color: rgba(20, 90, 120, 0.78);
}

.day-drawer-stage .growth-line-strip-host--teaser .growth-line-strip__meaning--teaser,
.day-drawer-stage .growth-line-strip-host--teaser .growth-line-strip__count {
  display: none;
}

.day-drawer-stage .growth-line-strip {
  padding: 0.45rem 0.15rem 0;
  background: transparent;
  border: none;
  margin: 0;
}

.day-drawer-stage .growth-line-strip__empty {
  font-size: 0.78rem;
  opacity: 0.62;
}

.day-drawer-stage .day-stage__signal { order: 1; }
.day-drawer-stage .day-stage__shichen { order: 2; }
.day-drawer-stage .day-stage__record { order: 3; }
.day-drawer-stage .growth-line-strip-host { order: 4; }
.day-drawer-stage .day-stage__footer { order: 5; }
.day-drawer-stage .day-drawer-stage__cycle-update { order: 6; }

.day-drawer-stage__cycle-update:not([hidden]) {
  margin-top: 0.35rem;
  padding: 0.55rem 0.7rem;
  border-radius: 1.25rem;
  background: var(--stage-glass);
  border: 1px solid var(--stage-line-glow);
  opacity: 0.92;
}

.journal-input--stage {
  min-height: 7.5rem;
  font-size: clamp(1.02rem, 2.8vw, 1.12rem);
  line-height: 1.7;
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 0;
  padding: 0.55rem 0.1rem;
  resize: vertical;
}

.journal-input--stage:focus {
  outline: none;
  border-bottom-color: rgba(0, 210, 255, 0.45);
  box-shadow: none;
}

.journal-input--stage::placeholder {
  opacity: 0.38;
}

.day-stage__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 1rem;
  margin-top: auto;
  padding-top: 0.35rem;
}

.day-stage__link {
  font-size: 0.82rem;
  color: var(--stage-cyan-soft);
  opacity: 0.85;
  text-decoration: none;
  border-bottom: 1px solid rgba(0, 210, 255, 0.28);
  padding-bottom: 0.05rem;
  transition: opacity 0.2s ease, color 0.2s ease;
}

.day-stage__link:hover {
  opacity: 1;
  color: var(--stage-lime);
}

.day-stage__ritual.btn--ghost {
  margin-left: auto;
  font-size: 0.78rem;
  opacity: 0.8;
  border-color: rgba(0, 210, 255, 0.22);
  color: inherit;
}

.day-stage__ritual--coach-target {
  outline: 2px solid rgba(0, 210, 255, 0.45);
  outline-offset: 2px;
}

/*
 * 日间主题 · cosmos 色点降饱和 + 纸面可读
 */
body.theme-day .day-drawer.is-open .day-drawer__panel.day-drawer__panel--day-stage {
  --stage-cyan: #1a9ec4;
  --stage-pink: #c45a9a;
  --stage-lime: #6a9a28;
  --stage-cyan-soft: rgba(20, 130, 165, 0.72);
  --stage-pink-soft: rgba(180, 80, 140, 0.45);
  --stage-glass: rgba(255, 255, 255, 0.72);
  --stage-line-glow: rgba(40, 110, 160, 0.16);
  --stage-ink: #143a52;
  --stage-ink-soft: #2f5a72;
  --stage-ink-mute: #5a7088;
  --stage-line: rgba(40, 110, 160, 0.16);
  background:
    radial-gradient(ellipse 90% 55% at 10% -6%, rgba(0, 180, 220, 0.16) 0%, transparent 55%),
    radial-gradient(ellipse 70% 45% at 94% 108%, rgba(220, 120, 180, 0.1) 0%, transparent 50%),
    linear-gradient(180deg, #f3f8fc 0%, #eef4f8 52%, #f6f2f7 100%) !important;
  color: var(--stage-ink);
  border-color: rgba(40, 110, 160, 0.14);
}

body.theme-day .day-drawer.is-open .day-drawer__panel--day-stage::before {
  background:
    radial-gradient(ellipse 80% 50% at 8% -5%, rgba(0, 180, 220, 0.12) 0%, transparent 55%),
    radial-gradient(ellipse 70% 45% at 96% 105%, rgba(220, 120, 180, 0.08) 0%, transparent 50%);
}

body.theme-day .day-drawer.is-open .day-drawer__panel--day-stage .day-drawer__title-main {
  background: linear-gradient(118deg, #0e6a8a 0%, #1a7a9c 42%, #5a8a28 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-weight: 650;
}

body.theme-day .day-drawer.is-open .day-drawer__panel--day-stage .day-drawer__title-sub,
body.theme-day .day-drawer.is-open .day-drawer__panel--day-stage .day-drawer__close {
  color: var(--stage-ink-soft);
}

body.theme-day .day-stage__eyebrow,
body.theme-day .day-stage__posture-label,
body.theme-day .day-stage__record-label,
body.theme-day .day-stage__shichen-eyebrow,
body.theme-day .day-drawer-stage .growth-line-strip__eyebrow {
  color: rgba(14, 110, 145, 0.78);
}

body.theme-day .day-stage__date {
  color: var(--stage-ink-mute);
  opacity: 1;
}

body.theme-day .day-stage__ganzhi {
  color: #143a52;
}

body.theme-day .day-stage__ganzhi-sep,
body.theme-day .day-stage__ganzhi-dot {
  opacity: 1;
  color: #5a7088;
}

body.theme-day .day-stage__gz--wood { color: #1d7a4c; }
body.theme-day .day-stage__gz--fire { color: #c0394a; }
body.theme-day .day-stage__gz--earth { color: #9a6a28; }
body.theme-day .day-stage__gz--metal { color: #5a6288; }
body.theme-day .day-stage__gz--water { color: #1a6a9c; }

body.theme-day .day-stage__glass,
body.theme-day .day-stage__posture,
body.theme-day .day-stage__mini-pan,
body.theme-day .day-stage__record {
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.92), rgba(236, 246, 250, 0.88)) !important;
  border-color: rgba(40, 120, 160, 0.14) !important;
  box-shadow:
    0 8px 22px rgba(40, 90, 120, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

body.theme-day .day-stage__glass::before {
  background: linear-gradient(90deg, transparent, rgba(20, 150, 190, 0.55), transparent);
  box-shadow: 0 0 10px rgba(20, 150, 190, 0.28);
}

body.theme-day .day-stage__glass::after {
  background: linear-gradient(90deg, transparent, rgba(180, 80, 140, 0.35), transparent);
  box-shadow: 0 0 8px rgba(180, 80, 140, 0.2);
}

body.theme-day .day-stage__posture-text {
  color: var(--stage-ink);
  opacity: 1;
}

body.theme-day .day-stage__mini-pan .bazi-pan__meta,
body.theme-day .day-stage__mini-pan .liuyue-pillar__term,
body.theme-day .day-stage__mini-pan .liuyue-pillar__date {
  color: #2f5a72;
  opacity: 1;
}

body.theme-day .day-stage__mini-pan .liuyue-pillar--transit .liuyue-pillar__term {
  color: #8a4a88;
}

body.theme-day .day-stage__mini-pan-core {
  color: #0e6a8a;
  text-decoration-color: rgba(14, 110, 145, 0.35);
}

body.theme-day .day-stage__mini-pan-empty {
  color: var(--stage-ink-soft);
  opacity: 1;
}

body.theme-day .day-stage__shichen-selected {
  color: var(--stage-ink);
  opacity: 1;
}

body.theme-day .day-stage__shichen-range {
  color: var(--stage-ink-mute);
  opacity: 1;
}

body.theme-day .day-stage__shichen-chip {
  background: rgba(255, 255, 255, 0.78);
  border-color: rgba(40, 120, 160, 0.18);
  color: #2f5a72;
  opacity: 1;
}

body.theme-day .day-stage__shichen-chip:hover {
  background: rgba(230, 244, 250, 0.95);
  border-color: rgba(20, 150, 190, 0.32);
}

body.theme-day .day-stage__shichen-chip.is-active {
  color: #061830;
  background: linear-gradient(135deg, rgba(80, 200, 230, 0.95), rgba(170, 220, 90, 0.88));
  border-color: transparent;
  box-shadow: 0 0 14px rgba(40, 170, 200, 0.28);
}

body.theme-day .day-stage__shichen-chip.is-now {
  border-color: rgba(20, 150, 190, 0.5);
  box-shadow: 0 0 0 1px rgba(20, 150, 190, 0.12);
}

body.theme-day .journal-input--stage {
  border-bottom-color: rgba(40, 110, 160, 0.22);
  color: #143a52;
}

body.theme-day .journal-input--stage:focus {
  border-bottom-color: rgba(20, 150, 190, 0.55);
}

body.theme-day .journal-input--stage::placeholder {
  color: #7a90a0;
}

body.theme-day .day-stage__journal-echo {
  color: var(--stage-ink-soft);
  opacity: 1;
}

body.theme-day .day-stage__link {
  color: #0e6a8a;
  border-bottom-color: rgba(14, 110, 145, 0.35);
}

body.theme-day .day-stage__ritual.btn--ghost {
  color: #2f5a72;
  border-color: rgba(40, 120, 160, 0.28);
  opacity: 1;
}

body.theme-day .day-drawer-stage .growth-line-strip__eyebrow,
body.theme-day .day-drawer-stage .growth-line-strip__empty,
body.theme-day .day-drawer-stage .growth-line-strip__link {
  color: #2f5a72;
}

@media (prefers-reduced-motion: reduce) {
  .day-drawer-stage--entering,
  .day-stage__shichen-chip {
    animation: none;
    transition: none;
  }
}
