/* v1.5.83 — responsividade global para celulares, tablets, notebooks e ultrawide */
    html {
      -webkit-text-size-adjust: 100%;
      text-size-adjust: 100%;
      scroll-padding-top: 86px;
    }
    body { min-width: 0; overflow-x: hidden; }
    img, svg, video, canvas { max-width: 100%; }
    button, input, select, textarea { max-width: 100%; }
    .appbar > *, .appbar-actions > *, .page-head > *, .head-actions > *,
    .section-title > *, .dashboard-grid > *, .monitor-grid > *, .filters > *,
    .queue-item > *, .calendar-toolbar > *, .calendar-toolbar-left > *,
    .calendar-toolbar-right > *, .form-grid > *, .modal-foot > * { min-width: 0; }
    .main, .page, .card, .table-wrap, .calendar-shell, #calendarContent,
    #monitorCalendarContent, .modal-body { max-width: 100%; }
    .table-wrap, #calendarContent, #monitorCalendarContent {
      overscroll-behavior-inline: contain;
      -webkit-overflow-scrolling: touch;
      scrollbar-gutter: stable;
    }
    .table-wrap table { width: 100%; }
    .page-head h1, .section-title h2, .queue-name, .lawyer-name,
    .appointment-link, .monitor-live-client { overflow-wrap: anywhere; }
    .head-actions { justify-content: flex-end; }
    .modal { width: min(610px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); }
    .modal.modal-lg { width: min(820px, calc(100vw - 24px)); }
    .modal.modal-xl { width: min(1040px, calc(100vw - 24px)); }
    .call-popup { width: min(680px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); overflow-y: auto; }
    .monitor-call { min-height: clamp(280px, 48vh, 430px); }
    .monitor-call.is-empty { min-height: clamp(180px, 28vh, 245px); }

    /* Notebooks e telas intermediárias com menu lateral */
    @media (max-width: 1400px) {
      .stats-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
      .queue-item {
        grid-template-columns: 58px minmax(240px,1fr) 92px 116px minmax(280px,auto);
      }
      .queue-item .queue-lawyer { display: none; }
      .queue-lawyer-mobile { display: block; }
      .queue-actions { flex-wrap: wrap; }
      .filters, .filters[style] { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
      .danger-actions-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    }

    /* O menu vira gaveta antes de começar a esmagar o conteúdo */
    @media (max-width: 1100px) {
      .mobile-menu-toggle { display: grid; }
      .sidebar {
        transform: translateX(-105%);
        width: min(288px, 86vw);
        padding: 18px 14px 22px;
        box-shadow: 18px 0 40px rgba(20,30,34,.18);
      }
      .sidebar.open { transform: translateX(0); }
      .main, .app-shell.sidebar-collapsed .main { margin-left: 0; }
      .app-footer, .app-shell.sidebar-collapsed .app-footer { left: 0; }
      .app-shell.sidebar-collapsed .sidebar { width: min(288px,86vw); padding: 18px 14px 22px; }
      .app-shell.sidebar-collapsed .nav-section-title { display: block; }
      .app-shell.sidebar-collapsed .nav-label { display: inline; }
      .app-shell.sidebar-collapsed .nav-btn { justify-content: flex-start; gap: 11px; padding: 11px 12px; }
      .app-shell.sidebar-collapsed .nav-icon { flex-basis: 27px; width: 27px; font-size: 17px; }
      .sidebar-collapse-btn { display: none; }
      .dashboard-grid, .monitor-grid { grid-template-columns: 1fr; }
      .monitor-call { grid-row: auto; }
      .lawyer-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
      .queue-item {
        grid-template-columns: 56px minmax(230px,1fr) 88px 112px minmax(260px,auto);
      }
      .page-sticky-table { overflow-x: auto; overflow-y: visible; }
      .page-sticky-table thead th { position: static; }
    }

    /* Tablets: reorganiza a fila sem esconder horário ou situação */
    @media (max-width: 860px) {
      .app-brand { min-width: auto; }
      .app-brand > div:last-child { display: none; }
      .appbar-center { display: none; }
      .main { padding-left: 16px; padding-right: 16px; }
      .page-head { flex-direction: column; align-items: stretch; gap: 13px; }
      .head-actions { width: 100%; justify-content: flex-start; }
      .head-actions .btn { flex: 0 1 auto; }
      .stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
      .filters, .filters[style] { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
      .queue-item {
        grid-template-columns: 52px minmax(0,1fr);
        gap: 9px 12px;
        align-items: start;
        padding: 12px;
      }
      .queue-item > .queue-order { grid-column: 1; grid-row: 1 / span 3; width: 52px; min-height: 52px; }
      .queue-item > div:nth-child(2) { grid-column: 2; min-width: 0; }
      .queue-item .queue-lawyer { display: none !important; }
      .queue-lawyer-mobile { display: block; }
      .queue-item .queue-time {
        display: block !important;
        grid-column: 2;
        width: fit-content;
        min-width: 0;
      }
      .queue-item .queue-status { display: block !important; grid-column: 2; }
      .queue-item .queue-status .status-pill { width: fit-content; max-width: 100%; }
      .queue-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
        flex-wrap: wrap;
        padding-top: 4px;
      }
      .queue-actions .btn { flex: 0 1 auto; }
      .outcome-row { grid-template-columns: minmax(0,1fr); }
      .outcome-time { justify-content: flex-start; }
      .appointment-contact-grid, .appointment-detail-notes { grid-template-columns: 1fr; }
      .appointment-meta-row { grid-template-columns: 1fr; }
      .form-grid { grid-template-columns: repeat(6,minmax(0,1fr)); }
      .form-grid .span-12, .form-grid .span-8, .form-grid .span-6 { grid-column: span 6; }
      .form-grid .span-4, .form-grid .span-3, .form-grid .span-2 { grid-column: span 3; }
      .appointment-operational-row { grid-column: span 6; grid-template-columns: repeat(2,minmax(0,1fr)); }
      .modal.modal-edit-appointment .edit-appointment-operational-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
      .modal.modal-edit-appointment .edit-appointment-operational-row .field:first-child { grid-column: span 2; }
      .calendar-toolbar { align-items: stretch; }
      .calendar-toolbar-left, .calendar-toolbar-right { flex: 1 1 100%; }
      .calendar-toolbar-right { justify-content: space-between; }
      .calendar-title { width: 100%; font-size: clamp(18px,3.5vw,25px); }
      .calendar-legend { overflow-x: auto; flex-wrap: nowrap; justify-content: flex-start; }
      .calendar-grid, .calendar-weekdays-row,
      .monitor-calendar-panel .calendar-grid,
      .monitor-calendar-panel .calendar-weekdays-row { min-width: 760px; }
      .calendar-day-item { grid-template-columns: 72px minmax(0,1fr); }
      .calendar-day-item > *:nth-child(n+3) { grid-column: 2; }
      .monitor-top { align-items: stretch; flex-direction: column; }
      .monitor-filter { width: 100%; min-width: 0; }
      .monitor-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
      .monitor-live-item { grid-template-columns: minmax(0,1fr); }
      .monitor-live-status { justify-self: start; }
    }

    /* Celulares */
    @media (max-width: 650px) {
      :root { --responsive-appbar-height: 64px; }
      html { scroll-padding-top: 72px; }
      .appbar { height: 64px; padding: 0 10px; gap: 7px; }
      .sidebar { top: 64px; }
      .main { padding: 78px 10px 72px; }
      .page-sticky-zone { position: static; top: auto; padding-top: 0; margin-top: 0; }
      .app-footer { min-height: 48px; padding: 6px 8px calc(6px + env(safe-area-inset-bottom)); }
      .app-footer strong { font-size: 11px; }
      .app-footer span { font-size: 9px; }
      .app-logo { width: 22px; height: 40px; }
      .appbar-actions { gap: 5px; }
      .icon-btn, .appbar .theme-toggle { width: 36px; min-width: 36px; height: 36px; border-radius: 10px; }
      .user-chip { padding: 4px; background: transparent; }
      .user-chip > div:last-child, #userRole { display: none !important; }
      .avatar { min-width: 36px; height: 32px; padding: 0 7px; }
      .admin-menu-popover { position: fixed; top: 68px; right: 8px; left: 8px; width: auto; max-height: calc(100dvh - 78px); overflow-y: auto; }
      .admin-menu-popover::before { display: none; }
      .page-head h1 { font-size: clamp(22px,7vw,28px); }
      .page-head p { font-size: 13px; line-height: 1.45; }
      .head-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
      .head-actions .btn { width: 100%; min-height: 42px; padding-left: 9px; padding-right: 9px; }
      .stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
      .stat-card { padding: 13px; }
      .stat-value { font-size: 24px; }
      .filters, .filters[style] { grid-template-columns: 1fr !important; padding: 11px; }
      .queue-list { padding: 8px; gap: 8px; }
      .queue-mode-bar { margin: 8px 8px 0; padding: 11px; align-items: flex-start; flex-wrap: wrap; }
      .queue-mode-lawyer { flex-basis: 100%; }
      .queue-mode-count { min-width: 68px; }
      .queue-item { grid-template-columns: 48px minmax(0,1fr); padding: 10px; }
      .queue-item > .queue-order { width: 48px; min-height: 48px; }
      .queue-name .appointment-link { white-space: normal; overflow-wrap: anywhere; }
      .queue-created-by { max-width: 100%; }
      .queue-actions { gap: 6px; }
      .queue-actions .btn { flex: 1 1 calc(50% - 6px); min-height: 38px; }
      .lawyer-badge { width: 100%; }
      .lawyer-badge-name { white-space: normal; overflow: visible; text-overflow: clip; }
      .form-grid { grid-template-columns: 1fr; }
      .form-grid .span-12, .form-grid .span-8, .form-grid .span-6,
      .form-grid .span-4, .form-grid .span-3, .form-grid .span-2 { grid-column: auto; }
      .appointment-operational-row,
      .modal.modal-edit-appointment .edit-appointment-operational-row { grid-column: auto; grid-template-columns: 1fr; }
      .modal.modal-edit-appointment .edit-appointment-operational-row .field:first-child { grid-column: auto; }
      .lawyer-grid, .settings-grid, .popup-template-editor-grid, .danger-actions-grid, .test-generator-types { grid-template-columns: 1fr; }
      .section-title { align-items: flex-start; padding: 14px; }
      .modal-backdrop, .call-popup-backdrop { padding: 6px; align-items: center; }
      .modal, .modal.modal-lg, .modal.modal-xl, .call-popup {
        width: calc(100vw - 12px);
        max-height: calc(100dvh - 12px);
        border-radius: 16px;
      }
      .modal-head { padding: 14px; }
      .modal-body { padding: 14px; }
      .modal-foot { padding: 10px 14px 14px; flex-wrap: wrap; }
      .modal-foot .btn { flex: 1 1 calc(50% - 6px); min-height: 42px; }
      .call-popup-top { padding: 22px 18px 18px; }
      .call-popup-body { padding: 18px; }
      .call-popup-actions { flex-wrap: wrap; }
      .call-popup-actions .btn { flex: 1 1 100%; }
      .floating-call-alert { top: 70px; width: calc(100vw - 16px); padding: 11px 12px; align-items: flex-start; }
      .toast-stack { right: 8px; bottom: 8px; width: calc(100vw - 16px); }
      .calendar-toolbar { position: static; padding: 12px; flex-direction: column; }
      .calendar-toolbar-left, .calendar-toolbar-right { width: 100%; align-items: stretch; }
      .calendar-toolbar-left { display: grid; grid-template-columns: auto auto minmax(0,1fr); }
      .calendar-toolbar-right { display: grid; grid-template-columns: 1fr; }
      .calendar-toolbar-right .field, .calendar-toolbar-right select { width: 100%; }
      .calendar-view-switch { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); width: 100%; }
      .calendar-view-switch .btn { width: 100%; padding-left: 8px; padding-right: 8px; }
      .calendar-grid, .calendar-weekdays-row,
      .monitor-calendar-panel .calendar-grid,
      .monitor-calendar-panel .calendar-weekdays-row { min-width: 680px; }
      .calendar-day-summary { grid-template-columns: 1fr 1fr; }
      .calendar-day-item { grid-template-columns: 1fr; gap: 10px; padding: 12px; }
      .calendar-day-item > * { grid-column: 1 !important; }
      .calendar-day-item .btn { width: 100%; }
      .monitor-page { padding: 8px; }
      .monitor-summary { grid-template-columns: 1fr 1fr; gap: 8px; }
      .monitor-summary-card { padding: 12px; }
      .monitor-summary-card strong { font-size: 24px; }
      .monitor-call { min-height: 240px; padding: 24px 16px; border-radius: 20px; }
      .monitor-call.is-empty { min-height: 165px; padding: 20px 14px; }
      .monitor-call.is-empty .monitor-client { font-size: clamp(25px,8vw,34px) !important; }
      .monitor-live-title { align-items: flex-start; flex-direction: column; margin-bottom: 12px; }
      .monitor-live-scroll-hint { white-space: normal; }
      .monitor-live-item { padding: 14px; border-radius: 14px; }
      .monitor-live-client { font-size: clamp(21px,7vw,30px); }
      .login-card { min-height: 100dvh; }
      .login-hero h1 { white-space: normal; font-size: clamp(31px,10vw,42px); margin-top: 28px; }
      .login-hero, .login-form-panel { padding: 26px 20px; }
      .compat-option { grid-template-columns: 38px minmax(0,1fr); }
      .compat-option-status { grid-column: 2; justify-self: start; white-space: normal; }
    }

    @media (max-width: 420px) {
      .stats-grid, .monitor-summary, .report-summary, .calendar-day-summary { grid-template-columns: 1fr; }
      .head-actions { grid-template-columns: 1fr; }
      .queue-item { grid-template-columns: 44px minmax(0,1fr); }
      .queue-item > .queue-order { width: 44px; min-height: 46px; }
      .queue-actions .btn, .modal-foot .btn { flex-basis: 100%; }
      .calendar-toolbar-left { grid-template-columns: auto auto; }
      .calendar-title { grid-column: 1 / -1; }
      .calendar-grid, .calendar-weekdays-row,
      .monitor-calendar-panel .calendar-grid,
      .monitor-calendar-panel .calendar-weekdays-row { min-width: 620px; }
      .appointment-copy-label { align-items: flex-start; flex-direction: column; }
      .app-brand { display: none; }
      .app-footer { min-height: 40px; }
      .app-footer span { display: none; }
      .app-footer strong { font-size: 10px; }
      .main { padding-bottom: 58px; }
    }

    @media (max-width: 340px) {
      .appbar { padding-left: 6px; padding-right: 6px; }
      .appbar-actions { gap: 3px; }
      .icon-btn, .appbar .theme-toggle { width: 34px; min-width: 34px; height: 34px; }
      .avatar { min-width: 32px; padding: 0 5px; font-size: 10px; }
      .main { padding-left: 7px; padding-right: 7px; }
      .card { border-radius: 13px; }
      .queue-list { padding: 6px; }
      .queue-item { padding: 8px; gap: 7px 9px; }
      .btn { font-size: 12px; }
    }

    /* Telas baixas, zoom alto e notebooks compactos */
    @media (max-height: 720px) {
      .monitor-call { min-height: 250px; }
      .monitor-call.is-empty { min-height: 150px; }
      .monitor-live-list.is-scrollable { max-height: 250px; }
      .modal, .call-popup { max-height: calc(100dvh - 12px); }
      .login-hero { min-height: auto; }
    }

    @media (hover: none) {
      .btn:hover, .queue-item:hover, .calendar-event:hover,
      .appointment-copy-card:hover, .monitor-live-item:hover { transform: none; }
    }

  

    /* v1.5.89 — exibe ordem da fila e posição real do atendimento */
    .queue-order.attended-order {
      min-height: 72px !important;
      padding: 6px 3px !important;
      gap: 2px;
    }
    .queue-order.attended-order .queue-original-order {
      display: block;
      font-size: 18px;
      line-height: 1;
      font-weight: 950;
    }
    .queue-order.attended-order .queue-attended-label {
      display: block;
      max-width: none;
      font-size: 8px;
      line-height: 1.05;
      font-weight: 950;
      letter-spacing: .055em;
      opacity: .82;
    }
    .queue-order.attended-order .queue-attended-rank {
      display: block;
      max-width: none;
      margin-top: 0;
      font-size: 8px;
      line-height: 1.05;
      font-weight: 950;
      letter-spacing: .04em;
      opacity: 1;
    }
    .queue-order.attended-order .queue-attended-rank b {
      font-size: 13px;
      line-height: 1;
    }

  
    /* v1.5.90 — o acompanhamento não acompanha a altura da coluna lateral */
    .monitor-grid { align-items:start; }
    .monitor-call { align-self:start; }
    .monitor-call:not(.is-empty) {
      min-height:0;
      height:auto;
      padding:28px;
      place-items:stretch;
      text-align:left;
    }
    .monitor-call:not(.is-empty) .monitor-live-title { margin-bottom:14px; }
    .monitor-call:not(.is-empty) .monitor-live-list.is-scrollable {
      max-height:364px;
      overflow-y:auto;
      overscroll-behavior:contain;
      scrollbar-gutter:stable;
    }
    @media (max-width:760px) {
      .monitor-call:not(.is-empty) { padding:20px 16px; }
      .monitor-call:not(.is-empty) .monitor-live-list.is-scrollable { max-height:330px; }
    }


    /* v1.5.93 — Recepção pode iniciar e concluir atendimentos */
    .monitor-grid {
      --monitor-board-height: clamp(430px, calc(100vh - 300px), 560px);
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px;
      align-items: start;
    }
    .monitor-grid .monitor-call {
      grid-column: span 2;
      grid-row: auto;
      width: 100%;
      min-width: 0;
    }
    .monitor-grid .monitor-list-card {
      width: 100%;
      min-width: 0;
      min-height: 0;
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }
    .monitor-grid.has-live .monitor-call,
    .monitor-grid.has-live .monitor-list-card {
      height: var(--monitor-board-height) !important;
      min-height: var(--monitor-board-height) !important;
      max-height: var(--monitor-board-height) !important;
    }
    .monitor-grid:not(.has-live) .monitor-call.is-empty,
    .monitor-grid:not(.has-live) .monitor-list-card {
      height: 245px !important;
      min-height: 245px !important;
      max-height: 245px !important;
    }
    .monitor-grid .monitor-call:not(.is-empty) {
      overflow: hidden;
    }
    .monitor-grid .monitor-live-wrap {
      height: 100%;
      min-height: 0;
      display: flex;
      flex-direction: column;
    }
    .monitor-grid .monitor-live-list,
    .monitor-grid .monitor-live-list.is-scrollable {
      min-height: 0;
      flex: 1;
      max-height: none;
      overflow-y: auto;
      overscroll-behavior: contain;
      scrollbar-gutter: stable;
      padding-right: 8px;
    }
    #monitorWaiting,
    #monitorAttended {
      min-height: 0;
      flex: 1;
      overflow-y: auto;
      overscroll-behavior: contain;
      scrollbar-gutter: stable;
      padding-right: 7px;
    }
    #monitorWaiting::-webkit-scrollbar,
    #monitorAttended::-webkit-scrollbar { width: 9px; }
    #monitorWaiting::-webkit-scrollbar-track,
    #monitorAttended::-webkit-scrollbar-track { background: var(--surface-2); border-radius: 999px; }
    #monitorWaiting::-webkit-scrollbar-thumb,
    #monitorAttended::-webkit-scrollbar-thumb { background: var(--border-strong, var(--border)); border: 2px solid transparent; background-clip: padding-box; border-radius: 999px; }
    .monitor-list-card .waiting-row {
      grid-template-columns: 34px minmax(0, 1fr) auto;
      gap: 8px;
      padding: 10px 0;
    }
    .monitor-list-card .lawyer-badge.compact {
      max-width: 100%;
    }
    .monitor-footer {
      position: sticky;
      bottom: -22px;
      z-index: 73;
      min-height: 56px;
      margin: 18px -22px -22px;
      padding: 9px 18px calc(9px + env(safe-area-inset-bottom));
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 2px;
      border-top: 1px solid var(--border);
      background: var(--surface);
      box-shadow: 0 -8px 24px rgba(32,16,20,.08);
      color: var(--text);
      text-align: center;
    }
    .monitor-footer strong { font-size: 13px; line-height: 1.2; }
    .monitor-footer span { color: var(--muted); font-size: 11px; line-height: 1.2; font-weight: 700; }
    @media (max-width: 1279px) {
      .monitor-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
      .monitor-grid .monitor-call { grid-column: span 2; }
    }
    @media (max-width: 760px) {
      .monitor-grid { grid-template-columns: 1fr; --monitor-board-height: min(520px, calc(100vh - 180px)); }
      .monitor-grid .monitor-call { grid-column: auto; }
      .monitor-grid.has-live .monitor-call,
      .monitor-grid.has-live .monitor-list-card { height: var(--monitor-board-height) !important; min-height: var(--monitor-board-height) !important; max-height: var(--monitor-board-height) !important; }
      .monitor-footer { bottom: -8px; margin: 14px -8px -8px; min-height: 50px; padding-left: 10px; padding-right: 10px; }
      .monitor-footer strong { font-size: 11px; }
      .monitor-footer span { font-size: 9px; }
    }