@media(max-width:700px){
  html{background:#f4f6fb}body{padding-bottom:76px;-webkit-tap-highlight-color:transparent}
  .main{padding:12px 12px 20px}.topbar{position:sticky;top:0;z-index:12;margin:-12px -12px 14px;padding:13px 12px;background:rgba(246,247,251,.96);backdrop-filter:blur(10px);border-bottom:1px solid #e8ebf3}
  .topbar h1{font-size:19px}.topbar p{font-size:10px;line-height:1.45}.actions{gap:6px}.actions .btn,.publish{min-height:42px;padding:9px 11px;font-size:10px}
  .mobile-nav{height:72px;padding:7px 4px calc(5px + env(safe-area-inset-bottom));box-shadow:0 -8px 25px rgba(20,39,82,.09)}.mobile-nav button{min-width:52px;min-height:54px;border-radius:12px}.mobile-nav button.active{background:#edf1ff}.mobile-nav button span{font-size:20px}.mobile-nav button small{font-size:9px;font-weight:700}
  .grid4{gap:8px}.stat{min-height:82px;padding:12px 10px;border-radius:13px}.stat small{font-size:9px;line-height:1.35}.stat strong{font-size:23px}
  .summary-period-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.summary-period-tabs button{padding:10px 5px;font-size:10px;white-space:nowrap}
  .summary-dashboard-circles{border-radius:15px}.summary-circle-card{min-height:145px}.summary-circle-footer>div{flex:1;min-width:120px}.overview-summary-section{margin-top:19px;padding-top:17px}.overview-summary-title h2{font-size:16px}
  .card{border-radius:13px}.card-head{padding:14px}.card-body{padding:13px}.filters{display:grid;grid-template-columns:1fr}.field,.search{width:100%;min-width:0;min-height:44px}
  .table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.table-wrap table{min-width:720px}.row-actions button{min-width:38px;min-height:38px}
  .tree-dep>summary,.org-tree summary{padding:13px 11px}.tree-team{margin:9px}.tree-user{margin:0 5px 8px}.tree-user>summary{padding:10px 8px}.tree-user .avatar{width:34px;height:34px}.detail-person-name b{font-size:12px}.detail-person-stats{margin-left:42px!important;gap:4px}.detail-person-stats span{padding:5px 7px;font-size:8px}.detail-add-task{width:100%;min-height:42px;margin-top:5px}
  .modal-back{padding:0;place-items:end center}.modal{width:100%;max-height:92vh;border-radius:20px 20px 0 0}.modal-head{position:sticky;top:0;z-index:2;padding:16px;background:#fff}.form{padding:16px;gap:13px}.form input,.form select,.form textarea{min-height:45px}.modal-foot{position:sticky;bottom:0;background:#fff;padding-top:10px}.modal-foot .btn{flex:1;min-height:44px}
  .form input,.form select,.form textarea,.input-icon input,.login-card input{font-size:16px!important}
  .login-page{background:linear-gradient(180deg,#eef2ff 0,#fff 38%);padding:18px}.login-card{width:100%;max-width:420px;padding:28px 20px!important;background:#fff;border:1px solid #e5e9f3;border-radius:22px;box-shadow:0 18px 50px rgba(20,39,82,.12)}.login-card:before{margin-bottom:4px}.login-card h2{font-size:24px}.input-icon{min-height:50px}.login-btn{min-height:50px}.demo-box{font-size:10px;line-height:1.5}
}
@media(max-width:380px){.main{padding-left:8px;padding-right:8px}.summary-circle{flex-basis:70px;width:70px;height:70px}.summary-circle-card{min-height:136px}.mobile-nav button{min-width:46px}.mobile-nav button small{font-size:8px}}
