/* PostWatch Workspaces v4 — Command Calm compatibility layer.
   Load after postwatch-unified-v4.css. Every rule is route-scoped so modern
   collection, conversation, report, and Today workspaces remain untouched. */

/* ---------- Shared workspace contract ---------- */
html[data-pw-workspace] #app-root.pw4-workspace-root {
  min-width: 0;
  /* The shell already reserves the rail/sidebar with margin-inline-start.
     A viewport-wide root here made every workspace wider than its canvas. */
  width: auto;
  max-width: none;
  color: var(--pw-text, var(--text));
  overflow-x: clip;
}

html[data-pw-workspace] #app-root.pw4-workspace-root > :first-child {
  min-width: 0;
}

html[data-pw-workspace] #app-root :where(.page, .admin-os, .policy-studio, .manning-workspace, .pwauth-account-page) {
  width: min(100%, var(--pw-canvas-max, 1440px));
  min-width: 0;
  margin-inline: auto;
}

html[data-pw-workspace] #app-root :where(.page-header, .admin-os__intro, .admin-os-section-head, .pwauth-account-head) h1 {
  margin: 0;
  color: var(--pw-text, var(--text));
  font-size: clamp(28px, 2vw, 38px);
  font-weight: 750;
  line-height: 1.15;
  letter-spacing: -.035em;
  text-wrap: balance;
}

html[data-pw-workspace] #app-root :where(.page-header, .admin-os__intro, .admin-os-section-head, .pwauth-account-head) p {
  max-width: 72ch;
  margin: 8px 0 0;
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 17px !important;
  line-height: 1.55;
  text-wrap: pretty;
}

html[data-pw-workspace] #app-root :where(button, .btn, input, select, textarea, summary) {
  font-family: inherit;
  touch-action: manipulation;
}

html[data-pw-workspace] #app-root :where(button, .btn, input:not([type="checkbox"]):not([type="radio"]), select) {
  min-height: 48px;
}

html[data-pw-workspace] #app-root :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  min-width: 0;
  border-color: var(--pw-border, var(--border));
  border-radius: var(--pw-radius-control, 12px);
  background: var(--pw-surface, var(--surface));
  color: var(--pw-text, var(--text));
  font-size: 16px;
}

html[data-pw-workspace] #app-root select,
html[data-pw-workspace] #app-root select option {
  background-color: var(--pw-surface, var(--surface));
  color: var(--pw-text, var(--text));
}

html[data-pw-workspace] #app-root :where(button, .btn, a, summary) {
  cursor: pointer;
}

html[data-pw-workspace] #app-root :where(button, .btn):disabled,
html[data-pw-workspace] #app-root [aria-disabled="true"] {
  cursor: not-allowed;
  opacity: .5;
}

html[data-pw-workspace] #app-root :where(button, .btn, a, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--pw-focus, var(--focus-ring));
  outline-offset: 3px;
  box-shadow: 0 0 0 5px var(--pw-focus-halo, color-mix(in srgb, var(--pw-focus, var(--focus-ring)) 24%, transparent));
}

html[data-pw-workspace] #app-root :where(.card, .admin-os-card, .admin-os-stat, .policy-panel, .manning-master, .manning-detail-wrap, .collection-toolbar, .audit-list, .login-event-list, .pwauth-admin-filter, .pwauth-identity-card) {
  border-color: var(--pw-border, var(--border));
  background: var(--pw-surface, var(--surface));
  color: var(--pw-text, var(--text));
  box-shadow: var(--pw-shadow-1, var(--shadow-1));
}

html[data-pw-workspace] #app-root :where(.form-field, .policy-field, .pwauth-admin-filter, .pwauth-admin-form) label,
html[data-pw-workspace] #app-root :where(.form-field, .policy-field, .pwauth-admin-form) legend,
html[data-pw-workspace] #app-root .pw4-workspace-label {
  color: var(--pw-text, var(--text));
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0;
  text-transform: none;
}

html[data-pw-workspace] #app-root .pw4-workspace-label {
  display: block;
  width: 100%;
  margin: 0 0 6px;
}

html[data-pw-workspace] #app-root :where(.form-field small, .policy-field small, .admin-record small, .manning-area small, .collection-summary, .admin-collection__count, .form-status, .pwauth-admin-form__help) {
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 14px;
  line-height: 1.45;
}

html[data-pw-workspace] #app-root :where(.table-wrap, .dtr-entry-grid) {
  max-width: 100%;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

html[data-pw-workspace] #app-root table {
  max-width: 100%;
  color: var(--pw-text, var(--text));
  font-variant-numeric: tabular-nums;
}

html[data-pw-workspace] #app-root table th {
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 14px;
  font-weight: 750;
}

html[data-pw-workspace] #app-root table td {
  color: var(--pw-text, var(--text));
  font-size: 16px;
}

html[data-pw-workspace] #app-root .pw4-workspace-state {
  min-height: 180px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 8px;
  padding: 32px;
  border: 1px dashed var(--pw-border-strong, var(--border-strong));
  border-radius: var(--pw-radius-card, 16px);
  background: var(--pw-surface, var(--surface));
  text-align: center;
}

html[data-pw-workspace] #app-root .pw4-workspace-state > :where(h2, h3, p) {
  margin: 0;
}

html[data-pw-workspace] #app-root .pw4-workspace-state > p {
  max-width: 52ch;
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 16px;
}

html[data-pw-workspace] #app-root .pw4-workspace-state[data-pw-state="loading"]::before {
  width: 30px;
  height: 30px;
  border: 3px solid var(--pw-border, var(--border));
  border-top-color: var(--pw-primary, var(--primary));
  border-radius: 50%;
  content: "";
  animation: pw4-workspace-spin .75s linear infinite;
}

@keyframes pw4-workspace-spin { to { transform: rotate(360deg); } }

/* ---------- HR sourcing ---------- */
html[data-pw-workspace="hr"] #app-root > :first-child {
  width: min(100%, var(--pw-canvas-max, 1440px));
  margin-inline: auto;
}

html[data-pw-workspace="hr"] #app-root .page-header {
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 20px;
}

html[data-pw-workspace="hr"] #app-root .hr-page-actions {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, auto));
  justify-content: end;
  gap: 8px !important;
  min-width: min(100%, 560px);
}

html[data-pw-workspace="hr"] #app-root .hr-view-toggle {
  grid-column: 1 / -1;
  justify-self: end;
  min-height: 48px;
  border-color: var(--pw-border-strong, var(--border-strong));
  border-radius: var(--pw-radius-control, 12px);
  background: var(--pw-surface, var(--surface));
}

