/* Conmutador claro/oscuro del núcleo (js/tema.js). Un solo botón para Sitio y Apps: 44 px, redondo, en la cabecera.
   Muestra la luna en claro (pasa a oscuro) y el sol en oscuro. Los colores de cada tema viven en tokens.css. */
.tema-btn{position:relative;display:inline-grid;place-items:center;flex:none;width:44px;height:44px;min-width:44px;padding:0;border-radius:999px;
  border:1px solid var(--linea);background:var(--superficie);color:var(--tinta);cursor:pointer;font:inherit;-webkit-user-select:none;user-select:none}
.tema-btn:hover{border-color:var(--marca)}
.tema-btn svg{width:22px;height:22px;display:block}
.tema-btn .tema-sol{display:none}
:root[data-tema-actual=oscuro] .tema-btn .tema-luna{display:none}
:root[data-tema-actual=oscuro] .tema-btn .tema-sol{display:block}
@media (prefers-reduced-motion:no-preference){.tema-btn svg{transition:transform var(--dur-normal,250ms) var(--curva,ease)}.tema-btn:active svg{transform:rotate(-20deg) scale(.92)}}