/* Selected Round 1 A: Day timeline and quiet, accessible image credits. */
:root{--timeline-wind:var(--folio-hike,#BAD36F);--timeline-water:var(--folio-blueprint,#67AFC8);--timeline-gust:var(--cg-ink)}
.weatherTimeline{container-type:inline-size;min-width:0;margin:16px 0 28px;color:var(--cg-ink)}
.timelineHeader{margin:0 0 14px}
.weatherTimeline .timelineHeader h2{font:400 26px/1.25 var(--cg-display);color:var(--cg-bright);margin:0 0 8px}
.weatherTimeline .timelineHeader p{font:var(--cg-meta)/1.6 var(--cg-interface);margin:6px 0}
.weatherTimeline .timelineFixture,.weatherTimeline .timelineStale{color:var(--brief-warning);font-weight:500}
.timelineRow{display:grid;grid-template-columns:160px minmax(0,1fr);column-gap:20px;padding:12px 0 8px;border-top:1px solid var(--cg-rule)}
.timelineLabel{padding:2px 0 12px}
.weatherTimeline .timelineLabel h3{font:400 18px/1.35 var(--cg-prose);color:var(--cg-bright);margin:0 0 8px}
.timelineLabel h3>span{white-space:nowrap}
.timelineLabel>span{display:block;font:var(--cg-meta)/1.5 var(--cg-interface);max-width:25ch;color:var(--cg-muted)}
.timelineLegend{display:flex!important;flex-wrap:wrap;gap:8px 16px}
.timelineLegend>span{display:inline-flex;align-items:center;gap:7px}
.timelineLegend>span:before{content:"";width:22px;border-top:2px solid var(--timeline-wind)}
.timelineLegend>span+span:before{border-top:2px dashed var(--timeline-gust)}
.timelineChart{display:grid;grid-template-columns:32px minmax(0,1fr);min-width:0}
.timelineScale{position:relative;font:var(--cg-meta)/1 var(--cg-number);color:var(--cg-muted)}
.timelineScale span{position:absolute;right:8px;transform:translateY(-50%)}
.timelinePlot{position:relative;height:104px;min-width:0}
.timelinePlot svg{display:block;width:100%;height:100%;overflow:visible}
.timelinePlot svg *{vector-effect:non-scaling-stroke}
.timelineGrid{stroke:var(--cg-rule);stroke-width:.65}
.timelineLine{fill:none;stroke:var(--timeline-wind);stroke-width:2}
.timelinePoint{fill:var(--timeline-wind)}
.timelineLine.timelineGust{stroke:var(--timeline-gust);stroke-dasharray:5 4;stroke-width:1.5}
.timelinePoint.timelineGust{fill:var(--timeline-gust)}
.timelineRow--wave .timelineLine{stroke:var(--timeline-water)}
.timelineRow--wave .timelinePoint,.timelineBar{fill:var(--timeline-water)}
.timelineGuide{stroke:var(--cg-bright);stroke-width:1;opacity:.65}
.timelineGuide[hidden]{display:none}
.timelineValue,.timelineMissing{position:absolute;transform:translateX(-50%);font:var(--cg-meta)/1 var(--cg-number);color:var(--cg-bright);white-space:nowrap}
.timelineMissing{bottom:16px;color:var(--cg-muted)}
.timelineHours{grid-column:2;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));font:var(--cg-meta)/1.4 var(--cg-interface);color:var(--cg-muted);text-align:center}
.timelineChance{grid-column:2;display:grid;grid-template-columns:32px minmax(0,1fr);padding:12px 0 4px}
.timelineChance>span{grid-column:2;font:var(--cg-meta)/1.5 var(--cg-interface);color:var(--cg-muted)}
.timelineChance>div{grid-column:2;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));padding-top:6px;text-align:center;font:var(--cg-meta)/1.4 var(--cg-number);color:var(--timeline-water)}
.timelineControls{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;margin:16px 0 10px 212px}
.timelineControls button{min-width:0;min-height:44px;padding:8px 2px;border:1px solid var(--cg-rule);border-radius:3px;background:transparent;color:var(--cg-ink);font:var(--cg-meta)/1.3 var(--cg-interface);font-variant-numeric:tabular-nums;cursor:pointer}
.timelineControls button:hover{background:var(--nav-row)}
.timelineControls button[aria-pressed=true]{border-color:var(--cg-focus);color:var(--cg-bright);background:var(--nav-current)}
.weatherTimeline .timelineSelected p{font:var(--cg-control)/1.65 var(--cg-interface);margin:8px 0 16px;max-width:none;min-height:46px}
.timelineSelected [hidden]{display:none}
.weatherTimeline .timelineEvidence{display:grid;gap:4px;font:var(--cg-meta)/1.6 var(--cg-interface);margin:16px 0 8px;color:var(--cg-muted)}
.weatherTimeline .timelineLimit,.weatherTimeline .timelineUnavailable{font:var(--cg-control)/1.6 var(--cg-prose);margin:8px 0 16px;color:var(--cg-ink)}
.timelineTableScroll{overflow-x:auto;max-width:100%;scrollbar-color:var(--cg-rule) var(--cg-bg)}
.timelineTable table{width:100%;border-collapse:collapse;font:var(--cg-meta)/1.5 var(--cg-number);font-variant-numeric:tabular-nums}
.timelineTable caption{text-align:left;padding:12px 0;color:var(--cg-muted)}
.timelineTable th,.timelineTable td{padding:12px 10px;text-align:left;border-bottom:1px solid var(--cg-rule);white-space:nowrap}
.timelineTable th{font-weight:500}
.timelineControls button:focus-visible,.timelineTableScroll:focus-visible,.photoCredit>summary:focus-visible{outline:2px solid var(--cg-focus);outline-offset:3px}
.weatherPage .weatherSharedAlerts{max-width:none;margin:8px 0}
.weatherPage .weatherSharedAlerts .conditionsNotice{padding:8px 0;margin:0}
.weatherPage .weatherSharedAlerts .conditionsNotice strong{font-size:20px}
.weatherPage .weatherSharedAlerts .conditionsNotice p{font-size:16px}
.weatherPage .weatherScope{max-width:82ch;margin:10px 0 18px}
.weatherPage #weatherStatus{margin:10px 0;font-size:12px}
.weatherPage .weatherFixtureAdvisory{margin:8px 0;font:12px/1.5 var(--cg-interface)}
.weatherPage .weatherReading{max-width:none}
.weatherPage .weatherOverview dl>div{display:block}
.weatherPage .weatherOverview dd{text-align:left}
.conditionsMetrics dd{overflow-wrap:normal;word-break:normal}
.conditionsMetrics dd:has(>span){min-width:0}
.conditionsBrief{container-type:inline-size}
.wxFeeds .r{gap:20px;align-items:start}
.wxFeeds .r>span{min-width:120px}
.wxFeeds .r>b{min-width:0;overflow-wrap:anywhere}
#weatherContent[aria-busy=true]{cursor:progress}
.photoCredit{margin:0 0 10px;padding:0;border:0;background:none;min-width:0;max-width:100%;box-shadow:none}
.photoCredit>summary,.guideContent .photoCredit>summary,.beachDetail .photoCredit>summary{display:list-item;cursor:pointer;width:fit-content;max-width:100%;min-width:44px;min-height:44px;box-sizing:border-box;padding:13px 4px;font:12px/18px var(--cg-interface);color:var(--cg-muted);letter-spacing:0;text-transform:none}
.photoCredit>summary:hover{color:var(--cg-bright)}
.photoCreditBody{padding:4px 0 16px;max-width:70ch;overflow-wrap:anywhere}
.photoCreditBody p,.guideContent .photoCreditBody p,.beachDetail .photoCreditBody p{font:14px/1.65 var(--cg-prose);color:var(--cg-ink);margin:6px 0;text-transform:none;letter-spacing:0}
.photoCreditLinks{display:flex;gap:8px 20px;flex-wrap:wrap}
.photoCreditLinks a{display:inline-flex;align-items:center;min-height:44px;font:12px/1.5 var(--cg-interface);color:var(--cg-focus);text-underline-offset:3px}
.bucketMenuPanel .photoCredit>summary{font-size:12px}
.depthPlate .conditionsEvidence{margin:10px 0;font:var(--cg-meta)/1.6 var(--cg-interface)}
@container(max-width:600px){
 .timelineRow{grid-template-columns:minmax(0,1fr);gap:0}
 .timelineLabel{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-bottom:8px}
 .timelineLabel>span{max-width:none}
 .timelineChance{grid-column:1}
 .timelineControls{margin-left:0;gap:2px}
 .timelinePlot{height:128px}
 .weatherTimeline .timelineHeader h2{font-size:24px}
}
@container(max-width:390px){
 .conditionsMetrics{grid-template-columns:1fr}
}
@media(max-width:760px){
 .weatherTimeline .timelineHeader h2{font-size:24px}
 .weatherScope{margin:12px 0 20px!important}
 .wxFeeds .r{display:grid;grid-template-columns:1fr;gap:4px}
 .wxFeeds .r>b{text-align:left}
 .timelineSelected p{font-size:14px!important}
}
@media(prefers-reduced-motion:reduce){.weatherTimeline *,.photoCredit *{scroll-behavior:auto;transition:none;animation:none}}
