/* Official 1.16: colors and illustrations over the existing responsive layouts. */
body[data-codin-halloween] {
  --azul: #ffac42; --azul-dark: #e58a35; --azul-light: #3d274c;
  --texto: #fff5e9; --texto-s: #c0abc9; --borda: #513665; --fundo: #170d25;
}
[data-codin-halloween] :is(.forum-topico-card,.forum-topico-detalhe,.forum-resposta-card,.forum-form-novo,.forum-form-resposta,.desafio-card,.desafio-historico-item,.desafios-vazio,.settings-card,.modal-box,.login-card) {
  color: var(--hw-ink); background: var(--hw-panel); border-color: var(--hw-border);
  box-shadow: 0 4px 20px #0d061b25;
}
[data-codin-halloween] :is(.forum-header h1,.forum-topico-titulo,.forum-topico-detalhe h1,.forum-topico-corpo,.forum-resposta-corpo,.desafios-header h1,.desafios-hall-fama h2,.desafio-card h2,.desafio-historico-item .info h3,.legal-container h2,.settings-header h1,.settings-card h2,.setting-label,.modal-header h3) { color: var(--hw-ink); }
[data-codin-halloween] :is(.forum-header p,.forum-topico-meta,.forum-resposta-meta,.forum-vazio,.desafios-header p,.desafio-descricao,.desafio-premio-box .detalhe,.desafio-historico-item .info span,.legal-container p,.legal-container ul,.legal-atualizado,.settings-header p,.setting-desc,.modal-body p,.atividade-item .detalhe) { color: var(--hw-muted); }
[data-codin-halloween] :is(.forum-cat-tab,.forum-pag-btn,.forum-topico-cat,.forum-citacao,.desafio-premio-box,.desafio-minha-posicao,#forum-respondendo-a) { color: #ead7fc; background: #392448; border-color: #68467c; }
[data-codin-halloween] :is(.forum-cat-tab.ativa,.forum-pag-btn.ativa,.btn-novo-topico,.btn-publicar) { background: var(--hw-orange); color: #29142f; border-color: var(--hw-orange); }
[data-codin-halloween] :is(.forum-voltar,.forum-btn-responder,.legal-container a,.legal-logo,.desafio-tempo-restante,.desafio-historico-vencedor) { color: #ffca78; }
[data-codin-halloween] :is(.forum-form-novo,.forum-form-resposta) :is(input,select,textarea),
[data-codin-halloween] :is(.modal-body input,.form-group input,.form-group select,.form-group textarea,.field input) { background: #1e132b; border-color: #704e85; color: #fff5e9; }
[data-codin-halloween] .desafio-leaderboard th { color: #dcc4ed; background: #21132f; border-color: #513665; }
[data-codin-halloween] .desafio-leaderboard td { border-color: #513665; }
[data-codin-halloween] .desafio-leaderboard tr.eu td { background: #443052; color: #ffe5b8; }
[data-codin-halloween] .setting-item { border-color: #513665; }
[data-codin-halloween] .setting-item:hover { background: #342142; }
[data-codin-halloween] :is(.modal-card,.card-compra,.card-erro) { color: var(--hw-ink); background: var(--hw-panel); border-color: var(--hw-border); }
[data-codin-halloween] :is(.texto-compra,.descricao-item) { color: var(--hw-muted) !important; }
[data-codin-halloween] .titulo-compra { color: var(--hw-ink); }
[data-codin-halloween] #mod-preco-item { display: inline-flex; align-items: center; gap: 6px; color: #ffce7a; }
[data-codin-halloween] .avatar-codin { position: relative; overflow: hidden; border: 0; box-shadow: none; }
[data-codin-halloween] .caixa-boas-vindas { position: relative; overflow: hidden; }
[data-codin-halloween] button:disabled { cursor: not-allowed; }

/* Keep admin table dimensions, action colors and mobile drawer. */
[data-codin-halloween] :is(.sidebar,.topbar) { background: #21132f; border-color: #513665; }
[data-codin-halloween] .main-content { background: transparent; }
[data-codin-halloween] :is(.stat-card,.card,.action-card) { background-color: var(--hw-panel); border-color: var(--hw-border); }
[data-codin-halloween] :is(.topbar-title,.stat-info .value,.card-header h3,.action-card h4,.admin-name,.toggle-info .title,.form-group label,.field label) { color: var(--hw-ink); }
[data-codin-halloween] :is(.stat-info .label,.action-card p,.admin-role,.toggle-info .desc,.nav-section-label,.log-detalhe,.log-hora) { color: var(--hw-muted); }
[data-codin-halloween] .card :is(thead th,tbody td) { border-color: #513665; color: #e6d8ee; }
[data-codin-halloween] .card thead th { background: #21132f; }
[data-codin-halloween] .card tbody tr:hover { background: #362245; }
[data-codin-halloween] .nav-item.active { background: #483057; color: #ffcc81; }

/* Existing official landing sections, with the approved forest and mascot. */
.hw-login-page .hero-v1 { background: linear-gradient(90deg,#170d25eb,#170d2566 60%,#170d25a1),url('/codin/login-floresta.webp') center/cover no-repeat; }
.hw-login-page .hero-v1::before { background: linear-gradient(0deg,#170d25,transparent 32%); }
.hw-login-page .cena-mascote { background: none; }
.hw-login-page .btn-nav-sec { background: #382448; color: #ffe1ad; }
.hw-login-page .container-login { gap: clamp(24px,4vw,64px); }
.hw-login-page .secao-formulario { min-width: 0; }
.hw-login-page .secao-apresentacao h1 { color: #fff2d9; text-shadow: 0 3px 15px #170d2570; }
.hw-login-page :is(.subtitulo-apresentacao,.secao-titulo p,.feature-card p,.split-texto p,.depoi-texto) { color: #dfcce9; }
.hw-login-page .mascote-principal { object-fit: contain; filter: drop-shadow(0 0 14px #b590d03d); }
.hw-login-page .icone-react { left: 0; top: 36%; color: #9ee1ef; animation-delay: -2s; }
.hw-login-page .icone-java { right: 0; top: 44%; color: #ffbd79; animation-delay: -4s; }
.hw-login-page .navbar .nav-logo { color: #ffe1a5; }
.hw-login-page .navbar .nav-logo span { color: #c8a0e5; }
.hw-login-page :is(.stats-banner,.linguagens-wrapper,.depoi-wrapper,.cta-final,.footer) { background: #21132f; border-color: #513665; }
.hw-login-page :is(.lang-card,.feature-card,.depoi-card,.mockup-missao,.mockup-streak) { background: #2c1b3a; border-color: #674377; color: #fff2df; box-shadow: 0 4px 0 #0d07184f; }
.hw-login-page :is(.lang-card span,.mockup-curso-nome,.mockup-pergunta,.streak-label,.depoi-nome) { color: #f6e2ff; }
.hw-login-page .mockup-opcao { background: #382448; color: #dfcce9; border-color: #674377; }
.hw-login-page .mockup-opcao.certa { background: #243c30; color: #c0ebce; border-color: #70b48b; }
.hw-login-page .mockup-opcao.errada { background: #512c39; color: #ffd1db; border-color: #be667d; }
.hw-login-page .streak-dia { background: #372145; color: #ccb1de; }
.hw-login-page .streak-dia.ativo { background: #ed963f; color: #2c1733; }
.hw-login-page footer { background: #160c21; border-color: #513665; }
.hw-login-page footer :is(p,a) { color: #c0abc9; }
.hw-login-page .label-termos { color: #cbbbd5 !important; }
.hw-login-page #janela-login .grupo-input input:not([type='checkbox']) { min-width: 0; width: 100%; }
.hw-scroll-spider { position: fixed; left: 0; top: 0; width: 72px; height: 72px; z-index: 20; pointer-events: none; filter: drop-shadow(0 3px 6px #0b061a70); }
.hw-scroll-spider svg { display: block; width: 100%; height: 100%; }

/* Review portrait and message are separate, static panels. */
#modal-revisao .review-card { box-sizing: border-box; width: min(460px,calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: auto; padding: 22px; border: 1px solid #79528e; border-radius: 24px; background: #281936; text-align: center; box-shadow: 0 22px 80px #07020d80; }
.review-portrait { width: 190px; max-width: 70%; margin: 0 auto 18px; padding: 10px; background: #fff; border-radius: 20px; transform: rotate(-2deg); box-shadow: 0 6px 0 #1a0f24; }
.review-portrait img { width: 100%; height: auto; display: block; border-radius: 12px; animation: none !important; transform: none !important; opacity: 1 !important; }
.review-message { padding: 18px; background: #382445; border: 1px solid #644378; border-radius: 16px; margin-bottom: 18px; }
.review-message h2 { font-size: 22px; color: #ffe0a6; margin: 0 0 10px; }
.review-message p { color: #e1cce9; line-height: 1.6; margin: 0; }
.audio-preferences input[type='range'] { accent-color: #ffac42; width: min(160px,32vw); }

@media (max-width: 1000px) { [data-codin-halloween] .navbar .menu-separado { gap: 6px; } }
@media (max-width: 768px) {
  body[data-codin-halloween] { background-attachment: scroll; }
  .hw-scroll-spider { width: 50px; height: 50px; }
  .hw-login-page .container-login { gap: 28px; }
  .hw-login-page .secao-formulario { width: 100%; }
  .review-portrait { width: 150px; }
  .review-message { padding: 14px; }
}
@media (prefers-reduced-motion: reduce) { .hw-scroll-spider { display: none; } }

/* Official dashboard uses inline colors on daily missions and consent. */
[data-codin-halloween] :is(.vs2-card,.urgente-item) { background: #281936 !important; border-color: #654273 !important; }
[data-codin-halloween] :is(.urgente-titulo,.urgente-desc,.urgente-prog,.vs2-mission-details,.vs2-progress-text,.vs2-progress-percentage,.vs2-rewards span,.item-conquista p) { color: #dbc5e5 !important; }
[data-codin-halloween] .urgente-item.urgente-exp { opacity: .75; background: #24182f !important; }
[data-codin-halloween] .urgente-icone { background: #47304f; color: #ffca78; }
[data-codin-halloween] :is(.rank-home-nome,.prox-conq-nome) { color: #f6e2ff; }
[data-codin-halloween] :is(.rank-home-nivel,.prox-conq-label,.prox-conq-vazio) { color: #cbb4d8; }
[data-codin-halloween] .prox-conq-barra-bg { background: #170e21; }
[data-codin-halloween] #preloader p { color: #efd9ff; }
[data-codin-halloween] #bloco-teste-gratis { background: #362245 !important; border-color: #79528e !important; }
[data-codin-halloween] #teste-gratis-texto { color: #ead7f5 !important; }
[data-codin-halloween] #btn-teste-gratis { color: #fff5e9; }
[data-codin-halloween] .settings-card h2 { background: #322040; border-color: #513665; }
[data-codin-halloween] .setting-label i { color: #cbb4d8; }
[data-codin-halloween] .audio-preferences .setting-item { gap: 18px; }
[data-codin-halloween] .audio-preferences .toggle-switch { flex: 0 0 50px; }
[data-codin-halloween] .toggle-switch input:focus-visible + .slider { outline: 3px solid #ffac42; outline-offset: 3px; }
[data-codin-halloween] #badge-nivel-container { background: #70458d !important; }
[data-codin-halloween] #contador-passos { color: #dfcce9; }
[data-codin-halloween] #btn-fechar-revisao { background: #ffac42; color: #29142f; }

.hw-admin-page { --bg:#170d25; --bg-main:#170d25; --surface:#21132f; --sidebar:#21132f; --sidebar-bd:#513665; --card:#281936; --bg-card:#281936; --text-p:#fff5e9; --text-main:#fff5e9; --text-s:#c0abc9; --text-muted:#b8a0c6; --border:#513665; }
.hw-admin-page :is(.btn-secondary,.toast) { background: #382448; color: #ead7f5; }
.hw-admin-page #dash-info-usuario > div > div { background: #362245 !important; border-color: #513665 !important; }
.hw-admin-page :is(.main-content,.card,.table-wrapper) { min-width: 0; max-width: 100%; }
.hw-admin-page .table-wrapper { overflow-x: auto; }
.hw-admin-page #screen-login { padding: 20px; }
.hw-admin-page .login-card { width: min(380px,100%); }
@media (max-width: 700px) {
  .hw-admin-page .topbar { flex-wrap: wrap; gap: 8px; padding: 14px 16px; }
  .hw-admin-page .topbar-time { font-size: 11px; }
  .hw-admin-page .log-item { grid-template-columns: auto minmax(0,1fr); }
  .hw-admin-page .log-hora { grid-column: 2; }
  .hw-admin-page .log-detalhe { overflow-wrap: anywhere; }
}
[data-codin-halloween] :is(.urgente-barra-bg,.vs2-progress-bar-bg) { background: #170e21 !important; }
[data-codin-halloween] #codin-termos-overlay > div { background: #281936 !important; border: 1px solid #79528e; }
[data-codin-halloween] #codin-termos-overlay :is(h3,p,label) { color: #ead6f3 !important; }
[data-codin-halloween] #codin-termos-overlay a { color: #ffca78 !important; }
[data-codin-halloween] #codin-termos-sair { background: #382448 !important; color: #ead6f3 !important; border-color: #79528e !important; }
[data-codin-halloween] #codin-termos-aceitar:not(:disabled) { background: #965bb7 !important; }
@media (min-width: 769px) and (max-width: 1600px) {
  body[data-codin-halloween]:not(.hw-login-page) .navbar { flex-wrap: wrap; height: auto; gap: 10px; }
  body[data-codin-halloween]:not(.hw-login-page) .navbar .left { gap: 18px; }
  body[data-codin-halloween]:not(.hw-login-page) .navbar .right-side { margin-left: auto; }
}
@media (max-width: 480px) {
  body[data-codin-halloween]:not(.hw-login-page) .navbar .menu-separado { flex-wrap: wrap; justify-content: flex-end; gap: 4px; max-width: calc(100vw - 142px); }
  body[data-codin-halloween]:not(.hw-login-page) .navbar .logo h2 { font-size: 22px; }
  body[data-codin-halloween]:not(.hw-login-page) .candy-pill { padding: 3px 5px; }
}