/*
 * Dinho’S Daily Reef Premium 4.4.12
 * Modal UX / mídia premium.
 * Este arquivo é apenas apresentação: nenhuma regra de pontuação, missão,
 * anúncio, WPLoyalty ou persistência é alterada aqui.
 */

.ddr-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483000 !important;
    isolation: isolate !important;
}

.ddr-modal-backdrop {
    position: absolute !important;
    inset: 0 !important;
    background:
        radial-gradient(circle at 50% 0%, rgba(32,184,201,.18), transparent 38%),
        rgba(2,12,20,.86) !important;
    backdrop-filter: blur(12px) saturate(125%) !important;
}

.ddr-modal-box {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%,-50%) !important;
    width: min(1500px, 97vw) !important;
    height: min(940px, 96vh) !important;
    max-width: 1500px !important;
    max-height: 96vh !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid rgba(255,255,255,.7) !important;
    border-radius: 28px !important;
    background: #f7fbfc !important;
    box-shadow:
        0 40px 120px rgba(0,0,0,.48),
        0 0 0 1px rgba(32,184,201,.08),
        0 0 70px rgba(32,184,201,.12) !important;
    display: flex !important;
    flex-direction: column !important;
}

#ddr-modal-content {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

.ddr-modal-close {
    position: absolute !important;
    right: 16px !important;
    top: 14px !important;
    z-index: 100 !important;
    width: 44px !important;
    height: 44px !important;
    border: 1px solid rgba(255,255,255,.28) !important;
    border-radius: 50% !important;
    background: rgba(4,35,47,.82) !important;
    color: #fff !important;
    font-size: 27px !important;
    line-height: 1 !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.24) !important;
    backdrop-filter: blur(8px) !important;
    cursor: pointer !important;
    transition: transform .2s ease, background .2s ease, box-shadow .2s ease !important;
}
.ddr-modal-close:hover {
    transform: scale(1.07) rotate(3deg) !important;
    background: #0b6680 !important;
    box-shadow: 0 12px 30px rgba(0,0,0,.32) !important;
}

.ddr-modal-inner,
.ddr-game-modal {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}

.ddr-modal-head {
    position: relative !important;
    flex: 0 0 auto !important;
    padding: 22px 78px 16px 28px !important;
    background: linear-gradient(180deg,#fff 0%,#f8fcfd 100%) !important;
    border-bottom: 1px solid #e3eef0 !important;
}
.ddr-modal-head h3 {
    margin: 2px 0 6px !important;
    color: #082f3d !important;
    font-size: clamp(20px,2.1vw,30px) !important;
    line-height: 1.12 !important;
    letter-spacing: -.025em !important;
}
.ddr-modal-head p {
    margin: 0 !important;
    color: #647b84 !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
}
.ddr-video-kicker {
    margin-bottom: 5px !important;
    color: #0b8295 !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    letter-spacing: .16em !important;
}

.ddr-content-toolbar {
    position: absolute !important;
    right: 70px !important;
    top: 18px !important;
    z-index: 20 !important;
    padding: 0 !important;
}
.ddr-content-toolbar button {
    border: 1px solid #d5e7ea !important;
    border-radius: 12px !important;
    padding: 9px 13px !important;
    background: #fff !important;
    color: #082f3d !important;
    font-weight: 800 !important;
    font-size: 11px !important;
    cursor: pointer !important;
    box-shadow: 0 5px 16px rgba(8,45,58,.08) !important;
}
.ddr-content-toolbar button:hover {
    border-color: #8ddbe2 !important;
    color: #087489 !important;
    transform: translateY(-1px) !important;
}

/* Área de vídeo/blog: ocupa TODO o espaço entre cabeçalho e contador. */
.ddr-video-wrap,
.ddr-content-viewer {
    position: relative !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    overflow: hidden !important;
    background: #071d27 !important;
}
.ddr-blog-mission-modal .ddr-content-viewer {
    background: #eef5f7 !important;
}
.ddr-content-frame,
.ddr-video-wrap iframe,
.ddr-content-viewer iframe {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 100% !important;
    min-height: 0 !important;
    max-width: none !important;
    border: 0 !important;
    background: #fff !important;
}
.ddr-video-wrap iframe {
    background: #000 !important;
}

/* Loading e estado inicial não podem encolher a mídia. */
.ddr-video-loading,
.ddr-video-await {
    position: absolute !important;
    inset: 0 !important;
    z-index: 5 !important;
    display: grid !important;
    place-content: center !important;
    justify-items: center !important;
    gap: 10px !important;
    padding: 30px !important;
    text-align: center !important;
    color: #fff !important;
    background: linear-gradient(180deg,rgba(3,25,34,.5),rgba(3,18,25,.72)) !important;
    pointer-events: none !important;
}
.ddr-video-await span {
    width: 70px !important;
    height: 70px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,.12) !important;
    border: 1px solid rgba(255,255,255,.24) !important;
    font-size: 28px !important;
    backdrop-filter: blur(8px) !important;
}
.ddr-video-await strong { font-size: 18px !important; }
.ddr-video-await small { opacity: .72 !important; }

