html,body,#root{max-width:100%;min-width:0}body{overflow-x:hidden;-webkit-text-size-adjust:100%}img,svg,canvas{max-width:100%}button,a,input,select,textarea{touch-action:manipulation}

@media (max-width:900px){
  body{background:#f4f7fb!important}
  .app{display:block!important;min-height:100dvh!important;width:100%!important}
  aside{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;max-height:none!important;padding:9px 10px 10px!important;overflow:visible!important;border-bottom:1px solid #243044;box-shadow:0 8px 22px rgba(15,23,42,.12)}
  aside .brand{padding:4px 6px 10px!important;min-height:50px}
  aside .logo{width:36px!important;height:36px!important;font-size:19px!important;border-radius:10px!important}
  aside .brand b{font-size:15px!important}
  aside .brand span{font-size:10px!important}
  aside nav{display:flex!important;flex-direction:row!important;gap:8px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:0 1px 4px!important;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  aside nav::-webkit-scrollbar{height:4px}
  aside nav::-webkit-scrollbar-thumb{background:#475569;border-radius:999px}
  aside nav>div{flex:0 0 190px!important;min-width:190px!important;scroll-snap-align:start;background:#172033;border:1px solid #2a3548;border-radius:12px;padding:3px!important;align-self:flex-start}
  aside .group{min-height:44px!important;padding:10px!important;border-radius:9px!important;font-size:13px!important}
  aside .item{min-height:40px!important;padding:9px 10px 9px 34px!important;font-size:12px!important;white-space:normal!important;line-height:1.25!important}

  main{margin-left:0!important;width:100%!important;min-width:0!important;min-height:100dvh!important}
  main>header,header{height:auto!important;min-height:68px!important;padding:10px 12px!important;gap:8px!important;position:sticky!important;top:0!important;z-index:40!important;box-shadow:0 4px 18px rgba(15,23,42,.06)}
  header>div:first-child{min-width:0;flex:1}
  header h1{font-size:18px!important;line-height:1.15!important;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  header p{display:none!important}
  .head-actions{gap:5px!important;align-items:center!important;flex:none!important}
  .head-actions>button,.notification-btn,.profile-btn{min-width:42px!important;min-height:42px!important;padding:8px!important;border-radius:10px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
  .profile-btn span{display:none!important}
  .print-toolbar-btn{display:none!important}
  .profile-menu{position:fixed!important;right:10px!important;left:auto!important;top:72px!important;width:min(260px,calc(100vw - 20px))!important;z-index:1001!important}
  .notification-menu{position:fixed!important;left:10px!important;right:10px!important;top:72px!important;width:auto!important;max-height:calc(100dvh - 86px)!important;border-radius:14px!important;z-index:1002!important}

  .content{padding:12px!important;min-width:0!important;overflow:hidden}
  .panel,.card,.pm-page-head,.pm-controls,.pm-project-card{min-width:0!important;max-width:100%!important}
  .panel{padding:16px!important;border-radius:12px!important}
  .cards,.report-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .card{padding:14px!important}
  .card strong{font-size:20px!important;overflow-wrap:anywhere}
  .dashboard-grid{grid-template-columns:1fr!important;gap:10px!important}
  .toolbar,.panel-head,.pm-page-head,.pm-card-title,.pm-card-actions,.form-actions,.row-actions,.actions{flex-wrap:wrap!important;gap:8px!important}
  .toolbar>*{min-width:0}
  .toolbar-actions{display:flex!important;flex-wrap:wrap!important;gap:7px!important}
  .toolbar-actions button,.form-actions button,.row-actions button,.actions button,.pm-card-actions button{min-height:42px!important}

  .table-wrap{width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:visible!important;-webkit-overflow-scrolling:touch;border-radius:10px}
  .table-wrap table{min-width:720px!important;width:max-content!important;max-width:none!important}
  table{font-size:12px!important}
  th,td{padding:10px!important}

  .form-grid{grid-template-columns:1fr!important;padding:16px!important;gap:12px!important}
  .form-grid input,.form-grid select,.form-grid textarea,.pm-controls input,.pm-controls select,.pm-form input,.pm-form select,.pm-form textarea,input,select,textarea{max-width:100%!important;font-size:16px!important}
  .form-grid input,.form-grid select,.pm-controls input,.pm-controls select,.pm-form input,.pm-form select{min-height:46px!important}
  .form-grid textarea,.pm-form textarea{min-height:110px!important}
  .form-actions{grid-column:1!important;justify-content:stretch!important}
  .form-actions button{flex:1 1 auto!important;justify-content:center!important}

  .overlay{padding:8px!important;align-items:flex-end!important}
  .modal{width:100%!important;max-width:100%!important;max-height:94dvh!important;border-radius:18px 18px 0 0!important}
  .modal-head{padding:15px 16px!important;position:sticky;top:0;background:#fff;z-index:2}

  .pm-controls,.pm-controls.compact{grid-template-columns:1fr!important;max-width:100%!important}
  .pm-project-grid{grid-template-columns:1fr!important}
  .pm-info-grid{grid-template-columns:1fr 1fr!important}
  .pm-cover{height:180px!important}
  .pm-page-head{padding:16px!important}
  .pm-page-head h2{font-size:19px!important}
  .chart-panel,.recharts-responsive-container{min-width:0!important;width:100%!important}
  .recharts-wrapper,.recharts-surface{max-width:100%!important}
}

@media (max-width:600px){
  .login{min-height:100dvh!important;height:auto!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:18px 12px!important;background:radial-gradient(circle at 50% 0,#eaf3ff 0,#f6f8fc 45%,#eef2f7 100%)!important}
  .login-card{width:100%!important;max-width:430px!important;margin:0 auto!important;padding:24px 18px!important;border-radius:20px!important;box-shadow:0 22px 60px rgba(15,23,42,.12)!important}
  .login-card .logo.big{width:50px!important;height:50px!important;font-size:25px!important;border-radius:14px!important}
  .login-card h1{font-size:25px!important;line-height:1.15!important;margin:13px 0 5px!important}
  .login-card>p{font-size:13px!important;line-height:1.5!important;margin-bottom:20px!important}
  .login-card label{font-size:12px!important;margin:12px 0!important;gap:7px!important}
  .login-card input{width:100%!important;min-height:50px!important;padding:12px 13px!important;font-size:16px!important;border-radius:11px!important;background:#fff!important}
  .login-card .full,.login-card button[type="submit"]{min-height:50px!important;font-size:15px!important;font-weight:700!important;border-radius:11px!important}
  .login-card .alert{font-size:12px!important;line-height:1.45!important}

  aside{padding-bottom:8px!important}
  aside nav>div{flex-basis:82vw!important;min-width:82vw!important}
  main>header,header{min-height:62px!important;padding:8px 10px!important}
  header h1{font-size:16px!important}
  .head-actions>button,.notification-btn,.profile-btn{min-width:40px!important;min-height:40px!important}
  .profile-menu,.notification-menu{top:66px!important}
  .content{padding:10px!important}
  .cards,.report-kpis{grid-template-columns:1fr!important}
  .card{padding:13px!important}
  .panel{padding:14px!important}
  .panel h2{font-size:16px!important}
  .pm-info-grid{grid-template-columns:1fr!important}
  .pm-cover{height:160px!important}
  .row-actions{min-width:150px}
}

@media (max-width:380px){
  .login{padding:10px!important}
  .login-card{padding:20px 15px!important;border-radius:17px!important}
  aside nav>div{flex-basis:88vw!important;min-width:88vw!important}
  .content{padding:8px!important}
}

@media (hover:none) and (pointer:coarse){
  button,.group,.item,.row-actions button,.toolbar-actions button{cursor:pointer}
  tr:hover td{background:inherit!important}
}