html[data-pw-workspace="hr"] #app-root .hr-view-toggle button {
  min-height: 46px;
  padding-inline: 16px;
  border: 0;
  background: transparent;
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 16px;
  font-weight: 700;
}

html[data-pw-workspace="hr"] #app-root .hr-view-toggle button.is-active {
  background: var(--pw-primary, var(--primary));
  color: var(--pw-on-primary, var(--primary-ink));
}

html[data-pw-workspace="hr"] #app-root .hr-summary {
  min-height: 78px;
  padding: 18px 20px;
  border: 1px solid var(--pw-border, var(--border));
  border-left: 4px solid var(--pw-gold-600, #a87920);
  border-radius: var(--pw-radius-card, 16px);
  background: var(--pw-surface, var(--surface));
  box-shadow: var(--pw-shadow-1, var(--shadow-1));
}

html[data-pw-workspace="hr"] #app-root .hr-summary__line {
  font-size: clamp(18px, 1.3vw, 22px);
  line-height: 1.45;
}

html[data-pw-workspace="hr"] #app-root .filter-toggle-btn {
  min-height: 48px;
  padding: 10px 14px;
  border-color: var(--pw-border-strong, var(--border-strong));
  border-radius: var(--pw-radius-control, 12px);
  background: var(--pw-surface, var(--surface));
  color: var(--pw-text, var(--text));
  font-size: 16px;
}

html[data-pw-workspace="hr"] #app-root .filterbar {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  align-items: end;
  gap: 12px;
  padding: 16px;
  border-color: var(--pw-border, var(--border));
  border-radius: var(--pw-radius-card, 16px);
  background: var(--pw-surface, var(--surface));
  box-shadow: var(--pw-shadow-1, var(--shadow-1));
}

html[data-pw-workspace="hr"] #app-root .filterbar label {
  display: grid;
  gap: 6px;
  color: var(--pw-text, var(--text));
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

html[data-pw-workspace="hr"] #app-root .filterbar :where(select, input[type="date"]) {
  width: 100%;
  min-width: 0;
  min-height: 48px;
  padding-inline: 12px;
  border-color: var(--pw-border, var(--border));
  border-radius: var(--pw-radius-control, 12px);
  font-size: 16px;
}

html[data-pw-workspace="hr"] #app-root .filterbar .spacer { display: none; }
html[data-pw-workspace="hr"] #app-root #clear-filters { grid-column: -2 / -1; }

html[data-pw-workspace="hr"] #app-root .hr-inspector-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

html[data-pw-workspace="hr"] #app-root .hr-ins-card {
  min-width: 0;
  border-color: var(--pw-border, var(--border));
  border-radius: var(--pw-radius-card, 16px);
  background: var(--pw-surface, var(--surface));
  box-shadow: var(--pw-shadow-1, var(--shadow-1));
  content-visibility: auto;
  contain-intrinsic-size: auto 340px;
}

html[data-pw-workspace="hr"] #app-root .hr-ins-card__head {
  min-height: 92px;
  padding: 16px;
  border-color: var(--pw-border, var(--border));
  background: var(--pw-surface-muted, var(--surface-2));
}

html[data-pw-workspace="hr"] #app-root .hr-ins-card__name {
  font-size: 18px;
  line-height: 1.3;
}

html[data-pw-workspace="hr"] #app-root .hr-ins-card__info a[href^="tel:"] {
  min-height: 48px;
  display: inline-flex !important;
  align-items: center;
  gap: 7px !important;
  color: var(--pw-steel-700, var(--primary)) !important;
  font-size: 16px !important;
}

html[data-pw-workspace="hr"] #app-root .hr-ins-card__info a svg {
  width: 17px;
  height: 17px;
}

html[data-pw-workspace="hr"] #app-root .hr-ins-card__meta,
html[data-pw-workspace="hr"] #app-root .hr-ins-row__dep {
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 14px;
  line-height: 1.45;
}

html[data-pw-workspace="hr"] #app-root .hr-ins-card__badge {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 10px;
  border-radius: 999px;
  color: var(--pw-danger, var(--crit));
  background: var(--pw-danger-soft, var(--crit-soft));
  font-family: inherit;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
}

html[data-pw-workspace="hr"] #app-root .hr-ins-card__badge.is-warn {
  color: var(--pw-warning, var(--warn));
  background: var(--pw-warning-soft, var(--warn-soft));
}

html[data-pw-workspace="hr"] #app-root .hr-ins-row__where {
  color: var(--pw-text, var(--text));
  font-size: 14px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0;
  text-transform: none;
  overflow-wrap: anywhere;
}

html[data-pw-workspace="hr"] #app-root .hr-ins-row__tag {
  min-height: 28px;
  padding: 4px 9px;
  color: var(--pw-text-muted, var(--text-muted));
  background: var(--pw-surface-muted, var(--surface-2));
  font-size: 14px;
  letter-spacing: .02em;
}

html[data-pw-workspace="hr"] #app-root .hr-ins-row__tag.t-day {
  color: var(--pw-warning, var(--warn));
  background: var(--pw-warning-soft, var(--warn-soft));
}

html[data-pw-workspace="hr"] #app-root .hr-ins-row__tag.t-night {
  color: var(--pw-steel-700, var(--pw-steel-600));
  background: color-mix(in srgb, var(--pw-steel-600) 14%, var(--pw-surface));
}

html[data-pw-workspace="hr"] #app-root .hr-ins-row__need-num {
  color: var(--pw-warning, var(--warn));
  font-family: inherit;
  font-variant-numeric: tabular-nums;
}

html[data-pw-workspace="hr"] #app-root .hr-ins-row__need-num.n-crit { color: var(--pw-danger, var(--crit)); }

/* ---------- Daily Manning ---------- */
html[data-pw-workspace="entry"] #app-root .manning-workspace {
  max-width: var(--pw-canvas-max, 1440px);
}

html[data-pw-workspace="entry"] #app-root .manning-workspace .page-header {
  align-items: flex-end;
  gap: 20px;
  margin-bottom: 18px;
}

html[data-pw-workspace="entry"] #app-root .manning-date label {
  color: var(--pw-text, var(--text));
  font-size: 14px;
}

html[data-pw-workspace="entry"] #app-root .manning-summary {
  gap: 12px;
}

html[data-pw-workspace="entry"] #app-root .manning-summary > div {
  min-height: 104px;
  padding: 18px;
  border-color: var(--pw-border, var(--border));
  border-radius: var(--pw-radius-card, 16px);
  background: var(--pw-surface, var(--surface));
}

