@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Caslon+Display&display=swap');
:root{--bg:#061e2a;--panel:#0b2b39;--ink:#edf5ef;--muted:#b6cbd0;--mint:#c8f48e;--line:#31505a;--orange:#ffad81}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.65}a{color:inherit;text-underline-offset:5px}button{font:inherit;cursor:pointer}button,a{touch-action:manipulation}a:focus-visible,button:focus-visible{outline:3px solid var(--mint);outline-offset:5px}header{height:80px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;background:#061e2af5;position:sticky;top:0;z-index:1001;border-bottom:1px solid #ffffff18}.brand{text-decoration:none;font-size:14px;letter-spacing:.13em;font-weight:700;display:flex;align-items:center;gap:12px}.brand:first-letter{font-size:30px}nav{display:flex;gap:30px;font-size:14px}nav a{text-decoration:none}nav a:last-child{color:var(--mint)}.skip{position:fixed;top:-80px;z-index:2000;background:var(--mint);color:var(--bg);padding:15px}.skip:focus{top:10px}.hero{position:relative;min-height:660px;display:flex;align-items:center;overflow:hidden}.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 48%}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#061e2af5 4%,#061e2acc 33%,#061e2a22 75%),linear-gradient(0deg,#061e2a,transparent 27%)}.hero-copy{position:relative;padding:65px 7% 110px;max-width:880px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:.18em;color:var(--mint);margin:0 0 24px}h1,h2,h3,p{margin-top:0}h1,h2{font-family:'Libre Caslon Display',Georgia,serif;font-weight:400;line-height:1.05;letter-spacing:-.025em}h1{font-size:clamp(50px,6.4vw,90px);margin-bottom:25px}h1 em{font-style:normal;color:var(--mint)}.hero-copy>p:not(.eyebrow){max-width:440px;color:#d4e1e2;font-size:18px;margin-bottom:30px}.button{background:var(--mint);color:var(--bg);display:inline-flex;align-items:center;gap:30px;padding:14px 22px;text-decoration:none;border-radius:3px;font-weight:600}.text-link{display:inline-block;margin:20px 0 0 22px;font-size:14px}.hero-bottom{position:absolute;bottom:28px;left:7%;right:7%;display:flex;justify-content:space-between;font-size:12px;letter-spacing:.12em;color:var(--muted)}.hero-bottom a{letter-spacing:0}.section{padding:85px 7%;scroll-margin-top:0}.section-top{display:grid;grid-template-columns:1.2fr 1fr;gap:80px;align-items:end;margin-bottom:30px}h2{font-size:clamp(38px,4.1vw,58px);margin-bottom:12px}.section-top>p{max-width:470px;color:var(--muted);margin-bottom:10px}.notice{padding:14px 20px;background:#c8f48e0d;border:1px solid #c8f48e40;font-size:14px;margin-bottom:24px;color:#d0dedb}.notice strong{color:var(--mint)}.map-layout{display:grid;grid-template-columns:1fr 330px;min-height:430px;border:1px solid var(--line);border-radius:5px;overflow:hidden}.map-wrap{position:relative;min-height:430px}#map{height:100%;min-height:430px;background:#152f3e;z-index:1}.map-reset{position:absolute;bottom:30px;left:14px;z-index:500;background:var(--ink);color:var(--bg);border:0;border-radius:3px;padding:9px 13px;font-size:14px}.leaflet-container{font-family:'DM Sans',sans-serif}.number-pin{width:32px!important;height:32px!important;border-radius:50%;display:grid;place-items:center;background:var(--mint);border:2px solid #061e2a;box-shadow:0 0 0 5px #c8f48e25;font-weight:700;color:#061e2a}.number-pin.active{background:var(--orange);box-shadow:0 0 0 7px #ffad8133}.leaflet-control-attribution{font-size:11px!important}#restaurant-detail{padding:30px;background:var(--panel);display:flex;flex-direction:column;justify-content:center}#restaurant-detail .eyebrow{margin-bottom:15px}h3{font-size:23px;line-height:1.3;font-weight:500;margin-bottom:16px}#restaurant-detail p{font-size:14px;color:var(--muted)}#restaurant-detail .detail-link{color:var(--mint);font-size:14px;margin:3px 0}.badge{font-size:12px;border:1px solid var(--line);border-radius:3px;padding:4px 8px;width:fit-content;margin-bottom:18px}.restaurant-list{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px}.restaurant-list button{color:var(--muted);background:transparent;border:1px solid var(--line);text-align:left;padding:16px 12px;font-size:14px;border-radius:3px}.restaurant-list button[aria-pressed=true]{border-color:var(--mint);color:var(--mint);background:#c8f48e08}.restaurant-list small{display:block;margin-left:23px;font-size:12px}.fine{font-size:12px;color:var(--muted);margin:18px 0 0;max-width:900px}.split{display:grid;grid-template-columns:1fr 1fr;gap:80px}.copy p{color:var(--muted)}.story-section{background:#092735}.rule{border-top:1px solid var(--line);padding-top:23px}.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:55px}.facts strong{display:block;color:var(--mint);font-family:Georgia,serif;font-size:38px;font-weight:400}.facts h3{font-size:18px;margin-top:12px}.facts p{font-size:14px;color:var(--muted)}.timeline{display:grid;grid-template-columns:repeat(6,1fr);margin:40px 0 25px;border-bottom:1px solid var(--line)}.timeline button{padding:18px 8px;color:var(--muted);border:0;border-bottom:3px solid transparent;background:none;font-size:18px}.timeline button[aria-pressed=true]{color:var(--mint);border-color:var(--mint)}.time-detail{display:grid;grid-template-columns:1fr 2fr;gap:50px;min-height:140px}.time-detail .year{font-family:Georgia,serif;font-size:64px;color:var(--mint);line-height:1.2}.time-detail p{color:var(--muted);max-width:650px}.reef-section{background:#041924}.reef-layout{display:grid;grid-template-columns:1.45fr 1fr;gap:35px}.web{position:relative;height:400px;border:1px solid var(--line);border-radius:5px;background:radial-gradient(ellipse at center,#133c43,transparent 65%)}.web svg{position:absolute;inset:0;width:100%;height:100%}.web line{stroke:#779495;stroke-width:1.5}.web line.hot{stroke:var(--orange);stroke-width:2}.node{position:absolute;transform:translate(-50%,-50%);border:1px solid #71918c;border-radius:50px;background:#0c303a;color:var(--ink);padding:10px 15px;font-size:14px;min-height:46px}.node[aria-pressed=true]{border-color:var(--mint);color:var(--mint);box-shadow:0 0 0 5px #c8f48e15}.node.lion{border-color:var(--orange);color:var(--orange)}.web-detail{align-self:center}.web-detail p{color:var(--muted)}.relation{font-size:14px;color:var(--mint)!important;border-top:1px solid var(--line);padding-top:20px}.legend{font-size:12px;color:var(--muted);margin-top:15px}.dining{background:#c8f48e;color:#072632}.dining .eyebrow{color:#355845}.dining p{color:#264b4e}.dining a{color:#072632}.dining .rule{border-color:#07263244}.sources{display:grid;grid-template-columns:1fr 1fr;gap:0 50px}.sources article{padding:24px 0;border-top:1px solid var(--line)}.sources h3{font-size:19px}.sources p{font-size:14px;color:var(--muted)}.sources a{font-size:14px;color:var(--mint)}footer{border-top:1px solid var(--line);padding:35px 7%;display:flex;gap:25px;justify-content:space-between;color:var(--muted);font-size:12px}.reveal{opacity:1;transform:none}.motion .reveal.waiting{opacity:0;transform:translateY(18px)}.motion .reveal{transition:opacity .7s,transform .7s}@media(max-width:900px){.map-layout{grid-template-columns:1fr 290px}.hero-copy{padding-left:6%}.text-link{display:block;margin-left:0}.section-top,.split{gap:35px}.reef-layout{grid-template-columns:1fr 1fr}.restaurant-list{grid-template-columns:1fr 1fr}nav{gap:18px}.brand{font-size:12px}}@media(max-width:650px){header{height:auto;min-height:72px;flex-wrap:wrap;padding:13px 5%;gap:8px}nav{width:100%;justify-content:space-between;font-size:12px;gap:8px}.hero{min-height:665px}.hero-copy{padding:60px 6% 100px}.hero-shade{background:linear-gradient(90deg,#061e2ade,#061e2a55),linear-gradient(0deg,#061e2a,transparent)}.hero>img{object-position:61% center}.hero-copy>p:not(.eyebrow){font-size:17px}.hero-bottom{font-size:10px;left:6%;right:6%;gap:15px}.section{padding:58px 6%}.section-top,.split,.reef-layout,.time-detail{grid-template-columns:1fr;gap:22px}.section-top{margin-bottom:24px}.map-layout{grid-template-columns:1fr}.map-wrap,#map{min-height:330px;height:330px}#restaurant-detail{padding:25px}.facts{grid-template-columns:1fr;gap:20px;margin-top:30px}.facts strong{float:left;width:100px;margin-right:15px}.facts h3{margin-top:0}.facts p{margin-left:115px}.timeline{grid-template-columns:repeat(3,1fr);margin-top:20px}.timeline button{font-size:16px}.time-detail{min-height:230px}.time-detail .year{font-size:42px}.web{height:350px}.node{font-size:12px;padding:9px 10px}.sources{grid-template-columns:1fr}footer{flex-direction:column;gap:16px}.eyebrow{font-size:11px}.section-top>p{margin:0}.restaurant-list button{padding:12px 8px}.hero-bottom a{max-width:85px;text-align:right}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.motion .reveal.waiting{opacity:1;transform:none}}
/* Ocean journey enhancements */
.light-rays{position:absolute;inset:-30% -15%;pointer-events:none;background:repeating-conic-gradient(from 165deg at 70% 0%,transparent 0deg 9deg,#d5f9ed12 10deg 13deg,transparent 15deg 24deg);transform-origin:70% 0%;animation:ocean-light 16s ease-in-out infinite alternate;mix-blend-mode:screen}.motion-toggle{position:absolute;right:7%;top:22px;z-index:2;border:1px solid #b6cbd066;border-radius:30px;background:#061e2acc;color:var(--ink);padding:8px 15px;font-size:14px}.motion-toggle:disabled{opacity:.8;cursor:default}@keyframes ocean-light{from{transform:rotate(-5deg);opacity:.35}to{transform:rotate(5deg);opacity:.8}}.effects-paused .light-rays{animation-play-state:paused}
#spread-map{height:360px;background:#153642;border:1px solid var(--line);border-radius:5px;z-index:1;margin-bottom:15px}.new-spread-point{animation:point-arrive .6s ease-out}@keyframes point-arrive{from{opacity:0;stroke-width:10}to{opacity:1;stroke-width:2}}
.web line{transition:opacity .3s,stroke-width .3s}.web .edge-active{opacity:1;stroke-width:3.5}.web .edge-muted{opacity:.17}.node{transition:opacity .3s,border-color .3s}.node.node-muted{opacity:.45}.node.node-muted:hover,.node.node-muted:focus-visible{opacity:1}.restaurant-photo{margin:0 0 20px}.restaurant-photo img{width:100%;height:165px;object-fit:cover;border-radius:3px;display:block}.restaurant-photo figcaption{font-size:12px;line-height:1.4;color:var(--muted);margin-top:8px}.restaurant-photo figcaption a{font-size:12px}
@media(max-width:650px){#spread-map{height:290px}.motion-toggle{top:15px;right:6%;font-size:12px}.restaurant-photo img{height:180px}}
@media(prefers-reduced-motion:reduce){.light-rays{animation:none;opacity:.35}.new-spread-point{animation:none}.web line,.node{transition:none}}