/* All overrides belong to the phone menu; desktop modules keep their layout. */
#globeMobileSettings:not([open]), #globeMobileSettingsToggle[hidden], .globe-mobile-map-time[hidden] { display:none!important; }
#globeMobileSettings { color-scheme:dark; }
body.globe-mobile-controls { overflow:hidden; }
.globe-mobile-controls .globe-shell { position:fixed; inset:var(--globe-mobile-top,70px) 0 0; width:100%; margin:0; padding:0; }
.globe-mobile-controls .globe-layout { display:block; height:100%; }
.globe-mobile-controls .globe-stage-card { position:absolute; inset:0; min-height:0; border:0; border-radius:0; }
.globe-mobile-controls #globeCanvas, .globe-mobile-controls #globeDetailedMap { height:100%; min-height:0; }
.globe-mobile-controls .globe-toolbar { display:none; }
.globe-mobile-controls .globe-minimap-shell, .globe-mobile-controls .globe-overlay-label { display:none; }
.globe-mobile-controls .maplibregl-ctrl-top-right { top:66px; right:max(4px,env(safe-area-inset-right)); }
.globe-mobile-controls .globe-sidebar { top:8px; right:max(8px,env(safe-area-inset-right)); bottom:max(8px,env(safe-area-inset-bottom)); width:calc(100% - 16px); max-height:none; z-index:36; }
#globeMobileSettingsToggle { position:absolute; top:12px; right:max(12px,env(safe-area-inset-right)); z-index:30; min-height:44px; padding:10px 16px; border:1px solid #666d75; border-radius:10px; background:#15191ef2; color:#f2f3f5; font:700 14px/1.25 system-ui,sans-serif; box-shadow:0 3px 14px #0005; cursor:pointer; }
.globe-mobile-map-time { position:absolute; bottom:max(28px,calc(env(safe-area-inset-bottom) + 14px)); left:max(10px,env(safe-area-inset-left)); z-index:10; max-width:calc(100% - 20px); box-sizing:border-box; padding:6px 9px; border:1px solid #525a64; border-radius:7px; background:#101419e8; color:#e2e6eb; font:600 11px/1.45 system-ui,sans-serif; font-variant-numeric:tabular-nums; pointer-events:none; }
.globe-mobile-controls.globe-drawer-open #globeMobileSettingsToggle, .globe-mobile-controls.globe-drawer-open .globe-mobile-map-time { visibility:hidden; }
#globeMobileSettings { position:fixed; inset:var(--globe-mobile-top,70px) 0 0 auto; margin:0; padding:0; width:min(410px,100%); max-width:100%; height:calc(100% - var(--globe-mobile-top,70px)); max-height:none; box-sizing:border-box; border:0; border-left:1px solid #4b535d; border-radius:14px 0 0 0; background:#11151a; color:#edf0f3; box-shadow:-12px 0 40px #0006; overflow:auto; overscroll-behavior:contain; }
#globeMobileSettings::backdrop { background:#0005; }
.globe-mobile-settings-heading { position:sticky; top:0; z-index:4; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; border-bottom:1px solid #3b434c; background:#191e25; }
.globe-mobile-settings-heading h2 { margin:0; color:#f3f4f6; font:700 19px/1.3 system-ui,sans-serif; }
#globeMobileSettings button, #globeMobileSettings select, #globeMobileSettings input { box-sizing:border-box; color:#eef0f3; accent-color:#d3d9df; }
#globeMobileSettings button, #globeMobileSettings select { min-height:44px; border:1px solid #555e69; border-radius:8px; padding:9px 10px; background:#222830; font:600 13px/1.35 system-ui,sans-serif; }
#globeMobileSettings input:not([type=checkbox]):not([type=hidden]), #globeMobileSettings select { font-size:16px; }
#globeMobileSettings button[aria-pressed=true] { background:#3b4652; border-color:#c3cdd7; color:#fff; }
#globeMobileSettings :focus-visible, #globeMobileSettingsToggle:focus-visible { outline:2px solid #d9e5f2; outline-offset:3px; }
.globe-mobile-settings-content { padding:0 14px max(22px,env(safe-area-inset-bottom)); }
.globe-mobile-settings-group { padding:18px 0; border-bottom:1px solid #343c46; }
.globe-mobile-settings-group[hidden] { display:none; }
.globe-mobile-settings-group:last-child { border:0; }
.globe-mobile-settings-group>h3 { margin:0 0 12px; color:#c5ced8; font:700 12px/1.4 system-ui,sans-serif; letter-spacing:.07em; text-transform:uppercase; }
#globeMobileSettings .globe-control-cluster { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:9px; width:100%; padding:0; border:0; background:none; box-shadow:none; }
#globeMobileSettings .globe-control-cluster>* { min-width:0; margin:0; grid-column:span 3; }
#globeMobileSettings .globe-control-cluster>[hidden], #globeMobileSettings input[type=hidden] { display:none!important; }
#globeMobileSettings .globe-control-cluster>label { display:grid; gap:6px; font-size:11px; align-self:end; }
#globeMobileSettings .globe-control-cluster label:has(#globeParkScope) { grid-column:1/-1; order:-10; }
#globeMobileSettings .globe-control-cluster label:has(#globeDate) { grid-column:span 4; }
#globeMobileSettings #globePrevDate, #globeMobileSettings #globeNextDate { grid-column:span 1; align-self:end; font-size:18px; padding:6px; }
#globeMobileSettings #globeDate { width:100%; max-width:none; min-height:44px; padding:7px; background:#222830; border:1px solid #555e69; border-radius:8px; }
#globeMobileSettings #globeLeagueFilter { order:-20; grid-column:1/-1; width:100%; min-width:0; margin:0; }
#globeMobileSettings .globe-league-dropdown>summary { min-height:48px; padding:10px; }
#globeMobileSettings .globe-league-menu { position:static!important; inset:auto!important; width:100%!important; max-width:none!important; max-height:none!important; box-sizing:border-box; margin-top:8px; padding:8px; box-shadow:none; }
#globeMobileSettings .globe-league-choice { min-height:44px; }
#globeMobileSettings .globe-league-choice input { width:20px; height:20px; flex:0 0 20px; }
#globeMobileSettings .globe-league-choice small { max-width:42%; white-space:normal; }
#globeMobileSettings .globe-forecast-days, #globeMobileSettings #globeDrawerToggle { grid-column:1/-1; }
#globeMobileSettings .globe-forecast-days { display:flex; flex-wrap:wrap; gap:8px; }
#globeMobileSettings .globe-forecast-days button { flex:1; }
#globeMobileSettings .globe-forecast-days small { width:100%; font-size:11px; line-height:1.5; }
#globeMobileSettings .atmospheric-map-console { position:static; display:block; width:100%; max-width:none; max-height:none; visibility:visible; pointer-events:auto; margin:0; padding:0; border:0; background:none; backdrop-filter:none; overflow:visible; }
#globeMobileSettings .atmospheric-map-console-top { flex-wrap:wrap; gap:8px; }
#globeMobileSettings .atmospheric-map-console-top>div { display:block; width:100%; }
#globeMobileSettings .atmospheric-map-console-top>div>span { display:none; }
#globeMobileSettings .atmospheric-map-console-top strong { font-size:13px; }
#globeMobileSettings .atmospheric-map-console-top span { font-size:10px; line-height:1.5; letter-spacing:.02em; }
#globeMobileSettings .atmospheric-map-controls { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; }
#globeMobileSettings .atmospheric-map-controls [hidden] { display:none; }
#globeMobileSettings .atmospheric-map-time>div { flex-wrap:wrap; }
#globeMobileSettings .atmospheric-map-time strong { white-space:normal; line-height:1.5; }
#globeMobileSettings input[type=range] { height:40px; padding:0; margin:0; width:100%; }
#globeMobileSettings .atmospheric-map-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
#globeMobileSettings .atmospheric-multi-layer-controls { margin-top:14px; padding-top:14px; }
#globeMobileSettings .atmospheric-multi-layer-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
#globeMobileSettings .globe-time-context { display:block; margin:0; padding:0; border:0; background:none; }
#globeMobileSettings .globe-time-selected { display:grid; min-width:0; gap:6px; }
#globeMobileSettings .globe-time-selected strong { font-size:13px; line-height:1.5; }
#globeMobileSettings .globe-time-selected span, #globeMobileSettings .globe-time-selected small { overflow-wrap:anywhere; line-height:1.5; }
#globeMobileSettings .globe-zone-strip { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; width:100%; margin-top:12px; overflow:visible; }
#globeMobileSettings .globe-zone-strip>div { min-width:0; padding:9px; }
#globeMobileSettings .globe-zone-strip small { font-size:10px; }
#globeMobileSettings .globe-light-legend { display:grid; gap:6px; margin-top:12px; }
#globeMobileSettings .globe-data-status { position:static; max-width:none; margin:0; padding:0; background:none; pointer-events:auto; font-size:12px; line-height:1.5; }
@media(prefers-reduced-motion:reduce) { #globeMobileSettings, #globeMobileSettings * { scroll-behavior:auto; } }
