/* NEXXVU DESIGN TOKENS — hard-coded visual values belong in this section only. */
:root {
  color-scheme: light;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --white: #fff; --slate-25: #f8fafc; --slate-50: #f1f5f9; --slate-200: #cbd5e1; --slate-500: #64748b; --slate-700: #334155; --slate-900: #0f172a; --slate-950: #07101f;
  --teal-300: #5eead4; --teal-500: #0d9488; --teal-700: #0f766e; --teal-800: #115e59; --blue-400: #60a5fa; --blue-600: #2563eb; --blue-700: #1d4ed8; --violet-400: #a78bfa; --violet-600: #7c3aed; --violet-700: #6d28d9; --amber-300: #fcd34d; --amber-500: #f59e0b; --amber-700: #b45309; --rose-400: #fb7185; --rose-600: #e11d48; --rose-700: #be123c;
  --green-100: #dcfce7; --green-800: #166534; --amber-100: #fef3c7; --amber-800: #92400e; --red-100: #fee2e2; --red-800: #991b1b; --transparent: transparent;
  --background: var(--slate-25); --surface: var(--white); --panel: var(--white); --surface-subtle: var(--slate-50); --border: var(--slate-200); --border-strong: var(--slate-500);
  --text-primary: var(--slate-900); --text-muted: var(--slate-500); --text-on-primary: var(--white);
  --success: var(--green-800); --success-surface: var(--green-100); --warning: var(--amber-800); --warning-surface: var(--amber-100); --danger: var(--red-800); --danger-surface: var(--red-100); --danger-foreground: var(--red-800); --neutral: var(--slate-700); --neutral-surface: var(--slate-50);
  --accent-teal-background: var(--teal-700); --accent-teal-hover: var(--teal-800); --accent-teal-foreground: var(--white); --accent-teal-focus: var(--teal-700); --accent-teal-focus-dark: var(--teal-300);
  --accent-blue-background: var(--blue-600); --accent-blue-hover: var(--blue-700); --accent-blue-foreground: var(--white); --accent-blue-focus: var(--blue-600); --accent-blue-focus-dark: var(--blue-400);
  --accent-violet-background: var(--violet-600); --accent-violet-hover: var(--violet-700); --accent-violet-foreground: var(--white); --accent-violet-focus: var(--violet-600); --accent-violet-focus-dark: var(--violet-400);
  --accent-amber-background: var(--amber-700); --accent-amber-hover: var(--amber-800); --accent-amber-foreground: var(--white); --accent-amber-focus: var(--amber-700); --accent-amber-focus-dark: var(--amber-300);
  --accent-rose-background: var(--rose-600); --accent-rose-hover: var(--rose-700); --accent-rose-foreground: var(--white); --accent-rose-focus: var(--rose-600); --accent-rose-focus-dark: var(--rose-400);
  --primary: var(--accent-teal-background); --primary-hover: var(--accent-teal-hover); --primary-foreground: var(--accent-teal-foreground); --accent: var(--accent-teal-background); --focus-ring: var(--accent-teal-focus);
  --space-0: 0; --space-1: .25rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem; --space-5: 1.25rem; --space-6: 1.5rem; --space-8: 2rem; --space-10: 2.5rem; --space-12: 3rem;
  --font-xs: .75rem; --font-sm: .875rem; --font-md: 1rem; --font-lg: 1.125rem; --font-xl: 1.25rem; --font-2xl: 1.5rem; --font-3xl: 2rem; --line-tight: 1.2; --line-normal: 1.55; --weight-medium: 600; --weight-bold: 700;
  --radius-sm: .375rem; --radius-md: .625rem; --radius-lg: .875rem; --radius-round: 999rem;
  --shadow-sm: 0 1px 2px rgb(15 23 42 / .08); --shadow-md: 0 8px 24px rgb(15 23 42 / .12);
  --border-width: 1px; --focus-width: 3px; --content-width: 75rem; --auth-width: 28rem; --dialog-width: 36rem; --inventory-tree-width: 18rem; --control-height: 2.75rem; --icon-size: 1.25rem; --state-icon-size: 2.5rem; --spinner-size: 1.25rem; --spinner-width: .1875rem; --transition-fast: 140ms ease;
}
:root[data-accent="teal"] { --primary: var(--accent-teal-background); --primary-hover: var(--accent-teal-hover); --primary-foreground: var(--accent-teal-foreground); --accent: var(--accent-teal-background); --focus-ring: var(--accent-teal-focus); }
:root[data-accent="blue"] { --primary: var(--accent-blue-background); --primary-hover: var(--accent-blue-hover); --primary-foreground: var(--accent-blue-foreground); --accent: var(--accent-blue-background); --focus-ring: var(--accent-blue-focus); }
:root[data-accent="violet"] { --primary: var(--accent-violet-background); --primary-hover: var(--accent-violet-hover); --primary-foreground: var(--accent-violet-foreground); --accent: var(--accent-violet-background); --focus-ring: var(--accent-violet-focus); }
:root[data-accent="amber"] { --primary: var(--accent-amber-background); --primary-hover: var(--accent-amber-hover); --primary-foreground: var(--accent-amber-foreground); --accent: var(--accent-amber-background); --focus-ring: var(--accent-amber-focus); }
:root[data-accent="rose"] { --primary: var(--accent-rose-background); --primary-hover: var(--accent-rose-hover); --primary-foreground: var(--accent-rose-foreground); --accent: var(--accent-rose-background); --focus-ring: var(--accent-rose-focus); }
:root[data-theme="dark"] {
  color-scheme: dark; --background: var(--slate-950); --surface: var(--slate-900); --panel: var(--slate-900); --surface-subtle: var(--slate-700); --border: var(--slate-700); --border-strong: var(--slate-500); --text-primary: var(--slate-50); --text-muted: var(--slate-200); --success: var(--green-100); --success-surface: var(--green-800); --warning: var(--amber-100); --warning-surface: var(--amber-800); --danger: var(--red-100); --danger-surface: var(--red-800); --danger-foreground: var(--red-100); --neutral: var(--slate-50); --neutral-surface: var(--slate-700); --focus-ring: var(--accent-teal-focus-dark); --shadow-sm: 0 1px 2px rgb(0 0 0 / .35); --shadow-md: 0 8px 24px rgb(0 0 0 / .45);
}
:root[data-theme="dark"][data-accent="teal"] { --focus-ring: var(--accent-teal-focus-dark); }
:root[data-theme="dark"][data-accent="blue"] { --focus-ring: var(--accent-blue-focus-dark); }
:root[data-theme="dark"][data-accent="violet"] { --focus-ring: var(--accent-violet-focus-dark); }
:root[data-theme="dark"][data-accent="amber"] { --focus-ring: var(--accent-amber-focus-dark); }
:root[data-theme="dark"][data-accent="rose"] { --focus-ring: var(--accent-rose-focus-dark); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) { color-scheme: dark; --background: var(--slate-950); --surface: var(--slate-900); --panel: var(--slate-900); --surface-subtle: var(--slate-700); --border: var(--slate-700); --border-strong: var(--slate-500); --text-primary: var(--slate-50); --text-muted: var(--slate-200); --success: var(--green-100); --success-surface: var(--green-800); --warning: var(--amber-100); --warning-surface: var(--amber-800); --danger: var(--red-100); --danger-surface: var(--red-800); --danger-foreground: var(--red-100); --neutral: var(--slate-50); --neutral-surface: var(--slate-700); --focus-ring: var(--accent-teal-focus-dark); --shadow-sm: 0 1px 2px rgb(0 0 0 / .35); --shadow-md: 0 8px 24px rgb(0 0 0 / .45); }
  :root:not([data-theme])[data-accent="teal"] { --focus-ring: var(--accent-teal-focus-dark); }
  :root:not([data-theme])[data-accent="blue"] { --focus-ring: var(--accent-blue-focus-dark); }
  :root:not([data-theme])[data-accent="violet"] { --focus-ring: var(--accent-violet-focus-dark); }
  :root:not([data-theme])[data-accent="amber"] { --focus-ring: var(--accent-amber-focus-dark); }
  :root:not([data-theme])[data-accent="rose"] { --focus-ring: var(--accent-rose-focus-dark); }
}
/* END DESIGN TOKENS */

