/* Final mobile-first usability layer. Wider layouts expand from this baseline. */
:root{--muted:#52627b}
body{font-size:16px}
button,a,input,select,textarea,summary{touch-action:manipulation}
input,select,textarea{font-size:16px!important}
input[type=checkbox]{width:20px;height:20px;accent-color:var(--blue);flex-shrink:0}
textarea:focus-visible{outline:3px solid #7095ff;outline-offset:3px}
.skip-link{position:fixed;left:16px;top:-80px;padding:14px 20px;background:var(--ink);color:white;z-index:2000;border-radius:12px}
.skip-link:focus{top:12px}
.filter-disclosure{border-top:1px solid var(--line);margin-top:14px}
.filter-disclosure>summary{display:flex;align-items:center;gap:10px;min-height:52px;list-style:none;cursor:pointer;font-size:14px;font-weight:600;padding:10px 0;color:var(--ink)}
.filter-disclosure>summary::-webkit-details-marker{display:none}
.filter-disclosure>summary b{font-size:24px;margin-left:auto;font-weight:400}
.filter-disclosure[open]>summary b{transform:rotate(45deg)}
#active-filter-count{font-size:12px;font-weight:500;color:var(--blue);background:#eaf0ff;padding:5px 9px;border-radius:20px}
.filter-panel{padding:4px 0 16px}
.quick-filters{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.quick-filters select{width:100%;max-width:100%;min-width:0;min-height:48px}
.quick-filters .reset{grid-column:1/-1;justify-self:end;min-height:44px;padding:8px 12px;font-size:14px}
.depth-filters,.outlook-controls{gap:14px}
.depth-filters label,.outlook-controls>label{display:grid;gap:8px;flex:1;min-width:0;font-size:13px}
.depth-filters select,.outlook-controls select{width:100%;max-width:100%;min-width:0;min-height:48px;padding:8px 10px}
.depth-filters p{font-size:12px;line-height:1.6;margin:0;width:100%}
.outlook-controls .map-colour-toggle{display:flex;width:100%;min-height:44px;font-size:13px;gap:10px;align-items:center}
.outlook-controls>a{font-size:13px;min-height:44px;display:inline-flex;align-items:center}
.results-row{gap:12px;align-items:center;margin:12px 0 0;flex-wrap:wrap}
.results-row p{font-size:13px;line-height:1.5;margin:0;flex-basis:100%}
.view-buttons{display:flex;width:100%;padding:4px;background:#f0f4fb;border-radius:14px}
.view-buttons button{flex:1;min-height:44px;font-size:14px;padding:10px 12px;border-radius:10px}
.category-tabs button{font-size:13px;min-height:46px;gap:8px;padding:11px 15px}
.category-tabs small{font-size:11px}
.card-content>p{font-size:15px;line-height:1.65}
.card-place{font-size:11px;line-height:1.5;letter-spacing:1px}
.card-tag{font-size:10px}
.photo-caption{font-size:11px;line-height:1.45;background:linear-gradient(transparent,#091d3bcc);padding:18px 12px 10px;left:0;bottom:0;right:0}
.save{width:44px;height:44px;font-size:25px}
.depth-badge,.level-badge,.outlook-badge{font-size:12px;line-height:1.5;padding:7px 10px}
.card-bottom{gap:8px}.card-bottom>span{font-size:12px;line-height:1.5;flex-basis:100%}
.card-bottom button{min-height:44px;font-size:14px;padding:10px 4px}
.compare-place,.card-bottom .compare-place,.map-place-actions .compare-place{min-height:44px;font-size:13px!important;padding:10px 14px!important}
.outline,.primary{min-height:46px}
.map-topline{flex-wrap:wrap;gap:8px;padding:14px}
.map-topline>span{font-size:12px;line-height:1.7;flex-wrap:wrap;gap:7px}
.map-topline button{min-height:44px;font-size:13px}
.map-canvas-wrap{height:390px;max-height:60dvh}
.map-note,.map-footnote{font-size:12px;line-height:1.6}
.map-note{bottom:24px;padding:8px 10px}
.map-sidebar{max-height:440px;overscroll-behavior:contain}
.map-result{min-height:76px;padding:15px}.map-result strong{font-size:15px;line-height:1.4}.map-result small{font-size:12px;line-height:1.5}
.map-list-heading{font-size:11px}.map-welcome p,.selected-place p,.selected-place small{font-size:14px;line-height:1.65}
.map-place-actions button{min-height:44px;font-size:14px}
.leaflet-control-zoom a{width:44px!important;height:44px!important;line-height:44px!important}
.leaflet-popup-content p,.leaflet-popup-content small{font-size:12px}.map-popup button{min-height:44px;font-size:14px}
.forecast-tools label{font-size:13px}.forecast-tools select{min-height:48px}.forecast-tools .outline{font-size:13px}
.weather-metric>span,.weather-metric small{font-size:12px;line-height:1.5}
.forecast-caption,.today-explanation,.forecast-status p{font-size:14px;line-height:1.7}
.forecast-attribution{font-size:12px;line-height:1.6}
.today-pick .card-place{font-size:11px}.today-pick>p{font-size:14px;line-height:1.65}
.pick-links button{min-height:44px;font-size:13px}.pick-links{flex-wrap:wrap;gap:8px}
.pick-peaks{font-size:12px}.pick-peaks small{font-size:11px;line-height:1.5}
.conditions-method summary{min-height:48px;font-size:14px}.conditions-method p{font-size:14px;line-height:1.7}
.today-heading>a{font-size:13px;min-height:44px;display:inline-flex;align-items:center}
.dialog-controls>.close{width:44px;height:44px;background:white;box-shadow:0 2px 12px #13254b22;font-size:30px}
dialog p,dialog li{font-size:15px;line-height:1.75}
dialog .fineprint{font-size:12px!important;line-height:1.65}
.detail-caption,.gallery-credit{font-size:12px!important;line-height:1.5!important}
.detail-facts span{font-size:13px}.source-link{font-size:13px;line-height:1.6}
.place-story p,.place-arrival p{font-size:15px!important;line-height:1.75!important}
.place-story small,.place-sights small,.arrival-location-note{font-size:12px;line-height:1.6}
.place-story a,.place-arrival a{font-size:13px;line-height:1.6}
.place-sights li,.place-sights li strong,.place-sights li span,.arrival-steps li,.place-arrival strong{font-size:14px!important;line-height:1.7}
.place-arrival .arrival-directions{min-height:46px;font-size:14px}
.detail-actions button,.detail-actions a{font-size:14px;min-height:46px}
.nearby-places p,.nearby-places button small{font-size:12px;line-height:1.6}
.nearby-places button strong{font-size:15px}
.plan-settings label,.plan-settings>p,.plan-checklist label,.stop-controls button{font-size:14px}
.plan-settings input,.plan-settings textarea{min-height:48px}
.plan-settings p{font-size:13px!important;color:var(--muted)}
.plan-stop strong{font-size:16px}.plan-stop small{font-size:12px;line-height:1.6}
.plan-stop .outlook-badge{font-size:12px}
.stop-controls button{width:44px;height:44px}
.plan-checklist label{min-height:48px;align-items:center}
.compare-tray>button:last-child{min-width:44px;height:44px}
.comparison-table{font-size:14px}.comparison-table tbody th{font-size:13px}.comparison-table thead span{font-size:11px}
.comparison-table thead button{font-size:13px;min-height:44px}
.comparison-hint{font-size:13px!important}
@media(max-width:700px){
 html{scroll-padding-top:84px}body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
 header{height:72px;padding:0 20px}.trip-button{min-height:44px;font-size:12px}
 .hero{padding:26px 20px 32px;gap:24px}.hero .eyebrow{font-size:10px}
 .hero h1{font-size:clamp(44px,13vw,64px);letter-spacing:-2.8px;line-height:1.04;margin:18px 0}
 .hero-description{font-size:16px;line-height:1.6;max-width:340px;margin:16px 0 20px}
 .hero-actions{gap:14px;flex-wrap:wrap}.hero-actions .primary{font-size:14px;padding:14px 18px}.hero-actions .text-link{font-size:13px;min-height:44px;display:inline-flex;align-items:center}
 .hero-stats{margin-top:20px;padding-top:16px;gap:24px}.hero-stats>span{font-size:11px}.hero-stats b{font-size:23px}
 .hero-visual{height:270px;min-height:270px;margin:0}.hero-main-photo{object-position:50% 65%}
 .paddle-postcard,.sun-stamp,.photo-coordinate{display:none}.hero-photo-label>span{font-size:9px}.hero-photo-label strong{font-size:24px}
 .activity-shortcuts{padding:0 20px 32px;gap:10px}.activity-shortcuts>a{padding:16px 12px;min-height:100px}.activity-shortcuts strong{font-size:15px}.activity-shortcuts small{font-size:12px;line-height:1.5}.activity-icon{display:none}
 .section-pad{padding:38px 20px}.section-heading{margin-bottom:24px}.section-heading>p{font-size:15px;line-height:1.65}.eyebrow{font-size:10px}h2{font-size:32px;line-height:1.12}
 .explore-toolbar{padding:14px;border-radius:18px}.category-tabs{margin:0 -14px 0 0;padding:0 14px 14px 0;gap:8px}
 .search{padding:0 12px;min-width:0}.search input{height:50px;font-size:16px;min-width:0}.search svg{flex-shrink:0}
 .cards{gap:20px}.card-picture{height:220px}.card-content{padding:20px}.card h3{font-size:27px;line-height:1.15}
 .cards.list .card{flex-direction:column}.cards.list .card-picture{width:100%;height:170px;min-height:170px}.cards.list .card-content{padding:20px}.cards.list .card h3{font-size:25px}.cards.list .card p{font-size:15px}.cards.list .card-tag{font-size:10px}.cards.list .save{width:44px;height:44px;top:12px;right:12px;font-size:25px}.cards.list .depth-badge,.cards.list .level-badge,.cards.list .outlook-badge{font-size:12px;padding:7px 10px}.cards.list .card-bottom button{font-size:14px}.cards.list .card-bottom>span{font-size:12px}
 .today-pick{grid-template-columns:1fr}.pick-peaks{display:flex;flex-wrap:wrap;max-width:none;text-align:left;gap:12px}.pick-peaks small{width:100%}
 .weather-metrics{gap:10px}.weather-metric{padding:18px 14px}.weather-metric strong{font-size:38px}
 .map-popup .card-facts,.map-popup p{display:none}.map-popup h3{font-size:20px;line-height:1.2;margin:8px 0 14px}.leaflet-popup-content{max-width:230px}
 .forecast-status{align-items:flex-start;gap:8px;flex-wrap:wrap}.forecast-tools{width:100%;gap:10px}.forecast-tools label{min-width:0;flex:1}.forecast-tools select{min-width:0;width:100%;max-width:100%;padding-right:24px}.forecast-tools .outline{min-width:0;padding:12px}
 .mobile-nav{height:calc(76px + env(safe-area-inset-bottom));padding:8px 7% calc(10px + env(safe-area-inset-bottom))}.mobile-nav a{font-size:12px;min-height:48px}
 .compare-tray{bottom:calc(86px + env(safe-area-inset-bottom));width:calc(100% - 24px);padding:12px;gap:10px}.compare-tray strong{font-size:13px}.compare-tray span{display:none}.compare-tray .primary{font-size:13px;padding:12px}
 body:has(#compare-tray:not([hidden])) #toast{bottom:180px}
 dialog,#compare-dialog{width:100%;max-width:none;max-height:94dvh;margin:auto 0 0;border-radius:24px 24px 0 0;padding:24px 20px calc(30px + env(safe-area-inset-bottom));overscroll-behavior:contain}
 .dialog-controls{top:24px}.dialog-controls>.close{top:-12px;right:-8px}.detail-image{width:calc(100% + 40px);margin:-24px -20px 22px;height:240px}
 .place-gallery{overflow-x:auto;padding:3px;gap:10px}.place-gallery button{flex-shrink:0;min-width:80px;height:58px}
 .place-brief{gap:28px}.place-logistics>div{grid-template-columns:1fr 1fr}.place-logistics span{font-size:12px}.place-logistics strong{font-size:14px}
 .plan-settings{grid-template-columns:1fr}.plan-stop{display:grid;grid-template-columns:26px minmax(0,1fr);gap:10px}.stop-controls{grid-column:2;justify-content:flex-start;display:flex;flex-direction:row;flex-wrap:nowrap;max-width:none;gap:8px}.stop-controls button:last-child{width:44px;height:44px}
 .kayak-copy>p:not(.eyebrow),.field-notes>div>p:not(.eyebrow),.notes p{font-size:15px;line-height:1.7}.kayak-copy small,.feature-facts span,.notes a{font-size:12px}.notes summary{font-size:16px;min-height:56px}.island-grid p{font-size:14px}
 .footer-top p,.footer-top>a:last-child,.footer-bottom{font-size:12px;line-height:1.7}.footer-bottom button{min-height:44px}.last-call .eyebrow{font-size:10px;line-height:1.6}
}
@media(min-width:701px){
 .filter-disclosure{margin-top:14px}.filter-disclosure>summary{font-size:14px;min-height:44px}.quick-filters{display:flex}.quick-filters select{width:auto;min-width:170px}.quick-filters .reset{margin-left:auto}
 .results-row{flex-wrap:nowrap;justify-content:space-between;margin-top:16px}.results-row p{flex-basis:auto}.view-buttons{width:auto;min-width:250px}.view-buttons button{min-width:76px}
 .map-canvas-wrap{height:auto;max-height:none}.map-sidebar{max-height:none}.map-topline{flex-wrap:nowrap}.map-layout{grid-template-columns:minmax(0,1fr) 340px}
 .depth-filters p{width:auto}.outlook-controls .map-colour-toggle{width:auto}.depth-filters label,.outlook-controls>label{flex:initial}.depth-filters select,.outlook-controls select{width:auto}
 .today-pick>p{font-size:14px}.cards.list .card-picture{width:260px}.hero-description{font-size:17px}
 .section-heading>p{font-size:15px}.card h3{font-size:27px}.section-pad,.activity-shortcuts{max-width:1600px;margin-left:auto;margin-right:auto}
}
@media(min-width:701px) and (max-width:1000px){.map-layout{grid-template-columns:minmax(0,1fr) 280px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.forecast-tools{flex-wrap:wrap}}
@media(min-width:1100px){.filter-panel{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.quick-filters{align-items:center}.depth-filters{margin-top:0}.depth-filters p{flex-basis:100%;font-size:12px}.outlook-controls{grid-column:1/-1}.hero-stats>span{font-size:12px}.activity-shortcuts small{font-size:12px}.activity-shortcuts strong{font-size:16px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
@media(max-width:400px){
 .forecast-tools{display:grid;grid-template-columns:minmax(0,1fr)}
 .forecast-tools label{width:100%}.forecast-tools .outline{justify-self:end}
 header{gap:10px}.brand{font-size:23px;grid-template-columns:31px auto;gap:7px}.brand svg{width:30px;height:30px}.trip-button{white-space:nowrap;padding:10px;font-size:11px}
}
#forecast-date{font-size:12px;line-height:1.5}
select:disabled{color:#66738b;background:#f0f3f8;cursor:default}
.detail-access-shortcut{display:block;width:100%;min-height:52px;padding:14px 16px;margin:18px 0 24px;text-align:left;border:1px solid #cddcff;border-radius:14px;background:#f0f5ff;color:var(--blue)}
.detail-access-shortcut strong{display:block;font-size:14px;line-height:1.5}.detail-access-shortcut span{display:block;font-size:12px;line-height:1.6;color:var(--muted);margin-top:3px}
.place-arrival:focus-visible{outline:3px solid #7095ff;outline-offset:8px;border-radius:6px}
