/* The original warm palette remains the day theme. */
/* Swap every surface together instead of letting old hover transitions lag behind. */
html.theme-changing *:not(.theme-toggle__rotor), html.theme-changing *::before, html.theme-changing *::after { transition: none !important; }
/* E: let the page snapshots dissolve while the taiji remains a live control. */
html.theme-changing::view-transition { pointer-events: none; }
html.theme-changing::view-transition-group(root),
html.theme-changing::view-transition-group(yin-control) { animation: none; }
html.theme-changing::view-transition-old(root),
html.theme-changing::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
html.theme-changing::view-transition-old(root) { z-index: 1; }
html.theme-changing::view-transition-new(root) { z-index: 2; }
html.theme-changing .theme-toggle { view-transition-name: yin-control; }
html.theme-changing::view-transition-old(yin-control) { display: none; }
html.theme-changing::view-transition-new(yin-control) { animation: none; mix-blend-mode: normal; }
html.theme-changing::view-transition-group(yin-control) { z-index: 5; }
html.theme-fading body,
html.theme-fading body *:not(.theme-toggle__rotor) {
  transition: background-color 750ms ease, color 750ms ease, border-color 750ms ease, box-shadow 750ms ease !important;
}
@media (prefers-reduced-motion: reduce) {
  html.theme-fading body, html.theme-fading body * { transition-duration: 160ms !important; }
}
html[data-theme='dark'] {
  --color-bg: #111111;
  --color-surface: #1b1b1b;
  --color-surface-2: #202020;
  --color-surface-offset: #191919;
  --color-surface-offset-2: #292929;
  --color-divider: #353535;
  --color-border: #4b4b4b;
  --color-text: #efefef;
  --color-text-muted: #b8b8b8;
  --color-text-faint: #a3a3a3;
  --color-text-inverse: #f4f4f4;
  --color-ink: #090909;
  --color-ink-2: #171717;
  --color-primary: #e4e4e4;
  --color-primary-hover: #ffffff;
  --color-primary-soft: #303030;
  --color-jade: #bebebe;
  --color-accent: #ffffff;
  --shadow-sm: 0 1px 2px rgb(0 0 0 / .2);
  --shadow-md: 0 12px 32px -8px rgb(0 0 0 / .45);
  --shadow-lg: 0 24px 64px -16px rgb(0 0 0 / .65);
  --grain-opacity: .01;
  color-scheme: dark;
}

/* A brighter warm-white contact panel separates the two ivory sections. */
html[data-theme='light'] #contact-section { background: #fffdf8; }
html[data-theme='light'] .footer {
  --color-text-inverse: var(--color-text);
  background: var(--color-bg);
  color: var(--color-text);
}
html[data-theme='light'] .footer__bottom {
  color: var(--color-text-muted);
  opacity: 1;
}
html[data-theme='light'] .footer__legal a { opacity: 1; }
html[data-theme='light'][data-contrast='high'] :is(.footer, .footer__bottom) { color: var(--color-text) !important; }
html[data-theme='light'] .footer__social-icon {
  color: var(--color-text-muted);
  opacity: .8;
}
html[data-theme='light'] .footer__social-icon[data-platform='tiktok'] { --social-color: var(--color-text); }
html[data-theme='light'] .footer__social-icon:focus-visible { color: var(--social-color); opacity: 1; }
@media (hover: hover) {
  html[data-theme='light'] .footer__social-icon:hover { color: var(--social-color); opacity: 1; }
}

