
/* HALLOWEEN ILUSTRADO
   Camada visual sobre o layout original. Larguras, colunas, ordem,
   espaçamentos, fontes e dimensões das camadas continuam no CSS original. */
:root {
  color-scheme: dark;
  --hw-bg: #170d25; --hw-panel: #281936; --hw-raised: #362245;
  --hw-border: #513665; --hw-ink: #fff5e9; --hw-muted: #c0abc9;
  --hw-orange: #ffac42; --hw-purple: #b794e6; --hw-green: #9dd3ad;
  --cor-fundo: var(--hw-bg); --cor-cartao: var(--hw-panel);
  --texto-principal: var(--hw-ink); --texto-secundario: var(--hw-muted);
  --azul-codin: var(--hw-orange); --sombra-codin: #bd6b29;
  --fundo-input: #21152e; --borda-input: var(--hw-border);
  --cor-primaria: var(--hw-orange); --cor-secundaria: var(--hw-muted);
  --cor-fundo-cartao: var(--hw-panel); --cor-fundo-padrao: var(--hw-panel);
  --cor-fundo-completa: #26372e; --cor-texto-completa: var(--hw-green);
  --cor-xp: var(--hw-purple); --cor-moeda: #ffcf7a;
  --cor-progresso-bg: #160e20; --cor-progresso-bar: var(--hw-green);
  --cor-header-icon: var(--hw-orange); --cor-weekly-icon: var(--hw-purple);
  --cor-texto: var(--hw-ink); --cor-pontos: var(--hw-green);
  --text: var(--hw-ink);
}
body[data-codin-halloween] { background-color: var(--hw-bg); color: var(--hw-ink); background-image: linear-gradient(#170d25f2,#170d25ed),url('../codin/noite-desenho.webp'); background-position: center; background-size: cover; background-attachment: fixed; }
[data-codin-halloween] ::selection { background: #9258b9; color: #fff; }
[data-codin-halloween] :is(a,button,input,select,textarea):focus-visible { outline: 3px solid var(--hw-orange); outline-offset: 3px; }
[data-codin-halloween] .navbar { background: #21132f; border-bottom-color: var(--hw-border); }
[data-codin-halloween] .navbar a,[data-codin-halloween] .nav-links { color: var(--hw-ink); }
[data-codin-halloween] .logo h2 span { color: var(--hw-orange); }
[data-codin-halloween] .nav-links li:hover,[data-codin-halloween] .nav-links a[aria-current='page'] li { color: var(--hw-orange); background: #3a244b; }
[data-codin-halloween] .menu div { background: #ddc5ec; }
[data-codin-halloween] .free { background: #5d3879; color: #f3e4ff; }
[data-codin-halloween] .level { background: #6a408b; color: #fff2d6; }
[data-codin-halloween] .level .bar { background: var(--hw-orange); }
[data-codin-halloween] .xp-pill { background: #39412d; color: #e6f4d3; }
[data-codin-halloween] .hearts-pill { background: #422039; }
[data-codin-halloween] .fire-pill { background: #4b2c22; color: #ffc56b; }
[data-codin-halloween] .upgrade { background: #ee9448; color: #261331; }
[data-codin-halloween] .material-symbols-outlined { width: 1em; max-width: 1em; overflow: hidden; white-space: nowrap; vertical-align: middle; flex-shrink: 0; }

/* Mesmo painel, na mesma coluna e com as mesmas dimensões do original. */
[data-codin-halloween] .caixa-boas-vindas { background: #362047; isolation: isolate; box-shadow: inset 0 0 0 1px #a776c24f; }
[data-codin-halloween] .caixa-boas-vindas::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(90deg,#362047 38%,#362047bf 60%,transparent 85%),url('../codin/noite-desenho.webp') right center / auto 100% no-repeat; }
[data-codin-halloween] .cabecalho-boas-vindas h2 { color: #ffcc80; }
[data-codin-halloween] .cabecalho-boas-vindas p,[data-codin-halloween] .estatisticas-usuario { color: #f3e5ff; }
[data-codin-halloween] .item-estatistica i { color: #ffd68e; }
[data-codin-halloween] .botao-continuar-aprendendo { background: var(--hw-orange); color: #301934; }
[data-codin-halloween] .botao-continuar-aprendendo i { color: inherit; }
[data-codin-halloween] .botao-continuar-aprendendo:hover { background: #ffbf69; }
[data-codin-halloween] :is(.cartao,.item-missao-dashboard,.cards-cursos > .card,.vs2-card,.cartao-conquista) { background: var(--hw-panel); border-color: var(--hw-border); box-shadow: 0 3px 0 #10071b66,inset 0 0 0 1px #845ca82b; }
[data-codin-halloween] :is(.cartao h3,.missao-info h4,.cards-cursos h3,.secao2 h2,.vs2-section-title,.vs2-mission-name,.titulo-cartao) { color: var(--hw-ink); }
[data-codin-halloween] :is(.cartao p,.cards-cursos p,.descricao-cartao,.topo2 p,.vs2-mission-details) { color: var(--hw-muted); }
[data-codin-halloween] .item-missao-dashboard:hover { border-color: var(--hw-purple); }
[data-codin-halloween] .item-missao-dashboard.ativo .missao-numero { background: var(--hw-orange); border-color: var(--hw-orange); color: #301934; box-shadow: 0 0 0 3px #ffac4222; }
[data-codin-halloween] .item-missao-dashboard.ativo .missao-info h4 { color: #ffe5bb; }
[data-codin-halloween] .missao-numero { border-color: #765689; color: var(--hw-muted); }
[data-codin-halloween] .badge-status { color: #a9deb6; background: #314b3a; }
[data-codin-halloween] .btn-missao-continuar { background: #70499a; color: #fff; }
[data-codin-halloween] .btn-missao-continuar:hover { background: #8960b6; }
[data-codin-halloween] :is(.container-barra-progresso,.vs2-progress-bar-bg) { background: #170e21; }
[data-codin-halloween] .barra-progresso { background: #a081cd; }
[data-codin-halloween] .texto-progresso { color: #fff; text-shadow: 0 1px 2px #000; }
[data-codin-halloween] :is(.recompensa,.saldo-moedas,.pontos-cartao) { color: #ffcd7b; }
[data-codin-halloween] :is(.botao-personalizar,.botao-visitar-ranking,.ver-mais,.botao-continuar-aprendendo-2) { background: #412955; color: #efd7ff; border-color: #76508b; }
[data-codin-halloween] :is(.botao-personalizar,.botao-visitar-ranking,.ver-mais,.botao-continuar-aprendendo-2):hover { background: #654181; color: #fff; }
[data-codin-halloween] :is(.ver-todos,.barra-lateral .cartao h3 i,.icone-ranking) { color: var(--hw-orange); }
[data-codin-halloween] .item-conquista strong { color: var(--hw-ink); }
[data-codin-halloween] .caixa-footer { background: #382146; color: var(--hw-ink); box-shadow: inset 0 0 0 1px #a776c24f; }
[data-codin-halloween] .caixa-footer > i { color: #ffbb56; }
[data-codin-halloween] .caixa-footer p { color: #d7bcdf; }

/* Cenário fica atrás do mascote: nenhuma regra de tamanho/transform das layers. */
[data-codin-halloween] .codin-card { background: #4b2d61 url('../codin/estudio-desenho.webp') center / cover; border-color: #8c63a3; position: relative; isolation: isolate; }
[data-codin-halloween] .codin-card h2 { color: #fff3d8; text-shadow: 0 2px #362047; }
[data-codin-halloween] .codin-imagem { background: transparent; }
[data-codin-halloween] .moedas-disponiveis p { color: #fff0d5; text-shadow: 0 1px 3px #1e102e; }
[data-codin-halloween] .moedas-disponiveis .saldo-moedas { color: #ffd37e; }
[data-codin-halloween] .avatar-codin { background: #442859 url('../codin/estudio-desenho.webp') center / cover; border-color: #8c63a3; }
[data-codin-halloween] .abas-loja { border-color: var(--hw-border); }
[data-codin-halloween] .aba-botao { color: #c8add9; }
[data-codin-halloween] .aba-botao.active { color: var(--hw-orange); border-color: var(--hw-orange); }
[data-codin-halloween] .aba-botao:hover { background: #3a244b; }
[data-codin-halloween] .item-card { background: var(--hw-panel); border-color: var(--hw-border); box-shadow: 0 3px 0 #10071b66; transition: border-color .2s,transform .2s; }
[data-codin-halloween] .item-card:hover { border-color: #ad83c5; transform: translateY(-3px); }
[data-codin-halloween] .item-card h3 { color: var(--hw-ink); }
[data-codin-halloween] .item-card .preco { color: #ffce7a; }
[data-codin-halloween] .botao-comprar-ativo { background: var(--hw-orange); color: #301934; }
[data-codin-halloween] .botao-comprar { background: #3e2c4a; color: #c7b0d6; }
[data-codin-halloween] .botao-adquirido { background: #2e493b; color: #b8e6c8; }
[data-codin-halloween] .botao-experimentar { background: #442c58; color: #eedbff; border-color: #79548e; }
[data-codin-halloween] .acoes-card > button { min-width: 0; }
[data-codin-halloween] :is(.modal-card,.card-compra,.card-erro,.card-levelup,.card-revisao) { background: var(--hw-panel); color: var(--hw-ink); border-color: var(--hw-border); }
[data-codin-halloween] :is(.titulo-compra,.texto-compra) { color: var(--hw-ink); }
[data-codin-halloween] .btn-cancelar { background: #483352; color: #efdcf4; }
[data-codin-halloween] .btn-confirmar { background: var(--hw-orange); color: #301934; }
[data-codin-halloween] #preloader { background: #21132f; color: #efd9ff; }
[data-codin-halloween] .spinner { border-top-color: var(--hw-orange); }

/* Páginas próprias: apenas paleta, fundos e bordas. */
[data-codin-halloween] .profile-container-main { background: transparent; }
[data-codin-halloween] :is(.profile-card-hero,.settings-card,.ranking-card,.plano-card,.coracao-card) { background: var(--hw-panel); border-color: var(--hw-border); color: var(--hw-ink); }
[data-codin-halloween] .profile-mascot-area { background: #4b2d61 url('../codin/estudio-desenho.webp') center / cover; border-color: #8c63a3; }
[data-codin-halloween] :is(.aura-controls,.custom-select-trigger,.custom-options,.stat-box,.profile-loader-overlay,.loader-content,.codin-user-menu-panel) { background: var(--hw-raised); border-color: var(--hw-border); color: var(--hw-ink); }
[data-codin-halloween] :is(.user-text-info h1,.settings-header h1,.settings-card h2,.setting-label,.ranking-header h1,.ranking-card-header h2,.plano-card h3,.coracao-card h3,.stat-value,.modal-titulo) { color: var(--hw-ink); }
[data-codin-halloween] :is(.settings-header p,.setting-desc,.ranking-header p,.planos-hero p,.plano-card ul li,.user-email,.stat-label,.stat-row) { color: var(--hw-muted); }
[data-codin-halloween] :is(.settings-card h2,.ranking-card-header,.ranking-table th) { background: #332040; color: #e7d1f4; border-color: var(--hw-border); }
[data-codin-halloween] :is(.setting-item,.ranking-table td) { color: #ebd9f3; border-color: #50325f; }
[data-codin-halloween] :is(.setting-item:hover,.ranking-table tr:hover,.custom-option:hover) { background: #3e2850; }
[data-codin-halloween] :is(.codin-user-menu-panel a:hover,.codin-user-menu-panel button:hover) { background: #3e2850; }
[data-codin-halloween] .codin-user-menu-panel i { color: var(--hw-muted); }
[data-codin-halloween] .plano-card.destaque { border-color: #b98bdc; }
[data-codin-halloween] .plano-card .preco { color: #ffc771; }
[data-codin-halloween] .aviso-breve { background: #493023; color: #ffe0a3; }
[data-codin-halloween] .text-danger { color: #ff7c90; }
[data-codin-halloween] :is(input,select,textarea) { color: var(--hw-ink); background-color: #21152e; border-color: var(--hw-border); }
[data-codin-halloween] input::placeholder { color: #b59fc5; }
[data-codin-halloween] :is(.card-pergunta,.card-mascote-dica,.card-recompensa) { background: var(--hw-panel); color: var(--hw-ink); }
[data-codin-halloween] .header-missao { background: #563479; }
[data-codin-halloween] .instrucao { color: var(--hw-muted); }
[data-codin-halloween] .area-codigo-montagem { background: #1c1228; }
[data-codin-halloween] :is(.bloco-codigo,.opcao-resposta) { background: #3a254a; color: var(--hw-ink); border-color: var(--hw-border); }
[data-codin-halloween] :is(.bloco-codigo,.opcao-resposta):hover { background: #57366f; }
[data-codin-halloween] .card-pergunta pre { color: #281936; }
/* Caixas "Anota aí" das lições (dados-*.js) têm fundo pastel fixo via style="" inline
   e nunca definem cor de texto própria — herdavam o --hw-ink claro do .card-pergunta
   e ficavam ilegíveis (texto claro sobre fundo claro). */
[data-codin-halloween] .card-pergunta p[style*="background:#"] { color: #281936; }
[data-codin-halloween] :is(.item-recompensa,#contador-passos) { color: var(--hw-muted); }
[data-codin-halloween] .opcao-quiz { background: #3a254a; color: var(--hw-ink); border-color: var(--hw-border); }
[data-codin-halloween] .opcao-quiz:hover { background: #503366; }
[data-codin-halloween] .opcao-quiz.selecionada { background: #654181; border-color: var(--hw-orange); }
/* Feedback pedagógico mantém as cores de sucesso e erro do motor original. */
[data-codin-halloween] .cartao-login { background: var(--hw-panel); border-color: var(--hw-border); box-shadow: 0 10px 0 #10071b; }
[data-codin-halloween] :is(.btn-social,.btn-padrao.secundario) { background: #3a254b; color: var(--hw-ink); border-color: #72508a; box-shadow: 0 4px 0 #170d25; }
[data-codin-halloween] :is(.btn-social,.btn-padrao.secundario):hover { background: #503465; }
[data-codin-halloween] :is(.stat-info .value,.selected-content,.custom-option,.header-section h3) { color: var(--hw-ink); }
[data-codin-halloween] .stat-info .label { color: var(--hw-muted); }
[data-codin-halloween] .custom-options-container { background: var(--hw-raised); border-color: var(--hw-border); }
[data-codin-halloween] .custom-option.selected { background: #54356a; color: var(--hw-ink); }
[data-codin-halloween] .cena-mascote { background: url('../codin/noite-desenho.webp') center / contain no-repeat; }

/* Efeitos leves, fora do fluxo. Não criam margens nem alteram centralização. */
.hw-atmosphere { position: absolute; inset: 0; overflow: hidden; pointer-events: none; border-radius: inherit; z-index: 0; }
.hw-spark { width: 3px; height: 3px; background: #ffd68e; position: absolute; border-radius: 50%; opacity: .55; animation: hw-float var(--duration,9s) ease-in-out infinite; animation-delay: var(--delay,0s); }
.hw-bat { position: absolute; width: 32px; height: 18px; right: 18%; top: 16%; color: #160b24; animation: hw-bat 8s ease-in-out infinite; }
.hw-motion-toggle { position: fixed; left: 12px; bottom: 12px; z-index: 510; border: 1px solid #8d61a7; background: #2f1c40; color: #f1d9ff; border-radius: 18px; padding: 8px 12px; font: 11px/1.4 Arial,sans-serif; cursor: pointer; box-shadow: 0 2px 8px #0e061c55; }
.hw-motion-toggle:hover { background: #52336c; }
@keyframes hw-float { 0%,100% { transform: translateY(0); opacity: .2; } 50% { transform: translateY(-14px); opacity: .7; } }
@keyframes hw-bat { 0%,100% { transform: translate(0,0) rotate(-5deg); } 50% { transform: translate(-12px,8px) rotate(5deg); } }
html.hw-motion-paused :is(.hw-spark,.hw-bat,.mascote-principal,.icone-flutuante) { animation-play-state: paused !important; }
@media (max-width:768px) {
  [data-codin-halloween] .nav-links { background: #21132f; border-top-color: var(--hw-border); }
  .hw-motion-toggle { bottom: 74px; font-size: 10px; padding: 6px 9px; }
  [data-codin-halloween] .caixa-boas-vindas::before { opacity: .55; }
  [data-codin-halloween] .coluna-loja { width: 100%; min-width: 0; }
  [data-codin-halloween] .abas-loja { flex-wrap: wrap; }
  [data-codin-halloween] #codin-radio { bottom: 74px; right: 12px; }
  [data-codin-halloween] .cr-menu { bottom: 124px; }
  [data-codin-halloween] .profile-data-area { padding: 24px 20px; min-width: 0; }
  [data-codin-halloween] .user-header-flex { flex-wrap: wrap; gap: 16px; }
  [data-codin-halloween] .profile-avatar-wrapper { flex-shrink: 0; }
  [data-codin-halloween] .user-text-info { min-width: 0; width: 100%; }
  [data-codin-halloween] .user-text-info h1 { font-size: 1.5rem; overflow-wrap: anywhere; }
  [data-codin-halloween] .custom-select-wrapper { width: 100%; }
  [data-codin-halloween] .area-jogo { flex-direction: column; padding: 0 12px; }
  [data-codin-halloween] .header-missao { margin: 0 12px; padding: 16px; }
  [data-codin-halloween] .header-top { flex-wrap: wrap; gap: 16px; }
  [data-codin-halloween] .titulo-missao { order: 3; width: 100%; }
  [data-codin-halloween] .card-pergunta { padding: 20px; min-width: 0; }
  [data-codin-halloween] .area-jogo .coluna-lateral { width: 100%; min-width: 0; }
  [data-codin-halloween] .cards-cursos { grid-template-columns: minmax(0,1fr); }
  [data-codin-halloween] .cards-cursos h3 { white-space: normal; flex-wrap: wrap; }
}
@media (prefers-reduced-motion:reduce) { [data-codin-halloween] *,[data-codin-halloween] *::before,[data-codin-halloween] *::after { animation: none !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }

/* Revisão ilustrada: panorama completo, retrato original e contorno suave. */
[data-codin-halloween] .caixa-boas-vindas::before { width: max(40%,calc(100% - var(--hw-art-width,720px)*.7)); background: linear-gradient(90deg,#21132d8c,#21132d1a),url('../codin/banner-extensao.webp') center / cover no-repeat; }
[data-codin-halloween] .hw-panorama-right { position: absolute; right: 0; top: 0; width: auto; height: 100%; max-width: none; z-index: -1; pointer-events: none; mask-image: linear-gradient(90deg,transparent,#000 28%); }
[data-codin-halloween] .caixa-boas-vindas::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,#21132d6b 0%,#21132d47 42%,transparent 68%); pointer-events: none; }
[data-codin-halloween] .hw-original-card { height: 130px; border: 0; box-shadow: none; background-position: center; background-size: cover; overflow: hidden; position: relative; }
.hw-original-mascot { height: 128px; width: 170px; position: absolute; bottom: -8px; left: 20px; object-fit: contain; }
.hw-original-mascot.hw-costume-portrait {
  /* Apenas a altura é definida: a largura mantém a proporção nativa do PNG.
     O enquadramento da arte 1.1 preserva chapéu, pata e lanterna inteiros. */
  height: 162px; width: auto; max-width: none; top: -15px; bottom: auto;
  left: 50%; transform: translateX(-50%);
}
[data-codin-halloween] :is(.codin-imagem,.mascot-full-render,.hw-original-mascot) { filter: drop-shadow(0 0 1px #ffe1bc) drop-shadow(0 0 3px #e1b5ffa6) drop-shadow(0 0 7px #c399f359); }
[data-codin-halloween] .codin-card { border-color: transparent; }
body[data-codin-halloween] { position: relative; }
.hw-doodles { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 2; }
.hw-doodle { position: absolute; width: 34px; height: 39px; opacity: .5; animation: hw-doodle-drift 8s ease-in-out infinite; }
.hw-doodle svg { width: 100%; height: 100%; }
.hw-doodle:nth-child(1) { left: .5%; top: 26%; }
.hw-doodle:nth-child(2) { right: .5%; top: 48%; animation-delay: -3s; }
.hw-doodle:nth-child(3) { left: .7%; top: 72%; animation-delay: -5s; }
.hw-doodle:nth-child(4) { right: .6%; top: 88%; animation-delay: -1s; }
@keyframes hw-doodle-drift { 0%,100% { transform: translateY(0) rotate(-7deg); } 50% { transform: translateY(-16px) rotate(7deg); } }
html.hw-motion-paused .hw-doodle { animation-play-state: paused !important; }
@media(max-width:768px) { .hw-doodle { width: 18px; height: 22px; opacity: .35; } [data-codin-halloween] .hw-panorama-right { opacity: .48; } [data-codin-halloween] .caixa-boas-vindas::before { opacity: .7; } }

/* Camadas adicionais seguem a mesma escala dos sprites originais. */
#prof-layer-shorts { z-index: 6; }
#view-layer-shorts { z-index: 25 !important; }

/* Encaixe 1.6: a barra das novas camisas cobre a cintura das calças.
   A ordem coincide com a loja; acessórios e cabeça continuam à frente. */
[data-codin-halloween] #prof-layer-corpo:is([data-item-id="216"],[data-item-id="217"],[data-item-id="218"],[data-item-id="224"]) { z-index: 7; }
[data-codin-halloween] #view-layer-corpo:is([data-item-id="216"],[data-item-id="217"],[data-item-id="218"],[data-item-id="224"]) { z-index: 30 !important; }

/* Ateliê 1.3: a aba mantém o encaixe original, com o cone inteiro visível.
   A loja usa um quadro quadrado com object-fit: cover. Só este chapéu
   precisa exibir o canvas 3:4 completo; as demais camadas ficam no lugar. */
[data-codin-halloween] .codin-imagem.hw-tall-headwear {
  margin-top: 60px;
}
[data-codin-halloween] .codin-imagem img.layer[data-item-id="211"] {
  height: 133.333333%;
  top: -16.666667%;
  object-fit: contain;
}
/* Fecho alinhado ao eixo do focinho: 28 pixels para a esquerda no sprite
   de 1536 × 2048. Cover na loja; contain no perfil e no ranking. */
[data-codin-halloween] .codin-imagem img.layer[data-item-id="212"] {
  transform: scale(1.1) translateX(-1.822916667%);
}
[data-codin-halloween] .mascot-full-render img.layer[data-item-id="212"] {
  transform: translateX(-1.3671875%);
}
@media (max-width: 768px) {
  [data-codin-halloween] .codin-imagem.hw-tall-headwear { margin-top: 44px; }
}

/* Carteira de doces e troca — versão 1.4. */
.candy-pill { display: inline-flex; align-items: center; gap: 5px; padding: 6px 10px; border: 1px solid #a77bc06b; border-radius: 20px; background: #432650; color: #ffe2ab; font-size: 14px; font-weight: 800; white-space: nowrap; }
.candy-pill img { width: 24px; height: 24px; flex-shrink: 0; }
[data-codin-halloween] .saldo-doces-loja { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 10px; color: #ffe1ad; }
.candy-market { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding: 25px; margin-bottom: 24px; border: 1px solid #9465ae; border-radius: 20px; background: radial-gradient(ellipse at top left,#67384855,transparent 70%),#2d1d3c; box-shadow: 0 6px 0 #140b2155; }
.candy-eyebrow { font: 800 10px/1.5 Arial,sans-serif; letter-spacing: .16em; color: #e0b4f8; }
.candy-market h2 { font-size: clamp(21px,2vw,28px); line-height: 1.18; color: #ffe3ac; margin: 7px 0 10px; }
.candy-market p { color: #e6d2ec; font-size: 14px; line-height: 1.5; margin: 6px 0; }
.candy-rate { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin: 18px 0 8px; color: #ffcd7d; font-size: 14px; }
.candy-rate img { width: 24px; height: 24px; object-fit: contain; }
.candy-market small { color: #c9b0d6; font-size: 11px; line-height: 1.5; display: block; }
.candy-exchange { min-width: 0; border-left: 1px solid #79518e70; padding-left: 24px; }
.candy-exchange label { display: block; color: #f4e4fc; font-size: 13px; font-weight: 700; margin-bottom: 9px; }
.candy-input-row { display: flex; gap: 8px; }
.candy-exchange input { width: 88px; min-width: 0; border: 1px solid #9061a9; border-radius: 10px; padding: 10px; font-size: 17px; font-weight: 700; }
.candy-exchange button { border: 1px solid #bb8bdd; border-radius: 10px; padding: 10px 12px; font: inherit; font-size: 12px; font-weight: 700; line-height: 1.3; cursor: pointer; background: #f9b755; color: #29142f; transition: background .15s; }
.candy-exchange button:hover { background: #ffce81; }
.candy-exchange button:disabled { cursor: wait; opacity: .55; }
.candy-exchange :is(input,button):focus-visible { outline: 3px solid #e5c5ff; outline-offset: 3px; }
.candy-quick { display: flex; gap: 6px; margin: 10px 0; }
.candy-exchange .candy-quick button { background: #49305c; color: #f5deff; border-color: #77548d; padding: 5px 10px; }
.candy-exchange #candy-cost { color: #ffce86; font-size: 12px; }
.candy-review { margin-top: 15px; padding: 12px; background: #1d122a; border: 1px solid #ae7e51; border-radius: 12px; }
.candy-review[hidden] { display: none; }
.candy-review p { font-size: 12px; margin: 0 0 10px; }
.candy-review > div { display: flex; flex-wrap: wrap; gap: 8px; }
.candy-exchange #btn-cancelar-doces { background: transparent; color: #ead4f5; border-color: #76558c; }
.candy-exchange .candy-status { min-height: 1.5em; font-size: 12px; margin-top: 8px; color: #fce5b8; }
.candy-item-tag { display: inline-block; align-self: center; color: #e2baff; background: #563369; border: 1px solid #8b5ca5; border-radius: 20px; font-size: 9px; font-weight: 800; letter-spacing: .08em; padding: 3px 8px; margin: 3px 0 5px; }
[data-codin-halloween] :is(.item-card .preco,.preco-confirmacao) { display: flex; align-items: center; justify-content: center; gap: 5px; flex-wrap: wrap; }
[data-codin-halloween] :is(.item-card,.card-compra) img.moeda-item { width: 22px; height: 22px; object-fit: contain; margin: 0; flex-shrink: 0; }
.preco-confirmacao { color: #ffce7a; margin: 8px 0; }
@media (max-width:1100px) {
  .candy-market { grid-template-columns: 1fr; gap: 18px; }
  .candy-exchange { border-left: 0; padding-left: 0; border-top: 1px solid #79518e70; padding-top: 18px; }
}
@media (max-width:768px) {
  .candy-market { padding: 20px; }
  .candy-pill { padding: 4px 7px; font-size: 12px; }
  .candy-pill img { width: 20px; height: 20px; }
}
@media (max-width:380px) {
  .candy-input-row { flex-wrap: wrap; }
  .candy-input-row input { flex: 1; }
}

/* Encaixe 1.9: cós inteiro, sem uma cópia dos braços sobre as pontas.
   Máscaras no canvas da base, sem alterar o PNG do personagem. */
.hw-shorts-fit .layer.base {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201536%202048%22%3E%3Cpath%20fill%3D%22white%22%20fill-rule%3D%22evenodd%22%20d%3D%22M0%2C0H1536V2048H0ZM560%2C1310L925%2C1310L910%2C1405L910%2C1500L565%2C1500L565%2C1400Z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201536%202048%22%3E%3Cpath%20fill%3D%22white%22%20fill-rule%3D%22evenodd%22%20d%3D%22M0%2C0H1536V2048H0ZM560%2C1310L925%2C1310L910%2C1405L910%2C1500L565%2C1500L565%2C1400Z%22%2F%3E%3C%2Fsvg%3E");
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
}
.codin-imagem.hw-shorts-fit .layer.base { -webkit-mask-size: cover; mask-size: cover; }
.hw-shorts-fit #prof-layer-corpo { z-index: 7; }
.hw-shorts-fit #view-layer-corpo { z-index: 30 !important; }

/* Calça do Caçador: canvas original 1600 × 1200, cintura alargada; pernas preservadas.
   Escala uniforme 1.3 e translação (-272.5, 226) na base. */
.codin-imagem img.layer[data-item-id="225"] {
  width: 148.958333333%; height: 111.71875%;
  left: -24.514973958%; top: -7.1484375%;
  object-fit: fill; transform: none;
}
.mascot-full-render img.layer[data-item-id="225"] {
  width: 101.5625%; height: 76.171875%;
  left: -0.805664063%; top: 11.03515625%;
  object-fit: fill; transform: none;
}

/* Equipamentos 1.12 */
.equipment-summary{position:relative;z-index:100;display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin:12px 0}
.equipment-chip,.equipment-clear{font:inherit;font-size:11px;line-height:1.4;color:#ebddf6;background:#31233e;border:1px solid #674276;border-radius:16px;padding:6px 9px;cursor:pointer}
.equipment-chip:hover,.equipment-clear:hover{background:#4b2f59;border-color:#d9a9ee}
.equipment-chip.is-preview{border-style:dashed;color:#ffdaac}.equipment-clear{background:transparent;border-color:transparent;text-decoration:underline}
.equipment-help{position:relative;z-index:100;text-align:left;color:#d3bddf;font-size:12px;line-height:1.6;margin:8px 0 16px;padding:10px 12px;background:#160e23b0;border:1px solid #624075;border-radius:12px}
.equipment-help summary{cursor:pointer;font-weight:600;color:#ffdaa5}.equipment-help p{margin:9px 0 0}
.item-card p.equipment-region{display:block;min-height:1.4em;font-size:11px;color:#cfbbdd;margin:0 0 6px}
.equipment-chip:focus-visible,.equipment-clear:focus-visible,.equipment-help summary:focus-visible{outline:2px solid #f7c583;outline-offset:3px}
[data-codin-halloween] .view-mode-container .profile-data-area{background:var(--hw-panel)}

/* Cards de missão de Halloween: visíveis por padrão (evento costuma estar ativo
   por semanas); só somem com confirmação explícita do servidor de que o evento
   está desativado. Nunca usar style="" inline pra isso — ver convenção do projeto. */
.vs2-mission-card.hw-evento-inativo { display: none; }