html[data-pw-workspace="entry"] #app-root .manning-summary strong {
  color: var(--pw-text, var(--text));
  font-variant-numeric: tabular-nums;
}

html[data-pw-workspace="entry"] #app-root .manning-summary .is-attention strong { color: var(--pw-warning, var(--warn)); }
html[data-pw-workspace="entry"] #app-root .manning-summary .is-critical strong { color: var(--pw-danger, var(--crit)); }

html[data-pw-workspace="entry"] #app-root .manning-summary span {
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 14px;
  line-height: 1.4;
}

html[data-pw-workspace="entry"] #app-root .manning-toolbar {
  align-items: flex-end;
  gap: 12px;
}

html[data-pw-workspace="entry"] #app-root .manning-toolbar :where(.search-field, .manning-client-filter) {
  display: block;
  min-width: 0;
  max-width: none;
}

html[data-pw-workspace="entry"] #app-root .manning-toolbar .search-field { flex: 1; }
html[data-pw-workspace="entry"] #app-root .manning-toolbar .search-field > svg { top: 41px; }

html[data-pw-workspace="entry"] #app-root .manning-layout {
  grid-template-columns: minmax(300px, 380px) minmax(0, 1fr);
  gap: 16px;
}

html[data-pw-workspace="entry"] #app-root :where(.manning-master, .manning-detail-wrap) {
  border-color: var(--pw-border, var(--border));
  border-radius: var(--pw-radius-card, 16px);
  background: var(--pw-surface, var(--surface));
}

html[data-pw-workspace="entry"] #app-root .manning-master__count {
  min-height: 48px;
  display: flex;
  align-items: center;
  color: var(--pw-text-muted, var(--text-muted));
  background: color-mix(in srgb, var(--pw-surface) 94%, transparent);
  font-size: 14px;
}

html[data-pw-workspace="entry"] #app-root .manning-area {
  min-height: 76px;
  border: 0;
  background: transparent;
  color: var(--pw-text, var(--text));
}

html[data-pw-workspace="entry"] #app-root .manning-area:hover {
  background: var(--pw-surface-muted, var(--surface-2));
}

html[data-pw-workspace="entry"] #app-root .manning-area.is-active {
  background: color-mix(in srgb, var(--pw-steel-600) 13%, var(--pw-surface));
  box-shadow: inset 4px 0 var(--pw-steel-600);
}

html[data-pw-workspace="entry"] #app-root .manning-area strong {
  display: -webkit-box;
  color: var(--pw-text, var(--text));
  font-size: 16px;
  line-height: 1.3;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

html[data-pw-workspace="entry"] #app-root .manning-area small {
  margin-top: 4px;
  font-size: 14px;
}

html[data-pw-workspace="entry"] #app-root .manning-detail__head > div > span {
  color: var(--pw-steel-700, var(--pw-steel-600));
  font-size: 14px;
}

html[data-pw-workspace="entry"] #app-root .manning-detail__head p {
  font-size: 14px;
}

html[data-pw-workspace="entry"] #app-root .manning-shift {
  border-color: var(--pw-border, var(--border));
  background: var(--pw-surface-muted, var(--surface-2));
}

html[data-pw-workspace="entry"] #app-root .manning-stepper :where(button, input) {
  min-height: 56px;
  border-color: var(--pw-border, var(--border));
  background: var(--pw-surface, var(--surface));
  color: var(--pw-text, var(--text));
}

html[data-pw-workspace="entry"] #app-root .manning-shift output,
html[data-pw-workspace="entry"] #app-root .manning-detail__actions > span {
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 14px;
}

/* ---------- Admin Center and setup workspaces ---------- */
html[data-pw-workspace="admin"] #app-root .admin-os,
html[data-pw-workspace="area-codes"] #app-root > :first-child {
  max-width: var(--pw-canvas-max, 1440px);
}

html[data-pw-workspace="admin"] #app-root .admin-os__summary {
  gap: 12px;
}

html[data-pw-workspace="admin"] #app-root .admin-os-stat {
  min-height: 102px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-radius: var(--pw-radius-card, 16px);
}

html[data-pw-workspace="admin"] #app-root .admin-os-stat strong {
  color: var(--pw-text, var(--text));
  font-size: clamp(26px, 2.4vw, 34px);
  font-variant-numeric: tabular-nums;
}

html[data-pw-workspace="admin"] #app-root .admin-os-stat span {
  margin-top: 8px;
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 14px;
}

html[data-pw-workspace="admin"] #app-root .admin-os-card {
  min-height: 210px;
  padding: 22px;
  border-radius: var(--pw-radius-card, 16px);
  transition: background-color var(--pw-motion-fast, 160ms) var(--pw-ease-out, ease-out), border-color var(--pw-motion-fast, 160ms) var(--pw-ease-out, ease-out), box-shadow var(--pw-motion-fast, 160ms) var(--pw-ease-out, ease-out);
}

html[data-pw-workspace="admin"] #app-root .admin-os-card:hover {
  border-color: var(--pw-steel-600);
  background: color-mix(in srgb, var(--pw-steel-600) 5%, var(--pw-surface));
}

html[data-pw-workspace="admin"] #app-root .admin-os-card__icon {
  color: var(--pw-steel-700, var(--pw-steel-600));
  background: color-mix(in srgb, var(--pw-steel-600) 12%, var(--pw-surface));
}

html[data-pw-workspace="admin"] #app-root .admin-os-card__status {
  color: var(--pw-text-muted, var(--text-muted));
  background: var(--pw-surface-muted, var(--surface-2));
  font-size: 14px;
}

html[data-pw-workspace="admin"] #app-root .admin-os-card h2 {
  font-size: 20px;
}

html[data-pw-workspace="admin"] #app-root .admin-os-card p {
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 16px;
  line-height: 1.55;
}

html[data-pw-workspace="admin"] #app-root .admin-os-card__action {
  color: var(--pw-steel-700, var(--pw-steel-600));
  font-size: 15px;
}

html[data-pw-workspace="admin"] #app-root .admin-os-section-head {
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 22px;
}

html[data-pw-workspace="admin"] #app-root .admin-collection__toolbar {
  align-items: flex-end;
  gap: 12px;
}

html[data-pw-workspace="admin"] #app-root .admin-collection__toolbar > .search-field,
html[data-pw-workspace="admin"] #app-root .assignment-picker > .search-field {
  display: block;
  max-width: none;
}

html[data-pw-workspace="admin"] #app-root .admin-collection__toolbar > .search-field > svg,
html[data-pw-workspace="admin"] #app-root .assignment-picker > .search-field > svg {
  top: 41px;
}

