/* Shared site and dashboard palette, storage control, and theme button. */
:root{--site-bg:#f0f0f0;--site-surface:#fff;--site-text:#222;--site-copy:#444;--site-muted:#777;--site-border:#d8d8d8;--site-accent:#f5821f;--bg:var(--site-bg);--panel:var(--site-surface);--text:var(--site-text);--muted:var(--site-muted);--line:var(--site-border);--accent:var(--site-accent)}
html[data-theme="light"]{color-scheme:light}
html[data-theme="dark"]{color-scheme:dark;--site-bg:#15181d;--site-surface:#22262d;--site-text:#e6e9ee;--site-copy:#c4cbd5;--site-muted:#a5aebc;--site-border:#525a66;--bg:var(--site-bg);--panel:var(--site-surface);--text:var(--site-text);--muted:var(--site-muted);--line:var(--site-border);--accent:var(--site-accent)}
.site-theme-toggle{position:fixed;z-index:150;top:16px;right:16px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:transparent;color:var(--site-text);box-shadow:none;cursor:pointer}
.site-theme-toggle:hover{color:var(--site-accent)}
.site-theme-toggle:focus-visible{outline:2px solid var(--site-accent);outline-offset:3px}
@media(max-width:680px){.site-theme-toggle{top:10px;right:10px}}
@media print{.site-theme-toggle{display:none!important}}

/* Keep the icon at full size; bounce the control rather than shrinking its glyph. */
.site-theme-toggle{view-transition-name:theme-toggle}
.site-theme-toggle .theme-icon{position:absolute;width:27px;height:27px;pointer-events:none}
.theme-icon-sun{color:#eeb761;fill:currentColor;opacity:0}
.theme-icon-moon{color:#667998;fill:currentColor;opacity:1}
.theme-star{fill:#a3b2cc}
html[data-theme="dark"] .theme-icon-sun{opacity:1}
html[data-theme="dark"] .theme-icon-moon{opacity:0}
.site-theme-toggle:hover .theme-icon{filter:drop-shadow(0 0 5px #eeb76133)}
@media screen{
  html[data-theme-transition="true"],
  html[data-theme-transition="true"] *,
  html[data-theme-transition="true"] *::before,
  html[data-theme-transition="true"] *::after{transition:background-color .6s ease,color .6s ease,border-color .6s ease,box-shadow .6s ease,fill .6s ease,stroke .6s ease,filter .6s ease!important}
  html[data-theme-transition="true"] .site-theme-toggle{animation:theme-button-bounce .7s both}
}
/* Isolate the button from the page snapshot so its bounce remains visible. */
::view-transition-group(theme-toggle){animation:none;z-index:1}
::view-transition-old(theme-toggle){display:none}
::view-transition-new(theme-toggle){animation:theme-button-bounce .7s both;transform-origin:center;mix-blend-mode:normal}
@keyframes theme-button-bounce{
  0%{transform:translateY(0) scale(1)}
  14%{transform:translateY(2px) scale(1.08,.9)}
  36%{transform:translateY(-8px) scale(.96,1.06)}
  56%{transform:translateY(0) scale(1.06,.94)}
  74%{transform:translateY(-3px) scale(.99,1.02)}
  88%{transform:translateY(0) scale(1.02,.98)}
  100%{transform:translateY(0) scale(1)}
}

/* Crossfade two completed theme snapshots; no global transition teardown. */
::view-transition-old(root){animation:theme-page-out .6s ease both;mix-blend-mode:normal}
::view-transition-new(root){animation:theme-page-in .6s ease both;mix-blend-mode:normal}
@keyframes theme-page-out{from{opacity:1}to{opacity:0}}
@keyframes theme-page-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation-duration:.35s}}
