/* Temas alternativos ao preto (26/10), pedido do Vini: "o preto está muito pesado".
   Ativados por <html data-tema="claro|vinho">. Na prévia dá para testar com ?tema=claro ou ?tema=vinho.
   Sem data-tema, o quiz continua no preto (tema-escuro.css). */

/* ========================= VINHO ========================= */
html[data-tema=vinho] body,
html[data-tema=vinho] body.hero-mode,
html[data-tema=vinho] body:not(.hero-mode){background:linear-gradient(180deg,#2a0c15 0%,#1c0a10 55%,#160810 100%);background-attachment:fixed;--paper:#1f0b12;--white:#36131e}
html[data-tema=vinho] body:not(.hero-mode) .option{background:#36131e;border-color:rgba(255,255,255,.1)}
html[data-tema=vinho] body:not(.hero-mode) .option:hover{background:#421826}
html[data-tema=vinho] body:not(.hero-mode) .art-frame,
html[data-tema=vinho] body:not(.hero-mode) .image-option:nth-child(even) .art-frame,
html[data-tema=vinho] body:not(.hero-mode) .media-slot{background:#2c0f18}
html[data-tema=vinho] body:not(.hero-mode) .callout,
html[data-tema=vinho] .tr-legendas p,
html[data-tema=vinho] .car-slide,
html[data-tema=vinho] .carrossel.com-legenda .car-slide,
html[data-tema=vinho] .oferta-preco{background:#36131e}
html[data-tema=vinho] body:not(.hero-mode) .sticky-action{background:linear-gradient(transparent,#1c0a10 22%)}

/* ========================= CLARO (creme rosado) ========================= */
html[data-tema=claro]{--c-fundo:#fff6f3;--c-card:#ffffff;--c-borda:#f0d9d3;--c-texto:#2b1a1e;--c-suave:#6f5a5f;--c-vermelho:#e50914}
html[data-tema=claro] body,
html[data-tema=claro] body.hero-mode,
html[data-tema=claro] body:not(.hero-mode){background:var(--c-fundo);color:var(--c-texto);--ink:#2b1a1e;--muted:#6f5a5f;--line:#f0d9d3;--paper:#fff6f3;--white:#fff}
html[data-tema=claro] body::before{background:radial-gradient(circle,rgba(229,9,20,.08),transparent 62%)}
html[data-tema=claro] body::after{background:radial-gradient(circle,rgba(229,9,20,.05),transparent 62%)}
/* textos */
html[data-tema=claro] body:not(.hero-mode) h1,html[data-tema=claro] body:not(.hero-mode) h2,html[data-tema=claro] body:not(.hero-mode) h3,
html[data-tema=claro] .hero-mode .hero-question h2,html[data-tema=claro] .fecho-tela6{color:var(--c-texto)}
html[data-tema=claro] body:not(.hero-mode) .intro,html[data-tema=claro] body:not(.hero-mode) .prose,html[data-tema=claro] body:not(.hero-mode) .prose p,
html[data-tema=claro] .hero-mode .hero-question>p,html[data-tema=claro] .problema-texto,html[data-tema=claro] .oferta-lista li,html[data-tema=claro] .nota-cta,
html[data-tema=claro] body:not(.hero-mode) .callout p{color:var(--c-suave)}
html[data-tema=claro] body:not(.hero-mode) .prose strong,html[data-tema=claro] .problema-texto strong,html[data-tema=claro] .oferta-lista strong,
html[data-tema=claro] .oferta-desc strong,html[data-tema=claro] body:not(.hero-mode) .meta-sub strong,html[data-tema=claro] .meta-texto strong{color:var(--c-texto)}
/* cabeçalho */
html[data-tema=claro] .expert-instagram,html[data-tema=claro] body:not(.hero-mode) .expert-instagram{color:var(--c-texto)}
html[data-tema=claro] body:not(.hero-mode) .inner-reference-header .back{color:var(--c-suave);border-color:var(--c-borda);background:#fff}
html[data-tema=claro] body:not(.hero-mode) .inner-reference-header .phase-bars>span,html[data-tema=claro] .reference-progress>span{background:#f0d9d3}
html[data-tema=claro] body:not(.hero-mode) .inner-reference-header .phase-bars i{box-shadow:none}
/* alternativas */
html[data-tema=claro] body:not(.hero-mode) .option{background:var(--c-card);border-color:var(--c-borda);box-shadow:0 2px 0 #f3e3df}
html[data-tema=claro] body:not(.hero-mode) .option-copy{color:var(--c-texto)}
html[data-tema=claro] body:not(.hero-mode) .option-copy small{color:var(--c-suave)}
html[data-tema=claro] body:not(.hero-mode) .option:hover{background:#fff1ee;border-color:#f2a5a0}
html[data-tema=claro] body:not(.hero-mode) .option.selected{background:#fde8e6;border-color:var(--c-vermelho);box-shadow:0 0 0 1px var(--c-vermelho)}
html[data-tema=claro] body:not(.hero-mode) .option.selected .option-copy{color:#8f0d14}
html[data-tema=claro] body:not(.hero-mode) .radio-mark,html[data-tema=claro] body:not(.hero-mode) .checkmark{border-color:#d9bfb9}
html[data-tema=claro] body:not(.hero-mode) .art-frame,html[data-tema=claro] body:not(.hero-mode) .image-option:nth-child(even) .art-frame,
html[data-tema=claro] body:not(.hero-mode) .media-slot{background:#f6e8e4}
/* botões e barra fixa */
html[data-tema=claro] body:not(.hero-mode) .primary{box-shadow:0 8px 22px rgba(229,9,20,.22)}
html[data-tema=claro] body:not(.hero-mode) .sticky-action{background:linear-gradient(rgba(255,246,243,0),var(--c-fundo) 22%)}
/* capa */
html[data-tema=claro] .hero-mode .capa-arte{box-shadow:0 10px 30px rgba(120,20,30,.18)}
html[data-tema=claro] .capa-nota{background:#fff;border-color:var(--c-borda);color:var(--c-suave)}
html[data-tema=claro] .capa-tempo{color:var(--c-texto)}
/* réguas */
html[data-tema=claro] body:not(.hero-mode) .measure input:not([type=range]){color:var(--c-texto)}
html[data-tema=claro] body:not(.hero-mode) .measure .ruler{background-image:repeating-linear-gradient(to right,rgba(43,26,30,.5) 0,rgba(43,26,30,.5) 2px,transparent 2px,transparent 50px),repeating-linear-gradient(to right,rgba(43,26,30,.2) 0,rgba(43,26,30,.2) 1px,transparent 1px,transparent 10px)}
html[data-tema=claro] body:not(.hero-mode) .measure input[type=range]{background:linear-gradient(to right,#e50914 var(--fill),#ecd6d0 var(--fill))}
html[data-tema=claro] body:not(.hero-mode) .unit-pill{background:#fde3e1;color:#b30b14}
html[data-tema=claro] body:not(.hero-mode) .range-labels,html[data-tema=claro] .measure-hint,html[data-tema=claro] .measure-value>span{color:var(--c-suave)}
/* carregando */
html[data-tema=claro] body:not(.hero-mode) .loading-track{background:#f0d9d3}
html[data-tema=claro] body:not(.hero-mode) .orbit:before{border-color:#f0d9d3;border-top-color:#e50914}
html[data-tema=claro] .loading-percent{color:var(--c-suave)}
html[data-tema=claro] body:not(.hero-mode) .loading-checks p{color:var(--c-suave)}
html[data-tema=claro] body:not(.hero-mode) .loading-checks p.done{color:var(--c-texto)}
html[data-tema=claro] body:not(.hero-mode) .inner-reference-header .avatar,html[data-tema=claro] .orbit .avatar{border-color:#fff}
/* fotos, quadros e carrossel */
html[data-tema=claro] body:not(.hero-mode) .before-after{border-color:var(--c-borda);background:var(--c-borda)}
html[data-tema=claro] body:not(.hero-mode) .callout{background:#fff;border-color:var(--c-borda)}
html[data-tema=claro] body:not(.hero-mode) .callout h2{color:var(--c-texto)}
html[data-tema=claro] .car-slide,html[data-tema=claro] .carrossel.com-legenda .car-slide{background:#fff;border-color:var(--c-borda)}
html[data-tema=claro] .car-legenda{color:var(--c-texto)}
html[data-tema=claro] .car-ponto{background:#e7cfc9}
/* problema encontrado */
html[data-tema=claro] .alerta-problema{background:#fde8e6;border-color:#f3a7a3;color:#b30b14}
html[data-tema=claro] body:not(.hero-mode) .problema-titulo,html[data-tema=claro] .problema-calma{color:var(--c-texto)}
html[data-tema=claro] .problema-lista li{background:#fff;border-color:var(--c-borda);color:var(--c-texto)}
/* oferta */
html[data-tema=claro] body:not(.hero-mode) .oferta-recebe{color:var(--c-texto)}
html[data-tema=claro] .oferta-preco{background:#fff;border-color:#f3a7a3;box-shadow:0 10px 30px rgba(229,9,20,.1)}
html[data-tema=claro] .oferta-acesso,html[data-tema=claro] .oferta-de,html[data-tema=claro] .oferta-vista{color:var(--c-suave)}
html[data-tema=claro] .oferta-acesso strong,html[data-tema=claro] .oferta-valor{color:var(--c-texto)}
/* tela da Isa (história) */
html[data-tema=claro] body:not(.hero-mode) .media-label{background:rgba(43,26,30,.75)}
