/* Reset, tipografías y variables de tema / paleta */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#0a0e12}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;border:none;background:none}
input,textarea{font:inherit;outline:none}
::selection{background:var(--accent);color:var(--on)}

:root{
  --font-body:'IBM Plex Sans',sans-serif;
  --font-display:'Chakra Petch';
  --font-mono:'JetBrains Mono';
}

/* tema claro / oscuro */
[data-theme="dark"]{--bg:#0a0e12;--panel:#0e151b;--panel2:#131c24;--line:rgba(255,255,255,.09);--text:#e8eff5;--muted:#8b98a6;--on:#06120c;--grid:rgba(255,255,255,.045)}
[data-theme="light"]{--bg:#f3efe7;--panel:#ffffff;--panel2:#ece7db;--line:rgba(20,20,20,.12);--text:#16202a;--muted:#5d6873;--on:#06120c;--grid:rgba(0,0,0,.05)}

/* paletas (botón de color del menú) */
[data-vibe="phosphor"]{--accent:#27d885;--accent2:#15bdb6;--glow:rgba(39,216,133,.28)}
[data-vibe="arcade"]{--accent:#ff4f74;--accent2:#ffb13b;--glow:rgba(255,79,116,.28)}
[data-vibe="cobalt"]{--accent:#5b8cff;--accent2:#9b6bff;--glow:rgba(91,140,255,.28)}
[data-vibe="mono"]{--accent:#c8d2dc;--accent2:#7d8893;--glow:rgba(200,210,220,.18)}
[data-vibe="mono"][data-theme="light"]{--accent:#2a333d;--accent2:#5d6873;--glow:rgba(40,50,60,.12);--on:#ffffff}

/* raíz de la página */
.page{position:relative;min-height:100vh;background:var(--bg,#0a0e12);color:var(--text,#e8eff5);font-family:var(--font-body);overflow-x:hidden;transition:background .4s ease,color .4s ease}
.bg-grid{position:fixed;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:44px 44px;animation:gridpan 9s linear infinite;mask-image:radial-gradient(120% 90% at 50% 0%,#000 30%,transparent 80%)}
.bg-glow{display:none}
.container{position:relative;z-index:1;max-width:1140px;margin:0 auto;padding:0 clamp(20px,5vw,40px)}