/* ============================================================================
   AVENTURA — "As Estrelas da Lua" (mapa de mundos)
   Segue DESIGN.md: papel recortado, contorno --ink, sombra dura, Baloo 2.
   Markup gerado por js/aventura.js (prefixo .av-).
   ============================================================================ */

.screen.av-screen, .av-overlay, .av-cut {
    --gs-ink: var(--ink, #1B1235); --gs-ink-soft: var(--ink-soft, #3B2A6B); --gs-paper: var(--paper, #FFF6E9); --gs-mango: var(--mango, #FF8A3D);
    --gs-sun: var(--sun, #FFD23F); --gs-lime: var(--lime, #B8E62D); --gs-teal: var(--teal, #2FD4C6); --gs-grape: var(--grape, #8B5CF6);
    --gs-display: var(--font-display, 'Baloo 2', 'Nunito', sans-serif); --gs-font: var(--font, 'Nunito', sans-serif);
}
.screen.av-screen { padding: 0; overflow: hidden; background: var(--night, #241A52); }
.screen.av-screen.active { display: flex; flex-direction: column; }

/* ---------------------------------------------------------------- HUD */
.av-hud {
    position: relative; z-index: 6; flex: 0 0 auto;
    display: flex; align-items: center; gap: 10px;
    padding: calc(var(--safe-top, 0px) + 10px) 12px 10px;
    background: linear-gradient(180deg, rgba(21,15,51,.92), rgba(21,15,51,.55) 80%, rgba(21,15,51,0));
}
.av-hud-btn {
    width: 52px; height: 52px; flex: 0 0 52px; border-radius: 18px;
    background: var(--paper, #FFF6E9); color: var(--ink, #1B1235);
    border: 3px solid var(--ink, #1B1235); border-bottom-width: 7px;
    display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0;
    transition: transform .08s;
}
.av-hud-btn:active { transform: translateY(4px); border-bottom-width: 3px; }
.av-hud-tit { flex: 1; min-width: 0; }
.av-hud-nome {
    font-family: var(--font-display, 'Baloo 2', 'Nunito', sans-serif); font-weight: 800; font-size: 22px; line-height: 1.05;
    color: #fff; -webkit-text-stroke: 1px var(--ink, #1B1235);
    text-shadow: 0 3px 0 var(--ink, #1B1235); transform: rotate(-1.5deg); transform-origin: left center;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.av-hud-sub { font-family: var(--font, 'Nunito', sans-serif); font-weight: 800; font-size: 12px; color: var(--sun, #FFD23F); letter-spacing: .04em; text-transform: uppercase; }
.av-hud-chips { display: flex; gap: 6px; flex: 0 0 auto; }
.av-chip {
    display: inline-flex; align-items: center; gap: 4px; height: 34px; padding: 0 10px; border-radius: 999px;
    background: var(--paper, #FFF6E9); border: 3px solid var(--ink, #1B1235); box-shadow: 0 4px 0 var(--ink-soft, #3B2A6B);
    font-family: var(--font-display, 'Baloo 2', sans-serif); font-weight: 800; font-size: 15px; color: var(--ink, #1B1235);
}
.av-chip-estrela { color: #9A6B00; } .av-chip-estrela svg { color: var(--sun, #FFD23F); }
.av-chip-moeda svg { color: var(--mango, #FF8A3D); }

/* ---------------------------------------------------------------- área rolável */
.av-scroll { position: relative; flex: 1 1 auto; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.av-cena { position: relative; width: 100%; }
.av-trilha-svg { position: absolute; left: 0; top: 0; pointer-events: none; z-index: 1; }
.av-trilha-borda { fill: none; stroke: var(--ink, #1B1235); stroke-width: 30; stroke-linecap: round; stroke-linejoin: round; }
.av-trilha-base  { fill: none; stroke: #E9C27E; stroke-width: 22; stroke-linecap: round; stroke-linejoin: round; }
.av-trilha-pontos{ fill: none; stroke: rgba(120,80,30,.45); stroke-width: 5; stroke-linecap: round; stroke-dasharray: 2 16; }
.av-trilha-feita { fill: none; stroke: var(--lime, #B8E62D); stroke-width: 12; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1 22; animation: avTrilhaAnda 1.4s linear infinite; }
.av-trilha-secreta { fill: none; stroke: var(--grape, #8B5CF6); stroke-width: 8; stroke-linecap: round; stroke-dasharray: 4 14; opacity: .9; }
@keyframes avTrilhaAnda { to { stroke-dashoffset: -23; } }

/* ---------------------------------------------------------------- seleção de mundos */
.av-mundos .av-cena { background: radial-gradient(ellipse at 50% 0%, #3B2A6B 0%, var(--night, #241A52) 45%, var(--night-2, #150F33) 100%); }
.av-ceu-noite { position: absolute; inset: 0; pointer-events: none;
    background-image: radial-gradient(circle, rgba(255,255,255,.9) 1.2px, transparent 1.6px), radial-gradient(circle, rgba(255,255,255,.55) 1px, transparent 1.4px);
    background-size: 90px 120px, 140px 170px; background-position: 10px 20px, 60px 80px; opacity: .8; }
.av-lua-topo { position: absolute; left: 50%; top: 12px; transform: translateX(-50%); z-index: 2; filter: drop-shadow(0 0 22px rgba(255,210,63,.35)); }
.av-mundos .av-trilha-base { stroke: #6C5BB0; } .av-mundos .av-trilha-borda { display: none; } .av-mundos .av-trilha-pontos { stroke: rgba(255,255,255,.45); }

.av-ilha-card {
    position: absolute; z-index: 3; width: min(78%, 330px); height: 148px; left: 50%; margin-left: max(-39%, -165px); transform: rotate(-1.2deg);
    display: grid; grid-template-columns: 118px 1fr; align-items: center; gap: 8px; padding: 8px 10px; text-align: left;
    background: var(--paper, #FFF6E9); border: 3px solid var(--ink, #1B1235); border-radius: 26px; box-shadow: 0 8px 0 var(--ink-soft, #3B2A6B);
    color: var(--ink, #1B1235); cursor: pointer; font-family: var(--font, 'Nunito', sans-serif);
    animation: avFadeUp .5s cubic-bezier(.34,1.56,.64,1) both; animation-delay: calc(var(--i, 0) * .07s);
}
.av-ilha-card.av-ilha-dir { transform: rotate(1.4deg); }
.av-ilha-card:active { transform: translateY(5px); box-shadow: 0 3px 0 var(--ink-soft, #3B2A6B); }
.av-ilha-num { position: absolute; left: -12px; top: -14px; width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
    background: var(--sun, #FFD23F); border: 3px solid var(--ink, #1B1235); box-shadow: 0 4px 0 var(--ink-soft, #3B2A6B);
    font-family: var(--font-display, 'Baloo 2', sans-serif); font-weight: 800; font-size: 22px; }
.av-ilha-art { display: block; width: 118px; height: 118px; } .av-ilha-art svg { width: 100%; height: 100%; display: block; }
.av-ilha-info { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.av-ilha-nome { font-family: var(--font-display, 'Baloo 2', sans-serif); font-weight: 800; font-size: 21px; line-height: 1.05; }
.av-ilha-sub { font-size: 12.5px; font-weight: 800; color: #6B5E8C; }
.av-ilha-est { display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-display, 'Baloo 2', sans-serif); font-weight: 800; font-size: 15px; color: #9A6B00; margin-top: 4px; }
.av-ilha-est svg { color: var(--sun, #FFD23F); }
.av-ilha-atual { box-shadow: 0 8px 0 var(--ink-soft, #3B2A6B), 0 0 0 6px rgba(255,210,63,.55); }
.av-ilha-trancada { filter: saturate(.25) brightness(.85); }
.av-ilha-trancada .av-ilha-art { opacity: .55; }
.av-cadeado { position: absolute; right: 12px; top: 12px; width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
    background: #D9D3E6; border: 3px solid var(--ink, #1B1235); color: var(--ink, #1B1235); }
.av-selo { position: absolute; right: 10px; top: -12px; display: flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 999px;
    background: var(--sun, #FFD23F); border: 3px solid var(--ink, #1B1235); box-shadow: 0 4px 0 var(--ink-soft, #3B2A6B); transform: rotate(6deg);
    font-family: var(--font-display, 'Baloo 2', sans-serif); font-weight: 800; font-size: 13px; }
.av-selo i { font-style: normal; }

/* ---------------------------------------------------------------- mapa do mundo */
.av-mapa .av-cena { overflow: hidden; }
.av-tema-floresta .av-cena { background: linear-gradient(180deg, #7ED3FF 0%, #BDEBC8 40%, #4CAF6A 100%); }
.av-tema-praia .av-cena    { background: linear-gradient(180deg, #5EC8F2 0%, #9FE3FF 35%, #FFE9B5 70%, #F6D58A 100%); }
.av-tema-montanha .av-cena { background: linear-gradient(180deg, #6FB7FF 0%, #CFE8FF 45%, #FFFFFF 100%); }
.av-tema-cidade .av-cena   { background: linear-gradient(180deg, #FFB86B 0%, #FFD9A8 30%, #BFC8D6 100%); }
.av-tema-espaco .av-cena   { background: radial-gradient(ellipse at 30% 20%, #4C2FA0 0%, #241A52 45%, #0B0724 100%); }
.av-tema-castelo .av-cena  { background: linear-gradient(180deg, #1B1440 0%, #3B2A6B 50%, #7A5CC8 100%); }

/* 2a jornada (mundos 7-16): temas proprios reusando a arte dos seis primeiros */
.av-tema-vulcao .av-cena     { background: linear-gradient(180deg, #2B0F0F 0%, #7A2417 45%, #E2571F 80%, #FFA23C 100%); }
.av-tema-selva .av-cena      { background: linear-gradient(180deg, #0E3B22 0%, #1F6B3A 40%, #4FA35C 75%, #8FD08A 100%); }
.av-tema-deserto .av-cena    { background: linear-gradient(180deg, #7FC7F2 0%, #FFE7B8 45%, #F2B65A 80%, #D99A45 100%); }
.av-tema-oficina .av-cena    { background: linear-gradient(180deg, #241B12 0%, #4A3B2A 40%, #8A6A45 75%, #C2A176 100%); }
.av-tema-estrelas .av-cena   { background: radial-gradient(ellipse at 65% 15%, #1B3A8C 0%, #0B1E4A 45%, #04091C 100%); }
.av-tema-circo .av-cena      { background: linear-gradient(180deg, #3A0E2C 0%, #7A1F5C 40%, #C93F8C 75%, #FF9ECB 100%); }
.av-tema-ruinas .av-cena     { background: linear-gradient(180deg, #1B1A16 0%, #3D3A32 40%, #6E695A 75%, #A79E85 100%); }
.av-tema-tempestade .av-cena { background: linear-gradient(180deg, #0C1020 0%, #26304F 45%, #4A5878 80%, #7E8CA8 100%); }
.av-tema-geleira .av-cena    { background: linear-gradient(180deg, #1E4B78 0%, #3E7FB5 35%, #A9D8F5 70%, #EAF7FF 100%); }
.av-tema-torre .av-cena      { background: linear-gradient(180deg, #070418 0%, #1A1040 45%, #3B2A6B 78%, #6B4FC2 100%); }

/* aviso da meta de estrelas na tela de vitoria dos jogos educativos */
.av-meta-aviso { display: flex; align-items: center; justify-content: center; gap: 8px;
  margin: 0 auto 10px; padding: 8px 14px; border-radius: 16px; max-width: 320px;
  background: var(--sun, #FFC93C); color: var(--ink, #1B1235);
  border: 3px solid var(--ink, #1B1235); box-shadow: 0 4px 0 var(--ink, #1B1235);
  font-weight: 700; font-size: 15px; text-align: center; }
.av-meta-aviso svg { flex: 0 0 auto; }

/* convite da 2a jornada */
.av-jornada .av-jornada-txt { font-size: 15px; line-height: 1.35; margin: 6px 0 14px; opacity: .9; }
.av-fundo-par { position: absolute; inset: 0; pointer-events: none; z-index: 0; will-change: transform; }
.av-fundo-par svg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

.av-no { position: absolute; z-index: 3; width: 92px; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; gap: 2px; }
.av-no-btn {
    position: relative; width: 74px; height: 74px; border-radius: 50%; padding: 0; cursor: pointer;
    display: flex; align-items: center; justify-content: center; color: var(--ink, #1B1235);
    background: linear-gradient(180deg, #FFFFFF, var(--paper, #FFF6E9)); border: 3.5px solid var(--ink, #1B1235); box-shadow: 0 7px 0 var(--ink-soft, #3B2A6B);
    transition: transform .08s;
}
.av-no-btn:active { transform: translateY(5px); box-shadow: 0 2px 0 var(--ink-soft, #3B2A6B); }
.av-no-btn svg { width: 40px; height: 40px; }
.av-no-num { position: absolute; left: -8px; top: -8px; width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
    background: var(--sun, #FFD23F); border: 3px solid var(--ink, #1B1235); font-family: var(--font-display, 'Baloo 2', sans-serif); font-weight: 800; font-size: 14px; }
.av-no-num svg { width: 14px; height: 14px; }
.av-no-feito .av-no-btn { background: linear-gradient(180deg, #D8F58A, var(--lime, #B8E62D)); }
.av-no-feito .av-no-num { background: var(--lime, #B8E62D); }
.av-no-atual .av-no-btn { background: linear-gradient(180deg, #FFD9A8, var(--mango, #FF8A3D)); animation: avPulsa 1.6s ease-in-out infinite; }
.av-no-atual .av-no-num { background: var(--mango, #FF8A3D); }
.av-no-trancado .av-no-btn { background: linear-gradient(180deg, #E6E1F0, #C9C2DB); color: #6B5E8C; box-shadow: 0 5px 0 #8E86A6; border-color: #4A3E70; }
.av-no-trancado .av-no-num { background: #D9D3E6; border-color: #4A3E70; color: #4A3E70; }
.av-no-alfa .av-no-num { background: var(--teal, #2FD4C6); }
.av-no-secreto .av-no-btn { width: 66px; height: 66px; background: linear-gradient(180deg, #D9C8FF, var(--grape, #8B5CF6)); color: #fff; }
.av-no-secreto .av-no-num { background: var(--grape, #8B5CF6); color: #fff; }
.av-no-oculto { opacity: 0; transform: translate(-50%, -50%) scale(.3); }
.av-no-revela { animation: avRevela .7s cubic-bezier(.34,1.56,.64,1) both; }
.av-destrava .av-no-btn, .av-destrava .av-covil-btn { animation: avDestrava .8s cubic-bezier(.34,1.56,.64,1) both; }
.av-no-est { display: flex; gap: 1px; justify-content: center; height: 18px; }
.av-est { color: #B9B1CC; opacity: .75; display: inline-flex; filter: drop-shadow(0 2px 0 rgba(27,18,53,.5)); }
.av-est svg { width: 16px; height: 16px; }
.av-est.on { color: var(--sun, #FFD23F); opacity: 1; }
.av-est-cai { animation: avEstrelaCai .5s cubic-bezier(.34,1.56,.64,1) both; }
.av-no-nome {
    font-family: var(--font, 'Nunito', sans-serif); font-weight: 800; font-size: 12px; text-align: center; line-height: 1.1; color: #fff;
    text-shadow: 0 1px 0 var(--ink, #1B1235), 0 -1px 0 var(--ink, #1B1235), 1px 0 0 var(--ink, #1B1235), -1px 0 0 var(--ink, #1B1235), 0 3px 0 var(--ink, #1B1235);
    max-width: 104px;
}

/* chefão (covil) */
.av-covil { position: absolute; z-index: 3; transform: translate(-50%, -50%); }
.av-covil-btn { position: relative; width: 190px; height: 190px; background: none; border: 0; padding: 0; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; filter: drop-shadow(0 8px 0 rgba(27,18,53,.55)); }
.av-covil-btn > svg { width: 150px; height: 130px; display: block; }
.av-covil-aberto .av-covil-btn > svg { animation: avFlutua 2.4s ease-in-out infinite; }
.av-covil-trancado .av-covil-btn > svg { filter: saturate(.3) brightness(.8); }
.av-covil-tag { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; margin-top: -8px; border-radius: 999px;
    background: var(--paper, #FFF6E9); border: 3px solid var(--ink, #1B1235); box-shadow: 0 4px 0 var(--ink-soft, #3B2A6B);
    font-family: var(--font-display, 'Baloo 2', sans-serif); font-weight: 800; font-size: 14px; color: var(--ink, #1B1235); }
.av-covil-aberto .av-covil-tag { background: var(--mango, #FF8A3D); animation: avPulsa 1.6s ease-in-out infinite; }
.av-covil-feito .av-covil-tag { background: var(--sun, #FFD23F); }
.av-covil-trancado .av-covil-tag { background: #D9D3E6; color: #4A3E70; }
.av-covil .av-no-est { margin-top: 4px; }

/* pet no mapa */
.av-pet { position: absolute; z-index: 5; width: 72px; transform: translate(-50%, -50%); transition: left 1.1s cubic-bezier(.4,0,.2,1), top 1.1s cubic-bezier(.4,0,.2,1); pointer-events: none; }
.av-pet-art { width: 72px; height: 72px; filter: drop-shadow(0 6px 0 rgba(27,18,53,.4)); animation: avPetRespira 2.2s ease-in-out infinite; }
.av-pet-art > * { width: 100%; height: 100%; }
.av-pet-andando .av-pet-art { animation: avPetAnda .35s ease-in-out infinite; }
.av-pet-esq .av-pet-art { transform: scaleX(-1); }
.av-balao { position: absolute; left: 50%; bottom: 100%; transform: translateX(-50%); margin-bottom: 6px; width: 190px; padding: 8px 12px; border-radius: 16px;
    background: var(--paper, #FFF6E9); border: 3px solid var(--ink, #1B1235); box-shadow: 0 4px 0 var(--ink-soft, #3B2A6B);
    font-family: var(--font, 'Nunito', sans-serif); font-weight: 800; font-size: 13px; color: var(--ink, #1B1235); text-align: center;
    animation: avEntra .35s cubic-bezier(.34,1.56,.64,1) both; }
.av-balao::after { content: ''; position: absolute; left: 50%; top: 100%; width: 14px; height: 14px; margin-left: -7px; margin-top: -7px; background: var(--paper, #FFF6E9); border-right: 3px solid var(--ink, #1B1235); border-bottom: 3px solid var(--ink, #1B1235); transform: rotate(45deg); }

/* ---------------------------------------------------------------- overlays (vitória arcade / recompensa) */
.av-overlay { position: fixed; inset: 0; z-index: 9200; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(21,15,51,.72); animation: avFade .25s both; overflow: hidden; }
.av-card { width: min(100%, 360px); padding: 22px 18px 18px; border-radius: 28px; text-align: center; background: var(--paper, #FFF6E9); border: 3.5px solid var(--ink, #1B1235); box-shadow: 0 10px 0 var(--ink-soft, #3B2A6B); color: var(--ink, #1B1235); animation: avEntra .45s cubic-bezier(.34,1.56,.64,1) both; }
.av-card p { font-family: var(--font, 'Nunito', sans-serif); font-weight: 800; font-size: 16px; margin: 6px 0 14px; color: #4A3E70; }
.av-tit { font-family: var(--font-display, 'Baloo 2', sans-serif); font-weight: 800; font-size: 28px; line-height: 1.05; margin: 6px 0 0; color: var(--mango, #FF8A3D); -webkit-text-stroke: 1px var(--ink, #1B1235); text-shadow: 0 3px 0 var(--ink, #1B1235); transform: rotate(-1.5deg); }
.av-btns { display: flex; flex-direction: column; gap: 12px; align-items: stretch; }
.av-key { width: 100%; }
.av-vit-estrelas { display: flex; justify-content: center; gap: 6px; margin-top: -48px; margin-bottom: 4px; }
.av-vit-est { color: #D9D3E6; filter: drop-shadow(0 4px 0 var(--ink, #1B1235)); transform: scale(0); animation: avEstrelaCai .55s cubic-bezier(.34,1.56,.64,1) both; }
.av-vit-est.on { color: var(--sun, #FFD23F); }
.av-vit-est:nth-child(2) { margin-top: -12px; }
.av-chuva { position: absolute; top: -40px; color: var(--sun, #FFD23F); filter: drop-shadow(0 3px 0 var(--ink, #1B1235)); animation: avChuva 2.6s linear infinite; }
.av-selo-grande { width: 84px; height: 84px; margin: -64px auto 6px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--sun, #FFD23F); border: 3.5px solid var(--ink, #1B1235); box-shadow: 0 6px 0 var(--ink-soft, #3B2A6B); color: var(--ink, #1B1235); animation: avGira 1s cubic-bezier(.34,1.56,.64,1) both; }
.av-rec-sub { color: #9A6B00 !important; text-transform: uppercase; letter-spacing: .06em; font-size: 13px !important; margin: 2px 0 10px !important; }
.av-rec-item { display: flex; align-items: center; gap: 12px; text-align: left; padding: 10px 12px; margin: 0 0 10px; border-radius: 18px; background: #fff; border: 3px solid var(--ink, #1B1235); }
.av-rec-item b { font-family: var(--font-display, 'Baloo 2', sans-serif); font-size: 18px; display: block; }
.av-rec-item small { font-weight: 800; color: #6B5E8C; }
.av-rec-emoji { font-size: 40px; line-height: 1; }
.av-rec-bonus { display: inline-flex; align-items: center; gap: 6px; color: #9A6B00 !important; }
.av-rec-bonus svg { color: var(--mango, #FF8A3D); }

/* ---------------------------------------------------------------- cutscenes */
.av-cut { position: absolute; inset: 0; z-index: 20; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding: 16px 16px calc(var(--safe-bottom, 0px) + 18px); animation: avFade .3s both; }
.av-cut-fundo { position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 20%, #3B2A6B 0%, var(--night, #241A52) 50%, var(--night-2, #150F33) 100%); }
.av-cut-fundo::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,255,255,.9) 1.2px, transparent 1.6px); background-size: 110px 130px; opacity: .6; }
.av-cut-fundo-feliz { background: radial-gradient(ellipse at 50% 20%, #FFD23F 0%, #FF8A3D 35%, #8B5CF6 80%, var(--night, #241A52) 100%); }
.av-cut-cena { position: relative; z-index: 1; flex: 1 1 auto; width: 100%; display: flex; align-items: center; justify-content: center; min-height: 0; }
.av-cut-cena > * { animation: avEntra .5s cubic-bezier(.34,1.56,.64,1) both; }
.av-cut-ceu, .av-cut-ilha, .av-cut-covil { display: flex; align-items: center; justify-content: center; filter: drop-shadow(0 10px 0 rgba(27,18,53,.5)); }
.av-cut-ilha svg, .av-cut-covil svg { width: min(72vw, 300px); height: auto; }
.av-cut-ceu-feliz { filter: drop-shadow(0 0 30px rgba(255,210,63,.55)); }
.av-cut-chao { display: flex; align-items: flex-end; justify-content: center; gap: 12px; }
.av-cut-nena > * { width: 150px; height: 150px; }
.av-cut-pet { width: 96px; height: 96px; filter: drop-shadow(0 6px 0 rgba(27,18,53,.4)); animation: avPetRespira 2.2s ease-in-out infinite; }
.av-cut-pet > * { width: 100%; height: 100%; }
.av-cut-balao { position: relative; z-index: 1; width: min(100%, 380px); padding: 16px 18px; margin-bottom: 14px; border-radius: 22px;
    background: var(--paper, #FFF6E9); border: 3.5px solid var(--ink, #1B1235); box-shadow: 0 8px 0 var(--ink-soft, #3B2A6B);
    font-family: var(--font, 'Nunito', sans-serif); font-weight: 800; font-size: 19px; line-height: 1.3; color: var(--ink, #1B1235); text-align: center; }
.av-cut-btns { position: relative; z-index: 1; width: min(100%, 380px); display: flex; gap: 10px; }
.av-cut-btns .av-key { flex: 1; }
.av-cut-btns .gs-key-ghost { flex: 0 0 34%; }
.av-cut-pontos { position: relative; z-index: 1; display: flex; gap: 6px; margin-top: 12px; }
.av-cut-pontos i { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.35); border: 2px solid var(--ink, #1B1235); }
.av-cut-pontos i.on { background: var(--sun, #FFD23F); }
.av-pop { animation: avEntra .4s cubic-bezier(.34,1.56,.64,1) both; }

/* créditos */
.av-creditos { justify-content: center; }
.av-cred-rolo { position: relative; z-index: 1; text-align: center; color: #fff; font-family: var(--font, 'Nunito', sans-serif); font-weight: 800; animation: avSobe 14s linear both; }
.av-cred-rolo p { margin: 6px 0; font-size: 16px; text-shadow: 0 2px 0 var(--ink, #1B1235); }
.av-cred-rolo .av-tit { font-size: 34px; color: var(--sun, #FFD23F); margin-bottom: 14px; }
.av-cred-nome { font-family: var(--font-display, 'Baloo 2', sans-serif); font-size: 26px !important; color: var(--sun, #FFD23F); margin-bottom: 14px !important; }
.av-cred-lua { margin-bottom: 8px; filter: drop-shadow(0 0 26px rgba(255,210,63,.6)); }
.av-creditos .av-cut-btns { margin-top: 18px; }

/* ---------------------------------------------------------------- tela do chefão */
#aventura-chefao-screen.av-chefao-host { position: fixed; inset: 0; z-index: 900; background: var(--night, #241A52); }
.av-ph { position: relative; z-index: 1; flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 20px; }
.av-ph-art svg { width: 180px; height: auto; filter: drop-shadow(0 8px 0 rgba(27,18,53,.5)); }

/* ---------------------------------------------------------------- decorações animadas (SVG do fundo) */
.av-vaga { animation: avPisca 1.6s ease-in-out infinite; }
.av-zzz { animation: avZzz 2.4s ease-in-out infinite; transform-origin: center; }
.av-brilha { animation: avPisca 1.2s ease-in-out infinite; }
.av-gira { animation: avGiraCont 12s linear infinite; transform-origin: center; transform-box: fill-box; }
.av-raios { animation: avGiraCont 24s linear infinite; transform-origin: center; transform-box: fill-box; }
.av-nuvem { animation: avNuvem 16s ease-in-out infinite alternate; }
.av-neve { animation: avNeve 6s linear infinite; }
.av-treme { animation: avNao .4s ease-in-out; }

/* ---------------------------------------------------------------- keyframes */
@keyframes avEntra { from { transform: scale(.85); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes avFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes avPulsa { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.07); } }
@keyframes avFlutua { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes avPetRespira { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-4px) scale(1.03); } }
@keyframes avPetAnda { 0%, 100% { transform: translateY(0) rotate(-6deg); } 50% { transform: translateY(-10px) rotate(6deg); } }
@keyframes avEstrelaCai { 0% { transform: translateY(-40px) scale(1.6); opacity: 0; } 60% { transform: translateY(4px) scale(1.15); opacity: 1; } 100% { transform: translateY(0) scale(1); opacity: 1; } }
@keyframes avRevela { 0% { transform: translate(-50%, -50%) scale(.3); opacity: 0; } 100% { transform: translate(-50%, -50%) scale(1); opacity: 1; } }
@keyframes avDestrava { 0% { transform: scale(1); } 40% { transform: scale(1.25) rotate(-6deg); } 70% { transform: scale(.95) rotate(4deg); } 100% { transform: scale(1); } }
@keyframes avChuva { 0% { transform: translateY(0) rotate(0); opacity: 0; } 10% { opacity: 1; } 100% { transform: translateY(110vh) rotate(360deg); opacity: .8; } }
@keyframes avGira { from { transform: rotate(-200deg) scale(.2); } to { transform: rotate(0) scale(1); } }
@keyframes avGiraCont { to { transform: rotate(360deg); } }
@keyframes avSobe { from { transform: translateY(40vh); } to { transform: translateY(0); } }
@keyframes avPisca { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }
@keyframes avZzz { 0% { transform: translate(0, 0); opacity: 0; } 40% { opacity: 1; } 100% { transform: translate(10px, -22px); opacity: 0; } }
@keyframes avNuvem { from { transform: translateX(-14px); } to { transform: translateX(18px); } }
@keyframes avNeve { from { transform: translateY(-30px); opacity: 0; } 20% { opacity: 1; } to { transform: translateY(80px); opacity: 0; } }
@keyframes avNao { 0%, 100% { transform: translate(-50%, -50%) translateX(0); } 25% { transform: translate(-50%, -50%) translateX(-6px); } 75% { transform: translate(-50%, -50%) translateX(6px); } }
.av-ilha-card.av-treme { animation: avNaoCard .4s ease-in-out; }
@keyframes avNaoCard { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-6px); } 75% { transform: translateX(6px); } }
@keyframes avFadeUp { from { opacity: 0; margin-top: 24px; } to { opacity: 1; margin-top: 0; } }

@media (prefers-reduced-motion: reduce) {
    .av-ilha-card, .av-no-btn, .av-covil-btn > svg, .av-covil-tag, .av-pet, .av-pet-art, .av-cut-pet, .av-trilha-feita, .av-vaga, .av-zzz, .av-brilha, .av-gira, .av-raios, .av-nuvem, .av-neve, .av-cred-rolo { animation: none !important; transition: none !important; }
}
@media (min-width: 600px) {
    .av-hud { padding-left: 20px; padding-right: 20px; }
}

/* Escotilha: atalho para nao prender a crianca numa fase dificil */
.av-escotilha { position: absolute; left: 0; right: 0; bottom: 14px; display: flex; justify-content: center; pointer-events: none; z-index: 6; }
.av-escotilha .av-key { pointer-events: auto; box-shadow: 0 4px 0 var(--ink, #1B1235), 0 8px 18px rgba(0,0,0,.25); }