@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Fraunces:opsz,wght@9..144,500;9..144,600&display=swap');

:root {
  color-scheme: light;
  --ink: #20291f;
  --muted: #73796c;
  --green: #31583d;
  --green-deep: #193d2d;
  --green-light: #e3edda;
  --lime: #d9e88d;
  --paper: #f4f3e8;
  --white: #fffef8;
  --line: #dedfce;
  --amber: #b96632;
  --mono: 'DM Mono', Consolas, monospace;
  --sans: 'DM Sans', sans-serif;
  --serif: 'Fraunces', Georgia, serif;
}

* { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; color: var(--ink); background: var(--paper); font-family: var(--sans); font-size: 14px; }
button, select { font: inherit; }
button:focus-visible, select:focus-visible, a:focus-visible { outline: 3px solid #b96632; outline-offset: 3px; }
a { color: inherit; }
.app-shell { max-width: 1480px; min-height: 100vh; margin: 0 auto; padding: 0 5.1%; background: radial-gradient(ellipse at 90% 12%, rgba(217, 232, 141, .21), transparent 34%), var(--paper); }
.topbar { min-height: 78px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; gap: 10px; align-items: center; color: var(--green-deep); text-decoration: none; }
.brand-mark { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--green-deep); }
.brand-mark svg { width: 30px; fill: var(--lime); stroke: var(--green-deep); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5; }
.brand-mark svg path + path { fill: none; stroke: var(--green-deep); stroke-width: 1.6; }
.brand-name { font-size: 21px; font-weight: 700; line-height: 1; }
.brand-name > span { color: #b96632; }
.brand-name small { display: block; margin-top: 5px; color: var(--muted); font: 9px var(--mono); letter-spacing: 0; }
.topbar-right { display: flex; align-items: center; gap: 17px; }
.island-label, .eyebrow, .today-label, .condition-stat small, .model-note, .week-header, .app-footer, .source-note { font-family: var(--mono); letter-spacing: 0; }
.island-label { color: var(--green); font-size: 10px; }
.island-dot, .status-dot { display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: #6c9b61; vertical-align: 1px; }
.icon-button { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; color: var(--green); border: 1px solid var(--line); border-radius: 50%; background: rgba(255,254,248,.7); cursor: pointer; transition: background .18s ease, transform .18s ease; }
.location-tools > .icon-button { width: 48px; height: 48px; flex: 0 0 48px; }
.icon-button:hover { transform: translateY(-1px); background: white; }
.icon-button svg, .location-select-wrap > svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; }
.install-button { width: 36px; height: 36px; }
main { padding-bottom: 20px; }
.page-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; padding: 39px 0 17px; }
.eyebrow { margin: 0 0 7px; color: var(--green); font-size: 9px; line-height: 1.3; }
h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 0; font-size: 38px; font-weight: 500; line-height: 1.1; }
h1 em { color: var(--green); font-family: var(--serif); font-weight: 500; }
.location-tools { display: flex; width: 345px; flex: 0 0 auto; align-items: flex-end; gap: 9px; }
.location-picker { display: flex; min-width: 0; flex: 1 1 auto; flex-direction: column; gap: 6px; }
.location-kicker { color: var(--green); font: 9px/1.2 var(--mono); }
.location-select-wrap { display: flex; width: 100%; height: 48px; align-items: center; gap: 10px; padding: 0 12px; color: var(--green); border: 1px solid #d4ddce; border-radius: 7px; background: linear-gradient(115deg, #fffef8 0%, #f0f5e9 100%); box-shadow: 0 3px 10px rgba(25,61,45,.06); cursor: pointer; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.location-select-wrap:hover { transform: translateY(-1px); border-color: #a7b99f; box-shadow: 0 6px 16px rgba(25,61,45,.1); }
.location-select-wrap:focus-within { border-color: #557c58; outline: 3px solid rgba(85,124,88,.17); outline-offset: 2px; box-shadow: 0 5px 15px rgba(25,61,45,.1); }
.location-icon { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; color: var(--green); border-radius: 6px; background: var(--green-light); }
.location-icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.location-select-wrap select { width: 0; min-width: 0; flex: 1 1 auto; appearance: none; padding: 0 2px 0 0; color: var(--ink); border: 0; outline: 0; background: transparent; font-size: 13px; font-weight: 600; cursor: pointer; }
.location-select-wrap .select-chevron { width: 16px; height: 16px; flex: 0 0 16px; color: var(--green); pointer-events: none; }
.status-line { display: flex; align-items: center; min-height: 26px; color: var(--muted); font: 10px var(--mono); }
.status-line.is-offline .status-dot { background: var(--amber); }
.status-line.is-error .status-dot { background: #b84638; }
.observation-panel { margin: 0 0 14px; padding: 16px 19px 12px; border: 1px solid #cadbd8; border-radius: 6px; background: linear-gradient(112deg, #f5f8f1 0%, #eaf3f1 100%); }
.observation-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.observation-heading-main { display: flex; min-width: 0; align-items: center; gap: 12px; }
.observation-icon { display: grid; width: 39px; height: 39px; flex: 0 0 39px; place-items: center; color: #386f72; border-radius: 8px; background: #dcebe5; }
.observation-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 1.7; }
.observation-heading .eyebrow { margin-bottom: 3px; color: #386f72; }
.observation-heading h2 { margin: 0; font-size: 15px; font-weight: 600; }
.station-code { margin-left: 5px; color: #71847d; font: 9px var(--mono); vertical-align: 2px; }
.station-detail { margin: 3px 0 0; color: var(--muted); font-size: 10px; }
.observation-state { display: grid; grid-template-columns: 8px auto; align-items: center; column-gap: 7px; color: #426e66; font: 9px var(--mono); text-align: right; white-space: nowrap; }
.observation-dot { width: 7px; height: 7px; border-radius: 50%; background: #669a66; box-shadow: 0 0 0 3px rgba(102,154,102,.13); }
.observation-state time { grid-column: 2; color: var(--muted); font-size: 8px; }
.observation-panel.is-delayed .observation-dot { background: var(--amber); box-shadow: 0 0 0 3px rgba(185,102,50,.13); }
.observation-panel.is-unavailable .observation-dot { background: #898b7e; box-shadow: none; }
.station-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 13px; padding: 11px 0 10px; border-top: 1px solid rgba(56,111,114,.17); }
.station-metrics small { display: block; margin-bottom: 4px; color: #71847d; font: 8px var(--mono); }
.station-metrics strong { color: #253d39; font-size: 15px; font-weight: 600; }
.station-footnote { margin: 0; color: #71847d; font-size: 9px; }
.station-footnote a { color: #386f72; text-underline-offset: 2px; }
.weather-grid { display: grid; grid-template-columns: minmax(0, 1.52fr) minmax(310px, .88fr); gap: 13px; }
.current-panel, .advice-panel { min-width: 0; min-height: 318px; border-radius: 4px; }
.current-panel { position: relative; overflow: hidden; padding: 21px 24px 15px; color: #f8f8e9; background: var(--green-deep); }
.current-panel::after { position: absolute; z-index: 0; top: -105px; right: -65px; width: 310px; height: 310px; border: 1px solid rgba(217,232,141,.14); border-radius: 50%; box-shadow: 0 0 0 27px rgba(217,232,141,.035), 0 0 0 55px rgba(217,232,141,.035); content: ''; pointer-events: none; }
.panel-topline { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.today-label { color: #b7c4a8; font-size: 9px; }
.condition-label { padding: 6px 9px; color: #e5edbd; border: 1px solid rgba(229,237,189,.26); border-radius: 2px; font-size: 10px; }
.current-main { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; min-height: 146px; }
.temperature-block { display: flex; flex-direction: column; align-items: flex-start; }
.temperature { font-size: 108px; font-weight: 400; letter-spacing: 0; line-height: .95; }
.temperature sup { margin-left: 3px; font-size: .37em; vertical-align: top; }
.temp-unit { margin-left: 4px; color: #bdcbb6; font: 12px var(--mono); vertical-align: 12px; }
.feels-like { margin-top: 8px; color: #bdcbb6; font-size: 11px; }
.weather-art { display: grid; width: 125px; height: 125px; place-items: center; margin-right: 9%; color: var(--lime); }
.weather-art svg { width: 112px; height: 112px; overflow: visible; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.1; }
.current-summary { position: relative; z-index: 1; min-height: 19px; margin: 0 0 15px; color: #d2dac8; font-size: 11px; }
.conditions-row { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding: 13px 0 10px; border-top: 1px solid rgba(229,237,189,.2); }
.condition-stat { display: flex; align-items: center; gap: 8px; min-width: 0; }
.stat-icon { display: grid; flex: 0 0 27px; width: 27px; height: 27px; place-items: center; color: var(--lime); border: 1px solid rgba(217,232,141,.24); border-radius: 50%; font-size: 13px; }
.condition-stat small { display: block; margin-bottom: 4px; color: #aebba5; font-size: 8px; white-space: nowrap; }
.condition-stat strong { font-size: 11px; font-weight: 500; white-space: nowrap; }
.model-note { position: relative; z-index: 1; margin: 2px 0 0; color: #aebba5; font-size: 8px; }
.advice-panel { display: flex; flex-direction: column; padding: 21px 22px 16px; border: 1px solid var(--line); background: rgba(255,254,248,.76); }
.advice-heading { display: flex; align-items: center; gap: 12px; }
.advice-sun { display: grid; flex: 0 0 41px; width: 41px; height: 41px; place-items: center; color: var(--amber); border-radius: 50%; background: #f6e9c7; }
.advice-sun svg { width: 21px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 1.6; }
.advice-heading .eyebrow { margin-bottom: 4px; color: var(--amber); }
.advice-heading h2 { margin: 0; font-size: 17px; font-weight: 600; }
.advice-intro { margin: 14px 0 5px; color: var(--muted); font-size: 11px; }
.advice-list { flex: 1; }
.advice-item { display: grid; grid-template-columns: 24px 1fr; gap: 8px; align-items: start; padding: 10px 0; border-bottom: 1px solid #e9e9dc; }
.advice-item:last-child { border-bottom: 0; }
.advice-number { color: var(--amber); font: 9px var(--mono); }
.advice-item p { margin: 0; font-size: 11px; line-height: 1.55; }
.advice-disclaimer { margin: 9px 0 0; color: #898b7e; font-size: 9px; line-height: 1.45; }
.forecast-section { padding-top: 30px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 12px; }
.section-heading .eyebrow { margin-bottom: 4px; }
.section-heading h2 { margin: 0; font-size: 19px; font-weight: 600; }
.section-note { color: var(--muted); font: 9px var(--mono); }
.hourly-forecast { display: grid; grid-template-columns: repeat(8, minmax(64px, 1fr)); overflow: hidden; border: 1px solid var(--line); border-radius: 3px; background: var(--white); }
.hour-item { display: flex; min-height: 119px; flex-direction: column; align-items: center; justify-content: space-between; padding: 13px 7px 12px; border-right: 1px solid #edede3; }
.hour-item:last-child { border-right: 0; }
.hour-time { color: var(--muted); font: 9px var(--mono); }
.hour-icon { width: 24px; height: 24px; color: var(--green); }
.hour-icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.hour-temp { font-size: 12px; font-weight: 600; }
.hour-rain { color: #518091; font: 9px var(--mono); }
.week-table-wrap { border: 1px solid var(--line); border-radius: 3px; background: var(--white); }
.week-header, .week-row { display: grid; grid-template-columns: minmax(95px, 1fr) minmax(130px, 1.4fr) minmax(60px, .7fr) minmax(95px, 1fr) minmax(68px, .65fr); align-items: center; gap: 8px; padding: 0 17px; }
.week-header { min-height: 34px; color: var(--muted); border-bottom: 1px solid var(--line); font-size: 8px; }
.week-row { min-height: 44px; border-bottom: 1px solid #edede3; font-size: 11px; }
.week-row:last-child { border-bottom: 0; }
.week-day { font-weight: 600; }
.week-condition { display: flex; align-items: center; gap: 8px; color: #495449; }
.week-condition svg { width: 19px; height: 19px; color: var(--green); fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.week-rain { color: #518091; }
.week-temp { font-weight: 600; }
.week-temp span { color: var(--muted); font-weight: 400; }
.week-uv { color: var(--muted); }
.source-note { margin: 10px 0 0; color: var(--muted); font-size: 8px; line-height: 1.6; }
.source-note a { color: var(--green); text-underline-offset: 2px; }
.app-footer { display: flex; justify-content: space-between; gap: 12px; margin-top: 27px; padding: 14px 0 17px; color: var(--muted); border-top: 1px solid var(--line); font-size: 8px; }
.app-footer span:last-child { color: var(--green); }
.loading-copy { grid-column: 1 / -1; padding: 16px; color: var(--muted); font-size: 11px; }
.refreshing .current-panel { animation: reveal .35s ease both; }
@keyframes reveal { from { opacity: .75; transform: translateY(3px); } to { opacity: 1; transform: translateY(0); } }

@media (min-width: 1180px) { .app-shell { padding-right: 8.3%; padding-left: 8.3%; } }
@media (max-width: 1000px) {
  .page-heading { align-items: flex-start; flex-direction: column; gap: 15px; }
  .location-tools { width: 100%; }
}
@media (max-width: 850px) {
  .app-shell { padding-right: 4%; padding-left: 4%; }
  .weather-grid { grid-template-columns: minmax(0, 1.2fr) minmax(280px, .9fr); }
  .current-panel { padding-right: 18px; padding-left: 18px; }
  .advice-panel { padding-right: 17px; padding-left: 17px; }
  .weather-art { margin-right: 0; }
  .conditions-row { grid-template-columns: repeat(2, 1fr); row-gap: 12px; }
  .current-panel, .advice-panel { min-height: 345px; }
  .hourly-forecast { grid-template-columns: repeat(6, minmax(58px, 1fr)); }
  .hour-item:nth-child(n+7) { display: none; }
}
@media (max-width: 620px) {
  .app-shell { padding-right: 17px; padding-left: 17px; }
  .topbar { min-height: 65px; }
  .brand-mark { width: 35px; height: 35px; }
  .brand-mark svg { width: 27px; }
  .brand-name { font-size: 19px; }
  .topbar-right { gap: 9px; }
  .island-label { font-size: 9px; }
  .page-heading { align-items: flex-start; flex-direction: column; gap: 15px; padding: 25px 0 11px; }
  h1 { max-width: 340px; font-size: 30px; }
  .location-tools { width: 100%; }
  .location-picker { flex: 1 1 0; }
  .observation-panel { padding: 15px; }
  .observation-heading { align-items: flex-start; flex-direction: column; gap: 12px; }
  .observation-state { width: 100%; grid-template-columns: 8px auto 1fr; text-align: left; }
  .observation-state time { grid-column: 3; grid-row: 1; text-align: right; }
  .station-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 12px; }
  .status-line { min-height: 27px; font-size: 9px; }
  .weather-grid { grid-template-columns: 1fr; gap: 10px; }
  .current-panel, .advice-panel { min-height: auto; }
  .current-panel { padding: 17px 17px 13px; }
  .current-main { min-height: 129px; }
  .temperature { font-size: 84px; }
  .weather-art { width: 100px; height: 100px; margin-right: 5px; }
  .weather-art svg { width: 90px; height: 90px; }
  .current-summary { margin-bottom: 12px; }
  .conditions-row { padding-top: 11px; }
  .advice-panel { padding: 17px; }
  .advice-list { margin-top: 3px; }
  .forecast-section { padding-top: 25px; }
  .section-heading { align-items: flex-start; flex-direction: column; gap: 6px; margin-bottom: 10px; }
  .section-heading h2 { font-size: 18px; }
  .hourly-forecast { grid-template-columns: repeat(4, minmax(56px, 1fr)); }
  .hour-item { min-height: 111px; }
  .hour-item:nth-child(n+5) { display: none; }
  .week-header, .week-row { grid-template-columns: minmax(58px, .8fr) minmax(86px, 1.15fr) minmax(42px, .6fr) minmax(67px, .9fr); gap: 5px; padding-right: 9px; padding-left: 9px; }
  .week-header span:nth-child(5), .week-uv { display: none; }
  .week-row { min-height: 43px; font-size: 10px; }
  .week-header { font-size: 7px; }
  .week-condition { gap: 5px; }
  .week-condition svg { width: 17px; height: 17px; }
  .app-footer { margin-top: 22px; font-size: 7px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }

.maf-nav-link, .weather-nav-link, .news-nav-link, .map-nav-link, .flights-nav-link, .shipping-nav-link, .safety-nav-link, .tenders-nav-link, .banks-nav-link, .jobs-nav-link { display: inline-flex; align-items: center; gap: 6px; color: var(--green); text-decoration: none; font: 9px var(--mono); white-space: nowrap; }
.maf-nav-link, .news-nav-link, .map-nav-link, .flights-nav-link, .shipping-nav-link, .tenders-nav-link, .banks-nav-link, .jobs-nav-link { padding: 8px 10px; border: 1px solid #d4ddce; border-radius: 5px; background: #f0f5e9; transition: background .18s ease, border-color .18s ease; }
.maf-nav-link:hover, .news-nav-link:hover, .map-nav-link:hover, .flights-nav-link:hover, .shipping-nav-link:hover, .tenders-nav-link:hover, .banks-nav-link:hover, .jobs-nav-link:hover { border-color: #a7b99f; background: #e3edda; }
.maf-nav-link svg, .weather-nav-link svg, .news-nav-link svg, .map-nav-link svg, .flights-nav-link svg, .shipping-nav-link svg, .safety-nav-link svg, .tenders-nav-link svg, .banks-nav-link svg, .jobs-nav-link svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; }
.weather-nav-link { padding: 8px 10px; border: 1px solid var(--line); border-radius: 5px; background: rgba(255,254,248,.72); }
.maf-shell { background: radial-gradient(ellipse at 82% 4%, rgba(217,232,141,.19), transparent 29%), var(--paper); }
.maf-main { padding-bottom: 24px; }
.maf-hero { display: grid; grid-template-columns: minmax(0, 1fr) 260px; align-items: end; gap: 35px; padding: 44px 0 29px; }
.maf-hero h1 { max-width: 730px; font-size: 44px; }
.maf-hero h1 em { white-space: nowrap; }
.maf-deck { max-width: 540px; margin: 12px 0 0; color: #586256; font-size: 14px; line-height: 1.65; }
.maf-source-stamp { display: grid; gap: 7px; padding: 12px 0 5px 15px; border-left: 2px solid #83a576; }
.stamp-label, .snapshot-item small, .resource-type, .resource-category, .resource-source-date, .support-index { font-family: var(--mono); }
.stamp-label { color: var(--green); font-size: 8px; }
.maf-source-stamp strong { font-size: 13px; font-weight: 600; }
.maf-source-stamp > span:last-child { color: var(--muted); font-size: 10px; line-height: 1.45; }
.maf-snapshot { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 30px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.snapshot-item { display: flex; min-width: 0; align-items: center; gap: 11px; padding: 15px 18px; border-right: 1px solid var(--line); }
.snapshot-item:first-child { padding-left: 0; }
.snapshot-item:last-child { border-right: 0; }
.snapshot-number { color: var(--amber); font: 10px var(--mono); }
.snapshot-item small { display: block; margin-bottom: 4px; color: var(--muted); font-size: 8px; }
.snapshot-item strong { font-size: 14px; font-weight: 600; }
.hub-section { padding-top: 3px; }
.hub-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 15px; }
.hub-section-heading .eyebrow { margin-bottom: 4px; }
.hub-section-heading h2 { margin: 0; font-size: 22px; font-weight: 600; }
.official-link { display: inline-flex; align-items: center; gap: 6px; color: var(--green); font-size: 11px; text-decoration-thickness: 1px; text-underline-offset: 3px; white-space: nowrap; }
.resource-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.resource-search { display: flex; width: min(355px, 100%); height: 42px; align-items: center; gap: 9px; padding: 0 12px; color: var(--green); border: 1px solid var(--line); border-radius: 5px; background: var(--white); }
.resource-search:focus-within { border-color: #557c58; outline: 3px solid rgba(85,124,88,.15); outline-offset: 2px; }
.resource-search svg { width: 17px; height: 17px; flex: 0 0 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 1.7; }
.resource-search input { width: 100%; min-width: 0; padding: 0; color: var(--ink); border: 0; outline: 0; background: transparent; font-size: 12px; }
.resource-search input::placeholder { color: #92958a; }
.resource-filters { display: flex; max-width: 100%; overflow-x: auto; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 6px; background: #eeeee2; scrollbar-width: thin; }
.resource-filter { flex: 0 0 auto; min-height: 30px; padding: 0 11px; color: #636b5e; border: 0; border-radius: 4px; background: transparent; font-size: 10px; cursor: pointer; transition: color .18s ease, background .18s ease; }
.resource-filter:hover { color: var(--green-deep); background: rgba(255,254,248,.7); }
.resource-filter.is-active { color: var(--white); background: var(--green-deep); }
.resource-results-line { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 8px; color: var(--muted); font: 9px var(--mono); }
.resource-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.resource-card { display: flex; min-width: 0; flex-direction: column; padding: 16px 17px 14px; border: 1px solid var(--line); border-radius: 5px; background: rgba(255,254,248,.83); transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
.resource-card:hover { transform: translateY(-2px); border-color: #bdcbbb; box-shadow: 0 6px 17px rgba(25,61,45,.07); }
.resource-meta { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 11px; }
.resource-type, .resource-category { font-size: 8px; }
.resource-type { color: var(--amber); }
.resource-category { color: var(--green); text-align: right; }
.resource-card h3 { margin: 0 0 5px; font-size: 15px; font-weight: 600; line-height: 1.3; }
.resource-period { margin: 0 0 8px; color: var(--green); font-size: 11px; font-weight: 600; }
.resource-description { flex: 1; margin: 0 0 10px; color: #687064; font-size: 10px; line-height: 1.55; }
.resource-source-date { margin: 0 0 11px; color: #898b7e; font-size: 8px; }
.resource-links { display: flex; flex-wrap: wrap; gap: 7px 14px; padding-top: 10px; border-top: 1px solid #e7e8dc; }
.resource-links a, .support-item > a { display: inline-flex; align-items: center; gap: 5px; color: var(--green); font-size: 10px; font-weight: 600; text-decoration: none; }
.resource-links a:hover, .support-item > a:hover { text-decoration: underline; text-underline-offset: 3px; }
.no-resources { grid-column: 1 / -1; padding: 20px 0; color: var(--muted); font-size: 12px; }
.load-more-button { display: block; min-height: 38px; margin: 14px auto 0; padding: 0 16px; color: var(--green); border: 1px solid #cdd8c8; border-radius: 5px; background: #eef3e8; font-size: 11px; font-weight: 600; cursor: pointer; }
.load-more-button:hover { border-color: #93aa8e; background: #e3edda; }
.load-more-button[hidden] { display: none; }
.resource-data { margin-top: 11px; }
.resource-data-toggle { min-height: 34px; padding: 0 12px; color: var(--green); border: 1px solid #cdd8c8; border-radius: 5px; background: #eef3e8; font-family: var(--mono); font-size: 9px; font-weight: 600; letter-spacing: 0.02em; cursor: pointer; }
.resource-data-toggle:hover { border-color: #93aa8e; background: #e3edda; }
.resource-data-panel { margin-top: 9px; padding: 10px; border: 1px solid #e7e8dc; border-radius: 5px; background: #fbfbf4; }
.resource-data-panel[hidden] { display: none; }
.data-sheet-tabs { display: flex; gap: 6px; margin-bottom: 8px; overflow-x: auto; }
.data-sheet-tabs button { flex: none; min-height: 28px; padding: 0 10px; color: #687064; border: 1px solid #dbe0d3; border-radius: 4px; background: #fff; font-family: var(--mono); font-size: 9px; cursor: pointer; }
.data-sheet-tabs button.is-active { color: var(--green-deep); border-color: #93aa8e; background: #e3edda; font-weight: 600; }
.data-table-wrap { max-height: 300px; overflow: auto; border: 1px solid #e7e8dc; border-radius: 4px; background: #fff; }
.data-table { border-collapse: collapse; width: 100%; font-size: 10px; }
.data-table th, .data-table td { padding: 5px 8px; border-bottom: 1px solid #eef0e4; border-right: 1px solid #f2f4ea; text-align: left; white-space: nowrap; }
.data-table thead th { position: sticky; top: 0; background: #f4f7ee; color: var(--green-deep); font-family: var(--mono); font-size: 9px; }
.data-table .data-rownum { position: sticky; left: 0; background: #f7f8f1; color: #898b7e; font-family: var(--mono); font-size: 9px; text-align: right; }
.data-caption, .resource-data-note { margin: 8px 0 0; color: #898b7e; font-size: 9px; line-height: 1.5; }
.support-section { margin-top: 36px; padding-top: 23px; border-top: 1px solid var(--line); }
.support-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.support-item { display: flex; min-width: 0; flex-direction: column; padding: 17px 18px 16px; border-right: 1px solid var(--line); }
.support-item:first-child { padding-left: 0; }
.support-item:last-child { padding-right: 0; border-right: 0; }
.support-index { margin-bottom: 8px; color: var(--amber); font-size: 8px; }
.support-item h3 { margin: 0 0 6px; font-size: 14px; font-weight: 600; }
.support-item p { flex: 1; margin: 0 0 11px; color: #687064; font-size: 10px; line-height: 1.55; }
.phone-links { display: flex; flex-wrap: wrap; gap: 9px 14px; }
.phone-links a { color: var(--green); font-size: 10px; text-decoration: none; }
.phone-links strong { margin-left: 4px; font-family: var(--mono); font-size: 10px; }
.maf-data-note { display: grid; grid-template-columns: 24px 1fr auto; align-items: center; gap: 11px; margin-top: 18px; padding: 14px 16px; border: 1px solid #e4d8bc; border-radius: 5px; background: #f8f1df; }
.note-mark { display: grid; width: 21px; height: 21px; place-items: center; color: #855526; border: 1px solid #d4b886; border-radius: 50%; font: 11px var(--serif); }
.maf-data-note p { margin: 0; color: #655942; font-size: 10px; line-height: 1.55; }
.maf-data-note strong { color: #473d2b; }
.maf-data-note > a { color: #805226; font-size: 10px; text-decoration: none; white-space: nowrap; }
.maf-data-note > a:hover { text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 850px) {
  .maf-hero { grid-template-columns: minmax(0, 1fr) 215px; gap: 20px; }
  .maf-hero h1 { font-size: 38px; }
  .resource-toolbar { align-items: flex-start; flex-direction: column; }
  .resource-search { width: 100%; }
}
@media (max-width: 620px) {
  .maf-nav-link, .news-nav-link, .map-nav-link, .flights-nav-link, .shipping-nav-link, .tenders-nav-link, .banks-nav-link, .jobs-nav-link { padding: 7px; font-size: 8px; }
  .maf-nav-link svg, .news-nav-link svg, .map-nav-link svg, .flights-nav-link svg, .shipping-nav-link svg, .tenders-nav-link svg, .banks-nav-link svg, .jobs-nav-link svg { width: 14px; height: 14px; }
  .maf-hero { grid-template-columns: 1fr; gap: 16px; padding: 29px 0 22px; }
  .maf-hero h1 { font-size: 32px; }
  .maf-hero h1 em { white-space: normal; }
  .maf-deck { font-size: 12px; }
  .maf-source-stamp { grid-template-columns: auto 1fr; align-items: baseline; column-gap: 9px; padding: 9px 0 0; border-top: 1px solid #9bb78c; border-left: 0; }
  .maf-source-stamp > span:last-child { grid-column: 1 / -1; }
  .maf-snapshot { grid-template-columns: 1fr; margin-bottom: 24px; }
  .snapshot-item, .snapshot-item:first-child { padding: 11px 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .snapshot-item:last-child { border-bottom: 0; }
  .hub-section-heading { align-items: flex-start; }
  .hub-section-heading h2 { font-size: 19px; }
  .official-link { font-size: 9px; }
  .resource-filters { width: 100%; }
  .resource-list { grid-template-columns: 1fr; }
  .support-section { margin-top: 29px; }
  .support-grid { grid-template-columns: 1fr; }
  .support-item, .support-item:first-child, .support-item:last-child { padding: 14px 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .support-item:last-child { border-bottom: 0; }
  .maf-data-note { grid-template-columns: 22px 1fr; align-items: start; padding: 12px; }
  .maf-data-note > a { grid-column: 2; }
}

/* News desk */
.news-card h3 a { color: inherit; text-decoration: none; }
.news-card h3 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.news-photo { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 3px; margin-bottom: 11px; background: #eeeee2; }
.news-byline { margin-right: auto; color: #898b7e; font-size: 8px; }
.resource-type.news-social { color: var(--green); }
.news-card .resource-description { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 480px) { .island-label { display: none; } }

/* Every page carries the desk nav links; below ~1300px the labels would overflow the topbar
   (eleven labeled links + the install button need ~1300px beside the brand). */
@media (max-width: 1300px) {
  .topbar-right.is-crowded { flex-wrap: wrap; justify-content: flex-end; row-gap: 4px; gap: 6px; min-width: 0; }
  .topbar-right.is-crowded .maf-nav-link,
  .topbar-right.is-crowded .weather-nav-link,
  .topbar-right.is-crowded .news-nav-link,
  .topbar-right.is-crowded .map-nav-link,
  .topbar-right.is-crowded .flights-nav-link,
  .topbar-right.is-crowded .shipping-nav-link,
  .topbar-right.is-crowded .farm-nav-link,
  .topbar-right.is-crowded .safety-nav-link,
  .topbar-right.is-crowded .tenders-nav-link,
  .topbar-right.is-crowded .banks-nav-link,
  .topbar-right.is-crowded .jobs-nav-link { padding: 8px; }
  .topbar-right.is-crowded .maf-nav-link span,
  .topbar-right.is-crowded .weather-nav-link span,
  .topbar-right.is-crowded .news-nav-link span,
  .topbar-right.is-crowded .map-nav-link span,
  .topbar-right.is-crowded .flights-nav-link span,
  .topbar-right.is-crowded .shipping-nav-link span,
  .topbar-right.is-crowded .farm-nav-link span,
  .topbar-right.is-crowded .safety-nav-link span,
  .topbar-right.is-crowded .tenders-nav-link span,
  .topbar-right.is-crowded .banks-nav-link span,
  .topbar-right.is-crowded .jobs-nav-link span { display: none; }
}

/* Small phones: tighten the icon row and brand so all desk links fit; if the
   row still cannot fit beside the brand, it wraps onto its own line. */
@media (max-width: 430px) {
  .topbar { flex-wrap: wrap; row-gap: 8px; }
  .topbar-right.is-crowded { flex-wrap: wrap; justify-content: flex-end; row-gap: 4px; gap: 3px; }
  .topbar-right.is-crowded .maf-nav-link,
  .topbar-right.is-crowded .weather-nav-link,
  .topbar-right.is-crowded .news-nav-link,
  .topbar-right.is-crowded .map-nav-link,
  .topbar-right.is-crowded .flights-nav-link,
  .topbar-right.is-crowded .shipping-nav-link,
  .topbar-right.is-crowded .farm-nav-link,
  .topbar-right.is-crowded .safety-nav-link,
  .topbar-right.is-crowded .tenders-nav-link,
  .topbar-right.is-crowded .banks-nav-link,
  .topbar-right.is-crowded .jobs-nav-link { padding: 6px; }
  .brand { gap: 7px; }
  .brand-mark { width: 34px; height: 34px; }
  .brand-mark svg { width: 25px; }
  .brand-name { font-size: 18px; }
  .brand-name small { margin-top: 3px; font-size: 8px; }
}

/* Market & transport map page */
.map-page { --map-market: #b96632; --map-wharf: #2f6f7a; --map-fuel: #6d7b2a; --map-services: #8c4a63; }
.map-shell { background: radial-gradient(ellipse at 18% 6%, rgba(217,232,141,.2), transparent 30%), var(--paper); }
.map-main { padding-bottom: 24px; }
.map-hero { display: grid; grid-template-columns: minmax(0, 1fr) 260px; align-items: end; gap: 35px; padding: 44px 0 24px; }
.map-hero h1 { max-width: 700px; font-size: 44px; }
.map-hero h1 em { white-space: nowrap; }
.map-deck { max-width: 560px; margin: 12px 0 0; color: #586256; font-size: 14px; line-height: 1.65; }
.map-controls { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px; margin-bottom: 16px; }
.map-controls .location-tools { width: 345px; }
.filter-dot { display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: #b6bcab; vertical-align: 1px; }
.map-filter[data-cat="market"] .filter-dot { background: var(--map-market); }
.map-filter[data-cat="wharf"] .filter-dot { background: var(--map-wharf); }
.map-filter[data-cat="fuel"] .filter-dot { background: var(--map-fuel); }
.map-filter[data-cat="services"] .filter-dot { background: var(--map-services); }
.nearest-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0 0 16px; }
.nearest-strip[hidden] { display: none; }
.nearest-card { display: flex; min-width: 0; align-items: center; gap: 11px; padding: 11px 13px; color: var(--ink); text-align: left; border: 1px solid var(--line); border-radius: 6px; background: rgba(255,254,248,.85); cursor: pointer; transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease; --cat: var(--green); }
.nearest-card:hover { transform: translateY(-1px); border-color: #b9c7b4; box-shadow: 0 6px 16px rgba(25,61,45,.08); }
.nearest-card.is-market { --cat: var(--map-market); }
.nearest-card.is-wharf { --cat: var(--map-wharf); }
.nearest-card.is-fuel { --cat: var(--map-fuel); }
.nearest-icon { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; color: var(--cat); border-radius: 50%; background: #eef2e6; background: color-mix(in srgb, var(--cat) 12%, var(--white)); }
.nearest-icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.nearest-copy { display: grid; min-width: 0; gap: 2px; }
.nearest-copy small { color: var(--muted); font: 8px var(--mono); }
.nearest-copy strong { font-size: 13px; font-weight: 600; line-height: 1.25; overflow-wrap: anywhere; }
.nearest-copy > span { color: var(--green); font: 9px var(--mono); }
.map-panel { border: 1px solid #ccd7c7; border-radius: 8px; overflow: hidden; background: #e7ede0; }
#place-map { width: 100%; height: 470px; }
.map-fallback { display: grid; place-items: center; height: 100%; margin: 0; padding: 20px; color: var(--muted); font-size: 12px; text-align: center; }
.map-panel-note { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding: 8px 12px; color: var(--muted); border-top: 1px solid var(--line); background: rgba(255,254,248,.85); font: 8px var(--mono); }
.map-panel-note span:last-child { color: var(--green); }
.place-section { padding-top: 30px; }
.place-count { color: var(--green); font: 9px var(--mono); }
.place-intro { margin: 0 0 12px; color: var(--muted); font-size: 11px; }
.place-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.place-item { display: flex; min-width: 0; flex-direction: column; gap: 6px; padding: 13px 15px 12px; border: 1px solid var(--line); border-radius: 5px; background: rgba(255,254,248,.83); --cat: var(--green); }
.place-item.is-market { --cat: var(--map-market); }
.place-item.is-wharf { --cat: var(--map-wharf); }
.place-item.is-fuel { --cat: var(--map-fuel); }
.place-item.is-services { --cat: var(--map-services); }
.place-head { display: flex; align-items: center; gap: 9px; }
.place-pin { display: grid; width: 26px; height: 26px; flex: 0 0 26px; place-items: center; color: var(--white); border-radius: 50%; background: var(--cat); }
.place-pin svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.place-head h3 { min-width: 0; flex: 1 1 auto; margin: 0; font-size: 14px; font-weight: 600; line-height: 1.3; }
.place-distance { flex: 0 0 auto; color: var(--green); font: 9px var(--mono); white-space: nowrap; }
.place-meta { margin: 0; color: var(--muted); font: 9px var(--mono); }
.place-actions { margin-top: auto; }
.place-link { color: var(--green); font-size: 10px; font-weight: 600; text-underline-offset: 2px; }
.map-source-note { margin-top: 16px; padding: 12px 14px; border-left: 2px solid #83a576; background: rgba(255,254,248,.65); }
.map-source-note p { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.7; }
.map-source-note a { color: var(--green); text-underline-offset: 2px; }
.leaflet-container { font-family: var(--sans); background: #dfe8dc; }
.leaflet-control-attribution { font: 8px var(--mono) !important; }
.place-marker { display: grid; place-items: center; width: 26px; height: 26px; border: 2px solid var(--white); border-radius: 50%; background: var(--green); box-shadow: 0 2px 6px rgba(25,61,45,.35); }
.place-marker svg { width: 14px; height: 14px; fill: none; stroke: var(--white); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.place-marker.is-market { background: var(--map-market); }
.place-marker.is-wharf { background: var(--map-wharf); }
.place-marker.is-fuel { background: var(--map-fuel); }
.place-marker.is-services { background: var(--map-services); }
.place-marker.is-origin { background: var(--green-deep); box-shadow: 0 0 0 4px rgba(25,61,45,.22), 0 2px 6px rgba(25,61,45,.35); }
.place-popup { display: grid; gap: 4px; font-size: 12px; }
.place-popup strong { font-size: 13px; }
.place-popup .place-popup-meta { color: var(--muted); font: 9px var(--mono); }
.place-popup .place-popup-distance { color: var(--green); font: 9px var(--mono); }
.place-popup a { margin-top: 3px; color: var(--green); font-size: 11px; font-weight: 600; }
.leaflet-popup-content-wrapper { border-radius: 6px; }
.leaflet-popup-content { margin: 11px 13px; }
@media (max-width: 1000px) {
  .map-hero { grid-template-columns: 1fr; gap: 16px; }
  .map-controls { align-items: stretch; flex-direction: column; }
  .map-controls .location-tools { width: 100%; }
}
@media (max-width: 620px) {
  .map-hero { padding: 25px 0 17px; }
  .map-hero h1 { font-size: 32px; }
  .map-hero h1 em { white-space: normal; }
  .map-deck { font-size: 12px; }
  .nearest-strip { grid-template-columns: 1fr; }
  #place-map { height: 340px; }
  .place-list { grid-template-columns: 1fr; }
  .map-panel-note { flex-direction: column; gap: 3px; }
}

/* Trip planner, travel outlook & nearby lookup */
.trip-panel { display: grid; gap: 13px; margin: 0 0 16px; padding: 15px 17px 14px; border: 1px solid #ddcda9; border-radius: 8px; background: linear-gradient(112deg, #fdf8ec 0%, #f6efdc 100%); }
.trip-panel[hidden] { display: none; }
.trip-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.trip-kicker { display: block; margin-bottom: 3px; color: var(--amber); font: 8px var(--mono); }
.trip-title { font-size: 15px; font-weight: 600; line-height: 1.35; }
.trip-close { flex: 0 0 auto; padding: 6px 10px; color: #805226; border: 1px solid #d4b886; border-radius: 5px; background: rgba(255,254,248,.8); font: 9px var(--mono); cursor: pointer; transition: background .18s ease, border-color .18s ease; }
.trip-close:hover { border-color: #b99358; background: #fffef8; }
.trip-stats { display: flex; flex-wrap: wrap; gap: 8px; }
.trip-stat { display: grid; gap: 2px; min-width: 96px; padding: 8px 12px; border: 1px solid #e4d8b5; border-radius: 6px; background: rgba(255,254,248,.85); }
.trip-stat small { color: #8a7a54; font: 8px var(--mono); }
.trip-stat strong { font-size: 14px; font-weight: 600; }
.trip-stat.is-ferry { border-color: #c9b27c; background: #fbf3dd; }
.trip-note { margin: 0; width: 100%; color: #8a7a54; font-size: 9px; line-height: 1.65; }
.trip-note a { color: #805226; text-underline-offset: 2px; }
.trip-weather { display: grid; gap: 8px; }
.trip-weather-heading { margin: 0; color: #6d6046; font-size: 11px; }
.trip-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.trip-day { display: grid; gap: 2px; justify-items: center; padding: 7px 4px; border: 1px solid #e4d8b5; border-radius: 6px; background: rgba(255,254,248,.8); text-align: center; }
.trip-day small { color: #8a7a54; font: 8px var(--mono); }
.trip-day strong { font-size: 12px; font-weight: 600; }
.trip-day span { color: #6d6046; font: 8px var(--mono); white-space: nowrap; }
.trip-day.is-best { border-color: #83a576; background: #eef5e3; }
.trip-day.is-best strong { color: var(--green); }
.place-actions { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.place-plan { padding: 0; color: var(--green); border: 0; background: none; font: 600 10px var(--sans); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.place-plan:hover { color: var(--green-deep); }
.place-popup .place-plan { margin-top: 4px; text-align: left; }
.place-marker.is-probe { background: #5b6459; }
.nearby-popup { display: grid; gap: 6px; min-width: 205px; }
.nearby-popup > strong { font-size: 13px; }
.nearby-row { display: flex; align-items: center; gap: 7px; width: 100%; padding: 5px 6px; border: 1px solid transparent; border-radius: 5px; background: none; text-align: left; cursor: pointer; --cat: var(--green); }
.nearby-row:hover { border-color: #dbe0d3; background: #f4f7ee; }
.nearby-row.is-market { --cat: var(--map-market); }
.nearby-row.is-wharf { --cat: var(--map-wharf); }
.nearby-row.is-fuel { --cat: var(--map-fuel); }
.nearby-row.is-services { --cat: var(--map-services); }
.nearby-dot { width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: var(--cat); }
.nearby-name { min-width: 0; flex: 1 1 auto; font-size: 11px; line-height: 1.3; }
.nearby-distance { flex: 0 0 auto; color: var(--green); font: 9px var(--mono); }
.nearby-note { color: var(--muted); font-size: 9px; line-height: 1.5; }
@media (max-width: 850px) {
  .trip-days { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .trip-head { flex-direction: column; gap: 8px; }
  .trip-days { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Market pulse: SBS prices + market-day weather */
.pulse-section { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 12px; margin: 18px 0 0; }
.pulse-card { display: flex; min-width: 0; flex-direction: column; padding: 16px 18px 14px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,254,248,.83); }
.pulse-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.pulse-head .eyebrow { margin-bottom: 3px; }
.pulse-head h2 { margin: 0; font-size: 18px; font-weight: 600; }
.pulse-period { color: var(--green); font: 9px var(--mono); white-space: nowrap; }
.pulse-note { margin: 0 0 10px; color: var(--muted); font-size: 10px; line-height: 1.6; }
.pulse-source { margin: auto 0 0; padding-top: 9px; color: var(--muted); font-size: 9px; line-height: 1.5; }
.pulse-source a { color: var(--green); text-underline-offset: 2px; }
.price-table { display: grid; gap: 4px; }
.price-row { display: grid; grid-template-columns: minmax(0, 1.3fr) auto auto auto; align-items: baseline; gap: 10px; padding: 6px 8px; border-radius: 5px; }
.price-row:nth-child(odd) { background: #f6f7ec; }
.price-name { min-width: 0; font-size: 12px; font-weight: 600; }
.price-value { color: var(--green-deep); font-size: 13px; font-weight: 700; white-space: nowrap; }
.price-unit { margin-left: 4px; color: var(--muted); font: 8px var(--mono); }
.price-change { color: var(--muted); font: 9px var(--mono); white-space: nowrap; }
.price-change.is-up { color: #3e7a48; }
.price-change.is-down { color: var(--amber); }
.price-period { color: var(--muted); font: 9px var(--mono); white-space: nowrap; }
.fuel-month { display: flex; align-items: baseline; gap: 8px; margin: 2px 0 8px; }
.fuel-month strong { color: var(--green-deep); font-size: 14px; font-weight: 700; }
.fuel-month .farm-stamp { margin: 0; }
.fuel-rows { display: grid; gap: 5px; }
.fuel-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: baseline; gap: 10px; padding: 7px 8px; border-radius: 5px; }
.fuel-row:nth-child(odd) { background: #f6f7ec; }
.fuel-name { font-size: 12px; font-weight: 600; }
.fuel-value { color: var(--green-deep); font-size: 14px; font-weight: 700; white-space: nowrap; }
.fuel-unit { margin-left: 4px; color: var(--muted); font: 8px var(--mono); }
.fuel-change { color: var(--muted); font: 9px var(--mono); white-space: nowrap; text-align: right; }
.fuel-change.is-up { color: #3e7a48; }
.fuel-change.is-down { color: var(--amber); }
.market-top { display: grid; gap: 4px; margin: 2px 0 9px; }
.market-line { margin: 0; color: #45503f; font-size: 11px; line-height: 1.55; }
.market-rows { display: grid; gap: 4px; }
.fieldday-now { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.fieldday-line { margin: 0; color: #45503f; font-size: 12px; line-height: 1.5; }
.fieldday-chip.uv-low { background: #e7efe4; color: #3e7a48; }
.fieldday-chip.uv-mod { background: #f2eddd; color: #7d6a2f; }
.fieldday-chip.uv-high { background: #f7e5d3; color: #9a5b1f; }
.fieldday-chip.uv-vhigh { background: #f6d9ce; color: #a03b2a; }
.fieldday-chip.uv-ext { background: #ead2d6; color: #8c2332; }
.news-list li .farm-stamp { display: block; margin-top: 2px; }
.weather-spotlight { display: grid; gap: 6px; }
.spotlight-row { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 7px 8px; border-radius: 5px; background: #f6f7ec; --cat: var(--green); }
.spotlight-row.is-market { --cat: var(--map-market); }
.spotlight-row.is-wharf { --cat: var(--map-wharf); }
.spotlight-name { min-width: 0; overflow: hidden; font-size: 12px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.spotlight-meta { color: #586256; font: 9px var(--mono); white-space: nowrap; }
.place-weather { margin: 0; color: #586256; font: 9px var(--mono); }
@media (max-width: 850px) {
  .pulse-section { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .spotlight-row { grid-template-columns: 10px minmax(0, 1fr); row-gap: 2px; }
  .spotlight-meta { grid-column: 2; }
}

/* Farm desk: tide watch */
.tide-panel { display: grid; gap: 12px; }
.tide-next { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.tide-next-card { display: grid; gap: 2px; padding: 10px 12px; border: 1px solid #cadbd8; border-radius: 6px; background: linear-gradient(112deg, #f5f8f1 0%, #eaf3f1 100%); }
.tide-next-card small { color: #386f72; font: 8px var(--mono); }
.tide-next-card strong { font-size: 17px; font-weight: 600; }
.tide-next-card span { color: var(--muted); font: 8px var(--mono); }
.tide-next-card.is-low strong { color: #55706f; }
.tide-rows { display: grid; gap: 4px; }
.tide-day { margin: 8px 0 2px; color: var(--muted); font: 8px var(--mono); }
.tide-row { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; align-items: baseline; gap: 10px; padding: 5px 8px; border-radius: 5px; }
.tide-row:nth-child(odd) { background: #f6f7ec; }
.tide-kind { font: 8px var(--mono); letter-spacing: .4px; }
.tide-kind.is-high { color: #2f6f7a; }
.tide-kind.is-low { color: var(--amber); }
.tide-time { font-size: 13px; font-weight: 600; }
.tide-height { color: var(--muted); font: 9px var(--mono); }
@media (max-width: 620px) {
  .tide-next { grid-template-columns: 1fr; }
}

/* Home / landing page */
.home-hero { max-width: 780px; padding: 44px 0 8px; }
.home-hero h1 { margin: 0 0 12px; font-size: 44px; }
.home-deck { max-width: 620px; margin: 0 0 20px; color: #586256; font-size: 14px; line-height: 1.65; }
.home-search { position: relative; max-width: 640px; }
.home-search-box { display: flex; height: 52px; align-items: center; gap: 11px; padding: 0 15px; color: var(--green); border: 1px solid #cdd8c8; border-radius: 8px; background: var(--white); box-shadow: 0 4px 14px rgba(25,61,45,.07); transition: border-color .18s ease, box-shadow .18s ease; }
.home-search-box:focus-within { border-color: #557c58; outline: 3px solid rgba(85,124,88,.15); outline-offset: 2px; box-shadow: 0 6px 18px rgba(25,61,45,.1); }
.home-search-box svg { width: 19px; height: 19px; flex: 0 0 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 1.7; }
.home-search-box input { width: 100%; min-width: 0; padding: 0; color: var(--ink); border: 0; outline: 0; background: transparent; font-size: 14px; }
.home-search-box input::placeholder { color: #92958a; }
.home-search-results { position: absolute; top: calc(100% + 7px); right: 0; left: 0; z-index: 40; max-height: 380px; overflow: auto; padding: 9px; border: 1px solid var(--line); border-radius: 8px; background: var(--white); box-shadow: 0 14px 30px rgba(25,61,45,.16); }
.home-search-results[hidden] { display: none; }
.home-search-group + .home-search-group { margin-top: 7px; padding-top: 7px; border-top: 1px solid #eef0e4; }
.home-search-heading { margin: 0 0 4px; padding: 0 8px; color: var(--muted); font: 8px var(--mono); }
.home-search-item { display: grid; gap: 1px; padding: 6px 8px; border-radius: 5px; text-decoration: none; }
.home-search-item:hover, .home-search-item:focus-visible { background: #f4f7ee; }
.home-search-title { color: var(--ink); font-size: 12px; font-weight: 600; }
.home-search-meta { color: var(--muted); font: 8px var(--mono); }
.home-search-empty { margin: 0; padding: 8px; color: var(--muted); font-size: 11px; }
.home-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; margin: 26px 0 0; }
.home-card { display: flex; min-width: 0; flex-direction: column; padding: 15px 16px 13px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,254,248,.83); transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
.home-card:hover { transform: translateY(-2px); border-color: #bdcbbb; box-shadow: 0 6px 17px rgba(25,61,45,.07); }
.home-card-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.home-card-head .eyebrow { margin: 0; }
.home-stamp { color: var(--green); font: 8px var(--mono); white-space: nowrap; }
.home-card h2 { margin: 2px 0 9px; font-size: 16px; font-weight: 600; }
.home-body { display: grid; gap: 5px; margin-bottom: 11px; }
.home-row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.home-row-label { color: var(--muted); font: 8px var(--mono); }
.home-row-value { min-width: 0; font-size: 12px; font-weight: 600; text-align: right; overflow-wrap: anywhere; }
.home-row-value.is-good { color: #3e7a48; }
.home-row-value.is-alert { color: #b84638; }
.home-row-value.is-muted { color: var(--muted); font-weight: 400; }
.home-delta { margin-left: 6px; font: 9px var(--mono); }
.home-delta.is-up { color: #3e7a48; }
.home-delta.is-down { color: var(--amber); }
.home-weather-headline { display: flex; align-items: baseline; gap: 8px; margin: 2px 0 6px; }
.home-temp { font-size: 34px; font-weight: 600; line-height: 1; }
.home-cond { color: var(--green); font-size: 12px; }
.home-news-item { display: grid; gap: 1px; padding: 5px 0; text-decoration: none; }
.home-news-item + .home-news-item { border-top: 1px solid #eef0e4; }
.home-news-title { color: var(--ink); font-size: 12px; font-weight: 600; line-height: 1.35; }
.home-news-item:hover .home-news-title { color: var(--green); text-decoration: underline; text-underline-offset: 2px; }
.home-news-meta { color: var(--muted); font: 8px var(--mono); }
.home-link { margin-top: auto; color: var(--green); font-size: 10px; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.home-link:hover { color: var(--green-deep); }
@media (max-width: 1000px) {
  .home-hero { padding-top: 34px; }
  .home-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .home-hero h1 { font-size: 32px; }
  .home-deck { font-size: 12px; }
  .home-grid { grid-template-columns: 1fr; }
}

/* Farm desk */
.farm-shell { background: radial-gradient(ellipse at 24% 3%, rgba(217,232,141,.2), transparent 30%), var(--paper); }
.farm-main { padding-bottom: 24px; }
.farm-deck { max-width: 520px; margin: 12px 0 0; color: #586256; font-size: 13px; line-height: 1.65; }
.farm-grid { display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr); gap: 0 13px; }
.farm-main .hub-section { padding-top: 27px; }
.farm-panel { padding: 15px 16px 14px; border: 1px solid var(--line); border-radius: 6px; background: rgba(255,254,248,.83); }
.farm-loading { margin: 0; color: var(--muted); font-size: 11px; }
.farm-error { margin: 0; padding: 11px 13px; color: #7a4a3f; border: 1px solid #e0c8bd; border-radius: 6px; background: #f9ede6; font-size: 11px; line-height: 1.55; }
.farm-intro { margin: 0 0 12px; color: var(--muted); font-size: 11px; }
.farm-stamp { margin: 10px 0 0; color: #898b7e; font: 8px var(--mono); line-height: 1.6; }
.farm-disclaimer { margin: 10px 0 0; color: #898b7e; font-size: 9px; line-height: 1.55; }
.farm-note { margin: 8px 0 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.farm-note[hidden] { display: none; }
.farm-nav-link { display: inline-flex; align-items: center; gap: 6px; padding: 8px 10px; color: var(--green); border: 1px solid #d4ddce; border-radius: 5px; background: #f0f5e9; font: 9px var(--mono); text-decoration: none; white-space: nowrap; transition: background .18s ease, border-color .18s ease; }
.farm-nav-link:hover { border-color: #a7b99f; background: #e3edda; }
.farm-nav-link svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; }

.alert-list { display: grid; gap: 9px; }
.alert-item { display: grid; gap: 6px; padding: 12px 13px; border: 1px solid var(--line); border-left-width: 3px; border-radius: 6px; background: var(--white); }
.alert-item.is-red { border-left-color: #b84638; }
.alert-item.is-orange { border-left-color: var(--amber); }
.alert-item.is-green { border-left-color: #3f6b4f; }
.alert-item.is-watch { border-left-color: #386f72; }
.alert-top { display: flex; align-items: center; gap: 8px; }
.alert-chip { padding: 3px 7px; color: var(--white); border-radius: 3px; font: 8px var(--mono); letter-spacing: .05em; }
.alert-chip.is-red { background: #b84638; }
.alert-chip.is-orange { background: var(--amber); }
.alert-chip.is-green { background: #3f6b4f; }
.alert-chip.is-watch { background: #386f72; }
.alert-kind { display: inline-flex; align-items: center; gap: 4px; color: #386f72; font: 8px var(--mono); }
.alert-kind svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.alert-source { margin-left: auto; color: var(--muted); font: 8px var(--mono); }
.alert-title { margin: 0; font-size: 13px; font-weight: 600; line-height: 1.4; }
.alert-detail { margin: 0; color: #687064; font-size: 11px; line-height: 1.55; }
.alert-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; color: var(--muted); font: 9px var(--mono); }
.alert-foot a { display: inline-flex; min-height: 32px; align-items: center; color: var(--green); font-weight: 600; text-decoration: none; }
.alert-foot a:hover { text-decoration: underline; text-underline-offset: 3px; }
.alert-clear { display: grid; gap: 4px; padding: 13px 14px; color: #2f5c3b; border: 1px solid #c8ddbf; border-radius: 6px; background: var(--green-light); }
.alert-clear strong { font-size: 13px; font-weight: 600; }
.alert-clear span { color: #4e6f56; font: 9px var(--mono); }

.season-enso { display: grid; gap: 8px; }
.season-chip { display: inline-flex; width: max-content; align-items: center; padding: 4px 10px; border-radius: 999px; font: 9px var(--mono); }
.season-chip.is-warm { color: #855526; border: 1px solid #d4b886; background: #f8f1df; }
.season-chip.is-cool { color: #2f6570; border: 1px solid #b9d2d3; background: #e7f1ef; }
.season-chip.is-neutral { color: #2f5c3b; border: 1px solid #c8ddbf; background: var(--green-light); }
.season-chip:empty, .farm-chip:empty { display: none; }
.season-enso-label { margin: 0; font-size: 14px; font-weight: 600; }
.season-enso-note { margin: 0; color: #687064; font-size: 11px; line-height: 1.6; }
.season-rain { display: grid; gap: 4px; margin-top: 12px; padding-top: 11px; border-top: 1px solid #e7e8dc; }
.season-rain-value { margin: 0; font-size: 32px; font-weight: 500; line-height: 1.05; }
.season-rain-value small { margin-left: 4px; color: var(--muted); font: 11px var(--mono); }
.season-rain-window { margin: 0; color: var(--green); font: 9px var(--mono); }
.season-rain-compare { margin: 5px 0 0; color: #687064; font-size: 11px; line-height: 1.55; }
.season-bars { display: flex; align-items: flex-end; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid #e7e8dc; }
.season-bar { display: grid; min-width: 0; flex: 1 1 0; gap: 5px; }
.season-bar-track { display: flex; height: 64px; align-items: flex-end; }
.season-bar-fill { width: 100%; border-radius: 3px 3px 0 0; background: linear-gradient(180deg, #83a576, var(--green)); }
.season-bar-label { color: var(--muted); font: 8px var(--mono); text-align: center; }

.soil-values { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding-bottom: 4px; }
.soil-values .farm-loading { grid-column: 1 / -1; }
.soil-values small { display: block; margin-bottom: 4px; color: var(--muted); font: 8px var(--mono); }
.soil-values strong { font-size: 15px; font-weight: 600; }
.farm-notes { display: grid; gap: 6px; margin: 11px 0 0; padding: 11px 0 0; border-top: 1px solid #e7e8dc; list-style: none; }
.farm-notes[hidden] { display: none; }
.farm-notes li { position: relative; padding-left: 15px; color: #45503f; font-size: 10.5px; line-height: 1.6; }
.farm-notes li::before { position: absolute; top: -1px; left: 1px; color: var(--green); font-weight: 700; content: '•'; }
.farm-links { display: flex; flex-wrap: wrap; gap: 7px 16px; margin-top: 11px; padding-top: 11px; border-top: 1px solid #e7e8dc; }
.farm-links a, .farm-links-list a { display: inline-flex; align-items: center; gap: 5px; color: var(--green); font-size: 10px; font-weight: 600; text-decoration: none; }
.farm-links a:hover, .farm-links-list a:hover { text-decoration: underline; text-underline-offset: 3px; }
.farm-links-list { display: grid; gap: 7px; margin: 11px 0 0; padding: 11px 0 0; border-top: 1px solid #e7e8dc; list-style: none; }
.farm-links-list:empty { display: none; }
.farm-links-list a { min-height: 32px; }

.windows-rows { display: grid; gap: 14px; }
.window-row { display: grid; gap: 8px; }
.window-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.window-label { font-size: 13px; font-weight: 600; }
.window-best { color: var(--green); font: 9px var(--mono); text-align: right; }
.window-chips { display: flex; gap: 5px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.farm-day { display: inline-flex; min-width: 44px; min-height: 44px; flex: 0 0 auto; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 5px 7px; border: 1px solid var(--line); border-radius: 7px; background: var(--white); font-size: 10px; font-weight: 600; cursor: pointer; transition: border-color .15s ease, background .15s ease; }
.farm-day .day-dot { width: 8px; height: 8px; border-radius: 50%; background: #898b7e; }
.farm-day.is-good { border-color: #b9d3ad; background: #eef5e3; }
.farm-day.is-good .day-dot { background: #3f6b4f; }
.farm-day.is-fair { border-color: #e0cba3; background: #faf3e2; }
.farm-day.is-fair .day-dot { background: var(--amber); }
.farm-day.is-poor { border-color: #dcc3bd; background: #f7ece9; }
.farm-day.is-poor .day-dot { background: #b84638; }
.farm-day[aria-expanded="true"] { outline: 3px solid rgba(85,124,88,.28); outline-offset: 1px; }
.window-reason { margin: 0; padding: 9px 11px; color: #45503f; border-left: 2px solid #83a576; background: rgba(255,254,248,.7); font-size: 10.5px; line-height: 1.6; }
.window-reason[hidden] { display: none; }
.windows-legend { display: flex; flex-wrap: wrap; gap: 7px 14px; margin-top: 13px; padding-top: 11px; border-top: 1px solid #e7e8dc; color: var(--muted); font: 9px var(--mono); }
.legend-item { display: inline-flex; align-items: center; gap: 6px; }
.legend-dot { width: 8px; height: 8px; border-radius: 50%; }
.legend-dot.is-good { background: #3f6b4f; }
.legend-dot.is-fair { background: var(--amber); }
.legend-dot.is-poor { background: #b84638; }

.pest-head { display: flex; align-items: center; gap: 8px; }
.farm-chip { display: inline-flex; align-items: center; padding: 5px 11px; border-radius: 999px; font: 9px var(--mono); }
.farm-chip.is-loading { color: var(--muted); border: 1px solid var(--line); background: #eeeee2; }
.farm-chip.is-elevated { color: var(--white); background: #b84638; }
.farm-chip.is-watch { color: var(--white); background: #386f72; }
.farm-chip.is-normal { color: #2f5c3b; border: 1px solid #c8ddbf; background: var(--green-light); }
.pest-message { margin: 10px 0 0; font-size: 12px; line-height: 1.6; }

.freshness-list { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.freshness-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 9px 11px; border: 1px solid #edede3; border-radius: 5px; background: var(--white); }
.freshness-label { min-width: 0; font-size: 11px; font-weight: 600; }
.freshness-age { color: var(--muted); font: 9px var(--mono); white-space: nowrap; }
.freshness-row.is-stale { opacity: .75; }
.freshness-row.is-stale .freshness-age { color: var(--amber); }
.farm-attribution { margin: 12px 0 0; padding-top: 11px; border-top: 1px solid #e7e8dc; color: var(--muted); font-size: 9px; line-height: 1.7; }
.farm-attribution a { color: var(--green); text-underline-offset: 2px; }

@media (max-width: 920px) {
  .farm-grid { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .farm-nav-link { padding: 7px; font-size: 8px; }
  .farm-nav-link svg { width: 14px; height: 14px; }
  .farm-deck { font-size: 12px; }
  .farm-panel { padding: 13px 13px 12px; }
  .soil-values { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 10px; }
  .season-rain-value { font-size: 27px; }
  .season-bar-track { height: 52px; }
  .alert-top { flex-wrap: wrap; }
  .alert-source { margin-left: 0; }
  .freshness-row { flex-direction: column; gap: 3px; }
}

/* Farm desk states */
.alert-panel .farm-loading, .windows-rows .farm-loading { padding: 2px 0 6px; }
.freshness-empty { padding: 8px 2px; color: var(--muted); font-size: 11px; }

/* Shipping desk */
.ship-ferry-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ship-ferry-card { display: flex; min-width: 0; flex-direction: column; padding: 16px 18px 14px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,254,248,.83); }
.ship-ferry-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.ship-ferry-head .eyebrow { margin-bottom: 3px; }
.ship-ferry-head h3 { margin: 0; font-size: 18px; font-weight: 600; }
.ship-ferry-scope { margin: 3px 0 0; color: var(--muted); font-size: 10px; }
.ship-month-chip { flex: 0 0 auto; padding: 5px 9px; color: var(--green-deep); border: 1px solid #cdd8c8; border-radius: 999px; background: #eef3e8; font: 9px var(--mono); white-space: nowrap; }
.ship-month-chip.is-awaiting { color: var(--amber); border-color: #e4d8bc; background: #f8f1df; }
.ship-schedule { margin: 0 0 10px; }
.ship-schedule-link { display: block; overflow: hidden; border: 1px solid #e2e6d8; border-radius: 6px; background: #f7f8f1; }
.ship-schedule-image { display: block; width: 100%; height: auto; max-height: 460px; object-fit: contain; background: #fff; }
.ship-schedule figcaption { margin-top: 6px; color: #898b7e; font-size: 9px; line-height: 1.5; }
.ship-schedule-cta { display: grid; gap: 7px; justify-items: start; margin-bottom: 10px; padding: 12px; border: 1px dashed #cdd8c8; border-radius: 6px; background: #f7f8f1; }
.ship-schedule-cta p { margin: 0; color: #586256; font-size: 11px; line-height: 1.55; }
.ship-schedule-cta-link { color: var(--green); font-size: 11px; font-weight: 600; text-decoration: none; }
.ship-schedule-cta-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.ship-awaiting-note { margin: 0 0 10px; padding: 8px 10px; color: #655942; border: 1px solid #e4d8bc; border-radius: 5px; background: #f8f1df; font-size: 10px; line-height: 1.55; }
.ship-fares { display: grid; gap: 10px; margin-bottom: 2px; }
.ship-fare-block { padding: 9px 11px 7px; border: 1px solid #e7e8dc; border-radius: 6px; background: #fbfbf4; }
.ship-fare-title { margin: 0 0 6px; color: var(--green); font: 8px var(--mono); letter-spacing: .3px; }
.ship-fare-table { width: 100%; border-collapse: collapse; font-size: 10px; }
.ship-fare-table th { padding: 3px 6px; color: var(--muted); border-bottom: 1px solid #eef0e4; font: 8px var(--mono); text-align: right; }
.ship-fare-table th:first-child { text-align: left; }
.ship-fare-table td { padding: 3px 6px; border-bottom: 1px solid #f2f4ea; }
.ship-fare-table tr:last-child td { border-bottom: 0; }
.ship-fare-name { color: #495449; font-weight: 600; }
.ship-fare-value { color: var(--green-deep); font-weight: 600; text-align: right; white-space: nowrap; }
.ship-ferry-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 11px; border-top: 1px solid #e7e8dc; }
.ship-ferry-source { color: var(--green); font-size: 10px; font-weight: 600; text-decoration: none; }
.ship-ferry-source:hover { text-decoration: underline; text-underline-offset: 3px; }
.ship-age { color: #898b7e; font: 8px var(--mono); white-space: nowrap; }
.ship-call-list { display: grid; gap: 8px; }
.ship-call { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto auto; align-items: center; gap: 14px; padding: 11px 14px; border: 1px solid var(--line); border-radius: 7px; background: rgba(255,254,248,.83); }
.ship-call.is-next { border-color: #a7b99f; background: linear-gradient(112deg, #f4f8ee 0%, #eef3e8 100%); }
.ship-call-date { display: grid; justify-items: center; padding: 6px 0; border-radius: 6px; background: #eef3e8; }
.ship-call.is-next .ship-call-date { color: var(--white); background: var(--green-deep); }
.ship-call-date strong { font-size: 20px; font-weight: 700; line-height: 1.05; }
.ship-call-date span { font: 8px var(--mono); letter-spacing: .4px; }
.ship-call-date small { font-size: 8px; opacity: .75; }
.ship-call-main { min-width: 0; }
.ship-call-main h3 { margin: 0; font-size: 15px; font-weight: 600; }
.ship-call-main h3 a { color: inherit; text-decoration: none; }
.ship-call-main h3 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ship-call-main p { margin: 2px 0 0; color: #687064; font-size: 10px; }
.ship-call-times { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 5px; }
.ship-chip { padding: 4px 8px; color: #44614b; border: 1px solid #d4ddce; border-radius: 999px; background: #f0f5e9; font: 8px var(--mono); white-space: nowrap; }
.ship-chip-next { color: var(--white); border-color: var(--green-deep); background: var(--green-deep); font-weight: 700; letter-spacing: .4px; }
.ship-note { margin: 10px 0 0; color: var(--muted); font-size: 9px; line-height: 1.6; }
.ship-note a { color: var(--green); text-underline-offset: 2px; }
.ship-port-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ship-port-card { display: flex; flex-direction: column; padding: 15px 16px 14px; border: 1px solid var(--line); border-radius: 7px; background: rgba(255,254,248,.83); }
.ship-port-card h3 { margin: 0 0 6px; font-size: 15px; font-weight: 600; }
.ship-port-card p { flex: 1; margin: 0 0 10px; color: #687064; font-size: 10px; line-height: 1.6; }
.ship-port-link { display: inline-flex; gap: 5px; margin-top: 4px; color: var(--green); font-size: 10px; font-weight: 600; text-decoration: none; }
.ship-port-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.ship-contact-list { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ship-contact-list li { color: #586256; font-size: 10px; }
.ship-contact-list a { color: var(--green); font-weight: 600; text-decoration: none; }
.ship-contact-list a:hover { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 850px) {
  .ship-ferry-grid { grid-template-columns: 1fr; }
  .ship-port-grid { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .ship-call { grid-template-columns: 56px minmax(0, 1fr); row-gap: 8px; }
  .ship-call-times { grid-column: 2; justify-content: flex-start; }
  .ship-chip-next { grid-column: 2; justify-self: start; }
}

/* Flights desk */
.flights-shell { background: radial-gradient(ellipse at 88% 7%, rgba(185,102,50,.09), transparent 30%), var(--paper); }
.flight-board { min-width: 0; }
.flight-list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.flight-day-heading { margin-top: 10px; padding-top: 12px; border-top: 1px dashed var(--line); color: var(--green); font: 9px var(--mono); }
.flight-list .flight-day-heading:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.flight-row { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; align-items: center; gap: 13px; padding: 11px 14px; border: 1px solid var(--line); border-radius: 5px; background: rgba(255,254,248,.83); }
.flight-time strong { display: block; color: var(--green-deep); font: 500 17px var(--mono); }
.flight-time small { display: block; margin-top: 2px; color: var(--muted); font: 8px var(--mono); white-space: nowrap; }
.flight-main { min-width: 0; }
.flight-headline { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.flight-no { padding: 2px 6px; color: var(--green-deep); background: var(--green-light); border-radius: 3px; font: 500 10px var(--mono); }
.flight-airline { font-size: 12px; font-weight: 600; }
.flight-route { margin-top: 3px; color: var(--muted); font-size: 10px; }
.flight-status { justify-self: end; padding: 4px 10px; border-radius: 999px; font: 9px var(--mono); white-space: nowrap; }
.flight-status.is-scheduled { color: var(--green); background: rgba(25,61,45,.08); }
.flight-status.is-estimated { color: #7a5b1e; background: #f2ead3; }
.flight-status.is-delayed { color: #8a4a1d; background: #f6e3d3; }
.flight-status.is-landed { color: var(--green-deep); background: var(--green-light); }
.flight-status.is-canceled { color: #8c3423; background: #f3dcd6; }
.flight-status.is-diverted { color: #7a5b1e; background: #f2ead3; }
.flight-status.is-unknown { color: var(--muted); background: #ecece0; }
.flight-status.is-timetable { color: var(--green); background: var(--green-light); }
.flight-empty { margin: 0; padding: 14px 15px; color: var(--muted); border: 1px dashed var(--line); border-radius: 5px; background: rgba(255,254,248,.55); font-size: 11px; }
.flight-day-filters { margin-bottom: 12px; }
.flight-day-filters .resource-filter.is-today { box-shadow: inset 0 -2px 0 var(--amber); }
.flight-timetable-note { margin: 11px 2px 0; color: var(--muted); font-size: 10px; line-height: 1.6; }
.flight-section-heading { margin: 0 2px 9px; color: var(--green); font: 9px var(--mono); }
@media (max-width: 620px) {
  .flight-row { grid-template-columns: 64px minmax(0, 1fr); align-items: start; }
  .flight-actions { grid-column: 2; justify-self: start; }
  .flight-time strong { font-size: 15px; }
}

/* Safety desk */
.safety-shell { background: radial-gradient(ellipse at 12% 6%, rgba(185,102,50,.09), transparent 30%), var(--paper); }
.safety-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 13px; align-items: stretch; }
.safety-ready-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
.safety-card { display: flex; min-width: 0; flex-direction: column; padding: 16px 18px 14px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,254,248,.83); }
.safety-card h3 { margin: 2px 0 9px; font-size: 17px; font-weight: 600; }
.safety-guidance .eyebrow { margin-bottom: 5px; }
.guidance-list { display: grid; gap: 8px; margin: 0; padding-left: 17px; }
.guidance-list li { color: #46523f; font-size: 12.5px; line-height: 1.6; }
.tsunami-chip { align-self: flex-start; padding: 5px 10px; border-radius: 999px; font: 9px var(--mono); }
.tsunami-chip.is-quiet { color: var(--green); background: var(--green-light); }
.tsunami-chip.is-recent { color: #7a5b1e; background: #f2ead3; }
.tsunami-chip.is-active { color: #fffdf7; background: #b84638; }
.tsunami-region { margin: 11px 0 4px; font-size: 20px; font-weight: 600; }
.tsunami-meta { margin: 0 0 6px; color: var(--muted); font: 9px var(--mono); }
.tsunami-note { margin: 0 0 10px; color: #586256; font-size: 12px; line-height: 1.6; }
.tsunami-link { margin-top: auto; align-self: flex-start; color: var(--green); font-size: 11px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.quake-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 13px; align-items: start; }
.quake-list { display: grid; gap: 8px; max-height: 560px; overflow: auto; padding-right: 3px; }
.quake-row { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 5px; background: rgba(255,254,248,.83); }
.quake-mag { display: grid; place-items: center; align-self: start; padding: 7px 0; color: #7a5b1e; background: #f2ead3; border-radius: 4px; font: 600 14px var(--mono); }
.quake-mag.is-strong { color: #8a4a1d; background: #f6e3d3; }
.quake-mag.is-major { color: #fffdf7; background: #b84638; }
.quake-main { min-width: 0; }
.quake-place { display: block; font-size: 13px; font-weight: 600; line-height: 1.4; }
.quake-place a { color: inherit; text-decoration: none; }
.quake-place a:hover { text-decoration: underline; text-underline-offset: 3px; }
.quake-meta { margin: 3px 0 0; color: var(--muted); font: 9px var(--mono); }
.quake-flag { margin: 4px 0 0; color: #8a4a1d; font: 9px var(--mono); }
.quake-map { height: 560px; border: 1px solid var(--line); border-radius: 6px; background: #eef1e4; }
.quake-map-note { margin: 0; padding: 14px; color: var(--muted); font-size: 11px; }
@media (max-width: 1000px) {
  .safety-grid, .quake-grid { grid-template-columns: 1fr; }
  .quake-list { max-height: none; }
  .quake-map { height: 360px; }
  .safety-ready-grid { grid-template-columns: 1fr; }
}

/* Sea state at the crossing (ships & ferries desk) */
.sea-panel { display: grid; gap: 12px; }
.sea-now { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; padding: 15px 17px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,254,248,.83); }
.sea-stat { display: grid; gap: 2px; }
.sea-stat strong { color: var(--green-deep); font: 600 22px var(--mono); line-height: 1; }
.sea-stat small { color: var(--muted); font: 9px var(--mono); }
.sea-chip { padding: 5px 10px; border-radius: 999px; font: 9px var(--mono); }
.sea-chip.is-good { color: var(--green); background: var(--green-light); }
.sea-chip.is-fair { color: #7a5b1e; background: #f2ead3; }
.sea-chip.is-rough { color: #fffdf7; background: #b84638; }
.sea-verdict { margin: 0 2px; color: #586256; font-size: 12px; line-height: 1.6; }
.sea-days { display: grid; gap: 6px; }
.sea-days-heading { margin: 4px 2px 2px; color: var(--green); font: 9px var(--mono); }
.sea-day { display: grid; grid-template-columns: 62px minmax(0, 1fr) minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 5px; background: rgba(255,254,248,.83); }
.sea-day-label { color: var(--green-deep); font: 600 11px var(--mono); }
.sea-day-value { color: #46523f; font-size: 11px; }
.sea-source { margin: 2px; color: var(--muted); font-size: 10px; }
.sea-source a { color: var(--green); }
@media (max-width: 620px) {
  .sea-day { grid-template-columns: 56px minmax(0, 1fr); row-gap: 4px; }
  .sea-day .sea-chip { grid-column: 2; justify-self: start; }
}

/* Weather desk: outdoor brief */
.brief-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; margin: 18px 0 0; }
.brief-item { display: flex; min-width: 0; flex-direction: column; gap: 3px; padding: 13px 15px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,254,248,.83); }
.brief-item small { color: var(--muted); font: 9px var(--mono); }
.brief-item strong { color: var(--green-deep); font-size: 17px; font-weight: 600; }
.brief-word { margin-top: 2px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.brief-word.is-good { color: #3e7a48; }
.brief-word.is-fair { color: #7a5b1e; }
.brief-word.is-poor { color: #b84638; }
@media (max-width: 720px) {
  .brief-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Farm desk: sea & fishing */
.sea-best { margin: 0 2px; color: var(--green-deep); font-size: 12px; font-weight: 600; }
.sea-day-farm { display: grid; grid-template-columns: 56px minmax(0, 1fr) minmax(0, .9fr) auto; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 5px; background: rgba(255,254,248,.83); }
.sea-day-farm .sea-day-moon { color: var(--muted); font: 9px var(--mono); }
@media (max-width: 620px) {
  .sea-day-farm { grid-template-columns: 52px minmax(0, 1fr) auto; row-gap: 4px; }
  .sea-day-farm .sea-day-moon { grid-column: 2; }
}

/* Farm desk: reef watch */
.reef-body { display: grid; gap: 6px; margin: 10px 0; }
.reef-row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 5px; background: rgba(255,254,248,.83); }
.reef-row small { color: var(--muted); font: 9px var(--mono); }
.reef-row strong { min-width: 0; font-size: 12.5px; font-weight: 600; text-align: right; }
.farm-chip.is-warning { color: #7a5b1e; background: #f2ead3; }
.farm-chip.is-alert { color: var(--white); background: #b84638; }

/* Phone alerts (safety desk) */
.alert-setup { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 22px; margin: 20px 0 0; padding: 16px 18px; border: 1px solid #cadbd8; border-radius: 8px; background: linear-gradient(112deg, #f5f8f1 0%, #eaf3f1 100%); }
.alert-setup-copy { min-width: 0; flex: 1 1 320px; }
.alert-setup-copy .eyebrow { margin-bottom: 4px; }
.alert-setup-text { margin: 0; color: #46523f; font-size: 12.5px; line-height: 1.6; }
.alert-setup-note { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.alert-setup-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.alert-button { padding: 10px 16px; color: #fffdf6; border: 1px solid var(--green-deep); border-radius: 6px; background: var(--green-deep); font: 600 11px var(--mono); cursor: pointer; transition: background .18s ease, transform .18s ease; }
.alert-button:hover { transform: translateY(-1px); background: var(--green); }
.alert-button.is-ghost { color: var(--green-deep); background: transparent; }
.alert-button.is-ghost:hover { background: rgba(25,61,45,.08); }

/* MAF reader page (/go/maf) */
.reader-shell { background: radial-gradient(ellipse at 82% 4%, rgba(217,232,141,.19), transparent 29%), var(--paper); }
.reader-main { padding-bottom: 24px; }
.reader-crumbs { display: flex; flex-wrap: wrap; align-items: baseline; gap: 7px; padding: 24px 0 0; color: var(--muted); font: 9px var(--mono); }
.reader-crumbs a { color: var(--green); text-decoration: none; }
.reader-crumbs a:hover { text-decoration: underline; text-underline-offset: 3px; }
.reader-crumb-sep { color: #b3b7a6; }
.reader-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 26px; padding: 12px 0 22px; }
.reader-head-copy { min-width: 0; }
.reader-head h1 { max-width: 760px; margin: 0; font-size: 38px; }
.reader-source { margin: 11px 0 0; color: var(--green); font: 10px var(--mono); overflow-wrap: anywhere; }
.reader-stamp { margin: 6px 0 0; color: var(--muted); font: 9px var(--mono); line-height: 1.6; }
.reader-actions { display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: 8px; }
.reader-action { display: inline-flex; align-items: center; gap: 6px; min-height: 38px; padding: 0 14px; color: var(--green); border: 1px solid #cdd8c8; border-radius: 6px; background: #eef3e8; font-size: 11px; font-weight: 600; text-decoration: none; cursor: pointer; transition: background .18s ease, border-color .18s ease, transform .18s ease; }
.reader-action:hover { transform: translateY(-1px); border-color: #93aa8e; background: #e3edda; }
.reader-action.is-primary { color: #f6f8ea; border-color: transparent; background: var(--green-deep); }
.reader-action.is-primary:hover { background: #214a37; }
.reader-action-mark { font-size: 10px; }
.reader-layout { display: grid; grid-template-columns: minmax(0, 760px); justify-content: center; padding-top: 10px; }
.reader-layout.has-toc { grid-template-columns: 216px minmax(0, 750px); gap: 36px; }
.reader-toc { position: sticky; top: 16px; padding: 14px 15px 8px; border: 1px solid var(--line); border-radius: 7px; background: rgba(255,254,248,.85); }
.reader-toc[hidden] { display: none; }
.reader-toc-label { margin: 0 0 7px; color: var(--green); font: 8px var(--mono); }
.reader-toc ul { margin: 0; padding: 0; list-style: none; }
.reader-toc li { border-bottom: 1px solid #edede3; }
.reader-toc li:last-child { border-bottom: 0; }
.reader-toc a { display: block; padding: 6px 0; color: #4c5849; font-size: 11px; line-height: 1.4; text-decoration: none; }
.reader-toc a:hover { color: var(--green-deep); text-decoration: underline; text-underline-offset: 3px; }
.reader-toc li.is-sub a { padding-left: 11px; color: var(--muted); font-size: 10px; }
.reader-body { min-width: 0; }
.reader-article { min-width: 0; color: #31392f; font-size: 15.5px; line-height: 1.72; }
.reader-article > :first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.reader-article h2 { margin: 36px 0 10px; padding-top: 21px; border-top: 1px solid var(--line); font-size: 23px; font-weight: 600; line-height: 1.28; }
.reader-article h3 { margin: 26px 0 8px; font-size: 17.5px; font-weight: 600; line-height: 1.35; }
.reader-article h4 { margin: 20px 0 6px; font-size: 15px; font-weight: 600; }
.reader-article p { margin: 0 0 14px; }
.reader-article ul, .reader-article ol { margin: 0 0 14px; padding-left: 1.3em; }
.reader-article li { margin: 5px 0; }
.reader-article a { color: var(--green); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.reader-article a:hover { color: var(--green-deep); }
.reader-article img { display: block; max-width: 100%; max-height: 72vh; margin: 14px auto; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.reader-article figure { margin: 18px 0; }
.reader-article figcaption { margin-top: 7px; color: var(--muted); font: 9px var(--mono); text-align: center; }
.reader-article blockquote { margin: 16px 0; padding: 11px 16px; border-left: 3px solid #9bb78c; background: #f7f7ec; color: #4c5849; }
.reader-article hr { margin: 26px 0; border: 0; border-top: 1px solid var(--line); }
.reader-article pre { margin: 0 0 14px; padding: 12px 14px; overflow: auto; border-radius: 5px; background: #f1f2e6; font: 11px var(--mono); }
.reader-article code { padding: 1px 4px; border-radius: 3px; background: #f1f2e6; font-family: var(--mono); font-size: .92em; }
.reader-article pre code { padding: 0; background: none; }
.reader-file-link { display: inline-flex; align-items: center; gap: 5px; margin: 2px 0; padding: 7px 12px; color: var(--green) !important; border: 1px solid #cdd8c8; border-radius: 5px; background: #eef3e8; font: 600 9.5px var(--mono); letter-spacing: .04em; text-transform: uppercase; text-decoration: none !important; }
.reader-file-link:hover { border-color: #93aa8e; background: #e3edda; }
.reader-table-wrap { max-width: 100%; margin: 0 0 16px; overflow-x: auto; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.reader-article table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.reader-article th, .reader-article td { padding: 8px 12px; border-bottom: 1px solid #eef0e4; border-right: 1px solid #f2f4ea; text-align: left; vertical-align: top; }
.reader-article thead th { background: #f4f7ee; color: var(--green-deep); font: 600 10px var(--mono); }
.reader-note { display: grid; grid-template-columns: 24px 1fr; align-items: start; gap: 11px; margin-top: 28px; padding: 13px 15px; border: 1px solid #e4d8bc; border-radius: 5px; background: #f8f1df; }
.reader-note p { margin: 0; color: #655942; font-size: 10px; line-height: 1.6; }
.reader-note strong { color: #473d2b; }
.reader-note a { color: #805226; }
.reader-skeleton { display: grid; gap: 13px; padding: 6px 0; }
.reader-skeleton span { display: block; height: 12px; border-radius: 4px; background: linear-gradient(90deg, #ecebdd 25%, #f6f5ea 37%, #ecebdd 63%); background-size: 400% 100%; animation: reader-shimmer 1.5s ease infinite; }
.reader-skeleton span.is-title { width: 42%; height: 22px; }
.reader-skeleton span.is-short { width: 62%; }
.reader-skeleton span.is-mid { width: 78%; }
@keyframes reader-shimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }
.reader-error { display: grid; gap: 11px; padding: 18px; border: 1px solid #e0c9b8; border-radius: 6px; background: #f9f2ea; }
.reader-error h2 { margin: 0; padding: 0; border: 0; font-size: 16px; }
.reader-error p { margin: 0; color: #6b5b4c; font-size: 12.5px; }
.reader-error a { color: #805226; }
.reader-error-actions { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 1000px) {
  .reader-head { align-items: flex-start; flex-direction: column; gap: 15px; }
  .reader-layout.has-toc { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .reader-toc { position: static; }
}
@media (max-width: 620px) {
  .reader-head h1 { font-size: 29px; }
  .reader-article { font-size: 14.5px; }
  .reader-article h2 { font-size: 20px; }
  .reader-article h3 { font-size: 16px; }
  .reader-toc { padding: 12px 13px 10px; }
  .reader-toc ul { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: thin; }
  .reader-toc li { flex: 0 0 auto; border-bottom: 0; }
  .reader-toc li.is-sub a { padding-left: 10px; }
  .reader-toc a { padding: 6px 10px; border: 1px solid #dbe0d3; border-radius: 999px; background: #fff; white-space: nowrap; }
}
.reader-data-intro { margin: 0 0 22px; padding: 14px 16px; border: 1px solid #cadbd8; border-radius: 7px; background: linear-gradient(112deg, #f5f8f1 0%, #eaf3f1 100%); }
.reader-data-intro p { margin: 0; color: #46523f; font-size: 12.5px; line-height: 1.6; }
.reader-data-intro .reader-data-note { margin: 5px 0 0; }
.reader-data-note { margin: -6px 0 14px; color: var(--muted); font: 9px var(--mono); }
.reader-article .data-rownum { color: #898b7e; font: 9px var(--mono); text-align: right; }

/* Calendar export buttons (flights & cruise rows) */
.flight-actions { display: flex; align-items: center; gap: 8px; justify-self: end; }
.cal-button { display: inline-grid; place-items: center; width: 30px; height: 30px; padding: 0; color: var(--green); border: 1px solid var(--line); border-radius: 6px; background: rgba(255,254,248,.7); cursor: pointer; transition: background .18s ease, border-color .18s ease, transform .18s ease; }
.cal-button:hover { transform: translateY(-1px); border-color: #a7b99f; background: #fff; }
.cal-button svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
@media (max-width: 620px) {
  .flight-actions { grid-column: 2; justify-self: start; flex-wrap: wrap; }
}

/* Tenders desk */
.tender-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 12px; }
.tender-search { flex: 1 1 240px; min-width: 200px; }
.tender-search input { width: 100%; padding: 10px 12px; color: var(--ink); border: 1px solid var(--line); border-radius: 6px; background: rgba(255,254,248,.9); font-size: 12px; }
.tender-search input:focus { outline: 2px solid #a7b99f; outline-offset: 1px; }
.tender-select { display: inline-flex; align-items: center; gap: 6px; min-width: 0; max-width: 100%; color: var(--muted); font: 9px var(--mono); }
.tender-select select { flex: 1 1 auto; min-width: 0; max-width: 100%; padding: 9px 10px; color: var(--ink); border: 1px solid var(--line); border-radius: 6px; background: rgba(255,254,248,.9); font-size: 11px; }
.tender-toggle { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font: 9px var(--mono); cursor: pointer; }
.tender-sourcebars { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; }
.tender-chip { padding: 6px 11px; color: #44614b; border: 1px solid #d4ddce; border-radius: 999px; background: #f0f5e9; font: 9px var(--mono); cursor: pointer; }
.tender-chip:hover { border-color: #a7b99f; }
.tender-chip.is-active { color: var(--white); border-color: var(--green-deep); background: var(--green-deep); }
.tender-list { display: grid; gap: 10px; }
.tender-card { padding: 15px 17px 13px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,254,248,.85); }
.tender-card.is-soon { border-color: #d9b26a; }
.tender-card.is-closed { opacity: .66; }
.tender-card-top { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-bottom: 6px; }
.tender-source-badge { padding: 3px 8px; color: var(--white); border-radius: 4px; background: var(--green-deep); font: 8px var(--mono); letter-spacing: .5px; }
.tender-source-badge.is-swa { background: #2a6b6b; }
.tender-source-badge.is-moh { background: #8a5a24; }
.tender-source-badge.is-mnre { background: #4a6b2a; }
.tender-agency { color: #586256; font-size: 10px; }
.tender-close-chip { margin-left: auto; padding: 4px 9px; border-radius: 999px; font: 8px var(--mono); white-space: nowrap; }
.tender-close-chip.is-open { color: #44614b; border: 1px solid #d4ddce; background: #f0f5e9; }
.tender-close-chip.is-soon { color: #7a5a18; border: 1px solid #e4d8bc; background: #f8f1df; }
.tender-close-chip.is-closed, .tender-close-chip.is-unknown { color: #6c6c60; border: 1px solid #e0e0d4; background: #f2f2ea; }
.tender-close-chip.is-unknown { border-style: dashed; background: transparent; }
.tender-title { margin: 0 0 6px; font-size: 16px; font-weight: 600; line-height: 1.35; }
.tender-closing { margin: 0 0 8px; color: #586256; font-size: 11px; }
.tender-closing strong { color: var(--green-deep); }
.tender-closing-raw { color: #898b7e; font-size: 9px; }
.tender-doc-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; }
.tender-doc-link { padding: 5px 9px; color: var(--green); border: 1px solid #cdd8c8; border-radius: 5px; background: #f7f8f1; font-size: 10px; font-weight: 600; text-decoration: none; }
.tender-doc-link:hover { border-color: #a7b99f; background: #eef3e8; text-decoration: underline; text-underline-offset: 2px; }
.tender-contact-row { display: flex; flex-wrap: wrap; gap: 10px; padding-top: 8px; border-top: 1px solid #eef0e4; }
.tender-contact-name { color: #687064; font-size: 10px; }
.tender-contact-link { color: var(--green); font-size: 10px; font-weight: 600; text-decoration: none; }
.tender-contact-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.tender-card-footnote { margin: 8px 0 0; color: #898b7e; font: 8px var(--mono); }
.tender-empty { display: grid; gap: 8px; justify-items: start; padding: 20px; border: 1px dashed #cdd8c8; border-radius: 8px; background: rgba(255,254,248,.6); }
.tender-empty strong { font-size: 14px; }
.tender-empty p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.tender-dept-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.tender-dept-card { display: flex; flex-direction: column; padding: 15px 16px 13px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,254,248,.83); }
.tender-dept-head { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 6px; }
.tender-dept-name { flex: 1; min-width: 0; margin: 0; font-size: 13px; font-weight: 600; line-height: 1.35; }
.tender-dept-status { flex: 0 0 auto; padding: 3px 8px; color: #44614b; border: 1px solid #d4ddce; border-radius: 999px; background: #f0f5e9; font: 8px var(--mono); white-space: nowrap; }
.tender-dept-status.is-error { color: #8a3d2a; border-color: #e4c4b8; background: #f9ece6; }
.tender-dept-note { margin: 0 0 8px; color: var(--muted); font-size: 10px; line-height: 1.55; }
.tender-dept-error { margin: 0 0 8px; padding: 7px 9px; color: #7a4a34; border: 1px solid #e4c4b8; border-radius: 5px; background: #f9ece6; font-size: 10px; line-height: 1.5; }
.tender-dept-items { display: grid; gap: 7px; margin: 0 0 10px; padding: 0; list-style: none; }
.tender-dept-item { display: grid; gap: 2px; padding-bottom: 7px; border-bottom: 1px solid #f2f4ea; }
.tender-dept-item:last-child { border-bottom: 0; padding-bottom: 0; }
.tender-dept-link { color: var(--green); font-size: 11px; font-weight: 600; line-height: 1.45; text-decoration: none; }
.tender-dept-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.tender-dept-title { font-size: 11px; font-weight: 600; }
.tender-dept-meta { color: #898b7e; font-size: 9px; }
.tender-dept-empty { margin: 0 0 10px; color: var(--muted); font-size: 10px; }
.tender-dept-foot { margin-top: auto; padding-top: 9px; border-top: 1px solid #e7e8dc; }
@media (max-width: 850px) { .tender-dept-grid { grid-template-columns: 1fr; } }
@media (max-width: 620px) { .tender-close-chip { margin-left: 0; } .tender-controls { gap: 8px; } .tender-dept-grid { gap: 10px; } .tender-select { flex: 1 1 100%; } }

/* Dark mode — follows the device preference. The core palette flips here;
   light accent chips and callout boxes stay light on purpose so they keep
   reading as badges on any background. */
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --ink: #e6ecdc;
    --muted: #98a290;
    --green: #a7cd96;
    --paper: #12170f;
    --line: #2d3728;
    --amber: #d99a63;
  }
  .app-shell, .maf-shell, .farm-shell, .map-shell, .safety-shell, .flights-shell, .reader-shell { background: radial-gradient(ellipse at 78% 6%, rgba(217,232,141,.08), transparent 33%), var(--paper); }
  .icon-button, .advice-panel, .resource-card, .nearest-card, .map-panel-note, .place-item,
  .map-source-note, .trip-stat, .trip-day, .pulse-card, .home-card, .farm-panel,
  .window-reason, .ship-ferry-card, .ship-call, .ship-port-card, .flight-row, .flight-empty,
  .safety-card, .quake-row, .sea-now, .sea-day, .brief-item, .sea-day-farm, .reef-row,
  .reader-toc, .cal-button { background: #1b2318; }
  .icon-button:hover, .cal-button:hover { background: #232d1e; }
  .maf-nav-link, .news-nav-link, .map-nav-link, .flights-nav-link, .shipping-nav-link, .farm-nav-link, .weather-nav-link, .banks-nav-link, .jobs-nav-link { border-color: #303b2a; background: #1c2518; }
  .maf-nav-link:hover, .news-nav-link:hover, .map-nav-link:hover, .flights-nav-link:hover, .shipping-nav-link:hover, .farm-nav-link:hover, .weather-nav-link:hover, .banks-nav-link:hover, .jobs-nav-link:hover { border-color: #465840; background: #243018; }
  .location-select-wrap { border-color: #303b2a; background: linear-gradient(115deg, #1c2518 0%, #182115 100%); box-shadow: none; }
  .location-icon { background: #26331f; }
  .home-search-box, .home-search-results, .week-table-wrap { background: #1b2318; border-color: var(--line); }
  .home-search-group + .home-search-group, .home-news-item + .home-news-item { border-top-color: #263029; }
  .home-search-item:hover, .home-search-item:focus-visible, .nearby-row:hover { background: #212b1a; }
  .resource-filters { background: #1a2116; }
  .load-more-button, .resource-data-toggle, .reader-action, .reader-file-link { border-color: #33402c; background: #20291b; }
  .load-more-button:hover, .resource-data-toggle:hover, .reader-action:hover, .reader-file-link:hover { border-color: #46583d; background: #28351f; }
  .resource-data-panel, .data-table-wrap, .ship-fare-block, .ship-schedule-cta { border-color: #2c3627; background: #1a2217; }
  .ship-schedule-link { border-color: #2c3627; background: #17200f; }
  .data-sheet-tabs button { color: var(--muted); border-color: #303b2a; background: #1d251a; }
  .data-table thead th { background: #26331f; color: #bfe0b2; }
  .data-table .data-rownum { background: #20291b; color: var(--muted); }
  .data-table th, .data-table td, .ship-fare-table th, .ship-fare-table td { border-color: #263029; }
  .price-row:nth-child(odd), .tide-row:nth-child(odd), .spotlight-row, .fuel-row:nth-child(odd) { background: #1a2217; }
  .observation-panel, .tide-next-card { border-color: #2e3b36; background: linear-gradient(112deg, #1b2320 0%, #16201e 100%); }
  .station-metrics { border-top-color: rgba(127,179,182,.25); }
  .station-metrics small { color: #8fa39c; }
  .station-metrics strong { color: #cfe4de; }
  .observation-heading .eyebrow { color: #7fb3b6; }
  .observation-icon { color: #7fb3b6; background: #20302c; }
  .station-code { color: #7f938c; }
  .alert-setup { border-color: #2e3b36; background: linear-gradient(112deg, #18211c 0%, #141e1b 100%); }
  .alert-setup-text { color: #c3ccb8; }
  .trip-panel { border-color: #4a3d22; background: linear-gradient(112deg, #241f12 0%, #201b10 100%); }
  .trip-close { color: #d8b57f; border-color: #5d4c2a; }
  .trip-close:hover { border-color: #7a6236; background: #2c2617; }
  .trip-stat.is-ferry { border-color: #5d4c2a; background: #26200f; }
  .trip-day.is-best { border-color: #4a5f42; background: #1e2a18; }
  .ship-call.is-next { border-color: #4a5f42; background: linear-gradient(112deg, #1f2a1a 0%, #1a2416 100%); }
  .tender-search input, .tender-select select { color: #dbe2d0; border-color: #33402c; background: #1f281b; }
  .tender-card, .tender-dept-card { border-color: #2c3627; background: #1a2217; }
  .tender-card.is-soon { border-color: #5d4c2a; }
  .tender-title { color: #e2e8d6; }
  .tender-agency, .tender-contact-name { color: #9aa590; }
  .tender-closing { color: #b3bda8; }
  .tender-closing-raw, .tender-card-footnote, .tender-dept-meta { color: #7f8a76; }
  .tender-closing strong { color: #b9d1ac; }
  .tender-chip { color: #b9d1ac; border-color: #3a4a32; background: #1f281b; }
  .tender-chip:hover { border-color: #55684a; }
  .tender-chip.is-active { color: #d6e6cc; border-color: #35664a; background: #26503a; }
  .tender-doc-link { color: #b9d1ac; border-color: #33402c; background: #1f281b; }
  .tender-doc-link:hover { border-color: #465840; background: #26331f; }
  .tender-contact-row { border-top-color: #262f1f; }
  .tender-contact-link, .tender-dept-link { color: #b9d1ac; }
  .tender-close-chip.is-open { color: #b9d1ac; border-color: #3a4a32; background: #1f281b; }
  .tender-close-chip.is-soon { color: #d8b57f; border-color: #5d4c2a; background: #26200f; }
  .tender-close-chip.is-closed, .tender-close-chip.is-unknown { color: #8f9a86; border-color: #33402c; background: #1c251a; }
  .tender-dept-status { color: #b9d1ac; border-color: #3a4a32; background: #1f281b; }
  .tender-dept-status.is-error, .tender-dept-error { color: #e0b49e; border-color: #5d3a2a; background: #2a1c14; }
  .tender-dept-note, .tender-dept-empty { color: #9aa590; }
  .tender-dept-item { border-bottom-color: #262f1f; }
  .tender-dept-foot { border-top-color: #2c3627; }
  .tender-empty { border-color: #33402c; background: #1a2217; }
  .tenders-nav-link:hover { border-color: #465840; background: #243018; }
  .ship-ferry-foot { border-top-color: #2c3627; }
  .advice-item, .hour-item, .week-row { border-color: #262f1f; }
  .reader-article { color: #d6ddca; }
  .reader-article blockquote { color: #c4cdb7; background: #1e2618; }
  .reader-article pre, .reader-article code { background: #1d2417; }
  .reader-table-wrap { border-color: #2c3627; background: #1a2217; }
  .reader-article th, .reader-article td { border-color: #263029; }
  .reader-article thead th { background: #26331f; color: #bfe0b2; }
  .reader-skeleton span { background: linear-gradient(90deg, #232b1d 25%, #2c3527 37%, #232b1d 63%); background-size: 400% 100%; }
  .brand, .resource-filter:hover, .home-link:hover, .place-plan:hover, .price-value, .ship-fare-value,
  .flight-time strong, .sea-stat strong, .sea-day-label, .brief-item strong, .sea-best,
  .alert-button.is-ghost, .reader-toc a:hover, .reader-article a:hover { color: var(--green); }
  .alert-button, .reader-action.is-primary, .ship-chip-next { border-color: #35664a; background: #26503a; }
  .alert-button:hover { background: #2e5f45; }
  .quake-map, .leaflet-container { background: #10150d; }
  .leaflet-popup-content-wrapper, .leaflet-popup-tip { background: #1f281b; color: #dbe2d0; }
  .leaflet-bar a { color: #dbe2d0; border-color: #33402c; background: #1f281b; }
  .leaflet-bar a:hover { background: #26331f; }
  .leaflet-control-attribution { background: rgba(16,21,13,.82); color: #9aa590; }
  .leaflet-control-attribution a { color: #b9d1ac; }
}

/* CBS data — economy card & rates chart (landing), securities tenders (tenders desk) */
.home-chart { display: block; width: 100%; height: auto; margin: 4px 0 0; }
.home-chart text { fill: var(--muted); font: 8px var(--mono); }
.home-chart-grid { stroke: var(--line); stroke-width: .7; }
.home-chart-line { fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.home-chart-line.is-usd { stroke: #2c6e49; }
.home-chart-line.is-nzd { stroke: var(--amber); }
.home-chart-line.is-aud { stroke: #3d7a8a; }
.home-chart-legend { display: flex; flex-wrap: wrap; gap: 10px; }
.home-chart-key { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font: 9px var(--mono); }
.home-chart-key::before { width: 9px; height: 3px; border-radius: 2px; background: currentColor; content: ''; }
.home-chart-key.is-usd::before { background: #2c6e49; }
.home-chart-key.is-nzd::before { background: var(--amber); }
.home-chart-key.is-aud::before { background: #3d7a8a; }
.securities-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.securities-col { display: flex; flex-direction: column; padding: 15px 16px 13px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,254,248,.83); }
.securities-head { margin: 0 0 3px; font-size: 13px; font-weight: 600; }
.securities-sub { margin: 0 0 9px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.securities-list { display: grid; gap: 7px; margin: 0 0 10px; padding: 0; list-style: none; }
.securities-item { display: flex; align-items: baseline; gap: 8px; padding-bottom: 7px; border-bottom: 1px solid #f2f4ea; }
.securities-item:last-child { border-bottom: 0; padding-bottom: 0; }
.securities-num { color: var(--green-deep); font: 10px var(--mono); white-space: nowrap; }
.securities-date { color: var(--muted); font-size: 10px; }
.securities-item .tender-doc-link { margin-left: auto; }
@media (max-width: 850px) { .securities-grid { grid-template-columns: 1fr; } }
@media (prefers-color-scheme: dark) {
  .home-chart-line.is-usd { stroke: #93c083; }
  .home-chart-key.is-usd::before { background: #93c083; }
  .home-chart-line.is-aud { stroke: #7fb3b6; }
  .home-chart-key.is-aud::before { background: #7fb3b6; }
  .securities-col { background: #1b2318; }
  .securities-item { border-bottom-color: #263029; }
  .securities-num { color: var(--green); }
}

/* Banks desk */
.bx-caption { margin: 0 0 10px; color: var(--muted); font: 10px var(--mono); text-transform: uppercase; letter-spacing: .04em; }
.bx-note { margin: 6px 0 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.bx-note a { color: var(--green-deep); }
.bx-table-wrap { overflow-x: auto; margin: 0 0 10px; }
.bx-table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 11.5px; background: rgba(255,254,248,.85); }
.bx-table th { padding: 8px 10px; border-bottom: 1px solid var(--line); color: var(--muted); font: 9px var(--mono); letter-spacing: .08em; text-transform: uppercase; text-align: left; white-space: nowrap; }
.bx-table td { padding: 7px 10px; border-bottom: 1px solid #f2f4ea; }
.bx-table tbody tr:last-child td { border-bottom: 0; }
.bx-table .bx-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.bx-table .is-mid { color: var(--muted); }
.bx-th-name { white-space: normal; }
.bx-code { color: var(--muted); font: 9px var(--mono); }
.bx-rate-link { color: var(--green-deep); font-weight: 600; text-decoration: none; border-bottom: 1px dotted rgba(25,61,45,.45); }
.bx-muted { color: #b9bcae; }
.bx-chip { display: inline-block; max-width: 190px; padding: 2px 8px; border-radius: 999px; background: var(--green-light); color: var(--green-deep); font: 9px var(--mono); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: 1px; }
.bx-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 4px; }
.bx-card { display: flex; flex-direction: column; padding: 15px 16px 13px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,254,248,.85); }
.bx-card-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 3px; }
.bx-card-name { font-size: 13px; font-weight: 600; }
.bx-card-link { color: var(--green-deep); font: 9px var(--mono); text-decoration: none; }
.bx-card-sub { margin: 0 0 9px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.bx-rate-list { display: grid; }
.bx-rate-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px solid #f2f4ea; }
.bx-rate-row:last-child { border-bottom: 0; }
.bx-rate-label { min-width: 0; }
.bx-rate-label span { display: block; font-size: 11px; }
.bx-rate-label small { display: block; margin-top: 2px; color: var(--muted); font-size: 9px; line-height: 1.4; }
.bx-rate-value { font-size: 11.5px; color: var(--green-deep); text-align: right; overflow-wrap: anywhere; }
.bx-details { margin: 4px 0 0; }
.bx-details summary { padding: 4px 0; color: var(--green-deep); font: 10px var(--mono); cursor: pointer; }
.bx-fee-list { display: grid; margin-top: 4px; }
.bx-fee-section { margin: 10px 0 2px; color: var(--green-deep); font: 9px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.bx-fee-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 6px 0; border-bottom: 1px solid #f2f4ea; }
.bx-fee-row:last-child { border-bottom: 0; }
.bx-fee-label span { display: block; font-size: 11px; }
.bx-fee-label small { display: block; margin-top: 2px; color: var(--muted); font-size: 9px; line-height: 1.45; }
.bx-fee-amount { white-space: nowrap; font-size: 11px; color: var(--green-deep); }
.bx-doc-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.bx-doc-chip { padding: 4px 9px; border: 1px solid var(--line); border-radius: 999px; color: var(--green-deep); font: 9px var(--mono); text-decoration: none; background: rgba(255,254,248,.6); }
.bx-banner { margin: 0 0 12px; padding: 10px 13px; border: 1px solid var(--line); border-radius: 8px; background: rgba(227,237,218,.55); font-size: 11px; line-height: 1.6; }
.bx-banner.is-warning { border-color: #d9b26a; background: rgba(217,178,106,.14); }
.bx-banner a { color: var(--green-deep); font-weight: 600; }
.bx-sources { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 18px; }
.bx-source-chip { padding: 4px 9px; border-radius: 999px; background: var(--green-light); color: var(--green-deep); font: 9px var(--mono); }
.bx-source-chip.is-due { background: #f3e3cf; color: #8a5a24; }
@media (max-width: 850px) { .bx-cards { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-color-scheme: dark) {
  .bx-table { background: #1b2318; }
  .bx-table td { border-bottom-color: #263029; }
  .bx-card { border-color: #2c3627; background: #1a2217; }
  .bx-card-link, .bx-rate-value, .bx-fee-amount, .bx-rate-link { color: #b9d3a6; }
  .bx-rate-row, .bx-fee-row { border-bottom-color: #263029; }
  .bx-chip { background: #26331f; color: #cfe3bd; }
  .bx-doc-chip { border-color: #2c3627; background: #1b2318; color: #cfe3bd; }
  .bx-banner { border-color: #2c3627; background: #1e2818; }
  .bx-source-chip { background: #26331f; color: #cfe3bd; }
  .bx-source-chip.is-due { background: #3a2f1c; color: #e5c288; }
  .bx-muted { color: #6d7666; }
  .bx-details summary { color: #b9d3a6; }
  .bx-fee-section { color: #9fb68f; }
  .bx-note a { color: #b9d3a6; }
}

/* Jobs desk */
.job-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 12px; }
.job-search { flex: 1 1 240px; min-width: 200px; }
.job-search input { width: 100%; padding: 10px 12px; color: var(--ink); border: 1px solid var(--line); border-radius: 6px; background: rgba(255,254,248,.9); font-size: 12px; }
.job-search input:focus { outline: 2px solid #a7b99f; outline-offset: 1px; }
.job-select { display: inline-flex; align-items: center; gap: 6px; min-width: 0; max-width: 100%; color: var(--muted); font: 9px var(--mono); }
.job-select select { flex: 1 1 auto; min-width: 0; max-width: 100%; padding: 9px 10px; color: var(--ink); border: 1px solid var(--line); border-radius: 6px; background: rgba(255,254,248,.9); font-size: 11px; }
.job-toggle { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font: 9px var(--mono); cursor: pointer; }
.job-sourcebars { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; }
.job-chip { padding: 6px 11px; color: #44614b; border: 1px solid #d4ddce; border-radius: 999px; background: #f0f5e9; font: 9px var(--mono); cursor: pointer; }
.job-chip:hover { border-color: #a7b99f; }
.job-chip.is-active { color: var(--white); border-color: var(--green-deep); background: var(--green-deep); }
.job-list { display: grid; gap: 10px; }
.job-card { padding: 15px 17px 13px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,254,248,.85); }
.job-card.is-soon { border-color: #d9b26a; }
.job-card.is-closed { opacity: .66; }
.job-card-top { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-bottom: 6px; }
.job-source-badge { padding: 3px 8px; color: var(--white); border-radius: 4px; background: var(--green-deep); font: 8px var(--mono); letter-spacing: .5px; }
.job-source-badge.is-psc-contract, .job-source-badge.is-psc-special { background: #2a6b6b; }
.job-source-badge.is-mpe { background: #8a5a24; }
.job-source-badge.is-mnre { background: #4a6b2a; }
.job-source-badge.is-mof { background: #255881; }
.job-source-badge.is-swa { background: #355f7a; }
.job-source-badge.is-sgn { background: #6b6b5a; }
.job-source-badge.is-myjobs { background: #6a5a8a; }
.job-sector-chip { padding: 3px 8px; color: #44614b; border: 1px solid #d4ddce; border-radius: 999px; background: #f0f5e9; font: 8px var(--mono); }
.job-close-chip { margin-left: auto; padding: 4px 9px; border-radius: 999px; font: 8px var(--mono); white-space: nowrap; }
.job-close-chip.is-open { color: #44614b; border: 1px solid #d4ddce; background: #f0f5e9; }
.job-close-chip.is-soon { color: #7a5a18; border: 1px solid #e4d8bc; background: #f8f1df; }
.job-close-chip.is-closed { color: #6c6c60; border: 1px solid #e0e0d4; background: #f2f2ea; }
.job-close-chip.is-ad { color: #586256; border: 1px dashed #cdd8c8; background: transparent; }
.job-title { margin: 0 0 6px; font-size: 16px; font-weight: 600; line-height: 1.35; }
.job-employer { margin: 0 0 6px; color: #586256; font-size: 11px; }
.job-employer strong { color: var(--green-deep); }
.job-meta { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; }
.job-meta-bit { padding: 4px 9px; color: #586256; border: 1px solid #e3e7d9; border-radius: 5px; background: #f7f8f1; font-size: 10px; }
.job-closing { margin: 0 0 8px; color: #586256; font-size: 11px; }
.job-closing strong { color: var(--green-deep); }
.job-closing-raw { color: #898b7e; font-size: 9px; }
.job-doc-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; }
.job-doc-link { padding: 5px 9px; color: var(--green); border: 1px solid #cdd8c8; border-radius: 5px; background: #f7f8f1; font-size: 10px; font-weight: 600; text-decoration: none; }
.job-doc-link:hover { border-color: #a7b99f; background: #eef3e8; text-decoration: underline; text-underline-offset: 2px; }
.job-details { margin: 0 0 9px; border: 1px solid #eef0e4; border-radius: 6px; background: #fbfbf4; }
.job-details summary { padding: 7px 10px; color: var(--green); font: 9px var(--mono); cursor: pointer; }
.job-details p { margin: 0; padding: 0 10px 10px; color: #4c554a; font-size: 11px; line-height: 1.6; white-space: pre-line; }
.job-actions { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 8px; border-top: 1px solid #eef0e4; }
.job-apply-link { padding: 7px 12px; color: var(--white); border-radius: 5px; background: var(--green-deep); font-size: 10px; font-weight: 600; text-decoration: none; }
.job-apply-link:hover { background: var(--green); }
.job-source-link { padding: 7px 12px; color: var(--green); border: 1px solid #cdd8c8; border-radius: 5px; background: #f7f8f1; font-size: 10px; font-weight: 600; text-decoration: none; }
.job-source-link:hover { border-color: #a7b99f; }
.job-card-footnote { margin: 8px 0 0; color: #898b7e; font: 8px var(--mono); }
.job-empty { display: grid; gap: 8px; justify-items: start; padding: 20px; border: 1px dashed #cdd8c8; border-radius: 8px; background: rgba(255,254,248,.6); }
.job-empty strong { font-size: 14px; }
.job-empty p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.job-source-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.job-source-card { display: flex; flex-direction: column; padding: 15px 16px 13px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,254,248,.83); }
.job-source-head { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 6px; }
.job-source-name { flex: 1; min-width: 0; margin: 0; font-size: 13px; font-weight: 600; line-height: 1.35; }
.job-source-status { flex: 0 0 auto; padding: 3px 8px; color: #44614b; border: 1px solid #d4ddce; border-radius: 999px; background: #f0f5e9; font: 8px var(--mono); white-space: nowrap; }
.job-source-status.is-error { color: #8a3d2a; border-color: #e4c4b8; background: #f9ece6; }
.job-source-note { margin: 0 0 8px; color: var(--muted); font-size: 10px; line-height: 1.55; }
.job-source-error { margin: 0 0 8px; padding: 7px 9px; color: #7a4a34; border: 1px solid #e4c4b8; border-radius: 5px; background: #f9ece6; font-size: 10px; line-height: 1.5; }
.job-source-count { margin: 0 0 10px; color: #586256; font: 9px var(--mono); }
.job-source-foot { margin-top: auto; padding-top: 9px; border-top: 1px solid #e7e8dc; }
@media (max-width: 850px) { .job-source-grid { grid-template-columns: 1fr; } }
@media (max-width: 620px) {
  .job-close-chip { margin-left: 0; }
  .job-controls { gap: 8px; }
  .job-select { flex: 1 1 100%; }
  .job-source-grid { gap: 10px; }
}

/* Landing jobs card (rotating list) */
.home-jobs-list { position: relative; overflow: hidden; height: 132px; }
.home-jobs-track { display: grid; gap: 0; transition: transform .45s ease; }
.home-job-row { display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 2px; color: inherit; text-decoration: none; border-bottom: 1px solid #f2f4ea; }
.home-job-row:last-child { border-bottom: 0; }
.home-job-row:hover .home-job-title { text-decoration: underline; text-underline-offset: 2px; }
.home-job-title { flex: 1 1 auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 11px; font-weight: 600; }
.home-job-when { flex: 0 0 auto; color: var(--green); font: 9px var(--mono); white-space: nowrap; }
.home-job-when.is-soon { color: #7a5a18; }
.home-jobs-note { margin: 8px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }

/* Jobs desk — dark mode */
@media (prefers-color-scheme: dark) {
  .job-search input, .job-select select { color: #dbe2d0; border-color: #33402c; background: #1f281b; }
  .job-card, .job-source-card { border-color: #2c3627; background: #1a2217; }
  .job-card.is-soon { border-color: #5d4c2a; }
  .job-title { color: #e2e8d6; }
  .job-employer, .job-meta-bit, .job-closing { color: #b3bda8; }
  .job-employer strong, .job-closing strong { color: #b9d1ac; }
  .job-closing-raw, .job-card-footnote { color: #7f8a76; }
  .job-meta-bit { border-color: #2c3627; background: #1f281b; }
  .job-chip { color: #b9d1ac; border-color: #3a4a32; background: #1f281b; }
  .job-chip:hover { border-color: #55684a; }
  .job-chip.is-active { color: #d6e6cc; border-color: #35664a; background: #26503a; }
  .job-sector-chip { color: #b9d1ac; border-color: #3a4a32; background: #1f281b; }
  .job-doc-link { color: #b9d1ac; border-color: #33402c; background: #1f281b; }
  .job-doc-link:hover { border-color: #465840; background: #26331f; }
  .job-details { border-color: #2c3627; background: #161d14; }
  .job-details p { color: #c2ccb6; }
  .job-actions { border-top-color: #262f1f; }
  .job-source-link { color: #b9d1ac; border-color: #33402c; background: #1f281b; }
  .job-close-chip.is-open { color: #b9d1ac; border-color: #3a4a32; background: #1f281b; }
  .job-close-chip.is-soon { color: #d8b57f; border-color: #5d4c2a; background: #26200f; }
  .job-close-chip.is-closed { color: #8f9a86; border-color: #33402c; background: #1c251a; }
  .job-close-chip.is-ad { color: #9aa590; border-color: #3a4a32; }
  .job-source-status { color: #b9d1ac; border-color: #3a4a32; background: #1f281b; }
  .job-source-status.is-error, .job-source-error { color: #e0b49e; border-color: #5d3a2a; background: #2a1c14; }
  .job-source-note { color: #9aa590; }
  .job-source-count { color: #b3bda8; }
  .job-source-foot { border-top-color: #2c3627; }
  .job-empty { border-color: #33402c; background: #1a2217; }
  .home-job-row { border-bottom-color: #262f1f; }
  .home-job-when { color: #b9d1ac; }
  .home-job-when.is-soon { color: #d8b57f; }
}