/* The lantern switch. Evening = dark theme = the lantern lit. Uses each page's own
   colour tokens (--rule, --muted, --brass), so it looks right in every page. */
.lamp{display:inline-flex;align-items:center;gap:8px;background:none;border:1px solid var(--rule);border-radius:999px;
  padding:4px 11px 4px 8px;cursor:pointer;color:var(--muted);font:500 10.5px/1 "IBM Plex Mono",ui-monospace,monospace;
  letter-spacing:.1em;text-transform:uppercase;transition:border-color .2s,color .2s}
.lamp:hover{border-color:var(--brass);color:var(--brass)}
.lamp:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.lamp svg{width:18px;height:25px;overflow:visible;display:block}
.lamp .ln{fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.lamp .sd{fill:currentColor}
.lamp .glass{fill:transparent;transition:fill .35s}
.lamp .flame{fill:none;stroke:currentColor;stroke-width:1.1;transform-origin:12px 20px;transition:fill .3s,stroke .3s}
.lamp .glow{fill:#F2B544;opacity:0;transition:opacity .4s;filter:blur(4px)}
.lamp .say-on{display:inline}.lamp .say-off{display:none}
img.mk-d{display:none!important}
/* lit: evening */
:root[data-theme="dark"] .lamp .glow{opacity:.45}
:root[data-theme="dark"] .lamp .glass{fill:rgba(242,181,68,.16)}
:root[data-theme="dark"] .lamp .flame{fill:#F2B544;stroke:#F2B544;animation:flick 2.6s ease-in-out infinite}
:root[data-theme="dark"] .lamp .say-on{display:none}
:root[data-theme="dark"] .lamp .say-off{display:inline}
:root[data-theme="dark"] img.mk-l{display:none!important}
:root[data-theme="dark"] img.mk-d{display:block!important}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .lamp .glow{opacity:.45}
  :root:not([data-theme="light"]) .lamp .glass{fill:rgba(242,181,68,.16)}
  :root:not([data-theme="light"]) .lamp .flame{fill:#F2B544;stroke:#F2B544;animation:flick 2.6s ease-in-out infinite}
  :root:not([data-theme="light"]) .lamp .say-on{display:none}
  :root:not([data-theme="light"]) .lamp .say-off{display:inline}
  :root:not([data-theme="light"]) img.mk-l{display:none!important}
  :root:not([data-theme="light"]) img.mk-d{display:block!important}
}
@keyframes flick{0%,100%{transform:scale(1,1)}30%{transform:scale(.93,1.05)}60%{transform:scale(1.04,.96)}}
@media (prefers-reduced-motion:reduce){.lamp .flame{animation:none!important}}
.lamp-float{position:fixed;top:12px;right:12px;z-index:10;background:var(--panel)}
