/* NovaCore F68 — Mobile Web Responsive Enterprise
   Global foundation. Module-specific corrections live in later F68 work packages. */

:root {
  --nc-mobile-nav-clearance: 5.85rem;
  --nc-mobile-inline: .75rem;
  --nc-mobile-viewport-height: 100dvh;
}

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { min-width: 0; }
img, svg, video, canvas { max-width: 100%; }
.main-content, .main-content > *, .panel, .panel-card, .page-header, .page-hero { min-width: 0; }
.main-content :is(p,dd,li,a,strong,small,code) { overflow-wrap: anywhere; }

/* Scroll containers must remain touch-friendly even when inherited from legacy modules. */
body.app-shell :is(.table-wrap,.visual-table-wrap,.table-scroll,.responsive-table,.nc3-table-shell,[data-table-scroll]) {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable;
}

body.app-shell :is(.people-tabs,.attendance-tabs,.assets-tabs,.enterprise-tabs,.portal-tabs,.crm-tabs,.subnav,.subnav-tabs,.section-tabs) {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
body.app-shell :is(.people-tabs,.attendance-tabs,.assets-tabs,.enterprise-tabs,.portal-tabs,.crm-tabs,.subnav,.subnav-tabs,.section-tabs) > * {
  flex: 0 0 auto;
}

/* Avoid accidental viewport escape from long identifiers and third-party content. */
body.app-shell :is(.panel,.panel-card,.stat-card,.module-card,.page-header,.page-hero,.form-card,.content-card) {
  max-width: 100%;
}
body.app-shell :is(input,select,textarea,button) { max-width: 100%; }

@media (max-width: 900px) {
  body.app-shell { min-height: var(--nc-mobile-viewport-height); }
  body.app-shell .sidebar {
    width: min(19rem, 88vw);
    max-width: 88vw;
    padding-bottom: max(.85rem, env(safe-area-inset-bottom));
  }
  body.app-shell .topbar {
    padding-left: max(.7rem, env(safe-area-inset-left));
    padding-right: max(.7rem, env(safe-area-inset-right));
  }
  body.app-shell .topbar-title,
  body.app-shell .topbar-context {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  body.app-shell .topbar-actions { min-width: 0; gap: .45rem; }
  body.app-shell .main-content {
    width: 100%;
    max-width: 100vw;
    padding-left: max(var(--nc-mobile-inline), env(safe-area-inset-left));
    padding-right: max(var(--nc-mobile-inline), env(safe-area-inset-right));
    padding-bottom: calc(var(--nc-mobile-nav-clearance) + env(safe-area-inset-bottom));
  }

  body.app-shell .mobile-nav {
    left: max(.55rem, env(safe-area-inset-left));
    right: max(.55rem, env(safe-area-inset-right));
    bottom: max(.5rem, env(safe-area-inset-bottom));
    width: auto;
    max-width: calc(100vw - 1.1rem);
    grid-template-columns: repeat(5, minmax(0,1fr)) !important;
  }
  body.app-shell .mobile-nav :is(a,button) {
    position: relative;
    min-width: 0;
    min-height: 52px;
    padding: .25rem .15rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .16rem;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #667085;
    font: inherit;
    font-size: .59rem;
    line-height: 1.08;
    text-align: center;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  body.app-shell .mobile-nav :is(a,button) > span { display: grid; place-items: center; }
  body.app-shell .mobile-nav :is(a,button):focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: -2px;
  }

  body.app-shell :is(.profile-popover,.notification-popover) {
    position: fixed;
    left: max(.5rem, env(safe-area-inset-left));
    right: max(.5rem, env(safe-area-inset-right));
    top: calc(var(--topbar-height) + .35rem);
    width: auto;
    max-width: none;
    max-height: calc(var(--nc-mobile-viewport-height) - var(--topbar-height) - 1rem);
    overflow: auto;
  }
  body.app-shell .notification-popover::before { display: none; }

  body.app-shell .main-content :is(dialog,.modal,.modal-card,.dialog-card,.drawer,.sheet,[role="dialog"]) {
    max-width: calc(100vw - 1rem);
    max-height: calc(var(--nc-mobile-viewport-height) - 1rem);
  }

  body.app-shell :is(.toolbar,.filter-bar,.filters-bar,.search-bar,.panel-toolbar) {
    max-width: 100%;
    flex-wrap: wrap;
  }
}

@media (max-width: 640px) {
  :root {
    --nc-mobile-inline: .62rem;
    --nc-mobile-nav-clearance: 5.55rem;
  }

  /* 16px prevents iOS Safari from zooming form controls on focus. */
  body.app-shell :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) {
    font-size: 16px;
  }

  body.app-shell :is(.page-header,.page-hero) { padding: .85rem; }
  body.app-shell :is(.page-actions,.header-actions,.hero-actions,.panel-actions,.form-actions,.nc-action-cluster) {
    min-width: 0;
  }
  body.app-shell :is(.page-actions,.header-actions,.hero-actions,.form-actions,.nc-action-cluster) > * {
    width: 100%;
    max-width: 100%;
  }

  body.app-shell :is(.people-tabs,.attendance-tabs,.assets-tabs,.enterprise-tabs,.portal-tabs,.crm-tabs,.subnav,.subnav-tabs,.section-tabs) {
    margin-left: 0;
    margin-right: 0;
    padding-bottom: .2rem;
  }

  body.app-shell .main-content :is(dialog,.modal,.modal-card,.dialog-card,[role="dialog"]) {
    width: calc(100vw - .75rem);
    max-width: calc(100vw - .75rem);
    margin-inline: auto;
  }

  body.app-shell .mobile-nav :is(a,button) { font-size: .55rem; }
  body.app-shell .mobile-nav :is(a,button) > span { width: 20px; height: 20px; }
}

@media (max-width: 390px) {
  :root { --nc-mobile-inline: .5rem; }
  body.app-shell .mobile-nav {
    left: max(.35rem, env(safe-area-inset-left));
    right: max(.35rem, env(safe-area-inset-right));
  }
  body.app-shell .mobile-nav :is(a,button) { font-size: .51rem; letter-spacing: -.01em; }
  body.app-shell .topbar-actions { gap: .25rem; }
}

@media (hover: none) and (pointer: coarse) {
  body.app-shell :is(.button,button,[role="button"],input[type="submit"],input[type="button"],summary) {
    min-height: 44px;
  }
  body.app-shell a.nav-item { min-height: 44px; }
}

@media (max-height: 520px) and (max-width: 900px) and (orientation: landscape) {
  :root { --nc-mobile-nav-clearance: 4.8rem; }
  body.app-shell .mobile-nav { height: 56px; }
  body.app-shell .mobile-nav :is(a,button) { min-height: 46px; }
}


/* F68C — Core work modules: Tasks, Projects, Approvals, Management and NovaDrive */
@media (max-width: 900px) {
  /* Work modules must never create a second page-level horizontal scrollbar. */
  body.app-shell :is(.tasks-page,.task-detail-page,.task-form-page,.projects-page,.project-detail-page,.project-board-page,.project-timeline-page,.project-workload-page,.project-form-page,.approvals-page,.approvals-delegations-page,.approvals-template-detail-page,.approvals-templates-page,.approvals-form-page,.enterprise-management-page,.drive-page,.drive-detail-page) {
    min-width: 0;
    max-width: 100%;
  }

  body.app-shell :is(.task-detail-grid,.project-detail-grid,.enterprise-management-grid,.drive-detail-grid) > * {
    min-width: 0;
  }

  /* Governance action forms become full-width rows instead of squeezing inputs/buttons. */
  body.app-shell :is(.governance-assignment-panel,.governance-review-panel) .page-actions {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
    width: 100%;
  }
  body.app-shell :is(.governance-assignment-panel,.governance-review-panel) .page-actions form {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: .55rem;
    width: 100%;
    min-width: 0;
  }

  /* Kanban remains horizontally navigable, but each column is phone-sized and touch friendly. */
  body.app-shell .kanban-board {
    max-width: 100%;
    grid-auto-columns: minmax(min(18rem, calc(100vw - 2rem)), 1fr);
    scroll-snap-type: x proximity;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    padding-inline: .05rem;
    scroll-padding-inline: .05rem;
  }
  body.app-shell .kanban-column {
    min-width: 0;
    scroll-snap-align: start;
  }
  body.app-shell .kanban-card,
  body.app-shell .kanban-card > a { min-width: 0; }

  /* Management cards and document rows may contain long company/document labels. */
  body.app-shell :is(.enterprise-management-kpis article,.enterprise-domain-grid > a,.enterprise-document-list > a,.enterprise-compact-list > a) {
    min-width: 0;
  }

  /* NovaDrive cards, grants and preview are bounded to the actual visual viewport. */
  body.app-shell :is(.drive-card,.drive-card > a,.drive-folder-summary,.drive-folder-access summary,.drive-grants article,.drive-version-list article,.drive-trash-list article) {
    min-width: 0;
  }
  body.app-shell .drive-preview-dialog {
    max-width: calc(100vw - .75rem);
    max-height: calc(var(--nc-mobile-viewport-height) - .75rem);
  }
}

@media (max-width: 640px) {
  /* Tasks + approvals share rows. On phones content gets the full width and no badge is crushed into the priority rail. */
  body.app-shell :is(.tasks-page,.approvals-page) .task-row {
    gap: .65rem;
    padding: .78rem;
  }
  body.app-shell :is(.tasks-page,.approvals-page) .task-row-main p {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }

  body.app-shell :is(.approvals-delegations-page,.approvals-template-detail-page,.approvals-templates-page) .task-row {
    grid-template-columns: 1fr;
    gap: .55rem;
    padding: .78rem;
  }
  body.app-shell :is(.approvals-delegations-page,.approvals-template-detail-page,.approvals-templates-page) .task-row > :is(.task-badge,.task-priority) {
    width: fit-content;
    max-width: 100%;
    height: auto;
    min-height: 0;
  }
  body.app-shell :is(.approvals-delegations-page,.approvals-template-detail-page,.approvals-templates-page) .task-row > form {
    width: 100%;
  }
  body.app-shell :is(.approvals-delegations-page,.approvals-template-detail-page,.approvals-templates-page) .task-row > form .button {
    width: 100%;
  }

  body.app-shell :is(.governance-assignment-panel,.governance-review-panel) .page-actions form {
    grid-template-columns: 1fr;
  }
  body.app-shell :is(.governance-assignment-panel,.governance-review-panel) .page-actions form .button {
    width: 100%;
  }

  /* Project detail lists become readable cards instead of compressed desktop rows. */
  body.app-shell :is(.project-task-list > a,.project-milestones article,.project-deliverables article,.project-dependencies article) {
    grid-template-columns: 1fr;
    align-items: start;
  }
  body.app-shell .project-dependencies article > span {
    transform: rotate(90deg);
    justify-self: start;
  }
  body.app-shell .project-card > :is(header,footer),
  body.app-shell .project-members article,
  body.app-shell .workload-card header {
    min-width: 0;
    flex-wrap: wrap;
  }
  body.app-shell .workload-card dl {
    grid-template-columns: 1fr 1fr 1fr;
  }

  /* Keep a single useful Kanban column visible, with a hint of the next one on wider phones. */
  body.app-shell .kanban-board {
    grid-auto-columns: min(84vw, 19rem);
    gap: .6rem;
  }
  body.app-shell .kanban-column { min-height: min(420px, 62dvh); }
  body.app-shell .kanban-move button { min-width: 44px; min-height: 44px; }

  /* Enterprise management. */
  body.app-shell .enterprise-management-kpis article {
    grid-template-columns: auto minmax(0,1fr);
  }
  body.app-shell .enterprise-management-kpis article > b {
    grid-column: 2;
    justify-self: start;
  }
  body.app-shell .enterprise-domain-grid > a,
  body.app-shell .enterprise-document-list > a {
    grid-template-columns: auto minmax(0,1fr);
  }
  body.app-shell :is(.enterprise-domain-grid,.enterprise-document-list) > a > b,
  body.app-shell .enterprise-document-list > a > time {
    grid-column: 2;
    justify-self: start;
  }

  /* NovaDrive. */
  body.app-shell .drive-grid { grid-template-columns: 1fr; }
  body.app-shell .drive-card {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  body.app-shell .drive-card > a { width: calc(100% - 2.8rem); }
  body.app-shell .drive-card.file-card > time {
    width: 100%;
    padding-left: 3.4rem;
    color: var(--muted);
  }
  body.app-shell .drive-folder-summary {
    align-items: flex-start;
    flex-direction: column;
  }
  body.app-shell .drive-folder-access summary {
    align-items: flex-start;
    flex-direction: column;
  }
  body.app-shell .drive-grants article,
  body.app-shell .drive-version-list article,
  body.app-shell .drive-trash-list article {
    width: 100%;
  }
  body.app-shell .drive-grants article > form,
  body.app-shell .drive-version-list article > div:last-child {
    width: 100%;
  }
  body.app-shell .drive-version-list article > div:last-child {
    flex-wrap: wrap;
  }
  body.app-shell .drive-preview-dialog {
    width: calc(100vw - .35rem) !important;
    max-width: calc(100vw - .35rem) !important;
    height: calc(var(--nc-mobile-viewport-height) - .35rem) !important;
    max-height: calc(var(--nc-mobile-viewport-height) - .35rem) !important;
    margin: auto;
    border-radius: 14px;
  }
  body.app-shell .drive-preview-shell > header {
    align-items: flex-start;
    gap: .5rem;
    padding: .65rem;
  }
  body.app-shell .drive-preview-actions { flex: 0 0 auto; }
  body.app-shell .drive-preview-actions .button { display: none; }
}

@media (max-width: 390px) {
  body.app-shell .kanban-board { grid-auto-columns: 86vw; }
  body.app-shell .task-summary,
  body.app-shell .task-form,
  body.app-shell .project-hero,
  body.app-shell :is(.enterprise-domain-panel,.enterprise-procurement-panel,.enterprise-document-strip) {
    padding: .8rem;
  }
  body.app-shell .workload-card dl { grid-template-columns: 1fr; }
  body.app-shell .drive-card > a { width: 100%; }
  body.app-shell .drive-card > :is(form,time) { margin-left: 3.4rem; }
}

/* F68D — People, Attendance and Assets mobile normalization */
@media (max-width: 900px) {
  /* These operational modules carry dense enterprise data. Bound every major region
     to the content viewport so a single desktop child cannot widen the whole page. */
  body.app-shell :is(
    .page-shell,
    .attendance-page,
    .assets-page,
    .assets-dashboard,
    .attendance-dashboard-grid,
    .attendance-clock-grid,
    .attendance-assignment-grid,
    .assets-dashboard-grid,
    .assignment-detail-layout,
    .asset-data-grid,
    .intake-device-card,
    .agent-security-grid
  ) { min-width: 0; max-width: 100%; }

  /* People / HR: filters and record actions remain usable without tiny controls. */
  body.app-shell .page-shell :is(.panel-heading,.page-header) {
    min-width: 0;
  }
  body.app-shell .page-shell :is(.panel-heading,.page-header) > * {
    min-width: 0;
  }
  body.app-shell .page-shell .portal-row-actions {
    max-width: 100%;
  }
  body.app-shell .page-shell .inline-form {
    max-width: 100%;
    flex-wrap: wrap;
  }

  /* Attendance: camera/dialog and clock always fit the visual viewport. */
  body.app-shell .attendance-face-dialog {
    width: min(100%, calc(100vw - .75rem));
    max-width: min(620px, calc(100vw - .75rem));
    max-height: calc(var(--nc-mobile-viewport-height) - .75rem);
  }
  body.app-shell .attendance-face-dialog-card {
    max-height: calc(var(--nc-mobile-viewport-height) - .75rem);
    overflow: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
  body.app-shell .attendance-camera-frame {
    width: min(100%, 480px);
    max-height: min(480px, calc(var(--nc-mobile-viewport-height) - 12rem));
    margin-inline: auto;
  }
  body.app-shell :is(.attendance-record-row,.list-row,.record-row) {
    min-width: 0;
  }
  body.app-shell :is(.attendance-record-row,.list-row,.record-row) > * {
    min-width: 0;
  }
  body.app-shell .attendance-filter {
    min-width: 0;
  }

  /* Assets: intake, assignment and physical inventory regions may contain long
     serials, hostnames and tickets. Keep the overflow local to the component. */
  body.app-shell :is(
    .intake-device-main,
    .intake-device-copy,
    .intake-suggestion-mini,
    .assignment-action-card,
    .assignment-condition-grid article,
    .assignment-acta-grid article,
    .person-linked-item,
    .asset-support-row,
    .asset-support-ticket,
    .agent-secret-card,
    .agent-endpoint-list dd
  ) { min-width: 0; }

  body.app-shell :is(
    .technical-value,
    .ticket-reference,
    .agent-secret-card code,
    .agent-endpoint-list code,
    .asset-data-grid dd
  ) {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  body.app-shell .inventory-progress {
    max-width: 100%;
  }
}

@media (max-width: 640px) {
  /* People / RRHH */
  body.app-shell .page-shell :is(.page-header,.panel-heading) {
    align-items: flex-start;
  }
  body.app-shell .page-shell .form-grid.two,
  body.app-shell .page-shell .definition-grid {
    grid-template-columns: 1fr;
  }
  body.app-shell .page-shell .form-actions,
  body.app-shell .page-shell .portal-row-actions {
    width: 100%;
  }
  body.app-shell .page-shell .form-actions > *,
  body.app-shell .page-shell .portal-row-actions > * {
    max-width: 100%;
  }
  body.app-shell .page-shell .inline-form {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    gap: .55rem;
  }
  body.app-shell .page-shell .inline-form :is(input,select,textarea,.button,button) {
    width: 100%;
    max-width: 100%;
  }

  /* Attendance dashboard and daily records become readable phone cards. */
  body.app-shell .attendance-clock-head {
    align-items: flex-start;
    flex-direction: column;
    gap: .45rem;
  }
  body.app-shell .attendance-clock-head h2 {
    font-size: clamp(2rem, 11vw, 2.75rem);
    line-height: 1;
    overflow-wrap: anywhere;
  }
  body.app-shell .attendance-clock-actions,
  body.app-shell .attendance-clock-actions > *,
  body.app-shell .attendance-primary-action {
    width: 100%;
    max-width: 100%;
  }
  body.app-shell .attendance-record-row {
    grid-template-columns: 1fr auto;
    gap: .35rem .65rem;
    align-items: start;
  }
  body.app-shell .attendance-record-row > time {
    grid-column: 1/-1;
  }
  body.app-shell .attendance-record-row > div {
    grid-column: 1;
  }
  body.app-shell .attendance-record-row > :last-child {
    grid-column: 2;
    grid-row: 2;
    justify-self: end;
  }
  body.app-shell :is(.compact-definition-list,.attendance-summary-list) > div {
    align-items: flex-start;
    flex-direction: column;
    gap: .25rem;
  }
  body.app-shell :is(.compact-definition-list,.attendance-summary-list) dd {
    width: 100%;
    overflow-wrap: anywhere;
  }
  body.app-shell .attendance-day-editor,
  body.app-shell .attendance-policy-options,
  body.app-shell .leave-config-grid,
  body.app-shell .leave-detail-grid,
  body.app-shell .checkbox-grid,
  body.app-shell .form-check-grid {
    grid-template-columns: 1fr;
  }
  body.app-shell .attendance-day-editor .checkbox-label,
  body.app-shell .field-span-2 {
    grid-column: 1;
  }
  body.app-shell .attendance-face-dialog-card {
    padding: .8rem;
    gap: .8rem;
    border-radius: 14px;
  }
  body.app-shell .attendance-camera-frame {
    max-height: min(70vw, calc(var(--nc-mobile-viewport-height) - 13rem));
    border-radius: 14px;
  }
  body.app-shell .biometric-previews {
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: .4rem;
  }
  body.app-shell .inline-review-form {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }
  body.app-shell .inline-review-form :is(input,.button,button) {
    width: 100%;
    min-width: 0;
  }
  body.app-shell .attendance-geo-cell {
    min-width: 0;
  }
  body.app-shell .attendance-geo-audit-table code,
  body.app-shell .attendance-table code {
    white-space: normal;
    overflow-wrap: anywhere;
  }

  /* Assets dashboard + new-device intake. */
  body.app-shell .assets-kpi-grid,
  body.app-shell .assets-dashboard-grid,
  body.app-shell .assets-report-grid,
  body.app-shell .agent-security-grid,
  body.app-shell .assets-two-columns,
  body.app-shell .assignment-condition-grid,
  body.app-shell .assignment-acta-grid,
  body.app-shell .person-assets-summary {
    grid-template-columns: 1fr;
  }
  body.app-shell .asset-compact-list > a {
    grid-template-columns: auto minmax(0,1fr);
  }
  body.app-shell .asset-compact-list > a time {
    grid-column: 2;
    white-space: normal;
  }
  body.app-shell .phase-boundary-card {
    gap: .8rem;
    padding: .9rem;
  }
  body.app-shell .phase-chip-list {
    width: 100%;
    justify-content: flex-start;
  }
  body.app-shell .intake-card-list {
    padding-inline: .6rem;
  }
  body.app-shell .intake-device-card {
    gap: .75rem;
    padding: .8rem;
    border-radius: 14px;
  }
  body.app-shell .intake-device-main {
    gap: .65rem;
  }
  body.app-shell .intake-device-title {
    align-items: flex-start;
  }
  body.app-shell .intake-device-title > :is(a,strong) {
    overflow-wrap: anywhere;
  }
  body.app-shell .intake-device-meta {
    grid-template-columns: 1fr;
    gap: .45rem;
  }
  body.app-shell .intake-suggestion-mini {
    align-items: flex-start;
  }
  body.app-shell .intake-device-actions {
    grid-template-columns: 1fr;
    width: 100%;
  }
  body.app-shell .intake-device-actions .button {
    width: 100%;
    white-space: normal;
  }

  /* Asset assignment and employee-linked equipment. */
  body.app-shell .assignment-detail-layout {
    grid-template-columns: 1fr;
  }
  body.app-shell .assignment-actions-column {
    position: static;
  }
  body.app-shell .assignment-action-card details {
    padding: .8rem;
  }
  body.app-shell .assignment-acta-grid article,
  body.app-shell .person-linked-item,
  body.app-shell .asset-support-row,
  body.app-shell .asset-support-ticket {
    align-items: flex-start;
    flex-direction: column;
  }
  body.app-shell .person-linked-item > *,
  body.app-shell .asset-support-row > *,
  body.app-shell .asset-support-ticket > * {
    max-width: 100%;
  }
  body.app-shell .assignment-acta-document {
    max-width: 100%;
    padding: 1rem .75rem;
  }
  body.app-shell .assignment-acta-document > header,
  body.app-shell .assignment-acta-document footer {
    align-items: flex-start;
    flex-direction: column;
    gap: .55rem;
  }
  body.app-shell .acta-folio {
    text-align: left;
  }
  body.app-shell .acta-grid,
  body.app-shell .acta-accessories,
  body.app-shell .acta-signatures {
    grid-template-columns: 1fr;
  }
  body.app-shell .acta-signatures {
    gap: 2.5rem;
    margin-top: 3rem !important;
  }

  /* Physical inventory: never force the old 600px inline form on a phone. */
  body.app-shell .inventory-inline-form {
    min-width: 0 !important;
    width: 100%;
  }
  body.app-shell .physical-inventory-asset-actions .asset-support-ticket {
    width: 100%;
  }

  /* QR / agent administration. */
  body.app-shell .asset-qr-card {
    grid-template-columns: 1fr;
    gap: 1rem;
    padding: 1rem;
    text-align: center;
  }
  body.app-shell .asset-qr-card img {
    width: min(220px, 70vw);
    height: auto;
    margin-inline: auto;
  }
  body.app-shell .asset-qr-card h1 {
    font-size: clamp(1.35rem, 7vw, 2rem);
    overflow-wrap: anywhere;
  }
  body.app-shell .agent-endpoint-list > div {
    grid-template-columns: 1fr;
  }
  body.app-shell .agent-endpoint-list dt {
    justify-content: flex-start;
  }
}

@media (max-width: 390px) {
  body.app-shell .attendance-week-grid { grid-template-columns: 1fr; }
  body.app-shell .attendance-stats,
  body.app-shell .assets-kpi-grid,
  body.app-shell .intake-kpis { grid-template-columns: 1fr; }
  body.app-shell .biometric-previews { grid-template-columns: repeat(2, minmax(0,1fr)); }
  body.app-shell .attendance-camera-frame {
    max-height: min(78vw, calc(var(--nc-mobile-viewport-height) - 12rem));
  }
  body.app-shell .intake-device-icon { flex-basis: 38px; width: 38px; height: 38px; }
  body.app-shell .asset-compact-list { padding-inline: .75rem; }
}

/* --------------------------------------------------------------------------
   F68E — CRM, AI and Desk mobile normalization
   -------------------------------------------------------------------------- */
@media (max-width: 760px) {
  /* CRM: keep the commercial workspace usable at 360–430px without
     changing desktop information density or business behavior. */
  body.app-shell :is(.crm-enterprise-page,.crm-360-page,.crm-insights-page,.crm-copilot-page) {
    min-width: 0;
  }
  body.app-shell :is(.crm-runtime-banner,.crm-copilot-note,.crm-health-card,.crm-360-next) {
    align-items: flex-start;
    flex-direction: column;
  }
  body.app-shell :is(.crm-runtime-actions,.crm-filter-actions,.crm-ai-action) {
    width: 100%;
    align-items: stretch;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  body.app-shell :is(.crm-runtime-actions,.crm-filter-actions,.crm-ai-action) > :is(a,button,form) {
    min-width: 0;
  }
  body.app-shell :is(.crm-runtime-actions,.crm-filter-actions) .button,
  body.app-shell .crm-filter-actions form,
  body.app-shell .crm-filter-actions form .button {
    width: 100%;
  }
  body.app-shell :is(.crm-command-layout,.crm-toolbox-grid,.crm-360-hero,.crm-money-grid,.crm-insight-money,.crm-insight-stats,.crm-360-stats,.crm-detail-grid,.crm-filter-grid,.crm-document-filters) {
    grid-template-columns: 1fr;
  }
  body.app-shell .crm-summary-strip {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  body.app-shell .crm-quick-actions {
    grid-template-columns: 1fr;
  }
  body.app-shell .crm-focus-actions > a,
  body.app-shell .crm-quick-actions > a,
  body.app-shell .crm-toolbox-group > a {
    min-width: 0;
  }
  body.app-shell .crm-focus-actions > a > :is(div,strong),
  body.app-shell .crm-quick-actions > a > div,
  body.app-shell .crm-toolbox-group > a > div {
    min-width: 0;
  }
  body.app-shell :is(.crm-focus-actions,.crm-toolbox-grid,.crm-toolbox-group) :is(strong,small,em,p),
  body.app-shell :is(.crm-record-link,.crm-contact-stack,.crm-copilot-main,.crm-document-mini-list) :is(strong,span,small,p,a) {
    overflow-wrap: anywhere;
  }
  body.app-shell .crm-filter-grid > *,
  body.app-shell .crm-document-filters > * {
    min-width: 0;
    width: 100%;
  }
  body.app-shell .crm-filter-grid :is(input,select,textarea),
  body.app-shell .crm-document-filters :is(input,select,textarea) {
    width: 100%;
    min-width: 0;
  }
  body.app-shell .crm-copilot-card {
    grid-template-columns: 56px minmax(0,1fr);
    gap: .7rem;
    padding: .85rem;
  }
  body.app-shell .crm-score-ring {
    width: 54px;
    height: 54px;
  }
  body.app-shell .crm-copilot-title {
    flex-direction: column;
  }
  body.app-shell .crm-ai-action {
    flex-direction: column;
  }
  body.app-shell .crm-ai-action > * {
    max-width: 100%;
  }
  body.app-shell .crm-ai-action .button {
    width: 100%;
  }
  body.app-shell .crm-health-card {
    gap: .75rem;
  }
  body.app-shell .crm-health-ring {
    width: 72px;
    height: 72px;
    flex-basis: 72px;
  }
  body.app-shell .crm-360-timeline article {
    grid-template-columns: 30px minmax(0,1fr);
  }
  body.app-shell .crm-document-mini-list > a {
    grid-template-columns: 28px minmax(0,1fr);
  }
  body.app-shell .crm-document-mini-list > a > :last-child {
    grid-column: 2;
  }
  body.app-shell .crm-contact-stack > a {
    padding-right: .85rem;
  }
  body.app-shell .crm-contact-stack > a small {
    position: static;
    width: fit-content;
    margin-top: .45rem;
  }
  body.app-shell .crm-money-line,
  body.app-shell .crm-line-preview {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  body.app-shell .crm-table,
  body.app-shell .crm-import-table {
    min-width: 680px;
  }

  /* AI: prevent control consoles, result cards and provider dashboards from
     fighting the mobile keyboard or forcing a desktop-width canvas. */
  body.app-shell :is(.ai-status-banner,.ai-result-heading,.ai-composer-head,.ai-memory-hero,.ai-command-hero) {
    align-items: flex-start;
  }
  body.app-shell :is(.ai-analyze-layout,.ai-result-grid,.ai-ticket-layout,.ai-memory-layout,.ai-dashboard-main-grid,.ai-dashboard-main-grid.reverse,.ai-enterprise-grid,.ai-control-bottom-grid,.ai-switch-grid,.ai-provider-settings-grid) {
    grid-template-columns: 1fr;
  }
  body.app-shell :is(.ai-action-panel,.ai-review-panel) {
    position: static;
  }
  body.app-shell .ai-dashboard-kpis,
  body.app-shell .ai-queue-metrics {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  body.app-shell .ai-analysis-row {
    grid-template-columns: auto minmax(0,1fr) auto;
  }
  body.app-shell .ai-analysis-row time {
    display: none;
  }
  body.app-shell .ai-conversation-card {
    grid-template-columns: auto minmax(0,1fr);
  }
  body.app-shell .ai-conversation-card > b {
    grid-column: 2;
    justify-self: start;
  }
  body.app-shell .ai-provider-ranking article {
    grid-template-columns: auto minmax(0,1fr) auto;
  }
  body.app-shell .ai-provider-ranking article > :is(progress,.ai-rank-copy) {
    min-width: 0;
  }
  body.app-shell .ai-provider-ranking article > progress {
    grid-column: 2/-1;
    width: 100%;
  }
  body.app-shell :is(.ai-command-actions,.header-actions,.page-actions) {
    flex-wrap: wrap;
  }
  body.app-shell .ai-command-actions > :is(a,button,form),
  body.app-shell .ai-command-actions .button {
    min-width: 0;
  }
  body.app-shell :is(.ai-command-copy,.ai-result-section,.ai-proposed-text,.ai-memory-layout,.ai-agent-sources,.ai-safe-card) {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  body.app-shell .ai-bar-chart {
    max-width: 100%;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }
  body.app-shell .ai-route-settings-row {
    grid-template-columns: 1fr;
  }
  body.app-shell .ai-route-title,
  body.app-shell .ai-route-settings-row .field:first-of-type {
    grid-column: auto;
  }
  body.app-shell .ai-control-form .form-actions {
    align-items: stretch;
  }

  /* Desk/Support: ticket work, Messenger evidence and reports must remain
     operable with one hand while preserving the existing backend flow. */
  body.app-shell .desk-filter-form {
    align-items: stretch;
    flex-direction: column;
    width: 100%;
  }
  body.app-shell .desk-filter-form > *,
  body.app-shell .desk-filter-form select {
    width: 100%;
    min-width: 0;
  }
  body.app-shell :is(.desk-create-layout,.ticket-detail-grid,.report-builder-grid,.report-content-grid) {
    grid-template-columns: 1fr;
  }
  body.app-shell .desk-evidence-panel {
    position: static;
    max-height: none;
  }
  body.app-shell .ticket-message-selector {
    max-height: min(52vh, 440px);
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
  body.app-shell .ticket-message-option,
  body.app-shell .ticket-linked-message,
  body.app-shell .ticket-description,
  body.app-shell .sync-error-box {
    min-width: 0;
  }
  body.app-shell .ticket-message-top,
  body.app-shell .ticket-linked-author,
  body.app-shell .timeline-title {
    align-items: flex-start;
    flex-direction: column;
    gap: .2rem;
  }
  body.app-shell .ticket-linked-files a {
    max-width: 100%;
    overflow-wrap: anywhere;
  }
  body.app-shell .ticket-info-panel dl > div {
    align-items: flex-start;
    flex-direction: column;
    gap: .25rem;
  }
  body.app-shell .ticket-info-panel dd {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
  body.app-shell .report-card-grid,
  body.app-shell .report-breakdown-grid,
  body.app-shell .report-footer-metrics {
    grid-template-columns: 1fr;
  }
  body.app-shell .report-metric-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  body.app-shell .report-progress-banner {
    align-items: flex-start;
  }
  body.app-shell .report-card dl div,
  body.app-shell .report-breakdown-list > div,
  body.app-shell .report-footer-metrics > div {
    align-items: flex-start;
  }
  body.app-shell .report-card dd,
  body.app-shell .report-breakdown-list strong,
  body.app-shell .report-footer-metrics strong {
    overflow-wrap: anywhere;
  }
}

@media (max-width: 390px) {
  body.app-shell .crm-summary-strip,
  body.app-shell .ai-dashboard-kpis,
  body.app-shell .ai-queue-metrics,
  body.app-shell .report-metric-grid {
    grid-template-columns: 1fr;
  }
  body.app-shell .crm-copilot-card {
    grid-template-columns: 1fr;
  }
  body.app-shell .crm-score-ring {
    justify-self: start;
  }
  body.app-shell .ai-status-pill {
    margin-left: 0;
  }
  body.app-shell .ai-provider-ranking article {
    grid-template-columns: auto minmax(0,1fr);
  }
  body.app-shell .ai-provider-ranking article > b {
    grid-column: 2;
    justify-self: start;
  }
  body.app-shell .report-card-grid,
  body.app-shell .report-breakdown-grid,
  body.app-shell .report-footer-metrics {
    padding-inline: .7rem;
  }
}

/* ================================================================
   F68F — Messenger and Meet mobile/touch normalization
   ================================================================ */
@media (max-width: 900px) {
  body.module-connect .main-content,
  body.module-meet .main-content {
    min-width: 0;
    overflow-x: clip;
  }

  /* Messenger: one usable viewport, no horizontal leakage. */
  body.module-connect .connect-shell {
    width: 100%;
    max-width: 100%;
    height: calc(var(--nc-mobile-viewport-height, 100dvh) - var(--topbar-height) - var(--mobile-nav-height, 64px) - .75rem);
    max-height: calc(var(--nc-mobile-viewport-height, 100dvh) - var(--topbar-height) - var(--mobile-nav-height, 64px) - .75rem);
    min-height: 0;
    border-radius: 14px;
    overflow: hidden;
  }

  body.module-connect .conversation-panel-header {
    gap: .55rem;
    padding: .75rem;
    align-items: center;
  }
  body.module-connect .conversation-panel-header > div:first-child { min-width: 0; }
  body.module-connect .conversation-panel-header h1 {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  body.module-connect .connect-create-actions {
    flex: 0 0 auto;
    display: flex;
    gap: .2rem;
  }
  body.module-connect .connect-create-actions .icon-button {
    width: 40px;
    min-width: 40px;
    height: 40px;
  }
  body.module-connect .conversation-search {
    margin-inline: .65rem;
    min-width: 0;
  }
  body.module-connect .conversation-search input { min-width: 0; width: 100%; font-size: 16px; }
  body.module-connect .conversation-list {
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
  }
  body.module-connect .conversation-item { min-width: 0; padding-inline: .7rem; }
  body.module-connect .conversation-copy,
  body.module-connect .conversation-line,
  body.module-connect .conversation-line.preview > span { min-width: 0; }

  body.module-connect .chat-panel {
    width: 100%;
    max-width: 100%;
    min-height: 0;
    overflow: hidden;
  }
  body.module-connect .chat-header {
    display: grid;
    grid-template-columns: auto auto minmax(0,1fr) auto;
    gap: .45rem;
    padding: .55rem .6rem;
    align-items: center;
  }
  body.module-connect .chat-header .chat-back { display: grid; }
  body.module-connect .chat-header .conversation-avatar.large {
    width: 38px;
    height: 38px;
    min-width: 38px;
  }
  body.module-connect .chat-person { min-width: 0; }
  body.module-connect .chat-person h2 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  body.module-connect .chat-person :is(p,.group-summary) {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  body.module-connect .chat-header-actions {
    max-width: min(46vw, 210px);
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    justify-content: flex-start;
    padding: 2px;
  }
  body.module-connect .chat-header-actions::-webkit-scrollbar { display: none; }
  body.module-connect .chat-header-actions .icon-button {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
  }
  body.module-connect .connect-drive-action {
    padding: .35rem .55rem;
    overflow-x: auto;
    white-space: nowrap;
    overscroll-behavior-inline: contain;
  }
  body.module-connect .connect-drive-action .button { min-height: 40px; }

  body.module-connect .message-list {
    min-width: 0;
    padding-inline: .6rem;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
    scroll-padding-bottom: 5.5rem;
  }
  body.module-connect .message-bubble,
  body.module-connect .message-card,
  body.module-connect [data-message-id] {
    max-width: min(88%, 640px);
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  body.module-connect .reply-composer,
  body.module-connect .attachment-composer-preview,
  body.module-connect .messenger-media-status {
    min-width: 0;
    max-width: 100%;
  }
  body.module-connect .reply-composer p,
  body.module-connect .attachment-composer-preview {
    overflow-wrap: anywhere;
  }

  body.module-connect .message-composer {
    position: relative;
    z-index: 8;
    display: grid;
    grid-template-columns: 44px 44px minmax(0,1fr) 44px;
    align-items: end;
    gap: .3rem;
    width: 100%;
    padding: .45rem .5rem calc(.45rem + env(safe-area-inset-bottom));
  }
  body.module-connect .message-composer .composer-action,
  body.module-connect .message-composer .voice-note-button,
  body.module-connect .message-composer .send-button {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    margin: 0;
  }
  body.module-connect .message-composer textarea {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    max-height: min(30vh, 150px);
    font-size: 16px;
  }
  html[data-mobile-keyboard-open] body.module-connect .connect-shell {
    height: calc(var(--nc-mobile-viewport-height, 100dvh) - .35rem);
    max-height: calc(var(--nc-mobile-viewport-height, 100dvh) - .35rem);
  }
  html[data-mobile-keyboard-open] body.module-connect .message-composer {
    padding-bottom: .35rem;
  }
  html[data-mobile-keyboard-open] body.module-connect .mobile-bottom-nav { visibility: hidden; pointer-events: none; }

  body.module-connect .messenger-media-viewer-shell,
  body.module-connect .messenger-ai-dialog {
    width: min(100% - 1rem, 760px);
    max-height: calc(var(--nc-mobile-viewport-height, 100dvh) - 1rem);
    margin: auto;
  }
  body.module-connect .messenger-media-viewer-stage,
  body.module-connect .messenger-ai-thread {
    min-height: 0;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
  body.module-connect .messenger-ai-toolbar,
  body.module-connect .messenger-ai-modes,
  body.module-connect .messenger-ai-suggestions {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  /* Meet directory and meeting creation. */
  body.module-meet .meet-grid,
  body.module-meet .meeting-create-layout { grid-template-columns: 1fr; }
  body.module-meet .meeting-config-card { position: static; }
  body.module-meet .meeting-room-row {
    grid-template-columns: auto minmax(0,1fr);
    gap: .55rem;
  }
  body.module-meet .meeting-room-row > time { display: none; }
  body.module-meet .meeting-room-state {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: .4rem;
  }
  body.module-meet .meeting-room-state > * { width: 100%; min-height: 42px; }
  body.module-meet .meet-user-row,
  body.module-meet .call-history-row { min-width: 0; padding-inline: .65rem; }
  body.module-meet .meet-user-copy,
  body.module-meet .call-history-copy { min-width: 0; }
  body.module-meet .meet-user-actions {
    flex: 0 0 auto;
    display: flex;
    gap: .2rem;
  }
  body.module-meet .meet-user-actions .icon-button { width: 42px; height: 42px; }
  body.module-meet .meeting-user-grid,
  body.module-meet .meeting-user-grid-modern { grid-template-columns: 1fr; }
  body.module-meet .meeting-selection-footer {
    flex-direction: column;
    align-items: flex-start;
    gap: .25rem;
  }

  /* Individual calls: controls stay reachable above bottom navigation/safe area. */
  body.module-meet .call-room,
  body.module-meet .call-stage {
    min-height: calc(var(--nc-mobile-viewport-height, 100dvh) - var(--topbar-height) - var(--mobile-nav-height, 64px) - .5rem);
    max-height: calc(var(--nc-mobile-viewport-height, 100dvh) - var(--topbar-height) - var(--mobile-nav-height, 64px) - .5rem);
  }
  body.module-meet .call-stage { border-radius: 14px; }
  body.module-meet .call-controls {
    width: calc(100% - .7rem);
    max-width: 560px;
    bottom: max(.35rem, env(safe-area-inset-bottom));
    justify-content: flex-start;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  body.module-meet .call-controls::-webkit-scrollbar,
  body.module-meet .meeting-controls::-webkit-scrollbar { display: none; }
  body.module-meet .call-control {
    flex: 0 0 58px;
    min-width: 58px;
    min-height: 54px;
  }
  body.module-meet .call-network-state {
    max-width: calc(100% - 1.2rem);
    right: .6rem;
    overflow-wrap: anywhere;
  }
  body.module-meet .local-video-wrap,
  body.module-meet .local-screen-preview-wrap { max-width: 34vw; }

  /* Group meetings: video remains primary, side panel becomes an accessible sheet. */
  body.module-meet .meeting-room,
  body.module-meet .meeting-stage {
    min-height: calc(var(--nc-mobile-viewport-height, 100dvh) - var(--topbar-height) - var(--mobile-nav-height, 64px) - .5rem);
    max-height: calc(var(--nc-mobile-viewport-height, 100dvh) - var(--topbar-height) - var(--mobile-nav-height, 64px) - .5rem);
  }
  body.module-meet .meeting-stage { border-radius: 14px; }
  body.module-meet .meeting-stage-header {
    gap: .5rem;
    align-items: center;
  }
  body.module-meet .meeting-stage-header > div:first-child { min-width: 0; }
  body.module-meet .meeting-stage-header h1,
  body.module-meet .meeting-stage-header p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  body.module-meet .meeting-stage-meta { flex: 0 0 auto; }
  body.module-meet .meeting-video-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: minmax(160px, 42vh);
    padding: .25rem .45rem 5.4rem;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
  }
  body.module-meet .meeting-video-tile { min-width: 0; min-height: 160px; }
  body.module-meet .meeting-video-tile video { max-width: 100%; }
  body.module-meet .meeting-controls {
    width: calc(100% - .7rem);
    max-width: 620px;
    bottom: max(.35rem, env(safe-area-inset-bottom));
    justify-content: flex-start;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  body.module-meet .meeting-side-panel {
    position: fixed;
    z-index: 1300;
    inset: auto 0 0 0;
    width: 100%;
    height: min(68vh, calc(var(--nc-mobile-viewport-height, 100dvh) - .5rem));
    max-height: calc(var(--nc-mobile-viewport-height, 100dvh) - .5rem);
    padding-bottom: env(safe-area-inset-bottom);
    border-radius: 20px 20px 0 0;
    overscroll-behavior: contain;
  }
  html[data-mobile-keyboard-open] body.module-meet .meeting-side-panel {
    height: calc(var(--nc-mobile-viewport-height, 100dvh) - .25rem);
    max-height: calc(var(--nc-mobile-viewport-height, 100dvh) - .25rem);
  }
  body.module-meet .meeting-side-panel > section { min-height: 0; }
  body.module-meet .meeting-participant-list,
  body.module-meet .meeting-chat-list {
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
  }
  body.module-meet .meeting-chat-form input { min-width: 0; font-size: 16px; }
  body.module-meet .meeting-participant-actions { flex: 0 0 auto; }
  body.module-meet .meeting-invite-dialog {
    width: calc(100% - .6rem);
    max-height: calc(var(--nc-mobile-viewport-height, 100dvh) - .6rem);
  }
  body.module-meet .meeting-invite-dialog .form-card {
    max-height: calc(var(--nc-mobile-viewport-height, 100dvh) - .6rem);
    overscroll-behavior: contain;
  }
}

@media (max-width: 520px) {
  body.module-connect .chat-header {
    grid-template-columns: auto minmax(0,1fr) auto;
  }
  body.module-connect .chat-header .conversation-avatar.large { display: none; }
  body.module-connect .chat-header-actions { max-width: 132px; }
  body.module-connect .group-summary span:nth-of-type(n+2) { display: none; }
  body.module-connect .message-composer {
    grid-template-columns: 42px 42px minmax(0,1fr) 42px;
    padding-inline: .35rem;
  }
  body.module-connect .message-composer .composer-action,
  body.module-connect .message-composer .voice-note-button,
  body.module-connect .message-composer .send-button {
    width: 42px;
    min-width: 42px;
  }

  body.module-meet .meeting-feature-strip { grid-template-columns: 1fr; }
  body.module-meet .meeting-room-state { grid-template-columns: 1fr; }
  body.module-meet .call-control { flex-basis: 54px; min-width: 54px; }
  body.module-meet .call-control small { font-size: .5rem; }
  body.module-meet .meeting-stage-meta { display: none; }
  body.module-meet .local-video-wrap,
  body.module-meet .local-screen-preview-wrap { max-width: 40vw; }
}

/* F68G — Portal, Auth, Admin and SaaS mobile normalization */
@media (max-width: 900px) {
  /* Authentication and account security surfaces must remain usable with the mobile keyboard open. */
  body.auth-shell {
    min-width: 0;
    min-height: var(--nc-mobile-viewport-height, 100dvh);
    overflow-x: hidden;
  }
  body.auth-shell .login-layout,
  body.auth-shell .enterprise-login,
  body.auth-shell .login-form-panel,
  body.auth-shell .auth-simple {
    min-height: var(--nc-mobile-viewport-height, 100dvh);
  }
  body.auth-shell .login-form-panel {
    width: 100%;
    padding-bottom: max(1.4rem, env(safe-area-inset-bottom));
  }
  body.auth-shell .login-card,
  body.auth-shell .auth-narrow,
  body.auth-shell .access-verify-layout,
  body.auth-shell .profile-layout,
  body.auth-shell .security-center-grid,
  body.auth-shell .pwa-settings,
  body.auth-shell .recovery-grid {
    min-width: 0;
    max-width: 100%;
  }
  body.auth-shell :is(input,select,textarea) { font-size: 16px; }
  body.auth-shell .mfa-qr {
    width: min(220px, calc(100vw - 3rem));
    height: auto;
    aspect-ratio: 1;
  }
  body.auth-shell .form-actions,
  body.auth-shell .pwa-actions {
    flex-wrap: wrap;
    gap: .6rem;
  }
  body.auth-shell .form-actions > *,
  body.auth-shell .pwa-actions > * { max-width: 100%; }

  /* Internal employee portal / intranet. */
  body.module-portal .portal-subnav {
    scroll-snap-type: x proximity;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }
  body.module-portal .portal-subnav > a { scroll-snap-align: start; }
  body.module-portal :is(.portal-grid,.portal-admin-grid,.portal-directory-grid,.portal-link-grid) {
    min-width: 0;
  }
  body.module-portal :is(.portal-feed-item,.portal-doc-row,.portal-memo,.portal-balance,.portal-person-card) {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  body.module-portal .portal-row-actions {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  /* Administration: keep diagnostics, controls and long identifiers inside the viewport. */
  body.module-admin :is(.admin-menu-grid,.role-grid,.diagnostic-grid,.content-grid,.stat-grid) { min-width: 0; }
  body.module-admin :is(.admin-menu-card,.diagnostic-check,.release-action-panel,.quick-panel,.form-panel) {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  body.module-admin :is(.inline-form,.page-actions,.form-actions) {
    flex-wrap: wrap;
    max-width: 100%;
  }
  body.module-admin :is(code,.truncate-cell,.table-subtitle) { overflow-wrap: anywhere; }
  body.module-admin .action-menu { max-width: calc(100vw - 1.5rem); }

  /* SaaS / multi-company settings stay one-column and touch friendly. */
  body.module-saas :is(.saas-grid,.saas-grid.two,.metric-grid,.form-grid,.content-grid) {
    grid-template-columns: minmax(0,1fr);
    min-width: 0;
  }
  body.module-saas :is(.module-link,.brand-preview,.portal-hero,.panel,.metric-card) {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  body.module-saas .tenant-logo-preview,
  body.module-saas .tenant-brand-logo {
    max-width: min(220px, 100%);
    height: auto;
  }
  body.module-saas .recovery-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body.module-saas .recovery-grid code { overflow-wrap: anywhere; }
  body.module-saas :is(input,select,textarea) { font-size: 16px; }
}

@media (max-width: 640px) {
  body.auth-shell .login-form-panel { padding: .9rem; }
  body.auth-shell .login-card { padding: 1rem; border-radius: 18px; }
  body.auth-shell .login-card-head h2 { font-size: clamp(1.35rem,7vw,1.65rem); }
  body.auth-shell .remember-row { gap: .75rem; }
  body.auth-shell .remember-row > * { max-width: 100%; }
  body.auth-shell .form-actions > .button,
  body.auth-shell .pwa-actions > .button { width: 100%; justify-content: center; }
  body.auth-shell .recovery-grid { grid-template-columns: minmax(0,1fr); }

  body.module-portal :is(.portal-grid,.portal-admin-grid,.portal-directory-grid,.portal-link-grid) {
    grid-template-columns: minmax(0,1fr);
  }
  body.module-portal :is(.portal-feed-item,.portal-doc-row,.portal-memo,.portal-balance) {
    flex-direction: column;
    align-items: stretch;
  }
  body.module-portal .portal-row-actions { width: 100%; }
  body.module-portal .portal-row-actions :is(a,button,.button) { min-height: 44px; }
  body.module-portal .portal-person-card { align-items: flex-start; }

  body.module-admin :is(.admin-menu-grid,.role-grid,.diagnostic-grid,.content-grid,.stat-grid) {
    grid-template-columns: minmax(0,1fr);
  }
  body.module-admin .admin-menu-card { grid-template-columns: 42px minmax(0,1fr); }
  body.module-admin .admin-menu-card > :last-child:not(:nth-child(2)) { grid-column: 1 / -1; }
  body.module-admin :is(.inline-form,.page-actions,.form-actions) > :is(.button,button,input,select) {
    max-width: 100%;
  }

  body.module-saas .recovery-grid { grid-template-columns: minmax(0,1fr); }
  body.module-saas .portal-hero { padding: 1rem; border-radius: 16px; }
  body.module-saas .form-actions > .button { width: 100%; justify-content: center; }
}


/* F69G — CRM 2.0 dashboard, permissions and API mobile regression */
@media (max-width: 760px) {
  body.app-shell .crm-commercial-dashboard,
  body.app-shell .crm-dashboard-filter-panel,
  body.app-shell .crm-dashboard-panel,
  body.app-shell .crm-dashboard-api-note { min-width: 0; }
  body.app-shell .crm-dashboard-filter {
    grid-template-columns: minmax(0,1fr);
    align-items: stretch;
  }
  body.app-shell .crm-dashboard-filter > * { min-width: 0; width: 100%; }
  body.app-shell .crm-dashboard-filter :is(input,select) { width: 100%; min-width: 0; font-size: 16px; }
  body.app-shell .crm-commercial-kpis,
  body.app-shell .crm-dashboard-grid,
  body.app-shell .crm-dashboard-metrics,
  body.app-shell .crm-qualification-dashboard { grid-template-columns: minmax(0,1fr); }
  body.app-shell .crm-risk-summary,
  body.app-shell .crm-grade-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body.app-shell .crm-dashboard-panel .panel-heading,
  body.app-shell .crm-qualification-dashboard header {
    align-items: flex-start;
    flex-direction: column;
  }
  body.app-shell :is(.crm-dashboard-metrics,.crm-risk-summary,.crm-grade-grid) > * { min-width: 0; overflow-wrap: anywhere; }
  body.app-shell .crm-dashboard-api-note code { overflow-wrap: anywhere; word-break: break-word; }
  body.app-shell .crm-duplicate-pair { grid-template-columns: minmax(0,1fr); }
  body.app-shell .crm-merge-form { grid-template-columns: minmax(0,1fr); }
  body.app-shell .crm-merge-form .button { width: 100%; min-height: 44px; }
  body.app-shell .crm-targets-panel .table-actions { min-width: max-content; }
}

@media (max-width: 430px) {
  body.app-shell .crm-risk-summary,
  body.app-shell .crm-grade-grid { grid-template-columns: minmax(0,1fr); }
}

/* F70 · Talento y Desempeño */
.talent-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:18px}.talent-list{display:grid;gap:8px}.talent-list-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--border,#e5e7eb);border-radius:12px;text-decoration:none;color:inherit}.talent-list-item div{display:grid;gap:3px;min-width:0}.talent-list-item span{font-size:.86rem;color:var(--text-muted,#667085)}.talent-score{display:grid;place-items:center;min-width:110px;padding:14px;border:1px solid var(--border,#e5e7eb);border-radius:14px}.talent-score strong{font-size:2rem}.talent-score small{color:var(--text-muted,#667085)}.talent-inline-form{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.talent-inline-form input,.talent-inline-form select{min-height:44px;max-width:120px}.talent-shortcuts{margin-top:16px}.talent-detail-row td{white-space:normal!important;color:var(--text-muted,#667085)}
@media (max-width:900px){.talent-grid{grid-template-columns:1fr}.talent-inline-form{min-width:280px}.talent-shell .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}}
@media (max-width:430px){.talent-shell .page-header{align-items:stretch}.talent-shell .page-actions{width:100%;display:grid;grid-template-columns:1fr}.talent-shell .button{min-height:44px}.talent-kpis{grid-template-columns:1fr 1fr}.talent-list-item{align-items:flex-start}.talent-inline-form{display:grid;grid-template-columns:1fr 1fr;min-width:300px}.talent-inline-form .button{grid-column:1/-1}.talent-shortcuts{display:grid;grid-template-columns:1fr 1fr}}

/* F71 · SaaS / Multiempresa 2.0 · 360–430px */
@media (max-width:430px){
  .saas71-page .saas-admin-grid,.saas71-page .saas-entitlement-grid{grid-template-columns:1fr}
  .saas71-page .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .saas71-page .saas-audit-row{flex-direction:column}
  .saas71-page .saas-inline-actions,.saas71-page .saas-inline-actions form{width:100%}
  .saas71-page .saas-inline-actions .button{width:100%;min-height:44px}
  .saas71-page .saas-invite-url{max-width:100%}
  .saas71-page .form-actions .button,.saas71-page header .button{min-height:44px}
}

/* F72 · NovaCore Cloud / acceso empresarial */
.cloud-access-shell{display:grid;place-items:center;min-height:65vh;padding:24px}.cloud-access-card,.cloud-domain-card{width:min(100%,620px);padding:24px;border:1px solid var(--border-color,#dbe3ee);border-radius:18px;background:var(--surface,#fff)}.cloud-access-card form{display:grid;gap:12px;margin:20px 0}.cloud-domain-card code{display:block;overflow-wrap:anywhere;margin:10px 0}.inline-form{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap}.cloud-tenant-panel code{overflow-wrap:anywhere}@media (max-width:430px){.cloud-access-shell{padding:12px}.cloud-access-card,.cloud-domain-card{padding:16px;border-radius:14px}.cloud-access-card .btn,.cloud-tenant-panel .btn{min-height:44px}.cloud-tenant-panel .table-responsive{overflow-x:auto}.inline-form{display:flex;margin:4px 0}}


/* F73 · Comunicaciones Enterprise */
@media (max-width:430px) {
  body.module-meet .page-hero .hero-actions { width:100%; align-items:stretch; }
  body.module-meet .meet-security-note { min-height:44px; }
  body.module-meet .call-action-button:disabled { opacity:.5; cursor:not-allowed; }
  body.module-meet .meeting-stage-meta { max-width:100%; }
}
