/* Night surfaces surround the demos; the sample app screens keep their own colors. */
html[data-theme="night"] .plus-section {
  --text: #f5f0e8;
  --cream: #f5f0e8;
  --muted: #c2cebe;
  --quiet: #abbea8;
  --sage: #bfd2b7;
  --sage-soft: #2c4836;
  --peach: #edb89a;
  --line: #48634b;
  background: #1a3025;
  color: #f5f0e8;
}

html[data-theme="night"] .plus-heading .eyebrow,
html[data-theme="night"] .plus-demo-kicker { color: #edb89a; }
html[data-theme="night"] .plus-heading h2,
html[data-theme="night"] .plus-panel h3,
html[data-theme="night"] .night-check-copy h3 { color: #f5f0e8; }
html[data-theme="night"] .plus-heading .muted-heading { color: #bfd2b7; }
html[data-theme="night"] .plus-heading .section-intro,
html[data-theme="night"] .plus-demo-description,
html[data-theme="night"] .plus-demo-points li,
html[data-theme="night"] .night-check-copy > p { color: #c2cebe; }
html[data-theme="night"] .plus-demo-note,
html[data-theme="night"] .plus-art-caption,
html[data-theme="night"] :is(.plus-showcase, .bubble-experience)-note,
html[data-theme="night"] .night-check-note { color: #abbea8; }
html[data-theme="night"] .plus-heading .plans-jump { color: #edb89a; }
html[data-theme="night"] .plus-heading .plans-jump:hover { color: #f5f0e8; }
html[data-theme="night"] :is(.plus-showcase, .bubble-experience),
html[data-theme="night"] .plus-tabs,
html[data-theme="night"] .plus-demo-details { border-color: #48634b; }
html[data-theme="night"] .plus-demo-details summary { color: #bfd2b7; }
html[data-theme="night"] .plus-demo-details summary:hover { color: #f5f0e8; }
html[data-theme="night"] .plus-demo-details summary::after { color: #edb89a; }
html[data-theme="night"] .plus-demo-points li::before { background: #bfd2b7; }

/* A pale selected tab stays unmistakable against the darker stage. */
html[data-theme="night"] .plus-tabs button { background: #20382c; border-color: #73896c; color: #f5f0e8; box-shadow: 0 3px 0 #0a181a33; }
html[data-theme="night"] .plus-tab-number { background: #2c4836; color: #bfd2b7; }
html[data-theme="night"] .plus-tabs button:hover { background: #294534; border-color: #edb89a; color: #f5f0e8; box-shadow: 0 5px 12px #08170e33; }
html[data-theme="night"] .plus-tabs button[aria-selected="true"] { background: #bfd2b7; border-color: #bfd2b7; color: #182a20; box-shadow: 0 4px 16px #08170e38; }
html[data-theme="night"] .plus-tabs button[aria-selected="true"] .plus-tab-number { background: #edb89a; color: #182a20; }
html[data-theme="night"] .plus-tabs button[aria-selected="true"]:hover { background: #d0dfc9; border-color: #d0dfc9; color: #182a20; }
html[data-theme="night"] .plus-tabs button:active { box-shadow: inset 0 2px 4px #07181035; }
html[data-theme="night"] .plus-tabs button:focus-visible,
html[data-theme="night"] .plus-demo-details summary:focus-visible,
html[data-theme="night"] .plans-jump:focus-visible,
html[data-theme="night"] .plus-panel:focus-visible { outline-color: #edb89a; }

html[data-theme="night"] .plus-panel-art { background: #20382c; box-shadow: inset 0 0 0 1px #48634b80; }
html[data-theme="night"] .plus-panel-art::before { background: #294534; border-color: #607b5659; }
html[data-theme="night"] [data-plus-panel="bubble"] .plus-panel-art::before { background: #344536; }
html[data-theme="night"] [data-plus-panel="family"] .plus-panel-art::before { background: #294534; }
html[data-theme="night"] [data-plus-panel="routine"] .plus-panel-art::before { background: #294434; }
html[data-theme="night"] .plus-panel-art::after { background: #08190f36; }
html[data-theme="night"] .bubble-demo::before { background: radial-gradient(ellipse, #edb89a16, transparent 66%); }

/* The cream reading screen and dark app controls remain faithful to their demos. */
html[data-theme="night"] .bubble-trigger { box-shadow: 0 0 0 7px #c5d7bd0b, 0 14px 26px #08180e55; }
html[data-theme="night"] .bubble-controls { border-color: #829977; box-shadow: 0 18px 35px #08180e66; }
html[data-theme="night"] .bubble-trigger:focus-visible,
html[data-theme="night"] :is(.plus-showcase, .bubble-experience) button.bubble-action:focus-visible { outline-color: #edb89a; }
html[data-theme="night"] :is(.plus-showcase, .bubble-experience) .bubble-demo[data-talking="true"] .bubble-trigger { box-shadow: 0 0 0 8px #edb89a35, 0 14px 26px #08180e55; }
html[data-theme="night"] .family-connection { border-color: #bfd2b780; }
html[data-theme="night"] .family-connection::before { background: #bfd2b7; }
html[data-theme="night"] :is(.plus-showcase, .bubble-experience) .family-connection::after { background: #bfd2b7; border-color: #294534; box-shadow: 0 0 0 4px #bfd2b71a; }
html[data-theme="night"] :is(.plus-showcase, .bubble-experience) .family-travel-dot { background: #edb89a; border-color: #294534; box-shadow: 0 0 0 5px #edb89a3d; }
html[data-theme="night"] .family-count-label { color: #abbea8; }
html[data-theme="night"] .family-count { color: #f5f0e8; }
html[data-theme="night"] .family-status { color: #c2cebe; }
html[data-theme="night"] .family-add { background: #bfd2b7; border-color: #bfd2b7; color: #182a20; }
html[data-theme="night"] .family-add:hover { background: #d0dfc9; border-color: #d0dfc9; color: #182a20; }
html[data-theme="night"] .family-add:focus-visible,
html[data-theme="night"] .routine-trigger:focus-visible { outline-color: #edb89a; }
html[data-theme="night"] .routine-demo::before { border-color: #829977; box-shadow: 0 14px 30px #08180e44; }
html[data-theme="night"] :is(.plus-showcase, .bubble-experience) .routine-demo[data-active="false"] .routine-timeline { opacity: 1; }

/* The included night check has its own raised surface and clear progress states. */
html[data-theme="night"] .night-free-label { color: #bfd2b7; }
html[data-theme="night"] .night-check-demo { background: #20382c; border-color: #5d7956; box-shadow: 0 8px 24px #08180e26; }
html[data-theme="night"] .night-demo-label { color: #bfd2b7; }
html[data-theme="night"] .night-check-steps li { color: #c2cebe; }
html[data-theme="night"] .night-check-steps li:not(:last-child)::before { border-color: #73896c; }
html[data-theme="night"] .night-check-steps li > .icon { background: #294534; border-color: #819977; color: #bfd2b7; }
html[data-theme="night"] .night-check-steps [data-complete="true"] > .icon { background: #bfd2b7; border-color: #bfd2b7; color: #182a20; }
html[data-theme="night"] .night-step-mark { background: #edb89a; color: #182a20; }
html[data-theme="night"] .night-check-steps [data-current="true"] { color: #f5f0e8; }
html[data-theme="night"] .night-check-steps [data-current="true"] > .icon { outline-color: #edb89a; }
html[data-theme="night"] .night-status { color: #c2cebe; border-color: #48634b; }
html[data-theme="night"] .night-next { background: #bfd2b7; border-color: #bfd2b7; color: #182a20; box-shadow: 0 3px 0 #08180e40; }
html[data-theme="night"] .night-next:hover { background: #d0dfc9; border-color: #d0dfc9; color: #182a20; box-shadow: 0 5px 12px #08180e38; }
html[data-theme="night"] .night-next:active { background: #afc6a5; border-color: #afc6a5; box-shadow: inset 0 2px 4px #182a2033; }
html[data-theme="night"] .night-next:focus-visible { outline-color: #edb89a; }

/* Plans use the same palette while retaining a visible free/Plus distinction. */
html[data-theme="night"] .plan-comparison .plans-intro .eyebrow { color: #edb89a; }
html[data-theme="night"] .plan-comparison .plans-intro h2 { color: #f5f0e8; }
html[data-theme="night"] .plan-comparison .plans-intro > p { color: #c2cebe; }
html[data-theme="night"] .plan-comparison .plan-card { border-color: #48634b; color: #f5f0e8; box-shadow: none; }
html[data-theme="night"] .plan-comparison .basic-plan { background: #1b3025; }
html[data-theme="night"] .plan-comparison .plus-plan { background: #20382c; border-color: #819977; }
html[data-theme="night"] .plan-comparison .plan-card:hover { border-color: #9bb28e; box-shadow: 0 18px 45px #08180e30; }
html[data-theme="night"] .plan-comparison .plan-name,
html[data-theme="night"] .plan-comparison .plan-card h3,
html[data-theme="night"] .plan-comparison .check-list li,
html[data-theme="night"] .plan-comparison .plus-feature-grid strong { color: #f5f0e8; }
html[data-theme="night"] .plan-comparison .plus-pill { background: #edb89a; color: #182a20; }
html[data-theme="night"] .plan-comparison .plan-label { background: #2c4836; color: #bfd2b7; }
html[data-theme="night"] .plan-comparison .plus-plan .plan-label { background: #493d31; color: #edb89a; }
html[data-theme="night"] .plan-comparison .plan-description,
html[data-theme="night"] .plan-comparison .plus-feature-grid small,
html[data-theme="night"] .plan-comparison .plan-footer > p { color: #c2cebe; }
html[data-theme="night"] .plan-comparison .plan-footer small { color: #abbea8; }
html[data-theme="night"] .plan-comparison .plan-includes { color: #bfd2b7; border-color: #48634b; }
html[data-theme="night"] .plan-comparison .check-list li::before { border-color: #bfd2b7; }
html[data-theme="night"] .plan-comparison .plus-feature-grid li { border-color: #48634b; }
html[data-theme="night"] .plan-comparison .plus-feature-grid .icon { color: #bfd2b7; }
html[data-theme="night"] .plan-comparison .plus-feature-grid li:hover > .icon { color: #edb89a; }
html[data-theme="night"] .plan-comparison .plan-free-button { background: #20382c; border-color: #819977; color: #f5f0e8; }
html[data-theme="night"] .plan-comparison .plan-free-button:hover { background: #294534; border-color: #bfd2b7; color: #f5f0e8; }
html[data-theme="night"] .plan-comparison .plan-plus-button { background: #edb89a; border-color: #edb89a; color: #182a20; }
html[data-theme="night"] .plan-comparison .plan-plus-button:hover { background: #f2cbb0; border-color: #f2cbb0; color: #182a20; }
html[data-theme="night"] .plan-comparison .button:focus-visible { outline-color: #edb89a; }