/* VENISIA MOBILE HOTFIX V1 — presentation-only, no data or routing changes. */
@media (max-width: 767px) {
  html, body { max-width: 100%; }
  body.vs-active .app, body.vs-active .main-area, body.vs-active .content,
  body.vs-active main.content { min-width: 0 !important; max-width: 100%; }
  body.vs-active .main-area .topbar { align-items: flex-start; gap: 10px; }
  body.vs-active .main-area .topbar > div { min-width: 0; flex: 1 1 100%; }
  body.vs-active .topbar .pill { white-space: normal; overflow-wrap: anywhere; line-height: 1.6; max-width: 100%; }
  body.vs-active .vs-newsline { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 3px 9px; white-space: normal; line-height: 1.65; }
  body.vs-active .vs-newsline b { flex: 0 0 auto; }
  body.vs-active .vs-newsline span { flex: 1 1 190px; white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
  body.vs-active .alert { white-space: normal; overflow-wrap: anywhere; line-height: 1.7; }
  body.vs-active .content > .intro { padding: 16px !important; overflow: hidden; }
  body.vs-active .content > .intro .eyebrow { font-size: 10px; letter-spacing: 1px; overflow-wrap: anywhere; line-height: 1.6; }
  body.vs-active .content > .intro h1 { line-height: 1.45; overflow-wrap: anywhere; }
  body.vs-active .content > .intro p { overflow-wrap: anywhere; }
  body.vs-active .content > section, body.vs-active .content > div { min-width: 0; max-width: 100%; }
  body.vs-active .metrics { min-width: 0; }
  body.vs-active .metric { min-width: 0; }
  body.vs-active .metric strong { overflow-wrap: anywhere; }
  body.vs-active .table-scroll { max-width: 100%; overflow-x: auto; }
  body.vs-active #vi-page-experience-v4 { min-width: 0; }
  body.vs-active #vi-page-experience-v4 .vi4-hero { min-width: 0; }
  body.vs-active #vi-page-experience-v4 .vi4-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.vs-active #vi-page-experience-v4 .vi4-tile { min-width: 0; }
  body.vs-active #vi-page-experience-v4 .vi4-tile span:last-child { overflow-wrap: anywhere; }
  /* Keep the command search accessible but avoid a large overlay on content. */
  #vi-command-center-v3 { left: max(12px, env(safe-area-inset-left)) !important; bottom: calc(14px + env(safe-area-inset-bottom)) !important; z-index: 10004 !important; }
  #vi-command-center-v3 .vi-launch { width: 46px; height: 46px; padding: 0 !important; border-radius: 15px; justify-content: center; box-sizing: border-box; }
  #vi-command-center-v3 .vi-launch > span:not(:first-child) { display: none !important; }
  #vi-command-center-v3 .vi-launch > span:first-child { line-height: 1; }
  body.vs-active .vs-mobile-toggle { bottom: calc(14px + env(safe-area-inset-bottom)) !important; right: max(12px, env(safe-area-inset-right)) !important; min-height: 46px; min-width: 46px; }
  /* Dashboard already has a real heading and navigation; hide only redundant injected hero on phone. */
  body.vs-active.vs-route-dashboard .vs-motion-hero { display: none !important; }
  body.vs-active.vs-route-dashboard main.content > .intro { margin-top: 16px; }
}
@media (max-width: 370px) {
 body.vs-active #vi-page-experience-v4 .vi4-grid { gap: 8px; }
 body.vs-active #vi-page-experience-v4 .vi4-tile { padding: 9px; gap: 6px; }
}