/* Painel do operador — mesma marca, densidade de sistema (14px, linhas 44px). */

.corpo-painel { background: var(--papel); min-height: 100vh; }
.barra { background: var(--navy); color: #fff; position: sticky; top: 0; z-index: 40; border-bottom: 1px solid var(--linha-escura); }
.barra__in { display: flex; align-items: center; gap: var(--e-24); min-height: 60px; }
.barra__nav { display: flex; gap: 4px; margin-right: auto; position: relative; }
.barra__nav a { color: var(--texto-escuro); text-decoration: none; font: 600 var(--t-14)/1 var(--display); padding: 10px 14px; border-radius: var(--raio-pill); position: relative; transition: color var(--motion-dur-2); }
.barra__nav a:hover { color: #fff; }
.barra__nav a[aria-current="page"] { color: #fff; background: rgb(255 255 255 / .08); }
.barra__usuario { display: flex; align-items: center; gap: var(--e-12); font-size: var(--t-14); color: var(--texto-escuro); }
.barra__avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--grad); color: var(--navy); display: grid; place-items: center; font: 700 var(--t-14)/1 var(--display); }
.barra__usuario form { margin: 0; }
.barra .btn--fantasma { color: var(--texto-escuro); }
.barra .btn--fantasma:hover { color: #fff; background: rgb(255 255 255 / .08); }
@media (max-width: 720px) {
  .barra__nome, .logo__rotulo, .barra__externo { display: none; }
  .barra__in { gap: var(--e-8); }
  .barra .logo__svg { width: 76px; }
  .barra__nav a { padding: 10px; }
  .barra__avatar { display: none; }
  .barra__sair-txt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .barra .btn--fantasma { min-width: 44px; min-height: 44px; }
}

.painel-main { padding: var(--e-32) 0 var(--e-96); }
.cab-pagina { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--e-16); flex-wrap: wrap; margin-bottom: var(--e-24); }
.cab-pagina h1 { font-size: clamp(1.5rem, 1.2rem + 1.4vw, var(--t-31)); }
.cab-pagina__sub { color: var(--cinza); font-size: var(--t-14); margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; }
.cab-pagina__acoes { display: flex; gap: var(--e-8); flex-wrap: wrap; }
.migalha { font-size: var(--t-14); margin-bottom: var(--e-8); }
.migalha a { color: var(--cinza); text-decoration: none; display: inline-flex; gap: 6px; align-items: center; }
.migalha a:hover { color: var(--tinta); }
.migalha svg { width: 16px; }

.etiqueta { display: inline-flex; align-items: center; gap: 6px; font: 600 var(--t-12)/1 var(--texto); padding: 6px 10px; border-radius: var(--raio-pill); white-space: nowrap; }
.etiqueta::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.etiqueta--aberto { background: var(--verde-fundo); color: var(--verde-escuro); }
.etiqueta--fechado { background: #eef1f5; color: var(--tinta-2); }
.etiqueta--sorteado { background: var(--azul-fundo); color: var(--azul-escuro); }
.etiqueta--aguarda { background: #eef1f5; color: var(--cinza); }
.etiqueta--anulado { background: var(--vermelho-fundo); color: var(--vermelho-escuro); }

/* KPIs */
.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e-16); margin-bottom: var(--e-32); }
@media (max-width: 900px) { .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.kpi { background: var(--branco); border: 1px solid var(--linha); border-radius: var(--raio); padding: var(--e-16) var(--e-24); position: relative; overflow: hidden; }
.kpi__rot { font-size: var(--t-14); color: var(--cinza); }
.kpi__val { font: 700 var(--t-31)/1.1 var(--display); font-variant-numeric: tabular-nums; margin-top: 4px; }
.kpi::after { content: ""; position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--grad); transform-origin: left; }
@media (prefers-reduced-motion: no-preference) { .kpi::after { animation: risca-x 1s var(--motion-ease-out) .2s both; } }
@keyframes risca-x { from { transform: scaleX(0); } }

/* Caixas */
.caixa { background: var(--branco); border: 1px solid var(--linha); border-radius: var(--raio); padding: var(--e-24); scroll-margin-top: 80px; }
.caixa + .caixa { margin-top: var(--e-24); }
.caixa__cab { display: flex; align-items: center; justify-content: space-between; gap: var(--e-12); flex-wrap: wrap; margin-bottom: var(--e-16); }
.caixa__cab h2 { font-size: var(--t-20); }
.caixa__cab p { color: var(--cinza); font-size: var(--t-14); }
.caixa--perigo { border-color: #f6c7b1; }
.caixa--perigo h2 { color: var(--vermelho-escuro); }

.layout-ev { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: var(--e-24); align-items: start; }
@media (max-width: 1080px) { .layout-ev { grid-template-columns: minmax(0, 1fr); } }
.lateral { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--e-24); position: sticky; top: 84px; min-width: 0; }
.link-insc__url input { min-width: 0; }
input[type=file] { width: 100%; }
@media (max-width: 1080px) { .lateral { position: static; } }

/* lista de eventos do hub */
.ev-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: var(--e-16); }
.ev-item { background: var(--branco); border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; display: flex; flex-direction: column; transition: transform var(--motion-dur-2) var(--motion-ease-out), box-shadow var(--motion-dur-2); }
.ev-item:hover { transform: translateY(-3px); box-shadow: 0 16px 36px -22px rgb(15 23 42 / .35); }
.ev-item__faixa { height: 5px; background: var(--c); }
.ev-item__corpo { padding: var(--e-16) var(--e-24) var(--e-24); display: grid; gap: var(--e-12); }
.ev-item__tit { display: flex; justify-content: space-between; gap: var(--e-12); align-items: flex-start; }
.ev-item h2 { font-size: var(--t-20); }
.ev-item h2 a { color: inherit; text-decoration: none; }
.ev-item h2 a::after { content: ""; position: absolute; inset: 0; }
.ev-item { position: relative; }
.ev-item__org { font-size: var(--t-14); color: var(--cinza); }
.ev-item__nums { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--e-8); border-top: 1px solid var(--linha); padding-top: var(--e-12); }
.ev-item__nums dt { font-size: var(--t-12); color: var(--cinza); }
.ev-item__nums dd { font: 700 var(--t-20)/1.2 var(--display); font-variant-numeric: tabular-nums; }
.ev-item__acoes { display: flex; gap: var(--e-8); position: relative; z-index: 1; flex-wrap: wrap; }

