/* Theme toggle, the theme switch animation and hand-tuned dark values. Loads after the generated
   theme-dark*.css (scripts/build_theme.py), so rules here win. */
.theme-toggle.theme-toggle{display:inline-grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:999px;border:0;background:transparent;color:inherit;cursor:pointer;position:relative;transition:background-color .2s,transform .2s cubic-bezier(.2,.9,.3,1.4)}
.theme-toggle:hover{background:color-mix(in srgb,currentColor 9%,transparent)}
.theme-toggle:active{transform:scale(.88)}
.theme-toggle.theme-toggle .icon{width:1.2rem;height:1.2rem;grid-area:1/1;margin:0;transition:opacity .25s,transform .45s cubic-bezier(.2,.9,.3,1.2)}
[data-theme-toggle] .t-auto,[data-theme-toggle] .t-sun,[data-theme-toggle] .t-moon{opacity:0;transform:rotate(-90deg) scale(.5)}
:root[data-theme-pref=system] [data-theme-toggle] .t-auto,:root[data-theme-pref=light] [data-theme-toggle] .t-sun,:root[data-theme-pref=dark] [data-theme-toggle] .t-moon,:root:not([data-theme-pref]) [data-theme-toggle] .t-auto{opacity:1;transform:none}
.mobile-theme{display:flex;align-items:center;gap:.7rem;width:100%;padding:.75rem .9rem;border-radius:.9rem;background:transparent;color:inherit;font:inherit;cursor:pointer;text-align:left}
.mobile-theme .icon{width:1.15rem;height:1.15rem;transition:opacity .25s,transform .45s}
.mobile-theme .t-auto,.mobile-theme .t-sun,.mobile-theme .t-moon{position:absolute}
.mobile-theme span{margin-left:1.85rem}
/* Hub -> platform cross-link */
.platform-link{display:inline-flex;align-items:center;gap:.4rem;padding:.42rem .8rem;border-radius:999px;font-size:.82rem;font-weight:600;white-space:nowrap;background:linear-gradient(120deg,color-mix(in srgb,var(--ink) 7%,transparent),color-mix(in srgb,var(--ink) 3%,transparent));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 12%,transparent);transition:transform .2s,box-shadow .2s}
.platform-link:hover{transform:translateY(-1px);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 30%,transparent);color:inherit}
.platform-link .icon{width:1rem;height:1rem}
@media (max-width:1100px){.platform-link span{display:none}.platform-link{padding:.55rem}}
@media (max-width:700px){.platform-link{display:none}}
.mobile-platform-link .icon:last-child{width:.9rem;height:.9rem;opacity:.6;margin-left:auto}
.theme-toggle-label{font-size:.82rem}

/* Circular reveal from the toggle (View Transitions). The hub's page-navigation transitions name parts of
   the page and switch the root snapshot off, so during a theme switch the whole page is one snapshot again. */
:root.theme-anim{view-transition-name:root!important}
:root.theme-anim *{view-transition-name:none!important}
:root.theme-anim::view-transition-old(root),:root.theme-anim::view-transition-new(root){animation:none;mix-blend-mode:normal}
:root.theme-anim::view-transition-new(root){animation:theme-reveal .55s cubic-bezier(.4,0,.2,1)}
@keyframes theme-reveal{from{clip-path:circle(0 at var(--theme-x,50%) var(--theme-y,0))}to{clip-path:circle(150vmax at var(--theme-x,50%) var(--theme-y,0))}}

/* ---------- dark: hand-tuned ---------- */
:root[data-theme=dark]{color-scheme:dark;--bg:#111112;--surface:#1c1c1e;--ink:#ececee;--muted:#a1a4a9;--line:#323235;--accent:#f2f2f3;--accent-hover:#ffffff;--shadow:0 0 0 1px #ffffff12,0 8px 30px #00000059}
:root[data-theme=dark] img:not([src$=".svg"]){filter:brightness(.92)}
:root[data-theme=dark] ::selection{background:#4b5563;color:#fff}
/* Logos drawn in black on transparent stay readable. */
:root[data-theme=dark] img[src*="molekiu-lockup"],:root[data-theme=dark] img[src*="molekiu-dots"],:root[data-theme=dark] img[src*="mark.svg"]{filter:invert(1) hue-rotate(180deg) brightness(1.1)}
/* Printed artefacts keep paper colours even in dark mode. */
:root[data-theme=dark] .printable-document,:root[data-theme=dark] .notice-ai-pages img{color-scheme:light}
