:root{--ink:#163c45;--teal:#146b6e;--paper:#f7f8f4;--muted:#64777b;--line:#dce4df;--white:#fff;--mint:#eaf2ed;--coral:#bf5e42}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;color:var(--ink);background:var(--paper);font:15px/1.5 'DM Sans',sans-serif}button,input,select{font:inherit}a{color:inherit}button,a,select,input,summary{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #a95c24;outline-offset:4px}.wrap{width:min(1192px,calc(100% - 80px));margin:auto}.topbar{height:97px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:700;text-decoration:none;letter-spacing:-.4px}.brand-mark{background:var(--ink);color:#fff;width:31px;height:31px;display:grid;place-items:center;border-radius:50%;font-size:22px}.brand-year{color:var(--muted);font-weight:400}.topbar nav{display:flex;gap:29px;font-size:13px}.topbar nav a{text-decoration:none}.topbar nav a:hover{text-decoration:underline}.hero{display:grid;grid-template-columns:1.15fr 1fr;gap:60px;padding:63px 0 53px;align-items:center}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:2px;font-weight:700;color:var(--teal);margin:0 0 15px}h1{font-family:'DM Serif Text',Georgia,serif;font-weight:400;font-size:62px;line-height:1.08;letter-spacing:-2.5px;margin:0 0 19px}h1 em{font-style:normal;color:var(--teal)}.intro{color:var(--muted);font-size:16px;line-height:1.65;margin:0}.hero-meta{display:flex;align-items:center;gap:8px;font-size:11px;margin-top:24px;color:var(--muted)}.hero-meta strong{font-weight:500;color:var(--ink)}.status-dot{width:6px;height:6px;background:var(--teal);border-radius:100%}.trip-ticket{background:var(--ink);color:#fff;border-radius:14px;padding:25px 28px;transform:rotate(1deg);box-shadow:0 12px 30px #163c4512}.ticket-top,.ticket-bottom{display:flex;justify-content:space-between;gap:10px;font-size:12px}.ticket-day{color:#bfd4d0}.ticket-route{display:flex;align-items:center;justify-content:space-between;padding:30px 0 27px;gap:20px}.ticket-route>div{display:flex;flex-direction:column;font-size:11px;color:#c4d5d3}.airport-code{font-size:36px;font-weight:600;letter-spacing:-1px;color:#fff;line-height:1.25}.route-arrow{font-size:36px;font-weight:400;color:#8cb2ac}.ticket-bottom{border-top:1px dashed #ffffff45;padding-top:16px;color:#d2dfdb;font-size:11px}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:15px;margin-bottom:17px}.section-heading h2,.panel-title h2{font-size:18px;font-weight:600;letter-spacing:-.4px;margin:0}.section-heading p,.section-heading>span{font-size:11px;color:var(--muted);margin:0}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.choice-card{background:var(--white);border:1px solid var(--line);border-radius:12px;min-height:184px;padding:22px 24px;display:flex;gap:22px;justify-content:space-between}.choice-local{background:var(--mint);border-color:#d3e2d7}.choice-tag{text-transform:uppercase;font-size:9px;letter-spacing:1.3px;color:var(--teal);font-weight:700;display:block;margin-bottom:10px}.choice-card h3{font-size:19px;letter-spacing:-.5px;line-height:1.25;margin:0 0 9px;font-weight:600}.choice-card p{font-size:11px;color:var(--muted);max-width:260px;margin:0}.choice-price{align-self:flex-end;white-space:nowrap;text-align:right;font-size:21px;letter-spacing:-.6px;line-height:1.35;font-weight:600}.choice-price small{display:block;font-size:10px;letter-spacing:0;color:var(--muted);font-weight:400}.offers-section{padding-top:45px}.toolbar{border:1px solid var(--line);padding:11px;background:#fff;border-radius:10px;display:flex;gap:24px;align-items:center}.group-select{display:flex;gap:3px;padding:3px;background:#f0f3ef;border-radius:7px}.group-select button{border:0;background:transparent;color:var(--muted);padding:9px 19px;border-radius:5px;font-size:12px;cursor:pointer}.group-select button[aria-pressed=true]{background:var(--ink);color:#fff;box-shadow:0 1px 2px #0001}.direct-filter{display:flex;align-items:center;gap:7px;font-size:12px;cursor:pointer}.direct-filter input{accent-color:var(--teal);width:15px;height:15px}.sort-label{margin-left:auto}select{padding:9px 26px 9px 10px;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:6px;font-size:12px}.table-note{font-size:10px;color:var(--muted);margin:14px 0 10px}.offers-list{display:grid;gap:10px}.offer{background:#fff;border:1px solid var(--line);border-radius:11px;overflow:hidden}.offer-main{display:grid;grid-template-columns:1.08fr 1.12fr 1.12fr .85fr;gap:22px;padding:22px 24px;align-items:center}.offer-city{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:600;letter-spacing:-.4px}.offer-airport{font-size:10px;color:var(--muted);font-weight:500;background:#f2f5f1;padding:3px 5px;letter-spacing:0;border-radius:4px}.offer-company{color:var(--muted);font-size:11px;margin-top:3px}.baggage{font-size:10px;color:var(--teal);display:block;margin-top:9px}.flight-label{font-size:9px;letter-spacing:.9px;text-transform:uppercase;color:var(--muted);margin-bottom:6px}.flight-hours{font-weight:500;font-size:19px;letter-spacing:-.5px;white-space:nowrap}.flight-hours .thin-arrow{color:#a1b3b1;font-size:14px;padding:0 5px}.flight-connection{font-size:10px;color:var(--muted);margin-top:4px}.next-day{font-size:10px;color:#9d4d34;display:block;font-weight:500;letter-spacing:0;white-space:normal}.price{text-align:right}.price-total{font-size:22px;letter-spacing:-.8px;font-weight:600;white-space:nowrap}.price-pp{font-size:10px;color:var(--muted);margin-top:3px}.price-eur{font-size:10px;color:var(--muted);margin-top:3px}.offer-details{border-top:1px solid #edf0ec}.offer-details summary{font-size:10px;cursor:pointer;color:var(--teal);padding:10px 24px;display:list-item;list-style-position:inside}.details-content{padding:2px 24px 18px;color:var(--muted);font-size:12px}.details-content p{margin:9px 0}.source-link{color:var(--teal);font-weight:600;text-decoration:underline;text-underline-offset:3px}.cost-note{font-size:11px;color:var(--muted);line-height:1.7;margin:17px 0 6px}.rate-note{font-size:10px;color:var(--muted);margin:0}.rate-note a{text-underline-offset:3px}.bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:43px 0 50px}.info-panel{padding:25px;background:#fff;border:1px solid var(--line);border-radius:12px}.panel-title{display:flex;gap:10px;align-items:center;margin-bottom:25px}.small-symbol{color:var(--teal);font-size:18px}.history-entry{display:grid;grid-template-columns:75px 1fr;gap:15px}.history-date{font-size:11px;color:var(--teal);font-weight:600;padding-top:2px}.history-entry h3{font-size:13px;font-weight:600;margin:0 0 5px}.history-entry p{font-size:11px;color:var(--muted);margin:0 0 9px}.info-panel details{margin-top:17px;border-top:1px solid var(--line);padding-top:13px}.info-panel summary{cursor:pointer;color:var(--teal);font-size:11px}.history-table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:10px;text-align:left;margin-top:12px}th{font-weight:500;color:var(--muted)}td,th{padding:9px 5px;border-bottom:1px solid var(--line)}td:nth-child(n+2),th:nth-child(n+2){text-align:right;white-space:nowrap}.rules-list{list-style:none;padding:0;margin:0;display:grid;gap:9px}.rules-list li{display:flex;justify-content:space-between;gap:20px;font-size:11px}.rules-list span{color:var(--muted)}.rules-list strong{font-weight:500;text-align:right}.muted{color:var(--muted);font-size:11px;line-height:1.7;margin:17px 0 0}.footer{border-top:1px solid var(--line);padding:22px 0 32px;display:flex;justify-content:space-between;color:var(--muted);font-size:10px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:absolute;left:20px;top:-80px;background:#fff;padding:10px;z-index:10}.skip:focus{top:8px}.loading{padding:25px}.empty{background:white;padding:25px;border:1px solid var(--line);border-radius:10px}.error{color:#98422d}.error button{padding:6px 12px;border:1px solid currentColor;background:white;border-radius:5px;cursor:pointer;color:inherit}@media(min-width:1400px){.hero{padding-top:72px;padding-bottom:64px}}@media(max-width:1050px){.wrap{width:calc(100% - 48px)}.hero{gap:30px}h1{font-size:51px}.choice-card{flex-direction:column;gap:12px}.choice-price{align-self:flex-start;text-align:left}.choice-price small{display:inline;margin-left:7px}.offer-main{gap:14px;padding:20px;grid-template-columns:1fr 1fr 1fr .9fr}.price-total{font-size:20px}.offer-city{font-size:16px}.flight-hours{font-size:17px}.section-heading p{max-width:240px;text-align:right}}@media(max-width:740px){.wrap{width:calc(100% - 32px)}.topbar{height:76px}.topbar nav{gap:17px;font-size:11px}.brand{font-size:17px;gap:7px}.brand-mark{width:27px;height:27px;font-size:19px}.hero{grid-template-columns:1fr;padding:35px 0 33px;gap:27px}h1{font-size:49px}.intro{font-size:14px}.hero-meta{margin-top:16px}.trip-ticket{transform:none;padding:22px 24px}.ticket-route{padding:24px 0}.airport-code{font-size:34px}.section-heading{align-items:flex-start}.section-heading h2,.panel-title h2{font-size:17px}.section-heading p{display:none}.choice-grid{grid-template-columns:1fr;gap:11px}.choice-card{flex-direction:row;padding:20px;min-height:155px;gap:10px}.choice-card h3{font-size:17px}.choice-card p{max-width:205px}.choice-price{align-self:flex-end;font-size:20px;text-align:right}.choice-price small{display:block;margin:0}.choice-tag{font-size:8px;letter-spacing:.8px}.offers-section{padding-top:31px}.toolbar{gap:10px;flex-wrap:wrap}.group-select button{padding:8px 15px}.direct-filter{margin-left:auto;font-size:11px}.sort-label{margin-left:0;width:100%}.sort-label select{width:100%;padding-top:8px;padding-bottom:8px}.offer-main{grid-template-columns:1fr 1fr;gap:17px 20px;padding:19px}.offer-main>div:first-child{grid-column:1}.offer-main .price{grid-row:1;grid-column:2}.offer-city{font-size:18px}.price-total{font-size:23px}.flight-label{font-size:8px}.flight-hours{font-size:20px}.baggage{margin-top:7px}.next-day{font-size:9px}.offer-details summary{padding-left:19px}.details-content{padding-left:19px;padding-right:19px}.bottom-grid{grid-template-columns:1fr;padding-top:31px;gap:14px;padding-bottom:30px}.info-panel{padding:21px}.panel-title{margin-bottom:20px}.footer{gap:20px;font-size:9px}.footer span:last-child{max-width:170px;text-align:right}.rules-list li{gap:12px}.rules-list strong{max-width:180px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.exchange-section { padding-top: 43px; }
.exchange-intro { color: var(--muted); font-size: 12px; margin: -6px 0 20px; }
.exchange-cards { display: grid; grid-template-columns: 1fr 1fr 1.25fr; gap: 14px; }
.exchange-cards article { padding: 23px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
.exchange-cards article > strong { display: block; font-size: 26px; letter-spacing: -.6px; font-weight: 600; line-height: 1.4; white-space: nowrap; }
.exchange-cards article > strong small { font-size: 12px; font-weight: 400; color: var(--muted); }
.exchange-cards p { font-size: 11px; color: var(--muted); margin: 10px 0 0; line-height: 1.6; }
.exchange-cards a { display: inline-block; color: var(--teal); font-size: 10px; margin-top: 9px; text-underline-offset: 3px; }
.exchange-cards h3 { font-weight: 600; font-size: 20px; letter-spacing: -.5px; margin: 0; }
.exchange-cards .exchange-signal { background: var(--mint); border-color: #b0c9b5; }
.exchange-amount { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 23px 0 14px; }
.exchange-amount label { font-size: 12px; font-weight: 500; }
.exchange-amount > div { position: relative; }
.exchange-amount input { width: 150px; padding: 9px 42px 9px 12px; border-radius: 6px; border: 1px solid var(--line); color: var(--ink); background: #fff; font-size: 13px; }
.exchange-amount > div > span { position: absolute; right: 11px; top: 11px; font-size: 11px; color: var(--muted); pointer-events: none; }
.exchange-amount small { color: var(--muted); font-size: 10px; }
.exchange-amount .error { flex-basis: 100%; margin: 0; font-size: 11px; }
.exchange-amount .error:empty { display: none; }
.exchange-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.exchange-table { margin: 0; font-size: 12px; min-width: 640px; }
.exchange-table td, .exchange-table th { padding: 17px 20px; vertical-align: top; }
.exchange-table th:first-child { width: 40%; }
.exchange-table th:nth-child(2), .exchange-table td:nth-child(2) { text-align: left; }
.exchange-table th { font-weight: 500; }
.exchange-table tbody tr:last-child > * { border-bottom: 0; }
.exchange-table small { display: block; margin-top: 5px; font-weight: 400; font-size: 10px; color: var(--muted); line-height: 1.6; white-space: normal; }
.exchange-table strong { font-weight: 600; }
.exchange-table a { color: var(--teal); display: block; margin-bottom: 7px; font-size: 10px; text-underline-offset: 3px; }
.exchange-rules { border-top: 1px solid var(--line); padding: 14px 0; margin-top: 20px; font-size: 11px; color: var(--muted); }
.exchange-rules summary { cursor: pointer; color: var(--teal); }
.exchange-rules p { max-width: 900px; line-height: 1.8; }
@media (max-width: 1050px) {
  .exchange-cards { grid-template-columns: 1fr 1fr; }
  .exchange-cards article:last-child { grid-column: 1 / -1; }
}
@media (max-width: 740px) {
  .topbar { height: auto; flex-direction: column; align-items: flex-start; padding: 20px 0; gap: 17px; }
  .topbar nav { gap: 24px; }
  .exchange-section { padding-top: 31px; }
  .exchange-section .section-heading { flex-direction: column; gap: 5px; }
  .exchange-intro { margin-top: 0; }
  .exchange-cards { grid-template-columns: 1fr; gap: 10px; }
  .exchange-cards article { padding: 20px; }
  .exchange-cards article:last-child { grid-column: auto; }
  .exchange-cards article > strong { font-size: 25px; }
  .exchange-amount { gap: 10px; }
  .exchange-amount small { flex-basis: 100%; }
  .exchange-table th:first-child { min-width: 230px; }
}

.marina-strip { display: flex; align-items: center; justify-content: space-between; padding: 19px 0; gap: 20px; }
.marina-weather { display: flex; align-items: center; gap: 12px; }
.temperature-icon { height: 27px; width: 21px; color: var(--teal); flex-shrink: 0; }
.marina-name { font-weight: 600; font-size: 12px; text-decoration: none; }
.marina-name:hover { text-decoration: underline; }
#weather-status { display: flex; flex-wrap: wrap; gap: 3px 9px; font-size: 9px; color: var(--muted); margin-top: 2px; }
#weather-status a { text-decoration: none; }
#weather-status a:hover { text-decoration: underline; }
#marina-temperature { font-size: 24px; font-weight: 500; margin-left: 10px; letter-spacing: -.7px; white-space: nowrap; }
.camera-jump { font-size: 11px; color: var(--teal); text-decoration: none; white-space: nowrap; }
.camera-jump:hover { text-decoration: underline; }
.hero { position: relative; overflow: hidden; border-radius: 15px; padding: 45px 38px 48px; margin-bottom: 18px; gap: 35px; min-height: 325px; color: #fff; }
.hero-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 48%; }
.hero::before { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(10,39,46,.88), rgba(10,39,46,.57) 48%, rgba(10,39,46,.22)); }
.hero-main, .trip-ticket { position: relative; z-index: 2; }
.hero .eyebrow { color: #c6e3d8; }
.hero h1 { font-size: 53px; }
.hero h1 em { color: #d7eee4; }
.hero .intro { color: #e4efea; font-size: 14px; }
.hero .hero-meta { color: #cee0da; margin-top: 19px; }
.hero .hero-meta strong { color: #fff; }
.hero .status-dot { background: #c0e4d0; }
.hero .trip-ticket { background: rgba(13,49,58,.87); border: 1px solid rgba(255,255,255,.23); transform: rotate(1deg); box-shadow: none; }
.photo-credit { position: absolute; right: 16px; bottom: 10px; z-index: 2; color: #f3f8f5; font-size: 8px; text-decoration: none; text-shadow: 0 1px 3px #000; }
.camera-panel { border: 1px solid var(--line); background: #fff; border-radius: 9px; margin-bottom: 34px; padding: 0 20px; }
.camera-panel summary { cursor: pointer; padding: 14px 0; font-size: 12px; color: var(--teal); }
.camera-subtitle { color: var(--muted); margin-left: 10px; font-size: 10px; }
.camera-panel > p { color: var(--muted); font-size: 11px; margin: 0 0 14px; }
.camera-player { aspect-ratio: 16/9; max-height: 580px; background: #eaf0ec; display: grid; place-items: center; border-radius: 7px; overflow: hidden; }
.camera-player iframe { width: 100%; height: 100%; border: 0; }
.camera-player button { border: 1px solid var(--teal); border-radius: 7px; background: #fff; color: var(--teal); padding: 12px 20px; cursor: pointer; font-size: 13px; }
.camera-panel .camera-source { margin-top: 13px; }
.camera-source a { color: var(--teal); text-underline-offset: 3px; }
.euro-chart-panel { margin-top: 16px; border: 1px solid var(--line); border-radius: 10px; background: #fff; padding: 18px 22px 12px; }
.euro-chart-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 4px; }
.euro-chart-header h3 { font-weight: 500; font-size: 12px; margin: 0; }
.euro-chart-header p { font-size: 10px; color: var(--muted); margin: 3px 0 0; }
.chart-range { display: flex; gap: 3px; background: #f1f4f0; padding: 3px; border-radius: 6px; }
.chart-range button { border: 0; border-radius: 4px; padding: 6px 12px; font-size: 10px; color: var(--muted); background: transparent; cursor: pointer; }
.chart-range button[aria-pressed=true] { color: var(--ink); background: #fff; box-shadow: 0 1px 3px #163c4512; }
.euro-chart { width: 100%; height: 150px; }
.euro-chart svg { display: block; width: 100%; height: 150px; overflow: visible; outline-offset: 1px; }
.euro-chart text { font-family: 'DM Sans', sans-serif; font-size: 10px; fill: #7a8b8d; }
.chart-grid { stroke: #e5ebe5; stroke-width: 1; stroke-dasharray: 3 5; }
.chart-line { fill: none; stroke: #478d86; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.chart-focus-line { stroke: #a7c6bd; stroke-width: 1; stroke-dasharray: 2 4; }
.chart-focus-point { fill: #26796f; stroke: #fff; stroke-width: 1.5; }
.euro-chart-footer { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; min-height: 18px; font-size: 9px; color: var(--muted); }
#chart-reading { color: var(--teal); font-variant-numeric: tabular-nums; }
.chart-retry { color: var(--teal); border: 0; background: none; padding: 0; cursor: pointer; text-decoration: underline; font-size: 11px; }
@media (min-width: 1400px) { .hero { padding-top: 46px; padding-bottom: 48px; } }
@media (max-width: 1050px) {
  .hero { gap: 25px; padding-left: 28px; padding-right: 28px; }
  .hero h1 { font-size: 43px; }
  .hero .trip-ticket { padding: 21px; }
  .hero .airport-code { font-size: 31px; }
}
@media (max-width: 740px) {
  .marina-strip { padding: 17px 0; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
  .marina-weather { width: 100%; gap: 9px; }
  .marina-name { font-size: 11px; }
  #weather-status { font-size: 8px; }
  #marina-temperature { font-size: 22px; margin-left: auto; }
  .camera-jump { font-size: 10px; margin-left: 30px; }
  .hero { padding: 31px 24px 38px; gap: 24px; min-height: auto; margin-bottom: 12px; }
  .hero h1 { font-size: 43px; }
  .hero .trip-ticket { transform: none; padding: 19px; }
  .hero .airport-code { font-size: 29px; }
  .hero::before { background: linear-gradient(115deg, rgba(10,39,46,.83), rgba(10,39,46,.35)); }
  .hero-photo { object-position: 58% 50%; }
  .camera-panel { padding: 0 15px; margin-bottom: 27px; }
  .camera-panel summary { font-size: 11px; }
  .camera-subtitle { display: block; margin: 4px 0 0 17px; font-size: 9px; }
  .euro-chart-panel { padding: 16px 12px 10px; }
  .euro-chart-header { gap: 10px; align-items: flex-start; }
  .chart-range button { padding: 6px 9px; font-size: 9px; }
  .euro-chart-footer { flex-wrap: wrap; gap: 2px; font-size: 8px; }
}

.arrow-icon { width: 1em; height: 1em; display: inline-block; vertical-align: -.12em; flex-shrink: 0; }
.brand-mark .arrow-icon { width: 19px; height: 19px; }
.route-arrow { display: flex; align-items: center; }
.route-arrow .arrow-icon { width: 34px; height: 34px; }

.marina-weather { flex-wrap: wrap; }
.marina-wind { font-size: 11px; color: var(--teal); text-decoration: none; padding-left: 12px; border-left: 1px solid var(--line); }
.marina-wind:hover { text-decoration: underline; }
.sailing-section { margin: 30px 0 38px; scroll-margin-top: 22px; }
.sailing-heading { align-items: center; margin-bottom: 7px; }
.sailing-heading .eyebrow { margin: 0 0 4px; font-size: 9px; letter-spacing: 1.3px; }
.sailing-intro, .sailing-status { font-size: 11px; color: var(--muted); margin: 6px 0; }
.sailing-status { font-size: 10px; min-height: 16px; margin-bottom: 14px; }
.sailing-actions { display: flex; align-items: center; gap: 12px; }
.wind-units, .forecast-days { display: flex; gap: 3px; padding: 3px; border-radius: 7px; background: #edf1ed; }
.wind-units button, .forecast-days button, .quiet-button { border: 0; color: var(--muted); font-size: 11px; padding: 6px 10px; border-radius: 4px; background: transparent; cursor: pointer; white-space: nowrap; }
.wind-units button[aria-pressed=true], .forecast-days button[aria-pressed=true] { background: #fff; color: var(--ink); box-shadow: 0 1px 4px #163c4510; }
.quiet-button { border: 1px solid var(--line); background: #fff; }
.quiet-button:disabled { opacity: .6; cursor: wait; }
.sailing-current { display: grid; grid-template-columns: 1.15fr 1fr 1fr 1.15fr; gap: 12px; }
.sailing-card { padding: 19px; border: 1px solid var(--line); border-radius: 11px; background: #fff; min-width: 0; }
.sailing-card h3 { margin: 0 0 13px; text-transform: uppercase; letter-spacing: .8px; font-size: 9px; font-weight: 600; color: var(--teal); }
.sailing-card p { margin: 5px 0 0; font-size: 11px; color: var(--muted); }
.sailing-card b { color: var(--ink); font-weight: 500; }
.sailing-value { font-size: 28px; letter-spacing: -.8px; line-height: 1.2; font-weight: 600; display: block; color: var(--ink); white-space: nowrap; }
.sailing-value small { font-size: 14px; letter-spacing: 0; font-weight: 400; }
.sailing-card .sailing-micro { font-size: 9px; }
.wind-card-body { display: flex; justify-content: space-between; gap: 6px; align-items: center; }
.wind-compass { width: 89px; height: 89px; flex-shrink: 0; color: var(--teal); }
.wind-compass text { font: 10px 'DM Sans', sans-serif; fill: currentColor; }
.wind-bearing { white-space: nowrap; }
.sailing-card .condition-label { font-size: 14px; color: var(--ink); font-weight: 500; margin: 0 0 10px; }
.sun-times { display: flex; gap: 15px; font-size: 10px; color: var(--muted); }
.sun-times span { display: grid; gap: 2px; }
.sun-times b { font-size: 17px; }
.sailing-forecast { margin-top: 13px; border: 1px solid var(--line); background: #fff; border-radius: 11px; padding: 16px 19px; }
.sailing-forecast>summary { cursor: pointer; color: var(--teal); font-size: 12px; font-weight: 500; }
.forecast-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin: 18px 0 7px; }
.forecast-heading p { font-size: 9px; color: var(--muted); margin: 0; }
.sailing-trend svg { display: block; width: 100%; height: 125px; }
.sailing-trend text { font: 10px 'DM Sans', sans-serif; fill: #6d8386; }
.sailing-grid { stroke: #e8efeb; stroke-dasharray: 3 4; }
.sailing-wind-line, .sailing-gust-line { stroke: #277d7a; stroke-width: 1.8; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.sailing-gust-line { stroke: #b18561; stroke-dasharray: 5 4; stroke-width: 1.5; }
.sailing-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sailing-table { margin: 3px 0 0; min-width: 860px; font-size: 10px; }
.sailing-table caption { text-align: left; color: var(--muted); font-size: 9px; padding-bottom: 10px; }
.sailing-table th, .sailing-table td { padding: 9px 7px; }
.sailing-table small { display: block; font-size: 9px; color: var(--muted); }
.sailing-table tbody th { color: var(--ink); }
.sailing-links { display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: 10px; color: var(--teal); margin-top: 14px; }
.sailing-links a { text-underline-offset: 3px; }
.sailing-notes { margin-top: 13px; color: var(--muted); font-size: 10px; }
.sailing-notes summary { cursor: pointer; }
.sailing-notes p { max-width: 980px; margin: 10px 0; line-height: 1.7; }
@media (max-width: 1100px) {
  .sailing-current { grid-template-columns: 1fr 1fr; }
  .wind-compass { width: 90px; height: 90px; }
}
@media (max-width: 740px) {
  .topbar { height: auto; min-height: 76px; flex-wrap: wrap; padding: 16px 0; gap: 14px; }
  .topbar nav { width: 100%; justify-content: space-between; gap: 10px; }
  .marina-wind { padding-left: 0; border-left: 0; }
  .sailing-heading { align-items: flex-start; gap: 10px; flex-direction: column; }
  .sailing-actions { justify-content: space-between; width: 100%; }
  .sailing-current { gap: 9px; }
  .sailing-card { padding: 16px; }
  .sailing-wind-card, .sailing-card:last-child { grid-column: 1 / -1; }
  .sailing-value { font-size: 25px; }
  .sailing-card h3 { font-size: 8px; letter-spacing: .5px; }
  .sailing-card p { font-size: 10px; }
  .sailing-intro { font-size: 10px; line-height: 1.7; }
  .sailing-status { font-size: 9px; line-height: 1.7; }
  .sailing-forecast { padding: 15px 12px; }
  .forecast-heading { align-items: flex-start; flex-direction: column; gap: 10px; }
  .forecast-days { width: 100%; }
  .forecast-days button { padding: 7px 5px; font-size: 10px; flex: 1; }
  .sun-times { gap: 28px; }
}

.topbar { height: auto; min-height: 97px; padding: 20px 0; flex-wrap: wrap; gap: 15px 22px; }
.brand { font-size: 16px; line-height: 1.5; letter-spacing: -.2px; flex: 1 1 590px; min-width: 0; }
.brand-mark { flex-shrink: 0; }
.brand-copy { display: block; }
.brand-date { font-weight: 400; color: var(--muted); white-space: nowrap; }
.topbar nav { gap: 19px; font-size: 11px; flex-wrap: wrap; }
@media(max-width: 740px) {
  .topbar { min-height: 76px; padding: 16px 0; gap: 14px; }
  .brand { font-size: 15px; flex-basis: 100%; align-items: flex-start; }
  .brand-mark { margin-top: 2px; }
  .topbar nav { gap: 10px 14px; }
}