@media(max-width:700px){
 .calendar-layout{grid-template-columns:minmax(0,1fr)}
 .calendar-layout>*{min-width:0}
 .stack{grid-template-columns:minmax(0,1fr);min-width:0}
 .nav button[data-page=invoice_reports],.nav button[data-page=reports],.nav button[data-page=requests],.nav button[data-page=archive],.nav button[data-page=settings],.nav button[data-page=cancellations],.nav button[data-page=activity]{display:none}
 .nav .nav-mobile-more{display:flex}
 .nav button{flex:1;min-width:0;font-size:.75rem;overflow-wrap:anywhere}
 .nav button>span:not(.badge){max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .topbar .avatar{display:grid;width:30px;height:30px;min-height:30px}
 .page-head{flex-wrap:wrap}
 .page-head>div{min-width:0}
 .stat{min-width:0}
 .stat-value{overflow-wrap:anywhere}
 .modal-foot{flex-wrap:wrap}
 .modal-foot>button{flex:1}
 .service-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 36px}
 .service-row>span{grid-column:1/-1;font-size:.875rem;color:#3f554b}
 .invoice .between{flex-wrap:wrap}
 .invoice .between>div{min-width:0}
}
@media(max-width:340px){
 .hall-card>.flex{flex-wrap:wrap}
 .calendar-toolbar>.flex{min-width:0}
 .topbar{padding:10px 12px;flex-wrap:wrap;gap:8px}
 .topbar-actions{margin-left:auto}
 .topbar .avatar{display:none}
 .stat{padding:10px}
 .stat-label{font-size:.75rem;line-height:1.4;gap:3px}
 .stat-label .ico{display:none}
 .stat-value{font-size:1.1rem}
 .stat-note{font-size:.75rem}
 .calendar-toolbar .month-title{min-width:0}
 .calendar-toolbar>.flex{flex-wrap:wrap}
 .detail-grid,.coffee-fields{grid-template-columns:1fr}
 .nav button{font-size:.65rem}
 .page-head>button{width:100%}
 .day{min-height:72px}
 .event{font-size:.65rem}
}