html[data-pw-workspace="admin"] #app-root .admin-collection__layout {
  grid-template-columns: minmax(300px, 380px) minmax(0, 1fr);
  gap: 16px;
}

html[data-pw-workspace="admin"] #app-root :where(.admin-collection__master, .admin-collection__detail) {
  border-color: var(--pw-border, var(--border));
  border-radius: var(--pw-radius-card, 16px);
  background: var(--pw-surface, var(--surface));
}

html[data-pw-workspace="admin"] #app-root .admin-collection__count {
  min-height: 52px;
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 14px;
}

html[data-pw-workspace="admin"] #app-root .admin-record {
  min-height: 76px;
  border: 0;
  background: transparent;
  color: var(--pw-text, var(--text));
}

html[data-pw-workspace="admin"] #app-root .admin-record strong {
  color: var(--pw-text, var(--text));
  font-size: 16px;
}

html[data-pw-workspace="admin"] #app-root .admin-record small {
  font-size: 14px;
}

html[data-pw-workspace="admin"] #app-root .admin-record-form {
  max-width: 860px;
}

html[data-pw-workspace="admin"] #app-root .admin-record-form__head > div > span {
  color: var(--pw-steel-700, var(--pw-steel-600));
  font-size: 14px;
}

html[data-pw-workspace="admin"] #app-root .assignment-picker__head p,
html[data-pw-workspace="admin"] #app-root .assignment-picker__head > span,
html[data-pw-workspace="admin"] #app-root .assignment-row small {
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 14px;
}

html[data-pw-workspace="admin"] #app-root .assignment-row {
  min-height: 64px;
}

html[data-pw-workspace="admin"] #app-root :where(.policy-studio, .health-list) {
  min-width: 0;
}

html[data-pw-workspace="admin"] #app-root .policy-panel {
  padding: clamp(18px, 2.4vw, 28px);
  border-radius: var(--pw-radius-card, 16px);
}

html[data-pw-workspace="admin"] #app-root .policy-panel > p,
html[data-pw-workspace="admin"] #app-root .policy-warning,
html[data-pw-workspace="area-codes"] #app-root .policy-warning {
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 16px;
  line-height: 1.55;
}

html[data-pw-workspace="admin"] #app-root .policy-warning,
html[data-pw-workspace="area-codes"] #app-root .policy-warning {
  border-color: color-mix(in srgb, var(--pw-warning) 35%, var(--pw-border));
  background: var(--pw-warning-soft, var(--warn-soft));
}

html[data-pw-workspace="admin"] #app-root .policy-actions,
html[data-pw-workspace="area-codes"] #app-root .policy-actions {
  gap: 10px;
}

html[data-pw-workspace="admin"] #app-root .health-row {
  min-height: 76px;
  border-color: var(--pw-border, var(--border));
  background: var(--pw-surface, var(--surface));
}

/* ---------- Audit and Login History ---------- */
html[data-pw-workspace="audit"] #app-root .page,
html[data-pw-workspace="login-history"] #app-root .page {
  max-width: var(--pw-canvas-max, 1440px);
}

html[data-pw-workspace="audit"] #app-root .collection-toolbar,
html[data-pw-workspace="login-history"] #app-root .collection-toolbar {
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) minmax(180px, 1fr) auto;
  align-items: end;
  gap: 12px;
  padding: 18px;
  border-radius: var(--pw-radius-card, 16px);
}

html[data-pw-workspace="audit"] #app-root .collection-toolbar__actions,
html[data-pw-workspace="login-history"] #app-root .collection-toolbar__actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

html[data-pw-workspace="audit"] #app-root .audit-list,
html[data-pw-workspace="login-history"] #app-root .login-event-list {
  border-radius: var(--pw-radius-card, 16px);
}

html[data-pw-workspace="audit"] #app-root .audit-row,
html[data-pw-workspace="login-history"] #app-root .login-event {
  content-visibility: auto;
  contain-intrinsic-size: auto 84px;
}

html[data-pw-workspace="audit"] #app-root .audit-row__title {
  color: var(--pw-text, var(--text));
  font-size: 16px;
}

html[data-pw-workspace="audit"] #app-root .audit-row__body > p,
html[data-pw-workspace="audit"] #app-root .audit-row > time,
html[data-pw-workspace="login-history"] #app-root .login-event__identity span,
html[data-pw-workspace="login-history"] #app-root .login-event__device span,
html[data-pw-workspace="login-history"] #app-root .login-event time {
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 14px;
}

html[data-pw-workspace="audit"] #app-root .audit-diff > summary {
  color: var(--pw-steel-700, var(--pw-steel-600));
  font-size: 15px;
}

html[data-pw-workspace="audit"] #app-root .audit-diff code {
  color: var(--pw-text, var(--text));
  font-size: 14px;
}

html[data-pw-workspace="login-history"] #app-root .login-event__identity strong,
html[data-pw-workspace="login-history"] #app-root .login-event__device strong {
  color: var(--pw-text, var(--text));
  font-size: 16px;
}

html[data-pw-workspace="audit"] #app-root .pagination,
html[data-pw-workspace="login-history"] #app-root .pagination {
  flex-wrap: wrap;
  padding-block: 10px;
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 14px;
}

