/* One palette for the shared navigation and the home foreground. */
html {
  --boku-scene-ink: #274657;
  --boku-scene-muted: #385565;
  --boku-scene-accent: #76bbc7;
  --boku-scene-surface: rgba(237, 248, 250, .68);
  --boku-scene-menu: rgba(240, 249, 251, .96);
  --boku-scene-line: rgba(39, 70, 87, .25);
  --boku-scene-shadow: rgba(20, 45, 56, .10);
}
html[data-scene="twilight-platform"] {
  --boku-scene-ink: #304b60;
  --boku-scene-muted: #3e596d;
  --boku-scene-accent: #ae693b;
  --boku-scene-surface: rgba(241, 247, 250, .68);
  --boku-scene-menu: rgba(245, 248, 250, .96);
  --boku-scene-line: rgba(48, 75, 96, .25);
}
html[data-scene="forest-fireflies"] {
  --boku-scene-ink: #2c5145;
  --boku-scene-muted: #42634f;
  --boku-scene-accent: #b38b42;
  --boku-scene-surface: rgba(239, 247, 238, .70);
  --boku-scene-menu: rgba(242, 248, 241, .96);
  --boku-scene-line: rgba(44, 81, 69, .25);
}
html[data-theme="dark"] {
  --boku-scene-ink: #e5e9ef;
  --boku-scene-muted: #b7c6d6;
  --boku-scene-accent: #e8c994;
  --boku-scene-surface: rgba(13, 25, 43, .76);
  --boku-scene-menu: rgba(15, 28, 45, .97);
  --boku-scene-line: rgba(195, 212, 231, .25);
  --boku-scene-shadow: rgba(0, 0, 0, .28);
}
html[data-theme="dark"][data-scene="twilight-platform"] {
  --boku-scene-ink: #eee5d7;
  --boku-scene-muted: #c7bfaf;
  --boku-scene-accent: #e8b66f;
  --boku-scene-surface: rgba(20, 28, 39, .76);
  --boku-scene-menu: rgba(23, 31, 41, .97);
  --boku-scene-line: rgba(229, 205, 173, .24);
}
html[data-theme="dark"][data-scene="forest-fireflies"] {
  --boku-scene-ink: #dceadf;
  --boku-scene-muted: #b4c9bd;
  --boku-scene-accent: #c9da87;
  --boku-scene-surface: rgba(10, 28, 29, .78);
  --boku-scene-menu: rgba(13, 31, 30, .97);
  --boku-scene-line: rgba(189, 217, 199, .24);
}
/* Life's palette follows its own desk and clock, never the daily three-scene choice. */
html[data-life-tod] {
  --boku-scene-ink: #51493c;
  --boku-scene-muted: #665c4b;
  --boku-scene-accent: #9a7849;
  --boku-scene-surface: rgba(249, 245, 232, .78);
  --boku-scene-menu: rgba(250, 247, 237, .97);
  --boku-scene-line: rgba(99, 83, 58, .22);
  --boku-scene-shadow: rgba(77, 60, 37, .10);
}
html[data-life-tod="afternoon"] {
  --boku-scene-ink: #5c4735;
  --boku-scene-muted: #715941;
  --boku-scene-accent: #a2713c;
  --boku-scene-surface: rgba(248, 239, 221, .80);
  --boku-scene-menu: rgba(250, 241, 225, .97);
}
html[data-life-tod="night"] {
  --boku-scene-ink: #eadfca;
  --boku-scene-muted: #c5b598;
  --boku-scene-accent: #d7ae71;
  --boku-scene-surface: rgba(40, 33, 28, .82);
  --boku-scene-menu: rgba(43, 35, 28, .97);
  --boku-scene-line: rgba(229, 204, 166, .23);
  --boku-scene-shadow: rgba(0, 0, 0, .25);
}
:is(.preview-header, .confirmed-header) {
  --ink: var(--boku-scene-ink);
  --muted: var(--boku-scene-muted);
  --accent: var(--boku-scene-accent);
  --line: var(--boku-scene-line);
  --nav-surface: var(--boku-scene-surface);
  --nav-menu-surface: var(--boku-scene-menu);
  --nav-divider: var(--boku-scene-line);
  --confirmed-ink: var(--boku-scene-ink);
  --confirmed-muted: var(--boku-scene-muted);
  --confirmed-line: var(--boku-scene-line);
  --confirmed-accent: var(--boku-scene-accent);
  --confirmed-accent-soft: color-mix(in srgb, var(--boku-scene-accent) 12%, transparent);
  --confirmed-nav-divider: var(--boku-scene-line);
}
html :is(.preview-header, .confirmed-header) :is(.preview-nav, .confirmed-nav, .preview-theme-toggle, .confirmed-theme-toggle) {
  color: var(--boku-scene-muted);
  background: var(--boku-scene-surface) !important;
  border-color: var(--boku-scene-line) !important;
  box-shadow: 0 4px 16px var(--boku-scene-shadow);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html :is(.preview-header, .confirmed-header) :is(.preview-more-menu, .confirmed-more-menu) {
  background: var(--boku-scene-menu) !important;
  border-color: var(--boku-scene-line) !important;
  box-shadow: 0 12px 32px var(--boku-scene-shadow);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html :is(.preview-header, .confirmed-header) :is(.preview-nav, .confirmed-nav) > a,
html :is(.preview-header, .confirmed-header) :is(.preview-more, .confirmed-more) > button,
html :is(.preview-header, .confirmed-header) :is(.preview-more-menu, .confirmed-more-menu) :is(a, small, .preview-menu-icon, .confirmed-menu-icon) {
  color: var(--boku-scene-muted);
}
html :is(.preview-header, .confirmed-header) :is(.preview-more-menu, .confirmed-more-menu) strong { color: var(--boku-scene-ink); }
html :is(.preview-header, .confirmed-header) :is(.preview-nav, .confirmed-nav) > a[aria-current="page"],
html :is(.preview-header, .confirmed-header) :is(.preview-more, .confirmed-more)[data-more-active="true"] > button,
html :is(.preview-header, .confirmed-header) :is(.preview-nav, .confirmed-nav) > a:hover,
html :is(.preview-header, .confirmed-header) :is(.preview-more, .confirmed-more) > button:hover,
html :is(.preview-header, .confirmed-header) :is(.preview-more-menu, .confirmed-more-menu) a:hover,
html :is(.preview-header, .confirmed-header) :is(.preview-more-menu, .confirmed-more-menu) a[aria-current="page"],
html :is(.preview-header, .confirmed-header) :is(.preview-theme-toggle, .confirmed-theme-toggle):hover {
  color: var(--boku-scene-ink);
  background: color-mix(in srgb, var(--boku-scene-accent) 12%, transparent);
  box-shadow: none;
}
html :is(.preview-header, .confirmed-header) :is(a, button):focus-visible {
  color: var(--boku-scene-ink);
  outline: 2px solid var(--boku-scene-ink);
  outline-offset: 3px;
}
html :is(.preview-header, .confirmed-header) :is(.preview-nav-divider, .confirmed-nav-divider) {
  background: linear-gradient(to bottom, transparent, var(--boku-scene-line) 25% 75%, transparent);
}
html :is(.preview-header, .confirmed-header) :is(.preview-nav, .confirmed-nav, .preview-theme-toggle, .confirmed-theme-toggle, .preview-more-menu, .confirmed-more-menu) {
  transition-property: color, background-color, border-color, box-shadow, opacity, transform, visibility;
  transition-duration: 400ms, 400ms, 400ms, 400ms, 180ms, 180ms, 180ms;
}
html .site-legal-footer { color: var(--boku-scene-footer, var(--boku-scene-muted)) !important; }
@media(prefers-reduced-motion:reduce) {
  html :is(.preview-header, .confirmed-header), html :is(.preview-header, .confirmed-header) * { transition-duration:.01ms !important; }
}
