/* One hour at a time, selected on a 12-hour timeline. */
#boat-weather-dialog{width:min(560px,calc(100% - 24px));max-height:90dvh;overflow:auto;padding:20px;color:#123b50}
#boat-weather-dialog .dialog-head{top:-20px;align-items:center;padding:0 0 10px}
#boat-weather-dialog h2{font:700 20px/1.25 system-ui,sans-serif;margin:0}
#boat-weather-dialog .dialog-head button{min-width:44px;min-height:44px;flex-shrink:0}
.boat-weather-area{font-size:15px!important;font-weight:700;margin:4px 0}
.boat-weather-status,.boat-weather-availability{font-size:12px!important;line-height:1.5!important;overflow-wrap:anywhere}
.boat-weather-selector{display:grid;gap:8px;margin:18px 0 14px}
.boat-weather-selector label{font-size:13px;font-weight:650;margin:0}
#boat-weather-time{display:block;font-size:16px;font-weight:750;line-height:1.4}
#boat-weather-hour{display:block;width:100%;min-width:0;min-height:44px;margin:0;padding:0;border:0;background:transparent;accent-color:#075985;cursor:pointer;touch-action:pan-y}
.boat-weather-range-ends{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:#49676b}
.boat-weather-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.boat-weather-metric{display:flex;flex-direction:column;justify-content:center;gap:8px;min-height:90px;min-width:0;padding:14px;border:1px solid #c5dce7;border-radius:12px;background:#edf6fa}
.boat-weather-metric>span{font-size:12px;color:#49676b;overflow-wrap:anywhere}
.boat-weather-symbol{display:inline-flex;align-items:center;justify-content:center;flex:0 0 30px;width:30px;height:30px}
.boat-weather-symbol svg{display:block;width:100%;height:100%;overflow:visible}
.boat-weather-metric-heading{display:flex;align-items:center;gap:9px}
.boat-weather-condition{display:flex;align-items:center;gap:14px;padding:12px 16px;margin:0 0 14px;background:#edf6fa;border:1px solid #c5dce7;border-radius:12px}
.boat-weather-condition .boat-weather-symbol{width:46px;height:46px;flex-basis:46px}
.boat-weather-condition strong{font-size:16px;color:#254e62}
.boat-weather-metric>strong{font-size:21px;font-weight:750;line-height:1.35;overflow-wrap:anywhere}
.boat-weather-metric .boat-wind{font-size:19px;flex-wrap:wrap;gap:6px}
.boat-weather-availability:empty{display:none}
#boat-weather-dialog>button{min-height:44px;margin-top:12px}
.boat-conditions-source{font-size:11px!important;line-height:1.5!important;color:#49676b;margin-bottom:0}
.boat-conditions-source a{color:#175b70;text-decoration:underline}
.boat-weather-toggle svg{display:block;width:27px;height:27px;flex-shrink:0}
body>.boat-weather-toggle{position:fixed;z-index:1250;right:12px;bottom:calc(78px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;justify-content:center;width:56px;height:48px;min-height:48px;padding:3px;border:1px solid #a7c1cc;border-radius:9px;background:rgba(255,255,255,.86);color:#123b50;box-shadow:0 2px 8px #153d4320}
.boat-weather-toggle:disabled{opacity:.65}
.boat-wind{display:inline-flex;align-items:center;gap:9px;vertical-align:middle}
.boat-wind-arrow{display:inline-grid;place-items:center;flex-shrink:0;width:27px;height:27px;color:#075e87;background:#d7edf8;border-radius:50%;font:700 25px/1 system-ui,sans-serif}
.boat-depth-value{display:block;text-align:center;white-space:nowrap;color:#17465e;font:400 11px/14px system-ui,sans-serif;text-shadow:0 0 2px #ffffffb3;background:transparent;border:0;border-radius:0;padding:0;box-shadow:none}
.boat-depth-label{background:transparent;border:0;box-shadow:none}.seamark-colour.seamark-compact{filter:none}
.boat-depth-toggle{position:absolute;z-index:1100;top:12px;left:12px;max-width:calc(100% - 70px);border:1px solid #b9cdd1;border-radius:9px;background:#fff;color:#153d43;box-shadow:0 2px 8px #153d4320}
.boat-depth-toggle label{display:flex;align-items:center;gap:8px;min-height:44px;padding:8px 12px;font-size:13px;font-weight:700;cursor:pointer}
.boat-depth-toggle input{margin:0;flex-shrink:0}
@media(max-width:760px){body>.boat-weather-toggle{right:8px}#boat-weather-dialog{padding:16px}#boat-weather-dialog .dialog-head{top:-16px}#boat-weather-dialog h2{font-size:17px}.boat-weather-metric{padding:10px;min-height:82px}.boat-weather-metric>strong{font-size:19px}.boat-weather-metric .boat-wind{font-size:17px}}
@media(max-height:500px) and (min-width:600px){#boat-weather-dialog{width:min(720px,calc(100% - 24px));max-width:720px;padding:14px}#boat-weather-dialog .dialog-head{top:-14px;padding-bottom:4px}#boat-weather-dialog h2{font-size:18px}.boat-weather-status{margin:4px 0}.boat-weather-selector{grid-template-columns:1fr 1fr;gap:4px;margin:8px 0}.boat-weather-selector label{align-self:center}#boat-weather-time{text-align:right;font-size:14px}#boat-weather-hour,.boat-weather-range-ends{grid-column:1/-1}.boat-weather-metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.boat-weather-metric{min-height:76px;padding:10px}.boat-weather-metric>strong{font-size:18px}.boat-weather-metric .boat-wind{font-size:16px}}