.header-tools {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
  min-width: 0;
  width: 100%;
}
.header-tools .header-search { min-width: 0; }
.theme-toggle {
  appearance: none;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 76px;
  width: 76px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  color: inherit;
  background: transparent;
  cursor: pointer;
  touch-action: manipulation;
}
.theme-toggle[hidden] { display: none; }
.theme-toggle::before {
  content: '';
  position: absolute;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0;
  transition: opacity 180ms;
}
.theme-toggle__rotor {
  display: block;
  position: relative;
  width: 38px;
  height: 38px;
  transform: rotate(calc(-15deg + var(--theme-angle, 0deg)));
  transition: transform 660ms cubic-bezier(.22, .7, .2, 1);
}
.theme-toggle .theme-toggle__symbol { display: block; width: 100%; height: 100%; }
.theme-toggle__white { fill: #faf9f2; }
.theme-toggle__black { fill: #282923; }
.theme-toggle__edge { fill: none; stroke: #8c8d83; stroke-width: 1.1; }
/* B: outline over the hero; original ink and paper fills return with the header. */
.theme-toggle__white, .theme-toggle__black { stroke: transparent; stroke-width: 1.4; }
.theme-toggle__symbol > * { transition: fill .5s ease, stroke .5s ease; }
.home-page .header:not(.is-scrolled) .theme-toggle__white,
.home-page .header:not(.is-scrolled) .theme-toggle__black {
  fill: rgb(250 249 242 / .04);
  stroke: rgb(250 249 242 / .7);
}
.home-page .header:not(.is-scrolled) .theme-toggle__symbol > circle:not(:first-child):not(.theme-toggle__edge) {
  fill: rgb(250 249 242 / .75);
  stroke: transparent;
}
.home-page .header:not(.is-scrolled) .theme-toggle__edge { stroke: rgb(250 249 242 / .7); }
.theme-toggle:hover::before { opacity: .06; }
.theme-toggle:focus-visible { outline-color: currentColor; outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
  .theme-toggle__rotor, .theme-toggle::before, .theme-toggle__symbol > * { transition: none; }
}
@media (min-width: 1025px) {
  .header { grid-template-columns: auto minmax(0, 1fr) minmax(12rem, 21.75rem); }
}
@media (max-width: 1024px) {
  .header-tools { flex: 1 1 12rem; width: auto; }
}
@media (max-width: 700px) {
  .header-tools { gap: 12px; }
}

html[data-theme='dark'] :is(.hero, .section--ink) {
  --color-primary: #e4e4e4;
  --color-primary-hover: #ffffff;
}
html[data-theme='dark'] .home-page .hero__media::after {
  background: linear-gradient(90deg, rgb(0 0 0 / .7), rgb(0 0 0 / .25) 57%, rgb(0 0 0 / .08)),
    linear-gradient(0deg, #111111, rgb(0 0 0 / .1) 42%, transparent 68%);
}
html[data-theme='dark'] :is(.home-page, .hub-page) .culture {
  --color-primary: var(--color-text);
  --color-primary-hover: #ffffff;
}
html[data-theme='dark'] .button:not(.button--quiet):hover {
  background: #ffffff;
  border-color: #ffffff;
  color: #111111;
}
html[data-theme='dark'] .footer { box-shadow: inset 0 1px var(--color-divider); }
html[data-theme='dark'] .footer__social-icon:not(:hover):not(:focus-visible) { opacity: .9; }
/* Keep the original, scannable QR image on its white quiet zone. */
html[data-theme='dark'] .contact-qr__image { background: #ffffff; }

html[data-theme='dark'][data-contrast='high'] {
  --color-bg: #080808;
  --color-surface: #080808;
  --color-surface-2: #080808;
  --color-text: #ffffff;
  --color-text-muted: #e0e0e0;
  --color-text-faint: #d0d0d0;
  --color-border: #a0a0a0;
  --color-divider: #888888;
}
html[data-theme='dark'][data-contrast='high'] .header { background: #080808 !important; color: #ffffff !important; border-bottom-color: #888888; }
html[data-theme='dark'][data-contrast='high'] .header-search__field { border-color: #888888; }
@media print {
  html[data-theme='dark'] {
    --color-bg: #ffffff;
    --color-surface: #ffffff;
    --color-surface-2: #ffffff;
    --color-surface-offset: #f0f0f0;
    --color-surface-offset-2: #e4e4e4;
    --color-text: #111111;
    --color-text-muted: #333333;
    --color-text-faint: #555555;
    --color-primary: #111111;
    --color-border: #888888;
    --color-divider: #bbbbbb;
    color-scheme: light;
  }
}
