/* Tema oscuro */
:root[data-tema="oscuro"] {
    --negro: #f3efe8; --blanco: #121110; --grafito: #e4e0d7; --hueso: #1d1b19; --hueso-2: #2a2724;
    --niebla: #a39f97; --linea-oscura: rgba(255, 255, 255, 0.16);
}
:root[data-tema="oscuro"] .hero, :root[data-tema="oscuro"] .pie { background: var(--fondo-oscuro); color: #fff; }
:root[data-tema="oscuro"] .hero .btn-principal { background: #fff; color: var(--fondo-oscuro); }
:root[data-tema="oscuro"] .pie-columna a, :root[data-tema="oscuro"] .pie-marca .marca-nombre { color: #fff; }
:root[data-tema="oscuro"] .btn-ia, :root[data-tema="oscuro"] .btn-subir { box-shadow: 0 0 0 1px rgba(255,255,255,.25); }
body, .encabezado, .modal, .drawer { transition: background-color .3s ease, color .3s ease; }