/* css/embaixador.css — a EDIÇÃO EMBAIXADOR (21/10/2026): tudo debaixo de html.edicao-embaixador (js/edicao-cedo.js marca
   o <html> antes de pintar). Sem a edição este arquivo não muda nada.
   A MARCA (dono 21/10, final): base ARENA (Kobalski-Maquetes/embaixador-arena) com o mascote SILHUETA
   (Kobalski-Maquetes/emb-silhueta). Noite de arena no fundo, couro com pesponto nos cartões, ouro de fivela nos botões
   e nas letras, refletores e poeira dourada no ar, o vermelho da faixa pra destaque. A entrada é o PORTÃO da arena.
   Os desenhos (fivela, mascote, medalhão, roseta, marca a ferro) vêm do js/embaixador-arte.js; as peças entram pelo
   js/edicao.js. Nada de foto, logo ou imagem do Gusttavo.
   Letras: a de faroeste (Rye, pelo Google Fonts; plano B Rockwell/Georgia) SÓ no nome e nos títulos. O botão "Fala
   comigo, bebê!" e todo texto de ler ficam na letra grossa do sistema (a vó lê).
   Regras das maquetes: texto de conteúdo >= 16 px, botão >= 56 px, cabe em 360 px sem rolar de lado, movimento
   reduzido = nada se mexe sozinho. */

