/* /events/cacaniqueis/cacaniqueis.css -- tela do Caça-níqueis Louco (mockup aprovado em 30/09/2026:
   docs/mockups/eventos/caca-niqueis-sorte.html). Todo bloco animado (regra 11): o grande com o cenário da barraca
   do festival, os menores com filete e cortes na cor do assunto. Sem rótulo de cenário (dono, 30/09). */
.cn{--cn-ouro:var(--gold,#e3b341);--cn-ouro-wash:rgba(227,179,65,.1);--cn-ouro-line:rgba(227,179,65,.4);--cn-ok:var(--green,#43c79b);
  --cn-roxo:#b04dff;--cn-acc:var(--cyan,#4fd1e0);--cn-line:var(--border,#29313d);--cn-line-hi:var(--border-strong,#303844);
  display:grid;gap:16px;margin-top:14px}
.cn-card{position:relative;border:1px solid var(--cn-line);border-radius:14px;background:var(--s-850,#0f131c);padding:18px;display:grid;gap:14px;align-content:start;min-width:0}
.cn-card h3{margin:0;font:800 18px var(--display);display:flex;align-items:center;gap:10px;flex-wrap:wrap;text-wrap:balance}
.cn-rot{font:600 15px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--t-low)}
.cn-nota{margin:0;color:var(--t-low);font-size:15px;line-height:1.5}

/* chip de risco */
.cn-chip{display:inline-flex;align-items:center;gap:6px;font:700 15px var(--mono);letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:3px 10px;border:1px solid;width:max-content}
.cn-chip i{width:7px;height:7px;border-radius:50%;background:currentColor}
.cn-sorte-alta{color:#ff9a6a;border-color:rgba(240,115,106,.5);background:rgba(240,115,106,.1)}
.cn-sorte-media{color:var(--cn-ouro,#e3b341);border-color:rgba(227,179,65,.4);background:rgba(227,179,65,.1)}
.cn-garantido{color:var(--cn-ok,#43c79b);border-color:rgba(67,199,155,.45);background:rgba(67,199,155,.1)}
.event-section-head .cn-chip{margin-top:8px}

/* gasto */
.cn-gasto{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:end}
.cn-campo{display:grid;gap:8px;min-width:0}
.cn-campo .quick-set{margin:0}
.cn-campo .quick-set button.active{background:var(--cn-acc);color:#062a33;border-color:var(--cn-acc)}
.cn-tiros{font:600 15px var(--mono);color:var(--t-mid);text-align:right;white-space:nowrap;display:grid}
.cn-tiros b{font:800 22px var(--display);color:var(--t-hi);font-variant-numeric:tabular-nums}

/* o que costuma vir (bloco grande com cenário) */
.cn-cena{overflow:hidden;isolation:isolate}
.cn-cena::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--faixa);z-index:1}
.cn-cena::after{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(90deg,rgba(15,19,28,.97) 0%,rgba(15,19,28,.9) 45%,rgba(15,19,28,.45) 75%,rgba(15,19,28,.2) 100%)}
.cn-fundo{position:absolute;inset:0 0 auto 0;height:340px;max-height:100%;z-index:-3;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent);mask-image:linear-gradient(180deg,#000 55%,transparent)}
.cn-fundo svg{width:100%;height:100%;display:block}
.cn-normal{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center}
.cn-normal-num{display:grid;gap:2px}
.cn-v{font:900 44px/1 var(--display);color:var(--cn-ouro);font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:10px}
.cn-normal-num .vo-linha{color:var(--t-mid)}
.cn-s{font-size:15px;color:var(--t-mid);font-variant-numeric:tabular-nums}
.cn-veredito{margin:0;border-left:3px solid var(--cn-ouro);padding:4px 0 4px 14px;font-size:15px;color:var(--t-mid)}
.cn-veredito b{color:var(--t-hi)}
.cn-faixa{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.cn-pessoa{border:1px solid var(--cn-line);border-radius:12px;background:rgba(12,15,22,.92);padding:12px 14px;display:grid;gap:2px}
.cn-pessoa .k{font:600 15px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--t-low)}
.cn-pessoa .v{font:800 22px var(--display);font-variant-numeric:tabular-nums}
.cn-pessoa .s{font-size:15px;color:var(--t-low);font-variant-numeric:tabular-nums}
.cn-pessoa.cn-meio{border-color:var(--cn-ouro-line);background:linear-gradient(180deg,var(--cn-ouro-wash),transparent 70%),rgba(12,15,22,.92)}
.cn-pessoa.cn-meio .v{color:var(--cn-ouro)}
.cn-grafico{border:1px solid var(--cn-line);border-radius:12px;background:rgba(12,15,22,.92);padding:12px 12px 6px}
.cn-grafico svg{display:block;width:100%;height:auto}
.cn-grafico .cn-nota{padding:0 4px 6px}
.cn-h-curva{fill:var(--cn-line-hi);opacity:.55}
.cn-h-faixa{fill:var(--cn-ouro);opacity:.85}
.cn-h-eixo{stroke:var(--cn-line)}
.cn-h-gasto{stroke:var(--cn-acc)} .cn-h-gasto-t{fill:var(--cn-acc)}
.cn-h-normal{stroke:var(--cn-ouro)} .cn-h-normal-t{fill:var(--cn-ouro)}
.cn-h-tick{fill:var(--t-low)}
.cn-leg{display:flex;gap:14px;flex-wrap:wrap;font-size:15px;color:var(--t-low);padding:4px 4px 6px}
.cn-leg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.cn-l-curva{background:var(--cn-line-hi)} .cn-l-faixa{background:var(--cn-ouro)} .cn-l-gasto{background:var(--cn-acc)}

/* vem quase sempre + bilhete de loteria */
.cn-dupla{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:16px;align-items:start}
.cn-sub{overflow:hidden;isolation:isolate;border-color:color-mix(in srgb,var(--sub) 38%,var(--cn-line))}
.cn-sub::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(180deg,var(--sub),var(--sub2))}
.cn-lin{display:grid;grid-template-columns:30px minmax(0,1fr) 78px 80px;gap:10px;align-items:center;padding:7px 4px;border-top:1px solid var(--cn-line);font-variant-numeric:tabular-nums}
.cn-lin:first-child{border-top:0}
.cn-lin img{width:30px;height:30px;object-fit:contain}
.cn-lin .n{font-weight:600;font-size:15px;min-width:0;overflow-wrap:anywhere}
.cn-lin .q{text-align:right;color:var(--t-mid);font-size:15px}
.cn-lin .pf{text-align:right;font:700 15px var(--mono)}
.cn-lin-cab{border-top:0;padding-top:0}
.cn-lin-cab span{font:600 15px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--t-low)}
.cn-lin-cab span:nth-child(3),.cn-lin-cab span:nth-child(4){text-align:right}
.cn-soma{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--cn-line-hi);padding-top:10px;font-weight:700}
.cn-soma b{font:800 18px var(--display);font-variant-numeric:tabular-nums}
.cn-bilhete{background:linear-gradient(160deg,rgba(176,77,255,.08),transparent 55%),var(--s-850,#0f131c)}
.cn-premio{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:6px 12px;align-items:center;padding:10px 0;border-top:1px solid var(--cn-line)}
.cn-premio:first-child{border-top:0}
.cn-premio img{width:40px;height:40px}
.cn-premio .n{font-weight:700;font-size:15px;min-width:0}
.cn-premio .n small{display:block;font-weight:500;color:var(--t-low);font-size:15px;font-variant-numeric:tabular-nums}
.cn-chance{text-align:right;font-variant-numeric:tabular-nums}
.cn-chance b{display:block;font:800 22px var(--display)}
.cn-chance small{font-size:15px;color:var(--t-low)}
.cn-barra-ch{grid-column:2 / -1;height:6px;border-radius:999px;background:var(--s-800,#141a25);overflow:hidden}
.cn-barra-ch i{display:block;height:100%;background:linear-gradient(90deg,var(--cn-roxo),#e08aff);border-radius:inherit}
.cn-metade{grid-column:2 / -1;font-size:15px;color:var(--t-mid)}
.cn-metade b{color:var(--t-hi);font-variant-numeric:tabular-nums}

/* cortes (raio X) e o que se mexe no cenário */
.cn-cortes{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:-1}
.cn-cortes i{position:absolute;height:2px;right:-10%;transform:rotate(-24deg);opacity:.55;
  background:linear-gradient(90deg,transparent,var(--sub,var(--faixa,#e3b341)) 35%,#fff 50%,var(--sub,var(--faixa,#e3b341)) 65%,transparent);box-shadow:0 0 10px var(--sub,var(--faixa,#e3b341))}
.cn-cortes i:nth-child(1){width:65%;top:14%}
.cn-cortes i:nth-child(2){width:40%;top:28%;right:20%;opacity:.3}
.cn-cortes i::after{content:"";position:absolute;inset:-3px 0;width:30%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.95),transparent);transform:translateX(-120%);animation:cnCorte 3.2s ease-in-out infinite}
.cn-cortes i:nth-child(2)::after{animation-delay:.8s}
@keyframes cnCorte{0%,45%{transform:translateX(-120%);opacity:0}55%{opacity:1}85%,100%{transform:translateX(420%);opacity:0}}
.cn-lanterna{animation:cnBalanca 3.6s ease-in-out infinite alternate}
@keyframes cnBalanca{from{transform:rotate(-6deg)}to{transform:rotate(6deg)}}
.cn-confete{animation:cnCai 6s linear infinite;transform-box:fill-box}
@keyframes cnCai{0%{transform:translate(0,0) rotate(0);opacity:0}8%{opacity:.9}100%{transform:translate(-120px,330px) rotate(300deg);opacity:0}}
.cn-pisca{animation:cnPisca 3s ease-in-out infinite}
@keyframes cnPisca{0%,100%{opacity:.3}50%{opacity:1}}
.cn-rolo text{animation:cnRola 2.4s ease-in-out infinite}
@keyframes cnRola{0%,70%,100%{opacity:1}80%{opacity:.2}}
@media (prefers-reduced-motion:reduce){.cn-lanterna,.cn-confete,.cn-pisca,.cn-rolo text,.cn-cortes i::after{animation:none}.cn-confete{opacity:0}}

@media (max-width:860px){.cn-dupla{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){.cn-cena::after{background:linear-gradient(180deg,rgba(15,19,28,.55) 0%,rgba(15,19,28,.92) 38%,rgba(15,19,28,.97) 100%)}.cn-fundo{opacity:.8}}
@media (max-width:560px){
  .cn-gasto{grid-template-columns:minmax(0,1fr)}.cn-tiros{text-align:left}
  .cn-normal{grid-template-columns:minmax(0,1fr)}
  .cn-v{font-size:36px}
  .cn-faixa{grid-template-columns:minmax(0,1fr)}
  .cn-lin{grid-template-columns:28px minmax(0,1fr) 64px 70px;gap:8px}
}