* { box-sizing: border-box; }
html { background: var(--background); color: var(--text-primary); }
body { margin: var(--space-0); min-height: 100vh; background: var(--background); color: var(--text-primary); font-size: var(--font-md); line-height: var(--line-normal); }
a { color: var(--primary); }
h1, h2, h3, p { margin-top: var(--space-0); }
h1 { margin-bottom: var(--space-2); font-size: var(--font-3xl); line-height: var(--line-tight); }
h2 { margin-bottom: var(--space-4); font-size: var(--font-2xl); line-height: var(--line-tight); }
h3 { margin-bottom: var(--space-2); font-size: var(--font-lg); line-height: var(--line-tight); }
p { margin-bottom: var(--space-3); }
button, input, select, textarea { font: inherit; }
[hidden] { display: none !important; }
.roots[hidden] { display: none; }
.skip-link { position: fixed; z-index: 10; top: var(--space-2); left: var(--space-2); padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); background: var(--primary); color: var(--primary-foreground); transform: translateY(-200%); }
.skip-link:focus { transform: translateY(0); }
.app-header { position: sticky; z-index: 5; top: var(--space-0); border-bottom: var(--border-width) solid var(--border); background: var(--surface); box-shadow: var(--shadow-sm); }
.app-nav { display: flex; max-width: var(--content-width); min-height: var(--control-height); margin: auto; padding: var(--space-3) var(--space-6); align-items: center; justify-content: space-between; gap: var(--space-4); }
.brand { display: inline-flex; align-items: center; gap: var(--space-3); color: var(--text-primary); font-weight: var(--weight-bold); text-decoration: none; }
.brand-mark { display: grid; width: var(--control-height); height: var(--control-height); border-radius: var(--radius-md); place-items: center; background: var(--primary); color: var(--primary-foreground); }
.nav-actions { display: flex; align-items: center; gap: var(--space-3); }
.nav-actions form { margin: var(--space-0); }
.account-name { color: var(--text-muted); font-size: var(--font-sm); }
.icon-button { display: grid; width: var(--control-height); height: var(--control-height); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); place-items: center; background: var(--surface); color: var(--text-primary); transition: border-color var(--transition-fast), color var(--transition-fast); }
.icon-button:hover { border-color: var(--primary); color: var(--primary); }
.icon-button svg { width: var(--icon-size); height: var(--icon-size); fill: currentColor; }
.notification-menu { position: relative; }
.notification-menu > summary { list-style: none; cursor: pointer; }
.notification-menu > summary::-webkit-details-marker { display: none; }
.notification-button { position: relative; }
.notification-badge { position: absolute; top: calc(var(--space-1) * -1); right: calc(var(--space-1) * -1); display: grid; min-width: var(--space-5); height: var(--space-5); padding: 0 var(--space-1); border: 2px solid var(--surface); border-radius: 999px; place-items: center; background: var(--danger); color: var(--danger-foreground); font-size: var(--font-xs); font-weight: var(--weight-bold); }
.notification-panel { position: absolute; z-index: 8; top: calc(100% + var(--space-2)); right: 0; width: min(26rem, calc(100vw - var(--space-6))); padding: var(--space-4); border: var(--border-width) solid var(--border); border-radius: var(--radius-lg); background: var(--panel); box-shadow: var(--shadow-lg); }
.notification-panel-heading { display: flex; margin-bottom: var(--space-3); align-items: baseline; justify-content: space-between; gap: var(--space-3); }
.notification-panel-heading span, .notification-panel small { color: var(--text-muted); font-size: var(--font-xs); }
.notification-panel ul { display: grid; margin: 0; padding: 0; gap: var(--space-2); list-style: none; }
.notification-panel li a { display: flex; padding: var(--space-3); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); align-items: start; justify-content: space-between; gap: var(--space-3); color: inherit; text-decoration: none; }
.notification-panel li a:hover { border-color: var(--primary); }
.notification-panel li a > span:first-child { display: grid; min-width: 0; gap: var(--space-1); }
.notification-panel li strong, .notification-panel li small { overflow-wrap: anywhere; }
.notification-more { display: inline-block; margin-top: var(--space-3); }
.notification-empty { margin: 0; color: var(--text-muted); }
.page-container { width: 100%; max-width: var(--content-width); margin: auto; padding: var(--space-8) var(--space-6) var(--space-12); }
.page-heading { display: flex; margin-bottom: var(--space-8); align-items: end; justify-content: space-between; gap: var(--space-4); }
.page-section { margin-top: var(--space-10); }
.section-heading, .card-heading { display: flex; min-width: var(--space-0); flex-wrap: wrap; align-items: start; justify-content: space-between; gap: var(--space-3); }
.section-heading > *, .card-heading > *, .capability-identity { min-width: var(--space-0); }
.section-heading { margin-bottom: var(--space-4); align-items: center; }
.section-heading h2, .card-heading h3 { margin-bottom: var(--space-0); }
.eyebrow { margin-bottom: var(--space-2); color: var(--primary); font-size: var(--font-xs); font-weight: var(--weight-bold); letter-spacing: var(--space-1); text-transform: uppercase; }
.muted, .metadata, .field-help { color: var(--text-muted); }
.metadata { margin: var(--space-2) var(--space-0) var(--space-0); font-size: var(--font-sm); }
.stack-sm > * { margin-bottom: var(--space-2); }
.panel, .card, .chart-frame { border: var(--border-width) solid var(--border); border-radius: var(--radius-lg); background: var(--panel); box-shadow: var(--shadow-sm); }
.panel { padding: var(--space-6); }
.panel-heading { margin-bottom: var(--space-6); }
.card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: var(--space-4); }
.card { padding: var(--space-5); color: inherit; text-decoration: none; }
.card-interactive { transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast); }
.card-interactive:hover { border-color: var(--primary); box-shadow: var(--shadow-md); transform: translateY(calc(var(--space-1) * -1)); }
.check-card.is-stale { border-color: var(--warning); }
.grid-span { grid-column: 1 / -1; }
.root-cause-grid { display: grid; gap: var(--space-3); }
.root-cause-card { padding: var(--space-4); border: var(--border-width) solid var(--border); border-left: var(--space-1) solid var(--warning); border-radius: var(--radius-md); background: var(--panel); }
.root-cause-card[data-classification="operational_fault"] { border-left-color: var(--danger); }
.root-cause-heading { display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between; gap: var(--space-3); }
.root-cause-heading h3 { margin: 0; }
.root-cause-facts { display: flex; flex-wrap: wrap; margin-top: var(--space-2); gap: var(--space-2) var(--space-4); color: var(--text-muted); font-size: var(--font-sm); }
.root-cause-action { margin: var(--space-3) 0 0; }
.root-cause-technical { margin-top: var(--space-3); }
.button { display: inline-flex; min-height: var(--control-height); padding: var(--space-2) var(--space-4); border: var(--border-width) solid var(--transparent); border-radius: var(--radius-md); align-items: center; justify-content: center; gap: var(--space-2); cursor: pointer; font-weight: var(--weight-medium); text-decoration: none; transition: background var(--transition-fast), border-color var(--transition-fast); }
.button-primary { border-color: var(--primary); background: var(--primary); color: var(--primary-foreground); box-shadow: var(--shadow-sm); font-weight: var(--weight-bold); }
.button-primary:hover { border-color: var(--primary-hover); background: var(--primary-hover); box-shadow: var(--shadow-md); }
.button:disabled, .button[aria-disabled="true"] { cursor: not-allowed; opacity: .5; }
.button-secondary { border-color: var(--border); background: var(--surface); color: var(--text-primary); }
.button-secondary:hover { border-color: var(--primary); }
.button-compact { min-height: auto; padding: var(--space-2) var(--space-3); font-size: var(--font-sm); }
.form-stack { display: grid; gap: var(--space-4); }
.form-stack > label, .form-stack fieldset { display: grid; margin: var(--space-0); gap: var(--space-2); font-weight: var(--weight-medium); }
.form-stack fieldset { padding: var(--space-4); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(var(--space-0), 1fr)); gap: var(--space-4); }
/* Choice labels must override the stacked text-field label layout. */
.check-row, .form-stack > label.check-row { display: flex; align-items: flex-start; gap: var(--space-2); font-weight: normal; }
.check-row > input:is([type="radio"], [type="checkbox"]) { flex: 0 0 auto; margin: .25em 0 0; }
.check-row > span { min-width: 0; overflow-wrap: anywhere; }
.onboarding-page { margin-top: var(--space-0); }
.onboarding-heading { margin-bottom: var(--space-5); }
.onboarding-layout { display: grid; min-width: var(--space-0); grid-template-columns: minmax(13rem, 17rem) minmax(var(--space-0), 1fr); align-items: start; gap: var(--space-8); }
.onboarding-sidebar { position: sticky; top: calc(var(--control-height) + var(--space-8)); min-width: var(--space-0); }
.onboarding-workspace { min-width: var(--space-0); }
.wizard-steps { display: grid; margin: var(--space-0); padding: var(--space-2); border: var(--border-width) solid var(--border); border-radius: var(--radius-lg); background: var(--panel); box-shadow: var(--shadow-sm); gap: var(--space-1); list-style: none; }
.wizard-steps li { border-left: var(--focus-width) solid var(--transparent); border-radius: var(--radius-md); color: var(--text-muted); font-size: var(--font-sm); }
.wizard-steps li.is-current { border-left-color: var(--primary); background: var(--surface-subtle); color: var(--primary); font-weight: var(--weight-bold); }
.wizard-steps li.is-complete { border-left-color: var(--success); color: var(--success); }
.wizard-steps form { margin: var(--space-0); }
.wizard-step-label, .wizard-step-button { display: flex; width: 100%; padding: var(--space-3); border: var(--space-0); align-items: center; background: transparent; color: inherit; gap: var(--space-3); text-align: left; font: inherit; }
.wizard-step-button { cursor: pointer; font-weight: var(--weight-bold); }
.wizard-step-button:hover, .wizard-step-button:focus-visible { background: var(--surface-subtle); text-decoration: none; }
.wizard-step-label[aria-disabled="true"] { opacity: .65; }
.wizard-step-number { display: grid; width: var(--state-icon-size); height: var(--state-icon-size); flex: 0 0 auto; border: var(--border-width) solid currentColor; border-radius: var(--radius-round); place-items: center; font-weight: var(--weight-bold); }
.onboarding-draft-note { margin-top: var(--space-4); padding: var(--space-3); color: var(--text-muted); font-size: var(--font-sm); }
.optional-section { border: var(--border-width) solid var(--border); border-radius: var(--radius-md); background: var(--surface-subtle); }
.optional-section > summary, .context-help > summary { padding: var(--space-3) var(--space-4); cursor: pointer; font-weight: var(--weight-bold); }
.optional-section-body, .context-help-body { padding: var(--space-0) var(--space-4) var(--space-4); }
.compact-textarea { min-height: calc(var(--control-height) * 2); }
.category-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(var(--space-0), 1fr)); gap: var(--space-3); }
.category-choice-grid .check-row { padding: var(--space-3); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); background: var(--surface); }
.category-choice-grid small { display: block; color: var(--text-muted); }
.relationship-group { display: grid; padding: var(--space-4) var(--space-0); grid-template-columns: minmax(9rem, 1fr) minmax(14rem, 2fr); border-bottom: var(--border-width) solid var(--border); gap: var(--space-5); }
.relationship-group h3 { margin-bottom: var(--space-0); }
.relationship-group .eyebrow { margin-bottom: var(--space-1); }
.relationship-picker { padding: var(--space-4); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); background: var(--surface-subtle); }
.relationship-picker-heading h3, .advanced-relationship h3 { margin-bottom: var(--space-1); }
.relationship-picker-heading .eyebrow { margin-bottom: var(--space-1); }
.selected-assets { display: flex; flex-wrap: wrap; margin: var(--space-3) var(--space-0); gap: var(--space-2); }
.selected-asset { display: inline-flex; padding: var(--space-2) var(--space-3); border: var(--border-width) solid var(--success); border-radius: var(--radius-round); align-items: center; gap: var(--space-2); background: var(--success-surface); color: var(--success); }
.selected-asset small { color: inherit; }
.empty-selection { color: var(--text-muted); font-size: var(--font-sm); }
.asset-picker { margin-top: var(--space-3); }
.asset-picker > summary { width: fit-content; color: var(--primary); cursor: pointer; font-weight: var(--weight-bold); }
.asset-picker-panel { display: grid; max-height: calc(var(--control-height) * 8); margin-top: var(--space-3); padding: var(--space-4); overflow-y: auto; border: var(--border-width) solid var(--border); border-radius: var(--radius-md); background: var(--surface); gap: var(--space-2); }
.asset-candidate { display: flex; padding: var(--space-3); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); align-items: flex-start; gap: var(--space-2); cursor: pointer; }
.asset-candidate:has(input:checked) { border-color: var(--primary); background: var(--surface-subtle); }
.asset-candidate span, .asset-candidate small { display: block; }
.asset-candidate small { color: var(--text-muted); }
.connection-result { display: flex; padding: var(--space-4); border: var(--border-width) solid currentColor; border-radius: var(--radius-md); flex-direction: column; gap: var(--space-1); }
.connection-result-success { background: var(--success-surface); color: var(--success); }
.provisioning-plan { padding: var(--space-4); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); background: var(--surface-subtle); }
.fingerprint { overflow-wrap: anywhere; font-family: var(--font-mono); font-size: var(--font-sm); }
.session-warning { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.session-warning p { margin-bottom: var(--space-0); }
.session-warning.is-urgent { background: var(--danger-surface); color: var(--danger); }
.choice-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.back-form { margin-top: var(--space-4); }
.form-error { margin-bottom: var(--space-4); padding: var(--space-4); border: var(--border-width) solid var(--danger); border-radius: var(--radius-md); background: var(--danger-surface); color: var(--danger); }
.detail-list { display: grid; margin: var(--space-0) var(--space-0) var(--space-5); gap: var(--space-0); }
.detail-list div { display: grid; padding: var(--space-3) var(--space-0); grid-template-columns: minmax(10rem, 1fr) 2fr; border-bottom: var(--border-width) solid var(--border); gap: var(--space-4); }
.detail-list dt { font-weight: var(--weight-bold); }
.detail-list dd { margin: var(--space-0); }
.confirmation-row { margin-bottom: var(--space-4); padding: var(--space-4); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); background: var(--surface-subtle); }
.page-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-bottom: var(--space-4); justify-content: flex-end; }
.new-record-fields { display: grid; gap: var(--space-4); }
.new-record-fields[hidden] { display: none; }
.new-record-fields > label { display: grid; gap: var(--space-2); }
.wizard-step-button:disabled { opacity: .5; cursor: not-allowed; }
.narrow-section { max-width: var(--dialog-width); margin-right: auto; margin-left: auto; }
.field { display: grid; gap: var(--space-2); font-weight: var(--weight-medium); }
input:not([type="radio"]):not([type="checkbox"]), select, textarea { width: 100%; min-height: var(--control-height); padding: var(--space-2) var(--space-3); border: var(--border-width) solid var(--border-strong); border-radius: var(--radius-md); background: var(--surface); color: var(--text-primary); }
textarea { min-height: calc(var(--control-height) * 3); resize: vertical; }
input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible, a:focus-visible, summary:focus-visible { outline: var(--focus-width) solid var(--focus-ring); outline-offset: var(--space-1); }
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"], .field-error input { border-color: var(--danger); }
.validation-message { color: var(--danger); font-size: var(--font-sm); }
.form-group { margin: var(--space-0); padding: var(--space-0); border: var(--space-0); }
.form-divider { margin: var(--space-8) var(--space-0); border-top: var(--border-width) solid var(--border); }
.form-group legend { padding: var(--space-0); font-size: var(--font-xl); font-weight: var(--weight-bold); }
.field-help { margin: var(--space-2) var(--space-0) var(--space-4); font-size: var(--font-sm); }
.form-actions { display: flex; margin-top: var(--space-8); padding-top: var(--space-5); border-top: var(--border-width) solid var(--border); gap: var(--space-3); }
.inline-review-action { margin-top: var(--space-2); }
.choice-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3); }
.choice-card, .accent-choice { display: flex; padding: var(--space-4); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); align-items: center; gap: var(--space-3); cursor: pointer; background: var(--surface-subtle); }
.choice-card:has(input:checked), .accent-choice:has(input:checked) { border-color: var(--primary); background: var(--surface); box-shadow: 0 0 0 calc(var(--border-width) * 2) var(--primary); font-weight: var(--weight-bold); }
.choice-card small { display: block; margin-top: var(--space-1); color: var(--text-muted); }
.accent-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--space-3); }
.accent-choice { justify-content: flex-start; text-align: left; }
.accent-swatch { width: var(--state-icon-size); height: var(--state-icon-size); border-radius: var(--radius-round); background: var(--choice-accent); }
.accent-teal { --choice-accent: var(--accent-teal-background); } .accent-blue { --choice-accent: var(--accent-blue-background); } .accent-violet { --choice-accent: var(--accent-violet-background); } .accent-amber { --choice-accent: var(--accent-amber-background); } .accent-rose { --choice-accent: var(--accent-rose-background); }
.status-badge { display: inline-flex; max-width: 100%; padding: var(--space-1) var(--space-2); border-radius: var(--radius-round); align-items: center; justify-content: center; overflow-wrap: anywhere; font-size: var(--font-xs); font-weight: var(--weight-bold); text-align: center; white-space: normal; }
.status-neutral { background: var(--neutral-surface); color: var(--neutral); } .status-success { background: var(--success-surface); color: var(--success); } .status-warning { background: var(--warning-surface); color: var(--warning); } .status-danger { background: var(--danger-surface); color: var(--danger); }
.alert { margin-bottom: var(--space-5); padding: var(--space-4); border: var(--border-width) solid currentColor; border-radius: var(--radius-md); }
.alert h2 { font-size: var(--font-lg); }
.alert-success { background: var(--success-surface); color: var(--success); } .alert-warning { background: var(--warning-surface); color: var(--warning); } .alert-danger { background: var(--danger-surface); color: var(--danger); } .alert-info { background: var(--neutral-surface); color: var(--neutral); }
.table-container { overflow-x: auto; border: var(--border-width) solid var(--border); border-radius: var(--radius-lg); }
table { width: 100%; border-collapse: collapse; background: var(--surface); }
th, td { padding: var(--space-3) var(--space-4); border-bottom: var(--border-width) solid var(--border); text-align: left; }
th { background: var(--surface-subtle); color: var(--text-muted); font-size: var(--font-sm); }
tr:last-child td { border-bottom: var(--space-0); }
.dialog-backdrop { position: fixed; z-index: 20; inset: var(--space-0); display: grid; padding: var(--space-4); place-items: center; background: color-mix(in srgb, var(--slate-950) 70%, var(--transparent)); }
.dialog { width: min(100%, var(--dialog-width)); padding: var(--space-6); border: var(--border-width) solid var(--border); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-md); }
.chart-frame { min-height: calc(var(--control-height) * 6); padding: var(--space-5); }
.empty-state, .error-state, .loading-state { display: grid; padding: var(--space-8); place-items: center; text-align: center; color: var(--text-muted); }
.empty-state { border: var(--border-width) dashed var(--border-strong); border-radius: var(--radius-lg); background: var(--surface); }
.empty-state p { margin-bottom: var(--space-0); }
.state-icon { display: grid; width: var(--state-icon-size); height: var(--state-icon-size); margin-bottom: var(--space-3); border-radius: var(--radius-round); place-items: center; background: var(--surface-subtle); color: var(--primary); font-weight: var(--weight-bold); }
.error-state { color: var(--danger); } .error-state span { color: var(--danger-foreground); }
.poll-error { display: none; margin-top: var(--space-4); padding: var(--space-4); border: var(--border-width) solid var(--danger); border-radius: var(--radius-md); background: var(--danger-surface); }
.poll-error.is-visible { display: grid; }
.loading-state { min-height: calc(var(--control-height) * 4); gap: var(--space-3); }
.spinner { width: var(--spinner-size); height: var(--spinner-size); border: var(--spinner-width) solid var(--border); border-top-color: var(--primary); border-radius: var(--radius-round); animation: spin 700ms linear infinite; }
@keyframes spin { to { transform: rotate(1turn); } }
.auth-layout { display: grid; min-height: calc(100vh - (var(--control-height) + var(--space-6))); padding: var(--space-8) var(--space-0); place-items: start center; }
.auth-panel { width: min(100%, var(--auth-width)); margin-top: var(--space-10); }
.settings-form { max-width: var(--content-width); }
.settings-workspace { display: grid; min-width: var(--space-0); grid-template-columns: minmax(12rem, 15rem) minmax(var(--space-0), 1fr); align-items: start; gap: var(--space-8); }
.settings-sidebar { position: sticky; top: calc(var(--control-height) + var(--space-8)); min-width: var(--space-0); }
.settings-navigation { display: grid; padding: var(--space-2); border: var(--border-width) solid var(--border); border-radius: var(--radius-lg); background: var(--panel); box-shadow: var(--shadow-sm); gap: var(--space-1); }
.settings-navigation a { display: flex; min-width: var(--space-0); padding: var(--space-3); align-items: center; border-left: var(--focus-width) solid var(--transparent); border-radius: var(--radius-md); color: var(--text-primary); gap: var(--space-3); overflow-wrap: anywhere; text-decoration: none; }
.settings-navigation a:hover, .settings-navigation a.is-selected { border-left-color: var(--primary); background: var(--surface-subtle); color: var(--primary); }
.settings-navigation a.is-selected { font-weight: var(--weight-bold); }
.settings-main { min-width: var(--space-0); }
.settings-category-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); }
.settings-category-card { display: flex; min-width: var(--space-0); align-items: center; gap: var(--space-4); }
.settings-category-card > span:last-child { min-width: var(--space-0); }
.settings-category-card strong, .settings-category-card small { display: block; }
.settings-category-card small { margin-top: var(--space-1); color: var(--text-muted); }
.settings-category-icon { display: grid; width: var(--state-icon-size); height: var(--state-icon-size); flex: 0 0 auto; border-radius: var(--radius-md); place-items: center; background: var(--primary); color: var(--primary-foreground); font-weight: var(--weight-bold); }
.dashboard-composition-list { display: grid; margin: var(--space-0); padding: var(--space-0); gap: var(--space-3); list-style: none; }
.dashboard-composition-row { display: grid; min-width: var(--space-0); padding: var(--space-4); grid-template-columns: auto minmax(12rem, 1fr) minmax(9rem, auto) auto; align-items: center; border: var(--border-width) solid var(--border); border-radius: var(--radius-md); background: var(--surface-subtle); gap: var(--space-3) var(--space-4); }
.dashboard-composition-row.is-dragging { border-color: var(--primary); box-shadow: var(--shadow-md); opacity: .7; }
.dashboard-drag-handle { display: grid; width: var(--control-height); height: var(--control-height); padding: var(--space-0); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); place-items: center; background: var(--surface); color: var(--text-muted); cursor: grab; }
.dashboard-drag-handle:active { cursor: grabbing; }
.dashboard-section-identity { min-width: var(--space-0); }
.dashboard-section-identity strong { overflow-wrap: anywhere; }
.dashboard-section-identity p { margin: var(--space-1) var(--space-0) var(--space-0); color: var(--text-muted); font-size: var(--font-sm); overflow-wrap: anywhere; }
.dashboard-visibility, .dashboard-visibility-policy { align-self: center; justify-self: start; }
.dashboard-visibility { display: inline-flex; align-items: center; gap: var(--space-2); font-weight: var(--weight-medium); }
.dashboard-move-controls { display: flex; flex-wrap: wrap; justify-content: end; gap: var(--space-2); }
.dashboard-move-controls .button:disabled { cursor: not-allowed; opacity: .5; }
.inventory-layout { display: grid; min-width: var(--space-0); grid-template-columns: var(--inventory-tree-width) minmax(var(--space-0), 1fr); gap: var(--space-8); }
.inventory-sidebar, .inventory-workspace { min-width: var(--space-0); }
.asset-tabs { display: flex; margin-bottom: var(--space-5); padding: var(--space-1); overflow-x: auto; border: var(--border-width) solid var(--border); border-radius: var(--radius-lg); background: var(--panel); gap: var(--space-1); }
.asset-tabs a { flex: 0 0 auto; padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); color: var(--text-primary); text-decoration: none; }
.asset-tabs a:hover, .asset-tabs a.is-selected { background: var(--surface-subtle); color: var(--primary); }
.asset-tabs a.is-selected { box-shadow: inset 0 calc(var(--border-width) * -2) 0 var(--primary); font-weight: var(--weight-bold); }
.monitoring-toolbar { display: flex; margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); align-items: center; gap: var(--space-4); }
.monitoring-toolbar form { margin: var(--space-0); }
.auto-refresh-control { display: inline-flex; align-items: center; gap: var(--space-2); font-weight: var(--weight-medium); }
.monitoring-freshness { display: grid; justify-items: end; gap: var(--space-1); }
.monitoring-graph-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); gap: var(--space-4); }
.telemetry-graph { min-width: var(--space-0); }
.telemetry-series + .telemetry-series { margin-top: var(--space-4); padding-top: var(--space-3); border-top: var(--border-width) solid var(--border); }
.telemetry-series-heading { display: flex; align-items: start; justify-content: space-between; gap: var(--space-3); font-size: var(--font-sm); }
.telemetry-series-heading span { color: var(--text-muted); text-align: right; }
.telemetry-series svg { width: 100%; height: 5rem; margin-top: var(--space-2); border-bottom: var(--border-width) solid var(--border); background: var(--surface-subtle); }
.telemetry-series polyline { fill: none; stroke: var(--primary); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.inventory-tree-disclosure { display: none; }
.inventory-tree-panel { position: sticky; top: calc(var(--control-height) + var(--space-8)); max-height: calc(100vh - (var(--control-height) + var(--space-12))); padding: var(--space-4); overflow-x: hidden; overflow-y: auto; border: var(--border-width) solid var(--border); border-radius: var(--radius-lg); background: var(--panel); box-shadow: var(--shadow-sm); }
.inventory-tree-section, .inventory-tree-node { display: grid; padding: var(--space-2) var(--space-3); border-left: var(--focus-width) solid var(--transparent); border-radius: var(--radius-sm); color: var(--text-primary); text-decoration: none; }
.inventory-tree-section { font-weight: var(--weight-bold); }
.inventory-tree-node:hover, .inventory-tree-section:hover { background: var(--surface-subtle); color: var(--primary); }
.inventory-tree-node.is-selected, .inventory-tree-section.is-selected { border-left-color: var(--primary); background: var(--surface-subtle); color: var(--primary); font-weight: var(--weight-bold); }
.inventory-tree-heading { margin: var(--space-5) var(--space-0) var(--space-2); color: var(--text-muted); font-size: var(--font-xs); letter-spacing: var(--space-1); text-transform: uppercase; }
.inventory-tree-heading .inventory-tree-section { margin: calc(var(--space-2) * -1) var(--space-0); color: inherit; }
.inventory-tree-list { margin: var(--space-0); padding-left: var(--space-3); list-style: none; }
.inventory-tree-panel > .inventory-tree-list { padding-left: var(--space-0); }
.inventory-tree-branch > summary { cursor: pointer; color: var(--primary); }
.inventory-tree-branch > summary::marker { color: var(--primary); }
.inventory-tree-meta, .inventory-tree-empty { color: var(--text-muted); font-size: var(--font-xs); font-weight: normal; }
.inventory-tree-empty { margin: var(--space-2) var(--space-3); }
.monitoring-region .empty-state { min-height: calc(var(--control-height) * 3); }
.monitoring-region { grid-column: 1 / -1; min-width: var(--space-0); }
.summary-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); }
.monitoring-capability-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 28rem), 1fr)); align-items: start; }
.device-monitoring-dashboard { grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); align-items: start; }
.monitoring-capability, .normalized-widget { min-width: var(--space-0); }
.monitoring-capability { max-width: 100%; padding: var(--space-4); overflow: hidden; }
.monitoring-capability:has(> .capability-complete[open]) { grid-column: 1 / -1; }
.capability-summary-heading { align-items: start; }
.capability-summary-heading .metric-context { margin: var(--space-1) var(--space-0) var(--space-0); }
.capability-primary-reading { display: grid; min-height: calc(var(--control-height) * 1.5); margin: var(--space-3) var(--space-0); align-content: center; }
.capability-primary-reading > span > strong { font-size: var(--font-xl); }
.capability-primary-reading .metric-reading { justify-items: start; text-align: left; }
.capability-primary-reading .metric-reading .status-badge { justify-self: start; }
.capability-history { margin-top: var(--space-3); }
.capability-history .telemetry-series svg { height: 4.5rem; }
.capability-secondary-context { margin-top: var(--space-3); }
.capability-complete { margin-top: var(--space-4); }
.capability-complete-body { min-width: var(--space-0); padding: var(--space-4); overflow: hidden; }
.capability-complete-body > :first-child { margin-top: var(--space-0); }
.capability-complete-body > :last-child { margin-bottom: var(--space-0); }
.capability-history-stats { margin-bottom: var(--space-4); }
.capability-history-stats small { display: block; margin-top: var(--space-1); color: var(--text-muted); }
.capability-technical-details { margin-top: var(--space-4); }
.monitoring-section-heading .field-help { margin-bottom: var(--space-0); }
.capability-state-summary { display: flex; margin-bottom: var(--space-3); flex-wrap: wrap; gap: var(--space-2); }
.capability-state-summary span { padding: var(--space-2) var(--space-3); border: var(--border-width) solid var(--border); border-radius: var(--radius-round); background: var(--surface-subtle); font-size: var(--font-sm); }
.context-help, .data-disclosure { min-width: var(--space-0); margin: var(--space-3) var(--space-0); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); background: var(--surface-subtle); }
.context-help > summary, .data-disclosure > summary { padding: var(--space-3) var(--space-4); color: var(--primary); cursor: pointer; font-weight: var(--weight-medium); overflow-wrap: anywhere; }
.context-help-body { padding: var(--space-0) var(--space-4) var(--space-4); color: var(--text-muted); font-size: var(--font-sm); }
.context-help-body > :last-child { margin-bottom: var(--space-0); }
.state-help-list { display: grid; margin-bottom: var(--space-0); gap: var(--space-2); }
.state-help-list div { display: grid; grid-template-columns: minmax(calc(var(--control-height) * 3), auto) minmax(var(--space-0), 1fr); gap: var(--space-3); }
.state-help-list dt { font-weight: var(--weight-bold); }
.state-help-list dd { margin: var(--space-0); }
.binding-list, .unavailable-capability-list { display: grid; margin: var(--space-0); padding: var(--space-0); gap: var(--space-2); list-style: none; }
.binding-list li { min-width: var(--space-0); padding: var(--space-3); border-radius: var(--radius-md); background: var(--surface-subtle); }
.identifier, .metric-identity, .metric-value { min-width: var(--space-0); overflow-wrap: anywhere; word-break: break-word; }
.normalized-widget { margin-top: var(--space-4); padding: var(--space-4); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); background: var(--surface-subtle); }
.monitoring-capability .normalized-widget { margin-top: var(--space-3); padding: var(--space-3); }
.monitoring-capability .metric-list li { grid-template-columns: minmax(var(--space-0), 1fr) minmax(var(--space-0), 1fr); }
.monitoring-capability .metric-identity strong { overflow-wrap: break-word; word-break: normal; }
.metric-reading { display: grid; justify-items: end; gap: var(--space-1); }
.metric-reading > strong { color: var(--text-primary); font-size: var(--font-lg); }
.metric-reading .status-badge { justify-self: end; }
.capability-binding-disclosure .binding-list { padding: var(--space-3); }
.widget-heading { display: flex; min-width: var(--space-0); flex-wrap: wrap; align-items: start; justify-content: space-between; gap: var(--space-3); }
.widget-heading h4 { margin: var(--space-0); font-size: var(--font-lg); }
.widget-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, calc(var(--control-height) * 3)), 1fr)); gap: var(--space-2); }
.widget-stat-grid div { min-width: var(--space-0); padding: var(--space-3); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); background: var(--surface); }
.widget-stat-grid strong, .widget-stat-grid span { display: block; }
.widget-stat-grid strong { font-size: var(--font-xl); }
.widget-stat-grid span { color: var(--text-muted); font-size: var(--font-xs); }
.data-disclosure[open] > summary { border-bottom: var(--border-width) solid var(--border); }
.data-disclosure > .metric-list, .data-disclosure > .table-container { margin: var(--space-4); }
.interface-table-container { width: 100%; max-width: 100%; margin-right: var(--space-0) !important; margin-left: var(--space-0) !important; overflow: hidden; }
.interface-counter-table { width: 100%; table-layout: fixed; }
.interface-counter-table th, .interface-counter-table td { vertical-align: top; overflow-wrap: anywhere; }
.monitoring-assignment { margin-top: var(--space-5); }
.unavailable-capabilities { margin-top: var(--space-5); }
.unavailable-capability-list { padding: var(--space-4); }
.unavailable-capability-list li { display: grid; min-width: var(--space-0); grid-template-columns: minmax(var(--space-0), 1fr) auto; padding: var(--space-3); border-bottom: var(--border-width) solid var(--border); gap: var(--space-2) var(--space-4); }
.unavailable-capability-list li:last-child { border-bottom: var(--space-0); }
.unavailable-capability-list p { grid-column: 1 / -1; margin-bottom: var(--space-0); }
.operations-group-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--inventory-tree-width)), 1fr)); }
.operations-check-disclosure > summary { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.operations-check-disclosure > summary small { display: block; color: var(--text-muted); font-weight: normal; }
.checks-detail-grid { padding: var(--space-4); }
.coverage-card-copy { margin-top: var(--space-3); }
.coverage-root-list { display: grid; margin-top: var(--space-4); border: var(--border-width) solid var(--border); border-radius: var(--radius-lg); overflow: hidden; }
.coverage-root { display: flex; min-width: var(--space-0); padding: var(--space-3) var(--space-4); align-items: center; justify-content: space-between; border-bottom: var(--border-width) solid var(--border); color: var(--text-primary); gap: var(--space-4); text-decoration: none; }
.coverage-root:last-child { border-bottom: var(--space-0); }
.coverage-root:hover { background: var(--surface-subtle); }
.coverage-root span:first-child { min-width: var(--space-0); overflow-wrap: anywhere; }
.coverage-root small { display: block; color: var(--text-muted); }
.topology-branch-grid { grid-template-columns: 1fr; }
.topology-branch-card { min-width: var(--space-0); }
.resource-grid { display: grid; margin-top: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: var(--space-3); }
.resource-group { min-width: var(--space-0); padding: var(--space-3); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); background: var(--surface-subtle); }
.resource-group:has(> .topology-resource-disclosure[open]) { grid-column: 1 / -1; }
.resource-group h4 { margin: var(--space-0); font-size: var(--font-sm); }
.resource-summary-heading, .resource-asset-heading { display: flex; min-width: var(--space-0); align-items: flex-start; justify-content: space-between; gap: var(--space-3); }
.resource-summary-heading h4, .resource-asset-heading a { min-width: var(--space-0); overflow-wrap: anywhere; }
.resource-summary-value { margin: var(--space-3) var(--space-0) var(--space-1); font-size: var(--font-sm); }
.topology-resource-disclosure { margin-top: var(--space-3); background: var(--surface); }
.topology-resource-detail { min-width: var(--space-0); padding: var(--space-4); }
.topology-resource-detail .normalized-widget { margin-top: var(--space-3); }
.topology-resource-detail .resource-asset { min-width: var(--space-0); }
.topology-resource-detail .metric-list li { grid-template-columns: minmax(12rem, 1fr) minmax(9rem, max-content); }
.topology-resource-detail .metric-context, .topology-resource-detail .metric-age { overflow-wrap: anywhere; }
.topology-unavailable-disclosure { margin-top: var(--space-4); }
.unavailable-resource-list { display: grid; margin: var(--space-0); padding: var(--space-4); gap: var(--space-3); list-style: none; }
.unavailable-resource-list li { display: grid; grid-template-columns: minmax(var(--space-0), 1fr) minmax(var(--space-0), 2fr); gap: var(--space-3); font-size: var(--font-sm); }
.unavailable-resource-list span { color: var(--text-muted); overflow-wrap: anywhere; }
.resource-asset + .resource-asset { margin-top: var(--space-3); padding-top: var(--space-3); border-top: var(--border-width) solid var(--border); }
.resource-asset > .metric-context { margin-bottom: var(--space-2); }
.resource-group .metric-list li { display: grid; }
.resource-group .metric-value { text-align: left; }
.resource-group .metric-value .status-badge { margin-left: var(--space-0); }
.metric-list { display: grid; margin: var(--space-0); padding: var(--space-0); gap: var(--space-2); list-style: none; }
.metric-list li { display: grid; min-width: var(--space-0); grid-template-columns: minmax(var(--space-0), 1fr) minmax(7rem, auto); align-items: start; justify-content: space-between; gap: var(--space-3); font-size: var(--font-sm); }
.metric-list li > span { min-width: var(--space-0); }
.metric-context, .metric-age { display: block; color: var(--text-muted); font-size: var(--font-xs); }
.metric-value { text-align: right; font-weight: var(--weight-medium); }
.metric-value .status-badge { display: flex; width: fit-content; margin-top: var(--space-1); margin-left: auto; }
.badge-row { display: flex; flex-wrap: wrap; justify-content: end; gap: var(--space-2); }
.state-counts { justify-content: start; }
.not-collected { margin-bottom: var(--space-0); color: var(--text-muted); font-size: var(--font-sm); }
@media (max-width: 720px) {
  .app-nav, .page-container { padding-right: var(--space-4); padding-left: var(--space-4); }
  .account-name, .brand span:last-child { display: none; }
  .page-heading { margin-bottom: var(--space-6); }
  .choice-grid { grid-template-columns: 1fr; }
  .accent-grid { grid-template-columns: repeat(2, 1fr); }
  .form-actions { flex-direction: column; }
  .button { width: 100%; }
  .onboarding-layout { grid-template-columns: 1fr; gap: var(--space-5); }
  .onboarding-sidebar { position: static; }
  .relationship-group { grid-template-columns: 1fr; gap: var(--space-3); }
  .category-choice-grid { grid-template-columns: 1fr; }
  .session-warning { align-items: stretch; flex-direction: column; }
  .settings-workspace { grid-template-columns: 1fr; gap: var(--space-5); }
  .settings-sidebar { position: static; }
  .settings-navigation { grid-template-columns: repeat(2, minmax(var(--space-0), 1fr)); }
  .settings-navigation a { justify-content: center; }
  .dashboard-composition-row { grid-template-columns: auto minmax(var(--space-0), 1fr); }
  .dashboard-visibility, .dashboard-visibility-policy, .dashboard-move-controls { grid-column: 1 / -1; }
  .dashboard-move-controls { display: grid; grid-template-columns: repeat(2, minmax(var(--space-0), 1fr)); }
  .inventory-layout { grid-template-columns: 1fr; gap: var(--space-5); }
  .monitoring-toolbar { align-items: stretch; flex-direction: column; }
  .monitoring-freshness { justify-items: start; }
  .inventory-tree-desktop { display: none; }
  .inventory-tree-disclosure { display: block; }
  .inventory-tree-toggle { padding: var(--space-3) var(--space-4); border: var(--border-width) solid var(--border); border-radius: var(--radius-md); background: var(--panel); color: var(--text-primary); cursor: pointer; font-weight: var(--weight-bold); }
  .inventory-tree-mobile { position: static; max-height: none; margin-top: var(--space-2); }
  .metric-list li, .monitoring-capability .metric-list li, .topology-resource-detail .metric-list li, .state-help-list div, .unavailable-capability-list li, .unavailable-resource-list li { grid-template-columns: 1fr; }
  .device-monitoring-dashboard { grid-template-columns: 1fr; }
  .capability-complete-body { padding-right: var(--space-2); padding-left: var(--space-2); }
  .interface-counter-table thead, .interface-counter-table .interface-secondary, .interface-counter-table .interface-technical { display: none; }
  .interface-counter-table, .interface-counter-table tbody, .interface-counter-table tr, .interface-counter-table th, .interface-counter-table td { display: block; width: 100%; }
  .interface-counter-table tr { padding: var(--space-3); border-bottom: var(--border-width) solid var(--border); }
  .interface-counter-table th, .interface-counter-table td { display: grid; grid-template-columns: minmax(var(--space-0), 1fr) minmax(var(--space-0), 1fr); padding: var(--space-1) var(--space-0); gap: var(--space-2); font-size: var(--font-sm); }
  .interface-counter-table th { font-size: var(--font-md); }
  .interface-counter-table td::before { content: attr(data-label); color: var(--text-muted); font-size: var(--font-xs); font-weight: var(--weight-medium); }
  .unavailable-capability-list p { grid-column: auto; }
  .metric-value { text-align: left; }
  .metric-value .status-badge { margin-left: var(--space-0); }
  .coverage-root, .operations-check-disclosure > summary { align-items: start; flex-direction: column; }
  .form-grid, .detail-list div { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }

/* Creation forms need room for labels and nested relationship selectors. */
.infrastructure-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr)); align-items: start; }

.update-notes { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; }