/* Reviewed phone UX layer; tablet/desktop forecast controls remain unchanged. */
.hsf-phone-only { display:none; }
.hsf-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.sites11a-main :is(p,li,address,figcaption) a:not(.button):not(.btn),
.long-form-copy a, .verbatim-resource-list a { color:#8b1933; text-decoration:none; }
.sites11a-main a:focus-visible { outline:3px solid #8b1933; outline-offset:3px; }
.sites11a-header-inner { gap:16px; }
.sites11a-brand, .sites11a-header-actions { min-width:0; }
.sites11a-brand img.forecaster-logo, .sites11a-affm-logo.affm-logo {
  box-sizing:content-box; height:clamp(28px,5.1vw,52px); width:auto;
  max-width:none; max-height:none; background:#fff; padding:3px 5px; border:0; border-radius:0;
}
.home-runtime-animation video, .home-runtime-animation img { aspect-ratio:360/328; }
.background-runtime-animation video, .background-runtime-animation img { aspect-ratio:420/382; }
@media(max-width:767px) {
  .hsf-phone-only { display:block; }
  .hsf-not-phone { display:none !important; }
  .sites11a-header.topbar { padding:6px 8px; }
  .sites11a-header-inner { gap:10px; min-height:0; }
  .sites11a-brand img.forecaster-logo, .sites11a-affm-logo.affm-logo { height:clamp(25px,10.5vw,46px); max-width:none; padding:3px; }
  /* Artwork aspect ratios are ~4:1: both shrink together within one row. */
  .sites11a-brand img.forecaster-logo, .sites11a-affm-logo.affm-logo { height:calc((100vw - 38px) / 8.22); max-height:46px; }
  .sites11a-route-page:not(.sites11a-forecast-page) { margin:8px auto; padding:12px; }
  .sites11a-route-page p { text-align:left; }
  .page-title-with-art, .sites11a-page-title-with-art { margin-bottom:12px; padding-bottom:0; }
  .home-hero-layout { gap:14px; }
  .home-alert-column .alert-status-block { display:grid; grid-template-columns:minmax(80px,.75fr) minmax(0,2fr); gap:8px; padding:10px; }
  .home-alert-column #alert-heading { grid-column:1/-1; margin:0; font-size:16px; }
  .home-alert-column .shiny-status-slot { align-self:center; margin:0; min-height:0; border:0; padding:0; }
  .home-alert-column .shiny-status-slot img { width:100% !important; height:auto !important; }
  .home-alert-column .alert-thresholds { margin:0; min-width:0; }
  .home-alert-column .alert-thresholds li { display:block; padding:3px 0 3px 13px; white-space:normal; border:0; line-height:1.25; }
  .home-alert-column .alert-thresholds li::before { width:8px; height:8px; top:7px; }
  .home-alert-column .alert-thresholds strong { font-size:11px; }
  .home-alert-column .alert-thresholds span { font-size:11px; margin-left:3px; }
  #hsf-home-actions { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; gap:8px; }
  #hsf-home-actions .alert-action { display:flex; align-items:center; justify-content:center; min-height:44px; padding:8px 6px; margin:0; font-size:12px; line-height:1.3; text-align:center; }
  .alert-reporting-card { display:none; }
  #hsf-home-short { font-size:15px; line-height:1.5; margin:10px 0 0; }
  .home-runtime-animation { float:none; width:100%; margin:0 0 10px; }
  .hsf-disclosure { border-bottom:1px solid #d9ded4; padding:0; margin:0; }
  .hsf-disclosure > summary { cursor:pointer; display:flex; align-items:center; gap:8px; list-style:none; min-height:44px; padding:10px 0; font-size:14px; font-weight:700; color:#34422f; }
  .hsf-disclosure > summary::-webkit-details-marker { display:none; }
  .hsf-disclosure > summary::after { content:'+'; font-size:20px; line-height:1; }
  .hsf-disclosure[open] > summary::after { content:'−'; }
  .hsf-disclosure > :not(summary) { font-size:14px; line-height:1.5; }
  /* The map occupies the viewport; only the three exclusive display choices precede it. */
  #forecast_control_toggle_ui, #hsf-summary-divider, #hsf-sidebar-divider,
  body.sites11a-forecast-active .sites11a-forecast-page #forecast-control-panel,
  .hsf-mobile-map-tools, #hsf-map-touch-help { display:none !important; }
  body.sites11a-forecast-active .sites11a-forecast-page .app-shell { padding:6px; gap:4px; }
  .hsf-phone-modes { display:flex; border:0; padding:0; margin:0 0 6px; gap:4px; }
  .hsf-phone-modes label { display:flex; flex:1; align-items:center; gap:4px; padding:6px 5px; min-height:44px; border:1px solid #bac4b1; border-radius:4px; background:white; color:#34422f; font-size:12px; line-height:1.25; margin:0; cursor:pointer; }
  .hsf-phone-modes label:has(input:checked) { background:#edf1e7; border-color:#506441; }
  .hsf-phone-modes input, .hsf-phone-risk-filter input { width:17px; height:17px; margin:0; flex:none; accent-color:#617454; }
  body.sites11a-forecast-active .sites11a-forecast-page .map-wrap { position:relative; display:block; border:1px solid #c6cec1; }
  body.sites11a-forecast-active .sites11a-forecast-page #heat_map { height:calc(100svh - 150px) !important; min-height:400px; max-height:780px; pointer-events:auto; touch-action:pan-y; }
  #heat_map .leaflet-container, #heat_map.leaflet-touch-drag, #sites11a_finder_map.leaflet-touch-drag { touch-action:pan-y; }
  .map-wrap #interactive-frame-label { position:absolute; top:8px; left:60px; right:90px; width:auto; transform:none; z-index:700; padding:6px 4px; font-size:12px; line-height:1.3; white-space:normal; box-shadow:0 1px 4px #0003; background:#fff; pointer-events:none; }
  #hsf-phone-species { position:absolute; right:8px; top:8px; z-index:800; border:1px solid #c6cec1; border-radius:3px; background:#fff; box-shadow:0 1px 5px #0003; }
  #hsf-phone-species > summary { min-height:44px; padding:8px; font-size:12px; }
  #hsf-phone-species > summary::after { font-size:16px; }
  #hsf-phone-species[open] { width:min(260px,calc(100% - 72px)); }
  #hsf-phone-species[open] #camp-layer-control-panel { display:block; position:static; width:auto; max-width:none; padding:0 10px 8px; border:0; box-shadow:none; }
  #hsf-phone-species .checkbox { margin:0; }
  #hsf-phone-species .checkbox label { padding:8px 0; font-size:13px; min-height:44px; }
  #heat_map .temperature-legend-control, #heat_map .heat-risk-legend-control { display:block !important; left:8px; right:auto; margin:0 !important; width:190px; max-width:calc(100% - 24px); padding:6px; box-sizing:border-box; }
  #heat_map .temperature-legend-control { bottom:23px; }
  #heat_map .heat-risk-legend-control { bottom:84px; }
  #heat_map .temperature-legend-title, #heat_map .heat-risk-legend-neutral,
  #heat_map .heat-risk-description, #heat_map .heat-risk-word, #heat_map .heat-risk-swatch { display:none; }
  #heat_map .temperature-legend-labels { font-size:10px; }
  #heat_map .temperature-legend-labels span:last-child::after { content:' °C'; }
  #heat_map .temperature-legend-ramp { height:8px; }
  #heat_map .heat-risk-legend { width:auto; min-width:0; }
  #heat_map .heat-risk-legend-title { font-size:11px; line-height:1.2; margin-bottom:4px; }
  #heat_map .heat-risk-legend-row { display:block; margin:0; padding:1px 0; font-size:11px; white-space:normal; }
  .hsf-phone-risk-copy::before { content:''; display:inline-block; width:8px; height:8px; box-sizing:border-box; border:1px solid #ad6110; border-radius:50%; margin-right:5px; background:#e68619; }
  .heat-risk-legend-red .hsf-phone-risk-copy::before { background:#c7192f; border-color:#8f1220; }
  #hsf-phone-gesture-help { margin:4px 0; font-size:11px; color:#526149; }
  .map-panel > #map-navigation-controls { position:static; display:grid; grid-template-columns:1fr; width:100%; max-width:none; padding:4px 0; gap:4px; }
  .map-panel > #map-navigation-controls .map-search-row { display:flex; gap:6px; }
  .map-panel > #map-navigation-controls .map-search-row button { width:auto; }
  #hsf-summary-pane { height:auto !important; max-height:none; }
  #alert_summary .forecast-summary-count-card { display:none; }
  #alert_summary .forecast-summary-strip { padding:0; border:0; background:transparent; box-shadow:none; }
  #alert_summary .hsf-summary-toggle { display:flex; align-items:center; gap:8px; font-size:14px; font-weight:700; line-height:20px; min-height:44px; padding:10px 0; margin:0; }
  #alert_summary .hsf-summary-sign, #hsf-forecast-details > summary::after { font-size:20px; font-weight:700; line-height:1; }
  .app-shell > .simulation-toggle-control { margin:0; padding:4px 0; border:0; }
  .app-shell > .simulation-toggle-control label { min-height:44px; display:flex; align-items:center; font-size:14px; }
  #hsf-forecast-details #forecast-source-details { padding:8px; margin:0; font-size:12px; }
  /* Short alert cards, without hiding observations or changing the priorities. */
  .camps-alert-status-section { padding:8px; }
  #alert-status-heading { display:none; }
  .camps-alert-status-section .risk-legend { margin:0; gap:5px; }
  .camps-alert-status-section .risk-item { min-height:0 !important; padding:7px; gap:8px; }
  .camps-alert-status-section .risk-item strong { font-size:14px; }
  .camps-alert-status-section .risk-item .risk-copy span { font-size:12px; }
  .camps-alert-status-section .risk-count-module { padding:2px 4px; min-width:65px; background:transparent; border:0; }
  .risk-count-module small { display:none; }
  .risk-count-module b { font-size:13px; }
  .camps-alert-overview { gap:4px; margin-bottom:0; padding-bottom:0; }
  .camps-alert-introduction { padding:0; margin:0; }
  .camps-alert-introduction .hsf-summary-toggle { min-height:44px; margin:0; padding:8px 0; font-size:14px; }
  #hsf-interpretation { margin-bottom:8px; }
  #hsf-interpretation .camp-prioritisation-guide { padding:0 0 10px; margin:0; border:0; }
  #hsf-interpretation h2, .heading-interpretation-link { display:none; }
  .camps-on-alert-page .section-heading-row { gap:8px; margin:10px 0; }
  .camps-on-alert-page .section-heading-row h2 { margin:0; }
  .camps-on-alert-page .alert-table-download { min-height:44px; padding:8px 12px; font-size:13px; }
  .hsf-camp-filters { display:block; margin:10px 0 4px; }
  .hsf-camp-filters > :not(:first-child) { display:none; }
  .hsf-phone-risk-filter { display:flex; gap:8px; border:0; margin:0 0 8px; padding:0; flex-wrap:wrap; }
  .hsf-phone-risk-filter legend { font-size:13px; font-weight:700; border:0; padding:0; margin:0; }
  .hsf-phone-risk-filter label { display:flex; align-items:center; gap:6px; min-height:44px; margin:0; padding:0 10px; background:#f5f6f2; border:1px solid #c6cec1; border-radius:4px; font-size:14px; }
  #hsf-camp-filter-status:empty { display:none; }
  .sites11a-alert-table tbody td { padding:10px; }
  .sites11a-alert-table .sites11a-alert-forecast-cell > div { font-size:14px; line-height:1.4; margin:3px 0; overflow-wrap:normal; }
  .sites11a-alert-forecast-cell > .hsf-mobile-cell-heading { font-size:16px; }
  /* Camp selection remains the first task on the reporting page. */
  .sites11a-report-observations-title { margin:0 0 8px; }
  .sites11a-unified-camp-map { padding:10px; }
  .sites11a-map-heading-row { margin-bottom:8px; }
  .sites11a-map-heading-row .sites11a-card-kicker { font-size:14px; letter-spacing:0; text-transform:none; margin:0 0 4px; }
  .sites11a-map-heading-row p:not(.sites11a-card-kicker) { display:none; }
  .sites11a-map-search-shell { padding:8px; margin-bottom:8px; }
  .sites11a-map-search > label { font-size:13px; line-height:1.4; margin-bottom:6px; }
  .sites11a-map-search > div { display:flex; gap:6px; }
  .sites11a-map-search .form-group { flex:1; min-width:0; margin:0; }
  #sites11a_search_submit { width:auto; flex:none; padding:8px; min-width:70px; font-size:13px; }
  #sites11a_finder_map { height:calc(100svh - 210px) !important; min-height:430px; max-height:720px; }
  .sites11a-report-observations-introduction { margin-top:6px; }
  .sites11a-report-observations-image { display:none; }
  .sites11a-map-below-actions { margin-top:8px; }
  .sites11a-map-below-actions button { min-height:44px; padding:10px; font-size:12px; }
  .sites11a-map-below-actions p { font-size:12px; margin:6px 0 0; }
  /* Logo accompanies the address; no second large block below the donation. */
  .sites11a-footer-information.footer-information-panel { display:block; padding:16px; }
  .footer-address h2 { margin:0 0 12px; font-size:22px; padding-bottom:12px; }
  .footer-address address { position:relative; min-height:125px; padding:0 84px 12px 0; margin:0 0 12px; font-size:13px; line-height:1.6; }
  .sites11a-footer-information address img.footer-forecaster-logo { position:absolute; right:0; bottom:15px; width:78px; max-width:78px; height:auto; margin:0; }
  .footer-address h3 { margin:0 0 4px; padding:0; font-size:14px; }
  .footer-donate-link { font-size:14px; overflow-wrap:anywhere; }
}

/* One radio group moves between the desktop sidecar and phone legend. */
.temperature-filter-control { margin:0 0 9px; min-width:0; }
.temperature-filter-control .shiny-input-container { width:100% !important; margin:0; }
.temperature-filter-control .control-label { display:block; margin:0 0 5px; font-size:13px; font-weight:700; }
.temperature-filter-control .shiny-options-group { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; }
.temperature-filter-control label.radio-inline { display:flex; align-items:center; justify-content:center;
  gap:4px; min-height:36px; margin:0; padding:3px; box-sizing:border-box; white-space:nowrap;
  border:1px solid #a7b29f; background:#fff; font-size:12px; line-height:1.2; cursor:pointer; }
.temperature-filter-control label.radio-inline + label { border-left:0; }
.temperature-filter-control label.radio-inline:first-child { border-radius:3px 0 0 3px; }
.temperature-filter-control label.radio-inline:last-child { border-radius:0 3px 3px 0; }
.temperature-filter-control label.radio-inline:has(input:checked) { background:#e9eee3; font-weight:700; }
.temperature-filter-control label.radio-inline:focus-within { outline:3px solid #8b1933; outline-offset:-3px; }
.temperature-filter-control label.radio-inline input { position:static; width:14px; height:14px; margin:0;
  flex:0 0 14px; accent-color:#617454; }

/* Combined phone-map review, 2 November. */
@media (max-width:767px) {
  body.sites11a-forecast-active .sites11a-forecast-page #heat_map,
  #heat_map.leaflet-touch-drag, #sites11a_finder_map.leaflet-touch-drag {
    touch-action:none; overscroll-behavior:contain;
  }
  .map-wrap #interactive-frame-label { display:none !important; }
  #heat_map .leaflet-tooltip { display:none !important; }
  #hsf-phone-legend { display:block; position:absolute; left:8px; bottom:var(--hsf-map-bottom,18px); z-index:750;
    width:min(196px, calc(100% - 120px)); box-sizing:border-box; padding:7px 8px; background:#fff; color:#34422f;
    box-shadow:0 1px 5px #0003; border:1px solid #d8ded5; }
  #hsf-phone-legend, #hsf-phone-legend * { pointer-events:none !important; user-select:none; }
  #hsf-phone-legend .temperature-filter-control,
  #hsf-phone-legend .temperature-filter-control * { pointer-events:auto !important; }
  #hsf-phone-legend .temperature-filter-control { margin:6px 0 0; padding-top:5px; border-top:1px solid #d8ded5; }
  #hsf-phone-legend .temperature-filter-control .control-label { position:absolute; width:1px; height:1px;
    padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
  #hsf-phone-legend .temperature-filter-control label.radio-inline { min-height:44px; gap:3px; padding:2px; font-size:12px; }
  #heat_map #hsf-phone-legend .leaflet-control { position:static; float:none; left:auto; right:auto; bottom:auto;
    padding:0; margin:0 !important; width:100%; max-width:none; box-sizing:border-box;
    border:0; background:transparent; box-shadow:none; visibility:visible; }
  #hsf-phone-legend .heat-risk-legend, #hsf-phone-legend .temperature-legend {
    width:100%; min-width:0; max-width:none; padding:0; margin:0; box-sizing:border-box;
    background:transparent; border:0; box-shadow:none;
  }
  #hsf-phone-legend .temperature-legend { margin-top:5px; }
  #hsf-phone-legend .heat-risk-legend-title { font-size:12px; line-height:1.25; }
  #heat_map .leaflet-control-attribution { max-width:calc(100% - 214px); font-size:9px; line-height:1.2; text-align:right; white-space:normal; }
  #heat_map .hsf-locate-control { margin-left:12px; margin-top:8px; }
  #hsf-phone-species > summary { box-sizing:border-box; min-height:44px; height:44px; padding:6px 8px; }
  #hsf-phone-species .checkbox label { box-sizing:border-box; min-height:44px; padding:10px 0; }
  #hsf-phone-map-type { display:flex; position:absolute; z-index:800; right:8px; bottom:var(--hsf-map-bottom,18px);
    align-items:center; height:44px; padding:6px 8px; box-sizing:border-box; margin:0;
    border:1px solid #c6cec1; border-radius:3px; background:#fff; box-shadow:0 1px 5px #0003;
    color:#34422f; font-size:12px; font-weight:700; cursor:pointer; }
  #hsf-phone-map-type select { position:absolute; inset:0; width:100%; height:100%; opacity:0;
    margin:0; padding:0; font-size:16px; cursor:pointer; }
  #hsf-phone-map-type:focus-within { outline:3px solid #8b1933; outline-offset:2px; }
  .map-basemap-control { display:none; }
  .map-panel > #map-navigation-controls .map-search-control { min-width:0; }
  .map-panel > #map-navigation-controls .map-search-row { width:100%; min-width:0; }
  .map-search-row .shiny-input-container { flex:1 1 0; width:auto !important; min-width:0; margin:0; }
  .map-search-row input.form-control, #sites11a_camp_search { font-size:16px !important; width:100%; min-width:0; min-height:44px; height:44px; box-sizing:border-box; }
  .map-search-row button { flex:0 0 auto; min-width:65px; padding:6px 9px; box-sizing:border-box; }
  .app-shell > .simulation-toggle-control { margin:0; padding:4px 0; }
  .app-shell > .simulation-toggle-control label { gap:7px; padding:0; }
  .app-shell > .simulation-toggle-control input[type=checkbox] { position:static; align-self:center; margin:0; flex:none; width:18px; height:18px; }
  #hsf-phone-camp-detail { position:fixed; z-index:2200; box-sizing:border-box; padding:12px;
    background:#fff; border:1px solid #b7c3af; border-radius:8px; box-shadow:0 4px 24px #0005;
    color:#34422f; font-family:inherit; line-height:1.3; }
  #hsf-phone-camp-detail .camp-popup { width:100%; max-width:none; max-height:none; overflow:visible; }
  #hsf-phone-camp-detail .popup-header { margin:0 40px 6px 0; gap:5px; flex-wrap:nowrap; align-items:flex-start; }
  #hsf-phone-camp-detail .popup-title { font-size:16px; line-height:1.2; flex:1 1 auto; }
  #hsf-phone-camp-detail .popup-risk-badge { font-size:10px; padding:4px; }
  #hsf-phone-camp-detail .hsf-camp-row { display:flex; align-items:baseline; justify-content:space-between;
    gap:6px; margin:4px 0; font-size:12px; }
  #hsf-phone-camp-detail .hsf-camp-row strong { flex:none; font-size:11px; }
  #hsf-phone-camp-detail .hsf-camp-row span { min-width:0; text-align:right; overflow-wrap:anywhere; }
  #hsf-phone-camp-detail .popup-mini-plot { margin-top:8px; width:100%; height:auto; }
  #hsf-phone-camp-detail .popup-dashboard-link { margin-top:6px; }
  #hsf-phone-camp-detail .popup-dashboard-link .button { display:block; box-sizing:border-box; min-height:44px;
    padding:12px 8px; text-align:center; font-size:13px; line-height:20px; }
  #hsf-phone-camp-detail .hsf-camp-close { position:absolute; top:2px; right:2px; width:44px; height:44px;
    padding:0; border:0; background:transparent; font-size:26px; color:#34422f; cursor:pointer; }
  #hsf-phone-camp-detail.hsf-short-popup .hsf-camp-secondary { display:none; }
  #hsf-phone-camp-detail.hsf-short-popup .popup-mini-plot { max-height:120px; }
}

@media (max-width:767px) { .hsf-phone-modes label { flex:1 1 0; min-width:0; box-sizing:border-box; } }