/* Tabela */
.tabela-rola { overflow-x: auto; border: 1px solid var(--linha); border-radius: var(--raio-sm); }
.tabela { width: 100%; border-collapse: collapse; font-size: var(--t-14); }
.tabela th { text-align: left; font: 600 var(--t-12)/1.2 var(--texto); color: var(--cinza); background: #f8fafc; padding: 10px 14px; border-bottom: 1px solid var(--linha); position: sticky; top: 0; white-space: nowrap; }
.tabela td { padding: 10px 14px; border-bottom: 1px solid var(--linha); vertical-align: middle; height: 52px; }
.tabela tr:last-child td { border-bottom: 0; }
.tabela tbody tr { transition: background-color var(--motion-dur-1); }
.tabela tbody tr:hover { background: #f8fafc; }
.tabela .dir { text-align: right; }
.tabela .acoes-linha { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: nowrap; }
.tabela .acoes-linha form { margin: 0; }
.chip-num { font: 700 var(--t-14)/1 var(--display); font-variant-numeric: tabular-nums; background: var(--navy); color: #fff; padding: 6px 10px; border-radius: 8px; display: inline-block; }
.mono { font-variant-numeric: tabular-nums; color: var(--tinta-2); white-space: nowrap; }
.premio-mini { width: 44px; height: 44px; border-radius: 8px; object-fit: cover; background: var(--papel); border: 1px solid var(--linha); display: grid; place-items: center; }
.premio-mini svg { width: 20px; color: var(--cinza); }
.ganhador-linha { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
@media (max-width: 640px) {
  .tabela--cartoes thead { display: none; }
  .tabela--cartoes, .tabela--cartoes tbody, .tabela--cartoes tr, .tabela--cartoes td { display: block; width: 100%; }
  .tabela--cartoes tr { padding: var(--e-12) var(--e-16); border-bottom: 1px solid var(--linha); }
  .tabela--cartoes td { border: 0; padding: 4px 0; height: auto; }
  .tabela--cartoes td[data-rot]::before { content: attr(data-rot); display: block; font-size: var(--t-12); color: var(--cinza); }
  .tabela--cartoes .acoes-linha { justify-content: flex-start; margin-top: 6px; }
}

.busca { display: flex; gap: var(--e-8); margin-bottom: var(--e-16); }
.busca .entrada { flex: 1; }
.paginacao { display: flex; justify-content: space-between; align-items: center; gap: var(--e-12); margin-top: var(--e-16); font-size: var(--t-14); color: var(--cinza); flex-wrap: wrap; }
.paginacao__btns { display: flex; gap: var(--e-8); }

/* link de inscrição + QR */
.link-insc { display: grid; gap: var(--e-12); }
.link-insc__qr { background: #fff; border: 1px solid var(--linha); border-radius: var(--raio-sm); padding: 10px; width: 168px; margin-inline: auto; }
.link-insc__qr svg { width: 100%; height: auto; }
.link-insc__url { display: flex; gap: 6px; }
.link-insc__url input { font-size: var(--t-14); min-height: 40px; }
.copiado { color: var(--verde-escuro); font-size: var(--t-12); min-height: 1.2em; }

/* diálogo */
dialog.dialogo { border: 0; border-radius: calc(var(--raio) + 4px); padding: 0; width: min(520px, calc(100% - 32px)); box-shadow: 0 40px 80px -30px rgb(0 0 0 / .5); color: var(--tinta); }
dialog.dialogo::backdrop { background: rgb(11 18 32 / .6); backdrop-filter: blur(3px); }
.dialogo__cab { display: flex; justify-content: space-between; align-items: center; padding: var(--e-24) var(--e-24) 0; }
.dialogo__cab h2 { font-size: var(--t-20); }
.dialogo__corpo { padding: var(--e-16) var(--e-24) var(--e-24); }
.dialogo__pe { display: flex; justify-content: flex-end; gap: var(--e-8); margin-top: var(--e-8); }
.fechar-x { background: none; border: 0; width: 40px; height: 40px; border-radius: 50%; cursor: pointer; color: var(--cinza); display: grid; place-items: center; }
.fechar-x:hover { background: var(--papel); color: var(--tinta); }
.fechar-x svg { width: 20px; }
@media (prefers-reduced-motion: no-preference) {
  dialog.dialogo[open] { animation: dialogo-entra var(--motion-dur-3) var(--motion-ease-out); }
  dialog.dialogo[open]::backdrop { animation: fundo-entra var(--motion-dur-2) ease-out; }
}
@keyframes dialogo-entra { from { opacity: 0; transform: translateY(18px) scale(.97); } }
@keyframes fundo-entra { from { opacity: 0; } }

details.mais > summary { cursor: pointer; font: 600 var(--t-14)/1 var(--display); color: var(--azul-escuro); list-style: none; display: inline-flex; gap: 6px; align-items: center; padding: 8px 0; }
details.mais > summary::-webkit-details-marker { display: none; }
details.mais > summary svg { width: 16px; transition: transform var(--motion-dur-2) var(--motion-ease-out); }
details.mais[open] > summary svg { transform: rotate(90deg); }

.previa-img { display: flex; gap: var(--e-12); align-items: center; margin-top: 6px; font-size: var(--t-14); color: var(--cinza); }
.previa-img img { width: 64px; height: 40px; object-fit: cover; border-radius: 6px; border: 1px solid var(--linha); background: #fff; }
.previa-img img.contem { object-fit: contain; }

.ata-lista { display: grid; gap: var(--e-8); font-size: var(--t-14); }
.ata-lista li { display: grid; grid-template-columns: auto 1fr; gap: 2px var(--e-12); padding: var(--e-8) 0; border-bottom: 1px solid var(--linha); }
.ata-lista li:last-child { border-bottom: 0; }
.ata-lista .quando { color: var(--cinza); font-size: var(--t-12); grid-column: 2; }
.ata-lista .anulada { text-decoration: line-through; color: var(--cinza); }

/* ---------------------------------------------------------------- login (padrão split-screen) */
.login { display: grid; grid-template-columns: 55fr 45fr; min-height: 100vh; min-height: 100dvh; }
@media (max-width: 1023px) { .login { grid-template-columns: 1fr; } .login__marca { display: none !important; } }
.login__marca { position: relative; overflow: hidden; background: radial-gradient(900px 500px at 10% 0%, #16335a, transparent 60%), linear-gradient(160deg, #0b1220, #111d33 60%, #0b1220); color: #fff; padding: var(--e-48) var(--e-64); display: flex; flex-direction: column; justify-content: space-between; }
.login__marca::before { content: ""; position: absolute; right: -180px; bottom: -180px; width: 560px; height: 560px; border-radius: 50%; border: 1px solid rgb(255 255 255 / .06); box-shadow: 0 0 0 70px rgb(255 255 255 / .02), 0 0 0 140px rgb(255 255 255 / .015); }
.login__topo { display: flex; align-items: center; gap: var(--e-12); }
.login__topo .logo__svg { width: 120px; }
.login__topo span { font: 600 var(--t-12)/1.2 var(--texto); letter-spacing: .1em; text-transform: uppercase; color: var(--texto-escuro); border-left: 1px solid var(--linha-escura); padding-left: var(--e-12); }
.login__headline { font: 700 clamp(2.2rem, 1.4rem + 2.4vw, 3.4rem)/1.08 var(--display); letter-spacing: -0.03em; color: #fff; max-width: 14ch; }
.login__linha { width: 72px; height: 4px; border-radius: 4px; background: var(--grad); margin: var(--e-24) 0; }
.login__apoio { color: var(--texto-escuro); max-width: 44ch; font-size: var(--t-16); }
.login__bullets { display: grid; gap: var(--e-12); margin-top: var(--e-32); }
.login__bullets li { display: flex; gap: var(--e-12); align-items: center; color: #e2e8f0; font-size: var(--t-14); }
.login__chip { width: 36px; height: 36px; border-radius: 50%; background: rgb(255 255 255 / .07); border: 1px solid rgb(255 255 255 / .1); display: grid; place-items: center; color: var(--menta); flex: none; }
.login__chip svg { width: 18px; }
.login__rodape-marca { font-size: var(--t-12); color: var(--texto-escuro-2); }
.login__form { display: grid; place-items: center; padding: var(--e-48) var(--e-24); background: #fff; }
.login__caixa { width: min(100%, 390px); }
.login__caixa h1 { font-size: var(--t-31); }
.login__caixa .sub { color: var(--cinza); margin: var(--e-8) 0 var(--e-32); }
.login__mobile-logo { display: none; margin-bottom: var(--e-32); color: var(--navy); }
.login__mobile-logo .logo__svg { width: 110px; }
@media (max-width: 1023px) { .login__mobile-logo { display: block; } }
.olho { position: absolute; right: 6px; top: 50%; translate: 0 -50%; width: 40px; height: 40px; border: 0; background: none; border-radius: 8px; cursor: pointer; color: var(--cinza); display: grid; place-items: center; }
.olho:hover { color: var(--tinta); background: var(--papel); }
.olho svg { width: 20px; }
.entrada--senha input { padding-right: 52px; }
.login__pe { margin-top: var(--e-32); font-size: var(--t-12); color: var(--cinza); text-align: center; }
.login__pe a { color: var(--cinza); }
:root { --lm-cor: rgba(99, 174, 230, .32); --lm-cor-2: rgba(126, 213, 151, .22); }

/* formulário de prêmio */
.grade-premio { display: grid; grid-template-columns: minmax(0, 1fr) 90px auto; gap: var(--e-12); align-items: end; margin-bottom: var(--e-16); padding: var(--e-16); background: var(--papel); border-radius: var(--raio-sm); }
.grade-premio .campo { margin: 0; }
.grade-premio__foto { grid-column: 1 / -1; }
@media (max-width: 560px) {
  .grade-premio { grid-template-columns: minmax(0, 1fr) 80px; }
  .grade-premio__nome { grid-column: 1 / -1; }
  .grade-premio > .btn { grid-column: 1 / -1; order: 9; }
}

/* formulário de inscrição configurável */
.campos-modo { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: var(--e-8) var(--e-12); align-items: center; margin-bottom: var(--e-16); }
.campos-modo label { font: 600 var(--t-14)/1.3 var(--texto); color: var(--tinta-2); }
.campos-modo select { min-height: 40px; padding: 6px 10px; font-size: var(--t-14); }
.zerar { margin-top: var(--e-16); border-top: 1px solid var(--linha); padding-top: var(--e-8); }
.zerar form { display: grid; gap: var(--e-12); justify-items: start; padding: var(--e-8) 0; }
