/* Sigma Dashboard Mobile Reference V1 — mobile-only visual/stability layer. Preserves navigation, routes, permissions, badges and data. */
@media(max-width:900px){
  html,body,#root,.app,.shell,.main{background:#f7f8fa!important}
  .main{min-width:0!important;overflow-x:hidden!important}
  .main>.top{margin:0!important;padding:14px 14px 12px!important;background:#fff!important;border:0!important;border-bottom:1px solid #e8ebef!important;border-radius:0!important;box-shadow:none!important}
  .main>.top h1{margin:0!important;color:#111827!important;font-size:25px!important;line-height:1.05!important;letter-spacing:-.035em!important}
  .main>.top p{margin-top:5px!important;color:#687485!important;font-size:11px!important}
  #body,.content{box-sizing:border-box!important;width:100%!important;max-width:100%!important;padding:10px!important;background:#f7f8fa!important}

  /* Existing role/performance sections remain, but sit on the same clean canvas. */
  #body>.hero,.rd-shell,.panel,.card{box-sizing:border-box}
  #body>.hero{margin:0 0 10px!important;border-radius:16px!important;overflow:hidden!important}

  /* New reference dashboard wrapper. */
  .sdr-shell{width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;background:transparent!important}
  .sdr-kpis{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin:0 0 8px!important;align-items:stretch!important}
  .sdr-kpi{box-sizing:border-box!important;height:92px!important;min-height:92px!important;margin:0!important;padding:12px!important;display:flex!important;align-items:center!important;gap:10px!important;background:#fff!important;border:1px solid #e5e9ee!important;border-radius:14px!important;box-shadow:0 2px 8px rgba(22,34,50,.025)!important;transform:none!important;transition:border-color .15s ease,box-shadow .15s ease!important;overflow:hidden!important}
  .sdr-kpi:hover,.sdr-kpi:active{transform:none!important}
  .sdr-kpi-icon{width:38px!important;height:38px!important;min-width:38px!important;flex:0 0 38px!important;border-radius:50%!important;display:grid!important;place-items:center!important;background:#d72d4e!important;color:#fff!important;font-size:13px!important;font-weight:800!important;box-shadow:none!important}
  .sdr-kpi>div:last-child{min-width:0!important}
  .sdr-kpi span{display:block!important;color:#5e6b7b!important;font-size:9px!important;line-height:1.2!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .sdr-kpi strong{display:block!important;margin-top:3px!important;color:#111827!important;font-size:18px!important;line-height:1!important;letter-spacing:-.03em!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .sdr-kpi small{display:block!important;margin-top:5px!important;color:#7d8794!important;font-size:7px!important;line-height:1.2!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}

  /* Fixed row geometry prevents async data refreshes from making panels jump. */
  .sdr-grid{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;margin:0 0 8px!important;align-items:stretch!important}
  .sdr-grid-top,.sdr-grid-bottom{height:auto!important}
  .sdr-card{box-sizing:border-box!important;width:100%!important;min-width:0!important;margin:0!important;background:#fff!important;border:1px solid #e5e9ee!important;border-radius:14px!important;box-shadow:0 2px 8px rgba(22,34,50,.025)!important;overflow:hidden!important;transform:none!important;transition:border-color .15s ease,box-shadow .15s ease!important}
  .sdr-card:hover,.sdr-card:active{transform:none!important}
  .sdr-grid-top .sdr-card{height:300px!important;min-height:300px!important;max-height:300px!important}
  .sdr-grid-bottom .sdr-card:first-child{height:245px!important;min-height:245px!important;max-height:245px!important}
  .sdr-grid-bottom .sdr-card:last-child{height:260px!important;min-height:260px!important;max-height:260px!important}
  .sdr-card>header{box-sizing:border-box!important;height:46px!important;min-height:46px!important;padding:0 12px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;background:#fff!important;border-bottom:1px solid #edf0f3!important}
  .sdr-card>header h3{margin:0!important;color:#172033!important;font-size:12px!important;line-height:1.2!important}
  .sdr-card>header span,.sdr-card>header button{flex:0 0 auto!important;min-height:28px!important;padding:5px 8px!important;border:1px solid #e2e6eb!important;border-radius:7px!important;background:#fff!important;color:#596676!important;font-size:8px!important}
  .sdr-card>header button{color:#c82b49!important}

  .sdr-mix{box-sizing:border-box!important;height:calc(100% - 46px)!important;min-height:0!important;padding:12px!important;display:grid!important;grid-template-columns:112px minmax(0,1fr)!important;align-items:center!important;gap:10px!important;overflow:hidden!important}
  .sdr-donut{width:100px!important;height:100px!important;margin:auto!important;flex:none!important;border-radius:50%!important;display:grid!important;place-items:center!important;position:relative!important}
  .sdr-donut:after{content:""!important;position:absolute!important;width:58px!important;height:58px!important;border-radius:50%!important;background:#fff!important}
  .sdr-donut>div{position:relative!important;z-index:1!important;text-align:center!important}
  .sdr-donut strong{display:block!important;color:#172033!important;font-size:12px!important}.sdr-donut span{display:block!important;margin-top:2px!important;color:#7d8794!important;font-size:7px!important}
  .sdr-mix ul{list-style:none!important;margin:0!important;padding:0!important;display:grid!important;gap:7px!important;max-height:100%!important;overflow:hidden!important}
  .sdr-mix li{min-width:0!important;display:grid!important;grid-template-columns:8px minmax(0,1fr) 28px!important;gap:5px!important;align-items:center!important;color:#536071!important;font-size:7px!important}
  .sdr-mix li em{display:none!important}.sdr-mix li b{text-align:right!important;color:#172033!important}.sdr-mix li span{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .sdr-source{grid-template-columns:105px minmax(0,1fr)!important}.sdr-source .sdr-donut{width:92px!important;height:92px!important}.sdr-source .sdr-donut:after{width:52px!important;height:52px!important}

  .sdr-line{box-sizing:border-box!important;height:205px!important;min-height:205px!important;margin:17px 15px 22px!important;position:relative!important;border-left:1px solid #e8ecf0!important;border-bottom:1px solid #e8ecf0!important;overflow:visible!important}
  .sdr-line svg{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;overflow:visible!important}
  .sdr-line-point{transform:translate(-50%,50%)!important}
  .sdr-months{bottom:-18px!important;font-size:7px!important}

  .sdr-table{box-sizing:border-box!important;height:calc(100% - 46px)!important;min-height:0!important;overflow:auto!important;-webkit-overflow-scrolling:touch!important;background:#fff!important}
  .sdr-table table{display:table!important;width:100%!important;min-width:600px!important;white-space:nowrap!important;border-collapse:collapse!important}
  .sdr-table th,.sdr-table td{padding:8px 9px!important;font-size:8px!important}
  .sdr-empty{height:120px!important;vertical-align:middle!important;text-align:center!important;color:#8a94a0!important}

  .sdr-ai{box-sizing:border-box!important;width:100%!important;min-height:66px!important;height:auto!important;margin:0!important;padding:10px 11px!important;display:flex!important;align-items:center!important;gap:9px!important;background:linear-gradient(90deg,#fff,#fffafb)!important;border:1px solid #e5e9ee!important;border-radius:14px!important;box-shadow:0 2px 8px rgba(22,34,50,.025)!important;transform:none!important}
  .sdr-ai-mark{width:34px!important;height:34px!important;flex:0 0 34px!important;border-radius:10px!important;display:grid!important;place-items:center!important;background:#f9e6ea!important;color:#d72d4e!important}
  .sdr-ai>div:nth-child(2){min-width:0!important;flex:1!important}.sdr-ai strong{display:block!important;color:#172033!important;font-size:10px!important}.sdr-ai span{display:block!important;margin-top:2px!important;color:#697586!important;font-size:8px!important;line-height:1.3!important}.sdr-ai button{flex:0 0 auto!important;min-height:34px!important;padding:0 10px!important;border:1px solid #d72d4e!important;border-radius:8px!important;background:#fff!important;color:#c92a48!important;font-size:8px!important}
}

@media(max-width:480px){
  #body,.content{padding:8px!important}
  .sdr-kpis{gap:7px!important}
  .sdr-kpi{height:86px!important;min-height:86px!important;padding:10px!important;gap:8px!important;border-radius:13px!important}
  .sdr-kpi-icon{width:34px!important;height:34px!important;min-width:34px!important;flex-basis:34px!important;font-size:12px!important}
  .sdr-kpi strong{font-size:16px!important}.sdr-kpi span{font-size:8px!important}.sdr-kpi small{font-size:6.5px!important}
  .sdr-grid-top .sdr-card{height:280px!important;min-height:280px!important;max-height:280px!important}
  .sdr-grid-bottom .sdr-card:first-child{height:230px!important;min-height:230px!important;max-height:230px!important}
  .sdr-grid-bottom .sdr-card:last-child{height:245px!important;min-height:245px!important;max-height:245px!important}
  .sdr-mix{grid-template-columns:98px minmax(0,1fr)!important;padding:9px!important;gap:7px!important}.sdr-donut{width:86px!important;height:86px!important}.sdr-donut:after{width:50px!important;height:50px!important}.sdr-source{grid-template-columns:92px minmax(0,1fr)!important}.sdr-source .sdr-donut{width:80px!important;height:80px!important}.sdr-source .sdr-donut:after{width:46px!important;height:46px!important}
  .sdr-line{height:185px!important;min-height:185px!important;margin:16px 12px 22px!important}
  .sdr-ai{min-height:62px!important}.sdr-ai button{padding:0 8px!important}
}