html.edicao-embaixador {
  /* ---- a paleta ARENA (os nomes e códigos estão na Kobalski-Maquetes/embaixador-arena/marca.html) ---- */
  --emb-noite: #0b0806;          /* Noite de arena: o fundo */
  --emb-noite-2: #150e09;
  --emb-couro-escuro: #24160d;   /* Couro escuro: cartões */
  --emb-couro: #5c3a1e;          /* Couro */
  --emb-ouro: #e2b04a;           /* Ouro de fivela: a cor da marca */
  --emb-ouro-claro: #f7de96;     /* Ouro claro: títulos, letra cantada */
  --emb-ouro-velho: #9a6b1e;
  --emb-faixa: #a3261c;          /* Vermelho faixa: o destaque, o selo do campeão */
  --emb-creme: #fff1d6;          /* o balão do mascote */
  --emb-tinta: #1f1405;          /* o texto escuro em cima do ouro */
  --emb-faroeste: "Rye", "Rockwell Extra Bold", "Rockwell", Georgia, "Times New Roman", serif;
  --emb-grad-ouro: linear-gradient(180deg, #fde6a0 0%, #e8b850 46%, #c4902e 100%);
  --emb-texto-ouro: linear-gradient(180deg, #fff3c8 0%, #f2cf74 40%, #d29a34 72%, #9a6b1e 100%);
  --emb-grao-couro: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .1 0 0 0 0 .06 0 0 0 0 .02 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  --emb-couro-cartao: var(--emb-grao-couro), linear-gradient(170deg, #3a2414 0%, #24160d 55%, #1a100a 100%);
  /* compatibilidade (o nome antigo ainda usado abaixo) */
  --emb-serifa: var(--emb-faroeste);

  /* ---- os tokens do app (css/style.css) na cor da arena ---- */
  --bg-0: #0b0806;
  --bg-1: #150e09;
  --bg-2: #24160d;
  --magenta: #e2b04a;          /* o "rosa" do app vira ouro de fivela */
  --roxo: #a8713a;             /* o "roxo" vira sela */
  --ciano: #f7de96;            /* o destaque frio vira ouro claro */
  --ouro: #e2b04a;
  --vermelho: #e05a44;
  --texto: #f7efe0;
  --texto-2: rgba(247, 239, 224, 0.82);
  --texto-3: rgba(247, 239, 224, 0.64);
  --card: rgba(255, 236, 200, 0.045);
  --card-2: rgba(255, 236, 200, 0.08);
  --borda: rgba(247, 222, 150, 0.14);
  --borda-2: rgba(247, 222, 150, 0.26);
  --grad-primario: var(--emb-grad-ouro);
  --grad-marca: var(--emb-texto-ouro);
  --vz-ouro: #e2b04a;
  --vz-ciano: #f7de96;
  --vz-balao: #fff1d6;
  --vz-balao-texto: #24160d;
  --vz-cartao: rgba(36, 22, 13, 0.97);
  background: var(--emb-noite);
}
html.edicao-embaixador body {
  background:
    radial-gradient(ellipse 120% 50% at 50% -10%, rgba(226, 160, 70, 0.14), transparent 70%),
    var(--emb-noite);
}
/* a palavra da marca, em ouro (a letra de faroeste) */
html.edicao-embaixador .logo-texto,
html.edicao-embaixador .logo-casa {
  font-family: var(--emb-faroeste); font-weight: 400; letter-spacing: .03em; text-transform: uppercase;
  background: var(--emb-texto-ouro); -webkit-background-clip: text; background-clip: text; color: transparent;
}
/* a lista: a casinha (.btn-casa, fixa no canto de cima) ficava EM CIMA do "EMBAIXADOR" no celular (360: o R sumia
   atrás dela). A palavra da edição é bem mais larga que "Kobalski": o topo abre lugar pra casinha e a letra diminui no
   celular estreito (revisão 22/10; tests/embaixador-quebrar-tela.mjs confere a palavra inteira e fora da casinha) */
html.edicao-embaixador #tela-catalogo .topo-casa { padding-right: 50px; }
html.edicao-embaixador #tela-catalogo .logo-casa { font-size: clamp(1.1rem, 5.6vw, 1.6rem); }

/* ---------- botões em ouro (texto escuro: branco em cima do ouro não se lê) ---------- */
html.edicao-embaixador .btn-primario,
html.edicao-embaixador .ko-btn-primario,
html.edicao-embaixador .ep-subir {
  color: var(--emb-tinta);
  background: var(--emb-grad-ouro);
  box-shadow: 0 12px 30px rgba(226, 176, 74, .32), inset 0 1px 0 rgba(255, 255, 255, .65), inset 0 -2px 0 rgba(110, 74, 18, .35);
}
html.edicao-embaixador .btn-primario .ic,
html.edicao-embaixador .ko-btn-primario .ic { color: var(--emb-tinta); }

/* ---------- a poeira dourada no ar (js/embaixador-arte.js poeiraHtml: grãos fixos, sobem devagar) ---------- */
html.edicao-embaixador .emb-poeira { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
html.edicao-embaixador .emb-grao {
  position: absolute; width: var(--t); height: var(--t); border-radius: 50%;
  background: #ffe9b3; box-shadow: 0 0 6px 1px rgba(255, 214, 130, .75);
  opacity: var(--o);
  animation: emb-flutua var(--dur) linear infinite; animation-delay: var(--atraso);
}
@keyframes emb-flutua {
  0% { transform: translate(0, 18px); opacity: 0; }
  18% { opacity: var(--o); }
  82% { opacity: var(--o); }
  100% { transform: translate(var(--dx), -54px); opacity: 0; }
}

/* =====================================================================================================================
   ENTRAR: o PORTÃO DA ARENA. Fechado ao abrir (a luz escapando pela fresta), as folhas giram pra dentro a cada letra
   do nome (o js/entrar-palco.js põe o --abre, igual à cortina do Kobalski) e abrem de vez no "Entrar na arena".
   Torres de refletor em cima, o público com lanterna e a cerca no fundo, a FIVELA no chão da arena.
   ===================================================================================================================== */
html.edicao-embaixador .tela.tela-entrar {
  background:
    radial-gradient(ellipse 90% 40% at 50% 8%, rgba(255, 214, 140, .16), transparent 72%),
    radial-gradient(ellipse 120% 30% at 50% 62%, rgba(190, 130, 60, .22), transparent 70%),
    linear-gradient(180deg, #120c08 0%, #0d0906 50%, #0b0806 100%);
}
/* a arena não tem cortina de teatro nem lâmpada de palco: no lugar, as torres de refletor e a poeira dourada */
html.edicao-embaixador .ep-cortina,
html.edicao-embaixador .ep-lampada,
html.edicao-embaixador .ep-poeira { display: none; }
html.edicao-embaixador .emb-torre {
  position: absolute; top: calc(var(--safe-t) + 10px); width: 50px; height: 30px; border-radius: 6px; z-index: 5;
  background:
    radial-gradient(circle at 50% 50%, #fffaf0 0 2.6px, #ffe3a0 3.6px, rgba(255, 200, 100, 0) 6.5px) 2px 1px / 15.3px 14px,
    linear-gradient(180deg, #2a1d12, #120c07);
  border: 2px solid #4a3622;
  box-shadow: 0 0 34px 12px rgba(255, 222, 150, .30), 0 0 70px 26px rgba(255, 200, 110, .14);
}
html.edicao-embaixador .emb-torre::after {   /* o poste */
  content: ""; position: absolute; left: 50%; top: 100%; width: 3px; height: 26px; margin-left: -1.5px;
  background: linear-gradient(180deg, #4a3622, transparent);
}
html.edicao-embaixador .emb-torre-e { left: 14px; transform: rotate(16deg); }
html.edicao-embaixador .emb-torre-d { right: 14px; transform: rotate(-16deg); }
html.edicao-embaixador .ep-feixe-e,
html.edicao-embaixador .ep-feixe-d { top: calc(var(--safe-t) + 26px); width: 170px; height: 430px; filter: blur(8px);
  --luz: linear-gradient(180deg, rgba(255, 236, 190, .55) 0%, rgba(255, 220, 160, .18) 52%, transparent 92%); }
html.edicao-embaixador .ep-feixe-e { left: -38px; }
html.edicao-embaixador .ep-feixe-d { right: -38px; }
html.edicao-embaixador .ep-feixe-c { filter: blur(14px);
  --luz: linear-gradient(180deg, rgba(255, 232, 170, .26) 0%, rgba(255, 200, 110, .12) 62%, transparent 96%); }

/* o público com lanterna lá no fundo (show grande) e a cerca de madeira, atrás da fivela */
html.edicao-embaixador .emb-publico {
  position: absolute; left: 50%; width: 520px; margin-left: -260px; bottom: 45%; height: 72%; z-index: -2; pointer-events: none;
  background:
    radial-gradient(circle, rgba(255, 240, 200, .9) 0 1px, transparent 1.6px) 0 0 / 17px 11px,
    radial-gradient(circle, rgba(255, 210, 140, .7) 0 .9px, transparent 1.5px) 7px 5px / 23px 13px,
    radial-gradient(circle, rgba(255, 250, 230, .8) 0 1.1px, transparent 1.8px) 3px 8px / 31px 17px;
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 45%, #000 70%, transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0%, #000 45%, #000 70%, transparent 100%);
  opacity: .7;
}
html.edicao-embaixador .emb-cerca {
  position: absolute; left: 50%; width: 520px; margin-left: -260px; bottom: 4%; height: 74px; z-index: -1; pointer-events: none;
  background:
    linear-gradient(180deg, #3a2414, #24160c) 0 10px / 100% 9px no-repeat,
    linear-gradient(180deg, #3a2414, #24160c) 0 36px / 100% 9px no-repeat,
    repeating-linear-gradient(90deg, transparent 0 52px, #2c1b0e 52px 59px, transparent 59px 64px);
  opacity: .85;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, rgba(0, 0, 0, .55) 34%, rgba(0, 0, 0, .55) 66%, #000 88%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 12%, rgba(0, 0, 0, .55) 34%, rgba(0, 0, 0, .55) 66%, #000 88%, transparent);
}

/* a FIVELA no lugar do microfone de coroa (o mesmo <svg>: o js/entrar-palco.js mede o palco por ele) */
html.edicao-embaixador .ep-mic-coroa.emb-fivela {
  height: clamp(132px, 22.5vh, 192px); width: auto; max-width: 100%;
  filter: drop-shadow(0 0 26px rgba(255, 200, 90, .42)) drop-shadow(0 16px 20px rgba(0, 0, 0, .6));
}
html.edicao-embaixador .ep-aureola { background: radial-gradient(closest-side, rgba(255, 214, 130, .30), rgba(255, 180, 80, .10) 55%, transparent 80%); }
html.edicao-embaixador .ep-chao { width: 300px; height: 50px; margin-top: -20px;
  background: radial-gradient(closest-side, rgba(255, 214, 150, .48), rgba(200, 140, 70, .18) 55%, transparent 100%); }

/* a placa: EMBAIXADOR na letra de faroeste, em ouro; embaixo, "O karaokê que te escuta" */
html.edicao-embaixador .ep-marca-nome {
  font-family: var(--emb-faroeste); font-weight: 400; text-transform: uppercase;
  font-size: clamp(34px, 10.6vw, 46px); letter-spacing: .03em; line-height: 1.05;
  background: var(--emb-texto-ouro); -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 2px 0 #3a2208) drop-shadow(0 0 18px rgba(255, 190, 80, .35));
  padding: 2px 4px 0;
}
html.edicao-embaixador .ep-marca-kicker { margin-top: 5px; font-size: 14px; letter-spacing: .22em; color: var(--emb-ouro-claro); opacity: .9; }
html.edicao-embaixador .ep-ribalta i:nth-child(even) { background: #ff8a6a; box-shadow: 0 0 8px 2px rgba(220, 70, 40, .5); }
/* o letreiro do nome em luzes, de couro, com o nome na letra de faroeste */
html.edicao-embaixador .ep-letreiro {
  background:
    radial-gradient(120% 150% at 50% 130%, rgba(255, 170, 70, .22), transparent 62%),
    var(--emb-grao-couro), linear-gradient(180deg, #3a2414 0%, #160d07 100%);
  border-color: rgba(226, 176, 74, .85);
  box-shadow: inset 0 0 0 3px #160d07, inset 0 0 0 4px rgba(226, 176, 74, .3), 0 10px 26px rgba(0, 0, 0, .55);
}
html.edicao-embaixador .ep-letreiro-nome {
  font-family: var(--emb-faroeste); font-weight: 400; letter-spacing: .03em; line-height: 1.15;
  text-shadow: 0 0 2px #fff, 0 0 10px rgba(255, 205, 100, .95), 0 0 24px rgba(255, 140, 50, .7), 0 0 44px rgba(220, 70, 40, .35);
}
html.edicao-embaixador .ep-letreiro.vazio .ep-letreiro-nome { font-family: var(--sans); font-weight: 700; color: rgba(247, 239, 224, .3); text-shadow: none; }
html.edicao-embaixador .tela-entrar.ep-no-palco .ep-letreiro {
  box-shadow: inset 0 0 0 3px #160d07, inset 0 0 0 4px rgba(255, 216, 119, .5), 0 0 34px 6px rgba(255, 196, 90, .45), 0 10px 26px rgba(0, 0, 0, .55);
}
html.edicao-embaixador .tela-entrar.ep-no-palco .ep-letreiro-nome {
  text-shadow: 0 0 3px #fff, 0 0 14px #ffe08a, 0 0 30px rgba(255, 170, 60, .95), 0 0 60px rgba(220, 70, 40, .6);
}
html.edicao-embaixador .tela-entrar.ep-no-palco .ep-mic-coroa.emb-fivela { animation: emb-brilha 1.2s ease-out; }
@keyframes emb-brilha { 40% { filter: drop-shadow(0 0 50px rgba(255, 214, 120, .95)) drop-shadow(0 16px 20px rgba(0, 0, 0, .6)); } }

/* ---- o PORTÃO: duas folhas de madeira (tábuas, travessas, braço em Z, dobradiças de ferro e a marca a ferro no
   meio), que GIRAM pra dentro da arena. Começa abaixo das torres de luz ---- */
html.edicao-embaixador .ep-panos { top: calc(var(--safe-t) + 50px); perspective: 900px; }
html.edicao-embaixador .ep-fresta { top: 4%; }
html.edicao-embaixador .ep-pano {
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .45) 0%, transparent 12%, transparent 82%, rgba(0, 0, 0, .55) 100%),
    repeating-linear-gradient(0deg, rgba(255, 220, 170, .025) 0 2px, transparent 2px 7px),
    repeating-linear-gradient(90deg, #1c0f06 0 2px, #6a4325 2px 5px, #573519 5px 25px, #45290f 25px 31px, #1c0f06 31px 33px);
  border-top: 3px solid #1a0e06; border-bottom: 3px solid #1a0e06;
  box-shadow: 0 12px 26px rgba(0, 0, 0, .6);
}
html.edicao-embaixador .ep-pano::after { content: none; }   /* (a franja dourada é da cortina) */
html.edicao-embaixador .ep-pano-e { transform-origin: 0 50%; transform: rotateY(calc(var(--abre) * 84deg)); }
html.edicao-embaixador .ep-pano-d { transform-origin: 100% 50%; transform: rotateY(calc(var(--abre) * -84deg)); }
html.edicao-embaixador .emb-trave {
  position: absolute; left: 0; right: 0; height: 22px;
  background:
    radial-gradient(circle, #d9b06a 0 1.6px, #3a2410 2.4px, transparent 3px) 10px 50% / 34px 100% repeat-x,
    linear-gradient(180deg, #8a5a32 0%, #6b4424 40%, #4a2c16 100%);
  box-shadow: 0 4px 8px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 220, 170, .18);
}
html.edicao-embaixador .emb-trave-1 { top: 12%; }
html.edicao-embaixador .emb-trave-2 { bottom: 12%; }
html.edicao-embaixador .emb-braco { position: absolute; left: 0; right: 0; top: calc(12% + 22px); bottom: calc(12% + 22px); }
html.edicao-embaixador .ep-pano-e .emb-braco { background: linear-gradient(to bottom right, transparent calc(50% - 11px), #3a2410 calc(50% - 11px), #7a4e2c calc(50% - 8px), #5c3a1e 50%, #46290f calc(50% + 9px), #2a170a calc(50% + 11px), transparent calc(50% + 11px)); }
html.edicao-embaixador .ep-pano-d .emb-braco { background: linear-gradient(to bottom left, transparent calc(50% - 11px), #3a2410 calc(50% - 11px), #7a4e2c calc(50% - 8px), #5c3a1e 50%, #46290f calc(50% + 9px), #2a170a calc(50% + 11px), transparent calc(50% + 11px)); }
html.edicao-embaixador .emb-dobra { position: absolute; width: 46px; height: 12px; background: linear-gradient(180deg, #5a5550, #2a2622); box-shadow: 0 2px 4px rgba(0, 0, 0, .6); }
html.edicao-embaixador .ep-pano-e .emb-dobra { left: 0; border-radius: 0 6px 6px 0; }
html.edicao-embaixador .ep-pano-d .emb-dobra { right: 0; border-radius: 6px 0 0 6px; }
html.edicao-embaixador .emb-dobra-1 { top: calc(12% + 5px); }
html.edicao-embaixador .emb-dobra-2 { bottom: calc(12% + 5px); }
/* a marca a ferro, queimada bem no meio (metade em cada folha) */
html.edicao-embaixador .emb-ferro { position: absolute; top: 50%; width: 150px; margin-top: -58px; opacity: .92; }
html.edicao-embaixador .emb-ferro svg { display: block; width: 100%; height: auto; }
html.edicao-embaixador .ep-pano-e .emb-ferro { right: -75px; }
html.edicao-embaixador .ep-pano-d .emb-ferro { left: -75px; }

/* o passo único: "Fala comigo, bebê!" (título na letra de faroeste), o nome, "Entrar na arena" */
html.edicao-embaixador .ep-titulo { font-family: var(--emb-faroeste); font-weight: 400; font-size: clamp(26px, 8vw, 31px); letter-spacing: .01em; }
html.edicao-embaixador .ep-titulo em { font-style: normal; color: var(--emb-ouro); }
html.edicao-embaixador .ep-campo {
  background: rgba(0, 0, 0, .42); border-color: rgba(226, 176, 74, .85);
  box-shadow: 0 0 0 4px rgba(226, 176, 74, .14);
}
html.edicao-embaixador .ep-campo:focus-within { border-color: var(--emb-ouro-claro); box-shadow: 0 0 0 4px rgba(226, 176, 74, .24); }
html.edicao-embaixador .ep-campo small { color: var(--emb-ouro-claro); font-weight: 800; }
html.edicao-embaixador .ep-campo input { caret-color: var(--emb-ouro); }
html.edicao-embaixador .ep-foto-bola { color: var(--emb-ouro-claro); background: rgba(226, 176, 74, .08); border-color: rgba(226, 176, 74, .6); }
html.edicao-embaixador .ep-foto-mais { background: var(--emb-grad-ouro); border-color: #0d0906; color: var(--emb-tinta); }
html.edicao-embaixador .ep-outro .ic { color: var(--emb-ouro); }
html.edicao-embaixador .tela-entrar .entrar-locais,
html.edicao-embaixador .tela-entrar #form-outro-aparelho,
html.edicao-embaixador .tela-entrar .instalar-cartao { background: rgba(20, 12, 6, .72); border-color: rgba(226, 176, 74, .34); }
html.edicao-embaixador .tela-entrar .emb-rodape { position: relative; z-index: 2; margin: 6px 0 0; }
/* modo digitando (teclado aberto): o portão desce até o topo e o que não cabe some, igual ao Kobalski */
html.edicao-embaixador .tela-entrar.ep-teclado .ep-panos { top: 0; }
html.edicao-embaixador .tela-entrar.ep-teclado .emb-torre,
html.edicao-embaixador .tela-entrar.ep-teclado .emb-publico,
html.edicao-embaixador .tela-entrar.ep-teclado .emb-cerca,
html.edicao-embaixador .tela-entrar.ep-teclado .emb-rodape { display: none; }
html.edicao-embaixador .tela-entrar.ep-teclado .ep-feixe-e,
html.edicao-embaixador .tela-entrar.ep-teclado .ep-feixe-d { top: 0; }
html.edicao-embaixador .tela-entrar.ep-teclado .ep-chao { width: 220px; height: 30px; margin-top: -12px; }
html.edicao-embaixador .tela-entrar.ep-teclado .ep-mic-coroa.emb-fivela { height: var(--mic-h, 120px); }
html.edicao-embaixador .tela-entrar.ep-teclado .ep-letreiro { --fs-max: 28px; }
html.edicao-embaixador .tela-entrar.ep-teclado.ep-apertado .ep-letreiro { --fs-max: 24px; }
@media (max-height: 760px) {
  html.edicao-embaixador .ep-panos { top: calc(var(--safe-t) + 44px); }
  html.edicao-embaixador .emb-torre { top: calc(var(--safe-t) + 6px); }
}

/* =====================================================================================================================
   INÍCIO: a barra da marca (fivela + EMBAIXADOR), o cartão de couro com o mascote SILHUETA e a pílula "Fala comigo,
   bebê!" com o medalhão, o selo do campeão da noite (a roseta) e a assinatura
   ===================================================================================================================== */
html.edicao-embaixador .tela-inicio {
  background:
    radial-gradient(ellipse 110% 30% at 50% 0%, rgba(226, 160, 70, .20), transparent 75%),
    linear-gradient(180deg, #1a110a 0%, #0b0806 34%, #0b0806 100%);
}
html.edicao-embaixador .emb-poeira-topo { bottom: auto; height: 300px; z-index: -1; }
html.edicao-embaixador .emb-marca-barra { display: flex; align-items: center; gap: 10px; min-height: 40px; margin: 0 2px -4px; min-width: 0; }
html.edicao-embaixador .emb-marca-fivela { flex: none; display: block; width: 54px; }
html.edicao-embaixador .emb-marca-fivela svg { display: block; width: 100%; height: auto; overflow: visible; filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .6)); }
html.edicao-embaixador .emb-marca-nome {
  min-width: 0; padding-top: 3px;
  font-family: var(--emb-faroeste); font-size: 25px; line-height: 1; letter-spacing: .04em; text-transform: uppercase;
  background: var(--emb-texto-ouro); -webkit-background-clip: text; background-clip: text; color: transparent;
}
html.edicao-embaixador .in-saud-oi { color: var(--texto-2); }
html.edicao-embaixador .in-eu { background: rgba(255, 236, 200, .06); }
html.edicao-embaixador .in-eu-av { background: conic-gradient(from 200deg, #fde6a0, #c4902e, #7a4c1e, #e2b04a, #fde6a0); }
html.edicao-embaixador .in-eu-foto { border-color: #1a110a; }

/* o cartão de COURO com pesponto (a costura tracejada por dentro), refletores e poeira */
html.edicao-embaixador .in-kob {
  background: var(--emb-couro-cartao);
  border: 1px solid rgba(226, 176, 74, .42);
  box-shadow: 0 20px 44px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 230, 180, .1);
}
html.edicao-embaixador .in-kob::after {
  content: ""; position: absolute; inset: 6px; border-radius: 21px; pointer-events: none;
  border: 1.5px dashed rgba(247, 222, 150, .30);
}
html.edicao-embaixador .in-cortina { display: none; }
html.edicao-embaixador .in-feixe-e,
html.edicao-embaixador .in-feixe-d,
html.edicao-embaixador .in-feixe-c { --luz: linear-gradient(180deg, rgba(255, 232, 180, .42), rgba(255, 214, 140, .12) 55%, transparent 92%); }
html.edicao-embaixador .in-feixe-c { opacity: .6; }
html.edicao-embaixador .emb-luz {
  position: absolute; top: -18px; width: 34px; height: 22px; border-radius: 50%;
  background: radial-gradient(closest-side, #fff, rgba(255, 236, 190, .5) 60%, transparent);
  box-shadow: 0 0 26px 10px rgba(255, 220, 150, .35);
}
html.edicao-embaixador .emb-luz-e { left: 10px; }
html.edicao-embaixador .emb-luz-d { right: 10px; }
/* o mascote: a silhueta inteira (o chapéu largo), um pouco maior que o microfone do Kobalski */
html.edicao-embaixador .in-kob-cena { grid-template-columns: 96px minmax(0, 1fr); gap: 12px; }
html.edicao-embaixador .in-kob-mascote { width: 92px; }
html.edicao-embaixador .in-kob-mascote svg { filter: drop-shadow(0 0 16px rgba(255, 200, 90, .34)) drop-shadow(0 10px 14px rgba(0, 0, 0, .55)); }
html.edicao-embaixador .in-kob-pe::before { top: 88px; width: 110px; margin-left: -55px; height: 26px;
  background: radial-gradient(closest-side, rgba(255, 220, 150, .55), rgba(200, 140, 70, .16) 60%, transparent); }
/* sem a plaquinha "Kobalski" (dono 22/10: na amostra o Kobalski não aparece como marca; js/edicao-regras.js TROCAS_DO_NOME) */
html.edicao-embaixador .in-placa { display: none; }
html.edicao-embaixador .in-balao { background: var(--emb-creme); color: #24160d; box-shadow: 0 14px 30px rgba(0, 0, 0, .45), inset 0 -3px 0 rgba(150, 100, 30, .18); }
html.edicao-embaixador .in-balao::before { background: var(--emb-creme); }
html.edicao-embaixador .in-balao b { color: #9a2018; white-space: nowrap; }
/* a pílula "Fala comigo, bebê!": ouro de fivela, com ELE no medalhão; a letra é a grossa do sistema (legível pra vó) */
html.edicao-embaixador .in-kob-botao {
  justify-content: flex-start; gap: 10px; text-align: left;
  min-height: 74px; padding: 8px 14px 8px 9px;
  color: var(--emb-tinta); background: var(--emb-grad-ouro);
  box-shadow: 0 0 0 4px rgba(226, 176, 74, .16), 0 14px 32px rgba(226, 176, 74, .34), inset 0 1px 0 rgba(255, 255, 255, .7), inset 0 -3px 0 rgba(110, 74, 18, .35);
}
html.edicao-embaixador .in-kob-botao::after { border-color: rgba(247, 222, 150, .75); }
html.edicao-embaixador .in-kob-botao-ic.emb-medalhao {
  width: 52px; height: 52px; overflow: hidden; background: none;
  box-shadow: 0 3px 8px rgba(60, 30, 0, .4);
}
html.edicao-embaixador .emb-medalhao svg { display: block; width: 100%; height: 100%; }
html.edicao-embaixador .emb-botao-txt { min-width: 0; display: flex; flex-direction: column; }
html.edicao-embaixador .emb-botao-txt b { font-size: 21px; font-weight: 900; line-height: 1.15; letter-spacing: -0.01em; white-space: nowrap; color: #2a1606; }
html.edicao-embaixador .emb-botao-txt small { font-size: 16px; font-weight: 800; line-height: 1.25; color: #4a2e0e; }
html.edicao-embaixador .in-kob-sub b { color: var(--emb-ouro-claro); font-weight: 800; white-space: nowrap; }
html.edicao-embaixador .in-kob-ajuda { z-index: 1; } /* (dono 23/10) o laranja aceso e o pulso vêm do css/inicio.css; aqui não escurece mais */
html.edicao-embaixador .in-kob-ajuda-ic { background: var(--emb-grad-ouro); color: var(--emb-tinta); }
@media (max-width: 374px) {
  html.edicao-embaixador .in-kob { padding: 12px 12px 0; }
  html.edicao-embaixador .in-kob-ajuda { margin-left: 0; margin-right: 0; }
  html.edicao-embaixador .in-kob-cena { grid-template-columns: 84px minmax(0, 1fr); gap: 10px; }
  html.edicao-embaixador .in-kob-mascote { width: 80px; }
  html.edicao-embaixador .in-kob-pe::before { top: 78px; }
  html.edicao-embaixador .in-balao { font-size: 19px; padding: 12px 13px 13px; }
  html.edicao-embaixador .in-kob-botao { gap: 8px; padding: 8px 8px 8px 7px; }
  html.edicao-embaixador .in-kob-botao-ic.emb-medalhao { width: 44px; height: 44px; }
  html.edicao-embaixador .emb-botao-txt b { font-size: 19px; }
  html.edicao-embaixador .emb-botao-txt small { letter-spacing: -.015em; }
}

/* ---- o MASCOTE Silhueta (js/apresentador/mascote.js svgMascote na edição): a boca é o sorriso aberto, sempre à
   mostra; falando ela abre e fecha (--mc-boca, com a voz), e quando ele começa a falar LEVANTA O CHAPÉU pra
   cumprimentar (.mc-cumprimenta). No cartão do Início ele "diz" o balão quando a tela abre (.in-falando) ---- */
html.edicao-embaixador .vz-mascote[data-mascote="silhueta"] { overflow: visible; }
html.edicao-embaixador .vz-mascote[data-mascote="silhueta"] .mc-boca {
  opacity: 1; transform-box: fill-box; transform-origin: 50% 0;
  transform: scaleY(calc(1 + var(--mc-boca, 0) * .4));
}
html.edicao-embaixador .vz-mascote[data-mascote="silhueta"] .mc-chapeu { transform-box: fill-box; transform-origin: 50% 100%; transform: rotate(-3deg); }
html.edicao-embaixador .vz-mascote[data-mascote="silhueta"].mc-anim .mc-chapeu { animation: emb-chapeu-balanca 3.4s ease-in-out infinite alternate; }
html.edicao-embaixador .vz-mascote[data-mascote="silhueta"].mc-cumprimenta .mc-chapeu,
html.edicao-embaixador .in-kob.in-falando .vz-mascote[data-mascote="silhueta"] .mc-chapeu { animation: emb-chapeu-tira 2.6s ease-in-out 1; }
html.edicao-embaixador .in-kob.in-falando .vz-mascote[data-mascote="silhueta"] .mc-boca { animation: emb-fala .5s ease-in-out infinite; }
@keyframes emb-fala { 0%, 100% { transform: scaleY(1); } 30% { transform: scaleY(1.32); } 60% { transform: scaleY(.86); } 80% { transform: scaleY(1.18); } }
/* cumprimento de peão: levanta o chapéu (aparece o topete) e devolve */
@keyframes emb-chapeu-tira { 0% { transform: rotate(-3deg); } 20% { transform: translateY(-9%) rotate(-12deg); } 38%, 100% { transform: rotate(-3deg); } }
@keyframes emb-chapeu-balanca { from { transform: rotate(-4deg); } to { transform: rotate(-1.5deg); } }
/* nas bolinhas (o rosto do apresentador, o botão do rádio, os cartões do 1º uso): o rosto dele mais de perto */
html.edicao-embaixador .auto-puxar-rosto .vz-mascote[data-mascote="silhueta"],
html.edicao-embaixador .auto-ensina-rosto .vz-mascote[data-mascote="silhueta"],
html.edicao-embaixador .tu-rosto .vz-mascote[data-mascote="silhueta"] { left: -4%; top: 2%; width: 108%; height: 108%; }
html.edicao-embaixador .auto-puxar-rosto,
html.edicao-embaixador .auto-ensina-rosto { background: radial-gradient(circle at 50% 36%, #fff1c8 0%, #f0c460 40%, #b27c26 78%, #6e4a12 100%); }
html.edicao-embaixador .auto-puxar-bola { background: radial-gradient(circle at 50% 40%, #fde6a0 0%, #e2b04a 50%, #6e4a12 100%); }
html.edicao-embaixador .auto-puxar-bola::before { background: conic-gradient(from 0deg, #fde6a0, #c4902e, #7a4c1e, #e2b04a, #fde6a0); }

/* o selo do campeão da noite: a roseta de rodeio */
html.edicao-embaixador .emb-selo-linha {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 14px 10px 8px; border-radius: 20px;
  background: linear-gradient(110deg, rgba(163, 38, 28, .22), rgba(226, 176, 74, .06));
  border: 1px solid rgba(226, 176, 74, .32);
}
html.edicao-embaixador .emb-selo-roseta { flex: none; display: block; width: 50px; }
html.edicao-embaixador .emb-selo-roseta svg { display: block; width: 100%; height: auto; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .5)); }
html.edicao-embaixador .emb-selo-linha p { min-width: 0; font-size: 16px; line-height: 1.32; color: var(--texto-2); }
html.edicao-embaixador .emb-selo-linha b { color: var(--emb-ouro-claro); font-weight: 900; }

/* o resto do Início no couro e no ouro */
html.edicao-embaixador .in-tile-festa {
  --tl: rgba(226, 176, 74, .26);
  background: linear-gradient(150deg, rgba(226, 176, 74, .20), rgba(226, 176, 74, .03)); border-color: rgba(226, 176, 74, .5);
}
html.edicao-embaixador .in-tile-festa .in-tile-ic { background: rgba(226, 176, 74, .2); color: var(--emb-ouro-claro); }
/* (28/10) Festa = CHAMADA "começa aqui" (escolha A do dono): o mesmo dourado cheio do normal, também
   na edição arena. Mesma especificidade das regras acima, mas vem depois → vence. */
html.edicao-embaixador .in-tile-festa.in-festa-cta {
  background: linear-gradient(165deg, #ffd665, #eba52c 70%, #d8911f); border-color: transparent;
}
html.edicao-embaixador .in-festa-cta .in-tile-ic { background: rgba(42, 24, 2, .9); color: #ffe08a; }
html.edicao-embaixador .in-festa-cta .in-tile-txt b { color: #2a1800; }
html.edicao-embaixador .in-festa-cta .in-tile-txt small { color: #5a3c08; }
html.edicao-embaixador .in-tile-lista {
  --tl: rgba(220, 90, 70, .26); --tc: rgba(232, 120, 70, .6);
  background: linear-gradient(150deg, rgba(163, 38, 28, .30), rgba(163, 38, 28, .05)); border-color: rgba(214, 80, 60, .5);
}
html.edicao-embaixador .in-tile-lista .in-tile-ic { background: rgba(214, 80, 60, .24); color: #ffb8a4; }
html.edicao-embaixador .in-busca { background: rgba(255, 236, 200, .05); border-color: var(--borda-2); }
html.edicao-embaixador .in-auto {
  background: linear-gradient(150deg, rgba(168, 113, 58, .22), rgba(168, 113, 58, .04));
  border-color: rgba(200, 140, 76, .42);
}
html.edicao-embaixador .in-auto-topo .in-tile-ic,
html.edicao-embaixador .in-pedir .in-tile-ic { background: rgba(226, 176, 74, .14); color: var(--emb-ouro-claro); }
html.edicao-embaixador .in-auto-topo .in-seta,
html.edicao-embaixador .in-pedir-ir { color: var(--emb-ouro); }
html.edicao-embaixador .in-pedir { border-color: rgba(247, 222, 150, .3); background: rgba(255, 236, 200, .025); }
html.edicao-embaixador .in-pedidos-titulo .ic { color: var(--emb-ouro-claro); }
html.edicao-embaixador .in-ped-and { background: rgba(226, 176, 74, .14); color: var(--emb-ouro-claro); }
html.edicao-embaixador .in-cantar {
  border-color: rgba(226, 176, 74, .55); color: var(--emb-ouro-claro);
  background: linear-gradient(135deg, rgba(226, 176, 74, .20), rgba(226, 176, 74, .06));
}
html.edicao-embaixador .in-cantar .ic { color: var(--emb-ouro); }
html.edicao-embaixador .tela-inicio .instalar-lugar .instalar-cartao {
  background: linear-gradient(120deg, rgba(226, 176, 74, .10), rgba(163, 38, 28, .08));
  border-color: rgba(226, 176, 74, .34);
}
html.edicao-embaixador .in-sugestao-btn,
html.edicao-embaixador .in-ultima-btn { color: #24160d; background: var(--emb-creme); }
html.edicao-embaixador .in-sugestao-btn .ic,
html.edicao-embaixador .in-ultima-btn .ic { color: var(--emb-faixa); }
html.edicao-embaixador .in-sugestao-kicker { color: var(--emb-ouro); }
/* a assinatura: "EMBAIXADOR · edição do Kobalski" */
html.edicao-embaixador .in-rodape,
html.edicao-embaixador .emb-rodape,
html.edicao-embaixador .emb-tv-rodape {
  text-align: center; font-size: 14px; letter-spacing: .06em; color: rgba(247, 222, 150, .62);
}
html.edicao-embaixador .emb-rodape { margin: 22px 0 6px; }

/* ---------- os cartões do 1º uso ("Como funciona?") ---------- */
html.edicao-embaixador .tu-col {
  background:
    radial-gradient(ellipse 100% 34% at 50% 0%, rgba(226, 160, 70, .22), transparent 75%),
    linear-gradient(180deg, #1a110a 0%, #0b0806 40%, #0b0806 100%);
}
html.edicao-embaixador .tu-cena { background: var(--emb-couro-cartao); }
html.edicao-embaixador .tu-cortina { display: none; }
/* os refletores da arena (luz branca quente, no lugar do rosa e do ciano do Kobalski) */
html.edicao-embaixador .tu-feixe-e,
html.edicao-embaixador .tu-feixe-d { --luz: linear-gradient(180deg, rgba(255, 232, 180, .42), rgba(255, 214, 140, .12) 55%, transparent 92%); }
html.edicao-embaixador .tu-eu-mini { background: linear-gradient(135deg, #e2b04a, #a3261c); }
html.edicao-embaixador .tu-s1-canto .tu-barras { color: #a3261c; }
html.edicao-embaixador .tu-btn-primario { color: var(--emb-tinta); background: var(--emb-grad-ouro); box-shadow: 0 12px 30px rgba(226, 176, 74, .34), inset 0 1px 0 rgba(255, 255, 255, .55); }
html.edicao-embaixador .tu-extra,
html.edicao-embaixador .tu-mais-ic { background: rgba(226, 176, 74, .08); border-color: rgba(226, 176, 74, .32); }
html.edicao-embaixador .tu-capa { filter: sepia(1) saturate(1.5) hue-rotate(-14deg) brightness(.92); }

/* ---------- a janelinha do "Fala comigo, bebê!" (o "Tô ouvindo…") e a bolinha do apresentador ---------- */
html.edicao-embaixador .ko-caixa { background: var(--emb-couro-cartao); border-color: rgba(226, 176, 74, .42); }
html.edicao-embaixador .ko-anel {
  background: radial-gradient(circle, rgba(226, 176, 74, .32), rgba(163, 38, 28, .12) 60%, transparent 72%);
  border-color: rgba(247, 222, 150, .6);
}
html.edicao-embaixador .ko-kob { width: 84px; }
html.edicao-embaixador .ko-eq i { background: linear-gradient(180deg, #fde6a0, #c4902e); }
/* o rosto do apresentador (o cartão e a bolinha): ele no ouro do medalhão, senão o chapéu preto some no escuro */
html.edicao-embaixador .vz-rosto,
html.edicao-embaixador .vz-bolha-rosto { background: radial-gradient(circle at 50% 36%, #fff1c8 0%, #f0c460 40%, #b27c26 78%, #6e4a12 100%); }
html.edicao-embaixador .vz-rosto { box-shadow: 0 0 0 3px #1a0f07, 0 0 0 5px var(--vz-ouro), 0 10px 26px rgba(0, 0, 0, .5), 0 0 28px rgba(255, 200, 61, .35); }
html.edicao-embaixador .vz-falando .vz-rosto { box-shadow: 0 0 0 3px #1a0f07, 0 0 0 5px var(--vz-ciano), 0 10px 26px rgba(0, 0, 0, .5), 0 0 34px rgba(255, 220, 140, .55); }
html.edicao-embaixador .vz-bolha {
  color: var(--emb-tinta);
  box-shadow: 0 0 0 4px rgba(226, 176, 74, 0.2), 0 14px 30px rgba(226, 176, 74, 0.38), 0 4px 10px rgba(0, 0, 0, 0.5);
}

/* ---------- títulos e o resto do app ---------- */
/* as capas das músicas (cada uma numa cor) ficam no tom de couro e ouro; os cartões "na cor da música", dourados */
html.edicao-embaixador .musica-capa,
html.edicao-embaixador .in-capa { filter: sepia(1) saturate(1.5) hue-rotate(-14deg) brightness(.92); }
html.edicao-embaixador .in-sugestao,
html.edicao-embaixador .in-ultima { --h: 34 !important; }
html.edicao-embaixador .chip-ritmo.alta { background: rgba(226, 176, 74, .18); color: var(--emb-ouro-claro); }

/* =====================================================================================================================
   O RÁDIO / A FESTA NA TV: os tokens do .auto na cor da arena (o FORNO e o RANKING usam estes: css/forno-tv.css lê
   --a-ouro-claro, --a-ouro-forte e --a-fraco), a arena no fundo, a FIVELA com o nome no alto e o couro nos painéis
   ===================================================================================================================== */
html.edicao-embaixador .auto {
  --a-preto: #0b0806;
  --a-bg-1: #170e07;
  --a-bg-2: #2a1a0e;
  --a-linha: #3d2a18;
  --a-texto: #f7efe0;
  --a-suave: #dccaa8;
  --a-fraco: #ab9878;
  --a-ouro: #e2b04a;
  --a-ouro-forte: #c4902e;
  --a-ouro-claro: #f7de96;
  --a-ouro-escuro: #9a6b1e;
  --a-tinta-ouro: #1f1405;
}
/* a arena atrás de tudo: dois refletores varrendo devagar, as torres de luz, o público com lanterna e a poeira.
   Leve pra TV velha: só transform e opacity animam */
html.edicao-embaixador .emb-arena { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
html.edicao-embaixador .emb-tv-feixe { position: absolute; top: -40px; transform-origin: 50% 0; filter: blur(16px); }
html.edicao-embaixador .emb-tv-feixe::before {
  content: ""; position: absolute; inset: 0; clip-path: polygon(45% 0, 55% 0, 100% 100%, 0 100%);
  background: linear-gradient(180deg, rgba(255, 232, 180, .26), rgba(255, 214, 140, .07) 55%, transparent 92%);
}
html.edicao-embaixador .emb-tv-feixe-1 { left: 2%; width: 34vw; max-width: 520px; height: 110vh; transform: rotate(-24deg); animation: emb-tv-varre-1 9s ease-in-out infinite alternate; }
html.edicao-embaixador .emb-tv-feixe-2 { left: 40%; width: 26vw; max-width: 420px; height: 105vh; transform: rotate(14deg); opacity: .7; animation: emb-tv-varre-2 11s ease-in-out infinite alternate; }
@keyframes emb-tv-varre-1 { from { transform: rotate(-28deg); } to { transform: rotate(-18deg); } }
@keyframes emb-tv-varre-2 { from { transform: rotate(10deg); } to { transform: rotate(20deg); } }
html.edicao-embaixador .emb-tv-torre {
  position: absolute; top: -26px; width: 120px; height: 46px; border-radius: 8px;
  background: radial-gradient(circle, #fffaf0 0 4px, #ffe3a0 6px, transparent 11px) 4px 2px / 28px 22px, #1a120b;
  border: 3px solid #4a3622; box-shadow: 0 0 70px 26px rgba(255, 220, 150, .22);
}
html.edicao-embaixador .emb-tv-torre-1 { left: 5%; transform: rotate(12deg); }
html.edicao-embaixador .emb-tv-torre-2 { left: 36%; transform: rotate(-8deg); }
html.edicao-embaixador .emb-tv-publico {
  position: absolute; left: 0; right: 0; bottom: 0; height: 240px;
  background:
    radial-gradient(circle, rgba(255, 240, 200, .9) 0 1.4px, transparent 2.2px) 0 0 / 27px 17px,
    radial-gradient(circle, rgba(255, 210, 140, .7) 0 1.2px, transparent 2px) 11px 7px / 37px 21px,
    radial-gradient(circle, rgba(255, 250, 230, .8) 0 1.6px, transparent 2.6px) 5px 12px / 53px 29px;
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 60%);
          mask-image: linear-gradient(180deg, transparent, #000 60%);
  opacity: .22;
}
@media (max-width: 700px) {
  html.edicao-embaixador .emb-tv-torre { width: 70px; height: 30px; top: -16px; }
  html.edicao-embaixador .emb-tv-publico { height: 140px; }
}
/* a FIVELA + EMBAIXADOR no alto (no lugar do rótulo "Modo automático") */
html.edicao-embaixador .auto-marca.emb-tv-marca {
  display: inline-flex; align-items: center; gap: .55em;
  font-size: 1em; text-transform: none; letter-spacing: normal; color: inherit;
}
html.edicao-embaixador .emb-tv-fivela { display: block; flex: none; width: 4.1em; }
html.edicao-embaixador .emb-tv-fivela svg { display: block; width: 100%; height: auto; filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .6)); }
html.edicao-embaixador .emb-tv-nome {
  font-family: var(--emb-faroeste); font-size: 1.75em; letter-spacing: .04em; line-height: 1; padding-top: .12em; text-transform: uppercase;
  background: var(--emb-texto-ouro); -webkit-background-clip: text; background-clip: text; color: transparent;
}
@media (max-width: 700px) {
  html.edicao-embaixador .emb-tv-fivela { width: 3em; }
  html.edicao-embaixador .emb-tv-nome { font-size: 1.3em; }
}
/* o título da música na letra de faroeste (é título); a letra cantada continua na letra grossa */
html.edicao-embaixador .auto-titulo { font-family: var(--emb-faroeste); font-weight: 400; letter-spacing: .01em; }
html.edicao-embaixador .auto-h1 { font-family: var(--emb-faroeste); font-weight: 400; letter-spacing: .01em; }
html.edicao-embaixador .auto-chip { background: rgba(20, 12, 6, .7); border-color: rgba(226, 176, 74, .4); }
/* os painéis da festa (QR, forno, pedidos) no couro com pesponto */
html.edicao-embaixador .auto-festa {
  position: relative; isolation: isolate;
  background: var(--emb-grao-couro), linear-gradient(170deg, #34200f 0%, #1f1309 60%, #170e07 100%);
  border-color: rgba(226, 176, 74, .38);
}
html.edicao-embaixador .auto-festa::after {
  content: ""; position: absolute; inset: 6px; border-radius: calc(var(--a-raio) - 5px); pointer-events: none; z-index: -1;
  border: 1.5px dashed rgba(247, 222, 150, .22);
}
html.edicao-embaixador .auto-qr { box-shadow: 0 0 0 4px rgba(226, 176, 74, .6), 0 10px 26px rgba(0, 0, 0, .45); }
html.edicao-embaixador .emb-tv-rodape { margin-top: .9em; font-size: .78em; }
/* os cartões dos ritmos: couro; o "Embaixador" leva o medalhão dele */
html.edicao-embaixador .auto-cartao:not(.auto-cartao-tudo):not(.auto-cartao-emb) {
  background: var(--emb-grao-couro), linear-gradient(160deg, var(--a-bg-2), var(--a-bg-1));
}
/* a dica da 1ª vez (o balão do botão "Toca e canta outra"): creme e ouro */
html.edicao-embaixador .auto-ensina-balao,
html.edicao-embaixador .auto-ensina-balao::after { background: var(--emb-creme); }
html.edicao-embaixador .auto-ensina-balao { color: #24160d; }
html.edicao-embaixador .auto-ensina-texto b { color: #9a2018; }
html.edicao-embaixador .auto-ensina-pe small { color: #6b4a26; }
html.edicao-embaixador .auto .auto-ensina-ok { background: var(--emb-grad-ouro); color: var(--emb-tinta); box-shadow: 0 8px 20px rgba(226, 176, 74, .35), inset 0 1px 0 rgba(255, 255, 255, .5); }
html.edicao-embaixador .auto .auto-ensina-ok:focus { outline-color: var(--emb-ouro-claro); }
html.edicao-embaixador .auto-ensina-seta { color: var(--emb-ouro); }

/* ---- a CHAMADA DA VEZ na tela (ensaio do vídeo 21/10; js/automatico/index.js mostrarVez): "Tua vez, Dona Cida!" grande
   no lugar da letra, o nome em ouro; embaixo, "Pega o microfone". A onda da letra para (é a vez de gente, não do rádio) */
html.edicao-embaixador .auto[data-auto-estado="chamando"] .auto-verso { color: #fff; }
html.edicao-embaixador .auto-vez-nome {
  color: var(--emb-ouro-claro);
  text-shadow: 0 0 22px rgba(242, 210, 122, .55);
}
html.edicao-embaixador .auto[data-auto-estado="chamando"] .auto-verso-prox { color: var(--emb-ouro); font-weight: 800; }
html.edicao-embaixador .auto[data-auto-estado="chamando"] .auto-ondas { opacity: .35; }

/* ---- a NOTA na TV (ensaio do vídeo 21/10): o resultado é a coluna do celular (560 px) e, numa TV de 1920, o anel da
   nota ficava pequeno no vídeo. Na tela grande a MESMA coluna cresce 1,4x. Sem :has() (TV velha): fica igual */
@supports selector(:has(*)) {
  @media (min-width: 1400px) and (min-height: 850px) {
    html.edicao-embaixador #app:has(> #tela-resultado:not([hidden])) { max-width: 800px; }
    html.edicao-embaixador #tela-resultado:not([hidden]) { zoom: 1.4; }
  }
}

/* ---- o palco e a nota na cor da arena (ensaio do vídeo 22/10): sobravam três peças do Kobalski roxo/rosa bem no
   meio do vídeo: o miolo ROXO do anel da nota, o brilho rosa em cima dele e o "Parar" rosa do palco. Viram couro,
   ouro e o vermelho da faixa. Nada muda de lugar nem de tamanho */
html.edicao-embaixador .res-hero {
  background:
    radial-gradient(90% 70% at 50% 0%, rgba(226, 176, 74, .16), transparent 70%),
    var(--emb-grao-couro), linear-gradient(170deg, #2e1d10 0%, #1c120a 60%, #150e09 100%);
  border-color: rgba(226, 176, 74, .32);
}
html.edicao-embaixador .anel { box-shadow: 0 0 50px rgba(226, 176, 74, .28); }
html.edicao-embaixador .anel-miolo { background: radial-gradient(circle at 50% 30%, #4a2e16, #1a1009 78%); }
html.edicao-embaixador .anel-miolo span { color: var(--emb-ouro-claro); }
html.edicao-embaixador .placar-num span { background: linear-gradient(180deg, #ffffff 30%, var(--emb-ouro-claro) 100%); -webkit-background-clip: text; background-clip: text; }
html.edicao-embaixador .btn-parar {
  background: linear-gradient(135deg, #c8402f 0%, var(--emb-faixa) 100%);
  box-shadow: 0 10px 26px rgba(163, 38, 28, .4), inset 0 1px 0 rgba(255, 255, 255, .18);
}
/* na NOTA, a pílula "Achar música" (ouro) caía em cima do "Cantar de novo" (ouro) e tapava a palavra, no celular e na
   TV: ali ela fica só o medalhão do mascote, no canto. Tocar abre o mesmo cartão de sempre */
html.edicao-embaixador .vz[data-tela="resultado"]:not(.vz-aberto) .vz-bolha {
  width: 64px; height: 64px; min-height: 0; padding: 6px; border-radius: 50%;
}
html.edicao-embaixador .vz[data-tela="resultado"]:not(.vz-aberto) .vz-bolha-txt { display: none; }
/* a contagem antes da banda: o número GRANDE da pista já conta. O chip "Começa em 3s" do placar contava junto, um
   tiquinho adiantado (ele anda com o relógio do som, a pista com o da tela, que espera a caixa de som): no vídeo
   aparecia "Começa em 3s" do lado de um "4". Na edição o chip some só durante a contagem (o lugar dele fica) */
html.edicao-embaixador #tela-palco.contagem #placar-status { visibility: hidden; }
/* quem cantou, no alto da nota (só na festa: "A nota de Dona Cida"; js/app.js renderResultado) */
html.edicao-embaixador #tela-resultado .topo-kicker { color: var(--emb-ouro); }
html.edicao-embaixador #tela-resultado .topo-kicker b { color: var(--emb-ouro-claro); font-size: 1.25em; letter-spacing: .1em; }

/* ---- os botões do rádio na TV/PC (ensaio do vídeo 21/10): quebravam linha sem querer ("Sair", ou "Trocar ritmo" +
   "Sair", caíam sozinhos na 2ª linha quando o "Toca e canta outra" aparecia ou a música pausava). Agora a quebra é de
   propósito: em cima os dois grandes (Cantar essa + Toca e canta outra), embaixo os pequenos, com o Sair na ponta */
@media (min-width: 900px), (orientation: landscape) and (min-width: 640px) {
  html.edicao-embaixador .auto-botoes::after { content: ""; order: 1; flex: 0 0 100%; height: 0; }
  html.edicao-embaixador .auto-botoes > .auto-btn:not(.auto-btn-cantar) { order: 2; }
  html.edicao-embaixador .auto-botoes > .auto-btn[data-auto-acao="sair"] { margin-left: auto; }
  html.edicao-embaixador .auto-botoes .auto-btn-cantar { flex: 1 1 13em; }
  html.edicao-embaixador .auto-botoes .auto-puxar { flex: 1 1 19em; }
}

/* ---- o CANCELAR da plaquinha do forno (22/10/2026, js/automatico/forno-tv.js): couro com o contorno de ouro; armado
   ("Cancelar? Toca de novo"), o vermelho da faixa ---- */
html.edicao-embaixador .auto-fg-cancelar { background: rgba(20, 12, 6, .55); border-color: rgba(226, 176, 74, .5); color: var(--emb-ouro-claro); }
html.edicao-embaixador .auto-fg-cancelar:hover { border-color: var(--emb-ouro); color: #fff3c8; }
html.edicao-embaixador .auto-fg-cancelar[data-estado="armado"] { background: var(--emb-faixa); border-color: #f2b8a0; color: #fff; }

/* ---- o RANKING DA NOITE: o campeão é "Embaixador/Embaixadora da noite", com a ROSETA de rodeio ---- */
html.edicao-embaixador .auto-ranking { background: rgba(11, 8, 6, .9); }
html.edicao-embaixador .auto-ranking-cartao {
  background: var(--emb-grao-couro), linear-gradient(170deg, #34200f 0%, #1f1309 60%, #170e07 100%);
  border-color: rgba(226, 176, 74, .45);
}
html.edicao-embaixador .auto-ranking-titulo { font-family: var(--emb-faroeste); font-weight: 400; color: var(--emb-ouro-claro); }
html.edicao-embaixador .auto-ranking-estrela {
  background: var(--emb-grao-couro), linear-gradient(170deg, #3d140d 0%, #23100a 60%, #170e07 100%);
  border: 1px solid rgba(214, 80, 60, .55);
  color: var(--a-texto);
  box-shadow: 0 0 80px rgba(226, 176, 74, .22), inset 0 0 0 3px rgba(163, 38, 28, .35);
}
html.edicao-embaixador .auto-ranking-roseta { display: block; width: 4.6em; margin: 0 auto .2em; }
html.edicao-embaixador .auto-ranking-roseta svg { width: 100%; height: auto; filter: drop-shadow(0 6px 12px rgba(0, 0, 0, .6)); }
html.edicao-embaixador .auto-ranking-rotulo {
  font-family: var(--emb-faroeste); font-weight: 400; text-transform: none; letter-spacing: .02em; font-size: 1.35em; color: var(--emb-ouro-claro);
}
html.edicao-embaixador .auto-ranking-nota b { font-family: var(--emb-faroeste); font-weight: 400; color: var(--emb-ouro-claro); }
html.edicao-embaixador .auto-ranking-nota small { color: var(--a-fraco); text-transform: uppercase; letter-spacing: .14em; font-size: .8em; }
html.edicao-embaixador .auto-ranking-musica { color: var(--a-suave); }
html.edicao-embaixador .auto-ranking-quem small.auto-ranking-falta { color: #ffb8a4; font-weight: 800; }
/* (22/10/2026, defeito 10) a TV baixa (1920x911) com os 8: a roseta menor (o resto encolhe no css/automatico.css) */
@media (min-width: 900px) and (max-height: 1000px) {
  html.edicao-embaixador .auto-ranking-roseta { width: 3.3em; margin-bottom: 0; }
  html.edicao-embaixador .auto-ranking-rotulo { font-size: 1.15em; }
}

/* ---------- a sala do convidado (sala.html) ---------- */
html.edicao-embaixador body .pagina { --linha: #3d2a18; --suave: #dccaa8; --fraco: #ab9878; }
/* o aviso de baixo ("Boate Azul tá na fila! (lugar 1 na fila)"), ensaio do vídeo 22/10: com left 50% e sem largura
   ele só tinha a METADE da tela pra caber e quebrava em 3 linhas dentro da pílula (virava um ovo em cima do rodapé).
   Agora ocupa a largura do texto, até a tela menos as margens; com 2 linhas, cantos de cartão. No app (index.html) o
   aviso já tinha a largura certa: lá só troca o roxo do Kobalski pelo couro da arena */
html.edicao-embaixador .toast {
  width: max-content; max-width: calc(100vw - 32px);
  border-radius: 18px; padding: 13px 20px;
  background: #1f140b; border-color: rgba(226, 176, 74, .7);
  font-weight: 700; line-height: 1.3;
}
/* "Chegou a sua" quando a TV já pôs na fila (js/sala-pedido.js conferirSeJaTaNaFila) */
html.edicao-embaixador .chegou-na-fila { margin: -4px 0 12px; font-weight: 800; font-size: 1.02rem; color: var(--emb-ouro-claro); }
html.edicao-embaixador .pagina .input,
html.edicao-embaixador .pagina .item,
html.edicao-embaixador .pagina .logado { background: #150e09; }
html.edicao-embaixador .pagina .item:hover { background: #1f140b; }
/* "Meus pedidos" enquanto a música está no forno (ensaio do vídeo 22/10): o fundo roxo e o rosa do Kobalski viram couro
   e ouro, como o resto da sala */
html.edicao-embaixador .meu-pedido { background: #150e09; }
html.edicao-embaixador .item-forno { color: var(--emb-ouro-claro); }
html.edicao-embaixador .andamento-convertendo { color: var(--emb-ouro-claro); border-color: rgba(226, 176, 74, .5); background: rgba(226, 176, 74, .1); }
/* o "Cancelar" do "Meus pedidos" (22/10/2026, js/sala-pedido.js): o contorno de ouro do couro; armado, o vermelho da faixa */
html.edicao-embaixador .meu-cancelar { border-color: rgba(226, 176, 74, .45); color: var(--emb-ouro-claro); }
html.edicao-embaixador .meu-cancelar[data-estado="armado"] { background: var(--emb-faixa); border-color: #f2b8a0; color: #fff; }
html.edicao-embaixador .marca-nome { font-family: var(--emb-faroeste); font-weight: 400; letter-spacing: .03em; }

/* ---------- o DESTAQUE das dele (a edição tem TODAS as músicas; as dele só vêm na frente) ---------- */
/* "Do Embaixador" no Início (js/app.js renderInicioDados) */
html.edicao-embaixador .in-emb { display: flex; flex-direction: column; gap: 10px; }
html.edicao-embaixador .in-emb-cabeca { margin: 4px 2px 0; }
html.edicao-embaixador .in-emb-cabeca h2 { font-family: var(--emb-faroeste); font-weight: 400; letter-spacing: .02em; color: var(--emb-ouro-claro); }
html.edicao-embaixador .in-emb-cabeca h2::before { content: "★ "; color: var(--emb-ouro); }
html.edicao-embaixador .in-emb-cabeca button { color: var(--emb-ouro-claro); }
html.edicao-embaixador .in-emb-lista {
  background: linear-gradient(160deg, rgba(92, 58, 30, .42), rgba(36, 22, 13, .55));
  border-color: rgba(226, 176, 74, .5);
}
html.edicao-embaixador .in-emb-lista .in-linha + .in-linha { border-top-color: rgba(226, 176, 74, .22); }
/* o cartão "Embaixador" no rádio (o primeiro, a linha inteira; js/automatico/estilos.js), com o medalhão dele */
html.edicao-embaixador .auto-cartao-emb {
  grid-column: 1 / -1;
  flex-direction: row; align-items: center; justify-content: flex-start;
  min-height: 5.6em;
  background: var(--emb-grao-couro), linear-gradient(135deg, #5c3a1e, #24160d 70%);
  border: 1.5px solid var(--emb-ouro);
  color: var(--emb-ouro-claro);
  box-shadow: 0 10px 34px rgba(226, 176, 74, .2), inset 0 0 0 3px rgba(163, 38, 28, .55);
}
html.edicao-embaixador .auto-cartao-emb .auto-cartao-texto { margin: 0 0 0 0.8em; }
html.edicao-embaixador .auto-cartao-emb .auto-cartao-nome { font-family: var(--emb-faroeste); font-weight: 400; letter-spacing: .03em; font-size: 1.35em; }
html.edicao-embaixador .auto-cartao-emb .auto-cartao-n { color: rgba(247, 222, 150, .78); }
html.edicao-embaixador .auto-cartao-medalhao { display: block; flex: none; width: 2.6em; height: 2.6em; border-radius: 50%; box-shadow: 0 4px 12px rgba(0, 0, 0, .5); }
html.edicao-embaixador .auto-cartao-medalhao svg { display: block; width: 100%; height: 100%; }
/* o disco "Embaixador" nos ritmos do Início: couro com o miolo de ouro */
html.edicao-embaixador .in-ritmo[data-ritmo="embaixador"] {
  background: var(--emb-grao-couro), linear-gradient(135deg, #5c3a1e, #24160d);
  box-shadow: inset 0 0 0 1.5px var(--emb-ouro);
  color: var(--emb-ouro-claro);
  font-family: var(--emb-faroeste); font-weight: 400; letter-spacing: .03em;
}
html.edicao-embaixador .in-ritmo[data-ritmo="embaixador"] .in-ritmo-disco {
  background:
    radial-gradient(circle, #fff1c8 0 10%, #e2b04a 11% 17%, rgba(0, 0, 0, .7) 18% 20%, transparent 21%),
    repeating-radial-gradient(circle, rgba(0, 0, 0, .55) 0 1.2px, rgba(0, 0, 0, .4) 1.2px 3px);
}

/* =====================================================================================================================
   (22/10/2026, revisão da edição Embaixador, defeito 11) O PALCO VESTIDO DE ARENA. A tela de cantar é a mais filmada e
   ainda tinha a cara do Kobalski: o quintal roxo e azul de fundo (o cenário do 1º degrau), o anel da contagem azul-claro
   (js/app.js: a cor da pista vira ouro na edição) e a bolinha do cantor verde (o círculo com a inicial). Agora o fundo é
   a ARENA do rádio (os dois refletores, as torres de luz, o público com lanterna), e o anel e a bolinha, ouro. A
   plateia (as cabeças que reagem) e o retrato continuam; só o cenário do quintal sai. Nada muda de lugar nem de tamanho.
   ===================================================================================================================== */
html.edicao-embaixador .pista-wrap {
  border-color: rgba(226, 176, 74, .3);
  background: linear-gradient(180deg, #1c120a 0%, #0b0806 70%);
}
html.edicao-embaixador .pista-wrap .cena {
  background:
    radial-gradient(70% 55% at 50% 112%, rgba(226, 160, 70, .26), transparent 72%),
    linear-gradient(180deg, #1f140b 0%, #120b06 55%, #0b0806 100%);
  --cone-cor: 255, 226, 170;
  --aura-a: 255, 214, 140;
  --aura-b: 226, 176, 74;
  --veu: 11, 8, 6;
}
/* o quintal (céu, varal de lâmpadas, árvore, churrasqueira) sai; a arena entra pelos dois pseudo-elementos */
html.edicao-embaixador .pista-wrap .cena-fundo > svg,
html.edicao-embaixador .pista-wrap .cena-camadas > *,
html.edicao-embaixador .pista-wrap .cena-elementos { display: none; }
/* os refletores (o mesmo desenho do rádio: o feixe com o recorte em leque) e as torres de luz no alto */
html.edicao-embaixador .pista-wrap .cena-fundo::before {
  content: ""; position: absolute; top: -10%; left: 6%; width: 38%; height: 130%;
  transform-origin: 50% 0; transform: rotate(-16deg); filter: blur(14px);
  clip-path: polygon(45% 0, 55% 0, 100% 100%, 0 100%);
  background: linear-gradient(180deg, rgba(255, 232, 180, .3), rgba(255, 214, 140, .08) 55%, transparent 92%);
}
html.edicao-embaixador .pista-wrap .cena-fundo::after {
  content: ""; position: absolute; top: -10%; right: 4%; width: 30%; height: 125%;
  transform-origin: 50% 0; transform: rotate(14deg); filter: blur(14px); opacity: .75;
  clip-path: polygon(45% 0, 55% 0, 100% 100%, 0 100%);
  background: linear-gradient(180deg, rgba(255, 232, 180, .26), rgba(255, 214, 140, .07) 55%, transparent 92%);
}
/* o público com lanterna embaixo (os pontinhos dourados do rádio), atrás das cabeças da plateia (a camada do cenário
   que ficou vazia; o véu que deixa a letra legível continua por cima, igual) */
html.edicao-embaixador .pista-wrap .cena-camadas {
  background:
    radial-gradient(circle, rgba(255, 240, 200, .9) 0 1.3px, transparent 2.1px) 0 0 / 27px 17px,
    radial-gradient(circle, rgba(255, 210, 140, .7) 0 1.1px, transparent 1.9px) 11px 7px / 37px 21px;
  opacity: .3;
  -webkit-mask-image: linear-gradient(180deg, transparent 50%, rgba(0, 0, 0, .4) 75%, #000);
          mask-image: linear-gradient(180deg, transparent 50%, rgba(0, 0, 0, .4) 75%, #000);
}
/* a BOLINHA de quem canta (o círculo com a inicial ou a pessoa): ouro de fivela, com o anel girando em ouro */
html.edicao-embaixador .cena-retrato-disco,
html.edicao-embaixador .cena-retrato-disco[data-tipo="pessoa"] {
  background: radial-gradient(circle at 50% 34%, #fff1c8 0%, #f0c460 38%, #b27c26 76%, #6e4a12 100%);
  color: #2a1a08;
}
html.edicao-embaixador .cena-retrato-ini { color: #2a1a08; text-shadow: 0 1px 0 rgba(255, 241, 200, .6); }
html.edicao-embaixador .cena-retrato-anel {
  background: conic-gradient(from 0deg, #fff1c8, #e2b04a, #a3261c, #f7de96, #c4902e, #fff1c8);
}
html.edicao-embaixador .cena-retrato-nome { background: rgba(20, 12, 6, .82); box-shadow: 0 0 0 1px rgba(226, 176, 74, .7); }
/* o "Pronto pro show?" em cima da arena: o cartão em couro escuro e o fone em ouro (era o azul-marinho e o ciano) */
html.edicao-embaixador .pista-wrap.com-cena .pista-overlay { background: linear-gradient(90deg, rgba(11, 8, 6, 0) 0%, rgba(11, 8, 6, 0) 30%, rgba(11, 8, 6, .5) 58%, rgba(11, 8, 6, .66) 100%); }
html.edicao-embaixador .pista-wrap.com-cena .overlay-card { background: rgba(20, 12, 6, .8); border-color: rgba(226, 176, 74, .25); }
html.edicao-embaixador .overlay-ic { background: rgba(226, 176, 74, .14); color: var(--emb-ouro-claro); }

/* ---- (22/10, revisão, baixa) as peças verde-azuladas que SOBRAVAM do Kobalski: o aviso "Usa fone" do palco, a barra
   da voz do cantor ("vale 100%", "ajuda auto"), o anel de foco da busca e dos campos, o aviso da conta (Minha conta) e
   as etiquetas do resultado. Viram couro e ouro (o verde do "vale 100%"/"ajuda auto" vira ouro: na arena não tem verde) */
html.edicao-embaixador .aviso-fone { background: rgba(226, 176, 74, .07); border-color: rgba(226, 176, 74, .3); }
html.edicao-embaixador .aux-vivo {
  border-color: rgba(226, 176, 74, .3);
  background: linear-gradient(90deg, rgba(226, 176, 74, .08), rgba(226, 176, 74, .02)), rgba(20, 12, 6, .55);
}
html.edicao-embaixador #tela-palco { --verde: #f7de96; }
html.edicao-embaixador .aux-vivo-vale,
html.edicao-embaixador .aux-vivo-vale.cheio,
html.edicao-embaixador .aux-vivo-ajuda { background: rgba(226, 176, 74, .12); border-color: rgba(226, 176, 74, .38); color: var(--emb-ouro-claro); }
html.edicao-embaixador .input:focus { border-color: var(--emb-ouro); box-shadow: 0 0 0 3px rgba(226, 176, 74, .25); }
html.edicao-embaixador .aviso-local { border-color: rgba(226, 176, 74, .32); background: rgba(226, 176, 74, .07); }
html.edicao-embaixador .tag { background: rgba(226, 176, 74, .1); border-color: rgba(226, 176, 74, .3); }
html.edicao-embaixador .res-dica,
html.edicao-embaixador .licenca { background: rgba(226, 176, 74, .07); border-color: rgba(226, 176, 74, .38); color: var(--emb-ouro-claro); }
/* ---- (22/10, revisão, baixa) na NOTA da TV o medalhão do mascote (e o balão da fala dele) ficava no meio, em cima do
   cartão da nota (tapava "MELHOR NESSA MÚSICA" e as etiquetas). Na tela larga ele vai pro canto de baixo, fora da coluna */
@media (min-width: 1000px) {
  html.edicao-embaixador .vz[data-tela="resultado"]:not(.vz-aberto) {
    left: auto;
    right: calc(var(--safe-r, 0px) + 18px);
    transform: none;
    width: auto;
    max-width: 360px;
  }
}

/* ---- (22/10, revisão, baixa) o "COMEÇA POR AQUI!" (css/ensinar.css .co-*): o botão "Entendi" era branco em cima do
   ouro-rosa do Kobalski, com brilho rosa e o título roxo. Na edição: o ouro da fivela com a tinta escura, o título em
   couro e o anel de luz em ouro claro ---- */
html.edicao-embaixador .co-balao,
html.edicao-embaixador .co-balao::before { background: var(--emb-creme); }
html.edicao-embaixador .co-balao { color: #24160d; }
html.edicao-embaixador .co-titulo { color: #5c3a1e; }
html.edicao-embaixador .co-ok {
  color: var(--emb-tinta);
  background: var(--emb-grad-ouro);
  box-shadow: 0 10px 24px rgba(226, 176, 74, .38), inset 0 1px 0 rgba(255, 255, 255, .5);
}
html.edicao-embaixador .co-ok:focus-visible { outline-color: rgba(154, 107, 30, .7); }
html.edicao-embaixador .co-luz { box-shadow: 0 0 0 200vmax rgba(11, 8, 6, .86), 0 0 0 4px rgba(247, 222, 150, .75), 0 0 40px 8px rgba(226, 176, 74, .45); }
@keyframes emb-co-luz { to { box-shadow: 0 0 0 200vmax rgba(11, 8, 6, .86), 0 0 0 6px rgba(247, 222, 150, .9), 0 0 56px 12px rgba(226, 176, 74, .55); } }
html.edicao-embaixador .co-luz { animation-name: emb-co-luz; }

/* ---- (22/10, revisão, baixa do adendo) o cartão 4 do 1º uso ("Põe o QR na TV"): a TV do desenho ainda era roxa e os
   celulares rosa; os outros cartões já estavam em couro e ouro ---- */
html.edicao-embaixador .tu-s4-tv {
  background: #0b0806; border-color: #5c3a1e;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .5), inset 0 0 22px rgba(226, 160, 70, .22);
}
html.edicao-embaixador .tu-s4-tv::after { background: #5c3a1e; }
html.edicao-embaixador .tu-s4-cel { background: linear-gradient(160deg, #3a2414, #1a100a); border-color: #9a6b1e; }
html.edicao-embaixador .tu-s4-cel::before { background: linear-gradient(135deg, #f7de96, #c4902e); }
html.edicao-embaixador .tu-s3-circulo { background: radial-gradient(circle at 50% 35%, #4a2e16, #1a1009); }

/* ---------- movimento reduzido: nada se mexe sozinho (o portão e o letreiro só trocam de estado) ---------- */
@media (prefers-reduced-motion: reduce) {
  html.edicao-embaixador .emb-grao,
  html.edicao-embaixador .emb-tv-feixe-1,
  html.edicao-embaixador .emb-tv-feixe-2,
  html.edicao-embaixador .tela-entrar.ep-no-palco .ep-mic-coroa.emb-fivela,
  html.edicao-embaixador .vz-mascote[data-mascote="silhueta"] .mc-chapeu,
  html.edicao-embaixador .vz-mascote[data-mascote="silhueta"].mc-anim .mc-chapeu,
  html.edicao-embaixador .vz-mascote[data-mascote="silhueta"].mc-cumprimenta .mc-chapeu,
  html.edicao-embaixador .in-kob.in-falando .vz-mascote[data-mascote="silhueta"] .mc-chapeu,
  html.edicao-embaixador .in-kob.in-falando .vz-mascote[data-mascote="silhueta"] .mc-boca,
  html.edicao-embaixador .co-luz { animation: none; }
  html.edicao-embaixador .emb-grao { opacity: calc(var(--o) * .7); }
}

/* ---- (22/10/2026, ideia da revisão aprovada pelo dono) o SELO GRANDE da ajuda no palco, nas cores da arena: couro com
   grão, borda e medalhão de ouro, letra ouro claro (o mesmo couro dos cartões; a Rye fica só no nome). Ele aparece
   quando a voz do cantor sobe sozinha e some quando a pessoa firma (js/selo-ajuda.js; o resto em css/auxilio-vivo.css) */
html.edicao-embaixador .selo-ajuda {
  border-color: var(--emb-ouro);
  background: var(--emb-couro-cartao);
  box-shadow: 0 0 0 4px rgba(226, 176, 74, .16), 0 0 34px rgba(226, 176, 74, .26), 0 10px 28px rgba(0, 0, 0, .55);
  color: var(--emb-ouro-claro);
}
html.edicao-embaixador.palco-telao .selo-ajuda {
  box-shadow: 0 0 0 6px rgba(226, 176, 74, .16), 0 0 48px rgba(226, 176, 74, .3), 0 14px 40px rgba(0, 0, 0, .6);
}
html.edicao-embaixador .selo-ajuda-ic {
  background: var(--emb-grad-ouro);
  color: var(--emb-tinta);
  box-shadow: inset 0 0 0 1px rgba(255, 243, 200, .55);
}

/* ---- (22/10/2026, ideias da revisão aprovadas pelo dono) a FESTA na TV: a contagem da fila ("Daqui a 15 s: Dona
   Cida!"), o "Cantar agora" da pronta pela voz e a COROAÇÃO ("Nova Embaixadora da noite"), na arena: couro com grão,
   ouro de fivela, a faixa vermelha no selo e a Rye só no título (js/automatico/index.js; o desenho em css/automatico.css) */
html.edicao-embaixador .auto-contagem .auto-kicker { color: var(--emb-ouro); }
html.edicao-embaixador .auto-contagem-frase .auto-vez-nome { color: var(--emb-ouro-claro); }
html.edicao-embaixador .auto-contagem-sub { color: var(--emb-ouro); }
html.edicao-embaixador .auto-contagem-barra i { background: var(--emb-grad-ouro); }
html.edicao-embaixador .auto-fg-chegou .auto-fg-cantar { background: var(--emb-couro-cartao); color: var(--emb-ouro-claro); border-color: rgba(31, 20, 5, .55); }
html.edicao-embaixador .auto-coroa { background: radial-gradient(1200px 800px at 50% 40%, rgba(226, 176, 74, .2), transparent 65%), rgba(11, 8, 6, .92); }
html.edicao-embaixador .auto-coroa-cartao {
  background: var(--emb-couro-cartao);
  border-color: rgba(226, 176, 74, .6);
  box-shadow: 0 0 0 4px rgba(163, 38, 28, .3), 0 0 150px rgba(226, 176, 74, .28), 0 18px 50px rgba(0, 0, 0, .6);
}
html.edicao-embaixador .auto-coroa-titulo { font-family: var(--emb-faroeste); font-weight: 400; letter-spacing: .02em; color: var(--emb-ouro-claro); }
html.edicao-embaixador .auto-coroa-tomou { color: #ffd9cc; }
html.edicao-embaixador .auto-coroa-nota b { font-family: var(--emb-faroeste); font-weight: 400; color: var(--emb-ouro-claro); }