@media (max-width: 639px) {
  body.mobile-panel-open { overflow: hidden; }
  body.mobile-panels .toolbar { display: flex !important; flex-direction: column; align-items: stretch !important; gap: 0 !important; padding: 0 !important; }
  body.mobile-panels .toolbar > .view-switch { margin: 8px 10px 0; align-self: flex-start; max-width: calc(100% - 20px); }
  body.mobile-panels .toolbar > .count { display: none !important; }
  .mobile-panel-bar { display: flex; gap: 6px; padding: 8px 10px; background: #1b2024; }
  .mobile-panel-bar button { flex: 1; min-width: 0; height: 38px; padding: 0 4px; border: 1px solid #465058; border-radius: 6px; background: #ffffff08; color: #e6eceb; font: 500 12px system-ui, sans-serif; white-space: nowrap; }
  .mobile-panel-bar button[aria-expanded=true] { background: #b8d7eb; border-color: #b8d7eb; color: #172125; }
  body:not([data-view=graph]) .mobile-graph-only { display: none; }
  .mobile-panel-backdrop { position: fixed; inset: 0; z-index: 9990; background: #0008; }
  .mobile-panel { box-sizing: border-box; position: fixed; top: 58px; right: 0; bottom: 0; z-index: 9991; display: flex; flex-direction: column; width: min(80vw, 312px); max-width: 100%; overflow: hidden; background: #1b2024; color: #e6eceb; border: 1px solid #465058; border-right: 0; border-bottom: 0; border-radius: 14px 0 0 0; box-shadow: -12px 0 40px #0008; }
  .mobile-panel[hidden], .mobile-panel-backdrop[hidden] { display: none !important; }
  .mobile-panel-head { display: flex; flex: none; align-items: center; justify-content: space-between; min-height: 56px; padding: 0 16px; border-bottom: 1px solid #465058; }
  .mobile-panel-head strong { font: 600 16px system-ui, sans-serif; color: #f2f5f2; }
  .mobile-panel-close { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 1px solid #65727b; border-radius: 8px; background: #ffffff0a; color: #e9eeee; font: 26px/1 Arial, sans-serif; }
  .mobile-panel-content { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 16px 16px max(20px, env(safe-area-inset-bottom)); color: #dbe3df; }
  .mobile-field { display: grid; gap: 6px; margin-bottom: 14px; }
  .mobile-field > span { font: 11px system-ui, sans-serif; color: #a9b8b3; }
  .mobile-field label { display: block; width: 100%; }
  .mobile-field input[type=search], .mobile-field select { box-sizing: border-box; width: 100%; min-height: 42px; padding: 8px 10px; background: #101719; color: #e9eeee; border: 1px solid #4a5a5b; border-radius: 6px; font: 14px system-ui, sans-serif; }
  .mobile-field .search { display: flex; align-items: center; gap: 7px; }
  .mobile-field .search input { flex: 1; min-width: 0; }
  .mobile-field .search kbd { display: none; }
  .mobile-panel-content .graph-controls, .mobile-panel-content .graph-navigation, .mobile-panel-content .graph-info { display: flex !important; position: static !important; width: auto !important; max-width: none !important; max-height: none !important; overflow: visible !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; font-size: 13px !important; gap: 11px !important; }
  .mobile-panel-content .graph-info { display: block !important; }
  .mobile-panel-content .graph-size-switch { grid-template-columns: 1fr 1fr; gap: 8px; }
  .mobile-panel-content .graph-controls label { min-height: 30px; }
  .mobile-panel-content .graph-controls input { width: 18px; height: 18px; accent-color: #abd0e7; }
  .mobile-panel-content .graph-controls small { line-height: 1.5; color: #aab8bc; }
  .mobile-map-zoom { position: absolute; right: 12px; bottom: 12px; z-index: 8; display: flex; gap: 3px; padding: 4px; background: #172024eb; border: 1px solid #5b686a; border-radius: 7px; }
  .mobile-map-zoom button { display:grid; place-items:center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 4px; background: #ffffff0a; color: #eef4f2; font: 20px/1 system-ui, sans-serif; }
  .poster-navigation small { display:none; }
  .map-controls .scale-notice { position:absolute!important; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
  .poster-viewport > .mobile-map-fullscreen { position:absolute; z-index:8; top:12px; right:12px; display:grid; place-items:center; width:40px; height:40px; padding:0; border:1px solid #5b686a; border-radius:7px; background:#172024eb; color:#eef4f2; font:24px/1 Arial,sans-serif; }
  .mobile-graph-reset { position:absolute; z-index:8; top:12px; right:12px; min-height:40px; padding:0 12px; border:1px solid #5b686a; border-radius:7px; background:#172024eb; color:#eef4f2; font:500 12px/1 system-ui,sans-serif; }
  .mobile-graph-reset[hidden] { display:none; }
  .poster-viewport.is-mobile-fullscreen, .graph-section.is-mobile-fullscreen { position:fixed!important; inset:0!important; z-index:9989; width:100vw!important; height:100dvh!important; max-height:none!important; border:0; }
  body.mobile-map-expanded { overflow:hidden; }
  body.mobile-map-expanded .scrim { z-index:10001; }
  body.mobile-map-expanded .drawer { z-index:10002; }
  body.mobile-map-expanded .toast { z-index:10003; }
}