/* Temas del portal: oscuro y claro (assets/js/tema.js).
   La elección se guarda en el navegador (localStorage «thor-tema») y se aplica con
   html[data-tema="…"] antes de pintar la página. Sobrescribe los tokens de cada bloque
   [data-theme] para que todo el portal cambie a la vez. Sin elección: cada página usa su tema de diseño. */
html[data-tema="light"] [data-theme], html[data-tema="light"] body {--surface:#FFFFFF;--surface-raised:#F1F5FA;--surface-arena:#F4EBDC;--surface-inverse:#0B1F3A;--line:#DFE8F4;--line-strong:#6B819F;--ink:#0E1116;--ink-muted:#48566B;--ink-inverse:#FFFFFF;--brand:#0B1F3A;--on-brand:#FFFFFF;--route:#D42A20;--on-route:#FFFFFF;--route-text:#B8241B;--link:#224B8A;--focus:#224B8A;--premium:#8A6418;--premium-fill:#C29A3A;--on-premium:#0E1116;--ok:#12703F;--warn:#7A5C00;--warn-fill:#F2B705;--logo-ink:#0B1F3A;--pilar-tecnologia:#0B1F3A;--pilar-negocio:#1F7A5C;--pilar-persona:#8C6F4A;--crit:#B8241B;--shadow-sm:0 1px 2px #0B1F3A14;--shadow-lg:0 12px 32px -8px #0B1F3A33;--glow-route:0 0 0 1px #D42A20;--focus-ring:0 0 0 2px #FFFFFF, 0 0 0 4px #224B8A;;color-scheme:light;}
html[data-tema="dark"] [data-theme], html[data-tema="dark"] body {--surface:#06111F;--surface-raised:#0B1F3A;--surface-arena:#2A2117;--surface-inverse:#F1F5FA;--line:#18396A;--line-strong:#4F74A8;--ink:#F1F5FA;--ink-muted:#A6B7CD;--ink-inverse:#0B1F3A;--brand:#BCD0EA;--on-brand:#06111F;--route:#F0503A;--on-route:#06111F;--route-text:#F5654F;--link:#8DAEDB;--focus:#8DAEDB;--premium:#DDB963;--premium-fill:#C29A3A;--on-premium:#0E1116;--ok:#3FCB80;--warn:#FFCB3D;--warn-fill:#F2B705;--logo-ink:#F1F5FA;--pilar-tecnologia:#BCD0EA;--pilar-negocio:#5FD3A8;--pilar-persona:#C4A57A;--crit:#F5654F;--shadow-sm:0 1px 2px #00000080;--shadow-lg:0 16px 40px -8px #000000B3;--glow-route:0 0 0 1px #F0503A, 0 0 18px #F0503A59;--focus-ring:0 0 0 2px #06111F, 0 0 0 4px #8DAEDB;;color-scheme:dark;}
html[data-tema="light"] body { background: #FFFFFF; }
html[data-tema="dark"] body { background: #06111F; }

/* Botones flotantes (derecha, centrados en vertical) */
.tm-switch { position: fixed; left: max(14px, env(safe-area-inset-left, 0px)); top: 50%; z-index: 70; display: flex; flex-direction: column; gap: 8px; padding: 6px;
  border: 1px solid rgba(107, 129, 159, .45); border-radius: 999px; background: rgba(241, 245, 250, .72); backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px); box-shadow: 0 10px 28px -10px rgba(6, 17, 31, .55); transform: translateY(-50%); }
html[data-tema="dark"] .tm-switch, html:not([data-tema]) .tm-switch.is-dark { background: rgba(11, 31, 58, .72); border-color: rgba(79, 116, 168, .6); }
.tm-btn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border-radius: 999px;
  cursor: pointer; transition: transform 160ms ease, box-shadow 200ms ease; }
.tm-btn svg { width: 19px; height: 19px; }
.tm-btn:hover { transform: scale(1.06); }
.tm-btn:focus-visible { outline: none; box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 4px #224B8A; }
.tm-dark { background: #0B1F3A; color: #F1F5FA; border: 1px solid #4F74A8; }
.tm-light { background: #FFFFFF; color: #0B1F3A; border: 1px solid #BCD0EA; }
.tm-btn[aria-pressed="true"] { box-shadow: 0 0 0 2px #F0503A; }
.tm-btn[aria-pressed="true"]:focus-visible { box-shadow: 0 0 0 2px #F0503A, 0 0 0 5px #8DAEDB; }
@media (max-width: 640px) { .tm-switch { left: 8px; gap: 6px; padding: 4px; } .tm-btn { width: 36px; height: 36px; } }
@media print { .tm-switch { display: none; } }

/* Lobby (raíz) en estilo claro: sin viñeta oscura y textos en azul marino */
html[data-tema="light"] body.lobby { background: radial-gradient(120% 90% at 50% 40%, #FFFFFF 0%, #F7F9FC 62%, #F1F5FA 100%); }
html[data-tema="light"] .lb-vignette { background: radial-gradient(42% 46% at 50% 47%, rgba(255,255,255,.9) 0%, rgba(255,255,255,.55) 55%, rgba(255,255,255,0) 100%); }
html[data-tema="light"] .lb-eyebrow, html[data-tema="light"] .lb-pillars { color: #0B1F3A; }
html[data-tema="light"] .lb-lang { background: rgba(255,255,255,.85); border-color: #BCD0EA; }
html[data-tema="light"] .lb-lang:hover, html[data-tema="light"] .lb-lang:focus-visible { background: #FFFFFF; }
html[data-tema="light"] .lb-go { color: #0B1F3A; }
html[data-tema="light"] .lb-foot { color: #3A4F6B; opacity: 1; }
html[data-tema="light"] .lb-brand svg { filter: none; }