/* ---------- Secure Accounts ---------- */
html[data-pw-workspace="accounts"] #app-root .pwauth-account-page {
  width: min(100%, var(--pw-canvas-max, 1440px));
  max-width: var(--pw-canvas-max, 1440px);
  padding: 0;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-account-head {
  gap: 24px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-account-head p {
  font-size: 17px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-actions {
  gap: 8px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-button {
  min-height: 48px;
  border: 1px solid var(--pw-primary, var(--primary));
  border-radius: var(--pw-radius-control, 12px);
  background: var(--pw-primary, var(--primary));
  color: var(--pw-on-primary, var(--primary-ink));
  font-size: 16px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-button:hover:not(:disabled) {
  border-color: var(--pw-primary-hover, var(--pw-primary));
  background: var(--pw-primary-hover, var(--pw-primary));
  color: var(--pw-on-primary, var(--primary-ink));
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-button--quiet {
  border-color: var(--pw-border-strong, var(--border-strong));
  background: var(--pw-surface, var(--surface));
  color: var(--pw-text, var(--text));
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-button--quiet:hover:not(:disabled) {
  border-color: var(--pw-steel-600);
  background: var(--pw-surface-muted, var(--surface-2));
  color: var(--pw-text, var(--text));
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-button--danger {
  border-color: var(--pw-danger, var(--crit));
  background: var(--pw-surface, var(--surface));
  color: var(--pw-danger, var(--crit));
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-button--danger:hover:not(:disabled) {
  background: var(--pw-danger, var(--crit));
  color: var(--pw-on-status, #fff);
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-note {
  border-color: color-mix(in srgb, var(--pw-steel-600) 35%, var(--pw-border));
  background: color-mix(in srgb, var(--pw-steel-600) 10%, var(--pw-surface));
  color: var(--pw-text, var(--text));
  font-size: 16px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-note strong { color: var(--pw-text, var(--text)); }

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-filter {
  grid-template-columns: minmax(260px, 1.5fr) minmax(170px, .75fr) minmax(170px, .75fr) auto;
  gap: 12px;
  padding: 18px;
  border-radius: var(--pw-radius-card, 16px);
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-filter input,
html[data-pw-workspace="accounts"] #app-root .pwauth-admin-filter select,
html[data-pw-workspace="accounts"] .pwauth-admin-form input,
html[data-pw-workspace="accounts"] .pwauth-admin-form select {
  min-height: 48px;
  border: 1px solid var(--pw-border-strong, var(--border-strong));
  border-radius: var(--pw-radius-control, 12px);
  background: var(--pw-surface, var(--surface));
  color: var(--pw-text, var(--text));
  font-size: 16px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-status {
  min-height: 32px;
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 15px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-status--error {
  border-color: color-mix(in srgb, var(--pw-danger) 40%, var(--pw-border));
  background: var(--pw-danger-soft, var(--crit-soft));
  color: var(--pw-danger, var(--crit));
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-list {
  gap: 16px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-identity-card {
  min-width: 0;
  padding: 22px;
  border-radius: var(--pw-radius-card, 16px);
  content-visibility: auto;
  contain-intrinsic-size: auto 360px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-identity-card h2 {
  color: var(--pw-text, var(--text));
  font-size: 20px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-identity-card__email {
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 15px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-identity-card__meta h3 {
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 14px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-scope-list li {
  color: var(--pw-text, var(--text));
  background: var(--pw-surface-muted, var(--surface-2));
  font-size: 14px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-chip {
  color: var(--pw-text-muted, var(--text-muted));
  background: var(--pw-surface-muted, var(--surface-2));
  font-size: 14px;
}

html[data-pw-workspace="accounts"] #app-root .pwauth-chip--active {
  color: var(--pw-success, var(--ok));
  background: var(--pw-success-soft, var(--ok-soft));
}

html[data-pw-workspace="accounts"] #app-root .pwauth-chip--suspended {
  color: var(--pw-danger, var(--crit));
  background: var(--pw-danger-soft, var(--crit-soft));
}

html[data-pw-workspace="accounts"] #app-root .pwauth-chip--pending {
  color: var(--pw-warning, var(--warn));
  background: var(--pw-warning-soft, var(--warn-soft));
}

html[data-pw-workspace="accounts"] #app-root .pwauth-admin-pager {
  flex-wrap: wrap;
  color: var(--pw-text-muted, var(--text-muted));
}

html[data-pw-workspace="accounts"] .pwauth-modal {
  padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
  overscroll-behavior: contain;
  background: rgba(4, 12, 20, .66);
}

html[data-pw-workspace="accounts"] .pwauth-modal__card {
  border: 1px solid var(--pw-border, var(--border));
  border-radius: var(--pw-radius-sheet, 24px);
  background: var(--pw-surface, var(--surface));
  color: var(--pw-text, var(--text));
}

html[data-pw-workspace="accounts"] .pwauth-admin-modal__card > p,
html[data-pw-workspace="accounts"] .pwauth-admin-form__help {
  color: var(--pw-text-muted, var(--text-muted));
}

html[data-pw-workspace="accounts"] .pwauth-credential {
  border-color: var(--pw-border-strong, var(--border-strong));
  background: var(--pw-surface-muted, var(--surface-2));
}

html[data-pw-workspace="accounts"] .pwauth-credential :where(dt, dd, code) {
  color: var(--pw-text, var(--text));
}

/* ---------- Area Desk / DTR station ---------- */
html[data-pw-workspace="area-portal"] #app-root.dtr-station-v3 {
  /* The shell owns the sidebar/rail offset and available canvas width. */
  grid-template-columns: minmax(0, 1fr);
}

html[data-pw-workspace="area-portal"] #app-root.dtr-station-v3 > * {
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
}

html[data-pw-workspace="area-portal"] #app-root .page-header {
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 18px !important;
}

html[data-pw-workspace="area-portal"] #app-root .page-header p {
  font-size: 17px !important;
}

html[data-pw-workspace="area-portal"] #app-root .dtr-workflow-strip {
  margin-bottom: 18px;
  border-color: var(--pw-border, var(--border));
  border-radius: var(--pw-radius-card, 16px);
  background: var(--pw-surface, var(--surface));
}

html[data-pw-workspace="area-portal"] #app-root .dtr-workflow-strip > div {
  min-height: 92px;
  border-color: var(--pw-border, var(--border));
}

html[data-pw-workspace="area-portal"] #app-root .dtr-workflow-strip strong {
  color: var(--pw-text, var(--text));
  font-size: 16px;
}

html[data-pw-workspace="area-portal"] #app-root .dtr-workflow-strip small {
  color: var(--pw-text-muted, var(--text-muted));
  font-size: 14px;
}

html[data-pw-workspace="area-portal"] #app-root .card {
  padding: clamp(18px, 2.5vw, 28px);
  border-radius: var(--pw-radius-card, 16px);
}

html[data-pw-workspace="area-portal"] #app-root .card__head {
  align-items: center;
  gap: 12px;
}

html[data-pw-workspace="area-portal"] #app-root .card__label {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--pw-text, var(--text));
  font-size: 18px;
  font-weight: 750;
}

html[data-pw-workspace="area-portal"] #app-root .card__label svg {
  width: 21px;
  height: 21px;
  color: var(--pw-steel-700, var(--pw-steel-600));
}

html[data-pw-workspace="area-portal"] #app-root .memo-lbl,
html[data-pw-workspace="area-portal"] #app-root .dtr-entry-hint {
  color: var(--pw-text, var(--text));
  font-size: 14px;
}

html[data-pw-workspace="area-portal"] #app-root #dtr-oic {
  min-height: 48px;
  max-width: 420px !important;
  font-size: 16px;
}

html[data-pw-workspace="area-portal"] #app-root .dtr-entry-grid {
  border-color: var(--pw-border, var(--border)) !important;
  border-radius: var(--pw-radius-control, 12px) !important;
  background: var(--pw-surface, var(--surface));
}

html[data-pw-workspace="area-portal"] #app-root .dtr-entry-grid table {
  width: max-content;
  min-width: 100%;
  border-spacing: 0;
}

html[data-pw-workspace="area-portal"] #app-root .dtr-entry-grid :where(th, td) {
  border-color: var(--pw-border, var(--border));
}

