/* AG CRM V77 — mobile-first visual system */
@media (max-width: 900px){
  :root{--m-pad:12px;--m-radius:18px;--m-nav-h:68px}
  html,body{max-width:100%;overflow-x:hidden!important}
  body{background:#f6f7f8!important;color:#14253f!important}
  .app{width:100%;min-width:0!important}
  .main{width:100%!important;min-width:0!important;margin:0!important;padding:0 var(--m-pad) calc(92px + env(safe-area-inset-bottom,0px))!important}

  /* Entrada: card compacto e proporcional ao celular */
  #loginScreen.login-screen{min-height:100dvh!important;height:auto!important;padding:0!important;overflow:auto!important;background:#0d1624!important}
  #loginScreen .login-bg{position:fixed!important;inset:0!important;background-position:center!important;background-size:cover!important}
  #loginScreen .login-overlay{position:fixed!important;inset:0!important;background:linear-gradient(180deg,rgba(10,22,38,.54),rgba(5,10,18,.78))!important}
  #loginScreen .login-panel{min-height:100dvh!important;width:100%!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:calc(14px + env(safe-area-inset-top,0px)) 14px calc(14px + env(safe-area-inset-bottom,0px))!important}
  #loginScreen .login-card{width:min(390px,100%)!important;max-width:390px!important;height:auto!important;min-height:0!important;margin:auto!important;padding:22px 20px 20px!important;border-radius:24px!important;background:linear-gradient(180deg,rgba(19,25,36,.94),rgba(21,18,18,.94))!important;border:1px solid rgba(234,198,134,.22)!important;box-shadow:0 24px 70px rgba(0,0,0,.34)!important;backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important}
  #loginScreen .login-brand-center{margin:0 0 18px!important;min-height:0!important}
  #loginScreen .login-brand-center img{width:92px!important;max-width:28vw!important;height:auto!important}
  #loginScreen .login-card label{margin:0 0 13px!important;font-size:11px!important;line-height:1.2!important;letter-spacing:.07em!important}
  #loginScreen .login-card input{height:50px!important;min-height:50px!important;margin-top:7px!important;border-radius:14px!important;padding:0 14px!important;font-size:16px!important}
  #loginScreen .login-password input{padding-right:88px!important}
  #loginScreen .login-password button{right:7px!important;bottom:7px!important;height:36px!important;padding:0 13px!important;border-radius:10px!important;font-size:11px!important}
  #loginScreen .login-submit,#loginScreen .login-google,#loginScreen .register-back{height:50px!important;min-height:50px!important;border-radius:14px!important;font-size:14px!important}
  #loginScreen .login-separator{margin:13px 0!important;font-size:10px!important}
  #loginScreen .login-account-action{min-height:38px!important;font-size:13px!important}
  #loginScreen .login-status,#loginScreen .login-error{font-size:12px!important;line-height:1.4!important;margin-top:8px!important;min-height:0!important;overflow-wrap:anywhere!important}
  #loginScreen .login-status:empty,#loginScreen .login-error:empty{display:none!important}
  #loginScreen .register-heading{font-size:16px!important;margin:0 0 15px!important}
  #loginScreen .register-actions{grid-template-columns:1fr 1.35fr!important;gap:8px!important;margin-top:6px!important}

  /* Barra superior: simples, sem esmagar conteúdo */
  .topbar{position:sticky!important;top:0!important;z-index:60!important;display:grid!important;grid-template-columns:44px minmax(0,1fr) 44px!important;align-items:center!important;gap:8px!important;min-height:60px!important;margin:0 calc(var(--m-pad) * -1) 12px!important;padding:calc(7px + env(safe-area-inset-top,0px)) var(--m-pad) 7px!important;background:rgba(255,255,255,.96)!important;border-bottom:1px solid rgba(20,37,63,.08)!important;box-shadow:0 5px 18px rgba(20,37,63,.04)!important}
  .mobile-menu,.top-actions .btn{width:44px!important;height:44px!important;min-height:44px!important;border-radius:13px!important}
  .search{min-width:0!important;width:100%!important}
  .search input{width:100%!important;height:44px!important;min-height:44px!important;padding:0 12px 0 38px!important;border:1px solid #e8e9ec!important;border-radius:13px!important;background:#f7f8f9!important;font-size:16px!important;color:#14253f!important}
  .search:before{left:13px!important;top:13px!important}
  .search-key{display:none!important}
  .top-actions{display:block!important;min-width:0!important}

  /* Conteúdo */
  .page{min-width:0!important;width:100%!important}
  .dashboard-intro,.page-head{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin:6px 0 12px!important}
  .dashboard-intro h1,.page-head h1{font-size:clamp(28px,8vw,36px)!important;line-height:1.04!important;letter-spacing:-.04em!important;overflow-wrap:anywhere!important}
  .dashboard-intro em{display:inline!important}
  .dashboard-intro p,.page-head p,.support,.muted{font-size:13px!important;line-height:1.5!important}
  .eyebrow,.v5-kicker{font-size:11px!important}
  .intro-actions,.head-actions{display:flex!important;gap:7px!important;overflow-x:auto!important;padding-bottom:3px!important;scroll-snap-type:x proximity!important}
  .intro-actions .btn,.head-actions .btn{flex:0 0 auto!important;min-height:42px!important;padding:0 13px!important;font-size:12px!important;border-radius:12px!important}

  .dashboard-stage{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
  .operation-pulse,.spotlight{min-height:210px!important;border-radius:20px!important}
  .operation-pulse{padding:18px!important}
  .pulse-value{font-size:clamp(38px,13vw,56px)!important}
  .spotlight-copy{padding:18px!important}.spotlight-copy h3{font-size:25px!important}

  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .kpi{min-width:0!important;min-height:108px!important;padding:13px!important;border-radius:16px!important}
  .kpi strong{font-size:25px!important;overflow-wrap:anywhere!important}.kpi span,.kpi small{font-size:11px!important;line-height:1.35!important}

  .card,.table-card,.ag-access-card{min-width:0!important;border-radius:16px!important;overflow:hidden!important}
  .card-head{padding:14px!important;align-items:flex-start!important;flex-wrap:wrap!important}.card-head h3{font-size:18px!important;line-height:1.2!important}
  .card-body{padding:14px!important}
  .v5-control-grid,.v25-attention-grid,.dash-grid,.section-row,.finance-grid,.settings-grid,.report-grid,.ag-users-admin-grid,.form-grid{grid-template-columns:1fr!important;gap:10px!important}
  .v5-health-grid{grid-template-columns:1fr!important}.v5-health-grid>div{min-width:0!important;padding:13px!important}

  /* Listas, formulários e cards de imóveis */
  .toolbar{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .toolbar>*{min-width:0!important;width:100%!important}
  input,select,textarea,.form-control,.field,.select{max-width:100%!important;min-width:0!important;font-size:16px!important}
  .form-control,.field,.select{min-height:46px!important}
  textarea{min-height:110px!important}
  .property-grid{grid-template-columns:1fr!important;gap:10px!important}
  .property-card{min-width:0!important;border-radius:18px!important}.property-content{padding:14px!important}.property-content h3{font-size:20px!important;line-height:1.18!important;overflow-wrap:anywhere!important}
  .property-meta,.property-content small,.property-content p{font-size:12px!important;line-height:1.45!important;overflow-wrap:anywhere!important}

  /* Tabelas ficam dentro do próprio componente */
  .table-card,.table-wrap{max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}
  .table{min-width:720px!important}.table th{font-size:11px!important}.table td{font-size:12px!important}

  /* Kanban */
  .kanban{display:flex!important;gap:9px!important;overflow-x:auto!important;scroll-snap-type:x mandatory!important;max-width:100%!important;padding-bottom:6px!important}
  .kan-col{flex:0 0 min(88vw,330px)!important;min-width:0!important;scroll-snap-align:start!important}
  .kan-card{overflow-wrap:anywhere!important}

  /* Modais viram bottom sheet e nunca vazam */
  .modal-backdrop{align-items:flex-end!important;padding:0!important}
  .modal{width:100%!important;max-width:100%!important;max-height:92dvh!important;border-radius:22px 22px 0 0!important;overflow:hidden!important}
  .modal-head{min-height:58px!important;padding:12px 14px!important;gap:10px!important}.modal-head h2{font-size:20px!important;line-height:1.2!important;overflow-wrap:anywhere!important}
  .modal-body{max-width:100%!important;overflow-x:hidden!important;overflow-y:auto!important;padding:14px!important}
  .modal-foot{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px))!important}
  .modal-foot .btn{width:100%!important;min-height:46px!important}
  .property-detail-shell{height:94dvh!important;max-height:94dvh!important}
  .pw-hero,.pw-data-grid,.pw-gallery-grid{grid-template-columns:1fr!important}.pw-summary,.pw-panel{padding:14px!important}
  .pw-tabs{display:flex!important;max-width:100%!important;overflow-x:auto!important;white-space:nowrap!important}.pw-tab{flex:0 0 auto!important}
  .pw-spec-grid{grid-template-columns:1fr 1fr!important;gap:8px!important}

  /* Usuários/permissões */
  .ag-users-intro{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}.ag-current-access{min-width:0!important;width:100%!important;grid-template-columns:1fr!important}
  .ag-access-row,.ag-user-row{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;align-items:start!important}
  .ag-access-actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important}.ag-access-actions>*{width:100%!important;min-width:0!important}
  .ag-permission-grid{grid-template-columns:1fr!important}

  /* Menu lateral mobile */
  .sidebar{width:min(320px,86vw)!important;border-radius:0 20px 20px 0!important;padding-left:12px!important;padding-right:12px!important}
  .brand.brand--with-logo{display:flex!important;justify-content:center!important;padding:4px 0 10px!important}.brand-mark.logo-full img{width:110px!important;max-width:42vw!important}
  .nav{gap:3px!important}.nav button,.nav .nav-heart{min-height:46px!important;height:auto!important;padding:11px 13px!important;border-radius:12px!important;font-size:13px!important;line-height:1.2!important;white-space:normal!important;text-align:left!important}
  .sidebar-foot{position:sticky!important;bottom:0!important;background:#14253f!important;padding-bottom:calc(6px + env(safe-area-inset-bottom,0px))!important}

  /* Bottom navigation — estável, sem flutuar conteúdo */
  .mobile-bottom{left:8px!important;right:8px!important;bottom:calc(7px + env(safe-area-inset-bottom,0px))!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;padding:5px!important;border-radius:18px!important}
  .mobile-bottom button{min-width:0!important;min-height:50px!important;padding:3px 1px!important;font-size:10px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  .mobile-bottom button span{font-size:18px!important}

  /* Nada pode estourar a largura */
  .main *,.modal *,.sidebar *{box-sizing:border-box}
  .main img,.modal img{max-width:100%!important;height:auto}
  .main p,.main span,.main small,.main b,.main strong,.main h1,.main h2,.main h3,.main h4,.modal p,.modal span,.modal small,.modal b,.modal strong,.modal h1,.modal h2,.modal h3{max-width:100%;overflow-wrap:anywhere;word-break:normal}
}

@media (max-width: 420px){
  :root{--m-pad:10px}
  #loginScreen .login-card{padding:18px 16px 17px!important;border-radius:21px!important}
  #loginScreen .login-brand-center{margin-bottom:14px!important}
  #loginScreen .login-brand-center img{width:82px!important;max-width:24vw!important}
  #loginScreen .register-actions{grid-template-columns:1fr!important}
  .kpis{grid-template-columns:1fr 1fr!important}
  .kpi{min-height:101px!important;padding:12px!important}.kpi strong{font-size:23px!important}
  .pw-spec-grid{grid-template-columns:1fr!important}
  .mobile-bottom button{font-size:9px!important}
}

@media (max-width: 360px){
  #loginScreen .login-card{padding:16px 14px!important}
  #loginScreen .login-brand-center img{width:74px!important}
  .dashboard-intro h1,.page-head h1{font-size:28px!important}
  .kpis{grid-template-columns:1fr!important}
}