/*
 * Shared responsive-width contract.
 *
 * Individual surfaces must make their own flex and grid tracks shrinkable. This
 * stylesheet keeps the common shell, overlays, long machine-readable strings,
 * and bottom navigation within the visual viewport as a final safety boundary.
 */
html,
body { max-width: 100%; }

body { overflow-x: clip; }

:where(
  .app-shell,
  .app-header,
  .app-main,
  .workspace-view,
  .workstream,
  .work-thread,
  .task-turn,
  .task-response,
  .composer,
  .product-dashboard,
  .awh-command-form,
  .awh-command-actions,
  .awh-files-search > div,
  .awh-tool-dialog-card,
  .awh-owner-command-card,
  .awh-automation-panel,
  .infra-header,
  .infra-main,
  .studio-shell,
  .studio-header,
  .trust-header,
  .trust-main
) { min-width: 0; max-width: 100%; }

:where(.awh-command-actions > *, .awh-files-search > div > *, .awh-tool-dialog-head > *, .awh-owner-command-item > *, .awh-automation-head > *, .awh-automation-item > *) { min-width: 0; }

:where(.awh-owner-command-item) { grid-template-columns: 42px minmax(0, 1fr) auto; }

:where(.awh-mobile-nav) { max-width: calc(100% - 16px); }

:where(.pending-attachments li, .message-attachments a, .message-attachments span, .awh-file-copy, .awh-task-artifact-row span, .awh-owner-command-copy small, .awh-automation-item p, .entity-copy small, .activity-note) {
  overflow-wrap: anywhere;
  word-break: break-word;
}

:where(pre) {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

:where(code) {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Dashboard grid/section items must be shrinkable too. Grid children default to
 * min-width:auto, so production task/artifact text can otherwise expand a 1fr
 * mobile track far beyond the visual viewport even when the shell is bounded. */
:where(
  .awh-home-overview,
  .awh-tool-grid,
  .awh-owner-grid,
  .awh-artifact-grid,
  .awh-pulse-grid,
  .awh-task-layout,
  .awh-task-detail-facts
) > * { min-width: 0; max-width: 100%; }

:where(
  .awh-home-section,
  .awh-recent-panel,
  .awh-side-panel,
  .awh-owner-center,
  .awh-section-heading,
  .awh-heading-actions,
  .awh-recent-list,
  .awh-status-list,
  .awh-recent-item,
  .awh-status-item,
  .awh-artifact-card,
  .awh-pulse-card
) { min-width: 0; max-width: 100%; }

:where(.awh-heading-actions) { display: flex; flex-wrap: wrap; }
:where(.awh-recent-item > span, .awh-status-item > span:last-child, .awh-artifact-card > span:last-child, .awh-pulse-card > span:last-child) { min-width: 0; max-width: 100%; flex: 1 1 auto; }
:where(.awh-status-item strong, .awh-status-item small, .awh-recent-item strong, .awh-recent-item small, .awh-tool-copy strong, .awh-tool-copy small, .awh-artifact-card strong, .awh-artifact-card small, .awh-owner-command-copy strong, .awh-owner-command-copy small, .awh-pulse-card strong, .awh-pulse-card small, .awh-pulse-card em) { overflow-wrap: anywhere; word-break: break-word; }

/* One visual-viewport authority for every floating owner surface. */
:where(.awh-tool-dialog, .awh-search-dialog, .awh-automation-sheet) {
  top: var(--awh-visual-viewport-top, 0px) !important;
  right: 0 !important;
  bottom: auto !important;
  left: 0 !important;
  height: var(--awh-visual-viewport-height, 100dvh) !important;
  max-height: var(--awh-visual-viewport-height, 100dvh) !important;
}

:where(.awh-tool-dialog-card, .awh-search-card, .awh-automation-panel) {
  max-height: calc(var(--awh-visual-viewport-height, 100dvh) - 8px) !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

/* iOS Safari zooms focused controls below 16px. Touch actions also share the
 * 44px minimum from the KRUART experience contract. */
@media (max-width: 760px) {
  :where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
    textarea,
    select
  ) { font-size: 16px !important; }

  :where(button, [role="button"], input[type="button"], input[type="submit"], input[type="reset"], select, summary) {
    min-height: 44px;
    touch-action: manipulation;
  }
}