
      .mydash-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
      .mydash-card{grid-column:span 4;background:#fff;border:1px solid var(--gray-m);border-radius:10px;padding:14px 16px;box-sizing:border-box;position:relative;min-width:0}
      .mydash-w2{grid-column:span 4}.mydash-w4{grid-column:span 12}
      @media(max-width:1150px){.mydash-card,.mydash-w2{grid-column:span 6}.mydash-w4{grid-column:span 12}}
      @media(max-width:720px){
        /* ── Wave 3u.2 — TRUE MOBILE APP dashboard, not shrunk desktop ── */
        .mydash-card,.mydash-w2,.mydash-w4{grid-column:span 12!important}
        .mydash-grid{gap:10px}
        /* App header: clean dark band — banner + hero logo OFF on phones */
        #myDashHero{padding:14px 14px 12px!important}
        #myDashHeroBg,#myDashHeroShade,#myDashLogo{display:none!important}
        #myDashHero h1{font-size:20px!important}
        #myDashClock{font-size:10.5px!important}
        /* Quick actions: bell + customize hidden (topbar bell / long-press
           editing replace them); MY TASKS becomes a labeled pill */
        #myDashQiBell,#myDashQiCfg{display:none!important}
        #myDashQiTasks{width:auto;padding:0 14px;gap:7px;border-radius:11px;height:36px}
        #myDashQiTasks .mdqt{display:inline!important}
        /* Welcome pill FIRST, My Tasks pill to its RIGHT (phones) */
        #myDashProfileBtn{background:rgba(255,255,255,.18);cursor:pointer!important;order:-1}
        #myDashProfileChev{display:inline!important}
        #myDashAvatar{width:36px!important;height:36px!important;font-size:12px!important}
        .mydash-card{padding:12px 12px}
        /* Module cards -> app launcher TILES, two-up */
        .mydash-card.mydash-modcard{grid-column:span 6!important;padding:14px 8px 12px}
        .mydash-modcard>div{flex-direction:column!important;align-items:center!important;text-align:center;gap:7px!important}
        .mydash-modcard .ti-arrow-right{display:none}
        .mydash-modcard .mydash-sub{display:none}
        .mydash-card{overflow:hidden}
        .mydash-card *{min-width:0;max-width:100%}
        .mydash-card [style*="white-space:nowrap"]{white-space:normal!important}
        .mydash-modcard>div>div{overflow-wrap:break-word}
        .mydash-modcard [id^="myDashCnt-"]{font-size:19px!important}
        /* Safety tracker -> horizontal swipe strip with snap */
        /* Wave 3u.6: the tracker collapses to a summary KPI; when expanded,
           the count cards are the horizontal snap strip */
        #safetyStripTiles>div{flex-wrap:nowrap!important;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;padding-bottom:6px}
        #safetyStripTiles>div>div{min-width:132px!important;flex:0 0 auto!important;scroll-snap-align:start}
        /* Weather forecast fits */
        #myDashW-weather-body{overflow:hidden}
      }
      /* Topbar on phones: logos + favorites + quick add + bell + sign out
         ONLY (instance & account moved to the dashboard profile pill; the
         hamburger is redundant now that the bottom bar's More opens the
         module drawer — hide it for breathing room) */
      @media(max-width:700px){
        .client-select,#fullscreenBtn,#appRefreshBtn,#myAccountBtn,.topbar-navtoggle{display:none!important}
      }
      .mydash-qi{width:38px;height:38px;border-radius:10px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.14);color:#fff;cursor:pointer;font-size:17px;display:inline-flex;align-items:center;justify-content:center}
      .mydash-qi:hover{background:rgba(255,255,255,.28)}
      .mydash-title{font-size:11.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;display:flex;align-items:center;gap:6px}
      .mydash-modcard{cursor:pointer;transition:border-color .12s, box-shadow .12s}
      .mydash-modcard:hover{border-color:var(--blue);box-shadow:0 2px 8px rgba(28,92,156,.12)}
    