/** Shopify CDN: Minification failed

Line 68:0 Expected "}" to go with "{"

**/
/* Ocean background is forced via inline style in theme.liquid.
   This file provides overlays + extras. */

/* Bubbles (more visible) */
.bb-bubbles {
  position: fixed; inset: 0; pointer-events: none; z-index: 2;
  background-image:
    radial-gradient(10px 10px at 20% 90%, rgba(255,255,255,.22) 40%, transparent 41%),
    radial-gradient(8px 8px at 60% 100%, rgba(255,255,255,.16) 40%, transparent 41%),
    radial-gradient(12px 12px at 80% 95%, rgba(255,255,255,.20) 40%, transparent 41%),
    radial-gradient(9px 9px at 35% 98%, rgba(255,255,255,.14) 40%, transparent 41%);
  animation: bubbles 16s linear infinite;
  opacity: .45;
}
@keyframes bubbles {
  0%   { background-position: 0   0, 0   0, 0   0, 0   0; }
  100% { background-position: 0 -140vh, 0 -120vh, 0 -160vh, 0 -130vh; }
}

/* Animated top waves (SVG) */
.bb-waves {
  position: fixed; left: 0; right: 0; top: -20px; height: 140px; z-index: 3; pointer-events: none;
  background-repeat: repeat-x; background-size: 1200px 140px; opacity: .35;
  animation: waveSlide 18s linear infinite;
  background-image: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' width='1200' height='140' viewBox='0 0 1200 140'>\
    <path d='M0,80 C150,20 350,140 600,80 C850,20 1050,140 1200,80 L1200,140 L0,140 Z' fill='%2318E0FF' fill-opacity='0.25'/>\
  </svg>");
}
@keyframes waveSlide { 0% { background-position-x: 0; } 100% { background-position-x: 1200px; } }

/* Fish silhouettes drifting */
.bb-fish { position: fixed; inset: 0; pointer-events: none; z-index: 3; overflow: hidden; }
.bb-fish::before,
.bb-fish::after {
  content: ""; position: absolute; width: 160px; height: 64px; top: 30%;
  background-repeat: no-repeat; background-size: contain; opacity: .35;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.25));
  animation: swim 28s linear infinite;
}
.bb-fish::before {
  left: -200px;
  background-image: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 128'>\
    <path d='M10,70 C40,40 120,30 210,60 C260,80 300,78 310,70 C300,84 260,100 210,100 C120,100 40,96 10,70 Z' fill='%23CFF6FF' fill-opacity='.7'/>\
    <circle cx='250' cy='76' r='4' fill='%23081a2c'/>\
  </svg>");
}
.bb-fish::after {
  top: 60%; left: -260px; width: 200px; height: 72px; animation-delay: 8s;
  background-image: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 360 140'>\
    <path d='M20,80 C80,40 200,40 320,80 C300,90 260,110 210,110 C140,110 70,100 20,80 Z' fill='%2318E0FF' fill-opacity='.55'/>\
    <circle cx='285' cy='88' r='5' fill='%23061b2f'/>\
  </svg>");
}
@keyframes swim { 0% { transform: translateX(0); } 100% { transform: translateX(140vw); } }

/* Faint pier silhouettes at the bottom */
.bb-piers {
  position: fixed; left: 0; right: 0; bottom: 0; height: 140px; z-index: 2; pointer-events:none; opacity:.18;
  background-repeat: repeat-x; background-size: