/* ROTA 040 MC · interface responsiva da gestão */
html,body{max-width:100%;overscroll-behavior-x:none}
button,a,[role=button]{-webkit-tap-highlight-color:transparent}
input,select,textarea{max-width:100%;font-size:16px}
@media(max-width:900px){
.layout{display:block!important;width:100%;max-width:100vw}
.sidebar{width:100%!important;max-width:100vw!important;height:auto!important;max-height:none!important;position:sticky!important;top:0!important;z-index:35!important;padding:9px 12px 5px!important;overflow:hidden!important;border-right:0!important;border-bottom:1px solid #343a3d!important;background:#101214!important}
.brand{margin-bottom:6px!important;padding:0 0 8px!important}
.brand img{width:43px!important;height:43px!important}
.brand strong{font-size:13px!important;line-height:1.2}
.brand span{font-size:9px!important}
.sidebar .navgroup,.sidebar>.btn{display:none!important}
.sidebar nav{display:flex!important;width:100%!important;max-width:100%!important;flex-wrap:nowrap!important;gap:5px!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin;touch-action:pan-x;-webkit-overflow-scrolling:touch;padding:3px 0 10px!important}
.sidebar .nav{width:max-content!important;flex:0 0 auto!important;white-space:nowrap!important;min-height:44px!important;padding:9px 11px!important;font-size:12px!important;margin:0!important}
.sidebar .nav i{width:auto!important;font-size:17px!important}
.stage{width:100%!important;max-width:100vw!important;min-width:0!important;padding:16px 13px!important}
.top{display:flex!important;gap:10px!important;flex-wrap:wrap!important;align-items:flex-start!important}
.top h1{font-size:clamp(21px,5vw,28px)!important;overflow-wrap:break-word}
.top .flex{max-width:100%}
.panel{padding:16px!important;max-width:100%}
.grid.twocol{grid-template-columns:minmax(0,1fr)!important}
.grid.four{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.fields{grid-template-columns:minmax(0,1fr)!important}
.fields .wide{grid-column:auto!important}
.tablewrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;max-width:100%!important}
table{min-width:480px}
.cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.tile{min-width:0!important;min-height:110px!important;padding:13px!important}
.tile b{font-size:13px!important;overflow-wrap:anywhere}
.actions,.between{gap:9px!important}
.btn,.actions .btn{min-height:43px!important;touch-action:manipulation}
.overlay{padding:8px!important;align-items:center!important}
.modal{width:100%!important;max-width:min(100%,650px)!important;max-height:calc(100dvh - 16px)!important;overflow-y:auto!important;overscroll-behavior:contain!important;padding:20px 15px!important;border-radius:12px!important}
.modal h2{font-size:20px}
.modal .actions{justify-content:stretch!important}
.modal .actions .btn{flex:1 1 130px;min-width:0}
.modal input,.modal select,.modal textarea{min-width:0!important}
.login{min-height:100dvh!important;padding:12px!important;align-items:center!important}
.loginCard{width:min(100%,470px)!important;padding:clamp(20px,5vw,34px)!important}
.loginCard img{height:120px!important;width:130px!important}
.loginCard h1{font-size:clamp(19px,5.1vw,23px)!important}
.authlinks{gap:7px!important;flex-wrap:wrap}
.authlinks .btn{flex:1 1 120px}
.calendar{grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:3px!important}
.calday{min-width:0!important;min-height:68px!important;padding:4px!important}
.calday button{font-size:9px!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.map{width:100%!important;height:300px!important}
.legacy{width:100%!important;min-height:600px!important;height:70dvh!important}
#generatedPassword{font-size:23px!important;font-weight:750!important;letter-spacing:2px!important;text-align:center!important;min-height:53px!important;font-variant-numeric:tabular-nums}
}
@media(max-width:380px){
.stage{padding:12px 9px!important}
.sidebar{padding:7px 9px 4px!important}
.grid.four{gap:7px!important}
.metric{padding:12px 9px!important}
.metric strong{font-size:17px!important}
.cards{gap:8px!important}
.tile{padding:11px!important}
.calday{padding:2px!important;min-height:58px!important}
.calhead{font-size:9px!important}
.loginCard{padding:19px!important}
.top .flex{font-size:12px!important}
}
@media(min-width:901px) and (max-width:1100px){
.sidebar{width:235px!important}
.grid.four{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
