/* v17: cenas dos animais, do farol e da carreira (faixas de cinema, legendas «miau» com tradução, nome do sítio, saltar) */
#bcine { position:fixed; inset:0; z-index:40; pointer-events:none; opacity:0; transition:opacity .35s; }
#bcine.show { opacity:1; }
#bcine .bar { position:absolute; left:0; right:0; height:9vh; background:#000; transition:transform .5s ease; }
#bcine .bar.t { top:0; transform:translateY(-100%); } #bcine .bar.b { bottom:0; transform:translateY(100%); }
#bcine.show .bar { transform:none; }
#bcine .cap { position:absolute; left:50%; bottom:calc(9vh + 18px); transform:translate(-50%,8px); max-width:min(720px,88vw); text-align:center; color:#fff; opacity:0; transition:opacity .25s, transform .25s; text-shadow:0 2px 12px rgba(0,0,0,.85); }
#bcine .cap.on { opacity:1; transform:translate(-50%,0); }
#bcine .cap b { display:block; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:#ffd23f; margin-bottom:3px; }
#bcine .cap span { display:block; font-size:clamp(18px,2.6vw,26px); font-weight:800; line-height:1.2; }
#bcine .cap em { display:block; font-size:clamp(13px,1.7vw,16px); font-style:italic; color:#e6eef5; margin-top:4px; }
#bcine .cap em:empty { display:none; }
#bcine .place { position:absolute; left:max(24px,env(safe-area-inset-left)); top:calc(9vh + 18px); color:#fff; opacity:0; transform:translateX(-12px); text-shadow:0 2px 10px rgba(0,0,0,.8); }
#bcine .place.on { animation:bplace 3.6s ease forwards; }
#bcine .place b { display:block; font-size:clamp(20px,3vw,32px); font-weight:900; letter-spacing:-.01em; border-left:4px solid #ffd23f; padding-left:10px; }
#bcine .place small { display:block; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:#ffd23f; padding-left:14px; margin-bottom:2px; }
#bcine .place small:empty { display:none; }
@keyframes bplace { 0% { opacity:0; transform:translateX(-12px); } 12% { opacity:1; transform:none; } 82% { opacity:1; transform:none; } 100% { opacity:0; transform:translateX(6px); } }
#bcine .skip { position:absolute; right:max(16px,env(safe-area-inset-right)); bottom:calc(9vh + 14px); pointer-events:auto; background:rgba(0,0,0,.55); color:#fff; border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:8px 14px; font-weight:700; font-size:13px; }
@media (max-height:500px) { #bcine .bar { height:7vh; } #bcine .cap { bottom:calc(7vh + 10px); } #bcine .place { top:calc(7vh + 10px); } #bcine .skip { bottom:calc(7vh + 8px); padding:6px 12px; } }
/* durante uma cena não fica nenhum controlo do jogo à vista */
body.bcine-on #hud, body.bcine-on #runBtn, body.bcine-on #joy, body.bcine-on #drive, body.bcine-on #btnE, body.bcine-on #skipBtn, body.bcine-on #tip, body.bcine-on #toast, body.bcine-on #prompt, body.bcine-on #ritmo, body.bcine-on #olho { opacity:0 !important; pointer-events:none !important; }
/* v17 (auditoria dos botões): por baixo de um diálogo, painel, mapa ou pesca os controlos de toque escondem-se; no barco não há botão de correr */
body.ui-block #runBtn, body.ui-block #drive, body.ui-block #btnE, body.ui-block #joy { opacity:0 !important; pointer-events:none !important; }
body.onboat #runBtn { display:none !important; }

/* v18: ecrã de carregar do Mercado do Peixe e o mini-jogo por cima */
#mload { position:fixed; inset:0; z-index:60; display:grid; place-items:center; background:radial-gradient(circle at 50% 40%, #2a3f5c, #0c1622 70%); opacity:0; pointer-events:none; transition:opacity .35s; }
#mload.show { opacity:1; pointer-events:auto; }
#mload div { text-align:center; color:#fff; width:min(420px,80vw); }
#mload small { display:block; letter-spacing:.16em; text-transform:uppercase; font-size:12px; color:#ffd23f; }
#mload b { display:block; font-size:clamp(26px,5vw,40px); font-weight:900; margin:6px 0 16px; }
#mload i { display:block; height:6px; border-radius:3px; background:rgba(255,255,255,.18); overflow:hidden; }
#mload s { display:block; height:100%; width:0; background:linear-gradient(90deg,#ffd23f,#ff8a4d); }
#mload em { display:block; margin-top:10px; font-size:14px; color:#cfe0ec; }
#mini { position:fixed; inset:0; z-index:70; background:#0c1622; display:none; }
#mini.show { display:block; }
#mini iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
#mini .x { position:absolute; z-index:2; left:50%; transform:translateX(-50%); top:max(8px,env(safe-area-inset-top)); background:rgba(12,18,26,.85); color:#fff; border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:9px 16px; font-weight:800; font-size:14px; }