.tide-page .harbour-weather {
  margin: 0 0 36px;
  padding: 28px 32px 20px;
  border: 1px solid var(--tide-line);
  border-radius: 26px;
  background: linear-gradient(112deg, #fff 45%, #f3f7f5);
}
.tide-page .weather-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;}
.tide-page .weather-heading .eyebrow {font-size:.62rem;letter-spacing:.18em;margin:0 0 6px;color:#46736f;}
.tide-page .weather-heading h2 {font-family:inherit;font-size:1.3rem;font-weight:650;line-height:1.2;letter-spacing:-.02em;margin:0;}
.tide-page .weather-status-group {display:flex;align-items:center;gap:14px;}
.tide-page .weather-status {display:flex;align-items:center;gap:7px;margin:0;font-size:.74rem;color:var(--muted);}
.tide-page .weather-status-dot {width:6px;height:6px;background:#8c9b9c;border-radius:50%;flex-shrink:0;}
.tide-page [data-state="fresh"] .weather-status-dot {background:#317775;box-shadow:0 0 0 4px #31777510;}
.tide-page [data-state="stale"] .weather-status-dot,.tide-page [data-state="error"] .weather-status-dot {background:#b8894f;}
.tide-page #weather-refresh {display:grid;place-items:center;width:38px;height:38px;padding:9px;border:1px solid var(--tide-line);border-radius:50%;background:transparent;color:var(--ink);cursor:pointer;flex-shrink:0;}
.tide-page #weather-refresh:hover {background:#e8f1ed;}
.tide-page #weather-refresh:focus-visible {outline:2px solid var(--sea);outline-offset:3px;}
.tide-page #weather-refresh:disabled {opacity:.45;cursor:wait;}
.tide-page #weather-refresh svg {width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.tide-page .weather-readings {display:grid;grid-template-columns:1fr 1.3fr 1fr;align-items:center;gap:32px;padding:28px 0;}
.tide-page .weather-label,.tide-page .weather-measures dt {color:var(--muted);font-size:.79rem;font-weight:500;margin:0;}
.tide-page .weather-value {display:flex;align-items:baseline;gap:10px;font-size:clamp(2.6rem,4vw,3.5rem);font-weight:600;letter-spacing:-.05em;line-height:1.15;margin:5px 0 8px;font-variant-numeric:tabular-nums;}
.tide-page .weather-units {font-size:.9rem;font-weight:400;letter-spacing:normal;color:var(--muted);margin-left:5px;}
.tide-page .weather-gust-line {font-size:.9rem;margin:0;color:var(--muted);}
.tide-page .weather-gust-line strong {color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums;}
.tide-page .weather-compass {display:flex;align-items:center;justify-content:center;gap:18px;}
.tide-page .weather-dial {width:130px;height:130px;flex-shrink:0;overflow:visible;}
.tide-page .weather-dial .dial-face {fill:#f8faf8;stroke:#dce3dd;stroke-width:1;}
.tide-page .weather-dial .dial-ring {fill:none;stroke:#e7ece7;stroke-width:1;}
.tide-page .weather-dial .dial-ticks {fill:none;stroke:#aabbb5;stroke-width:1;}
.tide-page .weather-dial text {font:10px -apple-system,sans-serif;fill:#657b76;text-anchor:middle;}
.tide-page .weather-dial .dial-arrow {fill:#317775;}
.tide-page .weather-dial .dial-tail {fill:#d4e4dd;}
.tide-page #weather-pointer[hidden] {display:none;}
.tide-page .weather-direction {font-size:1.7rem;letter-spacing:-.03em;line-height:1.3;font-weight:600;margin:4px 0;}
.tide-page .weather-bearing {font-size:.75rem;color:var(--muted);margin:0;}
.tide-page .weather-measures {display:grid;gap:19px;padding-left:32px;border-left:1px solid var(--tide-line);margin:0;}
.tide-page .weather-measures dd {font-size:1.45rem;letter-spacing:-.03em;font-weight:500;line-height:1.3;margin:3px 0 0;font-variant-numeric:tabular-nums;}
.tide-page .weather-measures .weather-units {font-size:.74rem;}
.tide-page .weather-meta {display:flex;align-items:flex-end;justify-content:space-between;gap:20px;border-top:1px solid var(--tide-line);padding-top:14px;font-size:.7rem;color:var(--muted);line-height:1.55;}
.tide-page .weather-meta p {margin:0;}
.tide-page .weather-meta time {display:block;}
.tide-page .weather-meta a {color:var(--muted);white-space:nowrap;text-decoration:none;font-weight:600;}
.tide-page .weather-meta a:hover {text-decoration:underline;text-underline-offset:3px;}
@media(max-width:760px) {
 .tide-page .harbour-weather {padding:24px 22px 18px;}
 .tide-page .weather-readings {grid-template-columns:1fr 1fr;gap:22px;}
 .tide-page .weather-compass {justify-content:flex-end;gap:12px;}
 .tide-page .weather-dial {width:106px;height:106px;}
 .tide-page .weather-measures {grid-column:1/-1;grid-template-columns:1fr 1fr;padding:18px 0 0;border-left:0;border-top:1px solid var(--tide-line);}
 .tide-page .weather-status-group {gap:9px;}
}
@media(max-width:480px) {
 .tide-page .weather-heading {align-items:flex-start;}
 .tide-page .weather-heading h2 {font-size:1.05rem;}
 .tide-page .weather-heading .eyebrow {font-size:.54rem;}
 .tide-page .weather-status {font-size:.63rem;max-width:90px;line-height:1.4;}
 .tide-page .weather-status-group {gap:5px;}
 .tide-page #weather-refresh {width:32px;height:32px;padding:7px;}
 .tide-page .weather-compass {position:relative;justify-content:center;padding-bottom:36px;}
 .tide-page .weather-compass>div {position:absolute;bottom:-6px;text-align:center;}
 .tide-page .weather-compass .weather-label {display:none;}
 .tide-page .weather-direction {font-size:1.1rem;display:inline;margin-right:6px;}
 .tide-page .weather-bearing {font-size:.65rem;display:inline;}
 .tide-page .weather-readings {gap:16px;padding:22px 0;}
 .tide-page .weather-gust-line {font-size:.78rem;}
}