@import"https://fonts.googleapis.com/css2?family=Outfit:wght@400;600;700;900&family=Orbitron:wght@700;900&family=Exo+2:wght@400;700;900&display=swap";:root{--ocean-deep: #020b18;--ocean-mid: #041f3b;--ocean-light: #063055;--cyan: #00d4ff;--cyan-glow: rgba(0,212,255,.45);--teal: #00ffd0;--teal-glow: rgba(0,255,208,.35);--gold: #ffbe42;--gold-glow: rgba(255,190,66,.5);--coral: #ff6b6b;--border-cyan: rgba(0,212,255,.4)}.ocean-app *,.ocean-app *:before,.ocean-app *:after{box-sizing:border-box;margin:0;padding:0;-webkit-user-select:none;user-select:none}.ocean-app{font-family:Outfit,sans-serif;width:100%;max-width:980px;margin:0 auto;display:flex;flex-direction:column;min-height:100dvh;position:relative;overflow:hidden;background:radial-gradient(ellipse at 20% 0%,#0a2a4a 0%,transparent 55%),radial-gradient(ellipse at 80% 100%,#031a30 0%,transparent 55%),linear-gradient(180deg,#020f1f,#010812);color:#fff}.ocean-login{justify-content:center;align-items:center}.ocean-login-box{text-align:center;padding:48px 24px}.ocean-login-box p{margin-top:16px;color:#fff9;font-size:.95rem}.ocean-login-box a{color:var(--cyan)}.bubbles-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;overflow:hidden}.bubble{position:absolute;bottom:-20px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#00d4ff59,#0064c80d);border:1px solid rgba(0,212,255,.2);animation:bubbleRise linear infinite}@keyframes bubbleRise{0%{transform:translateY(0) scale(1);opacity:.6}80%{opacity:.4}to{transform:translateY(-110vh) scale(1.25);opacity:0}}.ocean-popup{position:absolute;top:0;right:0;bottom:0;left:0;z-index:200;display:flex;align-items:center;justify-content:center;pointer-events:none}.ocean-popup-inner{background:#020b18eb;border:3px solid var(--cyan);border-radius:18px;padding:18px 40px;box-shadow:0 0 30px var(--cyan-glow),inset 0 0 20px #00d4ff14;animation:popIn .3s cubic-bezier(.175,.885,.32,1.275);max-width:88vw;text-align:center}.ocean-popup-inner.popup-win{border-color:var(--gold);box-shadow:0 0 30px var(--gold-glow)}.ocean-popup-inner.popup-lose{border-color:#334;box-shadow:none}.ocean-popup-inner h2{font-family:Orbitron,monospace;font-size:clamp(1.3rem,5vw,2.4rem);color:var(--cyan);letter-spacing:2px}.ocean-popup-inner.popup-win h2{color:var(--gold);text-shadow:0 0 12px var(--gold-glow)}.ocean-popup-inner.popup-lose h2{color:#556}@keyframes popIn{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}.ocean-header{position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:10px 16px 8px;background:linear-gradient(90deg,#020b18f2,#041f3bf2,#020b18f2);border-bottom:1px solid var(--border-cyan);gap:8px;flex-shrink:0}.oh-balance{display:flex;flex-direction:column;align-items:center;background:#00d4ff14;border:1.5px solid var(--border-cyan);border-radius:14px;padding:4px 14px;min-width:90px}.oh-label{font-size:.58rem;text-transform:uppercase;letter-spacing:1.5px;color:var(--cyan);line-height:1}.oh-value{font-size:1.1rem;font-weight:700;color:var(--teal);line-height:1.25}.oh-title{flex:1;text-align:center;flex-shrink:0}.ocean-title-main{font-family:Orbitron,monospace;font-size:clamp(1.2rem,3.5vw,2.2rem);font-weight:900;color:var(--cyan);text-shadow:0 0 10px var(--cyan-glow),0 0 25px rgba(0,212,255,.25);letter-spacing:4px;line-height:1}.title-accent{color:var(--teal);margin-left:6px}.ocean-title-sub{font-family:"Exo 2",sans-serif;font-size:clamp(.6rem,1.5vw,.85rem);color:#00d4ff99;letter-spacing:5px;text-transform:uppercase}.oh-win-badge{background:linear-gradient(135deg,var(--gold),#ff9900);border-radius:14px;padding:5px 14px;font-family:Orbitron,monospace;font-size:.72rem;font-weight:700;letter-spacing:1.5px;color:#fff;box-shadow:0 0 14px var(--gold-glow);animation:badgePulse .75s infinite alternate}@keyframes badgePulse{0%{transform:scale(1)}to{transform:scale(1.06)}}.oh-jackpot{text-align:right;flex-shrink:0}.oh-j-label{font-size:.55rem;color:#00d4ff8c;text-transform:uppercase;letter-spacing:.8px}.oh-j-val{font-size:.9rem;font-weight:700;color:var(--gold)}.ocean-board{position:relative;z-index:5;flex:1;display:flex;justify-content:center;align-items:center;padding:clamp(8px,2vw,16px) clamp(6px,1.5vw,12px);background:radial-gradient(ellipse at center,rgba(0,40,80,.5) 0%,transparent 80%);min-height:clamp(260px,45vw,420px)}.ocean-board-frame{position:absolute;top:0;right:0;bottom:0;left:0;border:2.5px solid var(--cyan);box-shadow:0 0 20px var(--cyan-glow),inset 0 0 20px #00d4ff14;pointer-events:none;z-index:10}.ocean-board-inner{display:flex;align-items:center;justify-content:center;width:100%;height:100%;position:relative}.ocean-title-side{position:absolute;top:50%;transform:translateY(-50%);font-family:Orbitron,monospace;font-weight:900;font-size:clamp(1rem,2vw,1.6rem);color:var(--cyan);opacity:.35;text-shadow:0 0 8px var(--cyan-glow);line-height:1.3;text-align:center}.left-side{left:clamp(4px,1.5vw,12px)}.right-side{right:clamp(4px,1.5vw,12px)}.reel-grid{display:flex;flex-direction:row;gap:clamp(4px,1.2vw,10px);width:clamp(86%,90%,90%);height:90%;padding:clamp(6px,1.5vw,10px)}.ocean-reel{flex:1;display:flex;flex-direction:column;gap:clamp(4px,1vw,8px)}.ocean-cell{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(180deg,#002850b3,#001432e6);border:2px solid rgba(0,212,255,.25);border-radius:clamp(6px,1.2vw,10px);overflow:hidden;position:relative;box-shadow:inset 0 0 14px #00003280;transition:border-color .15s,box-shadow .15s}.ocean-cell img{width:76%;height:76%;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.7));pointer-events:none}.cell-label{font-size:clamp(.38rem,1vw,.52rem);font-weight:700;color:#00d4ff80;text-transform:uppercase;letter-spacing:.7px;margin-top:2px}.ocean-cell.cell-win{border-color:var(--gold);box-shadow:0 0 24px var(--gold-glow),inset 0 0 20px #ffbe421f;animation:cellPulse .65s ease-in-out infinite alternate}@keyframes cellPulse{0%{transform:scale(1);filter:brightness(1)}to{transform:scale(1.07);filter:brightness(1.4)}}.ocean-reel.reel-spin .ocean-cell img{filter:blur(8px) brightness(1.3);transform:scaleY(1.2)}.ocean-reel.reel-spin{animation:reelShake .06s linear infinite}@keyframes reelShake{0%{transform:translateY(-4px)}50%{transform:translateY(0)}to{transform:translateY(4px)}}.ocean-controls{position:relative;z-index:10;flex-shrink:0;background:linear-gradient(90deg,#020b18fa,#001e37fa,#020b18fa);border-top:1px solid var(--border-cyan);padding:10px 14px;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}.oc-presets{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}.oc-preset{background:#00d4ff0f;border:1.5px solid rgba(0,212,255,.2);color:#00d4ffa6;border-radius:8px;padding:5px 9px;font-size:.68rem;font-weight:600;cursor:pointer;transition:all .15s}.oc-preset.active,.oc-preset:hover:not(:disabled){border-color:var(--gold);color:var(--gold);background:#ffbe421a;box-shadow:0 0 8px #ffbe4240}.oc-preset:disabled{opacity:.35;cursor:not-allowed}.oc-bet-row{display:flex;align-items:center;gap:6px;flex-shrink:0}.oc-adj{background:#00d4ff1a;border:1.5px solid var(--border-cyan);color:var(--cyan);width:30px;height:30px;border-radius:50%;font-size:1.1rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s}.oc-adj:hover:not(:disabled){background:#00d4ff38}.oc-adj:disabled{opacity:.35;cursor:not-allowed}.oc-bet-pill{display:flex;flex-direction:column;align-items:center;background:#00d4ff14;border:1.5px solid var(--border-cyan);border-radius:14px;padding:4px 14px;min-width:72px}.oc-bet-lbl{font-size:.52rem;color:var(--cyan);text-transform:uppercase;letter-spacing:1px;line-height:1}.oc-bet-val{font-size:1rem;font-weight:700;color:var(--teal);line-height:1.25}.oc-spin{width:clamp(60px,11vw,78px);height:clamp(60px,11vw,78px);border-radius:50%;background:radial-gradient(circle at 30% 30%,#00e5ff,#07a);border:3.5px solid var(--teal);box-shadow:0 0 20px var(--cyan-glow),0 0 40px #00d4ff33,inset 0 0 12px #ffffff40;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .1s;flex-shrink:0}.oc-spin:hover:not(:disabled){transform:scale(1.06);box-shadow:0 0 30px var(--cyan-glow),0 0 60px #00d4ff4d}.oc-spin:active:not(:disabled){transform:scale(.94)}.oc-spin:disabled{opacity:.5;cursor:not-allowed}.oc-spin.spinning{box-shadow:0 0 30px var(--teal-glow),0 0 60px #00ffd040;animation:spinGlow .6s infinite alternate}@keyframes spinGlow{0%{box-shadow:0 0 20px var(--cyan-glow)}to{box-shadow:0 0 40px var(--teal-glow),0 0 70px #00ffd066}}.spin-arrow{font-size:2rem;color:#fff;filter:drop-shadow(1px 1px 0 rgba(0,0,0,.4));margin-left:4px}.spin-ring{width:28px;height:28px;border:3px solid rgba(255,255,255,.2);border-top-color:#fff;border-radius:50%;animation:ringSpin .7s linear infinite}@keyframes ringSpin{to{transform:rotate(360deg)}}.oc-max{background:#00d4ff14;border:1.5px solid var(--border-cyan);color:var(--cyan);width:50px;height:50px;border-radius:50%;font-family:Orbitron,monospace;font-size:.6rem;font-weight:700;cursor:pointer;line-height:1.2;text-align:center;transition:all .15s}.oc-max:hover:not(:disabled){border-color:var(--gold);color:var(--gold)}.oc-max:disabled{opacity:.35;cursor:not-allowed}.ocean-status{position:relative;z-index:10;display:flex;justify-content:space-between;align-items:center;background:#00050fe6;padding:5px 14px;border-top:1px solid rgba(0,212,255,.12);font-size:.68rem;color:#00d4ff66;text-transform:uppercase;letter-spacing:.5px;flex-shrink:0}@media(max-width:480px){.ocean-title-side,.oh-jackpot{display:none}.ocean-header{padding:8px 10px 6px}.ocean-title-main{font-size:1.15rem;letter-spacing:2px}.ocean-title-sub{font-size:.55rem;letter-spacing:3px}.oh-balance{min-width:72px;padding:3px 10px}.oh-value{font-size:.95rem}.ocean-board{min-height:240px;padding:5px 3px}.reel-grid{width:100%;padding:4px;gap:3px}.ocean-cell{border-radius:6px;border-width:1.5px}.ocean-controls{padding:8px;gap:7px}.oc-preset{padding:3px 7px;font-size:.6rem}.oc-adj{width:26px;height:26px;font-size:.95rem}.oc-bet-pill{min-width:60px;padding:3px 10px}.oc-bet-val{font-size:.9rem}.oc-max{width:44px;height:44px;font-size:.55rem}.ocean-status{font-size:.58rem;padding:4px 10px}}@media(min-width:481px)and (max-width:768px){.ocean-board{min-height:300px}.ocean-title-side{font-size:1.1rem;opacity:.25}}