/* =========================================================
   TESTE GRÁTIS (visitante): boas-vindas + resultado do saque
   Identidade azul da Bigodini Rush
   ========================================================= */
:root {
    --bl1: #2f8bff;
    --bl2: #0a4fd6;
    --bl3: #06308a;
}

/* botão azul (reaproveita .btn) */
.btn-blue { background: linear-gradient(180deg, var(--bl1), var(--bl2)); box-shadow: 0 3px 0 var(--bl3); }

/* ---------- tela cheia ---------- */
.trial-screen {
    position: fixed; inset: 0; z-index: 150;
    display: flex; justify-content: center;
    overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
    padding: max(14px, env(safe-area-inset-top, 0px)) 14px max(14px, env(safe-area-inset-bottom, 0px));
    background:
        radial-gradient(circle at 12% 8%, rgba(47,139,255,.28), transparent 38%),
        radial-gradient(circle at 92% 92%, rgba(10,79,214,.32), transparent 42%),
        rgba(2, 8, 24, .94);
    backdrop-filter: blur(6px);
}
.trial-screen { flex-direction: column; justify-content: flex-start; align-items: center; }   /* o card usa margin:auto para centralizar sem cortar o topo */

.trial-card {
    width: min(390px, 100%);
    margin: auto 0;
    padding: 18px 18px 16px;
    border-radius: 22px;
    text-align: center;
    color: var(--text);
    background: linear-gradient(180deg, #0b1d44 0%, #06122c 100%);
    border: 1px solid rgba(47,139,255,.45);
    box-shadow: 0 0 0 1px rgba(255,255,255,.04) inset, 0 20px 60px rgba(0,0,0,.55), 0 0 40px rgba(47,139,255,.18);
    animation: trialIn .35s ease-out both;
}
@keyframes trialIn { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }

.trial-logo { display: block; width: min(150px, 42%); height: auto; margin: 0 auto 8px; border-radius: 18px; box-shadow: 0 6px 18px rgba(0,0,0,.5); }

.trial-headline { margin: 4px 0 14px; font-size: 18px; line-height: 1.3; font-weight: 700; color: #e9f1ff; }
.trial-headline b { color: #5eb0ff; font-weight: 900; }

.trial-steps-title { margin: 0 0 8px; font-size: 15px; font-weight: 800; color: #fff; }
.trial-steps { list-style: none; margin: 0 0 14px; padding: 0; text-align: left; display: grid; gap: 7px; }
.trial-steps li { font-size: 13.5px; line-height: 1.35; color: #cfe0ff; padding: 9px 12px; border-radius: 12px; background: rgba(47,139,255,.09); border: 1px solid rgba(47,139,255,.22); }
.trial-steps li span { color: #5eb0ff; font-weight: 900; margin-right: 4px; }

.trial-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 16px; }
.trial-stats div { text-align: center; padding: 10px 4px; border-radius: 12px; background: rgba(255,255,255,.04); border: 1px solid rgba(47,139,255,.25); }
.trial-stats b { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 18px; font-weight: 900; color: #5eb0ff; }
.trial-stats small { display: block; margin-top: 2px; font-size: 11px; color: #9fb4dd; }
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: #2ee572; box-shadow: 0 0 0 0 rgba(46,229,114,.7); animation: livePulse 1.6s infinite; }
@keyframes livePulse { 0% { box-shadow: 0 0 0 0 rgba(46,229,114,.7); } 100% { box-shadow: 0 0 0 8px rgba(46,229,114,0); } }

/* selo de segurança */
.trial-safe { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; padding: 9px 12px; text-align: left; font-size: 12.5px; line-height: 1.35; color: #cfe0ff; border-radius: 12px; background: rgba(46,229,114,.08); border: 1px solid rgba(46,229,114,.3); }
.trial-safe b { color: #fff; }
.trial-safe-ico { flex: none; font-size: 20px; }

.trial-cta { padding: 15px; font-size: 16px; border-radius: 14px; animation: trialPulse 1.8s ease-in-out infinite; }
@keyframes trialPulse { 0%,100% { box-shadow: 0 3px 0 var(--bl3), 0 0 0 0 rgba(47,139,255,.55); } 50% { box-shadow: 0 3px 0 var(--bl3), 0 0 0 9px rgba(47,139,255,0); } }

.trial-link { display: block; margin: 12px auto 0; background: none; border: 0; color: #8fb8f5; font-size: 13px; font-weight: 600; text-decoration: underline; padding: 4px 8px; }
.trial-foot { margin: 10px 0 0; font-size: 10.5px; line-height: 1.35; color: #6f86b3; }

/* ---------- resultado ---------- */
.trial-result-title { margin: 2px 0 10px; font-size: 26px; line-height: 1.1; font-weight: 900; color: #fff; }
.trial-amount {
    margin: 0 auto 14px; padding: 12px 18px; width: min(300px, 100%);
    font-size: clamp(32px, 10vw, 40px); font-weight: 900; letter-spacing: .01em; color: #fff;
    border-radius: 999px;
    background: linear-gradient(180deg, var(--bl1), var(--bl3));
    border: 4px solid var(--gold);
    box-shadow: 0 0 0 2px rgba(0,0,0,.35), 0 8px 24px rgba(255,194,26,.3), inset 0 2px 0 rgba(255,255,255,.35);
    text-shadow: 0 2px 0 rgba(0,0,0,.45);
    animation: trialAmount .6s cubic-bezier(.2,1.4,.4,1) both;
}
@keyframes trialAmount { from { transform: scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
.trial-congrats { margin: 0 0 6px; font-size: 14px; line-height: 1.35; font-weight: 900; color: #5eb0ff; }
.trial-sub { margin: 0 0 14px; font-size: 12.5px; line-height: 1.4; color: #aebfe0; }

.trial-points { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 8px; text-align: left; }
.trial-points li { display: flex; gap: 11px; align-items: center; padding: 10px 12px; border-radius: 14px; background: rgba(47,139,255,.09); border: 1px solid rgba(47,139,255,.24); }
.trial-points .ico { flex: none; width: 34px; height: 34px; display: grid; place-items: center; font-size: 18px; border-radius: 50%; background: rgba(47,139,255,.18); }
.trial-points b { display: block; font-size: 12.5px; font-weight: 900; color: #fff; letter-spacing: .02em; }
.trial-points small { display: block; margin-top: 1px; font-size: 12px; line-height: 1.3; color: #aebfe0; }

body.trial-lock { overflow: hidden; }

/* ---------- jogo em modo teste ---------- */
#gameView .trial-only { display: none; }
#gameView.trial-mode .trial-only { display: block; }
#gameView.trial-mode .change-bet { display: none !important; }

@media (max-width: 380px) {
    .trial-headline { font-size: 16.5px; }
    .trial-result-title { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) {
    .trial-card, .trial-amount, .trial-cta { animation: none; }
}

/* ---------- boas-vindas: capa nova + layout para celular e computador ---------- */
.trial-cover { margin: 0 auto 12px; width: min(220px, 58vw, 30vh); aspect-ratio: 1; border-radius: 18px; overflow: hidden; border: 1px solid rgba(47,139,255,.45); box-shadow: 0 8px 26px rgba(0,0,0,.55), 0 0 26px rgba(47,139,255,.22); }
.trial-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.trial-card-intro .trial-headline { font-size: 19px; }
.trial-card-intro .trial-steps li { font-size: 14px; }

/* computador / tablet: card largo em 2 colunas, tudo visível sem rolar */
@media (min-width: 820px) {
    .trial-card-intro {
        width: min(960px, 100%);
        display: grid; grid-template-columns: minmax(300px, 42%) 1fr; gap: 34px; align-items: center;
        padding: 30px 34px; text-align: left;
    }
    .trial-card-intro .trial-cover { width: 100%; max-width: 440px; margin: 0 auto; border-radius: 22px; }
    .trial-card-intro .trial-headline { font-size: 26px; margin: 0 0 16px; }
    .trial-card-intro .trial-steps-title { font-size: 17px; }
    .trial-card-intro .trial-steps li { font-size: 15px; padding: 10px 14px; }
    .trial-card-intro .trial-safe { font-size: 14px; }
    .trial-card-intro .trial-stats b { font-size: 22px; }
    .trial-card-intro .trial-stats small { font-size: 12.5px; }
    .trial-card-intro .trial-cta { font-size: 18px; padding: 17px; }
    .trial-card-intro .trial-link { margin-left: auto; margin-right: auto; font-size: 14px; }
    .trial-card-intro .trial-foot { text-align: center; font-size: 12px; }
}
/* celular deitado / telas baixas: capa menor para o botão aparecer logo */
@media (max-height: 560px) and (max-width: 819px) {
    .trial-cover { width: min(150px, 34vh); }
}

/* ---------- carregando o jogo ---------- */
.trial-loading { z-index: 160; background: radial-gradient(circle at 50% 30%, rgba(47,139,255,.28), transparent 55%), #020818; backdrop-filter: none; }
.trial-load-card { width: min(420px, 100%); margin: auto 0; text-align: center; animation: trialIn .3s ease-out both; }
.trial-load-logo { display: block; width: min(300px, 62vw, 42vh); height: auto; aspect-ratio: 1; object-fit: cover; margin: 0 auto 18px; border-radius: 22px; border: 1px solid rgba(47,139,255,.5); box-shadow: 0 12px 40px rgba(0,0,0,.6), 0 0 40px rgba(47,139,255,.25); }
.trial-load-title { margin: 0 0 12px; font-size: 16px; font-weight: 800; color: #e9f1ff; letter-spacing: .02em; }
.trial-load-title .dots::after { content: ''; animation: trialDots 1.2s steps(4, end) infinite; }
@keyframes trialDots { 0% { content: ''; } 25% { content: '.'; } 50% { content: '..'; } 75%, 100% { content: '...'; } }
.trial-bar { position: relative; height: 26px; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,.08); border: 2px solid rgba(47,139,255,.55); box-shadow: inset 0 2px 6px rgba(0,0,0,.5); }
.trial-bar-fill { height: 100%; width: 0%; border-radius: 999px; background: linear-gradient(180deg, #5eb0ff, var(--bl2)); box-shadow: 0 0 14px rgba(47,139,255,.7); transition: width .18s linear; }
.trial-bar-pct { position: absolute; inset: 0; display: grid; place-items: center; font-size: 13px; font-weight: 900; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.8); }
.trial-load-tag { display: inline-block; margin: 14px 0 0; padding: 6px 14px; font-size: 12px; font-weight: 800; letter-spacing: .04em; color: #ffd75e; border-radius: 999px; background: rgba(255,194,26,.1); border: 1px solid rgba(255,194,26,.4); }
@media (min-width: 820px) { .trial-load-card { width: min(520px, 100%); } .trial-load-title { font-size: 19px; } .trial-bar { height: 30px; } }

/* teste grátis nunca mostra a tela de aposta (nem por um instante) */
#gameView.trial-mode #startScreen { display: none !important; }

/* etiqueta de saldo de teste dentro do jogo */
#gameView.trial-mode .hud-sub::after { content: ' \2022  SALDO DE TESTE'; color: #ffd75e; }

/* =========================================================
   RESULTADO DO SAQUE (teste): visual claro, estilo "Você poderia ter ganho"
   ========================================================= */
.trial-card-result {
    position: relative; overflow: hidden;
    padding: 20px 18px 16px;
    color: #10255a;
    background: linear-gradient(180deg, #ffffff 0%, #eaf2ff 100%);
    border: 1px solid rgba(255,255,255,.7);
    box-shadow: 0 20px 60px rgba(0,0,0,.55), 0 0 40px rgba(47,139,255,.25);
}
.trial-card-result > *:not(.rc) { position: relative; z-index: 1; }
.trial-card-result .rc { position: absolute; z-index: 0; width: 22px; height: 22px; border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, #fff1a8, var(--gold) 70%); border: 2px solid #e0a000; opacity: .9; box-shadow: 0 2px 4px rgba(0,0,0,.2); }
.rc1 { top: 54px; left: -7px; } .rc2 { top: 150px; right: -7px; width: 18px; height: 18px; }
.rc3 { top: 250px; left: -8px; width: 16px; height: 16px; } .rc4 { bottom: 70px; right: -8px; }

.trial-card-result .trial-logo { width: min(230px, 66%); margin: 0 auto 6px; border-radius: 0; box-shadow: none; filter: drop-shadow(0 4px 8px rgba(0,0,0,.35)); }
.trial-card-result .trial-result-title { margin: 4px 0 12px; font-size: 24px; line-height: 1.15; font-weight: 900; color: #10255a; }
.trial-card-result .trial-amount { border-color: var(--gold); box-shadow: 0 0 0 2px rgba(0,0,0,.25), 0 8px 20px rgba(10,79,214,.35), inset 0 2px 0 rgba(255,255,255,.35); }
.trial-card-result .trial-amount::before { content: '\2726'; color: var(--gold); font-size: .5em; margin-right: 10px; vertical-align: middle; }
.trial-card-result .trial-congrats { color: #0f9d4a; font-size: 13px; }
.trial-card-result .trial-sub { color: #4a5f8c; }
.trial-card-result .trial-points li { background: #fff; border: 1px solid #d3e1fb; box-shadow: 0 1px 3px rgba(16,37,90,.08); }
.trial-card-result .trial-points .ico { background: #eaf2ff; }
.trial-card-result .trial-points b { color: #10255a; }
.trial-card-result .trial-points small { color: #5a6d96; }
.trial-card-result .trial-cta-green { background: linear-gradient(180deg, #2ad36b, var(--green2)); box-shadow: 0 3px 0 #0d5a2c; animation: trialPulseG 1.8s ease-in-out infinite; }
@keyframes trialPulseG { 0%,100% { box-shadow: 0 3px 0 #0d5a2c, 0 0 0 0 rgba(42,211,107,.55); } 50% { box-shadow: 0 3px 0 #0d5a2c, 0 0 0 9px rgba(42,211,107,0); } }
.trial-card-result .trial-link { color: #2a63c7; }
.trial-card-result .trial-foot { color: #7a8bb0; }

/* ---------- boas-vindas: logo/capa do jogo menor ---------- */
.trial-cover { width: min(150px, 40vw, 20vh); }
@media (min-width: 820px) {
    .trial-card-intro .trial-cover { max-width: 280px; }
}
@media (max-height: 560px) and (max-width: 819px) { .trial-cover { width: min(110px, 26vh); } }

/* ---------- ícones SVG (resultado) ---------- */
.trial-card-result .trial-points .ico svg { width: 20px; height: 20px; }
.trial-card-result .trial-points li:nth-child(1) .ico { color: #d99a00; background: #fff4d1; }
.trial-card-result .trial-points li:nth-child(2) .ico { color: #2a63c7; background: #e3eeff; }
.trial-card-result .trial-points li:nth-child(3) .ico { color: #0f9d4a; background: #dcf7e7; }
.trial-card-result .btn-ico { width: 18px; height: 18px; vertical-align: -3px; margin-right: 6px; }
.trial-card-result .trial-link .btn-ico { width: 14px; height: 14px; margin-right: 4px; vertical-align: -2px; }
