.ah-bau, .ah-achado { position: relative; --c: #fff; --c-luz: #fff; --c-raio: rgba(255, 255, 255, .13); }

.n-comum, [data-nivel="comum"] { --c: #bdbdbd; --c-luz: #ffffff; --c-raio: rgba(255, 255, 255, .12); }
.n-incomum, [data-nivel="incomum"] { --c: var(--novo, #3ecf7a); --c-luz: #a6ecc3; --c-raio: rgba(62, 207, 122, .16); }

.ah-achado .nf-raro.r-comum { color: #d6d3d1; background: rgba(255, 255, 255, .08); }
.ah-achado .nf-raro.r-incomum { color: #3ecf7a; background: rgba(62, 207, 122, .12); }
.n-raro, [data-nivel="raro"] { --c: var(--info); --c-luz: #a9cfff; --c-raio: rgba(77, 159, 255, .2); }
.n-lendario, [data-nivel="lendario"] { --c: var(--laranja-lendario, #ff8a20); --c-luz: #ffc880; --c-raio: rgba(255, 138, 32, .22); }
.n-mitico, [data-nivel="mitico"] { --c: var(--out-mitico, hsl(8 88% 44%)); --c-luz: var(--out-anel, hsl(8 88% 66%)); --c-raio: rgba(228, 38, 38, .24); }










.ah-achado .ah-semente { border-color: var(--info); }
.ah-achado .ah-semente { box-shadow: 0 0 0 1px color-mix(in srgb, var(--info) 18%, transparent); }
.ah-achado .ah-pai .nf-raro { cursor: default; }
.ah-achado .ah-pai-txt, .ah-achado .ah-pai-txt b { color: var(--info); }
.ah-achado .ah-ramo::before, .ah-achado .ah-ramo > .nf-card::before { border-color: var(--info) !important; background-color: var(--info); }




.ah-achado .ah-ramo > .nf-card::after { background-color: color-mix(in srgb, var(--info) 45%, transparent) !important; }
.ah-achado .ah-pai .nf-raro.r-incomum { color: var(--info); background: rgba(77, 159, 255, .10); }




#ah-lista .ah-linhagem .ah-semente { border-color: var(--info); box-shadow: 0 0 0 1px color-mix(in srgb, var(--info) 18%, transparent); }
#ah-lista .ah-linhagem .ah-pai-txt, #ah-lista .ah-linhagem .ah-pai-txt b { color: var(--info); }
#ah-lista .ah-linhagem .ah-pai-n { color: var(--info); border-color: color-mix(in srgb, var(--info) 40%, transparent); }
#ah-lista .ah-linhagem .ah-pai-n b { color: var(--info); }
#ah-lista .ah-linhagem .ah-ramo > .nf-card.recem:not(.sel-on):not(.raro-raro):not(.raro-epico):not(.raro-lendario) {
  border-color: color-mix(in srgb, var(--info) 58%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--info) 12%, transparent),
              0 0 20px -6px color-mix(in srgb, var(--info) 42%, transparent);
}
#ah-lista .ah-linhagem .ah-ramo > .nf-card.recem:not(.sel-on):not(.raro-raro):not(.raro-epico):not(.raro-lendario):hover { border-color: var(--info); }
#ah-lista .nf-aba-novo { background: var(--info); box-shadow: 0 0 14px -2px color-mix(in srgb, var(--info) 55%, transparent); }
#ah-lista .ah-linhagem .ah-ramo > .nf-card::before { background-color: var(--info) !important; border-color: var(--info) !important; }
#ah-lista .ah-linhagem .ah-ramo > .nf-card::after { background-color: color-mix(in srgb, var(--info) 45%, transparent) !important; }




.ah-luz { position: absolute; left: 22px; top: -150px; height: 182px; width: 96px; margin-left: -48px; pointer-events: none; z-index: 3; transform-origin: 50% 0; transform: scaleY(0); opacity: 0; will-change: transform, opacity; }
.ah-luz::before { content: ""; position: absolute; inset: 0 18px; border-radius: 30px; filter: blur(10px); background: linear-gradient(0deg, var(--c) 0%, color-mix(in srgb, var(--c) 55%, transparent) 40%, transparent 100%); }
.ah-luz::after { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 4px; transform: translateX(-50%); border-radius: 2px; filter: blur(1px); background: linear-gradient(0deg, #fff, rgba(255, 255, 255, 0)); }

.ah-luz.cai { animation: ahErgue .26s cubic-bezier(.5, 0, .9, .6) forwards, ahEstreita .7s 1.1s ease-in forwards; }
.ah-luz.fino { width: 40px; margin-left: -20px; }
.ah-luz.fino::before { inset: 0 12px; filter: blur(6px); opacity: .6; }
.ah-luz.fino.cai { animation: ahErgue .24s cubic-bezier(.5, 0, .9, .6) forwards, ahEstreita .5s .6s ease-in forwards; }
@keyframes ahErgue { 0% { transform: scaleY(0); opacity: 0; } 30% { opacity: 1; } 100% { transform: scaleY(1); opacity: 1; } }
@keyframes ahEstreita { 0% { transform: scaleY(1) scaleX(1); opacity: 1; } 100% { transform: scaleY(1) scaleX(.05); opacity: 0; } }
.ah-achado .nf-raro.carimbo { animation: ahCarimbo .32s cubic-bezier(.2, 1.4, .4, 1) both; }
@keyframes ahCarimbo { from { opacity: 0; transform: scale(1.8); } to { opacity: 1; transform: none; } }





.ah-bau-tile { width: 100%; display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 16px 18px; border-radius: 13px; border: 2px solid rgba(255, 255, 255, .28); background: var(--bg-2); color: var(--txt); font: inherit; text-align: left; cursor: pointer; }
.ah-bau-tile:hover .ah-bau-mini, .ah-bau-tile:focus-visible .ah-bau-mini { animation: ahTreme .32s ease-in-out infinite; }
.ah-bau-tile:focus-visible { outline: 2px solid var(--txt); outline-offset: 3px; }
@keyframes ahBauRespira { 0%, 100% { opacity: 0; } 50% { opacity: 1; } }
.ah-bau-tile { position: relative; }
.ah-bau-tile::after { content: ""; position: absolute; inset: -2px; border-radius: 14px; pointer-events: none; box-shadow: 0 0 22px rgba(255, 255, 255, .1); opacity: 0; animation: ahBauRespira 2.6s ease-in-out infinite; will-change: opacity; }
.ah-bau-mini { position: relative; width: 64px; height: 50px; justify-self: center; }
.ah-bau-mini i { position: absolute; left: 0; right: 0; border: 2px solid rgba(255, 255, 255, .7); }
.ah-bau-mini i:first-child { top: 0; height: 20px; left: -2px; right: -2px; border-radius: 10px 10px 3px 3px; background: linear-gradient(180deg, #3a3534, #221f1e); }
.ah-bau-mini i:last-child { bottom: 0; height: 32px; border-radius: 4px; background: linear-gradient(180deg, #2f2b2a, #1b1918); }
.ah-bau-tx { display: grid; gap: 2px; min-width: 0; }
.ah-bau-tx b { font-size: 18px; font-weight: 800; }
.ah-bau-tx small { font-size: 12.5px; color: var(--txt-3); }


.ah-palco { position: relative; min-height: calc(272px + var(--rolos-h, 24px)); padding-bottom: 0; border-radius: 13px; overflow: hidden; border: 2px solid var(--c); background: radial-gradient(ellipse 60% 60% at 50% 42%, color-mix(in srgb, var(--c) 22%, transparent), var(--bg) 72%); cursor: default; transition: border-color .4s; }
.ah-palco::before { content: ""; position: absolute; inset: 0; background: #fff; opacity: 0; pointer-events: none; z-index: 6; }
.ah-palco.clarao::before { animation: ahClarao .22s ease-out; }
.ah-palco.clarao-cor::before { background: var(--c-luz); animation: ahClarao .3s ease-out; }
@keyframes ahClarao { from { opacity: .85; } to { opacity: 0; } }
.ah-palco.sacode { animation: ahSacode .25s linear; }
@keyframes ahSacode { 0%, 100% { transform: none; } 20% { transform: translate(-4px, 2px); } 40% { transform: translate(4px, -2px); } 60% { transform: translate(-3px, -1px); } 80% { transform: translate(2px, 2px); } }
.ah-palco .raios { position: absolute; left: 50%; top: 140px; width: 900px; height: 900px; margin: -450px 0 0 -450px; border-radius: 50%; opacity: 0; transition: opacity .15s; background: repeating-conic-gradient(var(--c-raio) 0 9deg, transparent 9deg 22deg); -webkit-mask: radial-gradient(closest-side, #000 16%, transparent 100%); mask: radial-gradient(closest-side, #000 16%, transparent 100%); animation: ahGira 10s linear infinite;  will-change: transform;}
.ah-palco.aberto .raios { opacity: 1; }
@keyframes ahGira { to { transform: rotate(360deg); } }






.ah-palco .raios2 { position: absolute; left: 50%; top: 140px; width: 900px; height: 900px; margin: -450px 0 0 -450px; border-radius: 50%; opacity: 0; transition: opacity .15s; background: repeating-conic-gradient(var(--c-raio) 0 3deg, transparent 3deg 11deg); -webkit-mask: radial-gradient(closest-side, #000 10%, transparent 90%); mask: radial-gradient(closest-side, #000 10%, transparent 90%); animation: ahGira 16s linear infinite reverse;  will-change: transform;}
.ah-palco.aberto[data-nivel="lendario"] .raios2, .ah-palco.aberto[data-nivel="mitico"] .raios2 { opacity: 1; }









.ah-palco .faixas { position: absolute; left: 50%; top: 186px; width: 0; height: 0; pointer-events: none; animation: ahFaixasBalanca 4s ease-in-out infinite; }
.ah-palco .faixas i { position: absolute; left: -14px; bottom: 0; width: 28px; height: 460px; transform-origin: 50% 100%; transform: rotate(var(--a)) scaleY(0); opacity: 0; clip-path: polygon(42% 100%, 58% 100%, 100% 0, 0 0); background: linear-gradient(0deg, #fff 0, var(--c-luz) 18%, color-mix(in srgb, var(--c) 60%, transparent) 55%, transparent 100%); will-change: transform, opacity; }
.ah-palco.aberto[data-nivel="lendario"] .faixas i:nth-child(odd),
.ah-palco.aberto[data-nivel="mitico"] .faixas i:nth-child(odd) { animation: ahFaixaL .16s cubic-bezier(.2, .9, .2, 1) var(--d) forwards, ahFaixaPisca 1.4s ease-in-out calc(var(--d) + .16s) infinite; }
.ah-palco.aberto[data-nivel="mitico"] .faixas i:nth-child(even) { animation: ahFaixaM .14s cubic-bezier(.2, .9, .2, 1) var(--d) forwards, ahFaixaPiscaM .7s ease-in-out calc(var(--d) + .14s) infinite; }   
.ah-palco[data-nivel="mitico"] .faixas i { left: -20px; width: 40px; }   
@keyframes ahFaixaL { from { transform: rotate(var(--a)) scaleY(0); opacity: 0; } to { transform: rotate(var(--a)) scaleY(1); opacity: .85; } }
@keyframes ahFaixaM { from { transform: rotate(var(--a)) scaleY(0); opacity: 0; } to { transform: rotate(var(--a)) scaleY(1.15); opacity: .95; } }
@keyframes ahFaixaPisca { 0%, 100% { transform: rotate(var(--a)) scaleY(1); opacity: .85; } 50% { transform: rotate(var(--a)) scaleY(.88); opacity: .45; } }
@keyframes ahFaixaPiscaM { 0%, 100% { transform: rotate(var(--a)) scaleY(1.15); opacity: .95; } 50% { transform: rotate(var(--a)) scaleY(.95); opacity: .5; } }
@keyframes ahFaixasBalanca { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(6deg); } }
.ah-palco .ondas i { position: absolute; left: 50%; top: 200px; width: 140px; height: 140px; margin: -70px 0 0 -70px; border-radius: 50%; border: 2px solid var(--c); opacity: 0; pointer-events: none; }
.ah-palco.aberto[data-nivel="mitico"] .ondas i { animation: ahOnda 1.8s ease-out infinite; }
.ah-palco.aberto[data-nivel="mitico"] .ondas i:nth-child(2) { animation-delay: .6s; }
.ah-palco.aberto[data-nivel="mitico"] .ondas i:nth-child(3) { animation-delay: 1.2s; }
@keyframes ahOnda { 0% { transform: scale(.4); opacity: .85; } 100% { transform: scale(4.6); opacity: 0; } }
.ah-palco::after { content: ""; position: absolute; inset: 0; pointer-events: none; box-shadow: inset 0 0 90px var(--c); opacity: 0; transition: opacity .4s; }
.ah-palco.aberto[data-nivel="mitico"]::after { animation: ahPulsa 1.2s ease-in-out infinite; }
@keyframes ahPulsa { 0%, 100% { opacity: .18; } 50% { opacity: .6; } }


.ah-palco .coluna { position: absolute; left: 50%; top: 0; width: 120px; margin-left: -60px; height: 170px; transform: scaleY(0); transform-origin: 50% 100%; filter: blur(3px); border-radius: 60px 60px 0 0; background: linear-gradient(0deg, #fff 0, color-mix(in srgb, var(--c) 85%, transparent) 22%, transparent 100%);  will-change: transform;}
.ah-palco.aberto .coluna { transform: scaleY(1); transition: transform .3s cubic-bezier(.2, .9, .2, 1); }
.ah-palco .bau { position: absolute; left: 50%; top: 152px; width: 120px; height: 88px; margin-left: -60px; transition: opacity .35s, transform .35s; }
.ah-palco .bau .tampa { position: absolute; left: -4px; right: -4px; bottom: 50px; height: 36px; border-radius: 18px 18px 4px 4px; background: linear-gradient(180deg, #3a3534, #221f1e); border: 3px solid rgba(255, 255, 255, .75); transform-origin: 50% 100%; }
.ah-palco .bau .caixa { position: absolute; left: 0; right: 0; bottom: 0; height: 56px; border-radius: 6px; background: linear-gradient(180deg, #2f2b2a, #1b1918); border: 3px solid rgba(255, 255, 255, .75); box-shadow: inset 0 -10px 0 rgba(0, 0, 0, .35); }
.ah-palco.aberto .bau .tampa, .ah-palco.aberto .bau .caixa { border-color: var(--c); transition: border-color .4s; }
.ah-palco .bau.treme { animation: ahTreme .09s linear infinite; }
@keyframes ahTreme { 0% { transform: translate(0, 0) rotate(0); } 25% { transform: translate(-2px, 1px) rotate(-2deg); } 50% { transform: translate(2px, -1px) rotate(1.5deg); } 75% { transform: translate(-1px, -1px) rotate(-1deg); } 100% { transform: none; } }
.ah-palco.aberto .bau .tampa { animation: ahEstoura .45s cubic-bezier(.2, 1.4, .3, 1) forwards; }
@keyframes ahEstoura { to { transform: translate(0, -54px) rotate(-16deg); } }
.ah-palco.fim .bau { opacity: .18; transform: translateY(14px) scale(.9); }
.ah-palco canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }
.ah-palco .contador { position: absolute; left: 0; right: 0; top: 14px; z-index: 4; text-align: center; font-weight: 800; font-size: 48px; line-height: 1; font-variant-numeric: tabular-nums; opacity: 0; transition: opacity .3s; }
.ah-palco .contador small { display: block; margin-top: 4px; font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--txt-2); }
.ah-palco.aberto .contador { opacity: 1; }
.ah-palco .contador.bate { animation: ahBate .16s ease-out; }
.ah-palco .contador.final { animation: ahPunch .34s cubic-bezier(.2, 1.6, .4, 1); }
@keyframes ahBate { from { transform: scale(1.12); } to { transform: none; } }
@keyframes ahPunch { from { transform: scale(1.35); } to { transform: none; } }
.ah-palco .rolos { position: absolute; left: 14px; right: 14px; bottom: 14px; z-index: 3; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 8px; }


.ah-palco .rolos-lado { position: absolute; top: 22px; z-index: 3; width: calc(50% - 314px); display: flex; flex-wrap: wrap; align-content: flex-start; gap: 10px 8px; }
.ah-palco .rolos-lado.esq { left: 14px; justify-content: flex-end; }
.ah-palco .rolos-lado.dir { right: 14px; justify-content: flex-start; }
.ah-palco .rolo { display: grid; justify-items: center; gap: 4px; width: 112px; animation: ahSurge .22s cubic-bezier(.2, 1.4, .4, 1) both; }
@keyframes ahSurge { from { opacity: 0; transform: translateY(10px) scale(.6); } to { opacity: 1; transform: none; } }


.ah-palco .janela { position: relative; width: 108px; height: 61px; border-radius: 8px; overflow: hidden; background: var(--bg-3); border: 2px solid var(--line-2); }
.ah-palco .fita { position: absolute; left: 0; right: 0; top: 0; display: grid; }
.ah-palco .fita span { height: 57px; display: grid; place-items: center; font-size: 13px; font-weight: 800; color: var(--txt-2); background: var(--bg-3) center / cover no-repeat; }
.ah-palco .rolo.roda .fita { animation: ahRoda .2s linear infinite; opacity: .8; will-change: transform; }
@keyframes ahRoda { from { transform: translateY(0); } to { transform: translateY(-228px); } }


.ah-palco .rolo .ah-vo { flex: none; font-size: 9.5px; line-height: 1.3; padding: 0 4px; border-radius: 4px; }
.ah-palco .rolo.suspense .janela { animation: ahTremor .06s linear infinite; }
@keyframes ahTremor { 0%, 100% { transform: none; } 50% { transform: translateY(-1px); } }
.ah-palco .janela img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ah-palco .rolo.parou .janela { border-color: var(--c); box-shadow: 0 0 14px color-mix(in srgb, var(--c) 55%, transparent); animation: ahPara .3s cubic-bezier(.2, 1.6, .4, 1); }
@keyframes ahPara { from { transform: scale(1.25); } to { transform: none; } }
.ah-palco .rolo.parou .janela::after { content: ""; position: absolute; inset: 0; background: #fff; animation: ahFlash .3s ease-out forwards; }
@keyframes ahFlash { from { opacity: .85; } to { opacity: 0; } }
.ah-palco .rolo .rot { max-width: 112px; font-size: 10.5px; color: var(--txt-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: 0; }
.ah-palco .rolo.parou .rot { display: inline-flex; align-items: center; gap: 4px; opacity: 1; color: var(--txt); font-weight: 700; font-variant-numeric: tabular-nums; transition: opacity .2s; }
.ah-palco .rolo.melhor.parou .janela { box-shadow: 0 0 0 3px var(--bg), 0 0 0 5px var(--c), 0 0 22px color-mix(in srgb, var(--c) 60%, transparent); }
.ah-palco .selo-fim { position: absolute; left: 50%; top: 128px; z-index: 5; transform: translate(-50%, -50%); font-size: 30px !important; letter-spacing: .14em !important; padding: 8px 18px !important; border-radius: 7px !important; opacity: 0; pointer-events: none; }
.ah-palco .selo-fim.vem { animation: ahSeloVem .45s cubic-bezier(.2, 1.5, .35, 1) forwards; }
@keyframes ahSeloVem { 0% { opacity: 0; transform: translate(-50%, -50%) scale(2.4) rotate(-8deg); } 100% { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(-4deg); } }
.ah-palco .ver { position: absolute; left: 50%; top: 176px; z-index: 5; transform: translateX(-50%); }
.ah-palco .pular { position: absolute; right: 12px; top: 12px; z-index: 7; height: 30px; padding: 0 14px; border-radius: 15px; border: 1px solid rgba(255, 255, 255, .35); background: rgba(0, 0, 0, .55); color: #fff; font: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; }
.ah-palco .pular:hover, .ah-palco .pular:focus-visible { background: rgba(255, 255, 255, .15); border-color: #fff; }




.ah-palco .ah-mudo { position: absolute; right: 8px; bottom: 6px; z-index: 6; width: 26px; height: 26px; display: grid; place-items: center; padding: 0; border-radius: 6px; border: 0; background: transparent; color: var(--txt-3); opacity: .55; cursor: pointer; transition: opacity .15s, color .15s; }
.ah-palco .ah-mudo:hover, .ah-palco .ah-mudo:focus-visible { opacity: 1; color: var(--txt); }
.ah-palco .ah-mudo[aria-pressed="true"] { color: var(--txt-3); }

@media (prefers-reduced-motion: reduce) {
  .ah-luz, .ah-palco .raios, .ah-palco .raios2, .ah-palco .ondas, .ah-palco .faixas, .ah-palco canvas { display: none !important; }
  .ah-palco::after { animation: none !important; }
  .ah-bau-tile, .ah-bau-tile::after, .ah-bau-tile .ah-bau-mini { animation: none !important; }
}



.ah-bau-cena { position: fixed; inset: 0; z-index: 9000; display: grid; place-items: center; padding: 16px;
  background: rgba(0, 0, 0, .86); animation: ahCenaVem .25s ease-out; }
.ah-bau-cena .ah-palco { width: min(1100px, 100%); max-height: calc(100vh - 32px); background-color: var(--bg); }
html.ah-bau-trava, html.ah-bau-trava body { overflow: hidden; }
@keyframes ahCenaVem { from { opacity: 0; } to { opacity: 1; } }
.ah-bau-abrindo { padding: 18px; border-radius: 13px; border: 2px dashed rgba(255, 255, 255, .2); color: var(--txt-3); text-align: center; font-size: 13px; }

.ah-bau-cena .ah-palco .rolo { width: var(--rw, 112px); }
.ah-bau-cena .ah-palco .janela { width: calc(var(--rw, 112px) - 4px); height: calc((var(--rw, 112px) - 4px) * .565); }
.ah-bau-cena .ah-palco .fita span { height: calc((var(--rw, 112px) - 4px) * .565 - 4px); }
.ah-bau-cena .ah-palco .rolo .rot { max-width: var(--rw, 112px); }
@media (prefers-reduced-motion: reduce) { .ah-bau-cena { animation: none; } }
.ah-palco .ah-cena-x { position: absolute; right: 10px; top: 10px; z-index: 7; width: 34px; height: 34px; display: grid; place-items: center; padding: 0;
  border-radius: 50%; border: 1px solid rgba(255, 255, 255, .35); background: rgba(0, 0, 0, .55); color: #fff; cursor: pointer; animation: ahCenaVem .3s ease-out; }
.ah-palco .ah-cena-x:hover, .ah-palco .ah-cena-x:focus-visible { background: rgba(255, 255, 255, .15); border-color: #fff; }

.ah-achado.ah-leque .ah-ramo > * { opacity: 0; transform: translateY(16px) scale(.96); }
.ah-achado.ah-leque.abre .ah-ramo > *, .ah-achado.ah-leque .ah-ramo > .vem { animation: ahLeque .5s cubic-bezier(.22, 1, .36, 1) var(--d, 0ms) forwards; }
@keyframes ahLeque { from { opacity: 0; transform: translateY(16px) scale(.96); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .ah-achado.ah-leque .ah-ramo > * { opacity: 1; transform: none; animation: none !important; } }

.ah-luz.desce { top: 0; height: 170px; opacity: 0; transform: translateY(-170px); }

.ah-achado .ah-aberto { margin: 6px 0 0; font-size: 12.5px; line-height: 1.45; color: var(--txt-3); }
.ah-achado .ah-aberto b { color: var(--txt-2); font-weight: 600; }