/* A time-aware travel window, built from original graphics and real memories. */
.ocean-world {
  --ocean-cream: #fff3dd;
  --ocean-soft: #e2e9e8;
  --cloud-opacity: .20;
  position: relative;
  isolation: isolate;
  min-height: 740px;
  min-height: 100svh;
  overflow: hidden;
  background: #102831;
  color: var(--ocean-cream);
  scroll-margin-top: 0;
}
.ocean-world__visual,
.ocean-world__poster,
.ocean-world__webgl,
.ocean-world__ripples { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.ocean-world__visual { z-index: -3; }
.ocean-world__poster img { width: 100%; height: 100%; object-fit: cover; }
.ocean-world__webgl { opacity: 0; }
.ocean-world[data-renderer="webgl"] .ocean-world__webgl { opacity: 1; }
.ocean-world[data-renderer="webgl"] .ocean-world__ripples { display: none; }
.ocean-world::before,
.ocean-world::after { position: absolute; inset: 0; content: ""; pointer-events: none; }
.ocean-world::before { z-index: -2; background: linear-gradient(90deg, rgba(9,28,40,.57), rgba(9,28,40,.12) 48%, transparent 74%), linear-gradient(180deg,rgba(9,24,36,.35),transparent 25%); }
.ocean-world::after { z-index: -1; background: linear-gradient(0deg,rgba(7,21,31,.95),rgba(7,21,31,.45) 22%, transparent 52%); }
.ocean-world__content { display:flex; flex-direction:column; justify-content:space-between; min-height:inherit; gap:32px; padding:clamp(110px,14svh,155px) var(--page-pad,5vw) 25px; }
.ocean-world__heading { pointer-events:none; }
.ocean-world__eyebrow { margin:0 0 22px; font-size:10px; font-weight:700; letter-spacing:.19em; line-height:1.7; }
.ocean-world__eyebrow span { display:inline-block; margin-left:16px; color:var(--ocean-soft); letter-spacing:.08em; font-weight:400; }
.ocean-world__heading h1 { margin:0 0 24px; font-family:var(--font-travel,sans-serif); font-size:clamp(88px,10vw,156px); font-weight:400; line-height:.96; letter-spacing:-.07em; text-shadow:0 5px 40px rgba(4,20,33,.18); }
.ocean-world__quote { margin:0; color:#f8f2e6; font-size:clamp(16px,1.5vw,21px); font-weight:400; line-height:1.6; letter-spacing:-.015em; }
.ocean-world__bottom { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; margin-top:auto; padding-top:20px; }
.ocean-world__explore { max-width:500px; min-width:0; }
.ocean-world__time-row { display:flex; align-items:flex-end; gap:28px; margin-bottom:21px; }
.ocean-world__place { margin:0 0 7px; color:var(--ocean-soft); font-size:11px; letter-spacing:.02em; }
.ocean-world__clock { display:flex; align-items:baseline; gap:12px; margin:0; line-height:1; }
.ocean-world__clock time { font-family:Georgia,"Times New Roman",serif; font-size:43px; font-variant-numeric:tabular-nums; letter-spacing:-.055em; }
.ocean-world__clock span { color:#e8dfcc; font-size:11px; }
.ocean-world__forecast { max-width:170px; margin:0 0 4px; font-size:11px; line-height:1.65; color:#e6ebea; }
.ocean-world__destinations { display:flex; align-items:center; gap:12px; margin-bottom:15px; }
.ocean-world__destinations label { color:#dbe5e4; font-size:11px; white-space:nowrap; }
.ocean-world__destinations select { min-width:150px; min-height:40px; max-width:100%; padding:7px 26px 7px 4px; border:0; border-bottom:1px solid rgba(255,243,221,.5); border-radius:0; background:transparent; color:#fff5e4; font:inherit; font-size:13px; cursor:pointer; }
.ocean-world__destinations option { background:#142e3b; color:#fff5e4; }
.ocean-world__nearby { padding:9px 0 9px 8px; min-height:42px; white-space:nowrap; border:0; background:transparent; color:#fff5e4; font-size:11px; cursor:pointer; }
.ocean-world__nearby span { font-size:19px; margin-left:5px; }
.ocean-world__controls { display:flex; align-items:center; gap:18px; }
.ocean-world__phases { display:flex; gap:2px; border:1px solid rgba(232,239,237,.35); border-radius:999px; padding:3px; }
.ocean-world__phases button { min-height:36px; min-width:45px; padding:7px 13px; border:0; border-radius:999px; background:transparent; color:#eff1e7; font:inherit; font-size:11px; cursor:pointer; }
.ocean-world__phases button[aria-pressed="true"] { background:#f0e9d6; color:#142b38; }
.ocean-world__phases button:hover:not([aria-pressed="true"]) { background:rgba(255,255,255,.13); }
.ocean-world__motion { display:flex; align-items:center; justify-content:center; gap:7px; min-height:44px; padding:10px 4px; border:0; background:transparent; color:#f7efdd; font:inherit; font-size:11px; white-space:nowrap; cursor:pointer; }
.ocean-world__motion-icon { font-size:15px; width:15px; }
.ocean-world__status { margin:10px 0 0; color:#bdcdce; font-size:10px; line-height:1.6; }
.ocean-world__weather-source { margin:4px 0 0; font-size:9px; line-height:1.6; color:#afc3c6; }
.ocean-world__weather-source a { color:inherit; text-underline-offset:3px; }
.ocean-world__memory { display:flex; width:300px; flex-shrink:0; align-items:center; gap:16px; padding:12px 0 12px 16px; border-left:1px solid rgba(255,244,226,.45); color:#fff3dd; text-decoration:none; }
.ocean-world__memory img { width:94px; height:104px; object-fit:cover; filter:saturate(.85); }
.ocean-world__memory small { display:block; margin-bottom:8px; font-size:9px; color:#cedbd8; }
.ocean-world__memory strong { display:block; max-width:15ch; font-size:14px; font-weight:600; line-height:1.55; }
.ocean-world__memory em { display:block; margin-top:12px; font-size:10px; font-style:normal; }
.ocean-world__footnote { display:flex; justify-content:space-between; align-items:center; gap:18px; padding-top:4px; font-size:9px; color:#a6bdc1; }
.ocean-world__footnote a { color:#ede9d9; font-size:11px; text-decoration:none; white-space:nowrap; }
.ocean-world__footnote a span { display:inline-block; margin-left:15px; font-size:18px; }
.ocean-world [hidden] { display:none!important; }
.ocean-world button:focus-visible,.ocean-world a:focus-visible,.ocean-world select:focus-visible { outline:3px solid #ffdda1; outline-offset:4px; }
.ocean-world__clouds { position:absolute; left:-8%; top:3%; width:116%; height:31%; opacity:var(--cloud-opacity); mix-blend-mode:screen; filter:blur(7px); animation:oceanCloudDrift 110s linear infinite alternate; animation-play-state:paused; }
.ocean-world__clouds svg { width:100%; height:100%; fill:#efded1; }
.ocean-world[data-scene="night"] .ocean-world__clouds { opacity:calc(var(--cloud-opacity) * .4); }
.ocean-world__boat-track { position:absolute; width:clamp(31px,4vw,58px); top:44%; left:35%; animation:oceanBoatPass 105s linear infinite alternate; animation-play-state:paused; }
.ocean-world__boat { display:block; width:100%; height:auto; animation:oceanBoatRock 6s ease-in-out infinite; animation-play-state:paused; transform-origin:50% 86%; }
.boat-sail { fill:#d0cab2; opacity:.8; }
.boat-sail-small { fill:#859493; }
.boat-hull { fill:#132b37; }
.boat-mast { stroke:#1b343d; stroke-width:1.5; }
.boat-wake { fill:none; stroke:#e6dac0; stroke-opacity:.45; stroke-width:1.4; }
.ocean-world[data-scene="night"] .boat-sail { fill:#7d95a2; opacity:.6; }
.ocean-world[data-scene="night"] .boat-hull { fill:#101f2b; }
.ocean-world[data-motion="playing"] .ocean-world__clouds,.ocean-world[data-motion="playing"] .ocean-world__boat-track,.ocean-world[data-motion="playing"] .ocean-world__boat { animation-play-state:running; }
@keyframes oceanCloudDrift { to { transform:translateX(5%); } }
@keyframes oceanBoatPass { from { transform:translateX(-30px); } to { transform:translateX(90px); } }
@keyframes oceanBoatRock { 50% { transform:translateY(1px) rotate(1.5deg); } }
.ocean-world__location-dialog { width:min(440px,calc(100% - 36px)); max-height:85svh; padding:30px; border:1px solid #61787c; border-radius:6px; background:#142d39; color:#fff3dd; box-shadow:0 24px 100px #07111bab; }
.ocean-world__location-dialog::backdrop { background:rgba(3,13,21,.7); backdrop-filter:blur(5px); }
.ocean-world__location-dialog h2 { margin:0 0 18px; font-size:26px; font-weight:500; line-height:1.35; }
.ocean-world__location-dialog p:not(.ocean-world__eyebrow) { font-size:13px; line-height:1.8; color:#cfdddd; }
.ocean-world__location-dialog form>div { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.ocean-world__location-dialog button { min-height:44px; padding:10px 14px; border:1px solid #71878b; border-radius:3px; background:transparent; color:#fff3dd; font:inherit; font-size:12px; cursor:pointer; }
.ocean-world__location-dialog button[value="confirm"] { background:#eae2ce; color:#18323e; border-color:#eae2ce; }
@media(max-width:900px) {
 .ocean-world__memory { width:220px; gap:10px; }
 .ocean-world__memory img { width:66px; height:87px; }
}
@media(max-width:760px) {
 .ocean-world__content { gap:22px; padding:105px 24px 20px; min-height:max(760px,100svh); }
 .ocean-world__heading h1 { font-size:clamp(82px,25vw,130px); margin-bottom:22px; }
 .ocean-world__eyebrow { font-size:8px; margin-bottom:21px; letter-spacing:.15em; }
 .ocean-world__eyebrow span { margin-left:10px; font-size:9px; }
 .ocean-world__quote { font-size:15px; }
 .ocean-world__bottom { display:block; padding-top:70px; }
 .ocean-world__time-row { gap:20px; margin-bottom:15px; }
 .ocean-world__clock time { font-size:35px; }
 .ocean-world__forecast { max-width:150px; font-size:10px; }
 .ocean-world__destinations { gap:10px; }
 .ocean-world__destinations select { min-width:0; flex:1; width:130px; }
 .ocean-world__destinations label { font-size:10px; }
 .ocean-world__controls { gap:13px; }
 .ocean-world__phases button { min-width:40px; padding:7px 11px; }
 .ocean-world__memory { width:100%; max-width:330px; padding:0; margin-top:22px; border-left:0; gap:12px; }
 .ocean-world__memory img { width:68px; height:59px; }
 .ocean-world__memory small { margin-bottom:3px; font-size:8px; }
 .ocean-world__memory strong { font-size:12px; max-width:none; }
 .ocean-world__memory em { margin-top:3px; font-size:9px; }
 .ocean-world__footnote { align-items:flex-start; font-size:8px; gap:12px; }
 .ocean-world__footnote>span { max-width:17ch; line-height:1.6; }
 .ocean-world__footnote a { font-size:10px; }
 .ocean-world__boat-track { left:55%; top:43%; width:34px; }
 .ocean-world__clouds { top:8%; }
}
@media(max-width:360px) {
 .ocean-world__content { padding-left:20px; padding-right:20px; }
 .ocean-world__phases button { min-width:36px; padding:7px 9px; }
 .ocean-world__controls { gap:10px; }
 .ocean-world__destinations { gap:7px; }
 .ocean-world__clock span { font-size:9px; }
}
@media(prefers-reduced-motion:reduce) { .ocean-world__clouds,.ocean-world__boat-track,.ocean-world__boat { animation:none!important; } }

.ocean-world__visual::after { position:absolute; inset:0; content:""; background:#637786; opacity:var(--weather-haze,0); pointer-events:none; }
