#earth-surface{--ocean-cold:#64d7ff;--ocean-warm:#ffaf79}#earth-surface .ocean-card{padding:clamp(16px,3vw,26px);margin-top:16px;min-width:0}#earth-surface h3{font-size:1.25rem;margin:0 0 8px}#earth-surface p{font-size:1rem;line-height:1.8;color:var(--muted)}#earth-surface .ocean-note{font-size:.8125rem;margin:10px 0;line-height:1.7}#earth-surface .ocean-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin:14px 0}#earth-surface .ocean-controls{display:flex;flex-wrap:wrap;gap:8px;align-items:center}#earth-surface button,#earth-surface select,#earth-surface input{font:inherit}#earth-surface .ocean-controls button,#earth-surface select{min-height:44px;border:1px solid var(--line);background:var(--panel,#102337);color:var(--text);padding:8px 12px;border-radius:12px;font-size:.875rem;cursor:pointer}#earth-surface .ocean-controls button[aria-pressed=true]{border-color:var(--cyan);background:rgba(85,216,242,.12)}#earth-surface button:focus-visible,#earth-surface select:focus-visible,#earth-surface input:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}#earth-surface button:disabled{opacity:.45;cursor:default}#earth-surface label{display:grid;gap:8px;font-size:.875rem;min-width:0}#earth-surface select{max-width:100%;width:100%}.ocean-map-viewport{position:relative;overflow:auto;direction:ltr;background:#061f33;border-radius:16px;border:1px solid var(--line);max-height:65vh;overscroll-behavior:contain}.ocean-map-world{position:relative;aspect-ratio:2;min-width:100%;direction:ltr}.ocean-map-image,.ocean-currents-map{display:block;width:100%;height:100%;position:absolute;inset:0}.ocean-map-image{object-fit:fill}.ocean-currents-map{pointer-events:none}.ocean-map-world[data-layer=currents] .ocean-map-image{filter:brightness(.5) saturate(.5)}.ocean-map-world[data-layer=sst] .ocean-map-image{background:#142637}.ocean-marker{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);display:grid;place-items:center;width:34px;height:34px;border:2px solid #fff;border-radius:50%;color:#081622;background:#ffdc85;font-size:18px;box-shadow:0 0 0 6px #071c3355;pointer-events:none}.ocean-map-caption{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-top:12px;font-size:.8125rem;color:var(--muted)}.ocean-map-legend{display:flex;flex-wrap:wrap;gap:14px;align-items:center;font-size:.875rem;padding:12px 0}.ocean-map-legend span{display:flex;gap:6px;align-items:center}.ocean-map-legend i{width:18px;height:6px;border-radius:4px;background:var(--tone)}.ocean-palette{height:12px;border-radius:4px;background:linear-gradient(to right,#070b59,#075aac,#70bdd8,#cfefd0,#478027,#d8c785,#976c44,#fff);direction:ltr}.ocean-palette-labels{display:flex;justify-content:space-between;gap:4px;direction:ltr;color:var(--muted);font-size:.75rem;margin-top:4px}.ocean-selection{padding:16px;background:rgba(85,216,242,.05);border:1px solid var(--line);border-radius:14px;margin-top:14px}.ocean-selection strong{font-size:1.25rem;display:block;color:var(--text)}.ocean-selection p{margin:4px 0}.ocean-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.ocean-scale-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ocean-scale{position:relative;height:420px;margin:20px 0 12px;direction:ltr;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:linear-gradient(to bottom,rgba(245,210,133,.04) 0 45%,rgba(38,153,194,.12) 45% 100%)}.ocean-scale-grid{position:absolute;inset:0}.ocean-scale-tick{position:absolute;left:0;right:0;top:var(--y);border-top:1px solid var(--line);font-size:12px;color:var(--muted);padding:3px 7px}.ocean-scale-tick.zero{border-color:#a7e5e9;color:var(--text)}.ocean-scale-bar{position:absolute;width:20%;border:1px solid rgba(255,255,255,.3);border-radius:5px}.ocean-scale-peak{left:30%;bottom:55%;height:var(--height);background:linear-gradient(to top,#a47440,#f1d58e)}.ocean-scale-depth{left:66%;top:45%;height:var(--height);background:linear-gradient(to bottom,#55bada,#2369a9)}.ocean-scale-key{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ocean-scale-key span{display:block;font-size:.875rem}.ocean-scale-key strong{display:block;font-size:1.1rem}.ocean-stat{padding:15px;border:1px solid rgba(85,216,242,.3);background:rgba(85,216,242,.06);border-radius:14px;margin-top:14px;line-height:1.8}.ocean-table-scroll{overflow:auto}.ocean-records{width:100%;border-collapse:collapse;font-size:.875rem;min-width:350px}.ocean-records th,.ocean-records td{padding:12px 8px;text-align:right;border-bottom:1px solid var(--line)}.ocean-records small{display:block;color:var(--muted);line-height:1.5}.ocean-current-list{display:flex;flex-wrap:wrap;gap:8px}.ocean-current-list button{padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:transparent;color:var(--text);font-size:.875rem;min-height:44px;cursor:pointer}.ocean-current-list button[aria-pressed=true]{border-color:var(--cyan);background:rgba(85,216,242,.09)}.ocean-tide-chart{width:100%;height:170px;background:rgba(25,92,133,.08);border-radius:14px;display:block}.ocean-tide-control{display:grid;gap:10px;margin:18px 0}.ocean-tide-control input{width:100%;accent-color:var(--cyan)}.ocean-tide-phases{display:flex;flex-wrap:wrap;gap:7px}.ocean-tide-phases button{border:1px solid var(--line);border-radius:9px;padding:8px 12px;background:transparent;color:var(--text);cursor:pointer;min-height:44px}.ocean-sst-controls{display:flex;align-items:end;flex-wrap:wrap;gap:10px}.ocean-sst-controls input{background:var(--panel,#102337);color:var(--text);border:1px solid var(--line);border-radius:10px;padding:9px;min-height:44px;color-scheme:dark}.ocean-sst-legend{display:block;max-width:100%;width:520px;margin:10px auto}.ocean-status{color:var(--muted);font-size:.875rem;line-height:1.7}.ocean-sources summary{font-size:1rem;font-weight:700;cursor:pointer}.ocean-sources a{display:inline-block;margin:6px 0 6px 16px;color:var(--cyan);font-size:.875rem}.ocean-sources li{font-size:.875rem;line-height:1.8;color:var(--muted)}#earth-surface [hidden]{display:none!important}body.light #earth-surface .ocean-sst-controls input{color-scheme:light}@media(max-width:760px){.ocean-grid{grid-template-columns:1fr}.ocean-scale-controls{grid-template-columns:1fr}.ocean-scale{height:360px}.ocean-map-caption{font-size:.75rem}.ocean-toolbar>label{width:100%}}