html[data-pw-workspace="area-portal"] #app-root .dtr-entry-grid thead {
  background: var(--pw-surface-muted, var(--surface-2));
}

html[data-pw-workspace="area-portal"] #app-root .dtr-entry-grid .dtr-name {
  min-width: 210px !important;
  min-height: 48px !important;
  border-color: var(--pw-border, var(--border)) !important;
  border-radius: 10px !important;
  background: var(--pw-surface, var(--surface)) !important;
  color: var(--pw-text, var(--text)) !important;
  font-size: 16px !important;
}

html[data-pw-workspace="area-portal"] #app-root .dtr-entry-grid .dtr-cell {
  width: 48px !important;
  min-width: 48px;
  height: 48px !important;
  border-color: var(--pw-border, var(--border)) !important;
  border-radius: 10px !important;
  background: var(--pw-surface, var(--surface)) !important;
  color: var(--pw-text, var(--text)) !important;
  font-size: 16px !important;
  font-variant-numeric: tabular-nums;
}

html[data-pw-workspace="area-portal"] #app-root .dtr-del {
  width: 48px;
  min-width: 48px;
  padding: 0 !important;
  border-color: var(--pw-border, var(--border));
  background: var(--pw-surface, var(--surface));
  color: var(--pw-danger, var(--crit));
}

html[data-pw-workspace="area-portal"] #app-root .bill-badge {
  font-size: 14px;
}

/* ---------- Adaptive breakpoints ---------- */
@media (min-width: 1440px) {
  html[data-pw-workspace="accounts"] #app-root .pwauth-admin-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1680px) {
  html[data-pw-workspace="hr"] #app-root .hr-inspector-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 800px) and (max-width: 1199px) {
  html[data-pw-workspace="entry"] #app-root .manning-layout,
  html[data-pw-workspace="admin"] #app-root .admin-collection__layout {
    grid-template-columns: minmax(230px, 270px) minmax(0, 1fr);
  }

  html[data-pw-workspace="entry"] #app-root .manning-shifts { grid-template-columns: 1fr; }
}

@media (min-width: 768px) and (max-width: 1199px) {
  html[data-pw-workspace="hr"] #app-root .page-header {
    display: grid;
    grid-template-columns: 1fr;
  }

  html[data-pw-workspace="hr"] #app-root .hr-page-actions {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    justify-content: stretch;
    width: 100%;
    min-width: 0;
  }

  html[data-pw-workspace="hr"] #app-root .hr-view-toggle { justify-self: stretch; }
  html[data-pw-workspace="hr"] #app-root .hr-view-toggle button { flex: 1; justify-content: center; }
  html[data-pw-workspace="hr"] #app-root .filterbar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html[data-pw-workspace="hr"] #app-root .hr-inspector-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-pw-workspace="hr"] #app-root .hr-ins-card__head { flex-wrap: wrap; }
  html[data-pw-workspace="hr"] #app-root .hr-ins-card__badge { width: auto; margin-left: auto; }

  html[data-pw-workspace="admin"] #app-root .admin-os-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-pw-workspace="admin"] #app-root .admin-os__summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  html[data-pw-workspace="admin"] #app-root .policy-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  html[data-pw-workspace="audit"] #app-root .collection-toolbar,
  html[data-pw-workspace="login-history"] #app-root .collection-toolbar,
  html[data-pw-workspace="accounts"] #app-root .pwauth-admin-filter {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-pw-workspace="audit"] #app-root .collection-toolbar__actions,
  html[data-pw-workspace="login-history"] #app-root .collection-toolbar__actions,
  html[data-pw-workspace="accounts"] #app-root .pwauth-admin-filter__search,
  html[data-pw-workspace="accounts"] #app-root .pwauth-admin-filter__buttons {
    grid-column: 1 / -1;
  }

  html[data-pw-workspace="accounts"] #app-root .pwauth-account-head { flex-direction: column; }
  html[data-pw-workspace="accounts"] #app-root .pwauth-admin-actions { justify-content: flex-start; }
  html[data-pw-workspace="area-portal"] #app-root .dtr-workflow-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 768px) and (max-width: 799px) {
  html[data-pw-workspace="entry"] #app-root .manning-layout,
  html[data-pw-workspace="admin"] #app-root .admin-collection__layout {
    display: block;
  }

  html[data-pw-workspace="entry"] #app-root .manning-workspace.has-selection .manning-master,
  html[data-pw-workspace="admin"] #app-root .admin-collection.has-selection .admin-collection__master { display: none; }

  html[data-pw-workspace="entry"] #app-root .manning-workspace:not(.has-selection) .manning-detail-wrap,
  html[data-pw-workspace="admin"] #app-root .admin-collection:not(.has-selection) .admin-collection__detail { display: none; }

  html[data-pw-workspace="entry"] #app-root .manning-mobile-back,
  html[data-pw-workspace="admin"] #app-root .admin-record-mobile-back { display: inline-flex; }
}

