/* 9.53: a scrollable mobile workspace with no controls on top of Earth. */
.mobileEarthPanelSlot[hidden]{display:none!important}
@media(max-width:720px){
 body.earth-mode .layout>.center{
  display:flex!important;flex-direction:column;align-items:stretch;gap:14px;
  inset:0;height:100svh;height:100dvh;min-height:0;width:100%;max-width:none;
  margin:0;border-radius:0;box-sizing:border-box;
  padding:calc(12px + env(safe-area-inset-top,0px)) 16px calc(12px + env(safe-area-inset-bottom,0px));
  overflow-y:auto!important;overflow-x:hidden;overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;scroll-padding:16px;
 }
 body.earth-mode .center>.hero{flex:none;width:100%;box-sizing:border-box;padding:44px 0 0!important;z-index:25}
 body.earth-mode .hero>.fullWorkspaceBrand{top:0;left:0}
 body.earth-mode .hero .eyebrow{font-size:9px;letter-spacing:2px;margin-top:6px}
 body.earth-mode .hero h1{font-size:clamp(22px,6.2vw,28px);line-height:1.2;margin:5px 0}
 body.earth-mode .hero p{display:block;font-size:12px;line-height:1.5;margin:6px auto;max-width:32em}
 body.earth-mode .hero .earthFullscreenTheme{margin-top:8px}
 body.earth-mode .fullMarketSearch{max-width:none;width:100%;margin:12px 0 0;box-sizing:border-box;min-height:46px;border-radius:14px}
 body.earth-mode .fullMarketSearch input{font-size:16px;padding:11px 12px}
 body.earth-mode .fullMarketSearch>button{width:44px;flex:none;min-height:44px}
 body.earth-mode #fullMarketResults{max-height:40dvh;overscroll-behavior:contain}
 body.earth-mode .center>.fullWorkspaceExit{position:absolute;top:calc(10px + env(safe-area-inset-top,0px));right:14px;width:44px;height:44px;z-index:30}
 body.earth-mode .center>.globeWrap{
  flex:none;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));
  grid-template-rows:auto auto auto auto auto auto;align-items:start;
  min-height:0;height:auto;width:100%;max-width:100%;gap:12px 10px;padding:0;
 }
 body.earth-mode .globeWrap>.fullMarketReopen{position:static!important;grid-column:1/-1;grid-row:1;justify-self:start;max-width:100%;min-height:44px;padding:10px 14px;font-size:12px;border-radius:12px;white-space:normal;text-align:left}
 body.earth-mode .globeWrap>.earthStage{
  grid-column:1/-1;grid-row:2;position:relative;height:clamp(240px,80vw,430px)!important;
  min-height:0;width:100%;padding:0;margin:0;overflow:visible;
 }
 body.earth-mode .globeWrap>.fullMarketCard{
  position:relative!important;inset:auto!important;grid-column:1/-1;grid-row:3;
  width:100%;max-width:100%;height:auto;max-height:none!important;overflow:visible;
  padding:16px;border-radius:18px;scrollbar-gutter:auto;box-shadow:0 8px 24px #102c4010;
  background:#102738!important;scroll-margin:16px;
 }
 body[data-theme=light].earth-mode .globeWrap>.fullMarketCard{background:#fff!important}
 body.earth-mode .fullCardHead{gap:12px;min-height:44px}
 body.earth-mode .fullCardHead>button{min-height:44px;min-width:44px;font-size:24px;line-height:1}
 body.earth-mode .fullMarketCard h3{font-size:22px;margin:6px 0}
 body.earth-mode .fullMarketCard p{font-size:13px;line-height:1.6}
 body.earth-mode .fullMarketCard small{font-size:12px;line-height:1.5}
 body.earth-mode .fullMarketCard .fullQuote{flex-wrap:wrap}
 body.earth-mode .fullMarketCard .fullQuote strong{font-size:28px}
 body.earth-mode .fullMarketCard .fullQuote span{font-size:14px}
 body.earth-mode .fullMarketCard button{min-height:44px;padding:9px 12px}
 body.earth-mode .fullMarketCard .fullChartRanges button{flex:1}
 body.earth-mode .fullMarketCard .marketQuickSwitch select{font-size:16px;min-height:44px}
 body.earth-mode .fullMarketCard .fullCardDismissHint{display:none}
 body.earth-mode .globeWrap>.earthActionDock,body.earth-mode .globeWrap>.earthFullQuality{
  position:static!important;inset:auto!important;grid-row:4;align-self:start;
  width:100%!important;height:auto;margin:0!important;padding:0!important;min-width:0;
  background:transparent!important;backdrop-filter:none;border:0;z-index:auto;
 }
 body.earth-mode .globeWrap>.earthActionDock{grid-column:1;justify-self:stretch}
 body.earth-mode .globeWrap>.earthFullQuality{grid-column:2;justify-self:stretch}
 body.earth-mode .globeWrap .earthPanelToggle{min-height:48px;height:48px;font-size:12px;border-radius:14px}
 body.earth-mode .globeWrap>.mobileEarthPanelSlot{grid-column:1/-1;grid-row:5;min-width:0}
 body.earth-mode .mobileEarthPanelSlot>.earthPanelPopover{
  position:static!important;inset:auto!important;width:100%;max-width:none;max-height:none;
  margin:0;padding:16px;box-sizing:border-box;border-radius:18px;overflow:visible;
  background:#102738;backdrop-filter:none;box-shadow:0 8px 24px #102c4010;
 }
 body[data-theme=light].earth-mode .mobileEarthPanelSlot>.earthPanelPopover{background:#fff}
 body.earth-mode .earthPanelHeading{min-height:44px;margin:0 0 10px}
 body.earth-mode .earthPanelHeading .earthPanelCaption{font-size:14px;font-weight:600;color:var(--text)}
 body.earth-mode .earthPanelClose{min-height:44px!important;width:44px;font-size:25px!important}
 body.earth-mode .mobileEarthPanelSlot .earthNavRow{display:grid!important;grid-template-columns:2fr 1fr 1fr;gap:8px;width:100%}
 body.earth-mode .mobileEarthPanelSlot #home{grid-column:1/-1}
 body.earth-mode .mobileEarthPanelSlot #earthMode{display:none}
 body.earth-mode .mobileEarthPanelSlot button{min-height:46px;font-size:13px;padding:10px;border-radius:12px;cursor:pointer}
 body.earth-mode .mobileEarthPanelSlot .earthNavRow button,body.earth-mode .mobileEarthPanelSlot .earthQualityBar button{border:1px solid var(--line);background:#18384b;color:var(--text)}
 body.earth-mode .mobileEarthPanelSlot .earthQualityBar button[aria-pressed=true]{border-color:#67b7c5;background:#226070}
 body[data-theme=light].earth-mode .mobileEarthPanelSlot .earthQualityBar{background:#edf4f5;border-color:#88a9b2}
 body[data-theme=light].earth-mode .mobileEarthPanelSlot .earthNavRow button,body[data-theme=light].earth-mode .mobileEarthPanelSlot .earthQualityBar button{color:#204650!important;background:#edf4f5;border-color:#88a9b2}
 body[data-theme=light].earth-mode .mobileEarthPanelSlot .earthQualityBar button[aria-pressed=true]{background:#cce5e9;border-color:#589ca6}
 body.earth-mode .mobileEarthPanelSlot .earthDisplayStack{display:flex;flex-wrap:wrap;gap:8px}
 body.earth-mode .mobileEarthPanelSlot .earthQualityBar{display:flex;flex-basis:100%;width:100%;gap:6px;box-sizing:border-box}
 body.earth-mode .mobileEarthPanelSlot .earthQualityBar button{flex:1;min-width:0;min-height:46px;font-size:13px}
 body.earth-mode .mobileEarthPanelSlot .earthCloudQuick,body.earth-mode .mobileEarthPanelSlot #earthHDR{flex:1;width:auto;min-height:46px}
 body.earth-mode .earthDockNotes{grid-column:1/-1;grid-row:6;display:flex;flex-direction:row;justify-content:center;flex-wrap:wrap;gap:8px;padding:0;margin:0}
 body.earth-mode .earthDockNotes .quickGlobePause{margin:0;min-height:44px;font-size:12px;border-radius:12px}
 body.earth-mode .earthDockNotes .globeExplain{margin:0;min-height:44px;font-size:12px;border-radius:12px;padding:9px 12px}
 body.earth-mode .earthDockNotes .mapInfo{flex-basis:100%;max-width:100%;position:static!important;max-height:none;box-sizing:border-box}
 body.earth-mode .earthDockNotes .mapInfo summary{min-height:44px;display:grid;place-items:center;font-size:12px}
 body.earth-mode .center>.ticker{position:relative!important;inset:auto!important;flex:none;width:100%;max-width:100%;margin:0;min-height:40px;grid-row:auto;border-radius:12px}
}

/* 9.54: readable navigation and chart tools at phone widths. */
@media(max-width:720px){
 .layout>.left>.navpanel{justify-content:flex-start;scroll-padding-inline:10px;border-radius:16px;scrollbar-width:thin}
 .layout>.left>.navpanel .navitem,.layout>.left>.navpanel button.navitem{
  width:auto!important;max-width:none;flex:0 0 auto;min-width:0;padding:10px 12px;gap:8px;
 }
 .layout>.left>.navpanel .navitem .navLabel{white-space:nowrap}
 .topright .languageSelect{max-width:140px;min-height:44px;font-size:14px}
 .modalbox,.modalContent,.stockGraph,.graph{min-width:0;max-width:100%;box-sizing:border-box}
 .stockGraphHeading{align-items:flex-start;gap:10px}
 .stockGraphHeading strong{min-width:0;overflow-wrap:anywhere;flex:1 1 140px;font-size:16px}
 .stockGraphHeading #stockFullscreen{flex:0 1 auto;max-width:100%;min-height:44px;white-space:normal}
 .chartTools{width:100%;min-width:0;gap:10px;align-items:stretch}
 .chartTools .types{display:flex;flex-wrap:wrap;gap:6px;max-width:100%}
 .chartTools .types button{min-height:44px}
 .chartTools .ranges{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;width:100%;max-width:100%;min-width:0}
 .chartTools .ranges button{width:100%;min-width:0;min-height:44px;margin:0;padding:8px 3px;font-size:12px;white-space:nowrap;box-sizing:border-box}
 .chartTools .hintWrap{flex:0 0 auto}
 .stockGraph .orbitTradingChart{width:100%;min-width:0;max-width:100%;height:clamp(320px,55dvh,480px)}
 .stockGraphExpanded,.stockGraph:fullscreen{padding:calc(12px + env(safe-area-inset-top,0px)) 12px calc(12px + env(safe-area-inset-bottom,0px));max-width:100vw!important;overscroll-behavior:contain}
 .stockGraph .stockWindowButtons button{min-height:44px;flex:1 1 100px}
 .stockGraph .stockWindowSlider{flex-wrap:wrap;gap:8px}
 .stockGraph .stockWindowSlider input{flex:1 1 100%;min-width:0;width:100%}
 .stockGraph .stockIndicatorTools label{max-width:100%;flex-wrap:wrap}
 .stockGraph .stockIndicatorTools select{max-width:100%;min-height:44px;font-size:16px}
 .stockGraph .stockChartDetails{max-width:100%;box-sizing:border-box}
 .stockGraph .stockChartDetails .cards{grid-template-columns:1fr}
}

/* Three matching controls at the lower right, with rotation always visible. */
.fullSpinControl[hidden]{display:none!important}
body.earth-mode .globeWrap>.earthActionDock{bottom:calc(var(--dock-bottom,70px) + 104px)!important}
body.earth-mode .globeWrap>.earthFullQuality{bottom:calc(var(--dock-bottom,70px) + 52px)!important}
body.earth-mode .globeWrap>.fullSpinControl{
 position:absolute;right:0;bottom:var(--dock-bottom,70px);grid-column:1;grid-row:1;
 display:flex;justify-content:center;width:148px;height:44px;margin:0;padding:0;
 z-index:18;pointer-events:auto;box-sizing:border-box;
}
body.earth-mode .fullSpinControl #spin{
 display:flex;align-items:center;justify-content:center;gap:7px;width:100%;height:44px;
 min-height:44px;padding:8px 12px;box-sizing:border-box;border:1px solid var(--line);
 border-radius:12px;background:#1027389c;color:var(--text);font:inherit;font-size:11px;
 cursor:pointer;backdrop-filter:blur(12px);box-shadow:none;white-space:nowrap;
}
body.earth-mode .fullSpinControl #spin:focus-visible{outline:2px solid #59b6c8;outline-offset:3px}
body[data-theme=light].earth-mode .fullSpinControl #spin{background:#ffffffa8;color:#244d59;border-color:#86a7b555}
@media(max-width:720px){
 body.earth-mode .center>.globeWrap{grid-template-rows:repeat(8,auto)}
 body.earth-mode .globeWrap>.earthActionDock{grid-column:1/-1;grid-row:4}
 body.earth-mode .globeWrap>.earthFullQuality{grid-column:1/-1;grid-row:5}
 body.earth-mode .globeWrap>.fullSpinControl{position:static;grid-column:1/-1;grid-row:6;width:100%;height:48px}
 body.earth-mode .fullSpinControl #spin{height:48px;min-height:48px;border-radius:14px;font-size:12px}
 body.earth-mode .globeWrap>.mobileEarthPanelSlot{grid-row:7}
 body.earth-mode .earthDockNotes{grid-row:8}
}

/* 9.75: one viewport owner and one mobile scroll surface in Safari. */
@media(max-width:720px){
 html.earth-workspace-open{overflow:hidden!important}
 body.earth-mode{position:fixed!important;inset:0;width:100%;height:100%;overflow:hidden!important}
 body.earth-mode>.top,body.earth-mode>.homeOverview,
 body.earth-mode>.siteFooter,body.earth-mode>.supportFooter,
 body.earth-mode .layout>.left,body.earth-mode .layout>.right{display:none!important}
 body.earth-mode>.layout{position:fixed!important;inset:0!important;display:block!important;
  width:100%;max-width:none;height:100vh;height:100dvh;min-height:0;margin:0;padding:0;
  overflow:hidden;z-index:100;box-sizing:border-box}
 body.earth-mode .layout>.center{position:absolute!important;inset:0!important;
  width:100%!important;height:100%!important;max-height:none!important;min-height:0!important;
  overflow-y:auto!important;overflow-x:hidden!important;backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;isolation:isolate}
 .stocks-table-open .modalbox{min-width:0;max-width:calc(100vw - 16px);max-height:calc(100dvh - 24px);overscroll-behavior:contain}
 .stocks-table-open #modalContent{min-width:0;max-width:100%;overflow-wrap:anywhere}
 .stocks-table-open .stocksToolbar{display:flex;flex-wrap:wrap;min-width:0;gap:8px}
 .stocks-table-open .stocksToolbar input{flex:1 1 100%;width:100%;min-width:0;max-width:100%;box-sizing:border-box;font-size:16px;min-height:44px}
 .stocks-table-open .stocksToolbar .refreshData{min-height:44px;margin:0}
 .stocks-table-open .stStatus{min-width:0;max-width:100%;box-sizing:border-box;white-space:normal;overflow-wrap:anywhere}
 .stocks-table-open .stFilters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .stocks-table-open .stFilters label{min-width:0}
 .stocks-table-open .stFilters select{min-width:0;width:100%;max-width:100%;font-size:16px;min-height:44px;box-sizing:border-box}
 .stocks-table-open .stFilters>span{grid-column:1/-1;min-width:0}
 .stocks-table-open .stScroll{width:100%;max-width:100%;min-width:0;box-sizing:border-box;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
}

/* 9.81: moving market labels avoid expensive backdrop sampling on phones. */
@media(max-width:720px){
 .globe .point label{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#0a1b29f2!important}
 .globe .point:not(.selectedPoint):after{animation:none!important;opacity:.15}
}