:root{--navy:#071b38;--blue:#0d3267;--mid:#174985;--cyan:#56c8e6;--yellow:#ffd500;--paper:#f4f9fd;--line:#9edcf0;--muted:#9fb6cf}*{box-sizing:border-box}body{margin:0;background:linear-gradient(145deg,#eaf7ff,#fff8dc);color:#fff;font-family:Inter,Arial,sans-serif}header{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;max-width:1120px;margin:auto;padding:12px 20px;background:rgba(7,27,56,.96);border-bottom:3px solid var(--cyan)}.brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}.brand>span{display:grid;place-items:center;width:48px;height:48px;background:#fff3c7;color:var(--navy);font-weight:1000;border-radius:50%}.brand strong{font-size:19px}.brand small{display:block;color:#71ddfa;font-size:10px;letter-spacing:.12em}button{border:1px solid var(--yellow);background:var(--yellow);color:#071b38;padding:11px 16px;font-weight:900;border-radius:8px}main{width:min(1120px,100%);margin:auto;background:#081f40;padding:22px}.hero{display:grid;grid-template-columns:1fr auto;align-items:center;min-height:225px;padding:30px;background:linear-gradient(120deg,#0a2855 20%,#174985 72%,#277f91);border-top:4px solid var(--cyan)}.eyebrow,.panel>small,.section-title small,.tides>div>small{color:#6fdcf5;font-weight:900;letter-spacing:.14em}.hero h1{font-size:clamp(32px,6vw,60px);line-height:1;margin:8px 0}.hero p{color:#d6e9fa}.hero-now{text-align:center;min-width:190px}.hero-now span{display:block;font-size:62px}.hero-now strong{display:block;font-size:58px}.hero-now small{font-weight:800}.panel{margin-top:12px;padding:22px;background:#0d2d5d;border-top:3px solid #73d7ed}.status{display:flex;align-items:center;gap:18px}.status .light{width:20px;height:72px;background:#8293a5}.status[data-state=green] .light{background:#43d46b}.status[data-state=yellow] .light{background:#ffd500}.status[data-state=red] .light{background:#ff5368}.status h2{margin:4px 0}.status p{margin:0;color:#c5d9ed}.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:12px;background:#04152d}.facts article{padding:22px;background:#12396f;border-top:3px solid #70cfe7}.facts article.water{background:#174b7d}.facts small,.facts span{display:block;color:#b9d4e9}.facts strong{display:block;font-size:30px;margin:8px 0;color:#fff}.forecast{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-top:18px}.day{padding:14px 8px;text-align:center;background:#12396f}.day .ico{font-size:31px}.day strong,.day small{display:block}.day small{color:#acd0e8;margin-top:6px}.sunmoon{display:grid;grid-template-columns:1fr 1fr;gap:12px}.two{display:grid;grid-template-columns:1fr 1fr;margin-top:18px}.two div{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:center}.two span{grid-row:1/3;font-size:32px}.two small,.moon small{color:#afc7dd}.moon{display:flex;gap:18px;align-items:center;margin-top:18px}.moon>span{font-size:50px}.moon strong,.moon small{display:block}.tide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;margin-top:18px}.tide-grid div{background:#12396f;padding:16px}.tide-grid small,.tide-grid strong{display:block}.tide-grid strong{font-size:20px;margin-top:5px}.notice{margin:12px 0;padding:20px;background:#fff7d2;color:#3f3100;border-left:6px solid #ffd000}.notice strong{font-size:20px}.notice p{line-height:1.55;margin:8px 0 0}.seo{background:#fff;color:#15345e;padding:26px;border-top:4px solid #55c5e5}.seo h2{font-size:28px}.seo p{line-height:1.7}.seo nav{display:flex;flex-wrap:wrap;gap:8px}.seo a{padding:10px 13px;background:#e6f7fc;color:#164b7d;text-decoration:none;font-weight:800}footer{max-width:1120px;margin:auto;padding:24px;background:#06172f;text-align:center;color:#9fb6cf}footer a{color:#fff}@media(max-width:760px){header{border-radius:0}.brand strong{font-size:16px}main{padding:10px}.hero{grid-template-columns:1fr;padding:22px}.hero-now{text-align:left;margin-top:18px}.hero-now span,.hero-now strong{display:inline-block;font-size:43px}.facts{grid-template-columns:1fr 1fr}.forecast{grid-template-columns:repeat(4,1fr);overflow:auto}.sunmoon{grid-template-columns:1fr}.tide-grid{grid-template-columns:1fr}.seo{padding:20px}}