@media (max-width: 767px) {
  html[data-pw-workspace] #app-root .pw4-workspace-state {
    min-height: 160px;
    padding: 24px 18px;
  }

  html[data-pw-workspace] #app-root :where(.page-header, .admin-os__intro, .admin-os-section-head, .pwauth-account-head) {
    align-items: stretch;
    flex-direction: column;
    gap: 14px;
  }

  html[data-pw-workspace] #app-root :where(.page-header, .admin-os__intro, .admin-os-section-head, .pwauth-account-head) p {
    font-size: 17px !important;
  }

  html[data-pw-workspace="hr"] #app-root .hr-page-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    min-width: 0;
  }

  html[data-pw-workspace="hr"] #app-root .hr-page-actions > .btn {
    width: 100%;
    min-width: 0;
  }

  html[data-pw-workspace="hr"] #app-root .hr-view-toggle {
    display: flex;
    justify-self: stretch;
  }

  html[data-pw-workspace="hr"] #app-root .hr-view-toggle button { flex: 1; justify-content: center; }
  html[data-pw-workspace="hr"] #app-root .filter-toggle-btn { display: inline-flex; }
  html[data-pw-workspace="hr"] #app-root #filter-toggle { grid-column: 1 / -1; width: 100%; }
  html[data-pw-workspace="hr"] #app-root .filterbar { display: none; grid-template-columns: 1fr; }
  html[data-pw-workspace="hr"] #app-root .filterbar.is-open { display: grid; }
  html[data-pw-workspace="hr"] #app-root #clear-filters { grid-column: auto; }
  html[data-pw-workspace="hr"] #app-root .hr-inspector-grid { grid-template-columns: 1fr; }
  html[data-pw-workspace="hr"] #app-root .hr-ins-card__head { flex-wrap: wrap; }
  html[data-pw-workspace="hr"] #app-root .hr-ins-card__badge { width: auto; margin-left: auto; }
  html[data-pw-workspace="hr"] #app-root .hr-ins-row { grid-template-columns: 4px minmax(0, 1fr) 74px; }
  html[data-pw-workspace="hr"] #app-root .hr-ins-row__need { display: flex; min-width: 0; padding: 12px 8px; }
  html[data-pw-workspace="hr"] #app-root .hr-ins-row__need-num { font-size: 28px; }
  html[data-pw-workspace="hr"] #app-root .hr-ins-row__dep { white-space: normal; text-align: center; }
  html[data-pw-workspace="hr"] #app-root .table-wrap { overflow-x: auto; }

  html[data-pw-workspace="entry"] #app-root .manning-workspace .page-header { align-items: stretch; }
  html[data-pw-workspace="entry"] #app-root .manning-date { width: 100%; min-width: 0; }
  html[data-pw-workspace="entry"] #app-root .manning-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-pw-workspace="entry"] #app-root .manning-summary > div { min-height: 94px; }
  html[data-pw-workspace="entry"] #app-root .manning-summary > div:last-child { grid-column: 1 / -1; }
  html[data-pw-workspace="entry"] #app-root .manning-toolbar { position: static; display: grid; grid-template-columns: 1fr; padding: 0; }
  html[data-pw-workspace="entry"] #app-root .manning-workspace.has-selection :where(.manning-summary, .manning-toolbar) { display: none; }
  html[data-pw-workspace="entry"] #app-root .manning-client-filter { width: 100%; min-width: 0; overflow: visible; }
  html[data-pw-workspace="entry"] #app-root .manning-client-filter select { width: 100%; color: var(--pw-text, var(--text)); }
  html[data-pw-workspace="entry"] #app-root .manning-layout { display: block; }
  html[data-pw-workspace="entry"] #app-root .manning-workspace.has-selection .manning-master { display: none; }
  html[data-pw-workspace="entry"] #app-root .manning-workspace:not(.has-selection) .manning-detail-wrap { display: none; }
  html[data-pw-workspace="entry"] #app-root .manning-mobile-back { display: inline-flex; }
  html[data-pw-workspace="entry"] #app-root .manning-detail__head { position: static; flex-wrap: wrap; }
  html[data-pw-workspace="entry"] #app-root .manning-detail__head > .status-pill { position: static; margin: 0 0 0 auto; }
  html[data-pw-workspace="entry"] #app-root .manning-shifts { grid-template-columns: 1fr; }
  html[data-pw-workspace="entry"] #app-root .manning-tools { grid-template-columns: 1fr; }
  html[data-pw-workspace="entry"] #app-root .manning-detail__actions { bottom: calc(76px + env(safe-area-inset-bottom)); }

  html[data-pw-workspace="admin"] #app-root .admin-os__summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-pw-workspace="admin"] #app-root .admin-os-grid { grid-template-columns: 1fr; }
  html[data-pw-workspace="admin"] #app-root .admin-os-card { min-height: 176px; }
  html[data-pw-workspace="admin"] #app-root .admin-os-section-head .btn { align-self: flex-start; }
  html[data-pw-workspace="admin"] #app-root .admin-collection__toolbar { position: static; display: grid; grid-template-columns: 1fr; padding: 0; }
  html[data-pw-workspace="admin"] #app-root .admin-collection.has-selection .admin-collection__toolbar { display: none; }
  html[data-pw-workspace="admin"] #app-root .admin-collection__toolbar .btn { width: 100%; min-width: 0; padding: 10px 16px; font-size: 16px; }
  html[data-pw-workspace="admin"] #app-root .admin-collection__layout { display: block; }
  html[data-pw-workspace="admin"] #app-root .admin-collection.has-selection .admin-collection__master { display: none; }
  html[data-pw-workspace="admin"] #app-root .admin-collection:not(.has-selection) .admin-collection__detail { display: none; }
  html[data-pw-workspace="admin"] #app-root .admin-record-mobile-back { display: inline-flex; }
  html[data-pw-workspace="admin"] #app-root .admin-record-form__actions { flex-direction: column-reverse; }
  html[data-pw-workspace="admin"] #app-root .admin-record-form__actions > :where(.btn, a) { width: 100%; }
  html[data-pw-workspace="admin"] #app-root .policy-grid { grid-template-columns: 1fr; }
  html[data-pw-workspace="admin"] #app-root .policy-actions,
  html[data-pw-workspace="area-codes"] #app-root .policy-actions { align-items: stretch; flex-direction: column; }
  html[data-pw-workspace="admin"] #app-root .policy-actions .btn,
  html[data-pw-workspace="area-codes"] #app-root .policy-actions .btn { width: 100%; }

  html[data-pw-workspace="audit"] #app-root .page-header .btn,
  html[data-pw-workspace="login-history"] #app-root .page-header .btn { width: 100%; }
  html[data-pw-workspace="audit"] #app-root .collection-toolbar,
  html[data-pw-workspace="login-history"] #app-root .collection-toolbar { grid-template-columns: 1fr; padding: 14px; }
  html[data-pw-workspace="audit"] #app-root .collection-toolbar__actions,
  html[data-pw-workspace="login-history"] #app-root .collection-toolbar__actions { grid-column: auto; }
  html[data-pw-workspace="audit"] #app-root .audit-row { grid-template-columns: 44px minmax(0, 1fr); }
  html[data-pw-workspace="audit"] #app-root .audit-row > time { grid-column: 2; }
  html[data-pw-workspace="login-history"] #app-root .login-event { grid-template-columns: 44px minmax(0, 1fr); }
  html[data-pw-workspace="login-history"] #app-root .login-event :where(.login-event__device, time) { grid-column: 2; }
  html[data-pw-workspace="audit"] #app-root .pagination,
  html[data-pw-workspace="login-history"] #app-root .pagination { display: grid; grid-template-columns: 1fr auto 1fr; }
  html[data-pw-workspace="audit"] #app-root .pagination .btn:last-child,
  html[data-pw-workspace="login-history"] #app-root .pagination .btn:last-child { justify-self: end; }

  html[data-pw-workspace="accounts"] #app-root .pwauth-account-page { padding: 0; }
  html[data-pw-workspace="accounts"] #app-root .pwauth-admin-actions,
  html[data-pw-workspace="accounts"] #app-root .pwauth-admin-filter__buttons,
  html[data-pw-workspace="accounts"] #app-root .pwauth-identity-card__actions { display: grid; grid-template-columns: 1fr; width: 100%; }
  html[data-pw-workspace="accounts"] #app-root .pwauth-admin-filter { grid-template-columns: 1fr; padding: 14px; }
  html[data-pw-workspace="accounts"] #app-root .pwauth-admin-filter__search,
  html[data-pw-workspace="accounts"] #app-root .pwauth-admin-filter__buttons { grid-column: auto; }
  html[data-pw-workspace="accounts"] #app-root .pwauth-identity-card { padding: 17px; }
  html[data-pw-workspace="accounts"] #app-root .pwauth-identity-card__top { flex-direction: column; }
  html[data-pw-workspace="accounts"] #app-root .pwauth-identity-card__top > div:last-child { justify-content: flex-start !important; }
  html[data-pw-workspace="accounts"] #app-root .pwauth-identity-card__meta,
  html[data-pw-workspace="accounts"] .pwauth-admin-form__row,
  html[data-pw-workspace="accounts"] .pwauth-admin-checks { grid-template-columns: 1fr; }
  html[data-pw-workspace="accounts"] #app-root .pwauth-admin-pager { align-items: stretch; flex-direction: column; }
  html[data-pw-workspace="accounts"] #app-root .pwauth-admin-pager .pwauth-admin-actions { grid-template-columns: 1fr 1fr; }
  html[data-pw-workspace="accounts"] .pwauth-modal { place-items: end stretch; padding: 0; }
  html[data-pw-workspace="accounts"] .pwauth-modal__card { width: 100%; max-height: calc(100dvh - env(safe-area-inset-top)); padding: 22px 16px max(22px, env(safe-area-inset-bottom)); border-radius: 24px 24px 0 0; }

  html[data-pw-workspace="area-portal"] #app-root.dtr-station-v3 { gap: 12px; }
  html[data-pw-workspace="area-portal"] #app-root .page-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; text-align: left; margin-bottom: 0 !important; }
  html[data-pw-workspace="area-portal"] #app-root .page-header > div { min-width: 0; }
  html[data-pw-workspace="area-portal"] #app-root .page-header h1 { font-size: 24px; }
  html[data-pw-workspace="area-portal"] #app-root .page-header p { font-size: 14px !important; }
  html[data-pw-workspace="area-portal"] #app-root .page-header .btn { width: auto; }
  html[data-pw-workspace="area-portal"] #app-root .page-header > .btn:last-child:not(#area-logout) { grid-column: 1 / -1; justify-self: start; }
  html[data-pw-workspace="area-portal"] #app-root .dtr-workflow-strip { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; margin-bottom: 0; }
  html[data-pw-workspace="area-portal"] #app-root .dtr-workflow-strip > div { min-height: 52px; padding: 8px; gap: 7px; border-right: 1px solid var(--pw-border, var(--border)) !important; border-bottom: 1px solid var(--pw-border, var(--border)) !important; }
  html[data-pw-workspace="area-portal"] #app-root .dtr-workflow-strip > div:nth-child(even) { border-right: 0 !important; }
  html[data-pw-workspace="area-portal"] #app-root .dtr-workflow-strip > div:nth-child(n+3) { border-bottom: 0 !important; }
  html[data-pw-workspace="area-portal"] #app-root .dtr-workflow-strip > div > span { width: 26px; height: 26px; font-size: 14px; }
  html[data-pw-workspace="area-portal"] #app-root .dtr-workflow-strip strong { font-size: 14px; line-height: 1.3; }
  html[data-pw-workspace="area-portal"] #app-root .dtr-workflow-strip small { display: none; }
  html[data-pw-workspace="area-portal"] #app-root .card { padding: 16px; }
  html[data-pw-workspace="area-portal"] #app-root .card__head { align-items: flex-start; flex-direction: column; }
  html[data-pw-workspace="area-portal"] #app-root .card__label { font-size: 16px; text-transform: none; letter-spacing: 0; line-height: 1.4; }
  html[data-pw-workspace="area-portal"] #app-root #dtr-oic { max-width: none !important; width: 100%; }
  html[data-pw-workspace="area-portal"] #app-root .dtr-entry-grid { margin-inline: 0; border: 1px solid var(--pw-border, var(--border)) !important; border-radius: 12px !important; }
  html[data-pw-workspace="area-portal"] #app-root .dtr-entry-grid .dtr-name { width: 128px !important; min-width: 128px !important; max-width: 128px !important; }
  html[data-pw-workspace="area-portal"] #app-root :where(#dtr-save, #dtr-final, #dtr-print, #dtr-retry-notification, #area-timestamp) { width: 100%; }
}

