
/* ===== мобильная плотность v2 — масштаб таблицы, сетка 2px (только чётные px) ===== */
@media(max-width:759px){
  html{font-size:14px}
  /* каркас */
  .panel-header{min-height:56px; padding:8px 12px}
  .panel-header .avatar{width:30px; height:30px; font-size:.72rem}
  .page{padding:12px 12px 92px; gap:18px}
  #screenHost{gap:18px}
  .page-head{gap:10px}
  .page-head h1{font-size:20px}
  .page-head .sub{font-size:.8rem; margin-top:4px}
  .eyebrow{font-size:.62rem}
  .section-title{font-size:.58rem}
  /* карточки */
  .card,.service-card{padding:16px; border-radius:18px}
  .service-card{--shift:4px}
  .services{gap:12px}
  .detail-grid{gap:12px}
  .page-block{gap:10px}
  .card h3{font-size:1.05rem; margin-bottom:6px}
  .card p{font-size:.84rem}
  .service-card .top{gap:10px}
  .service-card .stats{gap:12px}
  .stats{gap:12px}
  .stat{min-width:0; gap:0}
  .stat .k{font-size:.54rem}
  .stat .v{font-size:.74rem}
  /* контролы */
  .btn{width:auto; min-height:38px; padding:0 12px; gap:8px; font-size:.8rem}
  .btn-sm{min-height:32px; padding:0 10px; font-size:.74rem}
  .btn-icon{width:38px}
  .btn-icon.btn-sm{width:32px}
  .input,.select,.textarea{min-height:40px; padding-left:12px; padding-right:12px; font-size:.86rem}
  .textarea{min-height:88px; padding:10px 12px}
  .label{font-size:.64rem}
  .field{gap:8px}
  .form-grid,.form-row{gap:10px}
  .check{font-size:.84rem; gap:8px}
  .check .box{width:20px; height:20px; border-radius:6px}
  .foot,.page-actions{column-gap:10px; row-gap:12px}
  .page-actions > .btn,.page-actions > a.btn{width:100%}
  .toggle.icon-only{width:36px; flex-basis:36px}
  .toggle.icon-only .icon{width:18px; height:18px}
  .tabs{padding:3px}
  .tabs .tab{font-size:.74rem; padding:4px 10px}
  .chip{font-size:.6rem; padding:2px 8px; min-height:22px}
  .chip .dotmark{width:6px; height:6px}
  .icon{width:1.05em; height:1.05em}
  /* алерты и журнал */
  .alert{border-radius:14px; padding:10px 12px; gap:10px; font-size:.84rem}
  .alert .ico{width:20px; height:20px}
  .act-row{padding:10px 12px 10px 18px; gap:8px}
  .act-time{font-size:.7rem}
  .act-event{font-size:.8rem}
  .act-body{padding:8px 12px 10px 18px; gap:6px}
  .act-kv{font-size:.78rem}
  .kv-list{gap:6px}
  /* таблицы — эталон масштаба мобильной версии */
  .table th{padding:8px 10px; font-size:.56rem}
  .table td{padding:8px 10px; font-size:.78rem}
  /* компактная таблица: главные колонки + разворот; тулбар и чекбоксы — только ПК */
  .tbl-toolbar{display:none}
  .t-check{display:none}
  .tbl-wrap .t-extra{display:none}
  .tbl-wrap.tbl-full .t-extra{display:table-cell}
  .tbl-expander{display:inline-flex; align-items:center; margin-top:8px}
  .tbl-wrap.tbl-full .tbl-expander .icon{rotate:180deg}
  .table-scroll .table{min-width:0}
  /* метрики: квадраты в строку; ровно 4 метрики — сетка 2×2 */
  .services.metrics{grid-template-columns:repeat(auto-fit,minmax(104px,1fr)); gap:10px}
  .services.metrics:has(> :nth-child(4):last-child){grid-template-columns:1fr 1fr}
  .services.metrics .service-card{padding:12px 10px; gap:6px; --shift:4px}
  .services.metrics .service-card:hover{transform:translate(-2px,-2px)}
  .services.metrics .service-card .top{display:grid; gap:4px}
  .services.metrics .service-card .top > .icon{display:none}
  .services.metrics .service-card .domain{font-size:1rem}
  .services.metrics .service-card .plan{font-size:.56rem}
  .services.metrics .service-card .foot,.services.metrics .service-card .progress{margin-top:2px}
  /* us-switch */
  .us-switch{padding:10px; gap:10px}
  .us-chip{padding:4px 10px; font-size:.62rem}
  .us-desc{font-size:.74rem}
  /* файлы */
  .fm-row{padding:6px 10px}
  .fm-row .icon{width:16px; height:16px}
  .crumbs{font-size:.68rem; margin-bottom:10px}
  /* состояния */
  .states{padding:10px; gap:8px}
  .state-when{font-size:.82rem}
  .state-ui{font-size:.74rem}
  /* таббар */
  .tabbar a{padding:6px 2px 8px; font-size:.54rem; gap:2px}
  .tabbar a .icon{width:18px; height:18px}
  .empty{padding:24px 14px; gap:10px}
  /* формы — одна колонка, селекты не шире экрана */
  .form-row{grid-template-columns:1fr}
  .form-grid .select,.form-row .select,.form-grid .input,.form-row .input{width:100%}
  /* переключатель вида — компактные иконки, не растягиваем */
  .page-actions > .view-tabs{width:auto; justify-self:start}
  /* тач: тултипы не показываем (подпись в aria-label); действия строки — по выделению тапом */
  .tip::after{display:none}
  .row-acts{display:none; opacity:1; visibility:visible}
  .table tbody tr.row-sel .row-acts{display:inline-flex}
}
