:root{--bg:#06131e;--panel:#0c2433;--panel2:#12394a;--text:#f7fcfd;--muted:#a8c5cc;--aqua:#79e3dd;--gold:#ffd47b;--line:rgba(255,255,255,.12);--r:24px}
*{box-sizing:border-box}html,body{margin:0;max-width:100%;overflow-x:hidden;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}button,input,select,textarea{font:inherit}button,.file-button{min-height:46px;touch-action:manipulation}
#app{max-width:1080px;margin:auto;padding:18px 15px 92px}.topbar{display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;padding:10px 0;background:rgba(6,19,30,.88);backdrop-filter:blur(14px);z-index:8}.brand{font-weight:900;letter-spacing:.12em}.screen{display:none}.screen.active{display:block}
.atmosphere{padding:42px 0 24px}.eyebrow,.label{font-size:.76rem;letter-spacing:.13em;text-transform:uppercase;color:var(--aqua);font-weight:800}.atmosphere h1,.section-head h1{font-size:clamp(2.2rem,10vw,4.6rem);line-height:.96;margin:.45rem 0 1rem}.lead{font-size:1.05rem;line-height:1.6;color:var(--muted);max-width:720px}.cta-row{display:flex;gap:10px;flex-wrap:wrap}.primary,.secondary,.ghost,.text-btn,.file-button{border:0;border-radius:16px;padding:13px 16px;font-weight:800;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.primary{background:var(--aqua);color:#06232c}.secondary{background:rgba(255,255,255,.08);color:white;border:1px solid var(--line)}.ghost,.text-btn{background:transparent;color:var(--text);border:1px solid var(--line)}.text-btn{padding:9px 12px}.full{width:100%;margin-top:10px}
.home-stack,.journey-list{display:grid;gap:12px}.card,.pass-card,.metric-card{background:linear-gradient(155deg,rgba(14,48,65,.95),rgba(7,28,41,.96));border:1px solid var(--line);border-radius:var(--r);padding:18px}.card h2{margin:.4rem 0}.weather-card,.fact-card,.section-head,.character-head{display:flex;align-items:center;justify-content:space-between;gap:14px}.weather-mark{font-size:2rem}.fact-card img{width:76px;height:76px;object-fit:cover;border-radius:20px}.section-head{padding:32px 0 18px}.section-head h1{font-size:clamp(2rem,8vw,3.8rem)}.notice,.privacy-note,.source-note{padding:12px 14px;border-left:3px solid var(--aqua);color:var(--muted);line-height:1.5}.form-grid{display:grid;gap:10px}.form-grid input,.form-grid select,.form-grid textarea,select,input,textarea{width:100%;background:#071b29;color:white;border:1px solid var(--line);border-radius:14px;padding:13px;min-height:46px}.form-grid textarea{min-height:90px}.journey-item{display:grid;gap:6px}.added-by-you{font-size:.75rem;color:var(--aqua)}.camera-shell{position:relative;background:#07394d;border-radius:24px;overflow:hidden;aspect-ratio:3/4;max-height:70vh}.camera-shell video{width:100%;height:100%;object-fit:cover}.camera-guide{position:absolute;inset:10%;border:2px solid rgba(255,255,255,.65);border-radius:20px;display:flex;align-items:flex-end;justify-content:center;padding:18px;pointer-events:none}.camera-guide span{background:rgba(6,55,70,.82);padding:8px 12px;border-radius:999px}.file-button input{display:none}.hidden{display:none!important}.ocean-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.metric-card span{display:block;color:var(--muted);font-size:.82rem}.metric-card strong{display:block;margin-top:5px}.character-head img{width:110px;height:110px;object-fit:cover;border-radius:28px}.companions{display:flex;gap:12px;margin-bottom:16px}.companions img{width:calc(50% - 6px);max-height:230px;object-fit:cover;border-radius:24px}.pass-card{background:linear-gradient(145deg,#0b5667,#0d2d48);padding:22px}.price{font-size:2.5rem;font-weight:900;color:var(--gold);margin:14px 0}.small,.muted{font-size:.86rem;color:var(--muted)}
.bottom-nav{position:fixed;bottom:12px;left:50%;transform:translateX(-50%);width:min(95%,620px);display:grid;grid-template-columns:repeat(5,1fr);background:rgba(5,18,28,.94);border:1px solid var(--line);border-radius:22px;padding:7px;backdrop-filter:blur(14px);z-index:10}.bottom-nav button{background:transparent;border:0;color:var(--muted);padding:10px 2px;font-size:.75rem;border-radius:14px}.bottom-nav button.active{background:rgba(121,227,221,.12);color:white}.toast{position:fixed;top:76px;left:50%;transform:translateX(-50%);background:#132c3d;border:1px solid var(--line);padding:12px 16px;border-radius:16px;z-index:20}.lock{position:fixed;inset:0;background:rgba(2,10,16,.93);display:grid;place-items:center;padding:20px;z-index:30}.lock-card{max-width:420px;text-align:center;background:#0d2838;border:1px solid var(--line);border-radius:28px;padding:24px}.lock-card img{width:120px;height:120px;object-fit:cover;border-radius:28px}
@media(min-width:700px){#app{padding:24px 28px 100px}.home-stack{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr 1fr}.form-grid textarea,.form-grid button{grid-column:1/-1}.ocean-grid{grid-template-columns:repeat(4,1fr)}.camera-shell{aspect-ratio:4/3;max-height:560px}.bottom-nav button{font-size:.82rem}}
@media(max-width:360px){.primary,.secondary,.ghost,.file-button{padding:12px 10px}.bottom-nav button{font-size:.68rem}.character-head img{width:82px;height:82px}.atmosphere{padding-top:28px}}
@media(orientation:landscape) and (max-height:600px){.camera-shell{aspect-ratio:16/9;max-height:55vh}.atmosphere{padding-top:20px}}


/* Commercial completion: governed marine-life knowledge surface */
.knowledge-feature{margin:18px 0;padding:18px;border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.035)}
.knowledge-feature-head{display:flex;align-items:center;gap:14px;margin-bottom:14px}.knowledge-feature-head img{width:86px;height:86px;object-fit:contain;flex:0 0 auto}.knowledge-feature-head h2{margin:.2rem 0}.knowledge-feature-head p{margin:.2rem 0;color:var(--muted)}
.knowledge-grid{display:grid;grid-template-columns:1fr;gap:12px}.knowledge-card{padding:16px;border:1px solid var(--line);border-radius:18px;background:rgba(7,26,40,.72)}.knowledge-card h3{margin:.35rem 0 .45rem}.knowledge-card p{margin:.35rem 0}.knowledge-card .source-note{font-size:.78rem;color:var(--muted)}
.bottom-nav{overflow-x:auto;scrollbar-width:none}.bottom-nav::-webkit-scrollbar{display:none}.bottom-nav button{min-width:60px;flex:1 0 auto}
@media(min-width:760px){.knowledge-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.knowledge-feature-head img{width:104px;height:104px}}


/* MARINUM time-of-day atmosphere — Tonga local time */
html,body{
 min-height:100%;
 background:var(--marinum-atmosphere,linear-gradient(135deg,#0f2027,#203a43,#2c5364));
 background-attachment:fixed;
 transition:background 1.4s ease;
}
#app{background:transparent}
.topbar{
 background:rgba(6,19,30,.56);
 backdrop-filter:blur(14px);
 -webkit-backdrop-filter:blur(14px);
}
.card,.pass-card,.metric-card,.knowledge-card,.knowledge-feature{
 background:linear-gradient(155deg,rgba(8,33,47,.74),rgba(5,22,34,.72));
 backdrop-filter:blur(12px);
 -webkit-backdrop-filter:blur(12px);
}
.bottom-nav{
 background:rgba(5,18,28,.78);
 backdrop-filter:blur(14px);
 -webkit-backdrop-filter:blur(14px);
}
html[data-marinum-time="morning"] .card,
html[data-marinum-time="morning"] .metric-card,
html[data-marinum-time="late-morning"] .card,
html[data-marinum-time="late-morning"] .metric-card,
html[data-marinum-time="afternoon"] .card,
html[data-marinum-time="afternoon"] .metric-card{
 background:linear-gradient(155deg,rgba(8,45,62,.70),rgba(5,28,42,.68));
}
html[data-marinum-time="late-afternoon"] .card,
html[data-marinum-time="late-afternoon"] .metric-card,
html[data-marinum-time="golden-evening"] .card,
html[data-marinum-time="golden-evening"] .metric-card{
 background:linear-gradient(155deg,rgba(46,38,48,.68),rgba(11,31,44,.74));
}
html[data-marinum-time="night"] .card,
html[data-marinum-time="night"] .metric-card,
html[data-marinum-time="eve"] .card,
html[data-marinum-time="eve"] .metric-card{
 background:linear-gradient(155deg,rgba(10,35,50,.88),rgba(5,23,35,.90));
}


/* v1.1.8 UI correction: protected bottom navigation + knowledge-led Life */
#app{padding-bottom:150px}
.bottom-nav{
  grid-template-columns:repeat(6,minmax(0,1fr));
  width:min(calc(100% - 30px),720px);
  bottom:max(14px,env(safe-area-inset-bottom));
  overflow:visible;
}
.bottom-nav button{min-width:0;padding:11px 4px;white-space:nowrap}
#companions .section-head{padding-bottom:10px}
#companions .section-head h1{font-size:clamp(2rem,6vw,3.25rem)}
#companions .knowledge-feature{margin-top:8px}
#companions .companions{justify-content:flex-start;gap:10px;margin:14px 0}
#companions .companions img{width:96px;height:96px;max-height:none;border-radius:22px;object-fit:cover}
#companions .knowledge-feature-head img{width:72px;height:72px}
@media(min-width:700px){#app{padding-bottom:150px}}
@media(max-width:520px){
  #app{padding-bottom:154px}
  .bottom-nav{grid-template-columns:repeat(3,1fr);width:calc(100% - 20px);bottom:max(8px,env(safe-area-inset-bottom))}
  .bottom-nav button{padding:8px 3px}
  #companions .companions img{width:76px;height:76px}
}


/* v1.1.9 — Speta's World: whale knowledge is the Life product surface */
.life-screen .life-head{align-items:flex-start}
.life-screen .life-head img{width:82px;height:82px;object-fit:contain;border-radius:20px;flex:0 0 auto}
.life-screen .knowledge-feature{padding:20px;margin-top:4px}
.life-screen .knowledge-intro h2{margin:.3rem 0;font-size:clamp(1.45rem,4vw,2rem)}
.life-screen .knowledge-intro p{margin:.25rem 0 1rem;color:var(--muted);line-height:1.5}
.knowledge-filters{display:flex;gap:8px;overflow-x:auto;padding:2px 0 14px;scrollbar-width:thin}
.knowledge-filter{flex:0 0 auto;border:1px solid var(--line);background:rgba(7,27,41,.72);color:var(--muted);border-radius:999px;padding:9px 12px;min-height:38px}
.knowledge-filter.active{color:#fff;border-color:var(--aqua);background:rgba(42,196,200,.12)}
.life-screen .knowledge-grid{grid-template-columns:1fr;gap:10px}
.life-screen .knowledge-card{min-height:0;padding:15px}
.life-screen .knowledge-card h3{font-size:1.05rem;line-height:1.3}
.life-screen .knowledge-card p{line-height:1.5;color:#e7f2f5}
.life-qa{margin-top:18px}.life-qa .eyebrow{display:block;margin-bottom:8px}
@media(min-width:760px){.life-screen .knowledge-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.life-screen .life-head img{width:92px;height:92px}}

/* v1.1.10 — MARINUM premium ocean palette. Blue / green / aquamarine only. */
:root{
 --bg:#062f44;--panel:#0a5363;--panel2:#0b7180;--text:#f4ffff;--muted:#b9dfe1;
 --aqua:#73e1d2;--gold:#73e1d2;--line:rgba(173,241,232,.20);--r:24px;
 --surface:rgba(6,58,73,.72);--surface-soft:rgba(8,83,96,.58);--deep:#06384d;
}
html,body{background:var(--marinum-atmosphere,linear-gradient(135deg,#073b55,#087a84,#24aa9d));color:var(--text)}
.topbar{background:rgba(6,48,64,.64);border-bottom:1px solid rgba(157,236,226,.08)}
.card,.pass-card,.metric-card,.knowledge-card,.knowledge-feature,.whale-feature,.legal-copy{
 background:linear-gradient(155deg,rgba(7,70,84,.78),rgba(6,49,68,.76));
 border-color:var(--line);box-shadow:0 14px 40px rgba(5,58,72,.18);
}
.primary{background:#78e3d2;color:#073f4c}.secondary{background:rgba(83,199,187,.14);color:#f4ffff;border-color:var(--line)}
.ghost,.text-btn{color:#eafffc;border-color:var(--line)}
.form-grid input,.form-grid select,.form-grid textarea,select,input,textarea{background:rgba(5,57,72,.72);color:#f4ffff;border-color:var(--line)}
.camera-shell{background:#07394d}.camera-guide span{background:rgba(6,55,70,.82)}
.pass-card{background:linear-gradient(145deg,rgba(8,117,124,.84),rgba(6,65,83,.88))}.price{color:#8ee7d7}
.bottom-nav{background:rgba(5,52,68,.90);border-color:rgba(157,236,226,.18)}
.bottom-nav button.active{background:rgba(115,225,210,.16);color:#fff}.toast{background:#075264}.lock{background:rgba(5,48,64,.96)}.lock-card{background:#075264}
html[data-marinum-time] .card,html[data-marinum-time] .metric-card{background:linear-gradient(155deg,rgba(7,70,84,.78),rgba(6,49,68,.76))}

/* Speta = where the whales are recorded */
.whale-feature{padding:20px;border:1px solid var(--line);border-radius:28px;margin:4px 0 18px}
.whale-toolbar{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:14px}.whale-toolbar h2{margin:.3rem 0}.whale-toolbar p{margin:.25rem 0}.whale-toolbar select{width:auto;min-width:160px}
.whale-map-shell{border:1px solid rgba(160,238,229,.18);border-radius:26px;overflow:hidden;background:#087382}.whale-map{display:block;width:100%;height:auto;min-height:340px}.map-water{fill:#087989}.island-dot{fill:#83ddc7;stroke:#d9fff8;stroke-width:2}.island-label{fill:#eafffb;font-size:16px;font-weight:800}.whale-point{fill:#9cf1df;stroke:#075466;stroke-width:3;opacity:.9}.whale-point:hover{fill:#d8fff6;stroke-width:4}
.whale-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}.whale-summary div{background:rgba(19,143,143,.22);border:1px solid var(--line);border-radius:16px;padding:10px;text-align:center}.whale-summary strong{display:block;font-size:1.25rem;color:#9aebdc}.whale-summary span{display:block;font-size:.76rem;color:var(--muted);margin-top:2px}.whale-caveat{font-size:.82rem;color:var(--muted);margin:12px 2px 0}
.life-screen .knowledge-feature{background:rgba(7,67,82,.55)}.life-screen .knowledge-card{background:rgba(6,57,73,.66)}
.everyday-card{grid-column:1/-1}.everyday-card select{margin-top:10px}.everyday-answer{margin-top:12px;padding:14px;border-radius:16px;background:rgba(13,126,128,.18);line-height:1.55}
.product-footer{text-align:center;padding:18px 0 4px}.legal-link{border:0;background:transparent;color:var(--muted);text-decoration:underline;text-underline-offset:4px;cursor:pointer}.legal-copy h2{margin-top:1.6rem}.legal-copy h2:first-child{margin-top:0}.legal-copy p{line-height:1.65;color:#d8eeee}
@media(max-width:620px){.whale-toolbar{align-items:stretch;flex-direction:column}.whale-toolbar select{width:100%}.whale-summary{grid-template-columns:repeat(2,1fr)}.whale-map{min-height:300px}}

/* v1.1.12 — Procedural living-ocean environment.
   Visual layer only. No raster background asset is used. */
:root{
  --marinum-ocean-top:#62e3e8;
  --marinum-ocean-mid:#1ab6ca;
  --marinum-ocean-deep:#075b82;
  --marinum-ocean-shadow:#063e68;
  --marinum-ocean-brightness:1;
  --marinum-ocean-saturation:1.06;
  --marinum-caustic-opacity:.70;
  --marinum-ocean-haze:.18;
  --marinum-ocean-warmth:rgba(255,190,115,0);
  --marinum-night-veil:rgba(3,17,48,0);
}

/* No hard horizon: the field is a continuous shallow-water gradient. */
html,body{
  min-height:100%;
  background:
    radial-gradient(ellipse at 50% 24%, rgba(255,255,255,.30) 0%, rgba(255,255,255,.08) 24%, transparent 52%),
    radial-gradient(ellipse at 18% 72%, color-mix(in srgb,var(--marinum-ocean-shadow) 72%,transparent) 0%, transparent 56%),
    radial-gradient(ellipse at 84% 76%, color-mix(in srgb,var(--marinum-ocean-deep) 58%,transparent) 0%, transparent 48%),
    linear-gradient(160deg,var(--marinum-ocean-top) 0%,var(--marinum-ocean-mid) 43%,var(--marinum-ocean-deep) 73%,var(--marinum-ocean-shadow) 100%) !important;
  background-attachment:fixed !important;
}
body{
  position:relative;
  isolation:isolate;
  overflow-x:hidden;
}
#app{
  position:relative;
  z-index:2;
  background:transparent !important;
}

/* Moving refracted-light lattice. It is intentionally soft and irregular. */
body::before{
  content:"";
  position:fixed;
  z-index:0;
  inset:-18vmax;
  pointer-events:none;
  opacity:var(--marinum-caustic-opacity);
  background:
    radial-gradient(ellipse at 50% 44%, rgba(255,255,255,.34) 0 1.4%, transparent 3.2%),
    repeating-radial-gradient(ellipse at 34% 28%,
      rgba(255,255,255,.19) 0 1.1%,
      rgba(208,255,250,.08) 1.7% 2.6%,
      transparent 3.3% 6.5%),
    repeating-radial-gradient(ellipse at 70% 62%,
      rgba(255,255,255,.13) 0 .9%,
      transparent 2.0% 5.8%),
    repeating-linear-gradient(118deg,
      transparent 0 5.4%,
      rgba(223,255,251,.09) 5.9% 6.7%,
      transparent 7.2% 13.5%),
    repeating-linear-gradient(62deg,
      transparent 0 7%,
      rgba(255,255,255,.07) 7.6% 8.2%,
      transparent 8.8% 15.4%);
  background-size:
    52vmax 34vmax,
    42vmax 30vmax,
    37vmax 27vmax,
    31vmax 25vmax,
    29vmax 23vmax;
  background-position:
    50% 28%,
    0 0,
    40% 24%,
    0 0,
    12% 18%;
  mix-blend-mode:screen;
  filter:
    blur(.55px)
    brightness(var(--marinum-ocean-brightness))
    saturate(var(--marinum-ocean-saturation));
  transform-origin:center;
  will-change:transform,background-position,opacity,filter;
  animation:
    marinum-caustics-drift 19s ease-in-out infinite alternate,
    marinum-caustics-flow 27s linear infinite;
}

/* Soft atmospheric tint: sunrise/sunset warmth and night depth. */
body::after{
  content:"";
  position:fixed;
  z-index:1;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 50% 18%, rgba(255,255,255,var(--marinum-ocean-haze)) 0%, transparent 46%),
    linear-gradient(180deg,var(--marinum-ocean-warmth),transparent 50%),
    var(--marinum-night-veil);
  mix-blend-mode:soft-light;
  transition:background 70s linear,opacity 70s linear;
}

/* Keep the product readable while allowing the ocean to remain visible. */
.topbar{
  background:rgba(5,54,70,.52) !important;
  backdrop-filter:blur(16px) saturate(1.15);
  -webkit-backdrop-filter:blur(16px) saturate(1.15);
}
.card,.pass-card,.metric-card,.knowledge-card,.knowledge-feature,.whale-feature,.legal-copy{
  background:linear-gradient(155deg,rgba(5,68,82,.68),rgba(5,43,62,.66)) !important;
  backdrop-filter:blur(13px) saturate(1.08);
  -webkit-backdrop-filter:blur(13px) saturate(1.08);
  box-shadow:0 16px 44px rgba(2,45,65,.16);
}
.bottom-nav{
  background:rgba(4,45,62,.80) !important;
  backdrop-filter:blur(16px) saturate(1.12);
  -webkit-backdrop-filter:blur(16px) saturate(1.12);
}

/* Midday is deliberately the clearest / brightest state. */
html[data-marinum-ocean-phase="day"] .topbar{
  background:rgba(4,75,86,.43) !important;
}
html[data-marinum-ocean-phase="night"] .card,
html[data-marinum-ocean-phase="night"] .metric-card,
html[data-marinum-ocean-phase="night"] .knowledge-card,
html[data-marinum-ocean-phase="night"] .knowledge-feature{
  background:linear-gradient(155deg,rgba(5,45,65,.80),rgba(4,27,48,.82)) !important;
}

/* Mobile GPUs benefit from smaller moving fields. */
@media(max-width:620px){
  body::before{
    inset:-12vmax;
    background-size:
      68vmax 44vmax,
      54vmax 38vmax,
      48vmax 34vmax,
      40vmax 31vmax,
      38vmax 29vmax;
    filter:
      blur(.45px)
      brightness(var(--marinum-ocean-brightness))
      saturate(var(--marinum-ocean-saturation));
  }
}

@keyframes marinum-caustics-drift{
  0%{transform:translate3d(-1.6%,-1.0%,0) scale(1.03) rotate(-.6deg)}
  50%{transform:translate3d(1.1%,.8%,0) scale(1.07) rotate(.35deg)}
  100%{transform:translate3d(2.0%,-.4%,0) scale(1.04) rotate(.8deg)}
}
@keyframes marinum-caustics-flow{
  0%{
    background-position:50% 28%,0 0,40% 24%,0 0,12% 18%;
  }
  50%{
    background-position:48% 31%,11% 7%,31% 36%,9% 13%,2% 28%;
  }
  100%{
    background-position:52% 26%,22% 14%,22% 48%,18% 26%,-8% 38%;
  }
}
@media(prefers-reduced-motion:reduce){
  body::before{animation:none}
  html,body,body::after{transition:none}
}



/* v1.1.17 — interactive whale occurrence region controls */
.whale-summary .whale-summary-item{
  appearance:none;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.08);
  color:inherit;
  border-radius:16px;
  padding:12px 14px;
  text-align:left;
  cursor:pointer;
  font:inherit;
}
.whale-summary .whale-summary-item strong,
.whale-summary .whale-summary-item span{display:block}
.whale-summary .whale-summary-item strong{font-size:1.3rem}
.whale-summary .whale-summary-item.active{
  border-color:rgba(255,255,255,.48);
  background:rgba(255,255,255,.18);
}
.whale-region-hit:focus{outline:none}
.whale-region-hit:focus .island-dot{stroke:white;stroke-width:3}

.whale-occurrence-detail{
  margin-top:12px;
}
.whale-occurrence-card{
  padding:14px 16px;
  border-radius:16px;
  background:rgba(255,255,255,.10);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.18);
  line-height:1.45;
}
.whale-occurrence-card strong{
  display:block;
  margin-bottom:6px;
}
.whale-occurrence-coords{
  opacity:.82;
  font-size:.92em;
  margin-top:4px;
}
[data-whale-occurrence]{
  cursor:pointer;
  outline:none;
}
[data-whale-occurrence]:focus{
  filter:drop-shadow(0 0 5px currentColor);
}
.whale-data-disclaimer{
  margin-top:18px;
  padding:14px 16px;
  border-radius:16px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  font-size:.9em;
}
.whale-data-disclaimer p{
  margin:.4em 0 0;
}

.admin-access-link{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:5px 10px 5px 6px;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  color:inherit;
  font:inherit;
  font-size:.9rem;
  cursor:pointer;
  opacity:.9;
}
.admin-access-link:hover{background:rgba(255,255,255,.11);opacity:1}
.admin-access-link:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.admin-access-link img{
  width:28px;
  height:28px;
  object-fit:cover;
  object-position:center;
  border-radius:50%;
  display:block;
}


/* v1.1.21 header spacing */
header,
.topbar,
.app-header,
.site-header,
.main-header{
  box-sizing:border-box;
  padding-left:max(20px, env(safe-area-inset-left));
  padding-right:max(20px, env(safe-area-inset-right));
}
@media (min-width:768px){
  header,
  .topbar,
  .app-header,
  .site-header,
  .main-header{
    padding-left:28px;
    padding-right:28px;
  }
}


/* v1.1.22 about gallery whale rules */
.whale-rules-card{margin-top:16px}
.whale-rule-list{margin:10px 0 8px;padding-left:1.25rem}
.whale-rule-list li{margin:.45rem 0;line-height:1.45}
.legal-note{font-size:.86rem;opacity:.78;margin-top:10px}
.about-card p{line-height:1.6}
.about-card h3{margin-top:22px}
.gallery-upload-area{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:14px 0 18px}
.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.gallery-item{position:relative;overflow:hidden;border-radius:16px}
.gallery-item img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}
.gallery-delete{position:absolute;right:8px;bottom:8px;padding:7px 10px;border-radius:999px;border:0;background:rgba(0,0,0,.62);color:#fff}
@media (min-width:760px){.gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}


/* v1.1.23 public gallery device lock */
.whale-rules-signoff{margin:14px 0 4px}
.official-rules-link{margin-top:7px;font-size:.9rem}
.official-rules-link a{text-decoration:underline;text-underline-offset:3px}
.gallery-card + .gallery-card{margin-top:16px}
.gallery-item-controls{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 2px 2px}
.gallery-share-toggle{display:flex;align-items:center;gap:7px;font-size:.78rem;line-height:1.2}
.gallery-share-toggle input{width:17px;height:17px}
.gallery-item .gallery-delete{position:static;background:rgba(0,0,0,.55);flex:0 0 auto}
.public-gallery-item img{aspect-ratio:1/1;object-fit:cover}


/* v1.1.24 focused fixes */
.official-rules-link a,
.official-rules-link a:visited{
  color:#fff !important;
  text-decoration-color:rgba(255,255,255,.72);
}
.official-rules-link a:hover{opacity:.88}

.access-actions-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:10px;
}
.access-actions-row #sendMagic,
.access-actions-row .admin-access-link{margin:0}
.access-actions-row .admin-access-link img{
  width:28px;
  height:28px;
  border-radius:8px;
  object-fit:cover;
}

.whale-map-shell{
  height:clamp(300px,36vw,430px) !important;
  max-height:430px !important;
  overflow:hidden;
}
#whaleMap{
  width:100%;
  height:100% !important;
  max-height:430px !important;
  display:block;
}
#companions .whale-feature{overflow:visible}
main{padding-bottom:118px}

#extractedFields{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
#extractedFields label{
  display:flex;
  flex-direction:column;
  gap:6px;
}
#extractedFields textarea{
  min-height:110px;
  resize:vertical;
}
@media (max-width:700px){
  .whale-map-shell{height:310px !important;max-height:310px !important}
  #extractedFields{grid-template-columns:1fr}
  main{padding-bottom:132px}
}


/* v1.1.25 whale region focus */
#whaleMap{transition:all .22s ease}
.whale-summary-item.active{outline:1px solid rgba(255,255,255,.48)}


/* v1.1.26 pricing + playful About + Gallery sharing */
.repeat-price-note{margin-top:8px}

.about-world{display:grid;gap:16px}
.about-splash{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  overflow:hidden;
}
.about-splash h1{margin:.3rem 0 .45rem}
.about-lead{font-size:1.08rem;max-width:640px}
.about-duo{
  display:flex;
  align-items:flex-end;
  justify-content:center;
  min-width:230px;
  position:relative;
}
.about-duo img{
  width:118px;
  height:118px;
  object-fit:cover;
  border-radius:30px;
  box-shadow:0 16px 34px rgba(0,0,0,.2);
  transform:rotate(-4deg);
}
.about-duo img+img{margin-left:-22px;transform:rotate(5deg) translateY(14px)}
.about-character-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.about-character{
  display:grid;
  grid-template-columns:110px 1fr;
  gap:18px;
  align-items:start;
}
.about-character>img{
  width:110px;
  height:110px;
  border-radius:28px;
  object-fit:cover;
  box-shadow:0 12px 26px rgba(0,0,0,.18);
}
.about-character h2{margin:.25rem 0 .55rem}
.about-character p{line-height:1.62}
.about-story{text-align:center}
.about-story p{max-width:780px;margin-left:auto;margin-right:auto;line-height:1.65}
.about-bubbles{
  display:flex;
  justify-content:center;
  gap:14px;
  font-size:1.8rem;
  padding-top:8px;
}
.about-bubbles span:nth-child(2n){transform:translateY(6px)}
.about-bubbles span:nth-child(3n){transform:rotate(8deg)}

.gallery-item-controls{
  flex-wrap:wrap;
}
.gallery-share-button,
.gallery-save-button{
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.09);
  color:#fff;
  border-radius:999px;
  padding:7px 11px;
  font-size:.76rem;
  cursor:pointer;
}
.gallery-share-button:hover,
.gallery-save-button:hover{background:rgba(255,255,255,.15)}

@media (max-width:720px){
  .about-splash{flex-direction:column;align-items:flex-start}
  .about-duo{align-self:center}
  .about-character-grid{grid-template-columns:1fr}
  .about-character{grid-template-columns:82px 1fr}
  .about-character>img{width:82px;height:82px;border-radius:22px}
}


/* v1.1.28 whale sighting interaction */
.whale-occurrence-hit{outline:none}
.whale-occurrence-hit:focus .whale-point,
.whale-occurrence-hit:hover .whale-point{stroke:rgba(255,255,255,.95);stroke-width:3}
.whale-occurrence-detail{display:none;margin-top:12px}
.whale-occurrence-detail.is-open{display:block}
.whale-occurrence-card{padding:14px 16px;border-radius:16px;background:rgba(4,47,66,.72);border:1px solid rgba(255,255,255,.16);line-height:1.5}
.whale-occurrence-card strong{display:block;margin-bottom:5px}
.whale-occurrence-coords{opacity:.78;font-size:.9rem}


/* v1.1.29 compact whale sighting popup */
.whale-map-popup-host{position:relative}
.whale-occurrence-detail{
  position:absolute;
  z-index:12;
  display:none;
  box-sizing:border-box;
  padding:14px 38px 14px 16px;
  border-radius:16px;
  background:rgba(5,42,58,.96);
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 14px 34px rgba(0,0,0,.28);
  color:#fff;
  line-height:1.35;
}
.whale-occurrence-detail.is-open{display:block}
.whale-popup-close{
  position:absolute;
  top:7px;
  right:8px;
  width:30px;
  height:30px;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.1);
  color:#fff;
  font-size:21px;
  line-height:1;
  cursor:pointer;
}
.whale-popup-kicker{
  margin-bottom:4px;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.12em;
  opacity:.72;
}
.whale-occurrence-detail>strong{
  display:block;
  margin-bottom:9px;
  font-size:1.02rem;
}
.whale-popup-list{margin:0}
.whale-popup-list>div{
  display:grid;
  grid-template-columns:78px 1fr;
  gap:10px;
  padding:4px 0;
}
.whale-popup-list dt{
  margin:0;
  font-size:.78rem;
  opacity:.68;
}
.whale-popup-list dd{
  margin:0;
  font-size:.86rem;
  font-weight:700;
  overflow-wrap:anywhere;
}
@media (max-width:560px){
  .whale-occurrence-detail{
    left:12px!important;
    right:12px;
    width:auto!important;
    top:auto!important;
    bottom:12px;
  }
}


/* v1.1.30 paid whale-data gate */
.whale-data-gate{
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  gap:18px;
  align-items:center;
  margin:14px 0 0;
  padding:18px;
  border-radius:20px;
  background:rgba(5,48,67,.62);
  border:1px solid rgba(255,255,255,.14);
}
.whale-data-gate.hidden{display:none}
.whale-data-gate img{
  width:96px;
  height:96px;
  object-fit:cover;
  border-radius:24px;
}
.whale-data-gate h3{margin:.25rem 0 .45rem}
.whale-data-gate p{margin:.25rem 0 .9rem;max-width:650px}
#whaleRegion:disabled{opacity:.5;cursor:not-allowed}
@media (max-width:560px){
  .whale-data-gate{grid-template-columns:68px minmax(0,1fr);gap:12px;padding:14px}
  .whale-data-gate img{width:68px;height:68px;border-radius:18px}
}


/* v1.1.31 whale gate explainer */
.whale-gate-list{
  margin:.65rem 0 .75rem 1.05rem;
  padding:0;
  display:grid;
  gap:.35rem;
}
.whale-gate-list li{line-height:1.45}
.whale-gate-note{
  margin:.2rem 0 .9rem;
  opacity:.82;
}


/* v1.1.34 reliable whale sighting interaction */
.whale-occurrence-hit{pointer-events:all;cursor:pointer}
.whale-occurrence-hit .whale-point{pointer-events:none}
.whale-occurrence-hit:hover .whale-point,
.whale-occurrence-hit:focus .whale-point{
  fill:#e7fff9;
  stroke:#ffffff;
  stroke-width:4;
}
.whale-occurrence-detail{
  pointer-events:auto;
}


/* v1.1.38 Speta whale-map note */
.speta-whale-note{
  display:flex;
  align-items:center;
  gap:14px;
  margin:.8rem 0 .65rem;
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
}
.speta-whale-note img{
  width:58px;
  height:58px;
  flex:0 0 58px;
  object-fit:cover;
  border-radius:16px;
}
.speta-whale-note p{
  margin:0;
  font-size:1.02rem;
  line-height:1.55;
  color:#eefdfb;
}
.speta-whale-note strong{
  color:#ffffff;
}
@media (max-width:620px){
  .speta-whale-note{
    align-items:flex-start;
    gap:10px;
    padding:12px;
  }
  .speta-whale-note img{
    width:48px;
    height:48px;
    flex-basis:48px;
    border-radius:14px;
  }
  .speta-whale-note p{
    font-size:.96rem;
  }
}


/* Practical Tonga calendar */
.practical-calendar{display:grid;gap:.65rem;margin-top:.8rem}
.practical-date-row{display:grid;grid-template-columns:minmax(7.25rem,9rem) 1fr;gap:.8rem;align-items:start;padding:.78rem .84rem;border:1px solid rgba(255,255,255,.16);border-radius:14px;background:rgba(255,255,255,.055)}
.practical-date{font-size:.82rem;font-weight:700;letter-spacing:.02em;line-height:1.35;opacity:.9}
.practical-date-row strong{display:block;font-size:.96rem;line-height:1.25}
.practical-date-row p{margin:.22rem 0 0;font-size:.88rem;line-height:1.42;opacity:.82}
@media(max-width:560px){.practical-date-row{grid-template-columns:1fr;gap:.24rem}.practical-date{font-size:.78rem}}


/* v1.1.49 — MARINUM About / product narrative */
.about-world{display:grid;gap:18px;padding-bottom:10px}

.about-hero{
  position:relative;
  min-height:430px;
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);
  gap:32px;
  align-items:center;
  padding:clamp(28px,5vw,58px);
  overflow:hidden;
  border:1px solid rgba(126,238,229,.22);
  border-radius:32px;
  background:
    radial-gradient(circle at 78% 28%,rgba(108,241,222,.18),transparent 28%),
    radial-gradient(circle at 18% 12%,rgba(57,161,207,.18),transparent 34%),
    linear-gradient(145deg,rgba(6,47,66,.97),rgba(4,25,41,.98));
  box-shadow:0 28px 80px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.05);
}
.about-hero:before{
  content:"";
  position:absolute;
  inset:auto -12% -55% 30%;
  height:430px;
  border-radius:50%;
  background:radial-gradient(ellipse at center,rgba(32,197,199,.18),rgba(32,197,199,0) 66%);
  transform:rotate(-8deg);
  pointer-events:none;
}
.about-hero-copy{position:relative;z-index:2;max-width:720px}
.about-hero h1{
  margin:.5rem 0 1rem;
  font-size:clamp(2.8rem,7vw,5.8rem);
  line-height:.94;
  letter-spacing:-.055em;
  max-width:820px;
}
.about-hero h1 span{
  background:linear-gradient(90deg,#fff 8%,#82efe0 58%,#f4c86d 108%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.about-lead{
  max-width:690px;
  margin:0;
  color:rgba(240,250,252,.82);
  font-size:clamp(1.02rem,2vw,1.25rem);
  line-height:1.68;
}
.about-hero-tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px}
.about-hero-tags span{
  padding:8px 11px;
  border:1px solid rgba(129,235,224,.2);
  border-radius:999px;
  background:rgba(5,26,40,.46);
  color:rgba(235,252,249,.86);
  font-size:.74rem;
  font-weight:750;
  letter-spacing:.045em;
  text-transform:uppercase;
}
.about-hero-visual{
  position:relative;
  min-height:330px;
  display:grid;
  place-items:center;
}
.about-orbit{
  position:absolute;
  border:1px solid rgba(125,239,228,.18);
  border-radius:50%;
  box-shadow:inset 0 0 50px rgba(71,215,207,.035);
}
.about-orbit-one{width:300px;height:300px;transform:rotate(18deg)}
.about-orbit-two{width:224px;height:224px;transform:rotate(-20deg);border-style:dashed}
.about-hero-speta,.about-hero-narigi{
  position:absolute;
  width:158px;height:158px;object-fit:cover;
  border-radius:38px;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 28px 54px rgba(0,0,0,.34);
}
.about-hero-speta{transform:translate(-54px,-42px) rotate(-6deg)}
.about-hero-narigi{transform:translate(62px,52px) rotate(7deg)}
.about-hero-mark{
  position:absolute;
  right:2px;bottom:0;
  display:grid;gap:2px;
  padding:10px 13px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:rgba(4,26,40,.7);
  backdrop-filter:blur(12px);
}
.about-hero-mark strong{font-size:.78rem;letter-spacing:.18em}
.about-hero-mark span{font-size:.68rem;color:var(--muted)}

.about-thesis{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(460px,.95fr);
  gap:28px;
  align-items:center;
  padding:30px;
  background:
    linear-gradient(135deg,rgba(14,58,73,.94),rgba(5,31,46,.97));
}
.about-thesis h2{
  margin:.45rem 0 .65rem;
  max-width:720px;
  font-size:clamp(1.55rem,3vw,2.35rem);
  line-height:1.12;
  letter-spacing:-.03em;
}
.about-thesis p{max-width:720px;line-height:1.7;color:rgba(240,250,252,.78)}
.about-flow{
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;
  gap:8px;
  align-items:center;
}
.about-flow>div{
  min-height:112px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:13px 12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:rgba(255,255,255,.045);
}
.about-flow>div span{color:#7ce8da;font-size:.69rem;font-weight:900;letter-spacing:.12em}
.about-flow>div strong{margin:.35rem 0 .15rem;font-size:.94rem}
.about-flow>div small{color:var(--muted);font-size:.72rem;line-height:1.35}
.about-flow>b{color:rgba(124,232,218,.65);font-size:1.05rem}

.about-character-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.about-character{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:150px 1fr;
  gap:22px;
  min-height:320px;
  padding:24px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:26px;
  background:linear-gradient(150deg,rgba(9,47,66,.96),rgba(4,27,42,.98));
  box-shadow:0 18px 48px rgba(0,0,0,.16);
}
.about-character:after{
  content:"";
  position:absolute;
  width:230px;height:230px;
  right:-120px;bottom:-120px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(103,233,219,.11),transparent 68%);
}
.about-character-narigi:after{background:radial-gradient(circle,rgba(245,172,64,.14),transparent 68%)}
.about-character-portrait{position:relative;z-index:2}
.about-character-portrait img{
  width:138px;height:138px;object-fit:cover;border-radius:32px;
  box-shadow:0 18px 34px rgba(0,0,0,.25);
}
.about-character-portrait span{
  display:block;
  margin-top:12px;
  color:#83ece0;
  font-size:.72rem;font-weight:900;letter-spacing:.18em;text-align:center;
}
.about-character-narigi .about-character-portrait span{color:#f7bd65}
.about-character-copy{position:relative;z-index:2}
.about-character-copy h2{
  margin:.38rem 0 .7rem;
  font-size:clamp(1.6rem,3vw,2.2rem);
  letter-spacing:-.025em;
}
.about-character-copy p{line-height:1.68;color:rgba(240,250,252,.8)}
.about-name-note{
  margin-top:16px!important;
  padding-top:15px;
  border-top:1px solid rgba(255,255,255,.1);
  color:rgba(240,250,252,.9)!important;
}

.about-system{
  padding:34px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:30px;
  background:linear-gradient(155deg,rgba(4,31,48,.96),rgba(6,38,53,.94));
}
.about-system-intro{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  column-gap:34px;
  align-items:end;
  margin-bottom:24px;
}
.about-system-intro .eyebrow{grid-column:1/-1}
.about-system-intro h2{
  margin:.45rem 0 0;
  font-size:clamp(1.8rem,3.5vw,2.8rem);
  line-height:1.08;letter-spacing:-.035em;
}
.about-system-intro p{margin:0;line-height:1.72;color:rgba(240,250,252,.76)}
.about-capability-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.about-capability-grid article{
  min-height:190px;
  padding:19px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:19px;
  background:rgba(255,255,255,.035);
}
.about-capability-no{
  display:inline-flex;
  width:30px;height:30px;
  align-items:center;justify-content:center;
  border-radius:9px;
  background:rgba(114,231,220,.11);
  color:#7ce8da;font-size:.7rem;font-weight:900;
}
.about-capability-grid h3{margin:.8rem 0 .45rem;font-size:1.02rem}
.about-capability-grid p{margin:0;color:var(--muted);line-height:1.56;font-size:.88rem}

.about-origin{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0;
  padding:0;
  overflow:hidden;
}
.about-origin>div{padding:28px 30px}
.about-origin>div+div{
  border-left:1px solid rgba(255,255,255,.11);
  background:linear-gradient(145deg,rgba(21,83,92,.18),rgba(255,255,255,.01));
}
.about-origin h2{margin:.45rem 0 .6rem;font-size:1.6rem;line-height:1.16}
.about-origin p{margin:0;color:rgba(240,250,252,.76);line-height:1.7}

.about-signature{
  display:grid;
  grid-template-columns:auto 1fr minmax(260px,440px);
  gap:20px;
  align-items:center;
  padding:20px 6px 4px;
}
.about-signature h2{margin:.16rem 0 0;font-size:1.55rem;letter-spacing:.08em}
.about-signature p{margin:.15rem 0;color:var(--muted)}
.about-signature-line{height:1px;background:linear-gradient(90deg,rgba(122,236,223,.65),rgba(122,236,223,.06))}
.about-signature-copy{text-align:right;line-height:1.45}

@media(max-width:900px){
  .about-hero{grid-template-columns:1fr;min-height:auto}
  .about-hero-visual{min-height:300px}
  .about-thesis{grid-template-columns:1fr}
  .about-system-intro{grid-template-columns:1fr}
  .about-system-intro p{margin-top:14px}
  .about-capability-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .about-character{grid-template-columns:112px 1fr}
  .about-character-portrait img{width:104px;height:104px;border-radius:26px}
}
@media(max-width:720px){
  .about-hero{padding:28px 20px;border-radius:26px}
  .about-hero h1{font-size:clamp(2.55rem,13vw,4.2rem)}
  .about-hero-visual{min-height:260px}
  .about-hero-speta,.about-hero-narigi{width:126px;height:126px;border-radius:30px}
  .about-hero-speta{transform:translate(-43px,-35px) rotate(-6deg)}
  .about-hero-narigi{transform:translate(50px,42px) rotate(7deg)}
  .about-orbit-one{width:245px;height:245px}
  .about-orbit-two{width:185px;height:185px}
  .about-thesis{padding:23px}
  .about-flow{grid-template-columns:1fr 1fr;gap:8px}
  .about-flow>b{display:none}
  .about-character-grid{grid-template-columns:1fr}
  .about-character{grid-template-columns:92px 1fr;padding:20px;min-height:0}
  .about-character-portrait img{width:86px;height:86px;border-radius:23px}
  .about-capability-grid{grid-template-columns:1fr}
  .about-system{padding:24px 18px}
  .about-origin{grid-template-columns:1fr}
  .about-origin>div+div{border-left:0;border-top:1px solid rgba(255,255,255,.11)}
  .about-signature{grid-template-columns:1fr}
  .about-signature-line{display:none}
  .about-signature-copy{text-align:left}
}


/* v1.1.50 — Practical Tonga + legal navigation */
.product-footer{
  display:flex;
  justify-content:center;
  padding:18px 16px 104px;
}
.product-footer .nav-style-button{
  appearance:none;
  min-width:220px;
  padding:11px 18px;
  border:1px solid rgba(126,238,229,.22);
  border-radius:15px;
  background:rgba(10,61,77,.88);
  color:#f4fbfc;
  font:inherit;
  font-size:.84rem;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 12px 30px rgba(0,0,0,.12);
  transition:background .18s ease,border-color .18s ease,transform .18s ease;
}
.product-footer .nav-style-button:hover{
  background:rgba(20,88,102,.94);
  border-color:rgba(126,238,229,.4);
  transform:translateY(-1px);
}
.everyday-answer>p:first-child{
  margin-top:0;
  font-size:.96rem;
  line-height:1.58;
  color:rgba(245,252,253,.92);
}


/* v1.1.51 — Daily ocean facts + City Jazz Radio */
.daily-ocean-fact{min-height:172px}
.daily-ocean-fact h3{margin:.34rem 0 .36rem;font-size:1.06rem;line-height:1.25}
.daily-ocean-fact .label{line-height:1.35}
.city-jazz-card{
  position:relative;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1.35fr) minmax(230px,.65fr);
  gap:22px;align-items:center;min-height:250px;padding:24px;
  background:radial-gradient(circle at 84% 22%,rgba(242,171,80,.18),transparent 30%),linear-gradient(135deg,rgba(6,38,57,.98),rgba(9,29,47,.98));
  border-color:rgba(241,185,109,.24)
}
.city-jazz-card:before{content:"";position:absolute;inset:-40% auto auto -10%;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(70,207,215,.1),transparent 65%);pointer-events:none}
.city-jazz-copy{position:relative;z-index:2}
.city-jazz-card h2{margin:.42rem 0 .7rem;font-size:clamp(1.7rem,3.3vw,2.55rem);letter-spacing:-.035em}
.city-jazz-card p{margin:0;max-width:680px;color:rgba(242,249,251,.82);line-height:1.65}
.city-jazz-signoff{display:inline-block;margin-top:16px;color:#f2c37f;font-size:.83rem;font-weight:800;letter-spacing:.04em}
.city-jazz-card>img{position:relative;z-index:2;width:100%;max-width:290px;justify-self:end;border-radius:22px;border:1px solid rgba(255,255,255,.12);box-shadow:0 18px 38px rgba(0,0,0,.28)}
@media(max-width:720px){.city-jazz-card{grid-template-columns:1fr}.city-jazz-card>img{justify-self:start;max-width:100%}}


/* v1.1.52 — City Jazz Radio elegant rebuild */
.city-jazz-teaser{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:20px;
  align-items:center;
  padding:20px 22px;
  background:
    radial-gradient(circle at 88% 20%,rgba(244,179,91,.12),transparent 26%),
    linear-gradient(145deg,rgba(7,44,61,.96),rgba(5,29,45,.98));
  border-color:rgba(239,190,119,.18);
}
.city-jazz-teaser h2{margin:.34rem 0 .4rem;font-size:1.38rem}
.city-jazz-teaser p{margin:0;max-width:700px;color:rgba(242,249,251,.76);line-height:1.55}
.city-jazz-teaser-actions{display:grid;gap:9px;justify-items:end;min-width:220px}
.city-jazz-teaser-actions>span{font-size:.76rem;color:#efc17d;font-weight:800;letter-spacing:.035em}

.city-jazz-world{display:grid;gap:18px;padding-bottom:8px}
.city-jazz-hero{
  position:relative;
  min-height:500px;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr);
  gap:34px;
  align-items:center;
  padding:clamp(30px,5vw,58px);
  border:1px solid rgba(244,189,113,.22);
  border-radius:32px;
  background:
    radial-gradient(circle at 84% 28%,rgba(240,165,74,.18),transparent 26%),
    radial-gradient(circle at 20% 18%,rgba(63,184,201,.16),transparent 30%),
    linear-gradient(150deg,rgba(5,37,55,.985),rgba(6,22,37,.995));
  box-shadow:0 28px 74px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.045)
}
.city-jazz-hero:before{
  content:"";
  position:absolute;
  width:500px;height:500px;
  right:-190px;bottom:-270px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(62,201,213,.13),transparent 68%);
  pointer-events:none
}
.city-jazz-hero-copy{position:relative;z-index:2}
.city-jazz-hero h1{
  margin:.5rem 0 .25rem;
  font-size:clamp(3.4rem,8vw,6.6rem);
  line-height:.92;
  letter-spacing:-.06em
}
.city-jazz-kicker{
  margin:.7rem 0 1.1rem;
  color:#efc17d;
  font-size:clamp(1rem,2vw,1.25rem);
  font-weight:800;
  letter-spacing:.035em
}
.city-jazz-hero-lead{
  max-width:700px;
  margin:0;
  color:rgba(242,249,251,.82);
  font-size:clamp(1.03rem,2vw,1.2rem);
  line-height:1.7
}
.city-jazz-hero-tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px}
.city-jazz-hero-tags span{
  padding:8px 11px;
  border-radius:999px;
  border:1px solid rgba(239,193,125,.18);
  background:rgba(255,255,255,.04);
  color:rgba(248,246,239,.82);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.055em;
  text-transform:uppercase
}
.city-jazz-logo-stage{
  position:relative;
  min-height:390px;
  display:grid;
  place-items:center
}
.city-jazz-logo-stage img{
  position:relative;z-index:2;
  width:min(100%,390px);
  border-radius:28px;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 28px 60px rgba(0,0,0,.35)
}
.city-jazz-glow{
  position:absolute;
  width:360px;height:360px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(239,167,77,.18),rgba(66,198,208,.08) 38%,transparent 70%);
  filter:blur(10px)
}

.city-jazz-origin{
  display:grid;
  grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);
  gap:34px;
  align-items:start;
  padding:30px;
  background:linear-gradient(145deg,rgba(11,51,66,.94),rgba(5,29,43,.98))
}
.city-jazz-origin h2{
  margin:.45rem 0 0;
  font-size:clamp(1.8rem,3.4vw,2.7rem);
  line-height:1.08;
  letter-spacing:-.035em
}
.city-jazz-origin p{margin:0 0 12px;line-height:1.72;color:rgba(242,249,251,.8)}

.city-jazz-product{
  padding:34px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:30px;
  background:linear-gradient(150deg,rgba(5,29,44,.97),rgba(8,43,57,.94))
}
.city-jazz-product-intro{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:28px;
  align-items:end;
  margin-bottom:24px
}
.city-jazz-product-intro .eyebrow{grid-column:1/-1}
.city-jazz-product-intro h2{
  margin:.45rem 0 0;
  font-size:clamp(1.9rem,3.5vw,2.85rem);
  line-height:1.08;
  letter-spacing:-.035em
}
.city-jazz-product-intro p{margin:0;line-height:1.7;color:rgba(242,249,251,.76)}
.city-jazz-pillars{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px
}
.city-jazz-pillars article{
  min-height:190px;
  padding:18px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.035)
}
.city-jazz-pillars article>span{
  display:inline-flex;
  width:31px;height:31px;
  align-items:center;justify-content:center;
  border-radius:9px;
  background:rgba(239,193,125,.12);
  color:#efc17d;
  font-size:.7rem;
  font-weight:900
}
.city-jazz-pillars h3{margin:.8rem 0 .45rem;font-size:1.04rem}
.city-jazz-pillars p{margin:0;color:var(--muted);line-height:1.56;font-size:.88rem}

.city-jazz-investor{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:30px;
  padding:30px;
  background:
    radial-gradient(circle at 94% 12%,rgba(62,197,207,.12),transparent 28%),
    linear-gradient(145deg,rgba(8,44,59,.96),rgba(5,27,41,.98))
}
.city-jazz-investor h2{margin:.45rem 0 .65rem;font-size:clamp(1.8rem,3vw,2.55rem);letter-spacing:-.03em}
.city-jazz-investor p{line-height:1.7;color:rgba(242,249,251,.77)}
.city-jazz-investor-grid{display:grid;gap:10px}
.city-jazz-investor-grid>div{
  display:grid;gap:4px;
  padding:16px 17px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:16px;
  background:rgba(255,255,255,.035)
}
.city-jazz-investor-grid strong{font-size:.92rem}
.city-jazz-investor-grid span{color:var(--muted);line-height:1.48;font-size:.84rem}

.city-jazz-boundary{
  padding:20px 22px;
  border-left:3px solid #efc17d;
  background:rgba(7,40,55,.54);
  border-radius:0 18px 18px 0
}
.city-jazz-boundary p{margin:.45rem 0 0;max-width:930px;line-height:1.65;color:rgba(242,249,251,.78)}

.city-jazz-signature{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  padding:22px 4px 4px
}
.city-jazz-signature h2{margin:.22rem 0 0;font-size:1.55rem;letter-spacing:.01em}

@media(max-width:900px){
  .city-jazz-hero{grid-template-columns:1fr;min-height:auto}
  .city-jazz-logo-stage{min-height:320px}
  .city-jazz-origin{grid-template-columns:1fr}
  .city-jazz-product-intro{grid-template-columns:1fr}
  .city-jazz-product-intro p{margin-top:10px}
  .city-jazz-pillars{grid-template-columns:repeat(2,minmax(0,1fr))}
  .city-jazz-investor{grid-template-columns:1fr}
}
@media(max-width:720px){
  .city-jazz-teaser{grid-template-columns:1fr}
  .city-jazz-teaser-actions{justify-items:start;min-width:0}
  .city-jazz-hero{padding:28px 20px;border-radius:26px}
  .city-jazz-hero h1{font-size:clamp(3rem,15vw,4.8rem)}
  .city-jazz-logo-stage{min-height:260px}
  .city-jazz-logo-stage img{width:min(100%,320px)}
  .city-jazz-pillars{grid-template-columns:1fr}
  .city-jazz-product{padding:24px 18px}
  .city-jazz-signature{align-items:flex-start;flex-direction:column}
}

/* v1.1.53 — bottom utility actions */
.product-footer-actions{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap}
.city-jazz-footer-button{display:inline-flex;align-items:center;gap:9px}
.city-jazz-footer-button span{font-size:.58rem;letter-spacing:.11em;color:#7fe4da;font-weight:900}


/* v1.1.55 — City Jazz customer-facing presentation */
.city-jazz-listen{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:30px;
  padding:30px;
  background:
    radial-gradient(circle at 94% 12%,rgba(62,197,207,.12),transparent 28%),
    linear-gradient(145deg,rgba(8,44,59,.96),rgba(5,27,41,.98));
}
.city-jazz-listen h2{
  margin:.45rem 0 .65rem;
  font-size:clamp(1.8rem,3vw,2.55rem);
  letter-spacing:-.03em;
}
.city-jazz-listen p{
  line-height:1.7;
  color:rgba(242,249,251,.77);
}
.city-jazz-listen-grid{display:grid;gap:10px}
.city-jazz-listen-grid>div{
  display:grid;gap:4px;
  padding:16px 17px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:16px;
  background:rgba(255,255,255,.035);
}
.city-jazz-listen-grid strong{font-size:.92rem}
.city-jazz-listen-grid span{color:var(--muted);line-height:1.48;font-size:.84rem}
@media(max-width:900px){
  .city-jazz-listen{grid-template-columns:1fr}
}


/* v1.1.57 — MARINUM heading accent system
   Carries the subtle About-page white → aqua → warm-gold treatment
   across the product while leaving live values and data readouts plain. */
.screen h1,
.screen h2,
.screen h3{
  background:linear-gradient(96deg,#f8fcfd 0%,#f8fcfd 43%,#8be9df 72%,#efc47d 108%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-wrap:balance;
}

/* Keep operational/live data visually immediate rather than decorative. */
#weatherNow,
#nextEvent,
#fxResult,
#passPrice,
.metric-card strong,
.weather-card h2,
.money-mini h2,
.journey-item h2{
  background:none;
  -webkit-background-clip:border-box;
  background-clip:border-box;
  color:inherit;
}

/* Preserve the About hero's deliberate stronger second-line gradient. */
.about-hero h1{
  background:none;
  -webkit-background-clip:border-box;
  background-clip:border-box;
  color:var(--text);
}
.about-hero h1 span{
  background:linear-gradient(90deg,#fff 8%,#82efe0 58%,#f4c86d 108%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

/* Small headings stay readable while still carrying a hint of colour. */
.card h3,
.city-jazz-pillars h3,
.about-capability-grid h3{
  background:linear-gradient(96deg,#f8fcfd 0%,#f8fcfd 62%,#8be9df 105%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.airium-card p{line-height:1.55}.airium-evidence-grid{display:grid;gap:10px;margin-top:14px}.airium-device-search{grid-column:1/-1}.airium-list-note{margin:.65rem 0}.airium-list-note a{color:var(--aqua)}.airium-check-button{margin-top:12px}.airium-plan-link{display:inline-block;margin:6px 8px 8px 0;text-decoration:none}.airium-route{margin-top:14px}.airium-route p{margin:.35rem 0}.airium-extra{margin-top:12px}.airium-extra summary{cursor:pointer;color:var(--muted)}.airium-check-button:disabled{opacity:.65;cursor:wait}@media(min-width:700px){.airium-evidence-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.airium-evidence-grid label:last-child:nth-child(even){grid-column:1/-1}}