/* Contador sempre fica visível e separado da mídia. */
.ddr-timer {
    position: relative !important;
    z-index: 20 !important;
    flex: 0 0 auto !important;
    min-height: 72px !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 13px 24px !important;
    background: #fff !important;
    border-top: 1px solid #dcebee !important;
}
.ddr-timer-label {
    min-width: 145px !important;
}
.ddr-timer-label b {
    display: block !important;
    color: #082f3d !important;
    font-size: 20px !important;
}
.ddr-timer-label small {
    color: #71858d !important;
    font-size: 10px !important;
}
.ddr-timer-bar {
    flex: 1 1 auto !important;
    height: 9px !important;
    overflow: hidden !important;
    border-radius: 99px !important;
    background: #e4eef0 !important;
}
.ddr-timer-bar span {
    display: block !important;
    width: 0 !important;
    height: 100% !important;
    border-radius: inherit !important;
    background: linear-gradient(90deg,#0b6680,#20b8c9,#67dfcf) !important;
    transition: width .25s linear !important;
}

/* Gate do anúncio também recebe tratamento premium. */
.ddr-ad-gate {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 18px !important;
    padding: 34px !important;
    background:
        radial-gradient(circle at 50% 10%,rgba(32,184,201,.18),transparent 35%),
        linear-gradient(145deg,#f7fdfe,#eaf6f8) !important;
}
.ddr-ad-gate-head { text-align: center !important; }
.ddr-ad-icon {
    width: 68px !important;
    height: 68px !important;
    margin: 0 auto 12px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 22px !important;
    background: #fff !important;
    box-shadow: 0 12px 32px rgba(8,45,58,.12) !important;
    font-size: 30px !important;
}
.ddr-ad-gate-head h3 {
    margin: 0 0 6px !important;
    color: #082f3d !important;
    font-size: 28px !important;
}
.ddr-ad-gate-head p { margin: 0 !important; color: #70848c !important; }
.ddr-modal-ad {
    width: min(900px,100%) !important;
    min-height: 250px !important;
    max-height: 52vh !important;
    overflow: hidden !important;
    padding: 12px !important;
    border: 1px solid #dcecef !important;
    border-radius: 22px !important;
    background: #fff !important;
    box-shadow: 0 15px 45px rgba(8,45,58,.08) !important;
}
.ddr-modal-ad .adsbygoogle {
    display: block !important;
    width: 100% !important;
    min-height: 220px !important;
}
.ddr-ad-countdown {
    width: min(650px,100%) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    color: #61777f !important;
    text-align: center !important;
}
.ddr-ad-countdown b {
    min-width: 58px !important;
    padding: 9px 12px !important;
    border-radius: 14px !important;
    background: #082f3d !important;
    color: #fff !important;
    font-size: 20px !important;
}
.ddr-ad-continue {
    min-width: 220px !important;
    border: 0 !important;
    border-radius: 15px !important;
    padding: 14px 22px !important;
    background: linear-gradient(135deg,#062c3a,#0b6680) !important;
    color: #fff !important;
    font-weight: 900 !important;
    cursor: pointer !important;
    box-shadow: 0 12px 30px rgba(6,44,58,.2) !important;
}
.ddr-ad-continue:disabled { opacity: .42 !important; cursor: not-allowed !important; }

/* Produtos e jogos ganham área útil sem esmagar conteúdo. */
.ddr-product-modal { overflow: auto !important; }
.ddr-product-list { flex: 1 1 auto !important; min-height: 0 !important; overflow: auto !important; padding: 22px !important; }
.ddr-product-choice {
    display: grid !important;
    grid-template-columns: 82px 1fr auto !important;
    gap: 16px !important;
    align-items: center !important;
    padding: 15px !important;
    margin-bottom: 10px !important;
    border: 1px solid #deebee !important;
    border-radius: 18px !important;
    background: #fff !important;
}
.ddr-product-thumb { width:82px!important;height:82px!important;border-radius:15px!important;overflow:hidden!important;background:#eef7f8!important;display:grid!important;place-items:center!important;font-size:28px!important }
.ddr-product-thumb img { width:100%!important;height:100%!important;object-fit:cover!important }
.ddr-product-info strong { display:block!important;color:#082f3d!important;font-size:14px!important }
.ddr-product-info span { display:block!important;margin-top:5px!important;color:#13835e!important;font-weight:900!important }
.ddr-product-info small { display:block!important;margin-top:6px!important;color:#71858d!important }
.ddr-game-modal { overflow: hidden !important; }
.ddr-memory-grid {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: auto !important;
    align-content: center !important;
    padding: 24px !important;
}
.ddr-quiz-options { flex: 1 1 auto !important; overflow:auto!important; padding:24px!important; }
.ddr-bubble-arena { flex:1 1 auto!important; min-height:0!important; }

@media (max-width: 760px) {
    .ddr-modal-box {
        width: calc(100vw - 8px) !important;
        max-width: calc(100vw - 8px) !important;
        height: calc(100dvh - 8px) !important;
        max-height: calc(100dvh - 8px) !important;
        border-radius: 20px !important;
    }
    .ddr-modal-close {
        right: 9px !important;
        top: 9px !important;
        width: 40px !important;
        height: 40px !important;
    }
    .ddr-modal-head {
        padding: 16px 60px 12px 16px !important;
    }
    .ddr-modal-head h3 { font-size: 20px !important; }
    .ddr-content-toolbar { right: 58px !important; top: 13px !important; }
    .ddr-content-toolbar button { padding: 7px 9px !important; font-size: 10px !important; }
    .ddr-timer {
        min-height: 64px !important;
        padding: 10px 14px !important;
        gap: 9px !important;
    }
    .ddr-timer-label { min-width: 92px !important; }
    .ddr-timer-label b { font-size: 17px !important; }
    .ddr-product-choice { grid-template-columns: 60px 1fr !important; }
    .ddr-product-thumb { width:60px!important;height:60px!important }
    .ddr-product-choice .ddr-primary { grid-column: 1 / -1 !important; width:100%!important }
    .ddr-ad-gate { padding: 20px 12px !important; gap: 12px !important; }
    .ddr-modal-ad { min-height: 190px !important; max-height: 42vh !important; }
    .ddr-modal-ad .adsbygoogle { min-height: 170px !important; }
    .ddr-ad-countdown { flex-direction: column !important; }
}

/* ===== Dinho'S Daily Reef 4.4.13 — jogos e mídia premium ===== */
.ddr-modal-box{height:min(980px,98vh)!important;max-height:98vh!important}
.ddr-video-wrap,.ddr-content-viewer{min-height:420px!important}
.ddr-video-mission-modal .ddr-video-wrap{flex:1 1 0!important}
.ddr-content-video{display:block!important;width:100%!important;height:100%!important;min-height:420px!important;object-fit:contain!important;background:#000!important}
.ddr-video-wrap.started .ddr-video-await{display:none!important}
.ddr-video-loading{transition:opacity .18s ease!important}
.ddr-bubble-game{background:linear-gradient(180deg,#f7fdff 0%,#eaf8fb 100%)!important}
.ddr-bubble-game .ddr-modal-head{padding-bottom:13px!important}
.ddr-bubble-hud{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;padding:10px 22px!important;background:rgba(255,255,255,.9)!important;border-bottom:1px solid #d8edf1!important}
.ddr-bubble-hud .ddr-game-score{display:flex!important;align-items:center!important;gap:9px!important;flex-wrap:wrap!important}
.ddr-bubble-hud .ddr-game-score span{font-size:12px!important;font-weight:800!important;color:#53717b!important}
.ddr-bubble-hud .ddr-game-score b{font-size:28px!important;color:#07566c!important;line-height:1!important}
.ddr-bubble-hud .ddr-game-score small{font-size:10px!important;color:#78919a!important}
.ddr-bubble-combo{padding:8px 13px!important;border-radius:999px!important;background:#e4f5f8!important;color:#0a6d82!important;font-size:11px!important;font-weight:950!important;letter-spacing:.08em!important;transition:transform .15s ease,box-shadow .15s ease,background .15s ease!important}
.ddr-bubble-combo.hot{background:#fff0bf!important;box-shadow:0 0 24px rgba(255,194,45,.45)!important;transform:scale(1.06)!important;color:#9a6400!important}
.ddr-bubble-arena{position:relative!important;overflow:hidden!important;flex:1 1 0!important;min-height:440px!important;margin:0!important;background:radial-gradient(circle at 50% 100%,rgba(32,184,201,.24),transparent 45%),linear-gradient(180deg,#063d56,#062a40 55%,#041f31)!important;touch-action:manipulation!important;isolation:isolate!important}
.ddr-bubble-arena:before,.ddr-bubble-arena:after{content:"";position:absolute;inset:auto -10% -45px;height:130px;border-radius:50%;background:rgba(42,197,213,.09);filter:blur(3px);pointer-events:none!important}
.ddr-bubble-arena:after{bottom:25px;height:80px;background:rgba(255,255,255,.045);animation:ddr-wave 4s ease-in-out infinite}
.ddr-bubble{appearance:none!important;border:1px solid rgba(255,255,255,.72)!important;border-radius:50%!important;padding:0!important;display:grid!important;place-items:center!important;background:radial-gradient(circle at 30% 24%,rgba(255,255,255,.98) 0 8%,rgba(177,245,255,.82) 25%,rgba(40,188,214,.48) 55%,rgba(9,98,133,.22) 75%,rgba(255,255,255,.05) 100%)!important;box-shadow:inset 8px 7px 14px rgba(255,255,255,.42),inset -7px -9px 15px rgba(0,63,91,.22),0 7px 20px rgba(0,0,0,.25),0 0 24px rgba(56,214,232,.2)!important;color:#fff!important;cursor:pointer!important;transform:translateZ(0)!important;transition:transform .13s ease,opacity .18s ease,filter .13s ease!important;animation:ddr-bubble-float 2.7s ease-in-out infinite!important}
.ddr-bubble span{font-size:clamp(22px,3vw,36px)!important;filter:drop-shadow(0 3px 5px rgba(0,35,50,.22))!important;pointer-events:none!important;user-select:none!important}
.ddr-bubble:hover{transform:scale(1.12)!important;filter:brightness(1.12)!important}
.ddr-bubble:active{transform:scale(.82)!important}
.ddr-bubble.popped{pointer-events:none!important;animation:ddr-bubble-pop .26s ease forwards!important}
.ddr-bubble-escape{animation:ddr-bubble-escape .28s ease forwards!important}
.ddr-bubble-burst{position:absolute!important;width:4px!important;height:4px!important;z-index:90!important;pointer-events:none!important}
.ddr-bubble-burst i{position:absolute!important;width:8px!important;height:8px!important;border-radius:50%!important;background:rgba(190,250,255,.95)!important;box-shadow:0 0 10px rgba(95,232,255,.8)!important;animation:ddr-burst-particle .55s ease-out forwards!important}
.ddr-bubble-burst i:nth-child(1){--dx:-42px;--dy:-18px}.ddr-bubble-burst i:nth-child(2){--dx:40px;--dy:-25px}.ddr-bubble-burst i:nth-child(3){--dx:-28px;--dy:34px}.ddr-bubble-burst i:nth-child(4){--dx:32px;--dy:31px}.ddr-bubble-burst i:nth-child(5){--dx:0;--dy:-42px}
.ddr-bubble-burst b{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%) scale(.5)!important;color:#fff!important;font-size:18px!important;font-weight:950!important;text-shadow:0 2px 7px rgba(0,0,0,.55)!important;animation:ddr-hit-number .55s ease-out forwards!important;white-space:nowrap!important}
.ddr-hit-feedback{position:absolute!important;z-index:100!important;transform:translateX(-50%)!important;color:#fff!important;font-weight:950!important;font-size:15px!important;text-shadow:0 2px 10px rgba(0,0,0,.65)!important;pointer-events:none!important;animation:ddr-hit-float .55s ease-out forwards!important;white-space:nowrap!important}
.ddr-bubble-game .ddr-game-timer{min-height:70px!important}
@keyframes ddr-bubble-float{0%,100%{margin-top:0}50%{margin-top:-7px}}
@keyframes ddr-bubble-pop{0%{transform:scale(1);opacity:1}45%{transform:scale(1.38);opacity:.9;filter:brightness(1.45)}100%{transform:scale(0);opacity:0}}
@keyframes ddr-bubble-escape{to{transform:translateY(-35px) scale(.25);opacity:0}}
@keyframes ddr-burst-particle{0%{transform:translate(0,0) scale(.4);opacity:1}100%{transform:translate(var(--dx),var(--dy)) scale(1.2);opacity:0}}
@keyframes ddr-hit-number{0%{transform:translate(-50%,-50%) scale(.5);opacity:0}20%{transform:translate(-50%,-75%) scale(1.15);opacity:1}100%{transform:translate(-50%,-145%) scale(1);opacity:0}}
@keyframes ddr-hit-float{0%{opacity:0;transform:translate(-50%,10px) scale(.7)}25%{opacity:1;transform:translate(-50%,0) scale(1.05)}100%{opacity:0;transform:translate(-50%,-35px) scale(1)}}
@keyframes ddr-wave{0%,100%{transform:translateX(-2%) scaleX(1)}50%{transform:translateX(2%) scaleX(1.04)}}
@media(max-width:760px){
 .ddr-modal-box{width:calc(100vw - 6px)!important;max-width:calc(100vw - 6px)!important;height:calc(100dvh - 6px)!important;max-height:calc(100dvh - 6px)!important;border-radius:18px!important}
 .ddr-video-wrap,.ddr-content-viewer,.ddr-content-video{min-height:0!important}
 .ddr-bubble-hud{padding:8px 12px!important}
 .ddr-bubble-hud .ddr-game-score b{font-size:23px!important}
 .ddr-bubble-arena{min-height:0!important}
 .ddr-bubble{min-width:42px!important;min-height:42px!important}
 .ddr-bubble-game .ddr-modal-head{padding:13px 55px 10px 13px!important}
 .ddr-bubble-game .ddr-modal-head p{font-size:11px!important}
 .ddr-bubble-game .ddr-game-timer{min-height:62px!important;padding:8px 12px!important}
}

/* ===== 4.4.14 — player de vídeo realmente clicável ===== */
.ddr-embed-player{position:relative;width:100%;height:100%;min-height:0;background:#000;overflow:hidden}
.ddr-embed-player .ddr-content-frame{position:absolute!important;inset:0!important;z-index:2!important;pointer-events:auto!important}
.ddr-video-start{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-width:240px;padding:20px 26px;border:1px solid rgba(255,255,255,.28);border-radius:22px;background:rgba(4,28,38,.78);color:#fff;box-shadow:0 20px 60px rgba(0,0,0,.42),0 0 35px rgba(32,184,201,.16);backdrop-filter:blur(12px);cursor:pointer;transition:transform .2s ease,opacity .2s ease,background .2s ease}
.ddr-video-start:hover{transform:translate(-50%,-50%) scale(1.04);background:rgba(5,45,58,.9)}
.ddr-video-start span{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#20b8c9,#087b91);font-size:25px;padding-left:4px;box-shadow:0 8px 28px rgba(32,184,201,.35)}
.ddr-video-start strong{font-size:17px}.ddr-video-start small{font-size:11px;opacity:.72}.ddr-video-start.is-starting{opacity:0;transform:translate(-50%,-50%) scale(1.08);pointer-events:none}
.ddr-video-wrap.started .ddr-video-start{display:none}
@media(max-width:760px){.ddr-video-start{min-width:210px;padding:17px 20px}.ddr-video-start span{width:56px;height:56px}.ddr-video-start strong{font-size:15px}}

/* 4.4.15: nunca cubra o player com a mensagem de espera */
.ddr-video-await{display:none!important;pointer-events:none!important;visibility:hidden!important;}
.ddr-video-wrap .ddr-content-frame{z-index:2!important;}
.ddr-embed-player{position:relative!important;width:100%!important;height:100%!important;min-height:420px!important;}


/* ===== 4.4.16 — player sem máscara + início confiável dos 60s ===== */
.ddr-video-wrap .ddr-video-loading,
.ddr-video-wrap .ddr-video-await,
.ddr-video-wrap .ddr-start-overlay,
.ddr-video-wrap .ddr-video-start,
.ddr-video-wrap .ddr-video-poster{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important;}
.ddr-video-wrap .ddr-content-frame{filter:none!important;opacity:1!important;pointer-events:auto!important;}
.ddr-video-hit-area{position:absolute!important;inset:0!important;z-index:7!important;width:100%!important;height:100%!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;opacity:0!important;cursor:pointer!important;pointer-events:auto!important;}
.ddr-video-wrap.started .ddr-video-hit-area{display:none!important;pointer-events:none!important;}