@media (max-width: 359px) {
  /* Keep a complete 48px date field beside the pinned guard and shift labels. */
  html[data-pw-workspace="area-portal"] #app-root .dtr-entry-grid { --dtr-name-column: 124px; }
  html[data-pw-workspace="area-portal"] #app-root .dtr-entry-grid .dtr-name { width: 112px !important; min-width: 112px !important; max-width: 112px !important; }
}

@media (prefers-reduced-motion: reduce) {
  html[data-pw-workspace] #app-root *,
  html[data-pw-workspace] .pwauth-modal * {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }

  html[data-pw-workspace] #app-root .pw4-workspace-state[data-pw-state="loading"]::before {
    animation: none;
    border-top-color: var(--pw-border, var(--border));
  }
}

@media (forced-colors: active) {
  html[data-pw-workspace] #app-root :where(button, .btn, a, input, select, textarea, summary):focus-visible {
    outline: 3px solid Highlight;
    box-shadow: none;
  }

  html[data-pw-workspace] #app-root :where(.hr-ins-row__spine, .manning-area__status) {
    border: 2px solid CanvasText;
  }
}

@media print {
  html[data-pw-workspace] #app-root {
    overflow: visible;
  }

  html[data-pw-workspace] #app-root :where(.os-topbar, .os-sidebar, .os-mobile-nav, .pw4-workspace-label) {
    display: none !important;
  }
}
