/* CPRI Module 015 — responsive rules. 320px min → 1440px+. No global horizontal overflow. */
html, body { max-width: 100%; overflow-x: hidden; }

/* Tablet landscape and below: sidebar becomes an off-canvas drawer. */
@media (max-width: 1024px) {
  .cpri-shell { grid-template-columns: 1fr; }
  .cpri-sidebar {
    position: fixed; top: 0; left: 0; width: var(--sidebar-width); height: 100vh;
    transform: translateX(-100%); transition: transform var(--transition); z-index: var(--z-drawer);
  }
  .cpri-shell.is-drawer-open .cpri-sidebar { transform: translateX(0); box-shadow: var(--shadow-lg); }
  .cpri-menu-btn { display: inline-flex; }
  .cpri-topbar { padding: 0 var(--sp-4); }
  .cpri-content { padding: var(--sp-5) var(--sp-4); }
}

@media (max-width: 768px) {
  .cpri-grid--stats { grid-template-columns: repeat(2, 1fr); }
  .cpri-page-header { flex-direction: column; }
  .cpri-page-actions { width: 100%; }
  .cpri-meta { grid-template-columns: 1fr; gap: var(--sp-1); }
  .cpri-meta dt { margin-top: var(--sp-2); }
  .cpri-auth__card { padding: var(--sp-6); }
}

@media (max-width: 480px) {
  .cpri-grid--stats { grid-template-columns: 1fr; }
  .cpri-content { padding: var(--sp-4) var(--sp-3); }
  .cpri-form-actions { flex-direction: column; align-items: stretch; }
  .cpri-form-actions .cpri-danger-zone { margin-left: 0; }
  .cpri-btn, .btn { width: 100%; }
  .cpri-table-toolbar { flex-direction: column; align-items: stretch; }
}