/* Mobile layout fixes. Desktop rules stay in the existing theme. */
.vl-menu-button{display:none}
.vl-staff>.mobile-nav{display:none}
.vl-menu-dialog{padding:0;border:0;border-radius:20px;color:#183247;background:#fff;width:min(420px,calc(100% - 24px));max-height:calc(100dvh - 32px);box-shadow:0 20px 80px #0c274044}
.vl-menu-dialog::backdrop{background:#0c274080}
.vl-menu-head{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;padding:16px;background:white;border-bottom:1px solid #e3eaf1;z-index:1}
.vl-menu-close{width:44px;height:44px;border:1px solid #dce5ee;border-radius:12px;background:#f3f7fb;color:#183247;font-size:24px;cursor:pointer}
.vl-menu-links{display:grid;gap:8px;padding:14px 14px max(18px,env(safe-area-inset-bottom))}
.vl-menu-links a{display:flex;align-items:center;gap:10px;min-height:48px;padding:12px 14px;border:1px solid #dce9f3;border-radius:12px;background:#f2f7fc;color:#1267a5;text-decoration:none;font:600 15px/1.4 system-ui}
.vl-menu-links a[aria-current="page"]{background:#1674bd;color:white}
.vl-menu-dialog :focus-visible{outline:3px solid #4c95dd;outline-offset:2px}
@media(max-width:850px){
 .vl-family{--vl-nav-height:calc(72px + env(safe-area-inset-bottom,0px))}
 .vl-family .mobile-nav{height:var(--vl-nav-height);padding:6px max(8px,env(safe-area-inset-right)) env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));box-sizing:border-box;box-shadow:0 -4px 20px #1832470c}
 .vl-family .mobile-nav a{display:flex;min-height:56px;align-items:center;justify-content:center;flex-direction:column;font-size:11px;border-radius:12px;text-decoration:none}
 .vl-family .mobile-nav a.active{background:#edf6fc}
 .vl-family .content{padding:20px 14px calc(var(--vl-nav-height) + 24px)}
 .vl-family .mobile-header{height:auto;min-height:64px;gap:10px;padding:8px 14px;flex-wrap:wrap}
 .vl-family .vl-menu-button{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;background:#edf6fc;border:1px solid #d3e7f5;border-radius:12px;color:#1674bd;font-size:23px}
 .vl-family .mobile-logo{font-size:13px;flex:1}
 .vl-family .profile-main{padding:18px}
 .vl-family :is(.main,.content,.columns,.card,.profile,.profile-info,.row>*,.quick-item){min-width:0;overflow-wrap:anywhere}
 .vl-family .row{gap:12px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
 .vl-family .tabs{display:flex;overflow-x:auto;max-width:100%;gap:8px;flex-wrap:nowrap}
 .vl-family .tabs>*{flex:0 0 auto;min-height:44px}
 .vl-family [id]{scroll-margin-top:88px}
}
@media(max-width:800px){
 .vl-staff{--vl-nav-height:calc(72px + env(safe-area-inset-bottom,0px));padding-bottom:var(--vl-nav-height)}
 .vl-staff .staff-main{min-width:0;width:100%;margin-left:0!important}
 .vl-staff .staff-content{min-width:0;padding:18px 12px 28px}
 .vl-staff .staff-content>*{min-width:0;max-width:100%;box-sizing:border-box}
 .vl-staff .staff-topbar{height:auto;min-height:60px;gap:10px;padding:8px 12px;flex-wrap:wrap}
 .vl-staff .staff-topbar-title{font-size:14px;line-height:1.4;min-width:0;flex:1}
 .vl-staff .staff-topbar-actions{gap:8px;flex-wrap:wrap}
 .vl-staff .staff-topbar-actions>a[href="/manager"]{display:none!important}
 .vl-staff .vl-mobile-nav{display:none!important}
 .vl-staff .mobile-nav{display:grid!important;position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid #dfe8ee;grid-template-columns:repeat(5,minmax(0,1fr));height:var(--vl-nav-height);min-height:0;padding:5px max(6px,env(safe-area-inset-right)) env(safe-area-inset-bottom);gap:3px;box-sizing:border-box;box-shadow:0 -4px 20px #1832470c;z-index:1000}
 .vl-staff .mobile-nav :is(a,button){display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:56px;padding:5px 2px;border:0;border-radius:12px;background:transparent;font:600 11px/1.2 system-ui;color:#63778a;text-decoration:none;cursor:pointer}
 .vl-staff .mobile-nav a.active{background:#e7f2fb!important;color:#1267a5!important}
 .vl-staff .mobile-nav-icon{font-size:22px;line-height:1}
 .vl-staff .page-actions{display:flex;flex-wrap:wrap;gap:8px}
 .vl-staff :is(.ui-btn,button,input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select){min-height:44px}
 .vl-staff :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea){max-width:100%;min-width:0;box-sizing:border-box;font-size:16px!important}
 .vl-staff :is(.ui-card,.ui-card-body,.ui-card-header,.md-column,.md-card,.md-field){min-width:0;overflow-wrap:anywhere}
 .vl-staff .ui-table-mobile td[data-label]::before{font-size:11px}
 .vl-staff .staff-content :is(.ui-btn,.page-actions a,.page-actions button){font-size:13px!important;line-height:1.4}
 .vl-staff .page-description{font-size:13px;line-height:1.5}
 .vl-staff .rc-status-dropdown{left:0!important;right:auto!important;width:min(270px,calc(100vw - 48px))!important}
 .vl-staff .rc-status-spoiler>summary{min-height:44px!important}
 .vl-staff .rc-status-dropdown .status-form :is(select,button){min-height:44px!important;font-size:16px!important}
 .vl-staff :is(.plan-shell,.chart-wrap){max-width:100%;overscroll-behavior-x:contain}
 .vl-staff :is(.container,.page,.pc-page,.wrap,.wrapper){min-width:0;max-width:100%;box-sizing:border-box}
 .vl-staff :is(.btn,.actions a,.actions button){min-height:44px;display:inline-flex;align-items:center;justify-content:center;font-size:13px!important}
 .vl-staff .rc-status-spoiler>summary :is(span,strong){font-size:12px!important}
 .vl-login :is(input,button){font-size:16px;min-height:44px;max-width:100%;box-sizing:border-box}
 .vl-staff .resident-global-menu{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .vl-staff .resident-global-menu .resident-global-item{height:auto!important;min-height:44px!important;padding:8px!important;font-size:12px!important;line-height:1.35;white-space:normal!important;overflow:visible!important;justify-content:flex-start!important}
 .vl-staff .resident-switcher{position:relative!important;inset:auto!important;display:flex;justify-content:flex-end;margin:12px 0;z-index:50!important}
 .vl-staff .resident-switcher-panel{position:fixed!important;top:76px!important;bottom:calc(var(--vl-nav-height) + 12px)!important;left:12px!important;right:12px!important;width:auto!important;max-width:none!important;max-height:none!important;overflow:auto}
 .vl-staff .resident-switcher-list{max-height:none!important}
 .vl-staff .staff-notify-panel{position:fixed;top:70px;left:12px;right:12px;width:auto;max-height:calc(100dvh - var(--vl-nav-height) - 92px);overflow:auto}
 .vl-staff .md{padding:14px 0}
 .vl-staff .md :is(.md-card-head,.md-row-top){flex-wrap:wrap}
 .vl-staff .md .md-ai-examples button{min-height:44px}
 .vl-staff .md .md-kpi{padding:12px}
 .vl-staff .md .md-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
 .vl-staff .md .md-badge{white-space:normal}
 .vl-staff :is(.page-title,h1){overflow-wrap:anywhere}
 .vl-staff :is(a,button,input,select,textarea):focus-visible{outline:3px solid #4c95dd;outline-offset:2px}
 .vl-staff [id]{scroll-margin-top:90px}
 .vl-table-scroll{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
 .vl-ai{padding:0;height:var(--vl-viewport,100dvh);overflow:hidden}
 .vl-ai .ai-page{height:100%;min-height:0}
 .vl-ai .ai-top{position:relative;height:auto;min-height:64px;padding:10px 12px;gap:10px;flex-wrap:wrap}
 .vl-ai .ai-title{gap:8px;min-width:0}
 .vl-ai .ai-title strong{font-size:15px}
 .vl-ai .ai-title small{font-size:10px}
 .vl-ai .ai-logo{width:34px;height:34px;flex-shrink:0}
 .vl-ai .ai-back{display:flex;align-items:center;min-height:44px;padding:8px 10px}
 .vl-ai .ai-chat{min-height:0;overflow-y:auto;padding:16px 12px;overscroll-behavior-y:contain}
 .vl-ai .ai-bottom{position:relative;flex:none;padding:10px 10px max(10px,env(safe-area-inset-bottom));background:#f2f6fa}
 .vl-ai .ai-compose{padding:6px;gap:4px;border-radius:15px}
 .vl-ai .ai-compose textarea{min-width:0;width:0;font-size:16px;padding:10px 8px;max-height:min(160px,25dvh)}
 .vl-ai .ai-send{min-width:0;min-height:46px;padding:0 10px}
 .vl-ai .ai-welcome{padding:22px 16px}
 .vl-ai .ai-welcome h1{font-size:22px}
 .vl-ai .message-wrap{min-width:0;max-width:96%}
 .vl-ai .bubble{overflow-wrap:anywhere}
 .vl-ai .ai-markdown pre{max-width:100%;overflow:auto}
 .vl-ai .answer-actions{display:flex;flex-wrap:wrap;gap:8px}
 .vl-ai .answer-actions button{min-height:44px}
 .vl-ai .ai-status{overflow-wrap:anywhere}
}
