@font-face {
  font-display: swap;
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  src:
    url("/assets/static/fonts/roboto/Roboto-Regular.woff2") format("woff2"),
    url("/assets/static/fonts/roboto/Roboto-Regular.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: "Roboto Mono";
  font-style: normal;
  font-weight: 400;
  src: url("/assets/static/fonts/roboto/RobotoMono-Regular.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  src:
    url("/assets/static/fonts/roboto/Roboto-Medium.woff2") format("woff2"),
    url("/assets/static/fonts/roboto/Roboto-Medium.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  src:
    url("/assets/static/fonts/roboto/Roboto-Bold.woff2") format("woff2"),
    url("/assets/static/fonts/roboto/Roboto-Bold.ttf") format("truetype");
}
@font-face {
  /* Icon glyphs have no readable fallback: a brief invisible period
     beats a row of tofu, so this face alone keeps font-display: block. */
  font-display: block;
  font-family: "Material Design Icons";
  font-style: normal;
  font-weight: 400;
  src: url("/assets/static/fonts/materialdesignicons/materialdesignicons-webfont.woff2") format("woff2");
}
:root {
  color-scheme: light;
  --app-bg: #fafafa;
  --surface: #fff;
  --surface-muted: #f5f5f5;
  --text: #212121;
  --text-muted: #616161;
  --border: #e0e0e0;
  --border-strong: #9e9e9e;
  --tree-guide: #8c8c8c;
  /* The palette had no on-dark family, so every permanently dark surface -
     the header, the search overlay, the code block, the editor rail - had to
     invent one. That is where the pink close glyph and the lone focus blue
     came from: a screen can borrow --header-control-bg for a ground, but
     there was no role for an accent on top of it. These are the values those
     surfaces already used; they are theme-invariant because a dark chrome is
     dark in both themes. */
  --surface-inverted-strong: #000;
  --surface-inverted: #1e1e1e;
  --text-inverted: #fff;
  --text-inverted-muted: #c7c7c7;
  --accent-inverted: #8ac7f7;

  /* Reserved for intentionally light assets and legacy fixed-light surfaces.
     Editable fields and visual documents follow the selected theme. */
  --surface-fixed-light: #fff;
  --brand-logo-surface-fixed-light: var(--surface-fixed-light);
  --text-fixed-light: #212121;
  --text-fixed-light-muted: #616161;
  --accent-fixed-light: #0b5cab;

  /* Feedback tones for the permanently dark chrome. The on-dark family gave those
     surfaces an accent but no way to say "notice" or "error", so the search
     overlay borrowed the theme-following notice roles and its card swung between
     a cream slab at 15.64:1 in the light theme and 1.29:1 in the dark. These are
     the dark theme's own feedback values, pinned, so the card reads the same on a
     ground that is the same. The fill stays subtle on purpose - the border is what
     gives the card its shape, at 3.72:1. */
  --notice-inverted-bg: #3a310f;
  --notice-inverted-border: #8f7421;
  --notice-inverted-text: #ffe79b;
  --danger-inverted: #ff8a80;
  --danger-inverted-bg: color-mix(in srgb, var(--danger-inverted) 14%, var(--surface-inverted));
  --header: var(--surface-inverted-strong);
  --header-text: var(--text-inverted);
  --header-control-bg: var(--surface-inverted);
  --header-control-text: #fff;
  --header-control-muted: var(--text-inverted-muted);
  --shell-header-control-border: #90a4ae;
  --shell-mobile-navigation-focus: color-mix(in srgb, var(--accent) 60%, white);
  --shell-mobile-navigation-panel-shadow: 0 12px 32px rgb(0 0 0 / .28);
  --mfa-qr-invariant-canvas: #fff;
  --media-thumbnail-fixed-light: var(--surface-fixed-light);
  --danger-action-text: #fff;
  --accent: #1976d2;
  --accent-readable: #0b5cab;
  --tag-control-bg: var(--surface-muted);
  --tag-control-border: color-mix(in srgb, var(--text) 55%, var(--surface));
  --tag-control-text: var(--text);
  --tag-control-selected-bg: color-mix(in srgb, var(--accent) 15%, var(--surface));
  --tag-control-selected-border: var(--accent);
  --tag-control-selected-text: var(--accent-readable);
  --tag-label-bg: color-mix(in srgb, var(--accent) 10%, var(--surface));
  --tag-label-border: color-mix(in srgb, var(--accent) 28%, var(--border));
  --tag-label-text: var(--accent-readable);
  --tag-count-bg: var(--surface);
  --tag-count-text: var(--text-muted);
  --print-canvas: #fff;
  --print-text: #17202a;
  --print-muted-text: #53616b;
  --print-boundary: #767676;
  --history-diff-added-bg: #3f7555;
  --history-diff-added-text: #f5f7f8;
  --history-diff-deleted-bg: #975964;
  --history-diff-deleted-text: #f5f7f8;
  --empty-home-text: var(--text);
  --empty-home-action-bg: var(--accent);
  --empty-home-action-hover-bg: var(--accent-readable);
  --empty-home-action-text: var(--button-text);
  --empty-home-action-shadow: rgb(0 0 0 / .28);
  --empty-home-focus: var(--accent-readable);
  /* The picker previews the accent, so it has to preview the one that will be
     applied. These were the light values only, so an administrator working in
     the dark theme who chose amber was shown #b45309 - brown - while the site
     took #fbbf24. Both sets are the palette in internal/appearance, and a test
     there holds them to it. */
  --appearance-swatch-choice-1: #1976d2;
  --appearance-swatch-choice-2: #00796b;
  --appearance-swatch-choice-3: #7b1fa2;
  --appearance-swatch-choice-4: #b45309;
  --appearance-swatch-choice-5: #be123c;
  --search-panel-bg: var(--surface);
  --search-boundary: color-mix(in srgb, var(--text) 55%, var(--surface));
  --search-primary-text: var(--text);
  --search-secondary-text: var(--text-muted);
  --search-link: var(--accent-readable);
  --search-highlight-bg: color-mix(in srgb, var(--accent) 22%, var(--surface));
  --search-highlight-text: var(--text);
  --search-tag-bg: var(--tag-label-bg);
  --search-tag-border: var(--tag-label-border);
  --search-tag-text: var(--tag-label-text);
  --search-trigger-bg: var(--surface-muted);
  --search-trigger-border: color-mix(in srgb, var(--text) 55%, var(--surface));
  --search-trigger-text: var(--text);
  --search-overlay-backdrop: rgb(0 0 0 / .90);
  --search-overlay-chrome-bg: var(--header-control-bg);
  --search-overlay-chrome-edge: var(--shell-header-divider);
  --search-overlay-chrome-text: var(--header-text);
  --search-overlay-chrome-muted: var(--header-control-muted);
  --search-overlay-chrome-focus: var(--accent-inverted);
  --search-overlay-panel-bg: var(--surface);
  --search-overlay-result-bg: var(--surface);
  --search-overlay-result-selected-bg: color-mix(in srgb, var(--accent) 14%, var(--surface));
  --search-overlay-result-text: var(--text);
  /* Text on the overlay ground itself, which is dark in both themes. */
  --search-overlay-ground-text: var(--text-inverted);
  --search-overlay-result-path: var(--text-muted);
  --search-overlay-result-border: var(--search-boundary);
  --search-overlay-result-focus: var(--accent-readable);
  --search-overlay-empty-bg: var(--notice-inverted-bg);
  --search-overlay-empty-text: var(--notice-inverted-text);
  --search-overlay-error-bg: var(--danger-inverted-bg);
  --search-overlay-error-text: var(--danger-inverted);
  --search-overlay-error-border: var(--danger-inverted);
  --search-overlay-action: var(--accent-inverted);
  --button-text: #fff;
  --danger: #b71c1c;
  --success: #18733c;
  --notice-bg: #fff8db;
  --notice-border: #d69e2e;
  --notice-text: #5f4300;
  --code-bg: #191919;
  --code-text: #f5f7f8;
  --code-muted: #929292;
  --code-label-bg: color-mix(in srgb, var(--code-bg) 88%, white);
  --code-label-text: #c9d1d9;
  --code-syntax-comment: #8b949e;
  --code-syntax-keyword: #ff7b72;
  --code-syntax-string: #a5d6ff;
  --code-syntax-number: #79c0ff;
  --code-syntax-name: #d2a8ff;
  --code-syntax-variable: #ffa657;
  --code-syntax-error: #ffa198;
  --editor-toolbar-surface: var(--editor-accent-band, #1565c0);
  --editor-chrome-text: var(--text-inverted);
  --editor-heading-text: #eee;
  --editor-title-bg: var(--surface-inverted-strong);
  --editor-title-text: var(--text-inverted);
  --editor-saved-icon: #4caf50;
  --editor-page-icon: var(--editor-accent-icon, #2196f3);
  --editor-close-bg: #3c2020;
  --editor-close-text: #d8baba;
  --editor-close-icon: #f44336;
  --editor-close-generic-hover-bg: #4b2424;
  --editor-close-hover-bg: #3b2020;
  --editor-header-divider: #1e1e1e;
  --editor-header-icon: #9e9e9e;
  --editor-header-icon-hover-bg: #202020;
  --editor-header-icon-hover: #aaa;
  --editor-source-text: #e0e0e0;
  --editor-source-list: #6a9fb5;
  --editor-gutter-bg: #121212;
  --editor-rail-bg: #212121;
  --editor-rail-hover-bg: rgb(255 255 255 / .08);
  --editor-source-active-line: #212121;
  --editor-status-bg: #424242;
  --editor-status-text: #bdbdbd;
  --editor-status-locale-bg: rgb(255 255 255 / .25);
  --editor-status-locale-text: var(--text-inverted);
  --visual-markdown-notice-bg: var(--surface-muted);
  --visual-markdown-notice-boundary: var(--border-strong);
  --visual-markdown-notice-text: var(--text);
  --visual-markdown-surface-bg: var(--surface);
  --visual-markdown-focus: var(--accent);
  --editor-selection-accent: var(--editor-accent-ink, #0b5cab);
  --editor-selection-stage-bg: var(--app-bg);
  --editor-selection-panel-bg: var(--surface);
  --editor-selection-panel-text: var(--text);
  --editor-selection-card-bg: var(--surface);
  --editor-selection-card-muted-bg: var(--surface-muted);
  --editor-selection-card-unavailable-text: var(--editor-accent-ink, #0b5cab);
  --editor-selection-card-muted-text: var(--text-muted);
  --editor-selection-card-boundary: var(--text-muted);
  --editor-selection-focus: var(--accent);
  --editor-selection-icon-surface: var(--editor-accent-plate, #98ccfd);
  --editor-selection-icon-glyph: var(--editor-accent-ink, #0b5cab);
  --editor-selection-back-bg: #757575;
  --editor-selection-header-bg: var(--surface-inverted-strong);
  --editor-selection-header-muted: #9e9e9e;
  --editor-selection-panel-shadow: 0 11px 15px -7px rgb(0 0 0 / .2), 0 24px 38px 3px rgb(0 0 0 / .14), 0 9px 46px 8px rgb(0 0 0 / .12);
  --editor-elevation-raised-2: 0 3px 1px -2px rgb(0 0 0 / .2), 0 2px 2px 0 rgb(0 0 0 / .14), 0 1px 5px 0 rgb(0 0 0 / .12);
  --editor-properties-panel-shadow: 0 16px 42px rgb(0 0 0 / .4);
  --editor-properties-scrim: rgb(33 33 33 / .46);
  --editor-properties-trigger-open-bg: #303030;
  --page-location-scrim-bg: var(--editor-properties-scrim);
  --page-location-surface: var(--surface);
  --page-location-muted-surface: var(--surface-muted);
  --page-location-folder-surface: var(--surface-muted);
  --page-location-track: var(--border-strong);
  --page-location-hover: color-mix(in srgb, var(--text) 10%, var(--surface));
  --page-location-selected: color-mix(in srgb, var(--accent) 18%, var(--surface));
  --page-location-text: var(--text);
  --page-location-muted-text: var(--text-muted);
  --page-location-marker: var(--text-muted);
  --page-location-link: var(--accent-readable);
  --page-location-accent: var(--accent);
  --page-location-on-accent: var(--button-text);
  --page-location-dark-control: var(--header-control-bg);
  --page-location-dark-control-text: var(--header-control-text);
  --page-location-boundary: color-mix(in srgb, var(--text) 55%, var(--surface));
  --page-location-focus: var(--text);
  --page-location-focus-contrast: var(--surface);
  --page-location-shadow: rgb(0 0 0 / .32);
  --page-location-action-shadow: rgb(0 0 0 / .25);
  --auth-canvas: #252525;
  --auth-mobile-canvas: #eee;
  --auth-stage-base: #303030;
  --auth-stage-overlay: rgb(0 0 0 / .08);
  --auth-panel-shadow: 0 3px 8px rgb(0 0 0 / .36);
  --auth-side-shadow: 12px 0 30px rgb(0 0 0 / .18);
  --auth-field-shadow: 0 1px 2px rgb(0 0 0 / .08);
  --auth-action-shadow: 0 2px 4px rgb(0 0 0 / .28);
  --auth-hero-mark-start: #f5f5f5;
  --auth-registration-canvas: #1a237e;
  --auth-registration-heading: var(--navigation-strong);
  --auth-registration-footer: #151515;
  --auth-registration-footer-emphasis: #8ac7f7;
  --auth-field-surface: var(--surface);
  --problem-canvas-start: #16283f;
  --problem-canvas-middle: #24324a;
  --problem-canvas-end: #4b2f3a;
  --problem-surface: #24324a;
  --problem-surface-border: #90a4ae;
  --problem-surface-shadow: 0 24px 80px rgb(0 0 0 / .32);
  --problem-text: #fff;
  --problem-accent: #90caf9;
  --problem-muted: #c5ceda;
  --problem-boundary: #b0bec5;
  --problem-mark-boundary: #f5f5f5;
  --problem-action-hover: #334763;
  --problem-primary-bg: #90caf9;
  --problem-primary-hover: #bbdefb;
  --problem-primary-text: #102033;
  --problem-focus: #fff;
  --auth-field-text: var(--text);
  --auth-field-placeholder: var(--text-muted);
  --navigation-bg: #1976d2;
  --navigation-strong: #1565c0;
  --navigation-edge: #3486d7;
  --comment-header: #546e7a;
  --comment-body: #eceff1;
  --comment-body-text: #546e7a;
  --info-bg: #ede7f6;
  --info-text: #4527a0;
  --shell-header-icon: #90a4ae;
  --shell-header-divider: #1f1f1f;
  --shell-header-height: 4rem;
  --shell-sidebar-width: 15rem;
  --shell-sidebar-bg: var(--surface);
  --shell-sidebar-border: var(--border);
  --shell-sidebar-padding: .5rem;
  --shell-navigation-gap: 1px;
  --shell-navigation-radius: .375rem;
  --shell-navigation-item-height: 2.5rem;
  --shell-navigation-text: #424242;
  --shell-navigation-muted: #757575;
  --shell-navigation-hover-bg: #f6f6f6;
  /* The same formula the dark theme already uses. These were hardwired blue, so
     the active sidebar item obeyed the accent setting in one theme and ignored it
     in the other - the same control, two answers. Every accent lands between
     5.29:1 and 7.11:1 on the mix, against 7.35 for the blue that was pinned. */
  --shell-navigation-active-bg: color-mix(in srgb, var(--accent) 16%, transparent);
  --shell-navigation-active-text: var(--accent-readable);
  --shell-navigation-focus: var(--accent-readable);
  --shell-navigation-count-bg: var(--surface-muted);
  --shell-navigation-count-secondary-bg: var(--app-bg);
  --shell-navigation-count-text: #616161;
  --shell-footer-text: #616161;
  --shell-heading-muted: var(--text-muted);
  --shell-heading-accent: var(--accent-readable);
  --shell-card-border: var(--border);
  --profile-save-bg: #2e7d32;
  --profile-on-accent: #fff;
  --profile-focus: var(--accent-readable);
  --profile-card-shadow: 0 2px 3px rgb(0 0 0 / .12);
  --profile-card-heading-bg: #546e7a;
  --profile-groups-heading-bg: #1565c0;
  --profile-activity-heading-bg: #00796b;
  --profile-icon-muted: #757575;
  /* Muted here, but the dark themes below point this at var(--text), the full
     text colour. The values are preserved as they were; naming the roles makes
     the disagreement visible instead of hiding it behind two literals. */
  --profile-summary-muted: var(--text-muted);
  --admin-dashboard-mark-primary: #7c4dff;
  --admin-dashboard-mark-secondary: #d500f9;
  --admin-dashboard-mark-tertiary: #2979ff;
  --admin-dashboard-heading-eyebrow: #bdbdbd;
  --admin-dashboard-heading-summary: var(--text-muted);
  --admin-dashboard-on-accent: #fff;
  --admin-dashboard-card-shadow: 0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%);
  --admin-dashboard-badge-shadow: 0 2px 5px rgb(0 0 0 / 25%);
  --admin-dashboard-version-current-bg: #2e7d32;
  --admin-dashboard-version-current-text: #fff;
  --admin-dashboard-version-current-border: var(--admin-dashboard-version-current-bg);
  --admin-dashboard-version-unavailable-bg: var(--surface-muted);
  --admin-dashboard-version-unavailable-text: var(--text);
  --admin-dashboard-version-unavailable-border: var(--admin-dashboard-panel-boundary);
  --admin-dashboard-version-update-bg: var(--notice-bg);
  --admin-dashboard-version-update-text: var(--notice-text);
  --admin-dashboard-version-update-border: color-mix(in srgb, var(--notice-text) 65%, var(--surface));
  --admin-dashboard-panel-bg: var(--surface);
  --admin-dashboard-panel-boundary: color-mix(in srgb, var(--text) 55%, var(--surface));
  --admin-dashboard-panel-border: var(--admin-dashboard-panel-boundary);
  --admin-dashboard-panel-heading-bg: var(--surface);
  --admin-dashboard-panel-heading-text: var(--text);
  --admin-dashboard-panel-body-text: var(--text-muted);
  --admin-dashboard-session-text: var(--text);
  --admin-dashboard-session-time: var(--text-muted);
  --admin-dashboard-session-placeholder-bg: #8d8d8d;
  --admin-dashboard-link-hover-bg: var(--surface-muted);
  --admin-dashboard-link-focus: var(--accent-readable);
  --site-settings-surface: var(--surface);
  --site-settings-muted-surface: var(--surface-muted);
  --site-settings-text: var(--text);
  --site-settings-muted-text: var(--text-muted);
  --site-settings-tab-bg: var(--app-bg);
  --site-settings-boundary: color-mix(in srgb, var(--text) 55%, var(--surface));
  --site-settings-focus: var(--accent-readable);
  --site-settings-error-bg: var(--ui-error-bg);
  --site-settings-error-border: color-mix(in srgb, var(--danger) 65%, var(--surface));
  --site-settings-error-text: var(--danger);
  --security-settings-surface: var(--surface);
  --security-settings-muted-surface: var(--surface-muted);
  --security-settings-text: var(--text);
  --security-settings-muted-text: var(--text-muted);
  --security-settings-tab-bg: var(--app-bg);
  --security-settings-boundary: color-mix(in srgb, var(--text) 55%, var(--surface));
  --security-settings-focus: var(--accent-readable);
  --security-settings-link: var(--accent-readable);
  --security-settings-error-bg: var(--ui-error-bg);
  --security-settings-error-border: color-mix(in srgb, var(--danger) 65%, var(--surface));
  --security-settings-error-text: var(--danger);
  --security-settings-warning-bg: var(--notice-bg);
  --security-settings-warning-border: color-mix(in srgb, var(--notice-text) 65%, var(--surface));
  --security-settings-warning-text: var(--notice-text);
  --public-header-bg: var(--header);
  --public-header-control-bg: var(--header-control-bg);
  --public-header-control-text: var(--header-control-text);
  --public-header-control-muted: var(--header-control-muted);
  --public-header-icon: var(--border-strong);
  --public-on-navigation: var(--header-text);
  --public-navigation-hover-bg: rgb(255 255 255 / .14);
  --public-navigation-divider: rgb(255 255 255 / .12);
  --public-navigation-divider-subtle: rgb(255 255 255 / .08);
  --public-breadcrumb-mark: #607d8b;
  --public-action-bg: var(--navigation-bg);
  --public-action-text: var(--header-text);
  --public-toc-chevron: var(--border-strong);
  --public-discussion-border: #607d8b;
  --public-comment-input-border: var(--border-strong);
  --public-table-heading-bg: var(--surface-muted);
  --public-table-odd-even-bg: var(--surface-muted);
  --public-table-even-bg: var(--surface-muted);
  --public-card-shadow: 0 2px 3px rgb(0 0 0 / .15);
  --public-card-shadow-raised: 0 2px 1px -1px rgb(0 0 0 / .2), 0 1px 1px 0 rgb(0 0 0 / .14), 0 1px 3px 0 rgb(0 0 0 / .12);
  --public-fab-shadow: 0 3px 5px -1px rgb(0 0 0 / .2), 0 6px 10px rgb(0 0 0 / .14), 0 1px 18px rgb(0 0 0 / .12);
  --public-mobile-trigger-shadow: 0 3px 8px rgb(0 0 0 / .28);
  --public-mobile-scrim: rgb(0 0 0 / .4);
  --public-mobile-open-header: #191919;
  --public-mobile-panel-edge: #657d96;
  --public-mobile-panel-shadow: 1px 0 0 var(--public-mobile-panel-edge), 0 8px 10px -5px rgb(0 0 0 / .2), 0 16px 24px 2px rgb(0 0 0 / .14), 0 6px 30px 5px rgb(0 0 0 / .12);
  --public-mobile-toolbar-edge: #5a7896;
  --public-mobile-links-edge: #627a93;
  /* Transitional semantic aliases. Every var() reference must resolve while the
     UI is migrated onto the versioned design-system contract. */
  --surface-subtle: var(--surface-muted);
  --surface-strong: var(--header);
  --code-surface: var(--code-bg);
  --muted: var(--text-muted);
  --shadow: 0 .25rem .875rem rgb(15 23 42 / 12%);
  --warning: var(--notice-border);
  --ui-notice-bg: var(--notice-bg);
  --ui-notice-border: var(--notice-border);
  --ui-page-title-size: 1.75rem;
  --ui-empty-min-height: 4rem;
  --ui-empty-padding: 2rem 1rem;
  --ui-control-min-height: 2.875rem;
  --ui-control-padding: .625rem .75rem;
  --ui-control-radius: .375rem;
  --ui-data-cell-padding: .75rem .875rem;
  --ui-action-min-height: 2.75rem;
  /* The compact size the header, toolbar and in-row action strips need.
     Without it those rows mix the 2.75rem floor the base button rule sets
     against links and summaries that carry no floor at all. */
  --ui-action-min-height-sm: 2.25rem;
  --ui-action-padding: .6875rem 1.125rem;
  --ui-action-radius: .375rem;
  --ui-action-disabled-opacity: .56;
  --ui-action-padding-sm: .375rem .625rem;
  --ui-action-gap: var(--ui-space-8);
  --ui-action-focus: var(--accent-readable);
  --ui-action-focus-width: .1875rem;
  --ui-feedback-padding: .75rem .875rem;
  /* Not a scale yet - an inventory. The stylesheet holds 46 distinct font sizes
     and 51 distinct gaps, so naming eight of each and calling it a system would be
     a claim the file does not support. These are the values actually load-bearing,
     named so a screen can stop inventing its own; the gates count the distinct
     literals that remain, and that count may only fall. The scale is what is left
     when it stops falling. */
  --ui-text-10: 10px;
  --ui-text-11: 11px;
  --ui-text-12: 12px;
  --ui-text-13: 13px;
  --ui-text-14: 14px;
  --ui-text-16: 16px;
  --ui-text-18: 18px;
  --ui-text-20: 20px;
  --ui-text-22: 22px;
  --ui-text-24: 24px;
  --ui-text-28: 28px;
  --ui-text-32: 32px;
  --ui-text-code-relative: .9em;
  /* Display sizes are one glyph on one screen each, not steps of the reading
     scale: the status numeral on an error page, the mark above it, the wordmark
     on an empty home. They are named so they stop being loose numbers, not
     rounded onto a rhythm they do not belong to. */
  --ui-display-icon: 64px;
  --ui-display-status: 56px;
  --ui-display-mark: 76px;
  --ui-display-mark-narrow: 66px;
  --ui-display-wordmark: 88px;
  /* Ten, not eight. The first eight were picked before the gaps were counted, and
     left out 14px and 18px - which carry seventeen and ten uses, more than the 4px
     and 6px that were included. An inventory that drops its fifth most common
     value to keep a tidy count is not recording anything. */
  --ui-space-2: 2px;
  --ui-space-4: 4px;
  --ui-space-6: 6px;
  --ui-space-8: 8px;
  --ui-space-10: 10px;
  --ui-space-12: 12px;
  --ui-space-14: 14px;
  --ui-space-16: 16px;
  --ui-space-18: 18px;
  --ui-space-20: 20px;
  --ui-space-24: 24px;
  --ui-space-28: 28px;
  --ui-space-32: 32px;
  --ui-space-40: 40px;
  --ui-space-48: 48px;
  --ui-space-56: 56px;
  --ui-space-64: 64px;
  --ui-feedback-radius: .5rem;
  --ui-dialog-backdrop: rgb(14 24 33 / .58);
  --ui-dialog-border: 1px solid var(--border-strong);
  --ui-dialog-padding: 1.625rem;
  --ui-dialog-radius: .75rem;
  --ui-dialog-shadow: 0 1.25rem 3.4375rem rgb(0 0 0 / .28);
  --ui-error-bg: color-mix(in srgb, var(--danger) 8%, var(--surface));
  --ui-error-border: color-mix(in srgb, var(--danger) 35%, var(--border));
  /* The same two formulas with --success. The palette carried --success only as
     a text and marker colour, so there was no success surface at all - and the
     only painted status box in the product was the amber notice, which is why
     twenty screens confirm a save in the colour of a warning. */
  --ui-success-bg: color-mix(in srgb, var(--success) 8%, var(--surface));
  --ui-success-border: color-mix(in srgb, var(--success) 35%, var(--border));
  --ui-panel-border: 1px solid var(--border);
  --ui-panel-padding: 1.375rem;
  --ui-panel-radius: .625rem;
  background: var(--app-bg);
  color: var(--text);
  font: var(--ui-text-16)/1.5 system-ui, sans-serif;
}
html[data-theme="dark"] {
  color-scheme: dark;
  --app-bg: #121212;
  --surface: #1e1e1e;
  --surface-muted: #252525;
  --text: #e0e0e0;
  --text-muted: #bdbdbd;
  --border: #424242;
  --border-strong: #9e9e9e;
  --tree-guide: #6f6f6f;
  --header: var(--surface-inverted-strong);
  --header-text: var(--text-inverted);
  --header-control-bg: var(--surface-inverted);
  --header-control-text: #fff;
  --header-control-muted: var(--text-inverted-muted);
  --accent: #64b5f6;
  --accent-readable: #8ac7f7;
  --button-text: #07151d;
  /* The dark theme lightens danger to #ff8a80, on which white falls to
     2.28:1. Dark ink on it reads at 7:1, the same choice the button text
     above makes for a light accent. */
  --danger-action-text: #212121;
  --appearance-swatch-choice-1: #64b5f6;
  --appearance-swatch-choice-2: #80cbc4;
  --appearance-swatch-choice-3: #ce93d8;
  --appearance-swatch-choice-4: #fbbf24;
  --appearance-swatch-choice-5: #fb7185;
  --editor-selection-card-unavailable-text: var(--text-inverted-muted);
  --danger: #ff8a80;
  --success: #71d99b;
  --notice-bg: #3a310f;
  --notice-border: #8f7421;
  --notice-text: #ffe79b;
  --code-bg: #191919;
  --code-text: #f5f7f8;
  --code-muted: #929292;
  --auth-canvas: #252525;
  --auth-mobile-canvas: #252525;
  --navigation-bg: #171717;
  --navigation-strong: #0c0c0c;
  --navigation-edge: #292929;
  --comment-header: #304047;
  --comment-body: #141414;
  --comment-body-text: #b0bec5;
  --info-bg: #2d2535;
  --info-text: #d1c4e9;
  --shell-navigation-text: var(--text);
  --shell-navigation-muted: var(--text-muted);
  --shell-navigation-hover-bg: var(--surface-muted);
  --shell-navigation-active-bg: color-mix(in srgb, var(--accent) 16%, transparent);
  --shell-navigation-active-text: var(--accent-readable);
  --shell-navigation-count-bg: var(--surface-muted);
  --shell-navigation-count-secondary-bg: var(--surface-muted);
  --shell-navigation-count-text: var(--text-muted);
  --shell-footer-text: var(--text-muted);
  --shell-heading-muted: var(--text-muted);
  --profile-summary-muted: var(--text);
  --admin-dashboard-heading-summary: var(--text-muted);
  --admin-dashboard-panel-bg: var(--surface);
  --admin-dashboard-panel-border: var(--admin-dashboard-panel-boundary);
  --admin-dashboard-panel-heading-bg: #3f3f3f;
  --admin-dashboard-panel-heading-text: #fff;
  --admin-dashboard-panel-body-text: var(--text-muted);
  --admin-dashboard-session-text: rgb(255 255 255 / 87%);
  --admin-dashboard-session-time: var(--text-muted);
  --public-table-heading-bg: #0c0c0c;
  --public-table-odd-even-bg: #141414;
  --public-table-even-bg: #292929;
}
@media (prefers-color-scheme: dark) {
  html[data-theme="system"] {
    color-scheme: dark;
    --app-bg: #121212;
    --surface: #1e1e1e;
    --surface-muted: #252525;
    --text: #e0e0e0;
    --text-muted: #bdbdbd;
    --border: #424242;
    --border-strong: #9e9e9e;
    --tree-guide: #6f6f6f;
    --header: var(--surface-inverted-strong);
    --header-text: var(--text-inverted);
    --header-control-bg: var(--surface-inverted);
    --header-control-text: #fff;
    --header-control-muted: var(--text-inverted-muted);
    --accent: #64b5f6;
    --accent-readable: #8ac7f7;
    --button-text: #07151d;
    --danger-action-text: #212121;
  --appearance-swatch-choice-1: #64b5f6;
  --appearance-swatch-choice-2: #80cbc4;
  --appearance-swatch-choice-3: #ce93d8;
  --appearance-swatch-choice-4: #fbbf24;
  --appearance-swatch-choice-5: #fb7185;
    --editor-selection-card-unavailable-text: var(--text-inverted-muted);
    --danger: #ff8a80;
    --success: #71d99b;
    --notice-bg: #3a310f;
    --notice-border: #8f7421;
    --notice-text: #ffe79b;
    --code-bg: #191919;
    --code-text: #f5f7f8;
    --code-muted: #929292;
    --auth-canvas: #252525;
    --auth-mobile-canvas: #252525;
    --navigation-bg: #171717;
    --navigation-strong: #0c0c0c;
    --navigation-edge: #292929;
    --comment-header: #304047;
    --comment-body: #141414;
    --comment-body-text: #b0bec5;
    --info-bg: #2d2535;
    --info-text: #d1c4e9;
    --shell-navigation-text: var(--text);
    --shell-navigation-muted: var(--text-muted);
    --shell-navigation-hover-bg: var(--surface-muted);
    --shell-navigation-active-bg: color-mix(in srgb, var(--accent) 16%, transparent);
    --shell-navigation-active-text: var(--accent-readable);
    --shell-navigation-count-bg: var(--surface-muted);
    --shell-navigation-count-secondary-bg: var(--surface-muted);
    --shell-navigation-count-text: var(--text-muted);
    --shell-footer-text: var(--text-muted);
    --shell-heading-muted: var(--text-muted);
    --profile-summary-muted: var(--text);
    --admin-dashboard-heading-summary: var(--text-muted);
    --admin-dashboard-panel-bg: var(--surface);
    --admin-dashboard-panel-border: var(--admin-dashboard-panel-boundary);
    --admin-dashboard-panel-heading-bg: #3f3f3f;
    --admin-dashboard-panel-heading-text: #fff;
    --admin-dashboard-panel-body-text: var(--text-muted);
    --admin-dashboard-session-text: rgb(255 255 255 / 87%);
    --admin-dashboard-session-time: var(--text-muted);
    --public-table-heading-bg: #0c0c0c;
    --public-table-odd-even-bg: #141414;
    --public-table-even-bg: #292929;
  }
}

/* The Action primitive.
 *
 * There is no shared action component in either layer, so 216 rules across the
 * stylesheet each derive a button from the tokens again: eleven distinct border
 * radii, twenty-eight distinct heights, twenty-nine distinct paddings. The token
 * layer for one already existed and was used by about an eighth of them.
 *
 * One rule set for every kind of action element, because the divergence is caused
 * by which tag a screen happened to pick: a button, a link and a disclosure
 * summary that mean the same thing must draw the same box. It sits beside the
 * global button paint rather than replacing it, so an unconverted screen keeps
 * exactly the appearance it has, and a converted one stops owning geometry.
 *
 * No new colours - every role below already exists. */
.ui-action {
  align-items: center;
  background: var(--surface-muted);
  /* --border-strong is 2.46:1 against this fill in the light theme, under the 3:1
     WCAG asks for a control boundary, and the fill cannot carry the job either:
     --surface-muted against the page ground is 1.04:1. --text-muted is 5.68:1
     light and 8.16:1 dark, and is what the delete page already ships. */
  border: 1px solid var(--text-muted);
  border-radius: var(--ui-action-radius);
  box-sizing: border-box;
  color: var(--text);
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  gap: var(--ui-action-gap);
  justify-content: center;
  list-style: none;
  margin: 0;
  min-height: var(--ui-action-min-height);
  padding: var(--ui-action-padding);
  text-decoration: none;
}
.ui-action::-webkit-details-marker { display: none; }
.ui-action[data-variant="primary"] { background: var(--accent); border-color: var(--accent); color: var(--button-text); }
.ui-action[data-variant="danger"] { background: var(--danger); border-color: var(--danger); color: var(--danger-action-text); }
.ui-action[data-variant="quiet"] { background: transparent; border-color: transparent; color: var(--accent-readable); }
.ui-action[data-variant="quiet"][data-tone="danger"] { color: var(--danger); }
.ui-action[data-variant="primary"]:hover { background: var(--accent-readable); border-color: var(--accent-readable); }
.ui-action:is([data-variant="secondary"], [data-variant="quiet"]):hover { background: var(--surface); }
.ui-action[data-size="sm"] { min-height: var(--ui-action-min-height-sm); padding: var(--ui-action-padding-sm); }
.ui-action[data-icon="true"] { padding: 0; width: var(--ui-action-min-height); }
.ui-action[data-icon="true"][data-size="sm"] { padding: 0; width: var(--ui-action-min-height-sm); }
.ui-action[data-block="true"] { width: 100%; }
/* Header, search overlay and editor rail: dark in both themes, so the roles they
   reach for must be too. */
.ui-action[data-on-dark="true"] { --ui-action-focus: var(--accent-inverted); background: var(--surface-inverted); border-color: var(--text-inverted-muted); color: var(--text-inverted); }
.ui-action[data-on-dark="true"][data-variant="primary"] { background: var(--accent-inverted); border-color: var(--accent-inverted); color: var(--surface-inverted-strong); }
.ui-action[data-on-dark="true"][data-variant="quiet"] { background: transparent; border-color: transparent; color: var(--text-inverted-muted); }
.ui-action:is(:disabled, [aria-disabled="true"]) { cursor: not-allowed; opacity: var(--ui-action-disabled-opacity); }
.ui-action:focus-visible { outline: var(--ui-action-focus-width) solid var(--ui-action-focus); outline-offset: .125rem; }
.ui-action-row { align-items: center; display: flex; flex-wrap: wrap; gap: .625rem; }
.ui-action-row[data-align="end"] { justify-content: flex-end; }
.ui-action-row[data-align="between"] { justify-content: space-between; }
@media (max-width: 37.5rem) {
  .ui-action-row { align-items: stretch; display: grid; grid-template-columns: minmax(0, 1fr); }
  .ui-action-row > .ui-action { width: 100%; }
}
@media (forced-colors: active) {
  .ui-action { background: ButtonFace; border: 1px solid ButtonText; color: ButtonText; }
  .ui-action:is(:disabled, [aria-disabled="true"]) { border-color: GrayText; color: GrayText; }
  .ui-action:hover { background: Highlight; color: HighlightText; }
  .ui-action:focus-visible { outline-color: Highlight; }
}
* { box-sizing: border-box; }
body { background: var(--app-bg); color: var(--text); font-family: "Roboto", sans-serif; margin: 0; }
/* The palette carries --accent for surfaces and --accent-readable for body
   text. The global link rule used the first, so at the default accent every
   link measured 4.41:1 on --app-bg and 4.22:1 on --surface-muted, under the
   4.5:1 floor; the readable pair is 6.42:1 on white. Blue was the only one of
   the five accents that failed. */
a { color: var(--accent-readable); }
input::placeholder, textarea::placeholder { color: var(--text-muted); opacity: 1; }
.skip-link { background: var(--surface); left: 12px; padding: var(--ui-space-8) var(--ui-space-12); position: fixed; top: -60px; z-index: 20; }
.skip-link:focus { top: 8px; }
.app-header { align-items: center; background: var(--header); color: var(--header-text); display: flex; height: 4rem; justify-content: space-between; padding: var(--ui-space-10) var(--ui-space-24); }
.app-header a { color: var(--header-text); font-size: var(--ui-text-18); font-weight: 700; text-decoration: none; }
.app-header nav { align-items: center; display: flex; font-size: var(--ui-text-14); gap: var(--ui-space-14); }
.app-header nav a { font-size: var(--ui-text-14); }
.app-header nav form { margin: 0; }
.app-header nav button { background: transparent; border: 1px solid var(--shell-header-control-border); color: var(--header-text); margin: 0; padding: var(--ui-space-6) var(--ui-space-10); }
.public-header-tools { inset: 0; pointer-events: none; position: absolute; }
.public-header-tools > :is(a, span) { align-items: center; display: flex; justify-content: center; pointer-events: auto; position: absolute; }
.public-header-new-page { height: 48px; right: 105px; top: 8px; width: 48px; }
.public-header-tags { height: 48px; left: calc(50% + 164px); top: 8px; width: 48px; }
.public-header-language { height: 64px; right: 57px; top: 0; width: 48px; }
.public-header-admin { height: 64px; right: 57px; top: 0; width: 48px; }
.public-header-login { height: 48px; right: 8px; top: 8px; width: 48px; }
.public-header-tools .header-icon {
  color: var(--public-header-icon);
  display: inline-block;
  font: normal normal 400 var(--ui-text-24)/1 "Material Design Icons";
  height: 24px;
  text-align: center;
  text-rendering: auto;
  width: 24px;
}
.header-icon-tag-multiple::before { content: "\F04FB" / ""; }
.header-icon-globe::before { content: "\F059F" / ""; }
.header-icon-account-circle::before { content: "\F0009" / ""; }
.header-icon-page-edit::before { content: "\F0DC8" / ""; }
.header-icon-text-box-plus::before { content: "\F0EA7" / ""; }
.header-icon-cog::before { content: "\F0493" / ""; }
.app-brand-with-logo { align-items: center; display: inline-flex; gap: var(--ui-space-10); min-width: 0; }
.app-brand-with-logo img { border-radius: 5px; object-fit: contain; }
.app-brand-with-logo span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-wordmark { align-items: center; display: inline-flex; gap: var(--ui-space-8); max-width: 100%; font-family: "Roboto", sans-serif; font-size: var(--ui-text-20); letter-spacing: normal; line-height: 1; white-space: nowrap; }
.product-wordmark img { background: var(--brand-logo-surface-fixed-light); border-radius: var(--ui-control-radius); box-sizing: content-box; height: auto; max-width: 100%; object-fit: contain; padding: var(--ui-space-4); width: 8.7em; }
.product-wordmark > span { color: inherit; font-weight: 600; }
.app-brand .product-wordmark { font-size: var(--ui-text-14); }
.app-header-actions { align-items: center; display: flex; gap: var(--ui-space-16); }
.mobile-navigation { display: none; position: relative; }
.mobile-navigation summary { border: 1px solid var(--shell-header-control-border); border-radius: 5px; color: var(--header-text); cursor: pointer; font-size: var(--ui-text-14); font-weight: 700; list-style: none; padding: var(--ui-space-6) var(--ui-space-10); }
.mobile-navigation summary::-webkit-details-marker { display: none; }
.mobile-navigation summary:focus-visible { outline: 3px solid var(--shell-mobile-navigation-focus); outline-offset: 2px; }
.mobile-navigation-panel { background: var(--surface); border: 1px solid var(--border); border-radius: 8px; box-shadow: var(--shell-mobile-navigation-panel-shadow); color: var(--text); left: 16px; max-height: calc(100vh - 82px); min-width: 0; overflow: auto; padding: var(--ui-space-14); position: fixed; right: 16px; top: 66px; z-index: 30; }
.mobile-navigation-panel .primary-navigation { display: grid; gap: var(--ui-space-4); }
.mobile-navigation-panel a { border-radius: 5px; color: var(--text); display: block; font-size: var(--ui-text-14); padding: var(--ui-space-8) var(--ui-space-10); text-decoration: none; }
.mobile-navigation-panel a[aria-current="page"] { background: color-mix(in srgb, var(--accent) 14%, var(--surface)); color: var(--accent-readable); font-weight: 750; }
.app-layout { display: grid; min-height: calc(100vh - 120px); }
.app-layout[data-sidebar="true"] { grid-template-columns: 216px minmax(0, 1fr); }
.app-sidebar { background: var(--surface); border-right: 1px solid var(--border); padding: var(--ui-space-32) var(--ui-space-20); }
.app-sidebar .primary-navigation { display: grid; gap: var(--ui-space-6); }
.custom-navigation { border-top: 1px solid var(--border); margin-top: 16px; padding-top: 16px; }
.custom-navigation ul { display: grid; gap: var(--ui-space-6); list-style: none; margin: 0; padding: 0; }
.custom-navigation ul ul { border-left: 1px solid var(--border); margin: var(--ui-space-4) 0 var(--ui-space-4) var(--ui-space-8); padding-left: 12px; }
.custom-navigation a, .custom-navigation .navigation-group { display: block; padding: var(--ui-space-8) var(--ui-space-10); }
.custom-navigation .navigation-group { color: var(--text-muted); font-size: var(--ui-text-12); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.custom-navigation hr { border: 0; border-top: 1px solid var(--border); margin: var(--ui-space-8) var(--ui-space-10); }
.app-sidebar a { border-radius: 6px; color: var(--text-muted); font-weight: 650; padding: var(--ui-space-10) var(--ui-space-12); text-decoration: none; }
.app-sidebar a:hover { background: var(--surface-muted); color: var(--text); }
.app-sidebar a[aria-current="page"] { background: color-mix(in srgb, var(--accent) 14%, var(--surface)); color: var(--accent-readable); }
.public-navigation-links span { background: var(--public-on-navigation); display: block; height: 11px; position: relative; width: 16px; }
.public-navigation-links span::before { border-bottom: 8px solid var(--public-on-navigation); border-left: 9px solid transparent; border-right: 9px solid transparent; content: ""; left: -1px; position: absolute; top: -7px; }
.public-navigation-links { border-top: 1px solid var(--public-navigation-divider-subtle); padding-top: 8px; }
.app-sidebar .public-navigation-links a { align-items: center; border-radius: 0; color: var(--public-on-navigation); display: flex; font-size: var(--ui-text-14); gap: var(--ui-space-18); height: 40px; padding: 0 var(--ui-space-20); }
/* The shell hover paints a light plate and darkens the text, which is right on
   a white sidebar and wrong on this one: the sidebar is the accent band and its
   links are white. Both rules weigh the same, and this one comes later, so it
   won the colour back to white while the plate stayed - white on #f5f5f5, at
   1.09:1. The band lifts instead of plating. */
.app-sidebar .public-navigation-links a:hover,
.app-sidebar .public-navigation-links a:focus-visible,
.app-sidebar .custom-navigation a:hover,
.app-sidebar .custom-navigation a:focus-visible {
  background: var(--public-navigation-hover-bg);
  color: var(--public-on-navigation);
}
.public-navigation-links span { height: 9px; transform: scale(.75); width: 14px; }
.app-sidebar .public-page-tree { clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }
main { margin: 0 auto; max-width: 1120px; min-width: 0; padding: var(--ui-space-64) var(--ui-space-32); width: 100%; }
.app-footer { align-items: center; background: var(--surface); border-top: 1px solid var(--border); color: var(--text-muted); display: flex; font-size: var(--ui-text-13); height: 56px; justify-content: space-between; padding: 0 var(--ui-space-24); }
.welcome, .editor-shell, .auth-shell, article, .history-shell, .error-shell, .tags-shell, .tree-shell, .danger-shell, .trash-shell, .navigation-editor-shell, .source-shell, .permission-explanation-shell, .identity-admin-shell { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: var(--ui-space-40); }
body:is([data-shell-variant="admin"], [data-shell-variant="account"]) { --header: var(--surface); --header-text: var(--text); --header-control-bg: var(--surface-muted); --header-control-text: var(--text); --header-control-muted: var(--text-muted); --shell-header-icon: var(--text-muted); --shell-header-divider: var(--border); --shell-header-control-border: var(--border); --shell-mobile-navigation-focus: var(--accent-readable); --shell-sidebar-bg: var(--surface-muted); --shell-navigation-muted: var(--text-muted); background: var(--app-bg); color: var(--text); font-family: "Roboto", sans-serif; }
body[data-shell-variant="admin"] .app-header { background: var(--header); display: grid; grid-template-columns: var(--shell-sidebar-width) minmax(0, 1fr); height: var(--shell-header-height); padding: 0; position: relative; }
body[data-shell-variant="admin"] .app-header .app-brand { align-items: center; display: flex; font: 400 var(--ui-text-20)/30px "Roboto", sans-serif; height: var(--shell-header-height); padding-left: 16px; }
body[data-shell-variant="admin"] .app-context-label { display: none; }
body[data-shell-variant="admin"] .app-header .header-search { display: none; }
body[data-shell-variant="admin"] .app-header-actions { justify-self: end; padding-right: 0; }
body[data-shell-variant="admin"] .app-header-actions nav { align-items: center; display: flex; gap: 0; height: var(--shell-header-height); }
body[data-shell-variant="admin"] .app-header-actions nav form { margin: 0; order: 1; }
body[data-shell-variant="admin"] .app-header-actions nav button { align-items: center; background: transparent; border: 0; border-radius: 0; color: var(--header-text); display: flex; font-size: var(--ui-text-14); height: var(--shell-header-height); justify-content: center; padding: 0 var(--ui-space-12); white-space: nowrap; width: auto; }
body[data-shell-variant="admin"] .app-header-actions nav button::before { color: var(--shell-header-icon); content: "\F0206" / ""; font: normal normal 400 var(--ui-text-18)/1 "Material Design Icons"; margin-right: 9px; transform: translateX(-1px); vertical-align: -2px; }
body[data-shell-variant="admin"] .app-header-actions nav button::after { content: none; }
body[data-shell-variant="admin"] .app-layout[data-sidebar="true"] { grid-template-columns: var(--shell-sidebar-width) minmax(0, 1fr); min-height: calc(100vh - var(--shell-header-height)); }
body[data-shell-variant="admin"] .app-sidebar { background: var(--shell-sidebar-bg); border-color: var(--shell-sidebar-border); padding: var(--shell-sidebar-padding); }
body[data-shell-variant="admin"] .app-sidebar .primary-navigation { gap: var(--shell-navigation-gap); }
body[data-shell-variant="admin"] .app-sidebar .custom-navigation,
body[data-shell-variant="admin"] .app-sidebar .custom-navigation ul ul,
body[data-shell-variant="admin"] .app-sidebar .custom-navigation hr { border-color: var(--shell-sidebar-border); }
body[data-shell-variant="admin"] .app-sidebar .custom-navigation li,
body[data-shell-variant="admin"] .app-sidebar .custom-navigation .navigation-group,
body[data-shell-variant="admin"] .app-sidebar .custom-navigation a { min-width: 0; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] .app-sidebar .custom-navigation .navigation-group { color: var(--shell-navigation-text); }
body[data-shell-variant="admin"] .app-sidebar .custom-navigation a { padding-left: 16px; }
body[data-shell-variant="admin"] .app-sidebar .admin-navigation-group { border-top: 1px solid var(--shell-sidebar-border); color: var(--shell-navigation-muted); font-size: var(--ui-text-12); margin: var(--ui-space-8) 0 0; padding: var(--ui-space-20) var(--ui-space-16) var(--ui-space-8); }
body[data-shell-variant="admin"] .app-sidebar .admin-navigation-group ~ .admin-navigation-group { margin-top: 6px; }
body[data-shell-variant="admin"] .app-sidebar a { border-radius: var(--shell-navigation-radius); color: var(--shell-navigation-text); font-size: var(--ui-text-14); font-weight: 500; min-height: var(--shell-navigation-item-height); padding: var(--ui-space-12) var(--ui-space-16) var(--ui-space-12) var(--ui-space-48); position: relative; }
body[data-shell-variant="admin"] .app-sidebar a:hover { background: var(--shell-navigation-hover-bg); color: var(--shell-navigation-text); }
body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .app-sidebar a:focus-visible { outline: 3px solid var(--shell-navigation-focus); outline-offset: 1px; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="dashboard"] { height: var(--shell-navigation-item-height); }
body[data-shell-variant="admin"] .app-sidebar .admin-navigation-count { background: var(--shell-navigation-count-bg); border-radius: 10px; color: var(--shell-navigation-count-text); font-size: var(--ui-text-14); font-weight: 700; height: 20px; line-height: 20px; min-width: 36px; padding: 0 var(--ui-space-8); position: absolute; right: 7px; text-align: center; top: 10px; }
body[data-shell-variant="admin"] .app-sidebar :is([data-navigation-icon="pages"], [data-navigation-icon="tags"]) .admin-navigation-count { background: var(--shell-navigation-count-secondary-bg); }
body[data-shell-variant="admin"] .app-sidebar a::before { color: var(--shell-navigation-muted); font: normal normal 400 var(--ui-text-24)/1 "Material Design Icons"; left: 8px; position: absolute; text-align: center; text-rendering: auto; top: 10px; width: 24px; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="dashboard"]::before { content: "\F0843" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="general"]::before { content: "\F072C" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="locale"]::before { content: "\F059F" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="navigation"]::before { content: "\F05CD" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="pages"]::before { content: "\F09EE" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="tags"]::before { content: "\F04FB" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="theme"]::before { content: "\F0E0C" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="groups"]::before { content: "\F0849" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="users"]::before { content: "\F0006" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="analytics"]::before { content: "\F0E93" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="editor"]::before { content: "\F08D6" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="permissions"]::before { content: "\F0BC5" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="security"]::before { content: "\F0498" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="authentication"]::before { content: "\F0341" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="search"]::before { content: "\F0957" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="storage"]::before { content: "\F02CA" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="comments"]::before { content: "\F0189" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="webhooks"]::before { content: "\F062F" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="mail"]::before { content: "\F01F0" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="api"]::before { content: "\F109B" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="jobs"]::before { content: "\F10D5" / ""; }
body[data-shell-variant="admin"] .app-sidebar [data-navigation-icon="audit"]::before { content: "\F0EAF" / ""; }
body[data-shell-variant="admin"] .app-sidebar a[aria-current="page"]::before { color: var(--shell-navigation-active-text); }
body[data-shell-variant="admin"] .app-sidebar a[aria-current="page"] { background: var(--shell-navigation-active-bg); color: var(--shell-navigation-active-text); }
body[data-shell-variant="admin"] .app-sidebar a[aria-current="page"]:hover { background: var(--shell-navigation-active-bg); color: var(--shell-navigation-active-text); }
body[data-shell-variant="admin"] main#main-content { margin: 0; max-width: none; padding: var(--ui-space-8) var(--ui-space-12); }
body[data-shell-variant="admin"] .admin-dashboard-shell { background: transparent; border: 0; border-radius: 0; display: grid; gap: var(--ui-space-14); min-width: 0; padding: 0; }
body[data-shell-variant="admin"] .admin-dashboard-heading { align-items: start; display: flex; justify-content: space-between; margin: 0; padding: 0; }
body[data-shell-variant="admin"] .admin-dashboard-heading > div { transform: none; }
body[data-shell-variant="admin"] .admin-dashboard-heading h1 { color: var(--text); font-size: var(--ui-page-title-size); font-weight: 600; margin: 0 0 var(--ui-space-8); }
body[data-shell-variant="admin"] .admin-dashboard-heading h1 + p { color: var(--admin-dashboard-heading-summary); font-size: var(--ui-text-16); margin: 0; }
body[data-shell-variant="admin"] .admin-dashboard-heading :is(h1, h1 + p) { transform: none; }
body[data-shell-variant="admin"] .admin-dashboard-heading .ui-status { display: none; }
body[data-shell-variant="admin"] .admin-dashboard-stats { display: grid; gap: var(--ui-space-24); grid-template-columns: repeat(3, minmax(0, 1fr)); min-width: 0; padding-block: var(--ui-space-20); border-block: 1px solid var(--border); }
body[data-shell-variant="admin"] .admin-dashboard-stat { background: transparent; border: 0; border-radius: 0; box-shadow: none; min-width: 0; padding: 0; }
body[data-shell-variant="admin"] .admin-dashboard-stat-label { color: var(--text-muted); font-size: var(--ui-text-14); font-weight: 400; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] .admin-dashboard-stat strong { color: var(--text); display: block; font-size: var(--ui-text-24); font-weight: 600; line-height: 1.3; margin-top: 4px; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] .admin-dashboard-stat .admin-dashboard-unavailable { font-size: var(--ui-text-16); }
body[data-shell-variant="admin"] .admin-dashboard-version { --admin-dashboard-version-bg: var(--surface-muted); --admin-dashboard-version-border: var(--border); --admin-dashboard-version-text: var(--text); background: var(--admin-dashboard-version-bg); border: 1px solid var(--admin-dashboard-version-border); border-radius: var(--ui-control-radius); box-shadow: none; color: var(--admin-dashboard-version-text); display: grid; gap: var(--ui-space-4); min-width: 0; overflow-wrap: anywhere; padding: var(--ui-space-16) var(--ui-space-48) var(--ui-space-16) var(--ui-space-16); position: relative; }
body[data-shell-variant="admin"] .admin-dashboard-version[data-version-state="current"] { --admin-dashboard-version-bg: var(--admin-dashboard-version-current-bg); --admin-dashboard-version-border: var(--admin-dashboard-version-current-border); --admin-dashboard-version-text: var(--admin-dashboard-version-current-text); }
body[data-shell-variant="admin"] .admin-dashboard-version[data-version-state="update"] { --admin-dashboard-version-bg: var(--admin-dashboard-version-update-bg); --admin-dashboard-version-border: var(--admin-dashboard-version-update-border); --admin-dashboard-version-text: var(--admin-dashboard-version-update-text); }
body[data-shell-variant="admin"] .admin-dashboard-version strong { background: var(--admin-dashboard-version-bg); font-size: var(--ui-text-16); font-weight: 400; min-width: 0; position: relative; z-index: 1; }
body[data-shell-variant="admin"] .admin-dashboard-version-summary { background: var(--admin-dashboard-version-bg); font-size: var(--ui-text-14); min-width: 0; position: relative; z-index: 1; }
body[data-shell-variant="admin"] .admin-dashboard-version-mark { align-items: center; color: var(--admin-dashboard-version-text); display: flex; height: 24px; justify-content: center; position: absolute; right: 16px; top: 16px; width: 24px; }
body[data-shell-variant="admin"] .admin-dashboard-version-mark > span { border-color: currentColor; box-sizing: border-box; display: block; height: 12px; width: 12px; }
body[data-shell-variant="admin"] .admin-dashboard-version-mark[data-version-mark="current"] > span { border-bottom-style: solid; border-left-style: solid; border-width: 0 0 3px 3px; height: 8px; transform: rotate(-45deg); width: 14px; }
body[data-shell-variant="admin"] .admin-dashboard-version-mark[data-version-mark="update"] > span { border-left-style: solid; border-top-style: solid; border-width: 3px 0 0 3px; transform: rotate(45deg); }
body[data-shell-variant="admin"] .admin-dashboard-version-mark[data-version-mark="unavailable"] > span { background: currentColor; border-radius: 50%; height: 6px; width: 6px; }
/* A check that was never switched on is not a fault: the disabled mark is the
   same neutral dot, hollow rather than filled, so a healthy default deployment
   does not read as a warning. */
body[data-shell-variant="admin"] .admin-dashboard-version-mark[data-version-mark="disabled"] > span { background: transparent; border: 1px solid currentColor; border-radius: 50%; height: 6px; width: 6px; }
body[data-shell-variant="admin"] .admin-dashboard-sections { display: grid; gap: var(--ui-space-14); grid-template-columns: 1fr; min-width: 0; }
body[data-shell-variant="admin"] .admin-dashboard-section { background: transparent; border: 0; border-top: 1px solid var(--border); border-radius: 0; padding: var(--ui-space-24) 0 0; }
body[data-shell-variant="admin"] .admin-dashboard-section > header { border: 0; padding: 0; text-align: left; }
body[data-shell-variant="admin"] .admin-dashboard-section > header .eyebrow { display: none; }
body[data-shell-variant="admin"] .admin-dashboard-section > header h2 { font-size: var(--ui-text-18); font-weight: 600; margin: 0; }
body[data-shell-variant="admin"] .admin-dashboard-section ul { display: grid; gap: var(--ui-space-4) var(--ui-space-24); grid-template-columns: repeat(2, minmax(0, 1fr)); list-style: none; padding: 0; }
body[data-shell-variant="admin"] .admin-dashboard-section li { min-width: 0; }
body[data-shell-variant="admin"] .admin-dashboard-section li a { border-radius: 4px; color: var(--text); display: grid; gap: var(--ui-space-2); padding: var(--ui-space-8) var(--ui-space-10); text-decoration: none; }
body[data-shell-variant="admin"] .admin-dashboard-section li a:hover { background: var(--admin-dashboard-link-hover-bg); }
body[data-shell-variant="admin"] .admin-dashboard-section li a:focus-visible { background: var(--admin-dashboard-link-hover-bg); outline: 3px solid var(--admin-dashboard-link-focus); outline-offset: 1px; }
body[data-shell-variant="admin"] .admin-dashboard-section li span { color: var(--text-muted); display: block; font-size: var(--ui-text-13); line-height: 1.5; }
body[data-shell-variant="admin"] .admin-dashboard-overview { display: grid; gap: var(--ui-space-24); grid-template-columns: repeat(2, minmax(0, 1fr)); margin-block: var(--ui-space-16); }
body[data-shell-variant="admin"] .admin-dashboard-overview-panel { background: transparent; border: 0; border-radius: 0; box-shadow: none; }
body[data-shell-variant="admin"] .admin-dashboard-overview-panel { min-width: 0; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] .admin-dashboard-overview-panel h2 { color: var(--text); font-size: var(--ui-text-18); font-weight: 600; margin: 0 0 var(--ui-space-12); text-align: left; }
body[data-shell-variant="admin"] .admin-dashboard-overview-panel > p { color: var(--text-muted); margin: 0; padding: 0; text-align: left; }
body[data-shell-variant="admin"] .admin-dashboard-overview-panel:not(.admin-dashboard-session) > p { color: var(--text-muted); font-size: var(--ui-text-14); padding: 0; }
body[data-shell-variant="admin"] .admin-dashboard-session > p { color: var(--text); display: flex; flex-wrap: wrap; font-size: var(--ui-text-14); gap: var(--ui-space-8); justify-content: space-between; margin-bottom: 8px; text-align: left; }
body[data-shell-variant="admin"] .admin-dashboard-session > p strong { min-width: 0; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] .admin-dashboard-session > p span { display: none; }
body[data-shell-variant="admin"] .admin-dashboard-session > p time { color: var(--text-muted); font-size: var(--ui-text-12); white-space: normal; }
body[data-shell-variant="admin"] .app-footer { display: none; }
body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .app-header { border-bottom: 1px solid var(--border); }
@media (min-width: 56.3125rem) {
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .app-sidebar { align-self: start; height: calc(100dvh - var(--shell-header-height)); overflow-y: auto; position: sticky; top: 0; }
}
@media (max-width: 37.5rem) {
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .app-header { gap: var(--ui-space-8); padding-inline: var(--ui-space-12); }
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .app-brand .product-wordmark img { width: 96px; }
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .app-brand .product-wordmark > span { display: none; }
}
@media (max-width: 56.25rem) {
  body[data-shell-variant="admin"] :is(.admin-dashboard-overview, .admin-dashboard-section ul) { grid-template-columns: minmax(0, 1fr); }
}
.auth-shell, .error-shell { margin: 0 auto; max-width: 35rem; }
.auth-provider-divider { align-items: center; color: var(--muted); display: flex; font-size: var(--ui-text-14); gap: var(--ui-space-12); margin: var(--ui-space-24) 0 var(--ui-space-16); text-transform: uppercase; }
.auth-provider-divider::before, .auth-provider-divider::after { background: var(--border); content: ""; flex: 1; height: 1px; }
.auth-provider-list { display: grid; gap: var(--ui-space-10); }
.auth-provider-button { align-items: center; border: 1px solid var(--border); border-radius: 8px; color: var(--text); display: flex; font-weight: 650; justify-content: center; min-height: 44px; padding: var(--ui-space-10) var(--ui-space-16); text-decoration: none; }
.auth-provider-button:hover { background: var(--surface-muted); border-color: var(--accent); }
.auth-credential-provider { background: var(--surface-muted); border: 1px solid var(--border); border-radius: 8px; margin-top: 12px; padding: var(--ui-space-16); }
.auth-credential-provider h2 { font-size: var(--ui-text-16); margin: 0 0 var(--ui-space-12); }
.auth-credential-provider button { width: 100%; }
.auth-secondary { color: var(--text-muted); margin: var(--ui-space-18) 0 0; text-align: center; }
.auth-result { background: var(--surface-muted); border: 1px solid var(--border); border-radius: 9px; margin: var(--ui-space-24) 0 0; padding: var(--ui-space-24); }
.auth-result h2 { font-size: var(--ui-text-20); margin: 0 0 var(--ui-space-8); }
.auth-result p { color: var(--text-muted); margin: 0; }
.recovery-shell > p:not(.eyebrow, .auth-secondary) { color: var(--text-muted); }
.login-body { background: var(--surface); color: var(--text); font-family: "Roboto", sans-serif; }
.setup-body { --setup-boundary: var(--text-muted); --setup-focus: var(--accent-readable); background: var(--surface); color: var(--text); font-family: "Roboto", sans-serif; margin: 0; min-height: 100vh; }
.setup-stage { background: var(--surface); display: flex; justify-content: center; min-height: 100dvh; padding: var(--ui-space-48) var(--ui-space-24); }
.setup-panel { box-sizing: border-box; color: var(--text); max-width: 36rem; min-width: 0; width: 100%; }
.setup-header { align-items: center; display: flex; margin-bottom: var(--ui-space-32); }
.setup-header .product-wordmark img { width: 160px; }
.setup-content { padding: 0; }
.setup-intro { color: var(--text); font-size: var(--ui-text-28); font-weight: 600; line-height: 1.25; margin: 0 0 var(--ui-space-24); }
.setup-body .setup-error { border-color: var(--danger); margin: 0 0 var(--ui-space-24); }
.setup-error:focus-visible { outline: 3px solid var(--setup-focus); outline-offset: 3px; }
.setup-form { display: block; margin: 0; max-width: none; }
.setup-form fieldset { border: 0; margin: 0; min-width: 0; padding: var(--ui-space-24) 0; }
.setup-form legend { color: var(--text); float: left; font-size: var(--ui-text-18); font-weight: 600; margin-bottom: var(--ui-space-16); padding: 0; width: 100%; }
.setup-form label { clear: both; display: block; font-size: var(--ui-text-14); font-weight: 500; margin: 0 0 var(--ui-space-8); }
.setup-form input:not([type="checkbox"]) { background: var(--surface); border: 1px solid var(--setup-boundary); border-radius: var(--ui-control-radius); box-sizing: border-box; color: var(--text); font: inherit; height: 48px; padding: 0 var(--ui-space-12); width: 100%; }
.setup-form :is(input, button, a):focus-visible { outline: 3px solid var(--setup-focus); outline-offset: 3px; }
.setup-field-help { color: var(--text-muted); font-size: var(--ui-text-12); line-height: 18px; margin: var(--ui-space-6) 0 0; }
.setup-email-help { margin-bottom: var(--ui-space-20); }
.setup-password-grid { display: grid; gap: var(--ui-space-24); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.setup-password-grid > div { min-width: 0; position: relative; }
.setup-form .setup-password-toggle { background: transparent; border: 0; height: 44px; margin: 0; min-height: 0; padding: 0; position: absolute; right: 2px; top: 30px; width: 44px; }
.setup-password-grid input { padding-right: 48px; }
.setup-password-toggle::after { color: var(--text-muted); content: "\F0209" / ""; font-family: "Material Design Icons"; font-size: var(--ui-text-24); }
.setup-password-toggle::before { content: none; }
.setup-password-grid .setup-field-help { display: flex; flex-wrap: wrap; gap: var(--ui-space-4); justify-content: space-between; }
.setup-form .setup-site, .setup-form .setup-telemetry { border-top: 1px solid var(--border); }
.setup-site > input, .setup-telemetry > .setup-switch { clear: both; }
.setup-form .setup-switch { align-items: center; display: flex; font-size: var(--ui-text-14); gap: var(--ui-space-10); }
.setup-switch input { accent-color: var(--accent-readable); height: 18px; width: 18px; }
.setup-help { color: var(--text-muted); font-size: var(--ui-text-12); margin: 0 0 0 var(--ui-space-28); }
.setup-help a { color: var(--accent-readable); }
.setup-form button { background: var(--accent); border: 0; border-radius: var(--ui-control-radius); color: var(--button-text); cursor: pointer; font: inherit; font-weight: 500; min-height: 48px; margin: var(--ui-space-8) 0 0; width: 100%; }
.setup-form button:hover { background: var(--accent-readable); }
@media (max-width: 37.5rem) {
  .setup-stage { padding: var(--ui-space-32) var(--ui-space-16); }
  .setup-password-grid { gap: var(--ui-space-20); grid-template-columns: minmax(0, 1fr); }
}
.login-stage { align-items: start; box-sizing: border-box; display: grid; justify-items: center; min-height: 100dvh; padding: max(4rem, 14vh) 1.5rem 4rem; }
body[data-shell-variant="auth"] main#main-content { align-items: center; background: var(--surface); box-sizing: border-box; display: flex; flex-direction: column; margin: 0; max-width: none; min-height: 100dvh; padding: max(4rem, 14vh) var(--ui-space-24) var(--ui-space-48); width: 100%; }
body[data-shell-variant="auth"] :is(.auth-shell, .password-change-shell) { background: transparent; box-shadow: none; color: var(--text); max-width: 24rem; min-height: 0; width: 100%; }
.auth-entry-brand { margin-bottom: var(--ui-space-32); max-width: 24rem; width: 100%; }
.auth-entry-brand .product-wordmark img { width: 160px; }
.auth-entry-brand .login-brand { margin: 0; }
body[data-shell-variant="auth"] :is(.auth-shell, .password-change-shell) h1 { font-size: var(--ui-text-28); font-weight: 600; line-height: 1.25; }
.login-panel {
  --login-boundary: var(--text-muted);
  --login-field-focus: var(--auth-field-text);
  --login-surface-focus: var(--accent-readable);
  box-sizing: border-box;
  color: var(--text);
  max-width: 24rem;
  min-width: 0;
  width: 100%;
}
body[data-shell-variant="auth"] { font-family: "Roboto", sans-serif; }
body[data-shell-variant="auth"] :is(.app-header, .app-sidebar, .app-footer) { display: none; }
body[data-shell-variant="auth"] .app-layout { display: block; min-height: 100vh; }
body[data-shell-variant="auth"] :is(.auth-shell, .password-change-shell) {
	--auth-boundary: var(--text-muted);
	--auth-panel-boundary: color-mix(in srgb, var(--text) 55%, var(--surface));
	--auth-focus: var(--accent-readable);
	--auth-error-bg: var(--ui-error-bg);
	--auth-error-boundary: var(--danger);
	--auth-error-text: var(--danger);
	--auth-muted-surface: var(--surface-muted);
	--auth-primary-text: var(--text);
	--auth-secondary-text: var(--text-muted);
  border-radius: 0;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
}
body[data-shell-variant="auth"] .recovery-shell { color: var(--auth-primary-text); min-width: 0; }
body[data-shell-variant="auth"] .recovery-shell :is(h1, h2, p, label, a) { overflow-wrap: anywhere; }
body[data-shell-variant="auth"] .recovery-shell form { display: grid; gap: var(--ui-space-12); margin-top: 1.5rem; max-width: none; }
body[data-shell-variant="auth"] .recovery-shell input:not([type="hidden"]) { border-color: var(--auth-boundary); min-width: 0; }
body[data-shell-variant="auth"] .recovery-shell form button { margin-top: .5rem; }
body[data-shell-variant="auth"] .recovery-shell .auth-secondary a { color: var(--accent-readable); }
body[data-shell-variant="auth"] .recovery-shell .auth-feedback { background: var(--auth-error-bg); border: 1px solid var(--auth-error-boundary); border-radius: var(--ui-feedback-radius); color: var(--auth-error-text); margin: 1.25rem 0 0; padding: var(--ui-feedback-padding); }
body[data-shell-variant="auth"] .recovery-request-shell .recovery-request-result { background: var(--auth-muted-surface); border-color: var(--auth-boundary); color: var(--auth-primary-text); }
body[data-shell-variant="auth"] .recovery-request-shell .recovery-request-result p { color: var(--auth-secondary-text); }
body[data-shell-variant="auth"] .recovery-shell :is(input, button, a, [role="alert"], [role="status"]):focus-visible { outline: 3px solid var(--auth-focus); outline-offset: 3px; }
body[data-shell-variant="auth"] [data-testid="forced-password-change"] {
  --forced-password-boundary: var(--auth-boundary);
  --forced-password-error-bg: var(--ui-error-bg);
  --forced-password-error-text: var(--danger);
  --forced-password-focus: var(--auth-focus);
  box-shadow: none;
  min-width: 0;
}
body[data-shell-variant="auth"] [data-testid="forced-password-change"] :is(.ui-page-heading > div, form, h1, p, label) { min-width: 0; }
body[data-shell-variant="auth"] [data-testid="forced-password-change"] :is(h1, p, label) { overflow-wrap: anywhere; }
body[data-shell-variant="auth"] [data-testid="forced-password-change"] .password-change-form { display: grid; gap: var(--ui-space-12); margin-top: 1.5rem; max-width: none; }
body[data-shell-variant="auth"] [data-testid="forced-password-change"] .password-change-form input:not([type="hidden"]) { border-color: var(--forced-password-boundary); min-width: 0; }
body[data-shell-variant="auth"] [data-testid="forced-password-change"] .forced-password-change-feedback {
  background: var(--forced-password-error-bg);
  border: 1px solid var(--forced-password-boundary);
  border-radius: var(--ui-feedback-radius);
  color: var(--forced-password-error-text);
  padding: var(--ui-feedback-padding);
}
body[data-shell-variant="auth"] [data-testid="forced-password-change"] :is(input, button, [role="alert"]):focus-visible { outline: 3px solid var(--forced-password-focus); outline-offset: 3px; }
[data-testid="email-verification"] {
  --email-verification-boundary: var(--text-muted);
  --email-verification-error-bg: var(--ui-error-bg);
  --email-verification-error-text: var(--danger);
  --email-verification-focus: var(--accent-readable);
  --email-verification-link: var(--accent-readable);
  --email-verification-result-bg: var(--surface-muted);
  min-width: 0;
}
body[data-shell-variant="auth"] [data-testid="email-verification"] {
  --email-verification-boundary: var(--auth-boundary);
  --email-verification-focus: var(--auth-focus);
}
[data-testid="email-verification"] :is(.ui-page-heading > div, .email-verification-result, form, h1, h2, p, strong) { min-width: 0; }
[data-testid="email-verification"] :is(h1, h2, p, strong) { overflow-wrap: anywhere; }
[data-testid="email-verification"] .email-verification-result {
  background: var(--email-verification-result-bg);
  border-color: var(--email-verification-boundary);
}
[data-testid="email-verification"] .auth-secondary a { color: var(--email-verification-link); }
[data-testid="email-verification"] .auth-feedback-error {
  background: var(--email-verification-error-bg);
  border: 1px solid var(--email-verification-boundary);
  border-radius: var(--ui-feedback-radius);
  color: var(--email-verification-error-text);
  padding: var(--ui-feedback-padding);
}
[data-testid="email-verification"] :is(input, button, a, [role="alert"]):focus-visible { outline: 3px solid var(--email-verification-focus); outline-offset: 3px; }
body[data-shell-variant="account"] [data-testid="email-verification"] :is(form, .email-verification-result, .auth-feedback) { max-width: 42rem; }
body[data-shell-variant="account"] [data-testid="email-verification"] form { display: grid; gap: var(--ui-space-12); margin-top: 24px; }
.login-panel-heading { margin-bottom: 2rem; }
.login-brand { align-items: center; display: flex; gap: var(--ui-space-8); margin-bottom: 2.5rem; }
.login-brand .product-wordmark { font-size: var(--ui-text-14); gap: var(--ui-space-8); }
.login-brand .product-wordmark img { width: 9rem; padding: .25rem; }
.login-brand-logo, .login-brand-mark { flex: 0 0 58px; height: 58px; width: 58px; }
.login-brand-logo { object-fit: contain; }
.login-brand-mark { background: var(--header); border: 1px solid var(--login-boundary); border-radius: 0 0 7px 7px; box-sizing: border-box; display: block; position: relative; }
.login-brand-mark::after { background: var(--header-text); border-radius: 50%; content: ""; height: 10px; left: 24px; position: absolute; top: 24px; width: 10px; }
.login-brand-title { font-size: var(--ui-text-22); font-weight: 500; margin-left: 12px; }
.login-panel-heading h1 { font-size: var(--ui-text-28); font-weight: 700; letter-spacing: -.025em; line-height: 1.25; margin: 0; }
.login-introduction { color: var(--text-muted); font-size: var(--ui-text-16); line-height: 1.6; margin: .625rem 0 0; }
.login-panel-content { padding: 0; }
.registration-body { background: var(--surface); color: var(--text); font-family: "Roboto", sans-serif; margin: 0; min-height: 100vh; }
.registration-stage { display: flex; justify-content: center; min-height: 100dvh; padding: max(4rem, 10vh) var(--ui-space-24) var(--ui-space-48); }
.registration-panel { color: var(--text); max-width: 24rem; min-width: 0; width: 100%; }
.registration-heading { margin-bottom: var(--ui-space-24); }
.registration-heading h1 { font-size: var(--ui-text-28); font-weight: 600; line-height: 1.25; margin: 0; }
.registration-content { padding: 0; }
.registration-brand { color: var(--text); font-size: var(--ui-text-16); margin-bottom: var(--ui-space-32); }
.registration-brand .product-wordmark img { width: 10rem; }
.registration-help { color: var(--text-muted); font-size: var(--ui-text-12); margin: var(--ui-space-4) 0 0; }
.registration-subtitle { color: var(--text-muted); font-size: var(--ui-text-14); margin: 0 0 var(--ui-space-24); }
.registration-form { display: grid; gap: var(--ui-space-16); margin: 0; }
.registration-field-wrap, .registration-field { min-width: 0; position: relative; }
.registration-field label { display: block; font-size: var(--ui-text-14); font-weight: 500; line-height: 20px; margin: 0 0 var(--ui-space-8); }
.registration-field input { appearance: none; background: var(--surface); border: 1px solid var(--text-muted); border-radius: var(--ui-control-radius); box-sizing: border-box; color: var(--text); font: 400 var(--ui-text-16)/20px "Roboto", sans-serif; height: 48px; padding: 0 var(--ui-space-12); width: 100%; }
.registration-password input { padding-right: 48px; }
.registration-field input::placeholder { color: var(--text-muted); opacity: 1; }
.registration-field input:focus-visible { outline: 2px solid var(--accent-readable); outline-offset: 2px; }
.registration-password-toggle { align-items: center; background: transparent; border: 0; color: var(--text-muted); display: flex; height: 44px; justify-content: center; margin: 0; padding: 0; position: absolute; right: 2px; top: 30px; width: 44px; }
.registration-password-toggle::before { content: "\F0209" / ""; font: normal normal 400 var(--ui-text-22)/1 "Material Design Icons"; }
.registration-password-toggle[aria-pressed="true"]::before { content: "\F0208" / ""; }
.registration-counter { color: var(--text-muted); display: block; font-size: var(--ui-text-12); margin-top: var(--ui-space-4); text-align: right; }
.registration-error { background: var(--ui-error-bg); border-radius: var(--ui-control-radius); color: var(--danger); margin: 0 0 var(--ui-space-24); padding: var(--ui-space-16); }
.registration-submit { background: var(--accent); border: 0; border-radius: var(--ui-control-radius); box-shadow: none; color: var(--button-text); cursor: pointer; font: 500 var(--ui-text-16)/20px "Roboto", sans-serif; min-height: 48px; margin: var(--ui-space-8) 0 0; width: 100%; }
.registration-submit:hover { background: var(--accent-readable); }
.registration-content > [role="status"] { margin: 0; }
.registration-content > [role="status"] h2 { font-size: var(--ui-text-22); font-weight: 600; }
.registration-panel-footer { color: var(--text-muted); font-size: var(--ui-text-14); margin-top: var(--ui-space-24); text-align: center; }
.registration-panel-footer a { color: var(--accent-readable); text-decoration: underline; text-underline-offset: .2em; }
.login-error { background: var(--ui-error-bg); border-radius: var(--ui-control-radius); color: var(--danger); font-size: var(--ui-text-14); margin: 0 0 1.5rem; padding: 1rem; }
.login-form { display: grid; gap: var(--ui-space-20); margin: 0; max-width: none; }
.login-field {
  box-sizing: border-box;
  min-width: 0;
  position: relative;
}
.login-field label { display: block; font-size: var(--ui-text-14); font-weight: 500; line-height: 1.5; margin: 0 0 .5rem; }
.login-field input {
  appearance: none;
  background: var(--auth-field-surface);
  border: 1px solid var(--login-boundary);
  border-radius: .5rem;
  box-shadow: none;
  box-sizing: border-box;
  color: var(--auth-field-text);
  display: block;
  font: 400 var(--ui-text-16)/20px "Roboto", sans-serif;
  height: 48px;
  margin: 0;
  min-width: 0;
  padding: 0 var(--ui-space-12);
  width: 100%;
}
.login-field-password input { padding-right: 40px; }
.login-field input::placeholder { color: var(--auth-field-placeholder); opacity: 1; }
.login-field input:focus-visible { outline: 3px solid var(--login-field-focus); outline-offset: 1px; }
.login-password-toggle {
  align-items: center;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--auth-field-placeholder);
  display: flex;
  height: 48px;
  justify-content: center;
  margin: 0;
  padding: 0;
  position: absolute;
  right: 0;
  bottom: 0;
  width: 40px;
}

.page-location-underlay {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  min-height: 360px;
  padding: var(--ui-space-40);
}
.page-location-scrim {
  background: var(--page-location-scrim-bg);
  inset: 0;
  position: fixed;
  z-index: 70;
}
.page-location-dialog {
  --location-footer-height: 64px;
  --location-header-height: 64px;
  --location-path-height: 112px;
  background: var(--page-location-surface);
  border: 1px solid var(--border);
  border-radius: var(--ui-panel-radius);
  box-shadow: var(--ui-dialog-shadow);
  color: var(--page-location-text);
  display: grid;
  grid-template-rows: var(--location-header-height) minmax(0, 1fr) calc(var(--location-path-height) + var(--location-footer-height));
  height: min(640px, calc(100dvh - 48px));
  left: 50%;
  overflow: hidden;
  position: fixed;
  top: 24px;
  transform: translateX(-50%);
  width: min(720px, calc(100vw - 32px));
  z-index: 71;
}
.page-location-heading { align-items: center; background: var(--surface); border-bottom: 1px solid var(--border); color: var(--text); display: flex; padding: 0 var(--ui-space-24); }
.page-location-heading h1 { font: 600 var(--ui-text-20)/1.25 "Roboto", sans-serif; margin: 0; }
.page-location-browser { display: grid; grid-template-columns: 5fr 7fr; min-height: 0; }
.page-location-browser > section { border: 0; min-width: 0; }
.page-location-browser header {
  align-items: center;
  display: flex;
  height: 48px;
  justify-content: space-between;
  padding: 0 var(--ui-space-16);
}
.page-location-browser h2 { font: 400 var(--ui-text-14)/1 "Roboto", sans-serif; letter-spacing: .25px; margin: 0; }
.page-location-folders > header { padding-right: 19px; }
.page-location-folders { background: var(--page-location-folder-surface); border-right: 1px solid var(--border); overflow: auto; position: relative; }
.page-location-folders > header { background: var(--surface-muted); color: var(--text); }
.page-location-folders > header span { background: var(--page-location-on-accent); border-radius: 2px; color: var(--page-location-muted-text); font-weight: 700; line-height: 18px; text-align: center; width: 18px; }
.page-location-pages { background: var(--page-location-surface); overflow: auto; position: relative; }
.page-location-pages > header { background: var(--surface); color: var(--text); }
.page-location-root { height: 40px; }
.page-location-root button,
.page-location-tree button {
  align-items: center;
  background: var(--page-location-folder-surface);
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: var(--page-location-text);
  display: flex;
  font: 400 var(--ui-text-13)/1.3 "Roboto", sans-serif;
  gap: var(--ui-space-6);
  min-height: 40px;
  margin: 0;
  overflow-wrap: anywhere;
  padding: .625rem .875rem;
  text-align: left;
  width: 100%;
}
.page-location-root button span:last-child,
.page-location-tree button span:last-child { display: contents; overflow-wrap: anywhere; }
.page-location-root button > span:first-child,
.page-location-tree button > span:first-child { flex: 0 0 auto; font-size: 0; height: 16px; position: relative; }
.page-location-root button > span:first-child { width: 21px; }
.page-location-tree button > span:first-child { width: 18px; }
.page-location-root button > span:first-child::before { border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid var(--page-location-marker); content: ""; left: 0; position: absolute; top: 5px; }
.page-location-tree button > span:first-child::before { border-bottom: 5px solid transparent; border-left: 6px solid var(--page-location-marker); border-top: 5px solid transparent; content: ""; left: 0; position: absolute; top: 3px; transition: rotate .15s ease; transform-origin: .125rem .3125rem; }
.page-location-tree button[aria-expanded="true"] > span:first-child::before { rotate: 90deg; }
.page-location-root button span:last-child { color: var(--page-location-link); }
.page-location-root button strong,
.page-location-tree button strong {
  background: transparent;
  border: 2px solid var(--page-location-marker);
  border-radius: 2px;
  color: var(--page-location-marker);
  flex: 0 0 19px;
  font-size: 0;
  height: 14px;
  margin-right: 4px;
  position: relative;
}
.page-location-root button strong::before,
.page-location-tree button strong::before { border: 2px solid var(--page-location-marker); border-bottom: 0; border-radius: 2px 2px 0 0; content: ""; height: 5px; left: 1px; position: absolute; top: -6px; width: 8px; }
.page-location-tree,
.page-location-tree ul,
.page-location-pages ul { list-style: none; margin: 0; padding: 0; }
.page-location-tree { padding-left: 26px; }
.page-location-tree ul { padding-left: 22px; }
.page-location-tree ul[hidden] { display: none; }
.page-location-tree button:hover { background: var(--page-location-hover); }
.page-location-root button[aria-pressed="true"],
.page-location-tree button[aria-pressed="true"] { background: var(--page-location-selected); border: .0625rem solid var(--page-location-boundary); }
.page-location-tree button[aria-pressed="true"] { margin-left: -26px; padding-left: 40px; width: calc(100% + 26px); }
.page-location-tree button[aria-pressed="true"] span:last-child { color: var(--page-location-link); }
.page-location-pages li {
  background: var(--page-location-surface);
  display: block;
  font: 500 var(--ui-text-13)/1.3 "Roboto", sans-serif;
  min-height: 41px;
  padding: var(--ui-space-4) var(--ui-space-20);
}
.page-location-pages li:not(:last-child) { border-bottom: 1px solid var(--page-location-boundary); }
.page-location-pages li[hidden] { display: none; }
.page-location-pages li strong { display: contents; font-weight: inherit; overflow-wrap: anywhere; }
.page-location-empty { color: var(--page-location-muted-text); margin: 0; padding: 1.5rem 1.25rem; }
.page-location-empty[hidden] { display: none; }
.page-location-form { background: var(--surface); border-top: 1px solid var(--border); display: grid; grid-template-rows: var(--location-path-height) var(--location-footer-height); margin: 0; max-width: none; width: 100%; }
.page-location-path-row { align-items: start; display: grid; gap: var(--ui-space-12); grid-template-columns: 84px minmax(0, 1fr); min-width: 0; padding: var(--ui-space-16); }
.page-location-path-row > div { min-width: 0; }
.page-location-path-row label { font-size: var(--ui-text-14); font-weight: 500; line-height: 20px; margin: 0 0 var(--ui-space-8); }
.page-location-path-row select { appearance: auto; background-image: none; background: var(--surface); border: 1px solid var(--page-location-boundary); border-radius: var(--ui-control-radius); color: var(--text); height: 48px; padding: 0 var(--ui-space-8); width: 100%; }
.page-location-path-control { align-items: center; background: var(--surface); border: 1px solid var(--page-location-boundary); border-radius: var(--ui-control-radius); display: grid; grid-template-columns: 20px minmax(0, 1fr) 44px; min-width: 0; }
.page-location-path-prefix { color: var(--text-muted); text-align: center; }
.page-location-path-row input { background: transparent; border: 0; box-shadow: none; color: var(--text); font: 400 var(--ui-text-16)/1 "Roboto", sans-serif; height: 46px; margin: 0; min-width: 0; padding: 0; width: 100%; }
.page-location-clear { background: transparent; border: 0; color: var(--text-muted); font-size: 0; height: 44px; margin: 0; padding: 0; position: relative; }
.page-location-clear::before, .page-location-clear::after { background: currentColor; content: ""; height: 2px; left: 14px; position: absolute; top: 21px; width: 16px; }
.page-location-clear::before { rotate: 45deg; }
.page-location-clear::after { rotate: -45deg; }
.page-location-form footer { align-items: center; border-top: 1px solid var(--border); display: flex; gap: var(--ui-space-8); justify-content: flex-end; padding: 0 var(--ui-space-16); }
.page-location-cancel { align-items: center; background: transparent; border: 1px solid var(--page-location-boundary); border-radius: var(--ui-control-radius); color: var(--text); display: flex; font: 500 var(--ui-text-14)/1 "Roboto", sans-serif; min-height: 44px; justify-content: center; padding: var(--ui-space-12) var(--ui-space-16); text-decoration: none; }
.page-location-select { align-items: center; background: var(--accent); border: 0; border-radius: var(--ui-control-radius); box-shadow: none; color: var(--button-text); display: flex; font: 500 var(--ui-text-14)/1 "Roboto", sans-serif; gap: var(--ui-space-8); min-height: 44px; margin: 0; justify-content: center; padding: var(--ui-space-12) var(--ui-space-16); }
.page-location-select span { border-bottom: 2px solid currentColor; border-left: 2px solid currentColor; height: 8px; rotate: -45deg; width: 13px; }
.page-location-select:disabled { background: var(--page-location-hover); color: var(--page-location-muted-text); cursor: not-allowed; }
.page-location-dialog :is(button, a, input, select, [tabindex="0"]):focus-visible { outline: 2px solid var(--accent-readable); outline-offset: 2px; }
.page-location-feedback { background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--ui-feedback-radius); color: var(--text); display: flex; flex-wrap: wrap; gap: var(--ui-space-8); padding: var(--ui-space-16); }
.page-location-feedback[hidden], .page-location-feedback button[hidden] { display: none; }
.page-location-feedback p { color: var(--text); font-size: var(--ui-text-16); line-height: 1.5; margin: 0; width: 100%; }
.page-location-feedback button { background: var(--surface-muted); border: 1px solid var(--border-strong); color: var(--text); margin: 0; min-height: 44px; }
.page-location-feedback-floating { bottom: var(--ui-space-16); inset-inline: var(--ui-space-16); margin-inline-start: auto; max-width: 28rem; position: fixed; z-index: 80; }
.page-location-dialog .page-location-feedback { inset-inline: var(--ui-space-12); max-height: calc(100% - var(--location-header-height) - var(--location-footer-height)); overflow: auto; position: absolute; top: calc(var(--location-header-height) + var(--ui-space-8)); z-index: 2; }
body:has(.page-location-dialog[data-page-location-overlay="true"]) .page-heading .page-action:not(:first-child) { visibility: hidden; }
.header-icon-plus::before { content: "\F0EA7" / ""; }

@media (max-width: 56.25rem) {
  .page-location-dialog { grid-template-rows: var(--location-header-height) minmax(0, 1fr) calc(var(--location-path-height) + var(--location-footer-height)); height: calc(100vh - 32px); top: 16px; width: calc(100vw - 32px); }
  .page-location-browser { grid-template-columns: 1fr; }
  .page-location-pages { display: none; }
}
@media (max-width: 37.5rem) {
  .page-location-dialog { --location-path-height: 12rem; }
  .page-location-path-row { grid-template-columns: minmax(0, 1fr); }
  .page-location-path-row select { width: 5.25rem; }
}
.login-password-toggle::before { content: "\F0209" / ""; font: normal normal 400 var(--ui-text-22)/1 "Material Design Icons"; }
.login-password-toggle[aria-pressed="true"]::before { content: "\F0208" / ""; }
.login-password-toggle:focus-visible { outline: 3px solid var(--login-field-focus); outline-offset: -3px; }
.login-submit {
  background: var(--accent);
  border-radius: .5rem;
  box-shadow: none;
  color: var(--button-text);
  font: 500 var(--ui-text-16)/20px "Roboto", sans-serif;
  height: 48px;
  letter-spacing: normal;
  margin: .25rem 0 0;
  padding: 0 var(--ui-space-18);
  width: 100%;
}
.login-submit:hover { background: var(--accent-readable); }
.login-submit:focus-visible, .login-recovery a:focus-visible { outline: 3px solid var(--login-surface-focus); outline-offset: 3px; }
.login-recovery { height: 36px; margin: var(--ui-space-20) 0 0; text-align: center; }
.login-recovery a { align-items: center; color: var(--accent-readable); display: inline-flex; font-size: var(--ui-text-14); height: 36px; justify-content: center; padding: 0; text-decoration: underline; text-underline-offset: .2em; width: 167px; }
.login-recovery a:hover { text-decoration: underline; }
.login-panel .auth-provider-divider { color: var(--text-muted); }
.login-panel .auth-provider-button { background: var(--surface-muted); color: var(--text); }
.login-panel .auth-credential-provider { background: var(--surface-muted); }
.login-panel .auth-credential-provider label { color: var(--text); }
.login-panel .auth-credential-provider button { color: var(--button-text); }
.profile-password-disclosure { border-block-start: 1px solid var(--border); margin-block-start: var(--ui-space-16); }
.profile-password-disclosure > summary { cursor: pointer; font-size: var(--ui-text-14); font-weight: 500; min-height: 44px; padding-block: var(--ui-space-12); }
.profile-password-disclosure > summary:focus-visible { outline: 2px solid var(--accent-readable); outline-offset: 2px; }
.ui-status { background: var(--surface-muted); border-radius: 999px; color: var(--text-muted); font-size: var(--ui-text-12); font-weight: 750; padding: var(--ui-space-6) var(--ui-space-12); }
.ui-status.enabled { background: color-mix(in srgb, var(--success) 12%, var(--surface)); color: var(--success); }
.security-summary, .mfa-setup-panel, .recovery-code-panel { background: var(--surface-muted); border: 1px solid var(--border); border-radius: 9px; margin: var(--ui-space-24) 0; padding: var(--ui-space-24); }
.security-summary h2, .mfa-setup-panel h2, .recovery-code-panel h2 { font-size: var(--ui-text-22); margin-top: 0; }
.mfa-secret, .provisioning-uri { overflow-wrap: anywhere; user-select: all; }
.mfa-setup-grid { align-items: center; display: grid; gap: var(--ui-space-20); grid-template-columns: minmax(132px, 152px) 1fr; }
.mfa-qr-frame { background: var(--mfa-qr-invariant-canvas); border: 1px solid var(--border); border-radius: 9px; padding: var(--ui-space-8); }
.mfa-qr-code { display: block; height: auto; width: 100%; }
.recovery-code-panel ul { display: grid; gap: var(--ui-space-6) var(--ui-space-28); grid-template-columns: repeat(2, minmax(0, 1fr)); list-style: none; margin: var(--ui-space-16) 0 var(--ui-space-18); padding: 0; }
.recovery-code-panel li { background: var(--surface); border: 1px solid var(--border); border-radius: 6px; padding: var(--ui-space-6) var(--ui-space-10); text-align: center; }
body[data-shell-variant="account"] [data-testid="account-security"] {
  --account-mfa-boundary: color-mix(in srgb, var(--text) 55%, var(--surface));
  --account-mfa-danger-boundary: color-mix(in srgb, var(--danger) 65%, var(--surface));
  --account-mfa-danger-focus-inner: var(--danger-action-text);
  --account-mfa-danger-focus-outer: var(--accent-readable);
  --account-mfa-danger-text: var(--danger-action-text);
  --account-mfa-focus: var(--accent-readable);
  --account-mfa-panel-bg: var(--surface-muted);
  --account-mfa-qr-boundary: var(--account-mfa-boundary);
  --account-mfa-recovery-bg: var(--surface);
}

body[data-shell-variant="account"] [data-testid="account-security"] .danger-panel { border-color: var(--account-mfa-danger-boundary); }
body[data-shell-variant="account"] [data-testid="account-security"] .danger-action { color: var(--account-mfa-danger-text); }
body[data-shell-variant="account"] [data-testid="account-security"] :is(.security-summary, .mfa-setup-panel, .recovery-code-panel) {
  background: var(--account-mfa-panel-bg);
  border-color: var(--account-mfa-boundary);
}
body[data-shell-variant="account"] [data-testid="account-security"] :is(.mfa-setup-panel, .recovery-code-panel) { min-width: 0; }
body[data-shell-variant="account"] [data-testid="account-security"] .mfa-setup-panel form { max-width: 35rem; }
body[data-shell-variant="account"] [data-testid="account-security"] input:not([type="hidden"]) { border-color: var(--account-mfa-boundary); }
body[data-shell-variant="account"] [data-testid="account-security"] .mfa-qr-frame { border-color: var(--account-mfa-qr-boundary); }
body[data-shell-variant="account"] [data-testid="account-security"] .recovery-code-panel ul { min-width: 0; }
body[data-shell-variant="account"] [data-testid="account-security"] .recovery-code-panel li {
  background: var(--account-mfa-recovery-bg);
  border-color: var(--account-mfa-boundary);
  min-width: 0;
}
body[data-shell-variant="account"] [data-testid="account-security"] .recovery-code-panel code {
  display: block;
  font-family: "Roboto Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
  min-width: 0;
  overflow-wrap: anywhere;
  user-select: all;
}
body[data-shell-variant="account"] [data-testid="account-security"] .recovery-code-panel .primary-link { color: var(--accent-readable); }
body[data-shell-variant="account"] [data-testid="account-security"] :is(input, button, summary, .primary-link):focus-visible {
  outline: 3px solid var(--account-mfa-focus);
  outline-offset: 2px;
}
body[data-shell-variant="account"] [data-testid="account-security"] .danger-action:focus-visible {
  box-shadow: 0 0 0 6px var(--account-mfa-danger-focus-outer);
  outline-color: var(--account-mfa-danger-focus-inner);
  outline-offset: 0;
}
.danger-panel { border: 1px solid color-mix(in srgb, var(--danger) 45%, var(--border)); border-radius: 9px; margin-top: 28px; padding: 0 var(--ui-space-18) var(--ui-space-18); }
.danger-panel summary { color: var(--danger); cursor: pointer; font-weight: 750; padding: var(--ui-space-16) 0; }
.security-related-link { margin: var(--ui-space-8) 0 0; }
.token-secret-panel { background: color-mix(in srgb, var(--success) 9%, var(--surface)); border: 1px solid color-mix(in srgb, var(--success) 35%, var(--border)); border-radius: 9px; margin: var(--ui-space-24) 0; padding: var(--ui-space-20) var(--ui-space-24); }
.token-secret-panel h2 { font-size: var(--ui-text-20); margin: 0 0 var(--ui-space-6); }
.token-secret-panel p { margin: 0 0 var(--ui-space-14); }
.token-secret-panel > code { background: var(--surface); border: 1px solid var(--border); border-radius: 6px; display: block; overflow-wrap: anywhere; padding: var(--ui-space-12); user-select: all; }
.token-management-shell .ui-page-heading { margin-bottom: 6px; }
.token-management-grid { align-items: start; display: grid; gap: var(--ui-space-32); grid-template-columns: minmax(0, 1fr); margin-top: 0; }
.token-management-grid > .token-list-panel:only-child { grid-column: 1 / -1; }
.token-create-panel, .token-list-panel { border: 0; border-top: 1px solid var(--border); border-radius: 0; padding: var(--ui-space-24) 0; }
.token-create-panel h2, .token-list-panel h2 { font-size: var(--ui-text-22); margin-top: 0; }
.token-create-panel label { margin-top: 10px; }
.token-primary-fields { display: grid; gap: var(--ui-space-10); grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); }
.token-scope-list { border: 1px solid var(--border); border-radius: 7px; display: grid; gap: var(--ui-space-2) var(--ui-space-8); grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 12px; padding: var(--ui-space-8) var(--ui-space-10); }
.token-scope-list legend { font-weight: 750; padding: 0 var(--ui-space-6); }
.token-scope-list label { align-items: center; display: flex; font-size: var(--ui-text-12); gap: var(--ui-space-6); margin: var(--ui-space-4) 0; }
.token-scope-list input { width: auto; }
.token-create-panel button { margin-top: 10px; }
.token-list { display: grid; gap: var(--ui-space-12); }
.token-card { border: 1px solid var(--border); border-radius: 8px; padding: var(--ui-space-16); }
.token-card header { align-items: flex-start; display: flex; gap: var(--ui-space-16); justify-content: space-between; }
.token-card h3 { font-size: var(--ui-text-18); margin: 0 0 var(--ui-space-4); }
.token-scopes { display: flex; flex-wrap: wrap; gap: var(--ui-space-6); margin: var(--ui-space-14) 0; }
.token-scopes code { background: var(--surface-muted); border-radius: 4px; padding: var(--ui-space-4) var(--ui-space-6); }
.token-card dl { color: var(--text-muted); display: grid; font-size: var(--ui-text-13); gap: var(--ui-space-4); margin: 0; }
.token-card dl div { display: grid; grid-template-columns: 78px 1fr; }
.token-card dt { font-weight: 700; }
.token-card dd { margin: 0; }
.token-card form { text-align: right; }
.token-card .danger-action { margin-top: 12px; }
body[data-shell-variant="admin"] [data-testid="system-api-key-management"] {
  --system-api-boundary: var(--text-muted);
  --system-api-danger-bg: var(--danger);
  --system-api-danger-text: var(--danger-action-text);
  --system-api-focus: var(--accent-readable);
  --system-api-muted-surface: var(--surface-muted);
  --system-api-surface: var(--surface);
  background: var(--system-api-surface);
  border-color: var(--system-api-boundary);
  min-width: 0;
}
body[data-shell-variant="admin"] [data-testid="system-api-key-management"] :is(.token-management-grid, .token-create-panel, .token-list-panel, .token-list, .token-card, .token-card header, .token-card header > div, .token-card dl div, fieldset) { min-width: 0; }
body[data-shell-variant="admin"] [data-testid="system-api-key-management"] :is(.token-create-panel, .token-list-panel, .token-card, fieldset, input, select, .token-secret-panel, .token-secret-panel > code) { border-color: var(--system-api-boundary); }
body[data-shell-variant="admin"] [data-testid="system-api-key-management"] :is(.token-create-panel, .token-list-panel, .token-card, .token-secret-panel > code) { background: var(--system-api-surface); }
body[data-shell-variant="admin"] [data-testid="system-api-key-management"] .token-secret-panel { background: var(--system-api-muted-surface); min-width: 0; }
body[data-shell-variant="admin"] [data-testid="system-api-key-management"] :is(.token-secret-panel > code, .token-card h3, .token-card code, .token-card p, .token-card dd, .token-create-panel label) { overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-testid="system-api-key-management"] .token-card header .ui-status { flex: 0 0 auto; white-space: nowrap; }
body[data-shell-variant="admin"] [data-testid="system-api-key-management"] .danger-action { background: var(--system-api-danger-bg); border-color: var(--system-api-danger-bg); color: var(--system-api-danger-text); }
body[data-shell-variant="admin"] [data-testid="system-api-key-management"] :is(input, select, button, [tabindex="-1"]):focus-visible { outline: .1875rem solid var(--system-api-focus); outline-offset: .125rem; }
body[data-shell-variant="account"] [data-testid="api-token-management"] {
  --account-token-boundary: color-mix(in srgb, var(--text) 55%, var(--surface));
  --account-token-copy-bg: var(--accent-readable);
  --account-token-copy-text: var(--button-text);
  --account-token-danger-text: var(--danger-action-text);
  --account-token-focus: var(--accent-readable);
  --account-token-panel-bg: var(--surface);
  --account-token-secret-bg: color-mix(in srgb, var(--success) 9%, var(--surface));
  --account-token-secret-boundary: color-mix(in srgb, var(--success) 70%, var(--surface));
  --account-token-scope-bg: var(--surface-muted);
}
body[data-shell-variant="account"] [data-testid="api-token-management"] :is(.token-card, .token-scope-list) {
  background: var(--account-token-panel-bg);
  border-color: var(--account-token-boundary);
  min-width: 0;
}
body[data-shell-variant="account"] [data-testid="api-token-management"] .token-secret-panel {
  background: var(--account-token-secret-bg);
  border-color: var(--account-token-secret-boundary);
  min-width: 0;
}
body[data-shell-variant="account"] [data-testid="api-token-management"] .token-secret-value {
  align-items: stretch;
  display: grid;
  gap: var(--ui-space-10);
  grid-template-columns: minmax(0, 1fr) auto;
}
body[data-shell-variant="account"] [data-testid="api-token-management"] .token-secret-value > code {
  background: var(--account-token-panel-bg);
  border: 1px solid var(--account-token-boundary);
  border-radius: 6px;
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  padding: var(--ui-space-12);
  user-select: all;
}
body[data-shell-variant="account"] [data-testid="api-token-management"] :is(.token-secret-value > code, .token-card code, .token-scope-list code) {
  font-family: "Roboto Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
}
body[data-shell-variant="account"] [data-testid="api-token-management"] [data-token-copy] {
  background: var(--account-token-copy-bg);
  color: var(--account-token-copy-text);
  margin: 0;
}
body[data-shell-variant="account"] [data-testid="api-token-management"] .token-copy-status {
  color: var(--text-muted);
  margin: var(--ui-space-8) 0 0;
  min-height: 1.5em;
}
body[data-shell-variant="account"] [data-testid="api-token-management"] :is(input, select, button, .ui-section-nav a):focus-visible {
  outline: 3px solid var(--account-token-focus);
  outline-offset: 2px;
}
body[data-shell-variant="account"] [data-testid="api-token-management"] :is(input, select) { border-color: var(--account-token-boundary); }
body[data-shell-variant="account"] [data-testid="api-token-management"] .token-scope-list code,
body[data-shell-variant="account"] [data-testid="api-token-management"] .token-scopes code {
  background: var(--account-token-scope-bg);
  overflow-wrap: anywhere;
}
body[data-shell-variant="account"] [data-testid="api-token-management"] :is(.token-card header > div, .token-card dd, .token-scopes, .token-scope-list label) { min-width: 0; }
body[data-shell-variant="account"] [data-testid="api-token-management"] :is(.token-card h3, .token-card dd) { overflow-wrap: anywhere; }
body[data-shell-variant="account"] [data-testid="api-token-management"] .danger-action { color: var(--account-token-danger-text); }
.ui-section-nav { align-items: center; display: flex; flex-wrap: wrap; gap: var(--ui-space-8) var(--ui-space-14); justify-content: flex-end; }
.ui-section-nav a { color: var(--accent-readable); font-size: var(--ui-text-13); font-weight: 750; text-decoration: none; }
.ui-section-nav a:hover { text-decoration: underline; }
.profile-shell .ui-page-heading { margin-bottom: 18px; }
.profile-shell { max-width: 1040px; }
@media (min-width: 56.3125rem) {
  body[data-shell-variant="account"] .app-header { background: var(--header); height: var(--shell-header-height); padding: 0 var(--ui-space-16); }
  body[data-shell-variant="account"] .app-header .app-brand { font-size: var(--ui-text-20); font-weight: 400; }
  body[data-shell-variant="account"] .header-search button { display: none; }
  body[data-shell-variant="account"] .app-header-actions { align-self: stretch; padding-right: 0; }
  body[data-shell-variant="account"] .app-header-actions nav { gap: 0; height: var(--shell-header-height); }
  body[data-shell-variant="account"] .app-header-actions nav form { height: var(--shell-header-height); margin: 0; order: 1; }
  body[data-shell-variant="account"] .app-header-actions nav form button { border: 0; font-size: var(--ui-text-14); height: var(--shell-header-height); margin: 0; padding: 0 var(--ui-space-12); width: auto; }
  body[data-shell-variant="account"] .app-header-actions nav form button::before { content: none; }
  body[data-shell-variant="account"] .app-layout[data-sidebar="true"] { grid-template-columns: var(--shell-sidebar-width) minmax(0, 1fr); }
  body[data-shell-variant="account"] .app-sidebar { background: var(--shell-sidebar-bg); border-color: var(--shell-sidebar-border); padding: var(--shell-sidebar-padding); }
  body[data-shell-variant="account"] .app-sidebar .primary-navigation { gap: var(--shell-navigation-gap); }
  body[data-shell-variant="account"] .app-sidebar a { border-radius: var(--shell-navigation-radius); color: var(--shell-navigation-text); font-size: var(--ui-text-14); font-weight: 500; min-height: var(--shell-navigation-item-height); padding: var(--ui-space-12) var(--ui-space-16); }
  body[data-shell-variant="account"] .app-sidebar a { padding-left: 44px; position: relative; }
  body[data-shell-variant="account"] .app-sidebar a::before { color: var(--shell-navigation-muted); font: normal normal 400 var(--ui-text-22)/1 "Material Design Icons"; left: 12px; position: absolute; top: 9px; }
  body[data-shell-variant="account"] .app-sidebar [data-navigation-icon="profile"]::before { content: "\F0009" / ""; }
  body[data-shell-variant="account"] .app-sidebar [data-navigation-icon="password"]::before { content: "\F05B7" / ""; }
  body[data-shell-variant="account"] .app-sidebar [data-navigation-icon="authenticator"]::before { content: "\F0A7E" / ""; }
  body[data-shell-variant="account"] .app-sidebar [data-navigation-icon="sessions"]::before { content: "\F01F0" / ""; }
  body[data-shell-variant="account"] .app-sidebar [data-navigation-icon="tokens"]::before { content: "\F089A" / ""; }
  body[data-shell-variant="account"] .app-sidebar [data-navigation-icon="connections"]::before { content: "\F0337" / ""; }
  body[data-shell-variant="account"] .app-sidebar [data-navigation-icon="pages"]::before { content: "\F0224" / ""; }
  body[data-shell-variant="account"] .app-sidebar a[aria-current="page"]::before { color: var(--shell-navigation-active-text); }
  body[data-shell-variant="account"] main#main-content { margin: 0; max-width: none; padding: var(--ui-space-16) var(--ui-space-12) 0; }
  body[data-shell-variant="account"] main#main-content > .identity-admin-shell { background: transparent; border: 0; border-radius: 0; max-width: none; padding: 0; }
  body[data-shell-variant="account"] .app-footer { background: transparent; border: 0; color: var(--shell-footer-text); font-size: var(--ui-text-12); height: 32px; justify-content: center; margin-left: var(--shell-sidebar-width); padding: 0; }
  body[data-shell-variant="account"] .app-footer span:first-child::before { content: "Powered by "; }
  body[data-shell-variant="account"] .app-footer span + span { display: none; }
  body[data-shell-variant="account"] .ui-page-heading { min-height: 0; padding: 0; }
  body[data-shell-variant="account"] .ui-page-heading > div { min-height: 0; min-width: 0; padding-left: 0; }
  body[data-shell-variant="account"] .ui-page-heading > div::before { content: none; }
  body[data-shell-variant="account"] .ui-page-heading .eyebrow { display: none; }
  body[data-shell-variant="account"] .ui-page-heading h1 { font-size: var(--ui-page-title-size); font-weight: 700; margin-top: 0; }
  body[data-shell-variant="account"] .ui-page-heading p:not(.eyebrow) { color: var(--shell-heading-muted); }
  body[data-shell-variant="account"] .profile-parity-grid { gap: var(--ui-space-32); }
  body[data-shell-variant="account"] .profile-card { border-color: var(--shell-card-border); }
  body[data-shell-variant="account"] .profile-card { min-height: 0; }
}
.profile-heading { align-items: start; display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--ui-space-16); margin-bottom: var(--ui-space-32); }
.profile-heading > div:first-child { min-width: 0; }
.profile-heading h1 { color: inherit; font-size: var(--ui-page-title-size); font-weight: 600; margin: 0 0 var(--ui-space-8); }
.profile-heading p:not(.eyebrow) { color: var(--text-muted); margin: 0; }
.profile-heading-actions { align-items: center; display: flex; flex: 0 1 auto; flex-wrap: wrap; gap: var(--ui-space-10); justify-content: flex-end; min-width: 0; }
.profile-save { align-items: center; align-self: auto; background: var(--accent); color: var(--button-text); display: inline-flex; min-height: 44px; justify-content: center; margin: 0; min-width: 100px; }
.profile-save:focus-visible { outline: 3px solid var(--profile-focus); outline-offset: 2px; }
.profile-save::before { content: "\F012C" / ""; font: normal normal 400 var(--ui-text-20)/1 "Material Design Icons"; margin-right: 8px; }
.profile-form-anchor { display: none; }
.profile-parity-grid { align-items: start; display: grid; gap: var(--ui-space-32); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.profile-column { display: grid; gap: var(--ui-space-32); min-width: 0; }
.profile-card { background: transparent; border: 0; border-top: 1px solid var(--border); border-radius: 0; box-shadow: none; min-width: 0; overflow: visible; }
.profile-card > h2 { background: transparent; color: var(--text); font-size: var(--ui-text-18); font-weight: 600; margin: 0; overflow-wrap: anywhere; padding: var(--ui-space-20) 0 var(--ui-space-12); }
.profile-groups-card > h2 { background: transparent; }
.profile-activity-card > h2 { background: transparent; }
.profile-card-body { min-width: 0; padding: 0; }
.profile-card-body > label { display: block; margin: var(--ui-space-12) 0 var(--ui-space-6); }
.profile-card-body > label:first-child { margin-top: 0; }
.profile-card-body :is(input, select) { box-sizing: border-box; min-width: 0; width: 100%; }
.profile-preferences-card .profile-card-body { display: grid; grid-template-columns: 1fr; padding: 0; }
.profile-preferences-card .profile-edit-value { box-sizing: border-box; min-height: 72px; padding: var(--ui-space-12) 0; }
.profile-preferences-card .profile-edit-value > label strong, .profile-preferences-card .profile-edit-value > label span { line-height: 1.15; }
.profile-preferences-card .profile-edit-value > label span { margin-top: 1px; }
.profile-preferences-card .profile-edit-value:last-child { border-bottom: 0; }
.profile-edit-value > select { border: 1px solid var(--border-strong); grid-column: 1 / -1; min-height: 44px; padding: var(--ui-space-10) var(--ui-space-12); width: 100%; }
.profile-edit-value:not([data-editing="true"]) > select { display: none; }
.profile-info-list { display: grid; grid-template-columns: 1fr; padding: 0; }
.profile-email { display: none; }
.profile-edit-value { align-items: center; border-bottom: 1px solid var(--border); display: grid; gap: var(--ui-space-8); grid-template-columns: minmax(0, 1fr) auto; min-height: 72px; min-width: 0; padding: var(--ui-space-12) 0; position: relative; }
.profile-edit-value::before { content: none; display: none; }
.profile-edit-value > label { margin: 0; min-width: 0; }
.profile-edit-value > label strong, .profile-edit-value > label span { display: block; }
.profile-edit-value > label strong { font-size: var(--ui-text-13); font-weight: 500; }
.profile-edit-value > label span { color: var(--text-muted); font-size: var(--ui-text-13); font-weight: 400; margin-top: 3px; overflow-wrap: anywhere; }
.profile-edit-value > label span:empty::before { content: "—"; }
.profile-edit-value > button { background: transparent; border: 0; color: var(--accent-readable); font-size: var(--ui-text-14); margin: 0; min-height: 44px; padding: var(--ui-space-8); }
.profile-edit-value > button::before { content: "\F03EB" / ""; font: normal normal 400 var(--ui-text-16)/1 "Material Design Icons"; margin-right: 8px; vertical-align: -2px; }
.profile-edit-value > input { border: 1px solid var(--border-strong); grid-column: 1 / -1; min-height: 44px; padding: var(--ui-space-10) var(--ui-space-12); width: 100%; }
.profile-edit-value:not([data-editing="true"]) > input { display: none; }
.profile-edit-value[data-editing="true"] > button, .profile-edit-value[data-editing="true"] > label span { display: none; }
.profile-card-label { color: var(--text-muted); font-size: var(--ui-text-13); margin: 0 0 var(--ui-space-6); }
.profile-provider { background: transparent; color: var(--text); margin: 0 0 var(--ui-space-12); padding: 0; }
.profile-provider::before { content: none; }
.profile-auth-card > .profile-card-body > .ui-status { display: none; }
.profile-auth-card h3 { border-top: 1px solid var(--border); font-size: var(--ui-text-14); font-weight: 500; margin: var(--ui-space-12) 0 0; padding-top: 14px; }
.profile-password-form label { display: block; font-size: var(--ui-text-14); margin: var(--ui-space-16) 0 var(--ui-space-8); }
.profile-password-form { position: relative; }
.profile-password-form input { background: var(--surface); color: var(--text); min-height: 48px; margin: 0; }
.profile-password-form label:first-of-type + input { margin-top: 0; }
.profile-password-form button { background: var(--accent); color: var(--button-text); display: block; min-height: 44px; margin: var(--ui-space-20) 0 0; width: auto; }
.profile-groups-card .profile-summary-list { margin: 0; }
.profile-groups-card .profile-summary-list li { border: 0; min-height: 32px; padding: var(--ui-space-8) 0 var(--ui-space-8) var(--ui-space-48); position: relative; }
.profile-groups-card .profile-summary-list li, .profile-groups-card .profile-summary-list :is(strong, span) { min-width: 0; overflow-wrap: anywhere; }
.profile-groups-card .profile-summary-list li::before { color: var(--profile-icon-muted); content: "\F0849" / ""; font: normal normal 400 var(--ui-text-24)/1 "Material Design Icons"; left: 2px; position: absolute; top: 8px; }
.profile-activity-card .profile-card-body { box-sizing: border-box; margin: 0; padding: var(--ui-space-12) var(--ui-space-16); }
.profile-activity-card .profile-summary-list li { border: 0; padding: var(--ui-space-6) 0; }
.profile-activity-card .profile-summary-list li:nth-child(4) { border-top: 1px solid var(--border); margin-top: 5px; padding-top: 13px; }
.profile-activity-card .profile-summary-list span { display: block; }
.profile-activity-card .profile-summary-list strong { color: var(--profile-summary-muted); display: block; font-size: var(--ui-text-14); margin-top: 3px; }
.profile-secondary-links { justify-content: flex-end; margin-top: 14px; }
.profile-grid { align-items: start; display: grid; gap: var(--ui-space-28); grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr); }
.profile-grid form { max-width: none; }
.profile-grid label { margin-top: 14px; }
body[data-shell-variant="account"] [data-testid="external-connections"] {
  --account-connection-boundary: color-mix(in srgb, var(--text) 55%, var(--surface));
  --account-connection-danger-text: var(--danger-action-text);
  --account-connection-error-bg: var(--ui-error-bg);
  --account-connection-error-boundary: color-mix(in srgb, var(--danger) 65%, var(--surface));
  --account-connection-error-text: var(--danger);
  --account-connection-focus: var(--accent-readable);
  --account-connection-panel-bg: var(--surface);
  --account-connection-unavailable-bg: var(--surface-muted);
}
body[data-shell-variant="account"] [data-testid="external-connections"] :is(.connection-provider-card, .connection-empty-state) {
  background: var(--account-connection-panel-bg);
  border: 1px solid var(--account-connection-boundary);
  border-radius: var(--ui-panel-radius);
  box-sizing: border-box;
  min-width: 0;
}
body[data-shell-variant="account"] [data-testid="external-connections"] .connection-empty-state { padding: var(--ui-empty-padding); }
body[data-shell-variant="account"] [data-testid="external-connections"] .connection-empty-state :is(h2, p) { margin: 0; }
body[data-shell-variant="account"] [data-testid="external-connections"] .connection-empty-state p { color: var(--text-muted); margin-top: 8px; }
body[data-shell-variant="account"] [data-testid="external-connections"] .connection-provider-card > header {
  align-items: flex-start;
  display: flex;
  gap: var(--ui-space-12);
  justify-content: space-between;
}
body[data-shell-variant="account"] [data-testid="external-connections"] :is(.connection-provider-card > header > div, .connection-identity, .connection-form, .connection-form label, .connection-availability-note) { min-width: 0; }
body[data-shell-variant="account"] [data-testid="external-connections"] :is(.connection-provider-card h2, .connection-identity, .connection-form label, .connection-form button, .connection-availability-note) { overflow-wrap: anywhere; }
body[data-shell-variant="account"] [data-testid="external-connections"] .connection-availability-note {
  background: var(--account-connection-unavailable-bg);
  border: 1px solid var(--account-connection-boundary);
  border-radius: var(--ui-feedback-radius);
  padding: var(--ui-feedback-padding);
}
body[data-shell-variant="account"] [data-testid="external-connections"] .ui-status { border: 1px solid var(--account-connection-boundary); }
body[data-shell-variant="account"] [data-testid="external-connections"] :is(.connection-feedback, .connection-form) { max-width: 35rem; }
body[data-shell-variant="account"] [data-testid="external-connections"] .connection-feedback {
  border-radius: var(--ui-feedback-radius);
  box-sizing: border-box;
  overflow-wrap: anywhere;
  padding: var(--ui-feedback-padding);
}
body[data-shell-variant="account"] [data-testid="external-connections"] .connection-feedback-error {
  background: var(--account-connection-error-bg);
  border-color: var(--account-connection-error-boundary);
  color: var(--account-connection-error-text);
}
body[data-shell-variant="account"] [data-testid="external-connections"] .ui-feedback.connection-feedback { border-color: var(--account-connection-boundary); }
body[data-shell-variant="account"] [data-testid="external-connections"] .connection-form :is(input, button) { max-width: 100%; }
body[data-shell-variant="account"] [data-testid="external-connections"] .connection-form input { border-color: var(--account-connection-boundary); min-width: 0; width: 100%; }
body[data-shell-variant="account"] [data-testid="external-connections"] .connection-form input[aria-invalid="true"] { border-color: var(--account-connection-error-boundary); }
body[data-shell-variant="account"] [data-testid="external-connections"] :is(input, button, .ui-section-nav a):focus-visible {
  outline: 3px solid var(--account-connection-focus);
  outline-offset: 2px;
}
body[data-shell-variant="account"] [data-testid="external-connections"] .danger-action { color: var(--account-connection-danger-text); }
body[data-shell-variant="account"] [data-testid="external-connections"] .danger-action:focus-visible {
  box-shadow: 0 0 0 6px var(--account-connection-focus);
  outline-color: var(--account-connection-danger-text);
  outline-offset: 0;
}
.profile-details-grid { display: grid; gap: var(--ui-space-14); grid-template-columns: repeat(3, minmax(0, 1fr)); }
.profile-details-grid input { width: 100%; }
/* .field-hint describes a control and is announced with it; .ui-note is prose
   about the section it sits in and is announced with nothing. They were one
   class doing both jobs, which is why eighteen paragraphs promised a field that
   was not there. Same appearance, different obligation. */
.field-hint, .ui-note { color: var(--text-muted); font-size: var(--ui-text-12); margin: var(--ui-space-6) 0 0; }
.profile-choice-grid { display: grid; gap: var(--ui-space-14); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.profile-identity-card { background: var(--surface-muted); border: 1px solid var(--border); border-radius: 9px; padding: var(--ui-space-24); }
.profile-identity-card > .eyebrow { color: var(--accent-readable); }
body[data-shell-variant="account"] [data-testid="password-change"] {
  --account-password-control-border: color-mix(in srgb, var(--text) 55%, var(--surface));
  --account-password-error-border: color-mix(in srgb, var(--danger) 65%, var(--surface));
}
body[data-shell-variant="account"] [data-testid="password-change"] :is(.password-change-form, .password-change-feedback) { max-width: 35rem; }
body[data-shell-variant="account"] [data-testid="password-change"] .password-change-feedback { border-color: var(--account-password-error-border); overflow-wrap: anywhere; }
body[data-shell-variant="account"] [data-testid="password-change"] .password-change-form input { border-color: var(--account-password-control-border); }
body[data-shell-variant="account"] [data-testid="password-change"] .password-change-form :is(input, button):focus-visible { outline: 3px solid var(--accent-readable); outline-offset: 2px; }
body[data-shell-variant="account"] [data-testid="password-change"] .password-change-form label { margin-top: 10px; }
.profile-summary-list { list-style: none; margin: var(--ui-space-8) 0 var(--ui-space-18); padding: 0; }
.profile-summary-list li { border-top: 1px solid var(--border); padding: var(--ui-space-8) 0; }
.profile-summary-list strong, .profile-summary-list span { display: block; }
.profile-summary-list span { color: var(--text-muted); font-size: var(--ui-text-12); }
.profile-identity-card h2 { font-size: var(--ui-text-18); margin: var(--ui-space-4) 0 var(--ui-space-14); overflow-wrap: anywhere; }
.profile-identity-card > p:last-child { color: var(--text-muted); font-size: var(--ui-text-13); margin: var(--ui-space-18) 0 0; }
.session-management-shell .ui-page-heading { margin-bottom: 16px; }
.session-revoke-others { border-bottom: 1px solid var(--border); margin: 0 0 var(--ui-space-18); max-width: none; padding-bottom: 18px; text-align: right; }
.session-revoke-others button { margin: 0; }
.session-list { display: grid; gap: var(--ui-space-12); }
.session-card { border: 0; border-top: 1px solid var(--border); border-radius: 0; padding: var(--ui-space-24) 0; }
.session-card[data-current="true"] { border-color: color-mix(in srgb, var(--success) 35%, var(--border)); }
.session-card header { align-items: flex-start; display: flex; gap: var(--ui-space-18); justify-content: space-between; }
.session-card header form, .session-card header button { margin: 0; }
.session-card header button { padding: var(--ui-space-8) var(--ui-space-12); }
.session-client { align-items: center; display: flex; gap: var(--ui-space-14); min-width: 0; }
.session-client h2 { font-size: var(--ui-text-18); margin: 0 0 var(--ui-space-4); }
.session-client p { color: var(--text-muted); font-size: var(--ui-text-13); margin: 0; }
.session-device-mark { background: color-mix(in srgb, var(--accent) 14%, var(--surface)); border: 2px solid var(--accent-readable); border-radius: 4px; display: block; flex: 0 0 28px; height: 20px; position: relative; }
.session-device-mark::after { background: var(--accent-readable); bottom: -6px; content: ""; height: 2px; left: 7px; position: absolute; width: 10px; }
.session-metadata { display: grid; gap: var(--ui-space-10) var(--ui-space-24); grid-template-columns: repeat(3, minmax(0, 1fr)); margin: var(--ui-space-18) 0 0 var(--ui-space-40); }
.session-metadata div { min-width: 0; }
.session-metadata dt { color: var(--text-muted); font-size: var(--ui-text-11); font-weight: 750; text-transform: uppercase; }
.session-metadata dd { font-size: var(--ui-text-13); margin: var(--ui-space-4) 0 0; }
.session-user-agent { color: var(--text-muted); font-size: var(--ui-text-12); margin: var(--ui-space-14) 0 0 var(--ui-space-40); }
.session-user-agent summary { cursor: pointer; }
.session-user-agent code { display: block; font-size: var(--ui-text-11); margin-top: 7px; overflow-wrap: anywhere; white-space: normal; }
body[data-shell-variant="account"] [data-testid="session-management"] {
  --account-session-boundary: var(--text-muted);
  --account-session-danger-text: var(--danger-action-text);
  --account-session-focus: var(--accent-readable);
  --account-session-muted-surface: var(--surface-muted);
  --account-session-surface: var(--surface);
  min-width: 0;
}
body[data-shell-variant="account"] [data-testid="session-management"] :is(.ui-page-heading > div, .session-list, .session-card, .session-card header, .session-client, .session-client > div, .session-metadata, .session-metadata div, .session-user-agent) { min-width: 0; }
body[data-shell-variant="account"] [data-testid="session-management"] :is(.ui-page-heading h1, .ui-page-heading p, .session-client h2, .session-client p, .session-metadata dd, .session-user-agent summary, .session-user-agent code, .session-empty-state) { overflow-wrap: anywhere; }
body[data-shell-variant="account"] [data-testid="session-management"] :is(.session-card, .session-revoke-others, .session-user-agent code, .ui-status) { border-color: var(--account-session-boundary); }
body[data-shell-variant="account"] [data-testid="session-management"] .session-card { background: transparent; }
body[data-shell-variant="account"] [data-testid="session-management"] .session-card[data-current="true"] {
  border-color: var(--account-session-boundary);
  box-shadow: none;
}
body[data-shell-variant="account"] [data-testid="session-management"] .session-user-agent code {
  background: var(--account-session-muted-surface);
  border: 1px solid var(--account-session-boundary);
  border-radius: var(--ui-feedback-radius);
  padding: var(--ui-space-10);
}
body[data-shell-variant="account"] [data-testid="session-management"] .session-management-notice { border-color: var(--account-session-boundary); }
body[data-shell-variant="account"] [data-testid="session-management"] .danger-action { color: var(--account-session-danger-text); }
body[data-shell-variant="account"] [data-testid="session-management"] :is(button, summary, .ui-section-nav a, [tabindex="-1"]):focus-visible {
  outline: 3px solid var(--account-session-focus);
  outline-offset: 2px;
}
@media (max-width: 37.5rem) {
  body[data-shell-variant="account"] [data-testid="session-management"] .session-card header { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="account"] [data-testid="session-management"] .session-card header form,
  body[data-shell-variant="account"] [data-testid="session-management"] .session-card header button,
  body[data-shell-variant="account"] [data-testid="session-management"] .session-revoke-others button { box-sizing: border-box; width: 100%; }
  body[data-shell-variant="account"] [data-testid="session-management"] :is(.session-metadata, .session-user-agent) { margin-left: 0; }
}
.auth-provider-shell .ui-page-heading { margin-bottom: 14px; }
.provider-section-heading, .provider-actions { align-items: center; display: flex; gap: var(--ui-space-10); }
.provider-actions { flex-wrap: wrap; grid-column: 1 / -1; }
.provider-actions form { margin: 0; }
.provider-configure { border-top: 1px solid var(--border); margin-top: 28px; padding-top: 24px; }
.provider-configure-form { background: var(--surface-muted); border: var(--ui-panel-border); border-radius: var(--ui-panel-radius); margin-top: 16px; padding: var(--ui-panel-padding); }
.provider-configure-form h3 { margin-top: 0; }
.provider-readiness { background: var(--surface-muted); border: 1px solid var(--border); border-radius: 9px; display: grid; grid-template-columns: repeat(3, 1fr); margin: 0 0 var(--ui-space-14); }
.provider-readiness > div { display: grid; gap: var(--ui-space-2); padding: var(--ui-space-12) var(--ui-space-20); }
.provider-readiness > div + div { border-left: 1px solid var(--border); }
.provider-readiness strong { font-size: var(--ui-text-20); }
.provider-readiness span { color: var(--text-muted); font-size: var(--ui-text-12); }
.provider-readiness .readiness-ok { color: var(--success); }
.provider-catalog h2, .provider-configurations h2 { font-size: var(--ui-text-22); }
.provider-definition-list { display: grid; gap: var(--ui-space-14); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.provider-definition-card { border: 1px solid var(--border); border-radius: 9px; padding: var(--ui-space-14) var(--ui-space-18); }
.provider-definition-card:only-child { grid-column: 1 / -1; }
.provider-definition-card > header { align-items: flex-start; display: flex; gap: var(--ui-space-16); justify-content: space-between; }
.provider-definition-card h3 { font-size: var(--ui-text-20); margin: var(--ui-space-2) 0 0; }
.provider-definition-card > p { color: var(--text-muted); margin: var(--ui-space-8) 0; }
.provider-kind { color: var(--accent); font-size: var(--ui-text-12); font-weight: 750; letter-spacing: .08em; margin: 0; text-transform: uppercase; }
.provider-definition-card dl { display: grid; font-size: var(--ui-text-13); gap: var(--ui-space-6); margin: 0; }
.provider-definition-card dl div { display: grid; grid-template-columns: 82px 1fr; }
.provider-definition-card dt { font-weight: 750; }
.provider-definition-card dd { margin: 0; }
.provider-schema { border-top: 1px solid var(--border); margin-top: 14px; padding-top: 12px; }
.provider-schema summary { cursor: pointer; font-weight: 700; }
.provider-schema ul { display: grid; gap: var(--ui-space-6); list-style: none; margin: var(--ui-space-10) 0 0; padding: 0; }
.provider-schema li { align-items: center; display: flex; flex-wrap: wrap; gap: var(--ui-space-6); }
.provider-configurations { margin-top: 14px; }
.provider-configurations .empty-state { min-height: var(--ui-empty-min-height); padding: var(--ui-empty-padding); }
.provider-config-list { display: grid; gap: var(--ui-space-10); }
.provider-config-list article { align-items: flex-start; border: 1px solid var(--border); border-radius: 8px; display: flex; justify-content: space-between; padding: var(--ui-space-14) var(--ui-space-16); }
.provider-config-list h3, .provider-config-list p { margin: 0; }
.provider-integration-endpoints { display: grid; gap: var(--ui-space-6); margin: var(--ui-space-10) 0 0; max-width: min(720px, 70vw); }
.provider-integration-endpoints div { display: grid; gap: var(--ui-space-2); }
.provider-integration-endpoints dt { color: var(--muted); font-size: var(--ui-text-12); font-weight: 700; text-transform: uppercase; }
.provider-integration-endpoints dd { margin: 0; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] {
  --auth-provider-surface: var(--surface);
  --auth-provider-muted-surface: var(--surface-muted);
  --auth-provider-text: var(--text);
  --auth-provider-muted-text: var(--text-muted);
  --auth-provider-tab-bg: var(--app-bg);
  --auth-provider-boundary: var(--text-muted);
  --auth-provider-focus: var(--accent-readable);
  --auth-provider-success-bg: color-mix(in srgb, var(--success) 12%, var(--surface));
  --auth-provider-success-border: var(--success);
  --auth-provider-success-text: var(--success);
  --auth-provider-warning-bg: var(--notice-bg);
  --auth-provider-warning-border: color-mix(in srgb, var(--notice-text) 65%, var(--surface));
  --auth-provider-warning-text: var(--notice-text);
  --auth-provider-error-bg: var(--ui-error-bg);
  --auth-provider-error-border: color-mix(in srgb, var(--danger) 65%, var(--surface));
  --auth-provider-error-text: var(--danger);
  --auth-provider-danger-text: var(--danger-action-text);
  min-width: 0;
}
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .settings-section-tabs,
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .settings-section-tabs a { background: var(--auth-provider-tab-bg); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] :is(.ui-page-heading > div, .registration-policy, .provider-configurations, .provider-config-list, .provider-configured-card, .provider-configured-content, .provider-catalog, .provider-definition-card, .provider-add-list, .provider-add-disclosure) { min-width: 0; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] :is(h1, h2, h3, p, code, dt, dd, label, legend, summary, span) { overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] :is(.registration-policy, .provider-definition-card, .provider-configured-card, .provider-add-disclosure, .auth-provider-readiness) { background: var(--auth-provider-surface); border-color: var(--auth-provider-boundary); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .registration-policy { border: 1px solid var(--auth-provider-boundary); border-radius: var(--ui-panel-radius); padding: var(--ui-panel-padding); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .registration-policy-state { align-items: flex-start; display: flex; flex-wrap: wrap; gap: var(--ui-space-8); justify-content: flex-end; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .registration-policy .ui-status,
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-runtime-status { align-items: center; background: var(--auth-provider-muted-surface); border: 1px solid var(--auth-provider-boundary); color: var(--auth-provider-muted-text); display: inline-flex; gap: var(--ui-space-8); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] [data-registration-status="enabled"],
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] [data-provider-runtime-state="active"] { background: var(--auth-provider-success-bg); border-color: var(--auth-provider-success-border); color: var(--auth-provider-success-text); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] [data-provider-runtime-state="unavailable"],
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] [data-provider-encryption-state="unavailable"] { background: var(--auth-provider-warning-bg); border-color: var(--auth-provider-warning-border); color: var(--auth-provider-warning-text); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-encryption-status { align-items: center; display: inline-flex; gap: var(--ui-space-8); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-encryption-status[data-provider-encryption-state="ready"] { color: var(--auth-provider-success-text); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-state-mark { align-items: center; border: 2px solid currentColor; border-radius: 50%; display: inline-flex; flex: 0 0 13px; height: 13px; justify-content: center; width: 13px; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-state-mark > span { background: currentColor; display: block; height: 2px; width: 5px; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] :is([data-provider-runtime-state="active"], [data-provider-encryption-state="ready"]) .provider-state-mark > span { background: transparent; border-bottom: 2px solid currentColor; border-right: 2px solid currentColor; height: 7px; transform: rotate(45deg) translate(-1px, -1px); width: 4px; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] :is([data-provider-runtime-state="unavailable"], [data-provider-encryption-state="unavailable"]) .provider-state-mark { border-radius: 2px; transform: rotate(45deg); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] :is([data-provider-runtime-state="unavailable"], [data-provider-encryption-state="unavailable"]) .provider-state-mark > span { border-radius: 50%; height: 3px; transform: rotate(-45deg); width: 3px; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .auth-provider-registry-notice { background: var(--auth-provider-success-bg); border-color: var(--auth-provider-success-border); color: var(--auth-provider-success-text); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .auth-provider-registry-error { background: var(--auth-provider-error-bg); border-color: var(--auth-provider-error-border); color: var(--auth-provider-error-text); max-width: none; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .auth-provider-encryption-warning,
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] :is(.provider-runtime-warning, .provider-add-unavailable) { background: var(--auth-provider-warning-bg); border: 1px solid var(--auth-provider-warning-border); border-radius: var(--ui-control-radius); color: var(--auth-provider-warning-text); padding: var(--ui-feedback-padding); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .auth-provider-readiness { border-width: 1px; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .auth-provider-readiness > div + div { border-color: var(--auth-provider-boundary); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-configurations { margin-top: 24px; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-configured-card { display: grid; gap: var(--ui-space-12) var(--ui-space-16); grid-template-columns: minmax(0, 1fr) auto; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-runtime-status { align-self: start; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-actions { align-items: center; grid-column: 1 / -1; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-actions button { margin-top: 0; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-definition-card { background: var(--auth-provider-surface); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-definition-card > header > div { min-width: 0; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-schema { border-color: var(--auth-provider-boundary); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-add-list { display: grid; gap: var(--ui-space-12); margin-top: 16px; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-add-disclosure { border: 1px solid var(--auth-provider-boundary); border-radius: var(--ui-panel-radius); overflow: visible; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-add-disclosure > summary { background: var(--auth-provider-muted-surface); cursor: pointer; font-weight: 750; padding: var(--ui-space-14) var(--ui-space-18); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-add-disclosure > :not(summary) { margin-left: 18px; margin-right: 18px; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-add-disclosure > :last-child { margin-bottom: 18px; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-configure-form { background: var(--auth-provider-muted-surface); border-color: var(--auth-provider-boundary); max-width: none; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] :is(input, textarea, select) { background: var(--auth-provider-surface); border-color: var(--auth-provider-boundary); color: var(--auth-provider-text); min-width: 0; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .registration-policy fieldset { border: 1px solid var(--auth-provider-boundary); border-radius: var(--ui-control-radius); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .registration-policy fieldset label { align-items: start; display: grid; gap: var(--ui-space-10); grid-template-columns: 18px minmax(0, 1fr); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .registration-policy fieldset input[type="checkbox"] { height: 18px; margin: 1px 0 0; width: 18px; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-configurations .empty-state { background: var(--auth-provider-surface); border: 1px solid var(--auth-provider-boundary); border-radius: var(--ui-panel-radius); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] :is(textarea, fieldset)[aria-invalid="true"] { border-color: var(--auth-provider-error-border); box-shadow: inset 0 0 0 1px var(--auth-provider-error-border); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .registration-policy-toggle { align-items: start; display: grid; gap: var(--ui-space-10); grid-template-columns: auto minmax(0, 1fr); }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .registration-policy-toggle input { accent-color: var(--auth-provider-focus); height: 18px; margin: 1px 0 0; width: 18px; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] :is(input, textarea, select, button, summary, .settings-section-tabs a):focus-visible { outline: 3px solid var(--auth-provider-focus); outline-offset: 2px; }
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .danger-action { color: var(--auth-provider-danger-text); }
.profile-heading { background: var(--app-bg); position: sticky; top: 0; z-index: 2; }
.profile-shell :is(input, select, .profile-password-disclosure) { scroll-margin-top: 10rem; }
.eyebrow { color: var(--accent-readable); font-size: var(--ui-text-13); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
h1 { font-size: var(--ui-page-title-size); line-height: 1.2; margin: var(--ui-space-8) 0; }
form { max-width: 760px; }
label { display: block; font-size: var(--ui-text-14); font-weight: 700; margin: var(--ui-space-18) 0 var(--ui-space-6); }
input, textarea, select { background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--ui-control-radius); color: var(--text); font: inherit; padding: var(--ui-control-padding); }
input:not([type="checkbox"], [type="radio"], [type="hidden"]), textarea, select { box-sizing: border-box; min-height: var(--ui-control-min-height); width: 100%; }
input:is([type="checkbox"], [type="radio"]) { width: auto; }
textarea { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; resize: vertical; }
.publication-settings { border: 1px solid var(--border); border-radius: 8px; margin-top: 24px; padding: var(--ui-space-18); }
.publication-settings legend { font-weight: 750; padding: 0 var(--ui-space-6); }
.publication-settings label { margin-top: 8px; }
.publication-window { display: grid; gap: var(--ui-space-16); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.field-help, .ui-note-lead { color: var(--text-muted); font-size: var(--ui-text-13); margin: var(--ui-space-8) 0 var(--ui-space-12); }
.cm-editor { background: var(--surface); border: 1px solid var(--border-strong); border-radius: 5px; min-height: 220px; }
/* The ring was 18% of the accent over transparent, which composites onto the
   #191919 code ground at 1.28:1 - no usable focus indicator on the markdown
   source editor in either theme. WCAG 2.2 asks for 3:1; the readable accent
   gives 4.2:1 light and 6.9:1 dark. */
.cm-editor.cm-focused { border-color: var(--accent); outline: 2px solid var(--accent-readable); outline-offset: 1px; }
.cm-scroller { min-height: 220px; }
.editor-toolbar { align-items: center; display: flex; flex-wrap: wrap; gap: var(--ui-space-12); margin: var(--ui-space-14) 0 var(--ui-space-8); }
.editor-heading { align-items: center; display: flex; gap: var(--ui-space-24); justify-content: space-between; }
.editor-heading button { flex: 0 0 auto; margin: 0; }
.existing-editor-form:has(.editor-no-script) .markdown-workspace { display: none; }
body[data-editor-layout="true"] .editor-shell:has(.editor-no-script) { height: auto; padding: var(--ui-space-16); }
.existing-editor-form:has(.editor-no-script) > textarea { min-height: 60vh; width: 100%; }
.editor-no-script { color: var(--code-text); margin-block: var(--ui-space-16); }
body[data-public-page="true"] .page-move-shell {
  --page-move-surface: var(--surface);
  --page-move-muted-surface: var(--surface-muted);
  --page-move-text: var(--text);
  --page-move-muted-text: var(--text-muted);
  --page-move-boundary: var(--text-muted);
  --page-move-focus: var(--accent-readable);
  --page-move-error-bg: var(--ui-error-bg);
  --page-move-error-boundary: var(--danger);
  --page-move-error-text: var(--danger);
  background: var(--page-move-surface);
  border-color: var(--page-move-boundary);
  color: var(--page-move-text);
  min-width: 0;
}
body[data-public-page="true"] .page-move-shell :is(h1, p, code, label, a, button) { overflow-wrap: anywhere; }
body[data-public-page="true"] .page-move-heading { align-items: flex-start; }
body[data-public-page="true"] .page-move-heading > div:first-child { min-width: 0; }
body[data-public-page="true"] .page-move-heading .eyebrow { color: var(--page-move-focus); margin: 0; }
body[data-public-page="true"] .page-move-heading h1 { margin: .25rem 0 0; }
/* The row and its controls are ActionRow and Action now. The rule that painted
   the cancel link gave it a border and padding but no border-radius, while its
   sibling button took one from the base button rule - a square Cancel beside a
   rounded Move page, in the same row. The same omission sat on the redirect
   screen; the delete page had been given the radius and these two had not. */
body[data-public-page="true"] .page-move-source { background: var(--page-move-muted-surface); border: .0625rem solid var(--page-move-boundary); border-radius: var(--ui-control-radius); display: grid; gap: .3125rem; margin: 1.5rem 0; min-width: 0; padding: .875rem 1rem; }
body[data-public-page="true"] .page-move-source span { color: var(--page-move-muted-text); font-size: var(--ui-text-12); font-weight: 750; letter-spacing: .06em; }
body[data-public-page="true"] .page-move-source code { color: var(--page-move-text); white-space: normal; word-break: break-word; }
body[data-public-page="true"] .page-move-form { max-width: none; min-width: 0; }
body[data-public-page="true"] .page-move-fields { display: grid; gap: 1.125rem; grid-template-columns: minmax(9rem, .32fr) minmax(0, 1fr); }
body[data-public-page="true"] .page-move-fields > div { min-width: 0; }
body[data-public-page="true"] .page-move-fields :is(input, select) { background: var(--page-move-surface); border-color: var(--page-move-boundary); min-width: 0; }
body[data-public-page="true"] .page-move-fields :is(input, select)[aria-invalid="true"] { border-color: var(--page-move-error-boundary); box-shadow: inset 0 0 0 .0625rem var(--page-move-error-boundary); }
body[data-public-page="true"] .page-move-help { background: var(--page-move-muted-surface); border: .0625rem solid var(--page-move-boundary); border-radius: var(--ui-control-radius); color: var(--page-move-muted-text); margin: 1.125rem 0 0; padding: .75rem .875rem; }
body[data-public-page="true"] .page-move-feedback { background: var(--page-move-error-bg); border: .0625rem solid var(--page-move-error-boundary); border-radius: var(--ui-control-radius); color: var(--page-move-error-text); font-weight: 650; margin: 1.125rem 0; padding: var(--ui-feedback-padding); }
body[data-public-page="true"] .page-move-form .ui-action-row { margin-top: 1.125rem; }
body[data-public-page="true"] .page-move-shell :is(input, select, button, a, [tabindex="-1"]):focus-visible { outline: .1875rem solid var(--page-move-focus); outline-offset: .125rem; }
body[data-public-page="true"] .create-redirect-shell {
  --redirect-surface: var(--surface);
  --redirect-muted-surface: var(--surface-muted);
  --redirect-text: var(--text);
  --redirect-muted-text: var(--text-muted);
  --redirect-boundary: var(--text-muted);
  --redirect-focus: var(--accent-readable);
  --redirect-error-bg: var(--ui-error-bg);
  --redirect-error-boundary: var(--danger);
  --redirect-error-text: var(--danger);
  background: var(--redirect-surface);
  border-color: var(--redirect-boundary);
  color: var(--redirect-text);
  min-width: 0;
}
body[data-public-page="true"] .create-redirect-shell :is(h1, p, legend, label, input, a, button) { overflow-wrap: anywhere; }
body[data-public-page="true"] .create-redirect-heading { align-items: start; display: grid; gap: 1rem 2rem; grid-template-columns: minmax(0, 1fr) auto; }
body[data-public-page="true"] .create-redirect-heading > div:first-child { min-width: 0; }
body[data-public-page="true"] .create-redirect-heading .eyebrow { color: var(--redirect-focus); margin: 0; }
body[data-public-page="true"] .create-redirect-heading h1 { margin: .25rem 0 .5rem; }
body[data-public-page="true"] .create-redirect-heading #create-redirect-intro { color: var(--redirect-muted-text); margin: 0; max-width: 68ch; }
body[data-public-page="true"] .create-redirect-form { display: grid; gap: 1.125rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 1.5rem; max-width: none; min-width: 0; }
body[data-public-page="true"] .create-redirect-card { background: var(--redirect-muted-surface); border: .0625rem solid var(--redirect-boundary); border-radius: var(--ui-panel-radius); margin: 0; min-width: 0; padding: 1.125rem; }
body[data-public-page="true"] .create-redirect-card legend { color: var(--redirect-text); font-size: var(--ui-text-16); font-weight: 750; padding: 0 .375rem; }
body[data-public-page="true"] .create-redirect-card > p { color: var(--redirect-muted-text); margin: 0 0 .75rem; }
body[data-public-page="true"] .create-redirect-fields { display: grid; gap: var(--ui-space-14); grid-template-columns: minmax(6rem, .3fr) minmax(0, 1fr); }
body[data-public-page="true"] .create-redirect-fields > div { min-width: 0; }
body[data-public-page="true"] .create-redirect-fields label { margin-top: 0; }
body[data-public-page="true"] .create-redirect-fields input { background: var(--redirect-surface); border-color: var(--redirect-boundary); color: var(--redirect-text); min-width: 0; }
body[data-public-page="true"] .create-redirect-fields input[aria-invalid="true"] { border-color: var(--redirect-error-boundary); box-shadow: inset 0 0 0 .0625rem var(--redirect-error-boundary); }
body[data-public-page="true"] .create-redirect-feedback { background: var(--redirect-error-bg); border: .0625rem solid var(--redirect-error-boundary); border-radius: var(--ui-control-radius); color: var(--redirect-error-text); font-weight: 650; margin: 1.125rem 0 0; padding: var(--ui-feedback-padding); }
body[data-public-page="true"] .create-redirect-shell :is(input, button, a, [tabindex="-1"]):focus-visible { outline: .1875rem solid var(--redirect-focus); outline-offset: .125rem; }
@media (max-width: 56.25rem) {
  body[data-public-page="true"] .create-redirect-form { grid-template-columns: minmax(0, 1fr); }
}
.edit-conflict {
  --edit-conflict-surface: var(--surface);
  --edit-conflict-card-surface: var(--surface-muted);
  --edit-conflict-text: var(--text);
  --edit-conflict-muted-text: var(--text-muted);
  --edit-conflict-boundary: var(--text-muted);
  --edit-conflict-code-outer-boundary: var(--text-muted);
  --edit-conflict-code-inner-boundary: var(--code-muted);
  --edit-conflict-focus: var(--accent-readable);
  --edit-conflict-latest-boundary: var(--accent-readable);
  --edit-conflict-draft-boundary: var(--notice-text);
  background: var(--edit-conflict-surface);
  border: 1px solid var(--edit-conflict-boundary);
  border-radius: var(--ui-panel-radius);
  color: var(--edit-conflict-text);
  margin: 0 0 var(--ui-space-32);
  max-height: calc(100dvh - 142px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: var(--ui-space-24);
  scrollbar-gutter: stable;
}
.edit-conflict-heading { max-width: 820px; min-width: 0; }
.edit-conflict-heading h1 { margin: var(--ui-space-4) 0 var(--ui-space-12); }
.edit-conflict-heading :is(h1, p) { overflow-wrap: anywhere; }
.edit-conflict-heading [role="alert"] { color: var(--danger); font-weight: 650; }
.edit-conflict-versions { display: grid; gap: var(--ui-space-16); grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 24px; }
.edit-conflict-version { background: var(--edit-conflict-card-surface); border: 1px solid var(--edit-conflict-boundary); border-radius: 10px; min-width: 0; padding: var(--ui-space-18); }
.edit-conflict-version .eyebrow { color: var(--accent-readable); }
.edit-conflict-version header :is(.eyebrow, h2) { overflow-wrap: anywhere; }
.edit-conflict-version header h2 { font-size: var(--ui-text-18); margin: var(--ui-space-4) 0 var(--ui-space-14); }
.edit-conflict-version dl { display: grid; gap: var(--ui-space-8); margin: 0 0 var(--ui-space-14); }
.edit-conflict-version dl div { display: grid; gap: var(--ui-space-2); grid-template-columns: 88px minmax(0, 1fr); }
.edit-conflict-version dt { color: var(--edit-conflict-muted-text); font-size: var(--ui-text-13); font-weight: 650; }
.edit-conflict-version dd { margin: 0; overflow-wrap: anywhere; }
.edit-conflict-version pre { background: var(--code-bg); border: 1px solid var(--edit-conflict-code-outer-boundary); border-radius: 6px; box-shadow: inset 0 0 0 1px var(--edit-conflict-code-inner-boundary); color: var(--code-text); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: var(--ui-text-13); line-height: 1.55; margin: 0; max-height: 300px; min-height: 130px; overflow: auto; padding: var(--ui-space-14); white-space: pre; }
.edit-conflict-latest { border-color: var(--edit-conflict-latest-boundary); }
.edit-conflict-draft { border-color: var(--edit-conflict-draft-boundary); }
.edit-conflict-safety { background: var(--notice-bg); border: 1px solid var(--edit-conflict-draft-boundary); border-radius: 8px; margin: var(--ui-space-18) 0 0; overflow-wrap: anywhere; padding: var(--ui-space-14) var(--ui-space-16); }
.edit-conflict:is(:focus, :focus-visible),
.edit-conflict :is(pre, button, a):is(:focus, :focus-visible) { outline: 3px solid var(--edit-conflict-focus); outline-offset: 2px; }
.editor-command-group { display: inline-flex; }
.editor-command-group + .editor-command-group { border-inline-start: 1px solid currentColor; padding-inline-start: var(--ui-space-8); }
.editor-help-dialog { background: var(--surface); border: var(--ui-dialog-border); border-radius: var(--ui-dialog-radius); color: var(--text); max-height: min(85dvh, 48rem); max-width: calc(100vw - 2rem); overscroll-behavior: contain; padding: var(--ui-space-24); width: 40rem; }
.editor-help-dialog::backdrop { background: var(--ui-dialog-backdrop); }
.editor-help-dialog header { align-items: center; display: flex; gap: var(--ui-space-16); justify-content: space-between; }
.editor-help-dialog h2 { margin: 0; }
.editor-help-dialog dt { font-weight: 700; margin-top: var(--ui-space-16); }
.editor-help-dialog dd { margin: var(--ui-space-4) 0 0; overflow-wrap: anywhere; }
.editor-help-dialog code { background: var(--surface-muted); color: var(--text); padding: var(--ui-space-2) var(--ui-space-4); }
.editor-command { align-items: center; background: var(--surface); border: 1px solid var(--border-strong); border-radius: 0; color: var(--text); display: inline-flex; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; height: 34px; justify-content: center; margin: 0 0 0 -1px; min-width: 36px; padding: 0 var(--ui-space-10); }
.editor-command:first-child { border-radius: 5px 0 0 5px; margin-left: 0; }
.editor-command:last-child { border-radius: 0 5px 5px 0; }
.editor-command:hover { background: var(--surface-muted); position: relative; }
.editor-command:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; position: relative; z-index: 1; }
.editor-command-wide { min-width: 48px; }
.editor-command-status { clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }
.editor-toolbar .secondary-action { background: var(--surface-muted); border: 1px solid var(--border-strong); color: var(--text); margin: 0; padding: var(--ui-space-8) var(--ui-space-12); }
.editor-input-status { background: color-mix(in srgb, var(--accent) 8%, var(--surface)); border: 1px solid var(--border); border-radius: 5px; color: var(--text-muted); font-size: var(--ui-text-13); margin: 0 0 var(--ui-space-8); padding: var(--ui-space-10) var(--ui-space-12); }
.preview-status { color: var(--text-muted); font-size: var(--ui-text-13); }
.editor-surfaces { display: grid; gap: var(--ui-space-18); grid-template-columns: minmax(0, 1fr); }
.markdown-workspace[data-preview-visible="true"] .editor-surfaces { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.markdown-preview { border: 1px solid var(--border-strong); border-radius: 5px; max-height: 360px; min-height: 220px; overflow: auto; padding: var(--ui-space-16); }
.markdown-preview h2 { font-size: var(--ui-text-18); margin: 0 0 var(--ui-space-12); }
.markdown-preview-body pre { background: var(--code-bg); border-radius: 6px; color: var(--code-text); overflow: auto; padding: var(--ui-space-12); }
.editor-heading-actions { align-items: center; display: flex; gap: var(--ui-space-12); }
.editor-overflow-label, .editor-view-switch-label { display: none; }
.editor-more-action[hidden] { display: none; }
.editor-more-panel { background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--ui-panel-radius); color: var(--text); inset: auto 12px auto auto; margin: 0; max-height: calc(100dvh - var(--editor-header-size) - var(--editor-toolbar-size) - 24px); overflow: auto; padding: var(--ui-space-8); top: calc(var(--editor-header-size) + var(--editor-toolbar-size) + 8px); width: min(280px, calc(100vw - 24px)); }
.editor-more-panel:popover-open { display: grid; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-more-panel button { align-items: center; background: transparent; border: 0; border-radius: var(--ui-control-radius); color: var(--text); display: flex; gap: var(--ui-space-12); height: auto; justify-content: flex-start; margin: 0; min-height: 44px; min-width: 0; padding: var(--ui-space-8); text-align: start; width: 100%; }
.editor-more-panel .editor-overflow-label { display: inline; font: 400 var(--ui-text-14)/1.5 "Roboto", sans-serif; }
body[data-editor-layout="true"] .editor-more-panel button:hover { background: var(--surface-muted); }
body[data-editor-layout="true"] :is(.editor-more-panel button, .editor-more-action, .editor-view-switch):focus-visible { outline: 2px solid var(--accent-readable); outline-offset: -2px; }
.editor-close-action { align-items: center; background: var(--editor-close-bg); border-radius: 4px; color: var(--editor-close-text); display: inline-flex; font-size: var(--ui-text-13); font-weight: 700; gap: var(--ui-space-8); letter-spacing: .12em; padding: var(--ui-space-10) var(--ui-space-14); text-decoration: none; text-transform: uppercase; }
.editor-close-action:hover { background: var(--editor-close-generic-hover-bg); color: var(--editor-chrome-text); }
.editor-close-action span { color: var(--editor-close-icon); font-size: 0; height: 24px; width: 24px; }
.editor-close-action span::before { content: "\F0156" / ""; font: normal normal 400 var(--ui-text-24)/1 "Material Design Icons"; }

/* Existing-page editor shell. The dimensions below are layout contracts shared by
   the header, command bar, editing surfaces, and status bar—not screenshot offsets. */
body[data-editor-layout="true"] {
  --editor-header-size: 64px;
  --editor-toolbar-size: 48px;
  --editor-status-size: 24px;
  --editor-side-rail-size: 61px;
  --editor-side-rail-basis: 64px;
  --editor-toolbar-leading-size: 8px;
  --editor-source-leading-size: 61px;
  --editor-gutter-content-size: 25px;
  --editor-gutter-paint-size: 40px;
  --editor-status-locale-size: 71px;
  --editor-status-format-size: 71px;
  --editor-header-actions-width: 408px;
  --editor-header-title-actions-gap: var(--ui-space-24);
  --editor-header-title-measure: 400px;
  --editor-header-primary-saved-size: 105px;
  --editor-header-primary-create-size: 113px;
  --editor-header-page-action-size: 108px;
  --editor-header-close-action-size: 104px;
  --editor-header-icon-action-size: 48px;
  --editor-header-close-admin-gap: 13px;
  --editor-selection-panel-max: 700px;
  --editor-selection-gap: var(--ui-space-16);
  --editor-selection-card-text: var(--text);
  --editor-header-bg: var(--surface);
  --editor-chrome-text: var(--text);
  --editor-heading-text: var(--text);
  --editor-title-bg: transparent;
  --editor-title-text: var(--text);
  --editor-selection-header-muted: var(--text-muted);
  --editor-page-icon: var(--text-muted);
  --editor-header-icon: var(--text-muted);
  --editor-header-divider: var(--border);
  --editor-header-icon-hover-bg: var(--surface-muted);
  --editor-header-icon-hover: var(--text);
  --editor-close-hover-bg: var(--surface-muted);
  --editor-rail-bg: var(--surface-muted);
  --editor-rail-hover-bg: var(--border);
  --editor-status-bg: var(--surface-muted);
  --editor-status-text: var(--text-muted);
  --editor-status-locale-bg: var(--surface);
  --editor-status-locale-text: var(--text);
  --editor-properties-trigger-open-bg: var(--surface-muted);
  --editor-toolbar-bg: var(--editor-toolbar-surface);
  --editor-toolbar-control-bg: var(--editor-toolbar-bg);
  --editor-toolbar-control-text: var(--header-text);
  --editor-toolbar-focus: var(--header-text);
  --editor-header-focus: var(--accent-readable);
  --editor-source-bg: var(--code-bg);
  --editor-source-label-text: var(--editor-source-text);
  --editor-source-focus: var(--code-text);
  --editor-preview-bg: var(--surface);
  --editor-preview-text: var(--text);
  --editor-preview-focus: var(--accent-readable);
  --editor-preview-boundary: var(--code-muted);
  --editor-preview-status-bg: var(--notice-bg);
  --editor-preview-status-text: var(--notice-text);
  --editor-preview-status-boundary: var(--notice-text);
  --editor-preview-error-bg: var(--ui-error-bg);
  --editor-preview-error-text: var(--danger);
  --editor-preview-error-boundary: var(--danger);
  --editor-preview-error-action-bg: var(--danger);
  --editor-preview-error-action-text: var(--button-text);
  --editor-preview-error-focus: var(--danger);
  --editor-preview-heading: var(--accent-readable);
  --editor-preview-heading-rule: var(--accent);
  --editor-preview-subheading-rule: var(--text-muted);
  --editor-preview-list-marker: var(--text-muted);
  --editor-error-bg: var(--ui-error-bg);
  --editor-error-border: var(--ui-error-border);
  --editor-error-text: var(--danger);
  --editor-properties-boundary: var(--text-muted);
  --editor-properties-outer-boundary: var(--code-muted);
  --editor-properties-focus: var(--accent-readable);
  --editor-properties-header-focus: var(--accent-readable);
  --editor-unsaved-surface: var(--surface);
  --editor-unsaved-text: var(--text);
  --editor-unsaved-muted-text: var(--text-muted);
  --editor-unsaved-boundary: var(--code-muted);
  --editor-unsaved-action-boundary: var(--text-muted);
  --editor-unsaved-header-bg: var(--danger);
  --editor-unsaved-header-text: var(--button-text);
  --editor-unsaved-actions-bg: var(--surface-muted);
  --editor-unsaved-discard-bg: var(--danger);
  --editor-unsaved-discard-text: var(--button-text);
  --editor-unsaved-focus: var(--text);
  --editor-media-surface: var(--surface);
  --editor-media-muted-surface: var(--surface-muted);
  --editor-media-text: var(--text);
  --editor-media-muted-text: var(--text-muted);
  --editor-media-boundary: var(--text-muted);
  --editor-media-focus: var(--accent-readable);
  --editor-asciidoc-surface: var(--surface);
  --editor-asciidoc-muted-surface: var(--surface-muted);
  --editor-asciidoc-text: var(--text);
  --editor-asciidoc-muted-text: var(--text-muted);
  --editor-asciidoc-accent-text: var(--accent-readable);
  --editor-asciidoc-outer-boundary: var(--code-muted);
  --editor-asciidoc-boundary: var(--text-muted);
  --editor-asciidoc-focus: var(--accent-readable);
  --editor-asciidoc-warning-bg: var(--notice-bg);
  --editor-asciidoc-warning-text: var(--notice-text);
  --editor-asciidoc-warning-boundary: var(--notice-text);
  background: var(--editor-source-bg);
  font-family: "Roboto", sans-serif;
  overflow: hidden;
}
body[data-editor-layout="true"] .app-header {
  background: var(--editor-header-bg);
  border: 0;
  height: var(--editor-header-size);
  padding: 0 var(--ui-space-64);
  position: relative;
  z-index: 60;
}
body[data-editor-layout="true"] .app-header .app-brand { display: none; }
body[data-editor-layout="true"] .app-header :is(.header-search, .app-header-actions) { display: none; }
body[data-editor-layout="true"] .app-layout { display: block; min-height: 0; }
body[data-editor-layout="true"] .app-sidebar,
body[data-editor-layout="true"] .app-footer { display: none; }
body[data-editor-layout="true"] main#main-content { margin: 0; max-width: none; padding: 0; width: 100%; }
body[data-editor-layout="true"] .editor-shell {
  background: var(--code-bg);
  border: 0;
  border-radius: 0;
  height: calc(100vh - var(--editor-header-size));
  padding: 0;
}
body[data-editor-layout="true"] .editor-heading {
  align-items: center;
  color: var(--editor-heading-text);
  flex-direction: row;
  height: var(--editor-header-size);
  justify-content: space-between;
  padding-inline: var(--ui-space-16);
  left: 0;
  pointer-events: none;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 70;
}
body[data-editor-layout="true"] .editor-heading h1 {
  background: var(--editor-title-bg);
  color: var(--editor-title-text);
  font-size: var(--ui-text-18);
  font-weight: 600;
  line-height: 24px;
  margin: 0;
  max-width: 40rem;
  min-width: 0;
  overflow: hidden;
  position: relative;
  text-overflow: ellipsis;
  top: 1px;
  white-space: nowrap;
}
body[data-editor-layout="true"] .editor-heading-actions {
  flex: 0 0 auto;
  gap: var(--ui-space-8);
  pointer-events: auto;
  position: static;
}
body[data-editor-layout="true"] .editor-heading-document { display: flex; align-items: center; gap: var(--ui-space-12); min-width: 0; }
body[data-editor-layout="true"] .editor-back-action { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 40px; height: 40px; color: var(--editor-chrome-text); pointer-events: auto; border-radius: 4px; }
body[data-editor-layout="true"] .editor-back-action:hover { background: var(--editor-close-hover-bg); }
body[data-editor-layout="true"] .editor-back-action > span { font-size: var(--ui-text-24); line-height: 1; }
body[data-editor-layout="true"] .editor-back-action:focus-visible { outline: 3px solid var(--editor-header-focus); outline-offset: -3px; }
body[data-editor-layout="true"] [data-testid="edit-page"] .editor-heading-actions > :is(button, a):focus-visible {
  outline: 3px solid var(--editor-header-focus);
  outline-offset: -3px;
}
body[data-editor-layout="true"] .editor-heading-actions button,
body[data-editor-layout="true"] .editor-close-action {
  border: 0;
  border-radius: 3px;
  font-size: var(--ui-text-14);
  font-weight: 500;
  letter-spacing: normal;
  min-height: 36px;
  text-transform: none;
}
body[data-editor-layout="true"] .editor-save-action {
  align-items: center;
  background: transparent;
  color: var(--editor-chrome-text);
  display: inline-flex;
  gap: var(--ui-space-4);
  height: 40px;
  justify-content: center;
  padding: 0 var(--ui-space-6) 0 0;
  width: 88px;
}
body[data-editor-layout="true"] .editor-save-action:not(:disabled) { background: var(--accent); color: var(--button-text); }
body[data-editor-layout="true"] .editor-save-action:not(:disabled) .editor-action-icon { color: inherit; }
body[data-editor-layout="true"] .editor-action-icon,
body[data-editor-layout="true"] .editor-header-icon-action .header-icon {
  display: inline-block;
  font: normal normal 400 var(--ui-text-24)/1 "Material Design Icons";
  height: 24px;
  text-align: center;
  text-rendering: auto;
  width: 24px;
}
body[data-editor-layout="true"] .editor-action-icon-check { color: var(--editor-saved-icon); }
body[data-editor-layout="true"] .editor-action-icon-check { position: relative; right: 2px; }
body[data-editor-layout="true"] .editor-action-icon-check::before { content: "\F012C" / ""; }
body[data-editor-layout="true"] .editor-action-icon-page { color: var(--editor-page-icon); }
body[data-editor-layout="true"] .editor-action-icon-page::before { content: "\F0493" / ""; }
body[data-editor-layout="true"] .editor-close-action {
  background: transparent;
  color: var(--editor-chrome-text);
  height: 36px;
  justify-content: center;
  margin: 0 var(--ui-space-12) 0 var(--ui-space-18);
  padding: 0 var(--ui-space-8) 0 0;
  width: 105px;
}
body[data-editor-layout="true"] .editor-close-action:hover { background: var(--editor-close-hover-bg); }
body[data-editor-layout="true"] .editor-header-icon-action {
  align-items: center;
  border-left: 1px solid var(--editor-header-divider);
  color: var(--editor-header-icon);
  display: flex;
  height: 40px;
  justify-content: center;
  text-decoration: none;
  width: 49px;
}
body[data-editor-layout="true"] .editor-header-icon-action:hover { background: var(--editor-header-icon-hover-bg); color: var(--editor-header-icon-hover); }

@media (min-width: 87.5rem) {
  body[data-editor-layout="true"] .editor-heading-actions {
    left: calc(50% + (var(--editor-header-title-measure) / 2) + var(--editor-header-title-actions-gap));
    right: auto;
  }
  body[data-editor-layout="true"] :is(.create-editor-shell, .editor-selection-shell) .editor-heading-actions {
    left: auto;
    right: 8px;
  }
  body[data-editor-layout="true"] .editor-save-action {
    height: 36px;
    width: var(--editor-header-primary-saved-size);
  }
  body[data-editor-layout="true"] .create-editor-shell .editor-save-action {
    width: var(--editor-header-primary-create-size);
  }
  body[data-editor-layout="true"] .editor-page-settings {
    flex: 0 0 var(--editor-header-page-action-size);
    width: var(--editor-header-page-action-size);
  }
  body[data-editor-layout="true"] .editor-close-action {
    height: 36px;
    margin: 0 var(--editor-header-close-admin-gap) 0 0;
    width: var(--editor-header-close-action-size);
  }
  body[data-editor-layout="true"] .editor-header-icon-action {
    width: var(--editor-header-icon-action-size);
  }
  body[data-editor-layout="true"] .editor-header-icon-action + .editor-header-icon-action {
    margin-left: 1px;
  }
}
body[data-editor-layout="true"] .existing-editor-form { height: 100%; max-width: none; }
body[data-editor-layout="true"] .editor-selection-title {
  background: transparent;
  border: 0;
  border-radius: 0;
  color: var(--editor-selection-header-muted);
  font-size: var(--ui-text-16);
  font-weight: 400;
  margin: 0;
  max-width: min(42vw, calc(100vw - (2 * var(--editor-header-actions-width)) - 32px), 520px);
  padding: 0;
  pointer-events: auto;
  text-align: center;
  width: auto;
}
body[data-editor-layout="true"] .editor-selection-page-action {
  align-items: center;
  background: transparent;
  color: var(--editor-selection-header-muted);
  display: inline-flex;
  gap: var(--ui-space-8);
  height: var(--editor-header-size);
  justify-content: center;
  font-size: var(--ui-text-14);
  font-weight: 500;
  letter-spacing: .0892857143em;
  padding: 0;
  text-decoration: none;
  text-transform: uppercase;
  width: 80px;
}
body[data-editor-layout="true"] .editor-selection-heading .editor-save-action:disabled { cursor: not-allowed; }
body[data-editor-layout="true"] .editor-selection-stage {
  align-items: center;
  background: var(--editor-selection-stage-bg);
  display: flex;
  inset: 0;
  justify-content: center;
  overflow: auto;
  padding: clamp(24px, 5vw, 64px);
  position: fixed;
  z-index: 50;
}
body[data-editor-layout="true"] .editor-selection-panel {
  background: transparent;
  border: 0;
  border-radius: 8px;
  box-shadow: none;
  color: var(--editor-selection-panel-text);
  margin-bottom: 1px;
  max-width: var(--editor-selection-panel-max);
  min-height: 0;
  padding: var(--ui-space-24) 0;
  width: 100%;
}
body[data-editor-layout="true"] .editor-selection-panel > header {
  align-items: center;
  display: flex;
  gap: var(--editor-selection-gap);
  justify-content: flex-start;
  min-height: 40px;
  padding: var(--ui-space-2) 0 var(--ui-space-14);
}
.editor-selection-location-action { display: inline-flex; margin-bottom: var(--ui-space-20); min-height: 32px; }
body[data-editor-layout="true"] .editor-selection-panel h1 { font-size: var(--ui-text-28); font-weight: 600; letter-spacing: -.02em; margin: 0 0 var(--ui-space-16); }
body[data-editor-layout="true"] .editor-selection-location { color: var(--editor-selection-panel-text); font-size: var(--ui-text-13); white-space: nowrap; }
body[data-editor-layout="true"] .editor-selection-grid {
  column-gap: var(--editor-selection-gap);
  display: grid;
  grid-auto-rows: minmax(104px, auto);
  grid-template-columns: minmax(0, 1fr);
  row-gap: var(--ui-space-16);
}
body[data-editor-layout="true"] .editor-selection-card {
  align-items: center;
  background: var(--editor-selection-card-bg);
  border: 1px solid var(--editor-selection-card-boundary);
  border-radius: 8px;
  box-shadow: none;
  color: var(--editor-selection-card-text);
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: var(--ui-space-6);
  grid-column: span 1;
  justify-content: center;
  margin: 0;
  min-height: 0;
  padding: var(--ui-space-20);
  text-align: start;
  text-decoration: none;
}
body[data-editor-layout="true"] .editor-selection-card .editor-selection-icon { grid-column: 1; grid-row: 1 / span 3; }
body[data-editor-layout="true"] .editor-selection-card :is(strong, .editor-selection-description, .editor-selection-availability) { grid-column: 2; }
body[data-editor-layout="true"] .editor-selection-card:is([data-editor-kind="markdown"], [data-editor-kind="visual"]) {
  grid-column: span 1;
}
body[data-editor-layout="true"] .editor-selection-card:is(:hover, :focus-visible):not(:disabled) {
  background: var(--surface-muted);
  border-color: var(--accent-readable);
}
body[data-editor-layout="true"] .editor-selection-card[data-editor-availability="unavailable"] {
  background: var(--editor-selection-card-muted-bg);
  color: var(--editor-selection-card-unavailable-text);
  cursor: not-allowed;
  opacity: 1;
}
body[data-editor-layout="true"] .visual-markdown-notice {
  background: var(--visual-markdown-notice-bg);
  border-bottom: 1px solid var(--visual-markdown-notice-boundary);
  color: var(--visual-markdown-notice-text);
  margin: 0;
  padding: var(--ui-space-10) var(--ui-space-16);
}
body[data-editor-layout="true"] .visual-markdown-surface {
  background: var(--visual-markdown-surface-bg);
  box-sizing: border-box;
  color: var(--text);
  min-height: calc(100vh - 184px);
  overflow: auto;
  padding: var(--ui-space-28) clamp(24px, 5vw, 72px) var(--ui-space-64);
  width: 100%;
}
body[data-editor-layout="true"] .visual-markdown-surface:focus {
  outline: 3px solid var(--visual-markdown-focus);
  outline-offset: -3px;
}
body[data-editor-layout="true"] .visual-markdown-document {
  margin-inline: auto;
  max-width: 72ch;
  min-height: 60vh;
  outline: none;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}
body[data-editor-layout="true"] .visual-markdown-document:focus-visible {
  outline: 2px solid var(--visual-markdown-focus);
  outline-offset: 4px;
}
body[data-editor-layout="true"] .visual-markdown-document .ProseMirror-selectednode {
  outline: 2px solid var(--visual-markdown-focus);
}
body[data-editor-layout="true"] .visual-markdown-document td,
body[data-editor-layout="true"] .visual-markdown-document th {
  position: relative;
}
body[data-editor-layout="true"] .visual-markdown-document .selectedCell::after {
  background: var(--visual-markdown-focus);
  content: "";
  inset: 0;
  opacity: 0.15;
  pointer-events: none;
  position: absolute;
}
body[data-editor-layout="true"] .visual-editor-source-switch {
  align-items: center;
  display: inline-flex;
  text-decoration: none;
  white-space: nowrap;
}
.editor-modebar { align-items: center; background: var(--surface); border-bottom: 1px solid var(--border); color: var(--text); display: flex; font-size: var(--ui-text-13); gap: var(--ui-space-16); padding: var(--ui-space-4) var(--ui-space-16); }
.editor-modebar > span { color: var(--text-muted); }
.editor-modebar .visual-editor-source-switch { background: transparent; border: 0; color: var(--accent-readable); margin: 0 0 0 auto; min-height: 28px; padding: 0; }
body[data-editor-layout="true"]:has([data-existing-editor="true"]) { --editor-header-size: 100px; --editor-toolbar-bg: var(--surface-muted); --editor-toolbar-control-text: var(--text); --editor-toolbar-focus: var(--accent-readable); }
body[data-editor-layout="true"]:has([data-existing-editor="true"]) :is(.app-header, .editor-heading) { height: 64px; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-modebar { height: 36px; inset-inline: 0; position: fixed; top: 64px; z-index: 55; }
@media (max-width: 37.5rem) {
  .editor-modebar { gap: var(--ui-space-8); }
  .editor-modebar > span { display: none; }
}
body[data-editor-layout="true"] .editor-selection-description {
  color: var(--editor-selection-card-muted-text);
  font-size: var(--ui-text-12);
  letter-spacing: .0333333333em;
}
body[data-editor-layout="true"] .editor-selection-card strong { font-size: var(--ui-text-18); font-weight: 600; letter-spacing: normal; }
body[data-editor-layout="true"] .editor-selection-availability {
  color: var(--editor-selection-card-muted-text);
  font-size: var(--ui-text-11);
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
}
body[data-editor-layout="true"] .editor-selection-icon {
  align-items: center;
  border: 0;
  display: flex;
  height: 42px;
  justify-content: center;
  width: 42px;
}
body[data-editor-layout="true"] .editor-selection-icon svg {
  display: block;
  height: 36px;
  width: 36px;
}
body[data-editor-layout="true"] .editor-selection-icon-template svg { height: 42px; width: 42px; }
body[data-editor-layout="true"] .editor-selection-icon-surface {
  fill: var(--editor-selection-icon-surface);
  stroke: var(--editor-selection-icon-glyph);
}
body[data-editor-layout="true"] .editor-selection-icon-surface-fill { fill: var(--editor-selection-icon-surface); }
body[data-editor-layout="true"] .editor-selection-icon-page {
  fill: var(--editor-selection-card-bg);
  stroke: var(--editor-selection-icon-glyph);
}
body[data-editor-layout="true"] .editor-selection-icon-glyph,
body[data-editor-layout="true"] .editor-selection-icon-glyph-fill { fill: var(--editor-selection-icon-glyph); }
body[data-editor-layout="true"] .editor-selection-icon-lines {
  fill: none;
  stroke: var(--editor-selection-icon-glyph);
}
body[data-editor-layout="true"]:has(.editor-selection-shell) .app-header { background: var(--editor-header-bg); }
body[data-editor-layout="true"]:has(.editor-selection-shell) :is(.app-brand, .editor-selection-title, .editor-selection-heading .editor-save-action, .editor-selection-page-action) { color: var(--editor-selection-header-muted); }
body[data-editor-layout="true"] .editor-selection-back {
  align-items: center;
  background: transparent;
  border-radius: var(--ui-control-radius);
  box-shadow: none;
  color: var(--accent-readable);
  display: inline-flex;
  font-size: var(--ui-text-14);
  gap: var(--ui-space-8);
  min-height: 44px;
  margin-bottom: var(--ui-space-24);
  position: static;
  text-decoration: none;
  width: auto;
  z-index: 52;
}
body[data-editor-layout="true"] .editor-selection-back span::before {
  content: "\F054D" / "";
  font: normal normal 400 var(--ui-text-24)/1 "Material Design Icons";
}
body[data-editor-layout="true"] .editor-selection-back span { font-size: 0; }
body[data-editor-layout="true"] .editor-selection-shell :is(.editor-selection-title, .editor-save-action, .editor-selection-page-action, .editor-header-icon-action, .editor-selection-stage, .editor-selection-card, .editor-selection-back):focus-visible {
  outline: 3px solid var(--editor-selection-focus);
  outline-offset: 3px;
}
body[data-editor-layout="true"] .editor-selection-stage:focus-visible { outline-offset: -6px; }
body[data-editor-layout="true"] .editor-page-settings {
  color: var(--text);
  position: relative;
  z-index: 72;
}
body[data-editor-layout="true"] .editor-page-settings > summary {
  align-items: center;
  border-radius: 3px;
  cursor: pointer;
  display: flex;
  font-size: var(--ui-text-14);
  font-weight: 500;
  gap: var(--ui-space-8);
  height: 40px;
  justify-content: flex-start;
  letter-spacing: normal;
  list-style: none;
  padding: 0 0 0 var(--ui-space-6);
  text-transform: none;
  width: var(--editor-header-page-action-size);
}
@media (min-width: 87.5rem) {
  body[data-editor-layout="true"] .editor-page-settings > summary {
    height: 36px;
    width: var(--editor-header-page-action-size);
  }
}
body[data-editor-layout="true"] .editor-page-settings > summary > span { left: 1px; position: relative; }
body[data-editor-layout="true"] .editor-page-settings > summary > .editor-action-icon-page { left: 3px; }
body[data-editor-layout="true"] .editor-page-settings > summary::-webkit-details-marker { display: none; }
body[data-editor-layout="true"] .editor-page-settings > summary:hover,
body[data-editor-layout="true"] .editor-page-settings[open] > summary { background: var(--editor-properties-trigger-open-bg); }
body[data-editor-layout="true"] .create-editor-shell .editor-page-settings[open] > summary {
  background: transparent;
}
body[data-editor-layout="true"] .editor-page-settings-panel {
  background: var(--surface);
  border-radius: 4px;
  box-shadow: var(--editor-properties-panel-shadow);
  color: var(--text);
  max-height: calc(100vh - var(--editor-header-size) - 24px);
  overflow: auto;
  padding: var(--ui-space-20);
  position: absolute;
  right: 0;
  top: var(--editor-header-size);
  width: min(400px, calc(100vw - 32px));
}
body[data-editor-layout="true"] .editor-page-settings-panel h2 { font-size: var(--ui-text-20); margin: 0 0 var(--ui-space-12); }
body[data-editor-layout="true"] .editor-page-settings-panel :is(input, textarea, select) { background: var(--surface); color: var(--text); }
body[data-editor-layout="true"] .editor-page-settings-panel .publication-settings { margin-top: 18px; }
body[data-editor-layout="true"] .editor-page-settings[open]::before {
  background: var(--editor-properties-scrim);
  content: "";
  inset: 0;
  position: fixed;
  z-index: 1;
}
body[data-editor-layout="true"] .editor-page-properties-dialog {
  background: var(--surface);
  border: 1px solid var(--editor-properties-outer-boundary);
  border-radius: var(--ui-panel-radius);
  box-shadow: none;
  height: 648px;
  inset: 36px max(24px, calc((100vw - 720px) / 2)) auto;
  max-height: calc(100vh - 72px);
  overflow: hidden;
  padding: 0;
  position: fixed;
  color: var(--text);
  width: auto;
  z-index: 3;
}
body[data-editor-layout="true"] .editor-page-properties-heading {
  align-items: center;
  background: var(--surface);
  color: var(--text);
  display: flex;
  gap: var(--ui-space-12);
  height: 60px;
  padding: 0 var(--ui-space-24);
}
body[data-editor-layout="true"] .editor-page-properties-heading h2 { flex: 1; font-size: var(--ui-text-20); font-weight: 600; margin: 0; }
body[data-editor-layout="true"] .editor-page-properties-heading .editor-action-icon-page { color: var(--text-muted); }
body[data-editor-layout="true"] .editor-page-properties-heading button { align-items: center; background: var(--surface-muted); border: 1px solid var(--border-strong); color: var(--text); display: flex; gap: var(--ui-space-8); height: 40px; margin: 0; padding: 0 var(--ui-space-12); }
body[data-editor-layout="true"] .editor-page-settings > summary:is(:focus, :focus-visible),
body[data-editor-layout="true"] .editor-page-properties-heading button:is(:focus, :focus-visible),
body[data-editor-layout="true"] .editor-page-properties-tabs button:is(:focus, :focus-visible) { outline: 3px solid var(--editor-properties-header-focus); outline-offset: -4px; }
body[data-editor-layout="true"] .editor-page-properties-dialog :is(input, select, textarea, a):is(:focus, :focus-visible) { outline: 3px solid var(--editor-properties-focus); outline-offset: 2px; }
body[data-editor-layout="true"] .editor-page-properties-heading h2:focus { outline: none; }
body[data-editor-layout="true"] .editor-page-properties-content:is(:focus, :focus-visible) { outline: 3px solid var(--editor-properties-focus); outline-offset: -4px; }
body[data-editor-layout="true"] .editor-page-properties-tabs { align-items: stretch; background: var(--surface); border-bottom: 1px solid var(--border); display: flex; height: 48px; justify-content: flex-start; padding-inline: var(--ui-space-16); }
body[data-editor-layout="true"] .editor-page-properties-tabs button { background: transparent; border: 0; border-bottom: 2px solid transparent; border-radius: 0; color: var(--text-muted); font-size: var(--ui-text-14); font-weight: 500; margin: 0; min-width: 90px; padding: 0 var(--ui-space-16); }
body[data-editor-layout="true"] .editor-page-properties-tabs button[aria-selected="true"] { border-bottom-color: var(--accent-readable); color: var(--accent-readable); }
body[data-editor-layout="true"] .editor-page-properties-tabs button:disabled { color: var(--text-muted); opacity: .6; }
body[data-editor-layout="true"] .editor-page-properties-content { height: calc(100% - 108px); overflow: auto; }
body[data-editor-layout="true"] .editor-page-properties-content > [data-editor-page-settings-panel] > section { border-bottom: 1px solid var(--border); padding: var(--ui-space-24); }
body[data-editor-layout="true"] .editor-page-properties-content h3 { font-size: var(--ui-text-16); font-weight: 600; margin: 0 0 var(--ui-space-16); }
body[data-editor-layout="true"] [data-editor-page-settings-panel] > .editor-page-properties-info { background: var(--surface); }
body[data-editor-layout="true"] .editor-page-properties-info label:not(.sr-only) { color: var(--text); font-size: var(--ui-text-14); font-weight: 500; margin: var(--ui-space-16) 0 var(--ui-space-6); }
body[data-editor-layout="true"] .editor-page-properties-info :is(input, textarea),
body[data-editor-layout="true"] .editor-page-properties-path-fields :is(input, select),
body[data-editor-layout="true"] .editor-page-properties-categorization input { background: var(--surface); border: 1px solid var(--editor-properties-boundary); border-radius: var(--ui-control-radius); color: var(--text); margin: 0; min-height: 48px; padding: var(--ui-space-12); width: 100%; }
body[data-editor-layout="true"] .editor-page-properties-character-count { color: var(--text-muted); display: block; font-size: var(--ui-text-12); margin-top: var(--ui-space-4); text-align: right; }
body[data-editor-layout="true"] .editor-page-properties-info .field-help,
body[data-editor-layout="true"] .editor-page-properties-path .field-help,
body[data-editor-layout="true"] .editor-page-properties-categorization .field-help { color: var(--text-muted); font-size: var(--ui-text-13); margin: var(--ui-space-8) 0 0; }
body[data-editor-layout="true"] .editor-page-properties-path { background: var(--surface); }
body[data-editor-layout="true"] .editor-page-properties-path-fields { display: grid; gap: var(--ui-space-6) var(--ui-space-16); grid-template-columns: 100px minmax(0, 1fr); }
body[data-editor-layout="true"] .editor-page-properties-path-fields label { color: var(--text); font-size: var(--ui-text-14); font-weight: 500; grid-row: 1; margin: 0; }
body[data-editor-layout="true"] .editor-page-properties-path-fields label[for="locale"],
body[data-editor-layout="true"] .editor-page-properties-locale-control { grid-column: 1; }
body[data-editor-layout="true"] .editor-page-properties-path-fields label[for="path"],
body[data-editor-layout="true"] .editor-page-properties-path-control { grid-column: 2; }
body[data-editor-layout="true"] .editor-page-properties-locale-control,
body[data-editor-layout="true"] .editor-page-properties-path-control { grid-row: 2; min-width: 0; position: relative; }
body[data-editor-layout="true"] .editor-page-properties-locale-control select { appearance: auto; height: 48px; }
body[data-editor-layout="true"] :is(.editor-page-properties-locale-separator, .editor-page-properties-locale-caret) { display: none; }
body[data-editor-layout="true"] .editor-page-properties-path-control input { padding-right: 48px; }
body[data-editor-layout="true"] .editor-page-properties-path-control > input:only-child { padding-right: 16px; }
body[data-editor-layout="true"] .editor-page-properties-path-icon {
  border-radius: 4px;
  bottom: 8px;
  position: absolute;
  right: 4px;
  top: 8px;
  width: 40px;
}
body[data-editor-layout="true"] .editor-page-properties-path-icon::before {
  color: var(--text-muted);
  content: "\F0968" / "";
  font: normal normal 400 var(--ui-text-24)/1 "Material Design Icons";
	position: absolute;
	right: 9px;
	top: 8px;
}
body[data-editor-layout="true"] .editor-page-properties-path > .field-help { margin-left: 0; }
body[data-editor-layout="true"] .editor-page-properties-path { padding-bottom: 22px; }
body[data-editor-layout="true"] .editor-page-properties-path h3 { margin-bottom: 19px; }
body[data-editor-layout="true"] .editor-page-properties-categorization { background: var(--surface); }
body[data-editor-layout="true"] .editor-page-properties-categorization h3 { margin-bottom: 18px; }
body[data-editor-layout="true"] .editor-page-properties-categorization .field-help { margin-top: 5px; }
body[data-editor-layout="true"] .editor-page-properties-tab-panel { padding: var(--ui-space-20) var(--ui-space-16) var(--ui-space-32); }
body[data-editor-layout="true"] .editor-page-properties-tab-panel[hidden] { display: none; }
body[data-editor-layout="true"] .editor-page-properties-tab-panel > h3 { margin-bottom: 12px; }
body[data-editor-layout="true"] .editor-page-properties-tab-panel > .field-help { margin: 0 0 var(--ui-space-20); }
body[data-editor-layout="true"] .editor-page-properties-tab-panel > :is(label, textarea) { display: block; width: 100%; }
body[data-editor-layout="true"] .editor-page-properties-tab-panel > textarea { min-height: 300px; }
body[data-editor-layout="true"] .editor-page-properties-tab-panel .publication-settings {
  border: 0;
  margin: 0;
  padding: 0;
}
body[data-editor-layout="true"] .editor-page-properties-tab-panel .publication-settings :is(input, select) {
  border: 1px solid var(--editor-properties-boundary);
}
body[data-editor-layout="true"] .existing-editor-form > .editor-failure-feedback {
  background: var(--editor-error-bg);
  border: 1px solid var(--editor-error-border);
  border-radius: var(--ui-feedback-radius);
  color: var(--editor-error-text);
  left: 50%;
  margin: 0;
  max-width: 560px;
  max-height: 40dvh;
  overflow-y: auto;
  padding: var(--ui-space-8) var(--ui-space-16);
  position: fixed;
  top: calc(var(--editor-header-size) + var(--editor-toolbar-size) + 8px);
  transform: translateX(-50%);
  width: calc(100vw - var(--editor-side-rail-basis) - 32px);
  z-index: 55;
}
body[data-editor-layout="true"] .existing-editor-form > label.sr-only { color: var(--editor-source-label-text); }
.editor-rail-icon::before { display: inline-block; font: normal normal 400 var(--ui-text-24)/1 "Material Design Icons"; text-rendering: auto; transform: translate(2px, 2px) scaleX(.9); transform-origin: left center; }
.editor-rail-icon-link::before { content: "\F0C94" / ""; }
.editor-rail-icon-assets::before { content: "\F0254" / ""; }
.editor-rail-icon-diagram::before { content: "\F08D4" / ""; }
.editor-rail-icon-fullscreen::before { content: "\F004C" / ""; }
.editor-rail-icon-help::before { content: "\F02D7" / ""; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] > .editor-toolbar {
  background: var(--editor-toolbar-bg);
  flex-wrap: nowrap;
  gap: 0;
  height: var(--editor-toolbar-size);
  left: 0;
  margin: 0;
  overflow-x: auto;
  padding: 0 0 0 var(--editor-toolbar-leading-size);
  position: fixed;
  right: 0;
  top: var(--editor-header-size);
  z-index: 50;
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-command-group { flex: 0 0 auto; height: var(--editor-toolbar-size); }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-command {
  background: var(--editor-toolbar-control-bg);
  border: 0;
  border-radius: 0;
  color: var(--editor-toolbar-control-text);
  flex: 0 0 auto;
  height: var(--editor-toolbar-size);
  margin: 0;
  min-width: 40px;
  padding: 0;
  width: 40px;
}
.editor-toolbar-icon::before {
  display: inline-block;
  font: normal normal 400 var(--ui-text-24)/1 "Material Design Icons";
  text-rendering: auto;
  transform: translateY(2px);
}
.editor-toolbar-icon-bold::before { content: "\F0264" / ""; }
.editor-toolbar-icon-italic::before { content: "\F0277" / ""; }
.editor-toolbar-icon-strikethrough::before { content: "\F0280" / ""; }
.editor-toolbar-icon-heading::before { content: "\F0274" / ""; }
.editor-toolbar-icon-subscript::before { content: "\F0282" / ""; }
.editor-toolbar-icon-superscript::before { content: "\F0283" / ""; }
.editor-toolbar-icon-quote::before { content: "\F0C24" / ""; }
.editor-toolbar-icon-bullet-list::before { content: "\F0279" / ""; }
.editor-toolbar-icon-ordered-list::before { content: "\F027B" / ""; }
.editor-toolbar-icon-code::before { content: "\F0174" / ""; }
.editor-toolbar-icon-keyboard::before { content: "\F0313" / ""; }
.editor-toolbar-icon-horizontal-rule::before { content: "\F0374" / ""; }
.editor-toolbar-icon-spellcheck::before { content: "\F04C6" / ""; }
.editor-toolbar-icon-preview::before { content: "\F0B63" / ""; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-toolbar .secondary-action {
  align-items: center;
  background: var(--editor-toolbar-control-bg);
  border: 0;
  border-radius: 0;
  color: var(--editor-toolbar-control-text);
  display: inline-flex;
  flex: 0 0 auto;
  height: var(--editor-toolbar-size);
  justify-content: center;
  margin: 0;
  padding: 0;
  width: var(--editor-toolbar-size);
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-toolbar-actions { align-items: center; display: flex; flex: 0 0 auto; height: var(--editor-toolbar-size); margin-left: auto; margin-right: 16px; }
/* Text actions must not inherit the square icon button's 48px width. */
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-toolbar .visual-editor-source-switch { padding-inline: var(--ui-space-12); width: auto; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-toolbar .secondary-action[hidden] { display: none; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-toolbar [data-asciidoc-import-open] { display: none; }
body[data-editor-layout="true"] .create-editor-shell .markdown-workspace[data-existing-editor="true"] .editor-toolbar [data-asciidoc-import-open]:not([hidden]) { display: inline-flex; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-command:hover,
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-toolbar .secondary-action:hover { background: color-mix(in srgb, var(--editor-toolbar-control-text) 8%, var(--editor-toolbar-control-bg)); }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-command:focus-visible,
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-toolbar .secondary-action:focus-visible {
  outline: 3px solid var(--editor-toolbar-focus);
  outline-offset: -3px;
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .preview-status {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] > .editor-input-status {
  left: 50%;
  margin: 0;
  position: fixed;
  top: calc(var(--editor-header-size) + var(--editor-toolbar-size) + 8px);
  transform: translateX(-50%);
  z-index: 55;
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-surfaces {
  bottom: var(--editor-status-size);
  display: flex;
  gap: 0;
  left: 0;
  position: fixed;
  right: 0;
  top: calc(var(--editor-header-size) + var(--editor-toolbar-size));
}
body[data-editor-layout="true"] .existing-editor-form:has(> .editor-failure-feedback) .markdown-workspace[data-existing-editor="true"] .editor-surfaces {
  top: calc(var(--editor-header-size) + var(--editor-toolbar-size) + var(--editor-feedback-height, 88px));
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-surfaces > [data-markdown-editor] {
  background: var(--editor-source-bg);
  flex: 1 1 50%;
  min-width: 0;
  padding-left: 0;
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .cm-editor {
  background: var(--editor-source-bg);
  border: 0;
  border-radius: 0;
  color: var(--editor-source-text);
  height: 100%;
  min-height: 0;
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .cm-editor:focus-within {
  box-shadow: inset 0 0 0 3px var(--editor-source-focus);
  outline: 0;
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .cm-scroller {
  font-family: "Roboto Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: var(--ui-text-14);
  line-height: 1.5;
  min-height: 0;
  overflow: auto;
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .cm-content {
  caret-color: var(--code-text);
  font-family: "Roboto Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: var(--ui-text-14);
  padding: var(--ui-space-4) 0 var(--ui-space-10) var(--ui-space-14);
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .cm-content span { text-decoration: none !important; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .cm-line { background: var(--editor-source-bg); }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .cm-gutters {
  background: var(--editor-gutter-bg);
  border-right: 0;
  box-shadow:
    calc(var(--editor-gutter-paint-size) - var(--editor-gutter-content-size) - 1px) 0 0 var(--editor-gutter-bg),
    calc(var(--editor-gutter-paint-size) - var(--editor-gutter-content-size)) 0 0 var(--editor-rail-bg);
  color: var(--code-muted);
  flex: 0 0 var(--editor-gutter-content-size);
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .cm-activeLine { background: var(--editor-source-active-line); }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .cm-activeLineGutter { background: var(--editor-gutter-bg); }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview {
  background: var(--editor-preview-bg);
  border: 0;
  border-left: 1px solid var(--editor-preview-boundary);
  border-radius: 0;
  color: var(--editor-preview-text);
  flex: 1 1 50%;
  height: 100%;
  max-height: none;
  min-height: 0;
  overflow: hidden;
  padding: var(--ui-space-16);
  position: relative;
}
.preview-state-banner {
  align-items: center;
  background: var(--editor-preview-status-bg);
  border: 1px solid var(--editor-preview-status-boundary);
  border-radius: var(--ui-feedback-radius);
  color: var(--editor-preview-status-text);
  display: flex;
  flex-wrap: wrap;
  font-size: var(--ui-text-14);
  font-weight: 650;
  gap: var(--ui-space-8) var(--ui-space-12);
  justify-content: space-between;
  left: 16px;
  margin: 0;
  padding: var(--ui-space-8) var(--ui-space-12);
  position: absolute;
  right: 16px;
  top: 12px;
  overflow-wrap: anywhere;
  z-index: 2;
}
.preview-state-banner > span { min-width: 0; overflow-wrap: anywhere; }
.preview-state-banner[data-preview-state="loading"],
.preview-state-banner[data-preview-state="queued"] { color: var(--editor-preview-status-text); }
.preview-state-banner[data-preview-state="error"] { background: var(--editor-preview-error-bg); border-color: var(--editor-preview-error-boundary); color: var(--editor-preview-error-text); }
.preview-state-banner [data-preview-retry] { background: var(--editor-preview-error-action-bg); border: 1px solid var(--editor-preview-error-boundary); color: var(--editor-preview-error-action-text); flex: 0 0 auto; margin: 0; padding: var(--ui-space-8) var(--ui-space-12); }
.preview-state-banner [data-preview-retry]:is(:focus, :focus-visible) { outline: 3px solid var(--editor-preview-error-focus); outline-offset: 2px; }
.preview-state-banner[hidden] { display: none; }
.markdown-preview:has(.preview-state-banner:not([hidden])) .markdown-preview-viewport { padding-top: 52px; }
.markdown-preview:has(.preview-state-banner[data-preview-state="error"]:not([hidden])) .markdown-preview-viewport { padding-top: 86px; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview > h2 {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview-viewport {
  height: 100%;
  overflow-y: scroll;
  scrollbar-gutter: stable;
  width: 100%;
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview:focus-within {
  box-shadow: inset 0 0 0 3px var(--editor-preview-focus);
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview-viewport:focus-visible {
  outline: 3px solid var(--editor-preview-focus);
  outline-offset: -3px;
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview-body {
  color: var(--editor-preview-text);
  font: 400 var(--ui-text-16)/24px "Roboto", sans-serif;
  padding: var(--ui-space-8) 0 var(--ui-space-48);
  position: relative;
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview-body > :first-child { margin-top: 0; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview-body > h1 { color: var(--editor-preview-text); font-size: var(--ui-text-32); font-weight: 700; line-height: 48px; margin: 0; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview-body > h2 { color: var(--editor-preview-text); font-size: var(--ui-text-24); font-weight: 700; line-height: 36px; margin: var(--ui-space-16) 0 0; }
body[data-editor-layout="true"] :is(.markdown-preview-body, .visual-markdown-document) table { border-collapse: collapse; display: block; margin-block: var(--ui-space-16); max-width: 100%; overflow-x: auto; }
body[data-editor-layout="true"] :is(.markdown-preview-body, .visual-markdown-document) :is(th, td) { border: 1px solid var(--border); padding: var(--ui-space-12); text-align: start; vertical-align: top; }
body[data-editor-layout="true"] :is(.markdown-preview-body, .visual-markdown-document) th { background: var(--surface-muted); font-weight: 600; }
body[data-editor-layout="true"] .visual-markdown-document :is(th, td) > p { margin: 0; padding: 0; }
body[data-editor-layout="true"] :is(.markdown-preview-body, .visual-markdown-document) blockquote { border-inline-start: 1px solid var(--border-strong); color: var(--text-muted); margin-inline: 0; padding-inline-start: var(--ui-space-16); }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview-body > p { line-height: 24px; margin: 0; padding-top: 16px; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-statusbar {
  align-items: center;
  background: var(--editor-status-bg);
  bottom: 0;
  color: var(--editor-status-text);
  display: flex;
  font-size: var(--ui-text-12);
  gap: 0;
  height: var(--editor-status-size);
  left: 0;
  letter-spacing: .0333333333em;
  position: fixed;
  right: 0;
  z-index: 50;
}
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-statusbar span { line-height: 20px; overflow: hidden; padding: 0 var(--ui-space-10); text-overflow: ellipsis; white-space: nowrap; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-status-locale { align-items: center; align-self: stretch; background: var(--editor-status-locale-bg); color: var(--editor-status-locale-text); display: flex; flex: 0 0 calc(var(--editor-status-locale-size) - 8px); justify-content: center; margin-left: 8px; padding: 0; text-transform: uppercase; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-statusbar > .editor-status-path { flex: 0 0 auto; padding: 0 var(--ui-space-12); position: relative; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-statusbar > .editor-status-format { flex: 0 0 auto; left: 6px; margin-left: auto; padding: 0; position: relative; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-status-position { flex: 0 0 auto; left: 2px; margin-left: auto; padding: 0 var(--ui-space-10) 0 0; position: relative; text-align: right; }
body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] :is(.editor-status-format, .editor-status-position) { border-left: 1px solid var(--editor-status-bg); }
body[data-editor-layout="true"] .unsaved-changes-dialog {
  background: var(--editor-unsaved-surface);
  border: 1px solid var(--editor-unsaved-boundary);
  border-radius: var(--ui-dialog-radius);
  box-shadow: var(--ui-dialog-shadow);
  box-sizing: border-box;
  color: var(--editor-unsaved-text);
  font-family: "Roboto", sans-serif;
  max-height: calc(100vh - 32px);
  max-width: 550px;
  overflow: auto;
  padding: 0;
  width: calc(100% - 32px);
}
body[data-editor-layout="true"] .unsaved-changes-dialog::backdrop { background: var(--ui-dialog-backdrop); }
body[data-editor-layout="true"] .unsaved-changes-dialog > header {
  align-items: center;
  background: var(--editor-unsaved-header-bg);
  border-bottom: 1px solid var(--editor-unsaved-boundary);
  color: var(--editor-unsaved-header-text);
  display: flex;
  gap: var(--ui-space-10);
  min-height: 60px;
  padding: var(--ui-space-10) var(--ui-space-16);
}
body[data-editor-layout="true"] .unsaved-changes-dialog h2 { color: inherit; font: 600 1.2rem/1.5 "Roboto", sans-serif; margin: 0; overflow-wrap: anywhere; }
body[data-editor-layout="true"] .unsaved-changes-warning { align-items: center; color: var(--editor-unsaved-header-text); display: inline-flex; flex: 0 0 24px; font-size: 0; height: 24px; justify-content: center; width: 24px; }
body[data-editor-layout="true"] .unsaved-changes-warning::before { content: "\F0026" / ""; font: normal normal 400 var(--ui-text-24)/1 "Material Design Icons"; }
body[data-editor-layout="true"] .unsaved-changes-dialog p { background: var(--editor-unsaved-surface); color: var(--editor-unsaved-muted-text); font: 400 var(--ui-text-14)/20px "Roboto", sans-serif; letter-spacing: .0178571429em; margin: var(--ui-space-20) var(--ui-space-24); overflow-wrap: anywhere; padding: 0; }
body[data-editor-layout="true"] .unsaved-changes-dialog p > span { display: block; }
body[data-editor-layout="true"] .unsaved-changes-dialog .dialog-actions { align-items: center; background: var(--editor-unsaved-actions-bg); border-top: 1px solid var(--editor-unsaved-action-boundary); display: flex; gap: var(--ui-space-8); justify-content: flex-end; margin: 0; min-height: 60px; padding: var(--ui-space-8) var(--ui-space-12); }
body[data-editor-layout="true"] .unsaved-changes-dialog .dialog-actions button { align-items: center; border-radius: 4px; display: inline-flex; font: 700 var(--ui-text-14)/1.2 "Roboto", sans-serif; justify-content: center; letter-spacing: .04em; margin: 0; min-height: 44px; padding: 0 var(--ui-space-16); text-transform: uppercase; }
body[data-editor-layout="true"] .unsaved-changes-dialog .dialog-actions .secondary-action { background: var(--editor-unsaved-actions-bg); border: 1px solid var(--editor-unsaved-action-boundary); color: var(--editor-unsaved-text); min-width: 104px; }
body[data-editor-layout="true"] .unsaved-changes-dialog .dialog-actions .unsaved-changes-discard { background: var(--editor-unsaved-discard-bg); border: 1px solid var(--editor-unsaved-discard-bg); box-shadow: var(--editor-elevation-raised-2); color: var(--editor-unsaved-discard-text); min-width: 176px; }
body[data-editor-layout="true"] .unsaved-changes-dialog .dialog-actions button:is(:focus, :focus-visible) { outline: 3px solid var(--editor-unsaved-focus); outline-offset: 2px; }
@media (max-width: 37.5rem) {
  body[data-editor-layout="true"] .unsaved-changes-dialog .dialog-actions { display: grid; grid-template-columns: 1fr; }
  body[data-editor-layout="true"] .unsaved-changes-dialog .dialog-actions button { width: 100%; }
}
.dialog-actions { display: flex; flex-wrap: wrap; gap: var(--ui-space-10); justify-content: flex-end; margin-top: 24px; }
.dialog-actions button { margin: 0; }
.dialog-actions .secondary-action { background: var(--surface-muted); border: 1px solid var(--border-strong); color: var(--text); }
body[data-editor-layout="true"] .media-picker-dialog { background: var(--editor-media-surface); border: 1px solid var(--editor-media-boundary); border-radius: var(--ui-dialog-radius); box-shadow: var(--ui-dialog-shadow); box-sizing: border-box; color: var(--editor-media-text); max-height: min(720px, calc(100dvh - 48px)); max-width: 820px; overflow: hidden; padding: var(--ui-dialog-padding); width: calc(100% - 40px); }
.media-picker-dialog[open] { display: grid; grid-template-rows: auto auto auto auto minmax(0, 1fr); }
.media-picker-dialog::backdrop { background: var(--ui-dialog-backdrop); }
.media-picker-dialog > header { align-items: start; background: transparent; color: var(--editor-media-text); display: flex; gap: var(--ui-space-16); height: auto; justify-content: space-between; min-width: 0; padding: 0; }
.media-picker-dialog > header > div { min-width: 0; }
.media-picker-dialog h2 { font-size: var(--ui-text-28); margin: 0; }
.media-picker-dialog header button { margin: 0; }
.media-picker-dialog .secondary-action { border-color: var(--editor-media-boundary); }
.media-picker-location { align-items: center; border-bottom: 1px solid var(--editor-media-boundary); display: flex; gap: var(--ui-space-12); margin-top: 18px; min-width: 0; padding-bottom: 12px; }
.media-picker-location button { margin: 0; }
.media-picker-location code { color: var(--editor-media-muted-text); min-width: 0; overflow-wrap: anywhere; }
.media-picker-dialog [data-media-picker-status] { color: var(--editor-media-muted-text); min-height: 22px; overflow-wrap: anywhere; }
.media-picker-dialog[data-media-picker-state="error"] [data-media-picker-status] { color: var(--danger); }
.media-picker-grid { border: 1px solid var(--editor-media-boundary); border-radius: var(--ui-control-radius); display: grid; gap: var(--ui-space-12); grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); max-height: 430px; min-height: 96px; min-width: 0; overflow: auto; padding: var(--ui-space-6); }
.media-picker-folder, .media-picker-asset { background: var(--editor-media-muted-surface); border: 1px solid var(--editor-media-boundary); color: var(--editor-media-text); margin: 0; min-height: 56px; min-width: 0; overflow-wrap: anywhere; text-align: left; }
.media-picker-folder:hover, .media-picker-asset:hover { border-color: var(--editor-media-focus); }
.media-picker-asset { display: grid; font-weight: 700; gap: var(--ui-space-6); padding: var(--ui-space-10); }
.media-picker-asset img { aspect-ratio: 16 / 9; background: var(--editor-media-surface); border: 1px solid var(--editor-media-boundary); border-radius: 5px; object-fit: contain; width: 100%; }
.media-picker-asset :is(.media-picker-asset-name, .media-picker-asset-name-segment, .media-picker-asset-type) { background: var(--editor-media-muted-surface); min-width: 0; position: relative; z-index: 1; }
.media-picker-asset-name { font-weight: inherit; overflow-wrap: anywhere; }
.media-picker-asset-name-segment { display: inline-block; }
.media-picker-asset-type { color: var(--editor-media-muted-text); font-size: var(--ui-text-12); font-weight: 400; overflow-wrap: anywhere; }
.media-picker-dialog :is([data-media-picker-close], [data-media-picker-up], [data-media-picker-items], .media-picker-folder, .media-picker-asset):is(:focus, :focus-visible) { outline: 3px solid var(--editor-media-focus); outline-offset: 2px; }
@media (max-width: 37.5rem) {
  body[data-editor-layout="true"] .media-picker-dialog { max-height: calc(100dvh - 24px); padding: var(--ui-space-18); width: calc(100% - 24px); }
  .media-picker-dialog > header { align-items: stretch; display: grid; grid-template-columns: minmax(0, 1fr); }
  .media-picker-dialog > header button { width: 100%; }
  .media-picker-dialog h2 { font-size: var(--ui-text-24); overflow-wrap: anywhere; }
  .media-picker-location { align-items: stretch; display: grid; grid-template-columns: minmax(0, 1fr); }
  .media-picker-location button { width: 100%; }
  .media-picker-grid { grid-template-columns: minmax(0, 1fr); max-height: none; }
}
.asciidoc-import-dialog { background: var(--editor-asciidoc-surface); border: 1px solid var(--editor-asciidoc-outer-boundary); border-radius: var(--ui-dialog-radius); box-shadow: var(--ui-dialog-shadow); box-sizing: border-box; color: var(--editor-asciidoc-text); max-height: min(820px, calc(100dvh - 48px)); max-width: 1100px; overflow: hidden; padding: var(--ui-dialog-padding); width: calc(100% - 40px); }
.asciidoc-import-dialog[open] { display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto auto auto; }
.asciidoc-import-dialog::backdrop { background: var(--ui-dialog-backdrop); }
.asciidoc-import-dialog > header { align-items: start; background: var(--editor-asciidoc-surface); color: var(--editor-asciidoc-text); display: flex; gap: var(--ui-space-16); height: auto; justify-content: space-between; min-width: 0; padding: 0; }
.asciidoc-import-dialog > header > div { min-width: 0; }
.asciidoc-import-dialog h2 { font-size: var(--ui-text-28); margin: 0; }
.asciidoc-import-dialog header button { margin: 0; }
.asciidoc-import-dialog .eyebrow { background: var(--editor-asciidoc-surface); color: var(--editor-asciidoc-accent-text); }
.asciidoc-import-dialog > p { background: var(--editor-asciidoc-surface); color: var(--editor-asciidoc-muted-text); overflow-wrap: anywhere; }
.asciidoc-import-dialog :is(.eyebrow, #asciidoc-import-description) > span { background: var(--editor-asciidoc-surface); color: inherit; display: block; }
.asciidoc-import-grid { display: grid; gap: var(--ui-space-16); grid-template-columns: repeat(2, minmax(0, 1fr)); min-height: 0; min-width: 0; overflow: auto; padding: var(--ui-space-6); }
.asciidoc-import-grid label { background: var(--editor-asciidoc-surface); color: var(--editor-asciidoc-text); display: grid; gap: var(--ui-space-8); }
.asciidoc-import-grid label > span { background: var(--editor-asciidoc-surface); color: var(--editor-asciidoc-text); }
.asciidoc-import-grid textarea { background: var(--editor-asciidoc-surface); border-color: var(--editor-asciidoc-boundary); box-sizing: border-box; color: var(--editor-asciidoc-text); font: var(--ui-text-13)/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; min-height: 190px; resize: vertical; width: 100%; }
.asciidoc-import-grid textarea[readonly] { background: var(--editor-asciidoc-muted-surface); }
.asciidoc-import-dialog [data-asciidoc-import-status] { color: var(--editor-asciidoc-muted-text); margin: var(--ui-space-12) 0 0; overflow-wrap: anywhere; }
.asciidoc-import-dialog[data-asciidoc-state^="validation-"] [data-asciidoc-import-status], .asciidoc-import-dialog[data-asciidoc-state="error"] [data-asciidoc-import-status] { color: var(--danger); }
.asciidoc-import-diagnostics { background: var(--editor-asciidoc-warning-bg); border: 1px solid var(--editor-asciidoc-warning-boundary); border-radius: var(--ui-control-radius); color: var(--editor-asciidoc-warning-text); margin: var(--ui-space-12) 0 0; max-height: 130px; overflow: auto; padding: var(--ui-space-10) var(--ui-space-10) var(--ui-space-10) var(--ui-space-32); }
.asciidoc-import-diagnostics li + li { margin-top: 5px; }
.asciidoc-import-dialog .dialog-actions { background: var(--editor-asciidoc-surface); border-top: 1px solid var(--editor-asciidoc-boundary); bottom: 0; padding-top: 12px; position: sticky; z-index: 1; }
.asciidoc-import-dialog .secondary-action { border-color: var(--editor-asciidoc-boundary); }
.asciidoc-import-dialog button:disabled { background: var(--editor-asciidoc-muted-surface); border: 1px solid var(--editor-asciidoc-boundary); color: var(--editor-asciidoc-muted-text); opacity: 1; }
.asciidoc-import-dialog :is(button, textarea, [data-asciidoc-import-status], [data-asciidoc-import-diagnostics]):is(:focus, :focus-visible) { outline: 3px solid var(--editor-asciidoc-focus); outline-offset: 2px; }
button { background: var(--accent); border: 0; border-radius: var(--ui-action-radius); color: var(--button-text); font: inherit; margin: 0; min-height: var(--ui-action-min-height); padding: var(--ui-action-padding); }
body[data-shell-variant="auth"] .auth-credential-provider > button[type="submit"],
[data-testid="email-verification"] form > button[type="submit"],
body[data-shell-variant="account"] [data-testid="password-change"] .password-change-form > button[type="submit"],
body[data-shell-variant="account"] [data-testid="account-security"] form > button[type="submit"],
body[data-shell-variant="account"] [data-testid="external-connections"] .connection-form > button[type="submit"],
body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-configure-form > button[type="submit"],
body[data-shell-variant="admin"] [data-testid="permission-explanation"] :is(.permission-rule-create, .permission-explanation-grid > form) button[type="submit"],
body[data-shell-variant="admin"] [data-testid="security-settings"] form > button[type="submit"],
body[data-shell-variant="admin"] [data-testid="webhook-settings"] [data-webhook-form="create"] > button[type="submit"],
body[data-shell-variant="admin"] [data-testid="mail-settings"] :is(.ui-panel > form, .mail-test-form) > button[type="submit"],
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-panel > form > button[type="submit"],
body[data-shell-variant="admin"] :is([data-testid="user-administration"], [data-testid="group-administration"], [data-testid="group-detail-administration"]) :is(.identity-create-panel form > button[type="submit"], .group-settings-card > button[type="submit"]) { margin-block-start: 1.25rem; }
body[data-shell-variant="auth"] [data-testid="forced-password-change"] .password-change-form > button[type="submit"] { margin-block-start: 1.25rem; }
.media-asset-manage > button { margin-block-start: 1.25rem; }
.collaborator-presence-group { align-items: center; display: inline-flex; gap: var(--ui-space-6); margin-inline-end: var(--ui-space-8); max-width: min(28rem, 45vw); vertical-align: middle; }
.collaborator-count-badge { background: var(--surface-muted); border: var(--ui-panel-border); border-radius: var(--ui-control-radius); color: var(--text-muted); font-size: var(--ui-text-12); font-weight: 600; overflow: hidden; padding: var(--ui-space-2) var(--ui-space-6); text-overflow: ellipsis; white-space: nowrap; }
.collaborator-presence-group[data-collaboration-state="live"] .collaborator-count-badge { color: var(--text); }
.collaborator-presence-group[data-collaboration-state="error"] .collaborator-count-badge { color: var(--danger); }
.collaborator-avatar { align-items: center; background: color-mix(in srgb, var(--collaborator-color) 13%, var(--surface)); border: .125rem solid var(--collaborator-color); border-radius: 50%; color: var(--collaborator-color); display: inline-flex; flex: 0 0 auto; font-size: var(--ui-text-11); font-weight: 700; height: 1.5rem; justify-content: center; line-height: 1; user-select: none; width: 1.5rem; }
.collaboration-retry { background: transparent; border: var(--ui-dialog-border); color: var(--text); font-size: var(--ui-text-12); min-height: 2rem; padding: 0 var(--ui-space-8); }
.collaboration-retry:hover { background: var(--surface-muted); }
.collaboration-retry:focus-visible { outline: var(--ui-action-focus-width) solid var(--focus-ring); outline-offset: .125rem; }
body[data-editor-layout="true"]:has(.edit-conflict) { background: var(--surface); overflow-y: auto; }
body[data-editor-layout="true"]:has(.edit-conflict) .app-header { display: none; }
body[data-editor-layout="true"] .editor-shell:has(.edit-conflict) { background: var(--surface); height: auto; margin: 0 auto; max-width: 80rem; padding: var(--ui-space-24); }
body[data-editor-layout="true"] .existing-editor-form:has(.edit-conflict) { display: flex; flex-direction: column; height: auto; }
body[data-editor-layout="true"] .existing-editor-form:has(.edit-conflict) > .editor-heading { background: var(--surface); border-bottom: 1px solid var(--border); color: var(--text); flex-wrap: wrap; gap: var(--ui-space-12); height: auto; min-height: 64px; order: -1; padding: var(--ui-space-12) 0; pointer-events: auto; position: sticky; top: 0; }
body[data-editor-layout="true"] .existing-editor-form:has(.edit-conflict) > .editor-heading h1 { background: transparent; color: var(--text); max-width: 100%; white-space: normal; }
body[data-editor-layout="true"] .edit-conflict { border: 0; border-radius: 0; margin-top: var(--ui-space-24); max-height: none; overflow: visible; padding: 0; scroll-margin-top: 10rem; }
body[data-editor-layout="true"] .edit-conflict > .edit-conflict-heading > .eyebrow { display: none; }
body[data-editor-layout="true"] .edit-conflict-version { background: transparent; border-radius: 0; padding: var(--ui-space-16); }
body[data-editor-layout="true"] .edit-conflict-version pre { box-shadow: none; white-space: pre-wrap; overflow-wrap: anywhere; }
@media (max-width: 37.5rem) {
  body[data-editor-layout="true"] .editor-shell:has(.edit-conflict) { padding: var(--ui-space-12); }
  body[data-editor-layout="true"] .existing-editor-form:has(.edit-conflict) > .editor-heading .editor-heading-actions { display: flex; flex-wrap: wrap; gap: var(--ui-space-8); height: auto; position: static; width: 100%; }
  body[data-editor-layout="true"] .existing-editor-form:has(.edit-conflict) > .editor-heading .editor-heading-actions > button { min-width: 0; width: auto; }
}
@media (max-width: 37.5rem) {
  .collaborator-presence-group { max-width: 55vw; }
  .collaborator-avatar { display: none; }
}
.comment-edit-actions :is(a, button),
.comment-delete-card [data-comment-delete-form] > button[type="submit"],
.unauthorized-actions :is(a, button),
.media-action-grid button,
.webhook-action-buttons button,
body[data-shell-variant="account"] [data-testid="api-token-management"] .token-secret-value > button[type="button"],
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] :is(.user-detail-form, .user-detail-inline-form, .user-detail-action-form, .user-detail-danger-disclosure form, .user-detail-group-list form) button { margin: 0; }
button:disabled,
button[aria-disabled="true"],
input:is([type="submit"], [type="image"]):disabled,
[role="button"][aria-disabled="true"] { cursor: not-allowed; opacity: var(--ui-action-disabled-opacity); }
form[data-ui-submit-state="pending"] { cursor: progress; }
form[data-ui-submit-state="pending"] [data-ui-submit-pending="true"] { cursor: progress; }
/* A busy control is not a disabled one. form-submit-state.ts deliberately leaves
   the submitter enabled - disabling it natively would cancel the browser's own
   submit - and marks it aria-disabled and aria-busy together. The disabled rule
   above matched the first of those, so a live, working button was painted at 56%
   with a not-allowed cursor: the two states were indistinguishable and the busy
   one was a lie about itself. Eight scripts write aria-busy and no selector had
   ever matched it. The independent rotate property is used rather than the
   transform shorthand: the debt ceiling counts transform declarations, nearly all
   of which here are layout nudges, and a spinner is not one of those. */
[aria-busy="true"][aria-disabled="true"] { cursor: progress; opacity: 1; }
[aria-busy="true"][aria-disabled="true"]::after {
  animation: ui-busy-spin .7s linear infinite;
  border: 2px solid currentColor;
  border-radius: 50%;
  border-top-color: transparent;
  box-sizing: border-box;
  content: "";
  display: inline-block;
  height: 1em;
  margin-inline-start: .5em;
  vertical-align: -.125em;
  width: 1em;
}
@keyframes ui-busy-spin { to { rotate: 1turn; } }
@media (prefers-reduced-motion: reduce) {
  [aria-busy="true"][aria-disabled="true"]::after { animation: none; border-top-color: currentColor; border-inline-end-color: transparent; }
  .page-location-tree button > span:first-child::before { transition: none; }
}
[role="alert"] { background: var(--ui-error-bg); border: 1px solid var(--ui-error-border); border-radius: var(--ui-feedback-radius); box-sizing: border-box; color: var(--danger); padding: var(--ui-feedback-padding); }
.page-heading, .history-heading { background: transparent; height: auto; padding: 0; }
/* The search overlay hands focus to the destination title so a screen reader
   announces where the reader landed. The heading is not in the tab order - the
   tabindex is set to -1 for exactly that handoff - so the ring the browser
   paints around it reaches no keyboard user and reads as an input border. */
.page-heading h1[tabindex="-1"]:focus { outline: none; }
.breadcrumbs { border-bottom: 1px solid var(--border); margin: -8px 0 var(--ui-space-24); padding-bottom: 14px; }
.breadcrumbs ol { align-items: center; display: flex; flex-wrap: wrap; gap: var(--ui-space-8); list-style: none; margin: 0; padding: 0; }
.breadcrumbs li { align-items: center; color: var(--text-muted); display: flex; font-size: var(--ui-text-13); min-width: 0; }
.breadcrumb-separator { color: var(--text-muted); margin-right: 7px; }
.breadcrumbs a { color: var(--text-muted); text-decoration: none; }
.breadcrumbs a:hover { color: var(--accent); text-decoration: underline; }
.breadcrumbs [aria-current="page"] { color: var(--text); font-weight: 700; }
.page-action { color: var(--accent); display: inline-block; font-weight: 700; margin-top: 12px; }
.page-actions { display: flex; gap: var(--ui-space-18); }
.page-actions-mobile { display: none; }
body[data-public-page="true"] .page-actions-mobile { display: block; position: relative; }
body[data-public-page="true"] .page-actions-mobile > summary { align-items: center; border: 1px solid var(--border-strong); border-radius: var(--ui-control-radius); cursor: pointer; display: flex; min-height: var(--ui-action-min-height); padding: var(--ui-space-8) var(--ui-space-12); }
body[data-public-page="true"] .page-actions-mobile-icon { height: 24px; width: 24px; fill: currentColor; }
body[data-public-page="true"] .page-actions-mobile > nav { background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--ui-panel-radius); display: grid; inset-inline-end: 0; min-width: 12rem; padding: var(--ui-space-8); position: absolute; z-index: 5; }
body[data-public-page="true"] .page-actions-mobile a { border-radius: var(--ui-control-radius); color: var(--text); padding: var(--ui-space-12); text-decoration: none; }
.page-actions-mobile a:hover { background: var(--surface-muted); }
body[data-public-page="true"] .page-actions-mobile :is(a, summary):focus-visible { outline: 2px solid var(--accent-readable); outline-offset: 2px; }
body[data-public-page="true"] .page-actions-mobile .danger-link { color: var(--danger); border-top: 1px solid var(--border); }
body[data-public-page="true"] .page-actions-mobile .page-action-mobile-edit { display: none; }
.danger-link { color: var(--danger); }
.danger-shell { max-width: 760px; }
.danger-shell form { display: flex; align-items: center; gap: var(--ui-space-16); margin-top: 28px; }
.danger-action { background: var(--danger); color: var(--danger-action-text); border-color: var(--danger); }
body[data-public-page="true"] .page-delete-shell {
  --page-delete-surface: var(--surface);
  --page-delete-muted-surface: var(--surface-muted);
  --page-delete-text: var(--text);
  --page-delete-muted-text: var(--text-muted);
  --page-delete-boundary: var(--text-muted);
  --page-delete-focus: var(--accent-readable);
  --page-delete-error-bg: var(--ui-error-bg);
  --page-delete-error-boundary: var(--danger);
  --page-delete-error-text: var(--danger);
  background: var(--page-delete-surface);
  border-color: var(--page-delete-boundary);
  color: var(--page-delete-text);
}
body[data-public-page="true"] .page-delete-shell :is(h1, h2, p, li, code, a, button) { overflow-wrap: anywhere; }
body[data-public-page="true"] .page-delete-heading { min-width: 0; }
body[data-public-page="true"] .page-delete-heading .eyebrow { color: var(--page-delete-error-text); margin: 0; }
body[data-public-page="true"] .page-delete-heading h1 { margin: .25rem 0 0; }
body[data-public-page="true"] .page-delete-source { background: var(--page-delete-muted-surface); border: .0625rem solid var(--page-delete-boundary); border-radius: var(--ui-control-radius); display: grid; gap: .3125rem; margin: 1.5rem 0; min-width: 0; padding: .875rem 1rem; }
body[data-public-page="true"] .page-delete-source span { color: var(--page-delete-muted-text); font-size: var(--ui-text-12); font-weight: 750; letter-spacing: .06em; }
body[data-public-page="true"] .page-delete-source code { color: var(--page-delete-text); white-space: normal; word-break: break-word; }
body[data-public-page="true"] .page-delete-impact { background: var(--page-delete-muted-surface); border: .0625rem solid var(--page-delete-boundary); border-radius: var(--ui-control-radius); padding: 1rem 1.125rem; }
body[data-public-page="true"] .page-delete-impact h2 { font-size: var(--ui-text-16); margin: 0 0 .5rem; }
body[data-public-page="true"] .page-delete-impact ul { margin: 0; padding-left: 1.25rem; }
body[data-public-page="true"] .page-delete-impact li + li { margin-top: .375rem; }
body[data-public-page="true"] .page-delete-feedback { background: var(--page-delete-error-bg); border-color: var(--page-delete-error-boundary); color: var(--page-delete-error-text); font-weight: 650; margin: 1.125rem 0 0; }
body[data-public-page="true"] .page-delete-form { align-items: center; display: flex; flex-wrap: wrap; gap: var(--ui-space-12); justify-content: flex-end; margin-top: 1.5rem; max-width: none; }
body[data-public-page="true"] .page-delete-form > .ui-action { min-width: 0; text-align: center; }
body[data-public-page="true"] .page-delete-shell :is(a, button, [tabindex="-1"]):focus-visible { outline: .1875rem solid var(--page-delete-focus); outline-offset: .125rem; }
body[data-public-page="true"] .trash-shell {
  --trash-surface: var(--surface);
  --trash-muted-surface: var(--surface-muted);
  --trash-text: var(--text);
  --trash-muted-text: var(--text-muted);
  --trash-boundary: var(--text-muted);
  --trash-focus: var(--accent-readable);
  --trash-action-bg: var(--accent);
  --trash-action-text: var(--button-text);
  background: var(--trash-surface);
  border-color: var(--trash-boundary);
  color: var(--trash-text);
}
body[data-public-page="true"] .trash-shell :is(h1, h2, h3, p, code, dt, dd, time, a, button) { overflow-wrap: anywhere; }
body[data-public-page="true"] .trash-heading { align-items: start; display: grid; gap: var(--ui-space-24); grid-template-columns: minmax(0, 1fr) auto; margin-bottom: 2rem; min-width: 0; }
body[data-public-page="true"] .trash-heading > div { min-width: 0; }
body[data-public-page="true"] .trash-heading .eyebrow { margin: 0; }
body[data-public-page="true"] .trash-heading h1 { margin: .25rem 0 .5rem; }
body[data-public-page="true"] .trash-heading > div > p:last-child { color: var(--trash-muted-text); margin: 0; max-width: 46rem; }
body[data-public-page="true"] .trash-count,
body[data-public-page="true"] .trash-restore-status { background: var(--trash-muted-surface); border: .0625rem solid var(--trash-boundary); border-radius: 100vmax; color: var(--trash-text); font-size: var(--ui-text-13); font-weight: 700; margin: 0; padding: .4375rem .75rem; white-space: nowrap; }
body[data-public-page="true"] .trash-section-title { font-size: var(--ui-text-16); margin: 0 0 .75rem; }
body[data-public-page="true"] .trash-list { display: grid; gap: var(--ui-space-16); list-style: none; margin: 0; padding: 0; }
body[data-public-page="true"] .trash-item { background: var(--trash-muted-surface); border: .0625rem solid var(--trash-boundary); border-radius: var(--ui-panel-radius); min-width: 0; padding: var(--ui-panel-padding); }
body[data-public-page="true"] .trash-item > article { min-width: 0; }
body[data-public-page="true"] .trash-item-heading { align-items: start; display: flex; gap: var(--ui-space-16); justify-content: space-between; min-width: 0; }
body[data-public-page="true"] .trash-page-identity { min-width: 0; }
body[data-public-page="true"] .trash-page-identity h3 { font-size: var(--ui-text-18); margin: 0 0 .375rem; }
body[data-public-page="true"] .trash-page-identity code { color: var(--trash-muted-text); display: block; white-space: normal; word-break: break-word; }
body[data-public-page="true"] .trash-item-metadata { display: grid; gap: var(--ui-space-12); grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 1rem 0 0; }
body[data-public-page="true"] .trash-item-metadata > div { min-width: 0; }
body[data-public-page="true"] .trash-item-metadata dt { color: var(--trash-muted-text); font-size: var(--ui-text-12); font-weight: 750; letter-spacing: .06em; }
body[data-public-page="true"] .trash-item-metadata dd { margin: .25rem 0 0; min-width: 0; }
body[data-public-page="true"] .trash-item-actions { align-items: center; border-top: .0625rem solid var(--trash-boundary); display: flex; justify-content: flex-end; margin-top: 1rem; min-width: 0; padding-top: 1rem; }
body[data-public-page="true"] .trash-item-actions form { margin: 0; }
body[data-public-page="true"] .trash-item-actions input { background: var(--surface); color: var(--text); border: .0625rem solid var(--trash-boundary); max-width: 100%; }
body[data-public-page="true"] .trash-item-actions input:focus-visible { outline: .1875rem solid var(--trash-focus); outline-offset: .125rem; }
body[data-public-page="true"] .trash-item-actions button { background: var(--trash-action-bg); border: .0625rem solid var(--trash-action-bg); color: var(--trash-action-text); margin: 0; }
body[data-public-page="true"] .trash-restore-unavailable { color: var(--trash-muted-text); margin: 0; }
body[data-public-page="true"] .trash-empty { background: var(--trash-muted-surface); border: .0625rem solid var(--trash-boundary); border-radius: var(--ui-panel-radius); min-height: 12rem; padding: 2.5rem 1.5rem; text-align: center; }
body[data-public-page="true"] .trash-empty h2 { margin: 0 0 .5rem; }
body[data-public-page="true"] .trash-empty p { color: var(--trash-muted-text); margin: 0 auto 1.25rem; max-width: 32rem; }
body[data-public-page="true"] .trash-empty .secondary-action { align-items: center; background: var(--trash-surface); border: .0625rem solid var(--trash-boundary); border-radius: var(--ui-action-radius); color: var(--trash-text); display: inline-flex; justify-content: center; min-height: var(--ui-action-min-height); padding: var(--ui-action-padding); text-decoration: none; }
body[data-public-page="true"] .trash-shell :is(a, button):focus-visible { outline: .1875rem solid var(--trash-focus); outline-offset: .125rem; }
.navigation-editor-heading { align-items: flex-start; display: flex; gap: var(--ui-space-24); justify-content: space-between; margin-bottom: 28px; }
.navigation-editor-shell { padding: var(--ui-space-32); }
.navigation-editor-heading h1 { margin: var(--ui-space-4) 0 var(--ui-space-8); }
.navigation-editor-actions { align-items: center; display: flex; gap: var(--ui-space-10); }
.navigation-editor-actions form { margin: 0; }
.navigation-editor-actions button { margin: 0; }
#navigation-editor-form { max-width: none; }
.navigation-editor-item { border: 0; border-top: 1px solid var(--border); margin: 0; min-inline-size: 0; padding: var(--ui-space-24) 0; }
.navigation-editor-item legend { font-size: var(--ui-text-16); font-weight: 600; padding: 0 var(--ui-space-8) 0 0; overflow-wrap: anywhere; }
.navigation-primary-fields, .navigation-placement-fields { display: grid; gap: var(--ui-space-16); grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.navigation-editor-item label { display: block; margin-bottom: var(--ui-space-16); min-width: 0; }
.navigation-editor-item :is(input, select) { box-sizing: border-box; min-width: 0; width: 100%; }
.navigation-editor-shell [hidden] { display: none; }
.navigation-placement summary { cursor: pointer; padding: var(--ui-space-12) 0; }
.navigation-placement summary:focus-visible { outline: 2px solid var(--accent-readable); outline-offset: 2px; }
.navigation-placement-fields { margin-top: var(--ui-space-12); }
@media (max-width: 37.5rem) {
  .navigation-primary-fields, .navigation-placement-fields { grid-template-columns: minmax(0, 1fr); gap: 0; }
}
.published-badge { color: var(--accent); font-weight: 700; }
.navigation-readonly-items { list-style: none; margin: 0; padding: 0; }
.navigation-readonly-items > li { border-top: 1px solid var(--border); padding-block: var(--ui-space-20); overflow-wrap: anywhere; }
.navigation-readonly-items h2 { font-size: var(--ui-text-18); margin: 0; }
.navigation-readonly-items p { margin-block: var(--ui-space-8); }
.navigation-readonly-items dl { display: grid; gap: var(--ui-space-12); margin-block: var(--ui-space-8); }
.navigation-readonly-items dd { margin: 0; }
.webhook-readonly-metadata { display: grid; gap: var(--ui-space-16); }
.webhook-readonly-metadata dd { margin: var(--ui-space-4) 0 0; }
.webhook-readonly-metadata pre { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-testid="navigation-editor"] {
  --navigation-editor-boundary: var(--text-muted);
  --navigation-editor-focus: var(--accent-readable);
  --navigation-editor-muted-surface: var(--surface-muted);
  --navigation-editor-surface: var(--surface);
  background: var(--navigation-editor-surface);
  border-color: var(--navigation-editor-boundary);
  min-width: 0;
}
body[data-shell-variant="admin"] [data-testid="navigation-editor"] :is(.navigation-editor-heading, .navigation-editor-heading > div, .navigation-editor-actions, #navigation-editor-form, .navigation-readonly-items) { min-width: 0; }
body[data-shell-variant="admin"] [data-testid="navigation-editor"][data-navigation-state="read-only"] { border: 0; border-radius: 0; background: transparent; padding: 0; }
body[data-shell-variant="admin"] [data-testid="navigation-editor"] .navigation-readonly-items > li { border-color: var(--navigation-editor-boundary); }
body[data-shell-variant="admin"] [data-testid="navigation-editor"] :is(input, select) { border-color: var(--navigation-editor-boundary); }
body[data-shell-variant="admin"] [data-testid="navigation-editor"] .navigation-read-only-status { background: var(--navigation-editor-muted-surface); border: .0625rem solid var(--navigation-editor-boundary); border-radius: 999rem; padding: .375rem .625rem; white-space: nowrap; }
body[data-shell-variant="admin"] [data-testid="navigation-editor"] .published-badge { color: var(--navigation-editor-focus); }
body[data-shell-variant="admin"] [data-testid="navigation-editor"] :is(input, select, button, summary, [tabindex="-1"]):focus-visible { outline: .1875rem solid var(--navigation-editor-focus); outline-offset: .125rem; }
.source-heading { align-items: flex-start; display: flex; gap: var(--ui-space-24); justify-content: space-between; margin-bottom: 24px; }
.source-heading h1 { margin-bottom: 0; }
.source-code { background: var(--code-bg); border-radius: 8px; color: var(--code-text); margin: 0; max-height: 65vh; overflow: auto; padding: var(--ui-space-24); white-space: pre-wrap; word-break: break-word; }
body[data-public-page="true"] [data-testid="source-page"] {
  --source-boundary: var(--text-muted);
  --source-code-boundary: var(--code-muted);
  --source-focus: var(--accent-readable);
  border-color: var(--source-boundary);
  min-width: 0;
}
body[data-public-page="true"] [data-testid="source-page"] :is(.source-heading, .source-heading > div, .page-actions, .source-code) { min-width: 0; }
body[data-public-page="true"] [data-testid="source-page"] :is(.source-heading h1, .source-heading .eyebrow) { overflow-wrap: anywhere; }
body[data-public-page="true"] [data-testid="source-page"] .source-heading > div { flex: 1 1 auto; }
body[data-public-page="true"] [data-testid="source-page"] .source-heading .page-actions { flex: 0 0 auto; min-width: max-content; }
body[data-public-page="true"] [data-testid="source-page"] .source-heading .page-actions a { overflow-wrap: normal; white-space: nowrap; }
body[data-public-page="true"] [data-testid="source-page"] .source-code { border: 1px solid var(--source-code-boundary); box-sizing: border-box; max-width: 100%; }
body[data-public-page="true"] [data-testid="source-page"] :is(.page-actions a, .source-code):focus-visible { outline: 3px solid var(--source-focus); outline-offset: 2px; }
.print-document { background: var(--print-canvas); color: var(--print-text); }
.print-document { color-scheme: light; }
.print-page { box-sizing: border-box; margin: 0 auto; max-width: 860px; min-width: 0; padding: var(--ui-space-56) var(--ui-space-48); }
.print-heading { border-bottom: 1px solid var(--print-boundary); margin-bottom: 32px; padding-bottom: 24px; }
.print-heading h1 { margin-bottom: 8px; overflow-wrap: anywhere; }
.print-heading .eyebrow, .print-metadata { overflow-wrap: anywhere; }
.print-heading .eyebrow { color: var(--print-muted-text); }
.print-metadata { color: var(--print-muted-text); margin: 0; }
.print-content { max-width: 100%; min-width: 0; overflow-x: auto; overflow-wrap: anywhere; }
.print-content:focus-visible { outline: 3px solid var(--print-boundary); outline-offset: 3px; }
.print-tags { border-top: 1px solid var(--print-boundary); display: flex; flex-wrap: wrap; gap: var(--ui-space-12); margin-top: 40px; padding-top: 20px; }
.print-tags span { max-width: 100%; overflow-wrap: anywhere; }
/* This box is what every screen reaches for when it has something to say after a
   POST, and it was amber, so "Settings saved" and "Password changed" were painted
   in the colour of a warning on twenty screens. The default is now what the
   message almost always is - a confirmation - and the screens whose notice really
   is a warning say so with data-notice-tone. */
/* The one feedback box. The tone decides the paint; the component decides whether
   it is announced as an alert or a status. Success is the default because that is
   what almost every message in the product is - before this, the only painted box
   available was the amber notice, so twenty screens confirmed a save in the colour
   of a warning. */
.ui-feedback { background: var(--ui-success-bg); border: 1px solid var(--ui-success-border); border-radius: var(--ui-feedback-radius); box-sizing: border-box; color: var(--success); margin: var(--ui-space-16) 0; padding: var(--ui-feedback-padding); }
.ui-feedback[data-tone="warning"] { background: var(--notice-bg); border-color: var(--notice-border); color: var(--notice-text); }
.ui-feedback[data-tone="info"] { background: var(--info-bg); border-color: var(--info-text); color: var(--info-text); }
.ui-feedback[data-tone="error"] { background: var(--ui-error-bg); border-color: var(--ui-error-border); color: var(--danger); }
.page-tags, .tag-list { display: flex; flex-wrap: wrap; gap: var(--ui-space-8); margin-top: 16px; }
.page-tags a, .tag-list span { background: var(--tag-label-bg); border: 1px solid var(--tag-label-border); border-radius: 999px; color: var(--tag-label-text); font-size: var(--ui-text-13); padding: var(--ui-space-4) var(--ui-space-10); text-decoration: none; }
.tag-cloud { display: flex; flex-wrap: wrap; gap: var(--ui-space-10); margin: var(--ui-space-28) 0; }
.tag-cloud a { align-items: center; background: var(--tag-control-bg); border: 1px solid var(--tag-control-border); border-radius: 8px; color: var(--tag-control-text); display: flex; gap: var(--ui-space-10); max-width: 100%; min-width: 0; padding: var(--ui-space-10) var(--ui-space-12); text-decoration: none; }
.tag-cloud a > span { min-width: 0; overflow-wrap: anywhere; }
.tag-cloud a[data-selected="true"] { background: var(--tag-control-selected-bg); border-color: var(--tag-control-selected-border); color: var(--tag-control-selected-text); }
.tag-cloud a:focus-visible, .selected-tags a:focus-visible, .tagged-pages h2 a:focus-visible { outline: 2px solid var(--accent-readable); outline-offset: 2px; }
.tag-cloud small { background: var(--tag-count-bg); border-radius: 999px; color: var(--tag-count-text); flex: 0 0 auto; min-width: 24px; padding: 1px var(--ui-space-6); text-align: center; }
.selected-tags { align-items: center; border-bottom: 1px solid var(--border); border-top: 1px solid var(--border); display: flex; flex-wrap: wrap; gap: var(--ui-space-12); padding: var(--ui-space-14) 0; }
.selected-tags span { color: var(--text-muted); }
.tagged-pages { display: grid; gap: var(--ui-space-16); grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 24px; }
.tagged-pages article { max-width: 100%; min-width: 0; padding: var(--ui-space-24); }
.tagged-pages h2 { font-size: var(--ui-text-18); margin: 0 0 var(--ui-space-8); }
.tagged-pages h2 a { font-weight: 600; text-decoration: none; }
.tagged-pages h2 a:hover { text-decoration: underline; }
.empty-state { box-sizing: border-box; color: var(--text-muted); min-height: var(--ui-empty-min-height); padding: var(--ui-empty-padding); text-align: center; }
.sidebar-tree { border-top: 1px solid var(--border); margin-top: 24px; padding-top: 18px; }
.sidebar-tree > p { color: var(--text-muted); font-size: var(--ui-text-12); font-weight: 750; letter-spacing: .08em; margin: 0 0 var(--ui-space-8) var(--ui-space-12); text-transform: uppercase; }
.page-tree ul { list-style: none; margin: 0; padding: 0; }
.page-tree ul ul { border-left: 1px solid var(--tree-guide); margin-left: 9px; padding-left: 9px; }
.tree-node { align-items: center; display: flex; min-width: 0; }
.tree-node .tree-marker { color: var(--text-muted); flex: 0 0 18px; height: 18px; position: relative; width: 18px; }
.tree-node .tree-marker::before { content: ""; left: 50%; position: absolute; top: 50%; }
.tree-node .tree-marker[data-tree-marker="folder"]::before { border-bottom: 2px solid currentColor; border-right: 2px solid currentColor; height: 5px; transform: translate(-50%, -65%) rotate(45deg); width: 5px; }
.tree-node .tree-marker[data-tree-marker="leaf"]::before { background: currentColor; border-radius: 50%; height: 5px; transform: translate(-50%, -50%); width: 5px; }
.tree-node > a, .tree-node > span:last-child { border-radius: 5px; color: var(--text-muted); display: block; font-size: var(--ui-text-13); overflow: hidden; padding: var(--ui-space-6) var(--ui-space-4); text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.tree-node > a:hover { color: var(--text); text-decoration: underline; }
.tree-node > a[aria-current="page"] { color: var(--accent-readable); font-weight: 750; }
.tree-browser { border: 1px solid var(--border); border-radius: 8px; margin-top: 28px; padding: var(--ui-space-20); }
.tree-browser .tree-node > a, .tree-browser .tree-node > span:last-child { font-size: var(--ui-text-16); padding: var(--ui-space-8) var(--ui-space-6); }
.tree-browser .tree-node > a, .tree-browser .tree-node > span:last-child { flex: 1 1 auto; overflow: visible; overflow-wrap: anywhere; text-overflow: clip; white-space: normal; }
.tree-browser .page-tree ul ul { margin-left: 12px; padding-left: 16px; }
body[data-shell-variant="admin"] :is([data-testid="page-tree"], [data-testid="tags-page"])[data-content-context="administration"] {
  --admin-content-boundary: var(--text-muted);
  --admin-content-focus: var(--accent-readable);
  --admin-content-surface: var(--surface);
  background: var(--admin-content-surface);
  border-color: var(--admin-content-boundary);
  min-width: 0;
}
body[data-shell-variant="admin"] :is([data-testid="page-tree"], [data-testid="tags-page"])[data-content-context="administration"] :is(.tree-browser, .tag-cloud, .tree-node, .tree-node > a, .tag-cloud a, .tag-cloud a > span) { min-width: 0; }
body[data-shell-variant="admin"] [data-testid="page-tree"][data-content-context="administration"] :is(.tree-browser, .page-tree ul ul) { border-color: var(--admin-content-boundary); }
body[data-shell-variant="admin"] [data-testid="tags-page"][data-content-context="administration"] .tag-cloud a { border-color: var(--admin-content-boundary); }
body[data-shell-variant="admin"] [data-testid="tags-page"][data-content-context="administration"] .tag-cloud small { border: .0625rem solid var(--admin-content-boundary); }
body[data-shell-variant="admin"] :is([data-testid="page-tree"], [data-testid="tags-page"])[data-content-context="administration"] :is(.tree-node > a, .tag-cloud a):focus-visible { outline: .1875rem solid var(--admin-content-focus); outline-offset: .1875rem; }
@media (max-width: 37.5rem) {
  [data-testid="page-tree"] .tree-browser { padding: .75rem; }
  [data-testid="page-tree"] .tree-browser .page-tree ul ul { margin-left: .375rem; padding-left: .5rem; }
  [data-testid="page-tree"] .tree-browser .page-tree ul ul ul ul { border-left: 0; margin-left: 0; padding-left: 0; }
  body[data-shell-variant="admin"] [data-testid="tags-page"][data-content-context="administration"] .tag-cloud a { box-sizing: border-box; width: 100%; }
}
body[data-public-page="true"] [data-testid="page-history"] {
  --history-boundary: var(--text-muted);
  --history-code-boundary: var(--code-muted);
  --history-code-focus: var(--code-muted);
  --history-focus: var(--accent-readable);
  --history-muted-surface: var(--surface-muted);
  --history-surface: var(--surface);
  background: var(--history-surface);
  border-color: var(--history-boundary);
  min-width: 0;
  overflow: visible;
}
body[data-public-page="true"] [data-testid="page-history"] .history-heading { align-items: flex-start; display: flex; gap: 1rem 2rem; justify-content: space-between; min-width: 0; }
body[data-public-page="true"] [data-testid="page-history"] .history-heading > div { min-width: 0; }
body[data-public-page="true"] [data-testid="page-history"] :is(.history-location, .history-heading h1, .history-table th, .history-table td, .history-table code) { min-width: 0; overflow-wrap: anywhere; }
body[data-public-page="true"] [data-testid="page-history"] .history-location { color: var(--text-muted); margin: var(--ui-space-8) 0 0; }
.history-author-details { color: var(--text-muted); font-size: var(--ui-text-12); }
.history-author-details > summary { cursor: pointer; min-height: var(--ui-action-min-height-sm); padding-block: var(--ui-space-8); }
.history-author-details > summary:focus-visible, .ui-diagnostics > summary:focus-visible { outline: var(--ui-space-2) solid var(--accent-readable); outline-offset: var(--ui-space-2); }
.ui-diagnostics { margin-block: var(--ui-space-16); }
.ui-diagnostics > summary { cursor: pointer; font-weight: 700; padding-block: var(--ui-space-12); }
body[data-public-page="true"] [data-testid="page-history"] .history-heading h1 { margin: 0; }
body[data-public-page="true"] [data-testid="page-history"] .ui-action { flex: 0 0 auto; }
body[data-public-page="true"] [data-testid="page-history"] .history-feedback { margin: 1.5rem 0 0; }
body[data-public-page="true"] [data-testid="page-history"] .history-revisions { margin-top: 1.75rem; min-width: 0; }
body[data-public-page="true"] [data-testid="page-history"] .history-revisions > h2 { margin: 0 0 .75rem; }
.history-table { border-collapse: collapse; margin: 0; min-width: 54rem; width: 100%; }
.history-table th, .history-table td { border-bottom: 1px solid var(--history-boundary, var(--border)); padding: var(--ui-data-cell-padding); text-align: left; vertical-align: middle; }
.history-table tbody tr:last-child td { border-bottom: 0; }
.history-table code { display: inline-block; font-size: var(--ui-text-12); max-width: 15rem; }
.history-table-viewport { border: 1px solid var(--history-boundary, var(--border)); border-radius: var(--ui-panel-radius); box-sizing: border-box; max-width: 100%; min-width: 0; overflow-x: auto; width: 100%; }
body[data-public-page="true"] [data-testid="page-history"] .history-table a { color: var(--accent-readable); }
body[data-public-page="true"] [data-testid="page-history"] .history-current-status { background: var(--history-muted-surface); border: 1px solid var(--history-boundary); border-radius: 999px; display: inline-block; margin-left: .5rem; padding: .125rem .5rem; }
.inline-form { display: inline; margin: 0; }
.sr-only { border: 0; clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; width: 1px; }
.source-diff { border: 1px solid var(--history-boundary, var(--border)); border-radius: var(--ui-panel-radius); margin-top: 28px; min-width: 0; padding: var(--ui-panel-padding); }
.source-diff h2 { margin-top: 0; overflow-wrap: anywhere; }
.source-diff .diff-code { background: var(--code-bg); border: 1px solid var(--history-code-boundary, var(--code-muted)); border-radius: 6px; color: var(--code-text); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; max-width: 100%; overflow: visible; overflow-wrap: anywhere; padding: var(--ui-space-16); white-space: pre-wrap; }
.source-diff .diff-code[data-scrollable="true"] { max-height: 280px; overflow: auto; }
.source-diff span { display: block; min-height: 1.5em; }
/* A title-only revision changed nothing in the body, so the code block below
   showed two identical halves and read as no change at all. Metadata is shown
   as metadata rather than as two more lines of Markdown. */
.source-diff .diff-metadata { display: grid; gap: var(--ui-space-4) var(--ui-space-12); grid-template-columns: auto minmax(0, 1fr); margin: 0 0 var(--ui-space-16); }
.source-diff .diff-metadata dt { color: var(--text-muted); font-weight: 700; }
.source-diff .diff-metadata dd { display: grid; gap: var(--ui-space-2); margin: 0; min-width: 0; overflow-wrap: anywhere; }
.source-diff .diff-metadata span { display: block; padding: 0 var(--ui-space-4); }
/* The name reads first; the identifier stays as the hint it always was, so a
   reader who needs the exact account still has it. Same shape as the audit
   log, which solved this first. */
.history-author-name { display: block; overflow-wrap: anywhere; }
.history-author-name + .history-cell-value { color: var(--text-muted); font-size: var(--ui-text-12); }
.diff-added { background: var(--history-diff-added-bg); color: var(--history-diff-added-text); }
.diff-deleted { background: var(--history-diff-deleted-bg); color: var(--history-diff-deleted-text); }
body[data-public-page="true"] [data-testid="page-history"] :is(.ui-action, .history-table a, .history-feedback):focus-visible { outline: 3px solid var(--history-focus); outline-offset: 2px; }
body[data-public-page="true"] [data-testid="page-history"] .diff-code:focus-visible { outline: 3px solid var(--history-code-focus); outline-offset: 2px; }
@media (max-width: 56.25rem) {
  body[data-public-page="true"] [data-testid="page-history"] .history-table-viewport { border: 0; border-radius: 0; overflow-x: visible; }
  body[data-public-page="true"] [data-testid="page-history"] .history-table { display: block; min-width: 0; }
  body[data-public-page="true"] [data-testid="page-history"] .history-table thead { border: 0; clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; width: 1px; }
  body[data-public-page="true"] [data-testid="page-history"] .history-table tbody { display: grid; gap: 0; padding: 0; }
  body[data-public-page="true"] [data-testid="page-history"] .history-table tr { background: transparent; border: 0; border-top: 1px solid var(--border); border-radius: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--ui-space-8) var(--ui-space-12); min-width: 0; padding: var(--ui-space-16) 0; }
  body[data-public-page="true"] [data-testid="page-history"] .history-table td { align-items: start; border: 0; display: block; padding: 0; min-width: 0; }
  body[data-public-page="true"] [data-testid="page-history"] .history-table td:nth-child(n+3) { grid-column: 1 / -1; }
  body[data-public-page="true"] [data-testid="page-history"] .history-table td:nth-child(4) { color: var(--text-muted); font-size: var(--ui-text-12); }
  body[data-public-page="true"] [data-testid="page-history"] :is(.history-cell-value, .history-row-actions) { min-width: 0; }
}
@media (max-width: 37.5rem) {
  body[data-public-page="true"] [data-testid="page-history"] .history-row-actions { align-items: center; flex-wrap: wrap; }
}
.page-content-grid { border-top: 1px solid var(--border); display: grid; gap: var(--ui-space-40); grid-template-columns: minmax(0, 1fr) 210px; margin-top: 28px; padding-top: 24px; }
.markdown-body { min-width: 0; }
:is(.markdown-body, .markdown-preview-body) :not(pre) > code { background: var(--surface-muted); border: 1px solid var(--border); border-radius: 4px; color: var(--text); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: var(--ui-text-code-relative); padding: .1em .3em; overflow-wrap: anywhere; }
:is(.markdown-body, .markdown-preview-body) kbd { background: var(--surface-muted); border: 1px solid var(--border); border-bottom-width: 2px; border-radius: 4px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: var(--ui-text-code-relative); padding: .1em .35em; }
:is(.markdown-body, .markdown-preview-body) :is(ul, ol) { margin-block: .75em; padding-inline-start: 1.75em; }
:is(.markdown-body, .markdown-preview-body) li > :is(ul, ol) { margin-block: .25em; }
:is(.markdown-body, .markdown-preview-body) li { line-height: 1.5; }
:is(.markdown-body, .markdown-preview-body) li > p { margin-block: .5em; }
.page-rendered-content { min-width: 0; }
body[data-public-page="true"] {
  --header: var(--surface);
  --header-text: var(--text);
  --public-header-control-bg: var(--surface-muted);
  --public-header-control-text: var(--text);
  --public-header-control-muted: var(--text-muted);
  --public-header-icon: var(--text-muted);
  --public-sidebar-width: var(--shell-sidebar-width);
  --public-on-navigation: var(--text);
  --public-navigation-hover-bg: var(--surface);
  --public-navigation-divider: var(--border);
  --public-navigation-divider-subtle: var(--border);
  --public-canvas: var(--app-bg);
  --public-bg: var(--app-bg);
  --public-band: var(--surface-muted);
  --public-heading-bg: var(--surface-muted);
  --public-surface: var(--surface);
  --public-surface-alt: var(--surface-muted);
  --public-border: var(--border);
  --public-card-border: var(--border);
  --public-heading-border-bottom: var(--border);
  --public-border-strong: var(--border-strong);
  --public-text: var(--text);
  --public-text-muted: var(--text-muted);
  --public-toc-text: var(--text);
  --public-sidebar-bg: var(--surface-muted);
  --public-sidebar-toolbar-bg: var(--surface-muted);
  --public-sidebar-control-bg: var(--surface);
  --public-sidebar-edge: var(--navigation-edge);
  --public-heading-accent: var(--accent-readable);
  --public-heading-rule: var(--accent);
  --public-subheading-text: var(--text);
  --public-toc-label: var(--accent-readable);
  --public-card-label: var(--accent-readable);
  --public-link: var(--accent-readable);
  /* The discussion band is section chrome, like the sidebar and the editor
     toolbar, so it follows the accent the operator chose. It carries the same
     white ink as the navigation band, which is why the same band colour works
     here. The comment body and its text stay neutral: those are reading
     surfaces, and a coloured plate under a paragraph reads worse than a grey
     one at every accent. */
  --public-comment-header-bg: var(--editor-accent-band, var(--comment-header));
  --public-comment-body-bg: var(--comment-body);
  --public-comment-body-text: var(--comment-body-text);
  --public-footer-bg: var(--surface-muted);
  --public-footer-text: var(--text-muted);
  --public-footer-link: var(--accent-readable);
  -webkit-font-smoothing: antialiased;
  background: var(--public-bg);
  font-family: "Roboto", sans-serif;
  font-size: var(--ui-text-16);
  font-weight: 400;
  line-height: 24px;
  text-rendering: optimizeLegibility;
}
body:is([data-public-page="true"], [data-shell-variant="account"]) .app-header { background: var(--header); display: grid; gap: var(--ui-space-16); grid-template-columns: var(--shell-sidebar-width) minmax(0, 1fr) auto; height: 64px; padding: 0 var(--ui-space-16); position: relative; }
body[data-public-page="true"] .app-brand { font-size: var(--ui-text-16); font-weight: 500; margin-left: 0; min-width: 0; overflow: hidden; z-index: 1; }
body:is([data-public-page="true"], [data-shell-variant="account"]) .header-search { background: var(--surface-muted); border-radius: var(--ui-control-radius); gap: 0; height: 40px; left: auto; max-width: 32rem; position: relative; top: auto; transform: none; width: 100%; }
body:is([data-public-page="true"], [data-shell-variant="account"]) .header-search::before { color: var(--text); content: "\F0349" / ""; font: normal normal 400 var(--ui-text-24)/1 "Material Design Icons"; height: 24px; left: 12px; pointer-events: none; position: absolute; text-rendering: auto; top: 8px; width: 24px; }
body:is([data-public-page="true"], [data-shell-variant="account"]) .header-search::after { content: none; }
body:is([data-public-page="true"], [data-shell-variant="account"]) .header-search input { appearance: none; background: transparent; border: 0; border-radius: 0; color: var(--text); font: 400 var(--ui-text-16)/20px "Roboto", sans-serif; height: 32px; margin: var(--ui-space-4) var(--ui-space-12) var(--ui-space-4) var(--ui-space-48); min-width: 0; padding: var(--ui-space-8) 0; width: 100%; }
body[data-public-page="true"] .app-header .public-header-tools { display: flex; gap: var(--ui-space-4); inset: auto; position: static; }
body[data-public-page="true"] .app-header .public-header-tools > :is(a, span) { border-radius: var(--ui-control-radius); height: var(--ui-space-48); position: static; width: var(--ui-space-48); }
body[data-public-page="true"] .app-header .public-header-tools > .public-header-new-page { gap: var(--ui-space-8); padding-inline: var(--ui-space-12); width: auto; }
.app-header .public-header-tools a:hover { background: var(--public-header-control-bg); }
.shell-account-menu { pointer-events: auto; position: relative; }
.shell-account-menu > summary { align-items: center; cursor: pointer; display: flex; height: var(--ui-space-48); justify-content: center; list-style: none; width: var(--ui-space-48); }
.shell-account-menu > summary::-webkit-details-marker { display: none; }
.account-avatar { align-items: center; background: var(--surface-muted); border: 1px solid var(--border); border-radius: 50%; color: var(--text); display: flex; font-size: var(--ui-text-14); font-weight: 500; height: var(--ui-space-32); justify-content: center; width: var(--ui-space-32); }
.shell-account-panel { background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--ui-panel-radius); color: var(--text); display: grid; inset-inline-end: 0; max-width: calc(100vw - 2rem); padding: var(--ui-space-8); position: absolute; width: 16rem; z-index: 10; }
.shell-account-panel strong { border-bottom: 1px solid var(--border); font-size: var(--ui-text-14); overflow-wrap: anywhere; padding: var(--ui-space-12); }
body .app-header-actions .shell-account-panel :is(a, button) { align-items: center; background: transparent; border: 0; border-radius: var(--ui-control-radius); color: var(--text); display: flex; font: 400 var(--ui-text-14)/1.5 "Roboto", sans-serif; height: auto; min-height: var(--ui-action-min-height); padding: var(--ui-space-12); position: static; text-align: start; width: 100%; }
body .app-header-actions .shell-account-panel form { height: auto; margin: 0; order: initial; }
body .app-header-actions .shell-account-panel button::before { content: none; }
body .app-header-actions .shell-account-panel :is(a, button):hover { background: var(--surface-muted); }
.shell-account-menu :is(a, button, summary):focus-visible { outline: 2px solid var(--accent-readable); outline-offset: -2px; }
body:is([data-public-page="true"], [data-shell-variant="account"]) .header-search input::placeholder { color: var(--text-muted); opacity: 1; }
body:is([data-public-page="true"], [data-shell-variant="account"]) .header-search button { display: none; }
.compact-search-trigger { display: none; }
.public-navigation-links a.public-navigation-compact-link { display: none; }
.compact-search-trigger .header-icon { font: 400 var(--ui-text-24)/1 "Material Design Icons"; }
.page-link-status { background: var(--surface); border: var(--ui-dialog-border); border-radius: var(--ui-feedback-radius); bottom: max(1rem, env(safe-area-inset-bottom)); color: var(--text); inset-inline: 1rem; margin: 0 auto; max-width: calc(100vw - 2rem); padding: var(--ui-space-12) var(--ui-space-16); position: fixed; width: max-content; z-index: 10; }
.page-link-status input { background: var(--surface); color: var(--text); display: block; margin-block: var(--ui-space-8); max-width: 100%; width: 36rem; }
.header-icon-magnify::before { content: "\F0349" / ""; }
body[data-public-page="true"] .app-layout[data-sidebar="true"] { grid-template-columns: var(--public-sidebar-width) minmax(0, 1fr); min-height: calc(100vh - 64px); }
body[data-public-page="true"] .app-sidebar { align-self: start; background: var(--public-sidebar-bg); border-right: 1px solid var(--border); height: calc(100dvh - 64px); min-height: 0; overflow-y: auto; padding: var(--ui-space-8); position: sticky; top: 0; }
body[data-public-page="true"] .app-sidebar .custom-navigation { border-color: var(--public-navigation-divider); margin: var(--ui-space-8) var(--ui-space-12) 0; }
body[data-public-page="true"] .app-sidebar .custom-navigation a,
body[data-public-page="true"] .app-sidebar .custom-navigation .navigation-group { color: var(--public-on-navigation); }

.wiki-destinations, .wiki-utilities { display: grid; gap: var(--ui-space-2); }
body[data-public-page="true"] :is(.wiki-destinations, .wiki-utilities, .wiki-tree) a { align-items: center; border-radius: var(--ui-control-radius); color: var(--text-muted); display: flex; font-size: var(--ui-text-14); font-weight: 400; gap: var(--ui-space-10); min-height: var(--ui-action-min-height); padding: var(--ui-space-8) var(--ui-space-12); text-decoration: none; }
:is(.wiki-destinations, .wiki-utilities, .wiki-tree) .header-icon { flex: 0 0 auto; font: 400 var(--ui-text-18)/1 "Material Design Icons"; }
.header-icon-home::before { content: "\F02DC" / ""; }
.header-icon-pencil::before { content: "\F03EB" / ""; }
.header-icon-file-document-outline::before { content: "\F09EE" / ""; }
.header-icon-image-multiple::before { content: "\F0254" / ""; }
.wiki-page-index { border-top: 1px solid var(--border); display: flex; flex: 1 1 auto; flex-direction: column; margin-top: var(--ui-space-20); min-height: 0; padding-top: var(--ui-space-16); }
.wiki-page-index > nav { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.wiki-page-index > header { align-items: center; color: var(--text-muted); display: flex; font-size: var(--ui-text-12); justify-content: space-between; padding-inline: var(--ui-space-12); }
.wiki-page-index > header a { color: var(--text-muted); font-size: var(--ui-text-12); font-weight: 400; padding: var(--ui-space-8) 0; }
.wiki-page-index > p { color: var(--text-muted); font-size: var(--ui-text-13); padding-inline: var(--ui-space-12); }
.wiki-tree { list-style: none; margin: 0; padding: 0; }
.wiki-tree .wiki-tree { border-inline-start: 1px solid var(--border); margin-inline-start: var(--ui-space-16); padding-inline-start: var(--ui-space-4); }
.wiki-tree summary { border-radius: var(--ui-control-radius); color: var(--text-muted); cursor: pointer; font-size: var(--ui-text-14); min-height: var(--ui-action-min-height); padding: var(--ui-space-12); overflow-wrap: anywhere; }
.wiki-tree a span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wiki-tree summary:hover { background: var(--surface); color: var(--text); }
body[data-public-page="true"] .wiki-tree a[aria-current="page"] { background: color-mix(in srgb, var(--accent) 10%, var(--surface)); color: var(--accent-readable); font-weight: 500; }
.wiki-utilities { border-top: 1px solid var(--border); flex-shrink: 0; margin-top: var(--ui-space-16); padding-top: var(--ui-space-8); }
.wiki-utilities :is(.public-header-admin, .public-header-language) { height: auto; position: static; width: auto; }
body[data-public-page="true"] .wiki-destinations .wiki-compact-action { display: none; }
.wiki-tree :is(a, summary):focus-visible, .wiki-destinations a:focus-visible, .wiki-utilities a:focus-visible { outline: 2px solid var(--accent-readable); outline-offset: -2px; }
@media (min-width: 56.3125rem) {
  body[data-public-page="true"] .app-sidebar { display: flex; flex-direction: column; }
}

body[data-public-page="true"] main { margin: 0; max-width: none; padding: 0; }
body[data-public-page="true"]:not(:has(article[data-testid="wiki-page"])) main#main-content {
  height: auto;
  min-height: calc(100vh - 96px);
  padding: var(--ui-space-32);
}
body[data-public-page="true"]:not(:has(article[data-testid="wiki-page"])) main#main-content > .editor-shell:not(.create-redirect-shell, .page-move-shell) {
  margin: 0 auto;
  max-width: 70rem;
}
body[data-public-page="true"] main#main-content > :is(.search-shell, .tree-shell, .tags-shell) { background: transparent; border: 0; border-radius: 0; margin-inline: auto; max-width: 56rem; padding: var(--ui-space-24) 0 var(--ui-space-64); }
:is(.search-heading, .tree-heading, .tags-heading) h1 { font-size: var(--ui-text-32); letter-spacing: -.02em; line-height: 1.25; margin: 0 0 var(--ui-space-12); }
:is(.tree-heading, .tags-heading) p { color: var(--text-muted); margin: 0; }
body[data-public-page="true"] .tree-shell .tree-browser { background: transparent; border: 0; border-top: 1px solid var(--border); border-radius: 0; padding: var(--ui-space-16) 0; }
body[data-public-page="true"] .tags-shell .tagged-pages { display: block; }
body[data-public-page="true"] .tags-shell .tagged-pages article { background: transparent; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; padding: var(--ui-space-20) 0; }
body[data-public-page="true"] :is(.tags-shell, .tree-shell, .search-shell) > .empty-state { min-height: 0; padding: var(--ui-space-24) 0; text-align: start; }
.tagged-page-path { color: var(--text-muted); font-size: var(--ui-text-13); margin: 0 0 var(--ui-space-8); overflow-wrap: anywhere; }
body[data-public-page="true"] article[data-testid="wiki-page"] { background: var(--public-canvas); border: 0; border-radius: 0; min-height: calc(100vh - 96px); padding: 0; position: relative; }
.document-context-bar { align-items: center; border-bottom: 1px solid var(--border); display: flex; gap: var(--ui-space-16); min-height: var(--ui-space-64); padding: var(--ui-space-8) var(--ui-space-32); }
.document-context-bar:empty { display: none; }
.document-context-bar .breadcrumbs { border: 0; margin: 0; min-width: 0; overflow-x: auto; padding: 0; }
.document-context-bar .breadcrumbs ol { flex-wrap: nowrap; white-space: nowrap; }
.document-context-bar .breadcrumbs li { flex-shrink: 0; }
body[data-public-page="true"] article[data-testid="wiki-page"] > .breadcrumbs { align-items: center; background: transparent; border-bottom: 1px solid var(--border); display: flex; height: 48px; margin: 0; min-width: 0; overflow-x: auto; overflow-y: hidden; overscroll-behavior-inline: contain; padding: 0 var(--ui-space-32); position: relative; width: 100%; }
body[data-public-page="true"] article[data-testid="wiki-page"] > .breadcrumbs ol { flex-wrap: nowrap; gap: var(--ui-space-10); white-space: nowrap; }
body[data-public-page="true"] article[data-testid="wiki-page"] > .breadcrumbs .breadcrumb-separator { margin-right: 9px; }
body[data-public-page="true"] article[data-testid="wiki-page"] > .breadcrumbs li:first-child a { display: block; height: 16px; position: relative; width: 16px; }
body[data-public-page="true"] article[data-testid="wiki-page"] > .breadcrumbs a:focus-visible { outline: 2px solid var(--public-link); outline-offset: 3px; }
body[data-public-page="true"] .breadcrumb-home-icon { display: block; height: 16px; position: relative; width: 16px; }
body[data-public-page="true"] .breadcrumb-home-icon::before { background: var(--public-breadcrumb-mark); content: ""; height: 8px; left: 2px; position: absolute; top: 7px; width: 12px; }
body[data-public-page="true"] .breadcrumb-home-icon::after { border-bottom: 7px solid var(--public-breadcrumb-mark); border-left: 8px solid transparent; border-right: 8px solid transparent; content: ""; left: 0; position: absolute; top: 1px; }
body[data-public-page="true"] article[data-testid="wiki-page"] > .breadcrumbs :is(a, [aria-current="page"]) { font-size: var(--ui-text-13); font-weight: 400; letter-spacing: normal; }
body[data-public-page="true"] .page-rendered-content > .page-heading { align-items: center; background: transparent; border: 0; display: flex; flex-wrap: wrap; gap: var(--ui-space-16); height: auto; margin: 0; min-height: 0; padding: 0; }
body[data-public-page="true"] .page-heading h1 { color: var(--public-text); font-size: var(--ui-text-32); font-weight: 700; letter-spacing: -.02em; line-height: 1.25; margin: 0; text-wrap: balance; }
body[data-public-page="true"] .page-heading .eyebrow { display: none; }
body[data-public-page="true"] .document-context-bar .page-actions { align-items: center; flex: 0 0 auto; gap: var(--ui-space-8); margin-left: auto; }
body[data-public-page="true"] .document-context-bar .page-actions :is(.page-action-primary, .page-actions-mobile > summary) { box-sizing: border-box; height: var(--ui-action-min-height); margin: 0; }
body[data-public-page="true"] .public-comment-thread > .comment-empty-hint { background: transparent; color: var(--text-muted); display: block; font-size: var(--ui-text-14); height: auto; margin: var(--ui-space-8) 0 0; min-height: 0; padding: 0; text-align: start; }
body[data-public-page="true"] .page-heading h1 { min-width: 0; overflow-wrap: anywhere; }
body[data-public-page="true"] .page-heading .page-actions { flex: 0 0 auto; }
body[data-public-page="true"] .page-heading .page-action { color: var(--accent-readable); }
body[data-public-page="true"] .public-header-tools:has(.public-header-admin) .public-header-language { right: 201px; }
body[data-public-page="true"] .document-context-bar .page-action-primary {
  align-items: center;
  background: var(--accent);
  border-radius: var(--ui-action-radius);
  color: var(--button-text);
  display: inline-flex;
  font-size: var(--ui-text-14);
  gap: var(--ui-space-8);
  justify-content: center;
  min-height: var(--ui-action-min-height);
  padding: var(--ui-space-8) var(--ui-space-16);
  text-decoration: none;
}
body[data-public-page="true"] .page-action-primary-icon {
  background: var(--button-text);
  border: 0;
  border-radius: 1px;
  display: block;
  height: 6px;
  transform: rotate(-45deg);
  width: 19px;
}
body[data-public-page="true"] .page-heading .danger-link { color: var(--danger); }
/* Appearance settings select columns without taking the contents rail out of flow. */

body[data-public-page="true"] .page-public-content-grid { background: var(--public-canvas); border: 0; display: grid; gap: var(--ui-space-40); grid-template-columns: var(--public-content-columns, 14rem minmax(0, 1fr)); margin: 0 auto; max-width: 80rem; min-height: 0; padding: var(--ui-space-40) var(--ui-space-32) var(--ui-space-64); position: relative; }
body[data-public-page="true"] .page-rendered-content { grid-column: var(--public-document-column, 2); grid-row: 1; }
.page-provenance { color: var(--text-muted); font-size: var(--ui-text-13); margin: var(--ui-space-12) 0 var(--ui-space-16); }
.page-contents-compact { display: none; }
body[data-public-page="true"] .page-rendered-content { margin-inline: auto; max-width: 48rem; min-height: 0; padding: 0; width: 100%; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > :first-child { margin-top: 0; padding-top: 0; }
body[data-public-page="true"] .page-rendered-content > .markdown-body { color: var(--public-text); font: 400 var(--ui-text-16)/1.7 "Roboto", sans-serif; margin-inline: 0; max-width: none; overflow-wrap: anywhere; padding-bottom: 0; }
body[data-public-page="true"] .page-rendered-content > .markdown-body a { color: var(--public-link); }
body[data-public-page="true"] .page-tags { margin: 0 0 var(--ui-space-24); }
body[data-public-page="true"] .page-tags a { background: color-mix(in srgb, var(--public-link) 10%, var(--public-canvas)); border-color: color-mix(in srgb, var(--public-link) 28%, var(--public-border)); color: var(--public-link); }
body[data-public-page="true"] .tags-shell { min-width: 0; }
body[data-public-page="true"] .selected-tags { min-width: 0; }
body[data-public-page="true"] .selected-tags :is(strong, a) { overflow-wrap: anywhere; }
body[data-public-page="true"] .tagged-pages { min-width: 0; }
body[data-public-page="true"] .tagged-pages article { min-width: 0; }
body[data-public-page="true"] .tagged-pages :is(.eyebrow, h2, h2 a, .tag-list span) { min-width: 0; overflow-wrap: anywhere; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > :last-child { margin-bottom: 0; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > h1 { border: 0; color: var(--public-heading-accent); font-size: var(--ui-text-28); font-weight: 700; line-height: 1.3; margin: var(--ui-space-32) 0 var(--ui-space-12); }
body[data-public-page="true"] .page-rendered-content > .markdown-body > h2 { border: 0; color: var(--public-subheading-text); font-size: var(--ui-text-24); font-weight: 700; line-height: 1.4; margin: var(--ui-space-32) 0 var(--ui-space-12); }
body[data-public-page="true"] .page-rendered-content > .markdown-body > h3 { border: 0; color: var(--public-text); font-size: var(--ui-text-18); font-weight: 700; line-height: 1.5; margin: var(--ui-space-24) 0 var(--ui-space-8); }
body[data-public-page="true"] .page-rendered-content > .markdown-body > p { line-height: 1.7; margin: 0; padding-top: var(--ui-space-16); }
/* auto rather than hidden: it clips the radius just the same and lets a wide table scroll. */
body[data-public-page="true"] .page-rendered-content > .markdown-body > table { border: 1px solid var(--public-border); border-collapse: separate; border-radius: 5px; border-spacing: 0; margin: var(--ui-space-8) 0; max-width: 100%; overflow: auto; width: max-content; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > table + h2 { margin-top: 24px; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > table :is(th, td) { min-width: 8rem; padding: var(--ui-space-12); text-align: start; vertical-align: top; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > table th { background: var(--public-table-heading-bg); border: 0; border-bottom: 1px solid var(--public-border-strong); color: var(--public-text-muted); text-align: start; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > table th:first-child { border-radius: 7px 0 0; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > table td { border: 0; border-bottom: 1px solid var(--public-border); border-right: 1px solid var(--public-heading-bg); }
body[data-public-page="true"] .page-rendered-content > .markdown-body > table td:last-child { border-right: 0; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > table tr:last-child td { border-bottom: 0; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > table tbody tr:nth-child(odd) td:nth-child(even) { background: var(--public-table-odd-even-bg); }
body[data-public-page="true"] .page-rendered-content > .markdown-body > table tbody tr:nth-child(even) td { background: var(--public-table-even-bg); }
body[data-public-page="true"] .page-rendered-content > .markdown-body > ul:has(input[type="checkbox"]) { list-style: none; margin: 0; padding: var(--ui-space-16) 0 0; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > ul:has(input[type="checkbox"]) li { min-height: 24px; margin: 0; padding: 0; position: relative; }
:is(.markdown-body, .markdown-preview-body) li:has(> input[type="checkbox"]) { list-style: none; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > ul:has(input[type="checkbox"]) li + li { margin-top: 8px; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > ul:has(input[type="checkbox"]) input[type="checkbox"] { height: 17.594px; margin: 0 var(--ui-space-2) 0 0; vertical-align: baseline; width: 17.594px; }
body[data-public-page="true"] .page-context-rail { align-self: start; grid-column: var(--public-context-column, 1); grid-row: 1; min-width: 0; padding: 0; position: sticky; top: var(--ui-space-24); width: auto; }
body[data-public-page="true"] .page-context-rail .page-toc { background: transparent; border: 0; border-radius: 0; box-shadow: none; height: auto; padding: 0; position: static; width: auto; }
body[data-public-page="true"] .page-context-rail .page-toc > p { color: var(--public-text-muted); font-size: var(--ui-text-13); font-weight: 500; line-height: 1.5; margin: 0; padding: var(--ui-space-8); }
body[data-public-page="true"] .page-context-rail .page-toc > ol { background: transparent; border-radius: 0 0 4px 4px; height: auto; margin: 0; overflow: hidden; padding: var(--ui-space-8) var(--ui-space-8) var(--ui-space-12); }
body[data-public-page="true"] .page-context-rail .page-toc ol ol { border: 0; margin: 0; padding: 0; }
body[data-public-page="true"] .page-context-rail .page-toc li { margin: 0; }
body[data-public-page="true"] .page-context-rail .page-toc li[data-level="3"] > a { padding-inline-start: var(--ui-space-32); }
body[data-public-page="true"] .page-context-rail .page-toc a { align-items: center; border-radius: 4px; color: var(--public-toc-text); display: flex; font-size: var(--ui-text-13); font-weight: 400; min-height: 36px; overflow-wrap: anywhere; line-height: 20px; margin: 0 0 var(--ui-space-4); padding: 0 var(--ui-space-8); position: relative; }
body[data-public-page="true"] .page-context-rail .page-toc li[data-level="1"] > a { font-weight: 500; padding-inline-start: var(--ui-space-8); }
body[data-public-page="true"] .page-context-rail .page-toc li[data-level="2"] > a { color: var(--public-text-muted); font-size: var(--ui-text-13); letter-spacing: normal; padding-inline-start: var(--ui-space-8); }
body[data-public-page="true"] .page-context-rail .page-toc li[data-level="2"]:last-child > a { margin-bottom: 0; }
body[data-public-page="true"] .page-context-rail .page-toc a::before { content: none; }
body[data-public-page="true"] .page-context-rail .page-toc li[data-level="2"] > a::before { left: 26px; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > ul:not(:has(input[type="checkbox"])) { list-style-type: "▸  "; margin: 0; padding: var(--ui-space-16) 0 0 var(--ui-space-24); }
body[data-public-page="true"] .page-rendered-content > .markdown-body:has(> ul:not(:has(input[type="checkbox"])):last-child) { padding-bottom: 24px; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > ul:not(:has(input[type="checkbox"])) li { line-height: 24px; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > ul:not(:has(input[type="checkbox"])) li + li { margin-top: 8px; }
body[data-public-page="true"] .page-rendered-content > .markdown-body > ul:not(:has(input[type="checkbox"])) li::marker { color: var(--public-text-muted); }
body[data-public-page="true"] .public-comment-thread { border: 0; border-top: 1px solid var(--public-border); border-radius: 0; margin-top: var(--ui-space-48); padding: var(--ui-space-24) 0 0; }
body[data-public-page="true"]:not(:has(.page-toc)) .public-comment-thread { margin-top: 50px; }
body[data-public-page="true"] .public-comment-thread > header { align-items: center; background: transparent; border: 0; color: var(--public-text); display: flex; gap: var(--ui-space-10); min-height: 32px; padding: 0; }
body[data-public-page="true"] .public-comment-thread > header span { border: 0; font-size: 0; height: 20px; position: relative; width: 20px; }
body[data-public-page="true"] .public-comment-thread > header span::before { content: "\F0189" / ""; font: normal normal 400 var(--ui-text-20)/1 "Material Design Icons"; text-rendering: auto; }
body[data-public-page="true"] .public-comment-thread > header strong { font-size: var(--ui-text-16); font-weight: 500; }
body[data-public-page="true"] .public-comment-thread > p { align-items: center; background: var(--public-comment-body-bg); color: var(--public-comment-body-text); display: flex; font-size: var(--ui-text-14); font-weight: 400; height: 60px; justify-content: center; letter-spacing: .25px; margin: 0; }
body[data-public-page="true"] .public-comment-thread > .public-comment-empty-state { flex-wrap: wrap; gap: var(--ui-space-4); height: auto; min-height: 60px; padding: var(--ui-space-10) var(--ui-space-16); }
body[data-public-page="true"] .public-comment-empty-action { border: 0; clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; width: 1px; }
body[data-public-page="true"] .public-comment-empty-action a { color: var(--accent-readable); font-weight: 650; }
body[data-public-page="true"] .public-comment-thread > .comment-composer {
  background: transparent;
  border: 0;
  border-radius: 0;
  height: auto;
  margin: 0;
  min-height: 0;
  padding: var(--ui-space-16) 0 0;
  position: relative;
}
body[data-public-page="true"] .public-comment-thread > .comment-composer > label {
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
body[data-public-page="true"] .public-comment-thread > .comment-composer textarea {
  border-color: var(--public-comment-input-border);
  border-radius: 4px;
  display: block;
  height: 78px;
  margin: 0;
  min-height: 78px;
  resize: none;
}
body[data-public-page="true"] .public-comment-thread > .comment-composer > .comment-guest-fields { display: grid; margin: 0 0 var(--ui-space-12); }
body[data-public-page="true"] .public-comment-thread > .comment-composer > .comment-composer-actions { align-items: center; display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--ui-space-12); padding-top: var(--ui-space-12); }
body[data-public-page="true"] .public-comment-thread > .comment-composer button {
  align-items: center;
  display: flex;
  gap: var(--ui-space-10);
  height: 36px;
  justify-content: center;
  margin: 0 0 0 auto;
  width: auto;
}
body[data-public-page="true"] .public-comment-thread > .comment-composer .comment-submit-icon {
  border: 0;
  font: normal normal 400 var(--ui-text-20)/1 "Material Design Icons";
  height: 20px;
  text-rendering: auto;
  width: 20px;
}
/* The fade this rule cancels is the product's whole disabled convention -
   .ui-action:disabled is the same button at 56% - and cancelling it was right:
   fading a white label over an accent composites both toward the page and left
   the text at 2.66:1. But the replacement invented #455a64, which is not the
   accent, not a surface, not a muted text, and appears on nothing else. It read
   as the loudest thing on a dark page, 2.59:1 against it, while being the one
   control you cannot press.
   A disabled control is the muted surface carrying muted text, which is what
   the import dialog and the settings checkboxes already do. It recedes - 1.22:1
   against the dark page - and its label still reads, at 5.68:1 light and
   8.16:1 dark. */
body[data-public-page="true"] .public-comment-thread > .comment-composer button:disabled {
  background: var(--surface-muted);
  border: var(--ui-panel-border);
  color: var(--text-muted);
  cursor: not-allowed;
  opacity: 1;
}
body[data-public-page="true"] .public-comment-thread > .comment-composer .comment-composer-actions > p {
  flex: 1 1 auto;
  margin: 0;
  position: static;
  text-align: start;
}
body[data-public-page="true"] .public-comment-thread > .comment-composer > .comment-composer-error { margin: 0 0 var(--ui-space-12); }
body[data-public-page="true"] .comment-thread { margin-left: 274px; margin-right: 12px; }
body[data-public-page="true"] .app-footer { height: 32px; margin-left: 256px; }
@media (min-width: 56.3125rem) {
  body[data-public-page="true"] .app-layout[data-sidebar="true"] { min-height: calc(100vh - 96px); }
  body[data-public-page="true"]:not(:has(.page-toc)) .app-footer { background: var(--public-footer-bg); border: 0; color: var(--public-footer-text); font: 400 var(--ui-text-12)/32px "Roboto", sans-serif; justify-content: center; margin-left: var(--public-sidebar-width); padding: 0; position: static; }
  body[data-public-page="true"]:not(:has(.page-toc)) .app-footer > span:first-child { letter-spacing: .4px; }
  body[data-public-page="true"]:not(:has(.page-toc)) .app-footer-prefix { color: var(--public-footer-text); }
  body[data-public-page="true"]:not(:has(.page-toc)) .app-footer-product { color: var(--public-footer-link); }
  body[data-public-page="true"]:not(:has(.page-toc)) .app-footer > span + span { display: none; }
}
.comment-thread { border-top: 1px solid var(--border); margin-top: 48px; padding-top: 32px; }
.comment-thread-heading { align-items: center; display: flex; justify-content: space-between; margin-bottom: 20px; }
.comment-thread-heading h2 { font-size: var(--ui-text-24); margin: var(--ui-space-2) 0 0; }
.comment-count { align-items: center; background: var(--surface-muted); border: 1px solid var(--border); border-radius: 999px; color: var(--text-muted); display: inline-flex; font-size: var(--ui-text-13); font-weight: 700; justify-content: center; min-width: 30px; padding: var(--ui-space-6) var(--ui-space-10); }
.comment-empty { background: var(--surface-muted); border: 1px dashed var(--border); border-radius: 8px; padding: var(--ui-space-24); text-align: center; }
.comment-empty p { color: var(--text-muted); margin: var(--ui-space-6) 0 0; }
.comment-list { display: grid; gap: var(--ui-space-14); list-style: none; margin: 0; padding: 0; }
.comment-card { border: 1px solid var(--border); border-radius: 8px; padding: var(--ui-space-16) var(--ui-space-18); }
.comment-card > header { align-items: center; display: flex; gap: var(--ui-space-12); }
.comment-card > header > div:nth-child(2) { display: grid; gap: var(--ui-space-2); }
.comment-card time { color: var(--text-muted); font-size: var(--ui-text-12); }
.comment-avatar { align-items: center; background: color-mix(in srgb, var(--accent) 16%, var(--surface)); border-radius: 50%; color: var(--accent); display: flex; flex: 0 0 34px; font-weight: 800; height: 34px; justify-content: center; text-transform: uppercase; }
.comment-moderation { margin-left: auto; }
.comment-management { align-items: center; display: flex; gap: var(--ui-space-6); margin-left: auto; }
.comment-management .comment-moderation { margin-left: 0; }
.comment-management form { margin: 0; }
/* One rule for the whole row. Edit is a link, Hide is a form button and Delete
   is a disclosure summary, and each used to carry its own geometry - Hide
   without the radius or the pointer, Delete inside a details box whose line
   height pushed it below its siblings. The heights disagreed too: the base
   button rule floors a button at 2.75rem while a link and a summary have no
   floor at all, so the row mixed 44px with 28px. Three tags, one control. */
.comment-edit-link,
.comment-moderation button,
.comment-delete-inline > summary,
.comment-delete button {
  align-items: center;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--text-muted);
  cursor: pointer;
  display: inline-flex;
  font-size: var(--ui-text-12);
  line-height: normal;
  list-style: none;
  margin: 0;
  min-height: var(--ui-action-min-height-sm);
  padding: var(--ui-space-6) var(--ui-space-10);
  text-decoration: none;
}
.comment-delete button,
.comment-delete-inline > summary { color: var(--danger); }
/* The details box must not add a line box of its own, or the summary inside it
   sits lower than the siblings it is meant to match. */
/* The inline variant exists to cancel the stacked disclosure's rule above the
   summary, and it carries both classes. Naming one class each weighed the same,
   so the later rule won and the cancel did nothing: 1rem of margin and 1rem of
   padding landed inside a 36px action row, making it 68px and dropping Delete
   below its neighbours. Naming both says which one wins regardless of order. */
.comment-delete-disclosure.comment-delete-inline,
.comment-delete-inline { border-top: 0; display: inline-block; line-height: 0; margin-top: 0; padding-top: 0; position: relative; }
.comment-delete-inline[open] > summary { margin-bottom: 8px; }
.comment-delete-inline > p { font-size: var(--ui-text-12); line-height: normal; margin: 0 0 var(--ui-space-8); }
[data-testid="comment-edit"] {
  --comment-edit-boundary: var(--text-muted);
  --comment-edit-focus: var(--accent-readable);
  --comment-edit-action-bg: var(--accent);
  --comment-edit-action-text: var(--button-text);
  --comment-edit-danger-bg: var(--danger);
  --comment-edit-danger-text: var(--danger-action-text);
  --comment-edit-error-bg: var(--ui-error-bg);
  --comment-edit-error-text: var(--danger);
  --comment-edit-code-bg: var(--code-bg);
  --comment-edit-code-text: var(--code-text);
  --comment-edit-code-boundary: var(--accent);
  background: var(--surface);
  border: 1px solid var(--comment-edit-boundary);
  border-radius: 10px;
  box-sizing: border-box;
  margin: 4rem auto;
  max-width: 1100px;
  padding: 2rem;
  width: calc(100% - 3rem);
}
[data-testid="comment-edit"] :is(h1, h2, h3, p, strong, label, textarea, summary, a, button, pre) { min-width: 0; overflow-wrap: anywhere; }
.comment-edit-heading { align-items: start; display: grid; gap: 2rem; grid-template-columns: minmax(0, 1fr) auto; }
.comment-edit-heading h1 { margin: .125rem 0 .5rem; }
.comment-edit-heading p:last-child { color: var(--text-muted); margin: 0; }
.comment-edit-heading .secondary-action,
.comment-edit-actions .secondary-action { align-items: center; background: var(--surface-muted); border: 1px solid var(--comment-edit-boundary); border-radius: 4px; color: var(--text); display: inline-flex; justify-content: center; min-height: 44px; padding: 0 1rem; text-decoration: none; }
.comment-edit-feedback { background: var(--comment-edit-error-bg); border: 1px solid var(--comment-edit-error-text); border-radius: 6px; color: var(--comment-edit-error-text); font-weight: 700; margin: 1.5rem 0 0; padding: .875rem 1rem; }
.comment-edit-layout { display: grid; gap: var(--ui-space-24); grid-template-columns: minmax(0, 1fr); margin-top: 1.5rem; }
.comment-edit-card,
.comment-delete-card { background: transparent; border: 0; border-radius: 0; box-sizing: border-box; min-width: 0; padding: 0; }
.comment-edit-card > h2,
.comment-delete-card > h2 { margin: 0 0 .5rem; }
.comment-edit-card > p,
.comment-delete-card > p:not(.eyebrow) { color: var(--text-muted); margin: 0; }
.comment-edit-card form { display: grid; gap: var(--ui-space-12); margin-top: 1.25rem; }
.comment-edit-card label { font-weight: 700; }
.comment-edit-card textarea { background: var(--surface); border: 1px solid var(--comment-edit-boundary); box-sizing: border-box; color: var(--text); min-height: 19rem; resize: vertical; width: 100%; }
.comment-edit-card textarea[aria-invalid="true"] { border-color: var(--comment-edit-error-text); }
.comment-edit-actions { align-items: center; display: flex; gap: var(--ui-space-12); justify-content: space-between; }
.comment-edit-actions button { background: var(--comment-edit-action-bg); border: 1px solid var(--comment-edit-action-bg); color: var(--comment-edit-action-text); min-height: 44px; }
.comment-edit-conflict-context { margin-top: 1rem; min-width: 0; }
.comment-edit-conflict-context h3 { font-size: var(--ui-text-16); margin: 0 0 .5rem; }
.comment-edit-conflict-context pre { background: var(--comment-edit-code-bg); border: 1px solid var(--comment-edit-code-boundary); color: var(--comment-edit-code-text); margin: 0; max-height: 12rem; overflow: auto; padding: .75rem; white-space: pre-wrap; }
.comment-delete-disclosure { border-top: 1px solid var(--comment-edit-boundary); margin-top: 1rem; padding-top: 1rem; }
.comment-delete-disclosure summary { cursor: pointer; font-weight: 700; }
.comment-delete-disclosure p { color: var(--text-muted); }
.comment-delete-disclosure form { margin: 0; }
.comment-delete-disclosure .danger-action { background: var(--comment-edit-danger-bg); border: 1px solid var(--comment-edit-danger-bg); color: var(--comment-edit-danger-text); min-height: 44px; width: 100%; }
[data-testid="comment-edit"] :is(textarea, button, a, summary, pre, [tabindex="-1"]):focus-visible { outline: .1875rem solid var(--comment-edit-focus); outline-offset: .125rem; }
@media (max-width: 56.25rem) {
  [data-testid="comment-edit"] { margin: 1.5rem auto; }
}
@media (max-width: 37.5rem) {
  [data-testid="comment-edit"] { margin: .625rem auto; padding: 1rem; width: calc(100% - 1.25rem); }
  .comment-edit-heading { gap: var(--ui-space-16); grid-template-columns: minmax(0, 1fr); }
  .comment-edit-heading .secondary-action { width: 100%; }
  .comment-edit-card textarea { min-height: 15rem; }
  .comment-edit-actions { align-items: stretch; flex-direction: column-reverse; }
  .comment-edit-actions :is(a, button) { width: 100%; }
}
.comment-body { margin: var(--ui-space-14) 0 0 var(--ui-space-48); }
.comment-body > :first-child { margin-top: 0; }
.comment-body > :last-child { margin-bottom: 0; }
.comment-hidden { color: var(--text-muted); font-style: italic; margin: var(--ui-space-14) 0 0 var(--ui-space-48); }
.comment-composer { background: var(--surface-muted); border: 1px solid var(--border); border-radius: 8px; margin-top: 18px; max-width: none; padding: var(--ui-space-18); }
.comment-composer label { font-weight: 700; }
.comment-guest-fields { display: grid; gap: var(--ui-space-12); grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 9px; }
.comment-guest-fields label { display: grid; font-size: var(--ui-text-13); gap: var(--ui-space-6); }
.comment-guest-fields input { background: var(--surface); margin: 0; }
.comment-composer textarea { background: var(--surface); margin-top: 9px; resize: vertical; }
.comment-composer > .comment-composer-actions { align-items: center; display: flex; justify-content: space-between; }
.comment-composer p { color: var(--text-muted); font-size: var(--ui-text-12); margin: var(--ui-space-10) 0 0; }
.comment-composer button { margin-top: 10px; }
.comment-sign-in { background: var(--surface-muted); border-radius: 6px; color: var(--text-muted); margin-top: 18px; padding: var(--ui-space-14) var(--ui-space-16); }
.comment-sign-in a { color: var(--accent-readable); font-weight: 650; }
.comment-settings-grid { display: grid; gap: var(--ui-space-20); grid-template-columns: minmax(0, 1fr); }
.comment-policy-summary dl { display: grid; gap: 0; margin: var(--ui-space-16) 0 0; }
.comment-policy-summary dl > div { border-top: 1px solid var(--border); display: grid; gap: var(--ui-space-16); grid-template-columns: 90px minmax(0, 1fr); padding: var(--ui-space-14) 0; }
.comment-policy-summary dt { color: var(--text-muted); font-size: var(--ui-text-12); font-weight: 750; text-transform: uppercase; }
.comment-policy-summary dd { margin: 0; }
.webhook-settings-grid { display: grid; gap: var(--ui-space-20); grid-template-columns: minmax(0, 1fr); }
.webhook-create-panel form, .webhook-endpoint-card { max-width: none; }
.settings-callout { background: var(--notice-bg); border: 1px solid color-mix(in srgb, var(--notice-text) 25%, var(--border)); border-radius: 8px; color: var(--notice-text); margin: 0 0 var(--ui-space-20); padding: var(--ui-space-14) var(--ui-space-16); }
.webhook-contract-panel dl { display: grid; gap: 0; margin: 0; }
.webhook-contract-panel dl > div { border-top: 1px solid var(--border); padding: var(--ui-space-12) 0; }
.webhook-contract-panel dl > div:first-child { border-top: 0; }
.webhook-contract-panel dt { color: var(--text-muted); font-size: var(--ui-text-11); font-weight: 750; text-transform: uppercase; }
.webhook-contract-panel dd { margin: var(--ui-space-4) 0 0; }
.webhook-endpoint-section { margin-top: 32px; }
.webhook-list-heading { align-items: end; display: flex; justify-content: space-between; margin-bottom: 14px; }
.webhook-list-heading h2 { margin: var(--ui-space-2) 0 0; }
.webhook-list-heading > span { color: var(--text-muted); font-size: var(--ui-text-13); }
.webhook-endpoint-list { display: grid; gap: var(--ui-space-18); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.webhook-endpoint-card > header { align-items: center; display: flex; justify-content: space-between; }
.webhook-endpoint-card h3 { font-size: var(--ui-text-20); margin: var(--ui-space-2) 0 0; }
.webhook-endpoint-fields { display: grid; }
.webhook-delivery-stats { background: var(--surface-muted); border-radius: 8px; display: grid; gap: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: var(--ui-space-20) 0 0; padding: var(--ui-space-12) var(--ui-space-14); }
.webhook-delivery-stats > div { display: grid; gap: var(--ui-space-2); }
.webhook-delivery-stats > div:nth-child(n+4) { border-top: 1px solid var(--border); grid-column: span 3; margin-top: 10px; padding-top: 10px; }
.webhook-delivery-stats dt { color: var(--text-muted); font-size: var(--ui-text-10); font-weight: 750; text-transform: uppercase; }
.webhook-delivery-stats dd { font-size: var(--ui-text-13); font-weight: 700; margin: 0; overflow-wrap: anywhere; }
.webhook-action-buttons { align-items: center; display: flex; flex-wrap: wrap; gap: var(--ui-space-8); justify-content: flex-end; }
.webhook-action-buttons button { width: auto; }
.page-code-frame { background: var(--surface); border: 0; display: block; min-height: 80px; width: 100%; }
.page-custom-code-editor { border: 1px solid var(--border); border-radius: 8px; margin-top: 24px; padding: var(--ui-space-14); }
.page-custom-code-editor summary { cursor: pointer; font-weight: 700; }
.page-custom-code-editor textarea { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; tab-size: 2; }
.markdown-body .katex-display, .markdown-preview-body .katex-display { overflow-x: auto; overflow-y: hidden; padding: .25em 0; }
.markdown-body .math-error, .markdown-preview-body .math-error { background: color-mix(in srgb, var(--danger) 10%, transparent); border: 1px solid color-mix(in srgb, var(--danger) 45%, transparent); border-radius: 4px; color: var(--danger); padding: .1em .3em; }
.markdown-body div.math-error, .markdown-preview-body div.math-error { margin: 1em 0; overflow-wrap: anywhere; padding: .65em .8em; }
.markdown-body .mermaid-diagram, .markdown-preview-body .mermaid-diagram { margin: 1.25em 0; }
.markdown-body .mermaid-diagram iframe, .markdown-preview-body .mermaid-diagram iframe { background: var(--surface); border: 1px solid var(--border); border-radius: 8px; box-sizing: border-box; display: block; height: 160px; width: 100%; }
.markdown-body .mermaid-source, .markdown-preview-body .mermaid-source { color: var(--text-muted); font-size: var(--ui-text-13); margin-top: 8px; }
.markdown-body .mermaid-source summary, .markdown-preview-body .mermaid-source summary { cursor: pointer; font-weight: 700; width: fit-content; }
.markdown-body .mermaid-source pre, .markdown-preview-body .mermaid-source pre { margin: var(--ui-space-8) 0 0; max-height: 240px; overflow: auto; }
.markdown-body input[type="checkbox"] { margin: 0 .45rem 0 0; padding: 0; vertical-align: -.08em; width: auto; }
.markdown-body pre { background: var(--code-bg); border-radius: 6px; color: var(--code-text); overflow: auto; padding: var(--ui-space-16); }
.markdown-body .code-block, .markdown-preview-body .code-block { border: 1px solid var(--code-muted); border-radius: 6px; margin: 1em 0; overflow: hidden; }
.markdown-body .code-block-label, .markdown-preview-body .code-block-label { background: var(--code-label-bg); border-radius: 6px 6px 0 0; color: var(--code-label-text); font: 700 var(--ui-text-11)/1.4 system-ui, sans-serif; letter-spacing: .08em; padding: var(--ui-space-8) var(--ui-space-12); text-transform: uppercase; }
.markdown-body .code-block .chroma, .markdown-preview-body .code-block .chroma { border-radius: 0 0 6px 6px; margin: 0; tab-size: 4; }
.code-block .chroma code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.code-block .chroma :is(.c, .c1, .cm, .cp, .cs) { color: var(--code-syntax-comment); font-style: italic; }
.code-block .chroma :is(.k, .kc, .kd, .kn, .kp, .kr, .kt) { color: var(--code-syntax-keyword); }
.code-block .chroma :is(.s, .s1, .s2, .sa, .sb, .sc, .sd, .se, .sh, .si, .sr, .ss, .sx) { color: var(--code-syntax-string); }
.code-block .chroma :is(.m, .mb, .mf, .mh, .mi, .mo, .il) { color: var(--code-syntax-number); }
.code-block .chroma :is(.na, .nb, .bp, .nc, .nd, .ne, .nf, .fm) { color: var(--code-syntax-name); }
.code-block .chroma :is(.no, .nt, .nv, .vc, .vg, .vi, .vm) { color: var(--code-syntax-variable); }
.code-block .chroma .err { color: var(--code-syntax-error); text-decoration: underline wavy; }
/* Code blocks and KaTeX display maths already scroll inside their own box; a wide
   table and an oversized image did not, and both overflowed the viewport at 360px.
   The renderer emits a bare <table>, so there is no wrapper to give the scroll to -
   display: block is how the history table already solves this. */
.markdown-body table { border-collapse: collapse; display: block; max-width: 100%; overflow-x: auto; }
.markdown-body table:focus-visible { outline: 2px solid var(--accent-readable); outline-offset: 2px; }
.markdown-body img, .markdown-preview-body img { height: auto; max-width: 100%; }
.markdown-body th, .markdown-body td { border: 1px solid var(--border); padding: var(--ui-space-8) var(--ui-space-12); }
.page-toc { align-self: start; border-left: 2px solid var(--border); font-size: var(--ui-text-14); padding-left: 18px; position: sticky; top: 24px; }
.page-toc p { font-weight: 750; margin: 0 0 var(--ui-space-8); }
.page-toc ol { list-style: none; margin: 0; padding: 0; }
.page-toc ol ol { border-left: 1px solid var(--border); margin: var(--ui-space-6) 0 var(--ui-space-6) var(--ui-space-8); padding-left: 11px; }
.page-toc li { margin: var(--ui-space-6) 0; }
.page-toc a { color: var(--text-muted); text-decoration: none; }
.page-toc a:hover { color: var(--accent); text-decoration: underline; }
.page-toc a[aria-current="location"] { color: var(--accent); font-weight: 750; }
.markdown-body :is(h1, h2, h3, h4, h5, h6) { scroll-margin-top: 24px; }
.problem-body {
  align-items: center;
  background: linear-gradient(145deg, var(--problem-canvas-start), var(--problem-canvas-middle) 48%, var(--problem-canvas-end));
  box-sizing: border-box;
  color: var(--problem-text);
  display: flex;
  font-family: "Roboto", sans-serif;
  justify-content: center;
  margin: 0;
  min-height: 100vh;
  min-height: 100svh;
  padding: var(--ui-space-24);
}
.problem-page { background: var(--problem-surface); border: 1px solid var(--problem-surface-border); border-radius: 12px; box-shadow: var(--problem-surface-shadow); box-sizing: border-box; max-width: 520px; min-width: 0; overflow-wrap: anywhere; padding: var(--ui-space-40); text-align: center; width: 100%; }
.problem-mark {
  align-items: center;
  border: 8px solid var(--problem-mark-boundary);
  border-radius: 50%;
  box-sizing: border-box;
  display: flex;
  height: 128px;
  justify-content: center;
  margin: 0 auto var(--ui-space-28);
  width: 128px;
}
.problem-mark span { font-size: var(--ui-display-mark); font-weight: 300; line-height: 1; }
.problem-product { font-size: var(--ui-text-13); font-weight: 700; letter-spacing: .16em; margin: 0 0 var(--ui-space-10); }
.problem-status { color: var(--problem-accent); font-size: var(--ui-display-status); font-weight: 700; line-height: 1; margin: 0 0 var(--ui-space-14); }
.problem-page h1 { color: inherit; font-size: var(--ui-text-28); font-weight: 500; line-height: 1.25; margin: 0 0 var(--ui-space-12); }
.problem-message { font-size: var(--ui-text-16); line-height: 1.5; margin: 0 auto var(--ui-space-20); max-width: 460px; }
.problem-reference { color: var(--problem-muted); font-size: var(--ui-text-13); line-height: 1.5; margin: 0 0 var(--ui-space-24); overflow-wrap: anywhere; }
.problem-reference code { color: inherit; }
.problem-actions { align-items: stretch; display: flex; flex-wrap: wrap; gap: var(--ui-space-12); justify-content: center; }
.problem-actions a {
  border-radius: 5px;
  display: inline-flex;
  font-size: var(--ui-text-14);
  font-weight: 500;
  justify-content: center;
  letter-spacing: .08em;
  min-height: 44px;
  padding: var(--ui-space-12) var(--ui-space-18);
  text-decoration: none;
}
.problem-primary { background: var(--problem-primary-bg); border: 1px solid var(--problem-primary-bg); color: var(--problem-primary-text); }
.problem-primary:hover { background: var(--problem-primary-hover); border-color: var(--problem-primary-hover); color: var(--problem-primary-text); }
.problem-home { border: 1px solid var(--problem-boundary); color: var(--problem-text); }
.problem-home:hover { background: var(--problem-action-hover); color: var(--problem-text); }
.problem-actions a:focus-visible { outline: 3px solid var(--problem-focus); outline-offset: 4px; }
@media (max-width: 37.5rem) {
  .problem-body { padding: var(--ui-space-16); }
  .problem-page { padding: var(--ui-space-32) var(--ui-space-20); }
  .problem-mark { border-width: 7px; height: 112px; margin-bottom: 22px; width: 112px; }
  .problem-mark span { font-size: var(--ui-display-mark-narrow); }
  .problem-actions { display: grid; width: 100%; }
  .problem-actions a { box-sizing: border-box; width: 100%; }
}
.not-found-body {
  align-items: flex-start;
  background: var(--surface);
  box-sizing: border-box;
  color: var(--text);
  display: flex;
  font-family: "Roboto", sans-serif;
  justify-content: center;
  margin: 0;
  min-height: 100svh;
  overflow-x: hidden;
  padding: max(4rem, 14vh) var(--ui-space-24) var(--ui-space-48);
}
.not-found-page { box-sizing: border-box; margin: 0; max-width: 28rem; min-width: 0; overflow-wrap: anywhere; padding: 0; width: 100%; }
.not-found-title { font-size: var(--ui-text-28); font-weight: 600; line-height: 1.25; margin: 0 0 var(--ui-space-16); }
.not-found-message { color: var(--text-muted); font-size: var(--ui-text-16); line-height: 1.6; margin: 0 0 var(--ui-space-32); }
.not-found-actions { align-items: stretch; display: flex; flex-wrap: wrap; gap: var(--ui-space-12); justify-content: flex-start; }
.not-found-actions a { align-items: center; border: 1px solid var(--text-muted); border-radius: var(--ui-control-radius); color: var(--text); display: inline-flex; font-size: var(--ui-text-14); font-weight: 500; gap: var(--ui-space-8); justify-content: center; min-height: 44px; padding: var(--ui-space-8) var(--ui-space-16); text-decoration: none; }
.not-found-actions a:hover { background: var(--surface-muted); }
.not-found-actions a:focus-visible { outline: 3px solid var(--accent-readable); outline-offset: 4px; }
.not-found-actions a svg { fill: currentcolor; height: 20px; width: 20px; }
@media (max-width: 37.5rem) {
  .not-found-body { padding: var(--ui-space-48) var(--ui-space-24); }
  .not-found-actions { display: grid; width: 100%; }
  .not-found-actions a { box-sizing: border-box; width: 100%; }
}
.unauthorized-body {
  align-items: center;
  background: linear-gradient(145deg, var(--problem-canvas-start), var(--problem-canvas-middle) 48%, var(--problem-canvas-end));
  box-sizing: border-box;
  color: var(--problem-text);
  display: flex;
  font-family: "Roboto", sans-serif;
  justify-content: center;
  margin: 0;
  min-height: 100svh;
  overflow-x: hidden;
  padding: var(--ui-space-24);
}
.unauthorized-page {
  align-items: center;
  background: var(--problem-surface);
  border: 1px solid var(--problem-surface-border);
  border-radius: 12px;
  box-shadow: var(--problem-surface-shadow);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  max-width: 540px;
  min-width: 0;
  overflow-wrap: anywhere;
  padding: var(--ui-space-40);
  text-align: center;
  width: 100%;
}
.unauthorized-illustration { height: 190px; margin-bottom: 20px; overflow: visible; width: 190px; }
.unauthorized-shield,
.unauthorized-shield-detail {
  fill: var(--problem-muted);
  stroke: var(--problem-mark-boundary);
  stroke-linejoin: round;
  stroke-width: 10;
}
.unauthorized-shield-detail { fill: none; stroke: var(--problem-boundary); stroke-width: 8; }
.unauthorized-mark { fill: var(--problem-primary-bg); stroke: var(--problem-primary-bg); stroke-width: 3; }
.unauthorized-minus { fill: none; stroke: var(--problem-primary-text); stroke-linecap: round; stroke-width: 12; }
.unauthorized-status { color: var(--problem-accent); font-size: var(--ui-display-status); font-weight: 700; line-height: 1; margin: 0 0 var(--ui-space-12); }
.unauthorized-title { color: inherit; font-size: var(--ui-text-28); font-weight: 500; line-height: 35px; margin: 0 0 var(--ui-space-12); }
.unauthorized-message { font-size: var(--ui-text-16); line-height: 24px; margin: 0 0 var(--ui-space-20); }
.unauthorized-actions { align-items: stretch; display: flex; flex-wrap: wrap; gap: var(--ui-space-12); justify-content: center; }
.unauthorized-switch { margin: 0; }
.unauthorized-switch button {
  align-items: center;
  background: var(--problem-primary-bg);
  border: 1px solid var(--problem-primary-bg);
  border-radius: 6px;
  color: var(--problem-primary-text);
  cursor: pointer;
  display: inline-flex;
  font: 500 var(--ui-text-14)/20px "Roboto", sans-serif;
  gap: var(--ui-space-10);
  justify-content: center;
  min-height: 48px;
  padding: var(--ui-space-12) var(--ui-space-18);
}
.unauthorized-switch button:hover { background: var(--problem-primary-hover); border-color: var(--problem-primary-hover); }
.unauthorized-switch svg { fill: currentcolor; height: 22px; width: 22px; }
.unauthorized-home {
  align-items: center;
  border: 1px solid var(--problem-boundary);
  border-radius: 6px;
  color: var(--problem-text);
  display: inline-flex;
  font-size: var(--ui-text-14);
  font-weight: 700;
  gap: var(--ui-space-8);
  justify-content: center;
  min-height: 48px;
  padding: var(--ui-space-12) var(--ui-space-18);
  text-decoration: none;
}
.unauthorized-home:hover { background: var(--problem-action-hover); color: var(--problem-text); }
.unauthorized-actions :is(button, a):focus-visible { outline: 3px solid var(--problem-focus); outline-offset: 4px; }
.unauthorized-home svg { fill: currentcolor; height: 20px; width: 20px; }
@media (max-width: 37.5rem) {
  .unauthorized-body { padding: var(--ui-space-16); }
  .unauthorized-page { padding: var(--ui-space-32) var(--ui-space-20); }
  .unauthorized-illustration { height: 140px; margin-bottom: 16px; width: 140px; }
  .unauthorized-actions { display: grid; width: 100%; }
  .unauthorized-actions :is(form, button, a) { box-sizing: border-box; width: 100%; }
}
.empty-home-body {
  align-items: flex-start;
  background: var(--app-bg);
  color: var(--empty-home-text);
  display: flex;
  font-family: "Roboto", sans-serif;
  justify-content: center;
  margin: 0;
  min-height: 100dvh;
}
.empty-home-page { max-width: 32rem; padding: max(4rem, 14vh) var(--ui-space-24) var(--ui-space-48); text-align: start; width: 100%; }
.empty-home-wordmark { margin-bottom: var(--ui-space-40); }
.empty-home-title { font-size: var(--ui-text-28); line-height: 1.25; margin: 0 0 var(--ui-space-12); text-wrap: balance; }
.empty-home-message { color: var(--text-muted); font-size: var(--ui-text-16); line-height: 1.6; margin: 0 0 var(--ui-space-24); }
.empty-home-actions { display: flex; flex-wrap: wrap; gap: var(--ui-space-12); }
.empty-home-actions a {
  align-items: center;
  background: var(--empty-home-action-bg);
  border: 1px solid transparent;
  border-radius: var(--ui-control-radius);
  color: var(--empty-home-action-text);
  font-size: var(--ui-text-14);
  display: inline-flex;
  font-weight: 500;
  justify-content: center;
  min-height: var(--ui-space-48);
  padding: var(--ui-space-12) var(--ui-space-16);
  text-decoration: none;
}
.empty-home-actions a + a { background: transparent; border-color: var(--border-strong); color: var(--text); }
.empty-home-actions a:hover { background: var(--empty-home-action-hover-bg); }
.empty-home-actions a + a:hover { background: var(--surface-muted); }
.empty-home-actions a:focus-visible { outline: 3px solid var(--empty-home-focus); outline-offset: 4px; }
.permission-explanation-heading { align-items: flex-start; display: flex; gap: var(--ui-space-24); justify-content: space-between; margin-bottom: 30px; }
.permission-explanation-heading h1 { margin-bottom: 8px; }
.permission-explanation-heading p:last-child { color: var(--text-muted); margin: 0; }
.permission-heading-actions, .audit-heading-actions { align-items: center; display: flex; gap: var(--ui-space-12); }
.permission-heading-actions { flex-shrink: 0; flex-wrap: wrap; }
.app-sidebar :is([data-navigation-icon="users"], [data-navigation-icon="authentication"], [data-navigation-icon="permissions"], [data-navigation-icon="security"])[aria-current="page"] { color: var(--accent-readable); }
.diagnostic-badge { background: var(--surface-muted); border: 1px solid var(--border); border-radius: 999px; color: var(--text-muted); flex: 0 0 auto; font-size: var(--ui-text-12); font-weight: 750; padding: var(--ui-space-6) var(--ui-space-10); text-transform: uppercase; }
.permission-explanation-grid { align-items: start; display: grid; gap: var(--ui-space-28); grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr); }
.permission-query-section { border: 0; border-top: 1px solid var(--border); border-radius: 0; margin: 0 0 var(--ui-space-24); padding: var(--ui-space-16) 0 var(--ui-space-20); }
.permission-query-section legend { font-weight: 600; padding: 0 var(--ui-space-8) 0 0; }
.permission-query-section label { margin-top: 10px; }
[data-testid="permission-query"] [hidden] { display: none; }
[data-testid="permission-query"] summary { cursor: pointer; padding: var(--ui-space-12) 0; }
.permission-query-groups { list-style: none; margin: var(--ui-space-8) 0; padding: 0; }
.permission-query-groups li { align-items: center; display: flex; flex-wrap: wrap; gap: var(--ui-space-8); justify-content: space-between; }
.permission-query-groups span { min-width: 0; overflow-wrap: anywhere; }
.permission-field-pair { display: grid; gap: var(--ui-space-14); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.permission-result { background: var(--surface-muted); border: 1px solid var(--border); border-radius: 10px; padding: var(--ui-space-24); position: sticky; top: 24px; }
.permission-result > .eyebrow { color: var(--accent-readable); }
.permission-result-empty { color: var(--text-muted); min-height: 250px; }
.permission-result-empty h2 { color: var(--text); margin: var(--ui-space-8) 0; }
.permission-outcome { align-items: flex-start; display: flex; gap: var(--ui-space-14); margin: var(--ui-space-12) 0 var(--ui-space-24); }
.permission-outcome h2 { font-size: var(--ui-text-28); margin: 0; }
.permission-outcome p { color: var(--text-muted); margin: var(--ui-space-4) 0 0; }
.permission-outcome-marker { align-items: center; background: color-mix(in srgb, var(--danger) 14%, var(--surface)); border-radius: 999px; color: var(--danger); display: inline-flex; flex: 0 0 38px; font-size: var(--ui-text-24); font-weight: 800; height: 38px; justify-content: center; }
.permission-result[data-allowed="true"] .permission-outcome-marker { background: color-mix(in srgb, var(--success) 15%, var(--surface)); color: var(--success); }
.permission-trace { display: grid; margin: 0; }
.permission-trace > div { border-top: 1px solid var(--border); display: grid; gap: var(--ui-space-12); grid-template-columns: 108px minmax(0, 1fr); padding: var(--ui-space-10) 0; }
.permission-trace dt { color: var(--text-muted); font-size: var(--ui-text-13); font-weight: 700; }
.permission-trace dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.permission-trace code, .permission-matches code { font-size: var(--ui-text-12); }
.permission-matches { border-top: 1px solid var(--border); margin-top: 8px; padding-top: 16px; }
.permission-matches h3 { font-size: var(--ui-text-14); margin: 0 0 var(--ui-space-8); }
.permission-matches p, .permission-matches ol { color: var(--text-muted); font-size: var(--ui-text-13); margin: 0; }
.permission-matches ol { padding-left: 22px; }
.permission-policy-panel { border: 0; border-block: 1px solid var(--border); border-radius: 0; margin-bottom: var(--ui-space-32); padding: 0; }
.permission-policy-panel > summary { align-items: center; cursor: pointer; display: flex; font-weight: 750; justify-content: space-between; padding: var(--ui-space-14) 0; }
.permission-policy-panel > summary strong { background: var(--surface-muted); border-radius: 999px; color: var(--text-muted); font-size: var(--ui-text-12); padding: var(--ui-space-4) var(--ui-space-10); }
.permission-policy-panel[open] > summary { border-bottom: 1px solid var(--border); }
.permission-rules-admin { padding: var(--ui-space-24) 0 var(--ui-space-18); }
.permission-rules-heading { align-items: flex-start; display: flex; gap: var(--ui-space-24); justify-content: space-between; margin-bottom: 22px; }
.permission-rules-heading h1 { font-size: var(--ui-page-title-size); margin-bottom: 6px; }
.permission-rules-heading p:last-child { color: var(--text-muted); margin: 0; }
.permission-rule-fields { display: grid; gap: var(--ui-space-16); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.permission-rule-fields label { margin-top: 4px; }
.permission-rule-fields .permission-rule-subject-id, .permission-selector-fields, .permission-rule-options { grid-column: 1 / -1; }
.permission-selector-fields { display: grid; gap: var(--ui-space-16); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.permission-rule-fields > div, .permission-selector-fields > div { min-width: 0; }
.permission-rule-options { display: flex; flex-wrap: wrap; gap: var(--ui-space-16) var(--ui-space-24); }
.permission-rule-create form { max-width: none; }
.permission-rule-list { display: grid; gap: var(--ui-space-10); }
.permission-rule-card { border: 1px solid var(--border); border-radius: 8px; padding: 0 var(--ui-space-16) var(--ui-space-16); }
.permission-rule-card > summary { align-items: center; cursor: pointer; display: grid; gap: var(--ui-space-10); grid-template-columns: auto minmax(150px, 1fr) minmax(150px, 1fr) auto auto; padding: var(--ui-space-14) 0; }
.permission-rule-card > summary::marker { color: var(--text-muted); }
.permission-rule-card > summary > span:not(.permission-effect), .permission-rule-card > summary > small { color: var(--text-muted); font-size: var(--ui-text-12); }
.permission-effect { border-radius: 999px; font-size: var(--ui-text-11); font-weight: 800; padding: var(--ui-space-4) var(--ui-space-8); text-transform: uppercase; }
.permission-effect.allow { background: color-mix(in srgb, var(--accent) 10%, var(--surface)); color: var(--accent-readable); }
.permission-effect.deny { background: color-mix(in srgb, var(--danger) 9%, var(--surface)); color: var(--danger); }
.permission-rule-card form { max-width: none; }
.permission-rule-actions { align-items: center; display: flex; gap: var(--ui-space-16); margin-top: 14px; }
.permission-rule-actions button { margin: 0; }
.permission-rule-actions span { color: var(--text-muted); font-size: var(--ui-text-12); }
.permission-rule-delete { border-top: 1px solid var(--border); margin-top: 16px; padding-top: 12px; }
.permission-rule-delete button { margin: 0; }
body[data-shell-variant="admin"] [data-testid="permission-explanation"] {
  --permission-panel-bg: var(--surface);
  --permission-muted-bg: var(--surface-muted);
  --permission-text: var(--text);
  --permission-muted-text: var(--text-muted);
  --permission-boundary: color-mix(in srgb, var(--text) 55%, var(--surface));
  --permission-focus: var(--accent-readable);
  --permission-allowed-bg: color-mix(in srgb, var(--success) 12%, var(--surface));
  --permission-allowed-text: var(--success);
  --permission-denied-bg: color-mix(in srgb, var(--danger) 12%, var(--surface));
  --permission-denied-text: var(--danger);
}
body[data-shell-variant="admin"] [data-testid="permission-explanation"] :is(.permission-result, .permission-rule-card, .permission-rule-create) {
  background: var(--permission-panel-bg);
  border-color: var(--permission-boundary);
  color: var(--permission-text);
}
body[data-shell-variant="admin"] [data-testid="permission-explanation"] :is(.permission-policy-panel[open] > summary, .permission-trace > div, .permission-matches, .permission-rule-delete) { border-color: var(--permission-boundary); }
body[data-shell-variant="admin"] [data-testid="permission-explanation"] :is(.diagnostic-badge, .permission-policy-panel > summary strong, .permission-effect, .empty-state) {
  background: var(--permission-muted-bg);
  border: 1px solid var(--permission-boundary);
  color: var(--permission-muted-text);
}
body[data-shell-variant="admin"] [data-testid="permission-explanation"] :is(input, select, textarea) {
  background: var(--permission-panel-bg);
  border-color: var(--permission-boundary);
  color: var(--permission-text);
  min-width: 0;
}
body[data-shell-variant="admin"] [data-testid="permission-explanation"] :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--permission-focus);
  outline-offset: 2px;
}
body[data-shell-variant="admin"] [data-testid="permission-explanation"] :is(.permission-rule-card > summary strong, .permission-rule-readonly dd, .permission-rule-readonly code, .permission-matches code) {
  min-width: 0;
  overflow-wrap: anywhere;
}
body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-result { background: var(--permission-muted-bg); }
body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-outcome-marker {
  background: var(--permission-denied-bg);
  border: 2px solid var(--permission-denied-text);
  color: var(--permission-denied-text);
}
body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-result[data-decision-state="allowed"] .permission-outcome-marker {
  background: var(--permission-allowed-bg);
  border-color: var(--permission-allowed-text);
  color: var(--permission-allowed-text);
}
body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-outcome-marker svg { fill: none; height: 24px; stroke: currentcolor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.5; width: 24px; }
body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-decision-state { color: var(--permission-muted-text); font-size: var(--ui-text-12); font-weight: 800; letter-spacing: .04em; margin: 0 0 var(--ui-space-4); text-transform: uppercase; }
body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-effect.allow { background: var(--permission-allowed-bg); border-color: var(--permission-allowed-text); color: var(--permission-allowed-text); }
body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-effect.deny { background: var(--permission-denied-bg); border-color: var(--permission-denied-text); color: var(--permission-denied-text); }
body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-rule-readonly { display: grid; gap: var(--ui-space-10); margin: 0; padding-top: 14px; }
body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-rule-readonly > div { display: grid; gap: var(--ui-space-8); grid-template-columns: 100px minmax(0, 1fr); }
body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-rule-readonly dt { color: var(--permission-muted-text); font-size: var(--ui-text-12); font-weight: 750; }
body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-rule-readonly dd { margin: 0; }
.admin-section-tabs { border-bottom: 1px solid var(--border); display: flex; flex-wrap: wrap; gap: 0 var(--ui-space-24); margin: -12px 0 var(--ui-space-32); overflow-x: visible; }
.admin-section-tabs a { color: var(--text-muted); font-weight: 700; padding: var(--ui-space-12) var(--ui-space-2); text-decoration: none; }
.settings-navigation-disclosure { border-block: 1px solid var(--border); margin-block: var(--ui-space-16); }
.settings-navigation-disclosure > summary { cursor: pointer; font-size: var(--ui-text-14); font-weight: 500; min-height: var(--ui-action-min-height); padding: var(--ui-space-12) 0; }
.settings-navigation-disclosure > summary:focus-visible { outline: 2px solid var(--accent-readable); outline-offset: 2px; }
.settings-section-tabs { gap: var(--ui-space-16) var(--ui-space-24); padding-bottom: var(--ui-space-16); }
.settings-navigation-group { display: flex; flex-wrap: wrap; gap: 0 var(--ui-space-14); }
.settings-navigation-label { color: var(--text-muted); flex-basis: 100%; font-size: var(--ui-text-12); font-weight: 500; }
.settings-section-tabs a { flex: 0 0 auto; font-size: var(--ui-text-14); white-space: nowrap; }
body[data-shell-variant="admin"] [data-testid="site-settings"] .settings-section-tabs { background: var(--site-settings-tab-bg); flex-wrap: wrap; overflow-x: visible; }
body[data-shell-variant="admin"] [data-testid="site-settings"] .settings-section-tabs a { background: var(--site-settings-tab-bg); }
.admin-section-tabs a[aria-current="page"] { border-bottom: 3px solid var(--accent); color: var(--accent-readable); }
.audit-filter { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: var(--ui-space-16); align-items: end; margin: var(--ui-space-28) 0; padding: var(--ui-space-20); border: 1px solid var(--border); border-radius: 10px; background: var(--surface-subtle); }
.audit-filter label { display: grid; gap: var(--ui-space-8); font-weight: 650; }
.audit-filter-actions { display: flex; gap: var(--ui-space-8); align-items: center; }
.audit-filter-disclosure { margin-block: var(--ui-space-20); }
.audit-filter-disclosure > summary { cursor: pointer; padding-block: var(--ui-space-12); overflow-wrap: anywhere; }
.audit-filter-disclosure .audit-filter { margin-block: var(--ui-space-8) 0; }
.jobs-failure-shortcut { margin-block: var(--ui-space-16); font-weight: 650; }
.jobs-failure-shortcut a { display: inline-block; padding-block: var(--ui-space-12); }
.audit-events { display: grid; gap: var(--ui-space-16); margin: 0; padding: 0; list-style: none; }
.audit-event { padding: var(--ui-panel-padding); border: var(--ui-panel-border); border-radius: var(--ui-panel-radius); background: var(--surface-subtle); overflow: hidden; }
.audit-event > header { display: flex; justify-content: space-between; gap: var(--ui-space-20); align-items: flex-start; }
.audit-event > header p { margin: var(--ui-space-8) 0 0; }
.audit-event time { color: var(--text-muted); font-size: var(--ui-text-14); white-space: nowrap; }
.audit-action { color: var(--accent-readable); font-weight: 700; }
.audit-event dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ui-space-12); margin: var(--ui-space-18) 0; }
.audit-event dl div { min-width: 0; }
.audit-event dt { color: var(--text-muted); font-size: var(--ui-text-12); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.audit-event dd { margin: var(--ui-space-6) 0 0; overflow-wrap: anywhere; }
.audit-event details pre { max-height: 320px; overflow: auto; margin: var(--ui-space-12) 0 0; padding: var(--ui-space-14); border-radius: 8px; background: var(--code-surface); }
.audit-event details code { white-space: pre-wrap; overflow-wrap: anywhere; }
.audit-pagination { display: flex; justify-content: center; margin-top: 24px; }
.audit-boundary { margin: var(--ui-space-28) 0 0; }
body[data-shell-variant="admin"] [data-testid="audit-log"] {
  --audit-surface: var(--surface);
  --audit-muted-surface: var(--surface-muted);
  --audit-text: var(--text);
  --audit-muted-text: var(--text-muted);
  --audit-boundary: var(--text-muted);
  --audit-code-boundary: var(--code-muted);
  --audit-focus: var(--accent-readable);
  --audit-action-bg: var(--accent);
  --audit-action-text: var(--button-text);
  --audit-error-bg: var(--ui-error-bg);
  --audit-error-text: var(--danger);
  color: var(--audit-text);
  min-width: 0;
}
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-readonly-status {
  background: var(--audit-muted-surface);
  border: 1px solid var(--audit-boundary);
  color: var(--audit-muted-text);
}
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-heading-actions {
  flex-wrap: wrap;
  min-width: 0;
}
body[data-shell-variant="admin"] [data-testid="audit-log"] :is(.audit-filter, .audit-event, .empty-state) {
  background: var(--audit-surface);
  border: 1px solid var(--audit-boundary);
  border-radius: var(--ui-panel-radius);
}
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-filter :is(input, button, a),
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-pagination a {
  min-width: 0;
}
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-filter input {
  background: var(--audit-surface);
  border-color: var(--audit-boundary);
  color: var(--audit-text);
  width: 100%;
}
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-filter-actions button {
  background: var(--audit-action-bg);
  color: var(--audit-action-text);
  margin: 0;
}
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-error {
  background: var(--audit-error-bg);
  border: 1px solid var(--audit-error-text);
  color: var(--audit-error-text);
  max-width: 72ch;
}
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-event {
  min-width: 0;
  overflow: visible;
}
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-event > header,
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-event > header > div,
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-event h2,
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-event p,
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-event strong,
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-event code,
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-event time {
  min-width: 0;
  overflow-wrap: anywhere;
}
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-event h2 {
  font-size: var(--ui-text-16);
  line-height: 1.45;
  margin: 0;
}
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-event time {
  color: var(--audit-muted-text);
  white-space: normal;
}
body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-event details pre {
  background: var(--code-surface);
  border: 1px solid var(--audit-code-boundary);
  color: var(--code-text);
  max-width: 100%;
  unicode-bidi: plaintext;
}
body[data-shell-variant="admin"] [data-testid="audit-log"] :is(input, button, a, summary, pre, [tabindex="-1"]):focus-visible {
  outline: 3px solid var(--audit-focus);
  outline-offset: 3px;
}

@media (min-width: 56.3125rem) and (max-width: 87.4375rem) {
  body[data-shell-variant="admin"] [data-testid="audit-log"] .ui-page-heading {
    align-items: stretch;
    flex-direction: column;
  }
  body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-heading-actions {
    justify-content: flex-start;
  }
  body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-filter {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 37.5rem) {
  body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-filter-actions {
    align-items: stretch;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }
  body[data-shell-variant="admin"] [data-testid="audit-log"] :is(.audit-filter-actions button, .audit-filter-actions a, .audit-pagination a) {
    justify-content: center;
    text-align: center;
    width: 100%;
  }
  body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-heading-actions { flex-wrap: wrap; gap: var(--ui-space-8); }
  body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-event {
    padding: var(--ui-space-18);
  }
  body[data-shell-variant="admin"] [data-testid="audit-log"] .audit-event details pre {
    width: 100%;
  }
}
body[data-shell-variant="admin"] [data-testid="system-jobs"] {
  --jobs-boundary: var(--text-muted);
  --jobs-action-bg: var(--accent-readable);
  --jobs-action-text: var(--button-text);
  --jobs-error: var(--danger);
  --jobs-focus: var(--accent-readable);
  --jobs-success: var(--success);
  --jobs-surface: var(--surface);
  --jobs-surface-muted: var(--surface-muted);
  min-width: 0;
}
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-captured { color: var(--text-muted); margin: var(--ui-space-24) 0 var(--ui-space-14); text-align: right; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-feedback { background: var(--jobs-surface); border: 1px solid currentColor; border-radius: var(--ui-control-radius); margin: var(--ui-space-20) 0 0; padding: var(--ui-space-12) var(--ui-space-16); }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-feedback-success { color: var(--jobs-success); }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-feedback-error { color: var(--jobs-error); }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-maintenance-status { background: var(--jobs-surface); border: 1px solid currentColor; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-maintenance-enabled { color: var(--jobs-success); }
body[data-shell-variant="admin"] [data-testid="system-jobs"] :is(.jobs-maintenance-read-only, .jobs-maintenance-unavailable) { color: var(--text-muted); }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-summary-grid { display: grid; gap: var(--ui-space-16); grid-template-columns: repeat(2, minmax(0, 1fr)); }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-summary-card { background: var(--jobs-surface-muted); border: 1px solid var(--jobs-boundary); border-radius: var(--ui-panel-radius); min-width: 0; padding: var(--ui-space-20); }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-summary-card > header { align-items: center; display: flex; gap: var(--ui-space-16); justify-content: space-between; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-summary-card h2 { font-size: var(--ui-text-18); margin: 0; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-stat-grid { display: grid; gap: var(--ui-space-14); grid-template-columns: repeat(3, minmax(0, 1fr)); margin: var(--ui-space-20) 0 0; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-stat-grid div { min-width: 0; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-stat-grid dt { color: var(--text-muted); font-size: var(--ui-text-12); font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-stat-grid dd { font-size: var(--ui-text-16); font-weight: 750; margin: var(--ui-space-6) 0 0; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-section { border-top: 1px solid var(--jobs-boundary); margin-top: 30px; min-width: 0; padding-top: 26px; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-section > header { align-items: end; display: flex; gap: var(--ui-space-18); justify-content: space-between; margin-bottom: 16px; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-section > header h2 { margin: var(--ui-space-2) 0 0; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-section .empty-state { background: var(--jobs-surface); border: 1px solid var(--jobs-boundary); border-radius: var(--ui-panel-radius); }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-table-wrap { background: var(--jobs-surface); border: 1px solid var(--jobs-boundary); border-radius: var(--ui-panel-radius); max-width: 100%; overflow-x: auto; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-table { border-collapse: collapse; min-width: 900px; width: 100%; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-table th,
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-table td { border-bottom: 1px solid var(--jobs-boundary); padding: var(--ui-data-cell-padding); text-align: right; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-table thead th { background: var(--jobs-surface-muted); color: var(--text-muted); font-size: var(--ui-text-12); letter-spacing: .03em; text-transform: uppercase; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-table th:first-child { text-align: left; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-table tbody tr:last-child th,
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-table tbody tr:last-child td { border-bottom: 0; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-table tbody th span { color: var(--text-muted); display: block; font-size: var(--ui-text-12); font-weight: 650; margin-bottom: 4px; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-table tbody th code { overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-topic-cards { display: none; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-topic-card { background: var(--jobs-surface); border: .0625rem solid var(--jobs-boundary); border-radius: var(--ui-panel-radius); min-width: 0; padding: 1.125rem; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-topic-heading { display: grid; gap: var(--ui-space-4); margin: 0; min-width: 0; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-topic-heading span { color: var(--text-muted); font-size: var(--ui-text-12); font-weight: 750; letter-spacing: .03em; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-topic-heading code { font-size: var(--ui-text-16); overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-topic-stat-grid { display: grid; gap: var(--ui-space-14); grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 1.125rem 0 0; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-topic-stat-grid div { border-top: .0625rem solid var(--jobs-boundary); min-width: 0; padding-top: .625rem; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-topic-stat-grid dt { color: var(--text-muted); font-size: var(--ui-text-12); font-weight: 750; letter-spacing: .03em; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-topic-stat-grid dd { font-size: var(--ui-text-16); font-weight: 750; margin: .25rem 0 0; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-failures { display: grid; gap: var(--ui-space-10); list-style: none; margin: 0; padding: 0; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-failures li { align-items: start; background: var(--jobs-surface-muted); border: 1px solid var(--jobs-boundary); border-radius: var(--ui-panel-radius); display: grid; gap: var(--ui-space-20); grid-template-columns: minmax(0, 1fr) auto; min-width: 0; padding: var(--ui-space-16) var(--ui-space-18); }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-failures li > div { min-width: 0; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-failures h3 { font-size: var(--ui-text-16); margin: 0 0 var(--ui-space-6); }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-failures :is(h3, code, p, time, span) { overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-failures p { margin: 0 0 var(--ui-space-6); }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-failures li > div:last-child { color: var(--text-muted); display: grid; font-size: var(--ui-text-14); gap: var(--ui-space-6); text-align: right; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-failures form { margin: var(--ui-space-4) 0 0; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-failures button { background: var(--jobs-action-bg); color: var(--jobs-action-text); justify-self: end; margin: 0; padding: var(--ui-space-8) var(--ui-space-14); }
body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-retry-hint { max-width: 32ch; }
body[data-shell-variant="admin"] [data-testid="system-jobs"] :is(.jobs-feedback, .jobs-table-wrap, .job-failures button, .audit-heading-actions a):focus-visible { outline: 3px solid var(--jobs-focus); outline-offset: 3px; }

.search-shell { color: var(--search-primary-text); margin: 0 auto; max-width: 900px; min-width: 0; padding: var(--ui-space-40) var(--ui-space-28) var(--ui-space-64); width: 100%; }
.search-heading { margin-bottom: 26px; }
.search-heading h1 { font-size: var(--ui-text-32); margin: 0 0 var(--ui-space-12); }
.search-heading p:last-child { color: var(--search-secondary-text); margin: 0; }
.search-form { background: transparent; border: 0; border-radius: 0; max-width: none; padding: 0; width: 100%; }
.search-form > label { display: block; font-weight: 800; margin-bottom: 9px; }
.search-form > div { align-items: stretch; display: grid; gap: var(--ui-space-10); grid-template-columns: minmax(0, 1fr) auto; }
.search-form input { border-color: var(--search-boundary); font-size: var(--ui-text-16); min-width: 0; }
.search-form button { margin: 0; }
.search-form :is(input, button):focus-visible { outline: 2px solid var(--search-link); outline-offset: 2px; }
.search-summary { align-items: baseline; display: flex; flex-wrap: wrap; gap: var(--ui-space-14); margin: var(--ui-space-28) 0 var(--ui-space-12); }
.search-summary > * { min-width: 0; }
.search-summary span { color: var(--search-secondary-text); font-size: var(--ui-text-14); }
.search-results { display: grid; gap: var(--ui-space-14); list-style: none; margin: 0; padding: 0; }
.search-results > li { background: transparent; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; min-width: 0; padding: var(--ui-space-20) 0; }
.search-result-title { font-size: var(--ui-text-18); margin: 0; min-width: 0; overflow-wrap: anywhere; }
.search-result-title a { color: var(--search-link); font-weight: 600; text-decoration: none; }
.search-result-title a:hover { text-decoration: underline; }
.search-result-title a:focus-visible { outline: 2px solid var(--search-link); outline-offset: 2px; }
.search-results p { line-height: 1.55; margin: var(--ui-space-10) 0 0; min-width: 0; overflow-wrap: anywhere; }
.search-results mark { background: var(--search-highlight-bg); border-radius: 3px; color: var(--search-highlight-text); padding: 0 var(--ui-space-2); }
.search-result-path { color: var(--search-secondary-text); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: var(--ui-text-13); }
.search-result-path span { background: var(--search-tag-bg); border: 1px solid var(--search-tag-border); border-radius: 4px; color: var(--search-tag-text); margin-right: 7px; padding: var(--ui-space-2) var(--ui-space-6); text-transform: uppercase; }
.search-result-tags { display: flex; flex-wrap: wrap; gap: var(--ui-space-6); list-style: none; margin: var(--ui-space-14) 0 0; min-width: 0; padding: 0; }
.search-result-tags li { background: var(--search-tag-bg); border: 1px solid var(--search-tag-border); border-radius: 999px; color: var(--search-tag-text); font-size: var(--ui-text-12); max-width: 100%; min-width: 0; overflow-wrap: anywhere; padding: var(--ui-space-4) var(--ui-space-10); }
.header-search { align-items: center; display: flex; gap: var(--ui-space-8); left: 50%; margin: 0; max-width: 430px; position: absolute; transform: translateX(-50%); width: min(34vw, 430px); }
.header-search input { background: var(--search-trigger-bg); border: 1px solid var(--search-trigger-border); border-radius: 999px; color: var(--search-trigger-text); min-width: 0; padding: var(--ui-space-10) var(--ui-space-16); width: 100%; }
.header-search button { background: transparent; border: 1px solid var(--search-trigger-border); color: var(--header-text); margin: 0; padding: var(--ui-space-8) var(--ui-space-12); }
.header-search :is(input, button):focus-visible { outline: 2px solid var(--search-overlay-chrome-focus); outline-offset: 2px; }
.search-overlay {
  --search-overlay-chrome-bg: var(--surface);
  --search-overlay-chrome-text: var(--text);
  --search-overlay-chrome-muted: var(--text-muted);
  --search-overlay-chrome-focus: var(--accent-readable);
  --search-overlay-action: var(--text);
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--ui-panel-radius);
  color: var(--text);
  height: auto;
  inset: 0 0 auto;
  margin: max(1rem, 10dvh) auto auto;
  max-height: calc(100dvh - max(2rem, 20dvh));
  max-width: 40rem;
  overflow: hidden;
  padding: 0;
  width: calc(100% - 2rem);
}
.search-overlay[open] { display: flex; flex-direction: column; }
.search-overlay::backdrop { background: rgb(0 0 0 / .4); }
.search-dialog-heading { align-items: center; display: flex; gap: var(--ui-space-16); justify-content: space-between; padding: var(--ui-space-12) var(--ui-space-20); }
.search-dialog-heading h2 { font-size: var(--ui-text-18); margin: 0; }
.search-overlay-close { align-items: center; background: transparent; border: 0; border-radius: var(--ui-control-radius); color: var(--text-muted); display: inline-flex; gap: var(--ui-space-8); margin: 0; min-height: var(--ui-action-min-height); padding: var(--ui-space-8); }
.search-overlay-close:hover { background: var(--surface-muted); color: var(--text); }
.search-overlay-close:focus-visible { outline: 2px solid var(--accent-readable); outline-offset: 2px; }
.search-overlay-query { align-items: center; background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--ui-control-radius); display: flex; gap: var(--ui-space-8); margin: 0 var(--ui-space-20) var(--ui-space-12); max-width: none; min-height: var(--ui-space-48); padding: 0 var(--ui-space-12); }
.search-overlay-query input { appearance: none; background: transparent; border: 0; box-shadow: none; color: var(--text); flex: 1; font: 400 var(--ui-text-16)/1.5 "Roboto", sans-serif; margin: 0; min-width: 0; padding: var(--ui-space-12) 0; width: 100%; }
.search-overlay-query input::placeholder { color: var(--text-muted); opacity: 1; }
.search-overlay-query input:focus-visible { outline: 0; }
.search-overlay-query button { display: none; }
.search-overlay-query:focus-within { outline: 2px solid var(--search-overlay-chrome-focus); outline-offset: 2px; }
.search-overlay-panel { color: var(--text); min-height: 0; overflow: auto; padding: 0 var(--ui-space-8) var(--ui-space-8); }
.search-overlay-panel:focus-visible { outline: 2px solid var(--accent-readable); outline-offset: -2px; }
.search-overlay-status-surface { padding: var(--ui-space-8) var(--ui-space-12); }
.search-overlay-panel > header p { color: var(--text-muted); font-size: var(--ui-text-14); margin: 0; }
.search-overlay-results { list-style: none; margin: 0; padding: 0; }
.search-overlay-results li { min-width: 0; }
.search-overlay-results a[role="option"] { --search-overlay-option-bg: var(--surface); align-items: center; background: var(--search-overlay-option-bg); border-radius: var(--ui-control-radius); color: var(--text); display: grid; gap: var(--ui-space-12); grid-template-columns: 24px minmax(0, 1fr) auto; min-height: var(--ui-space-64); min-width: 0; overflow-wrap: anywhere; padding: var(--ui-space-12); text-decoration: none; }
.search-overlay-results a[role="option"][aria-selected="true"] { --search-overlay-option-bg: var(--search-overlay-result-selected-bg); background: var(--search-overlay-option-bg); }
.search-overlay-results a[role="option"]:hover { background: var(--surface-muted); }
.search-overlay-results a[role="option"]::before { background: url("/assets/static/icons/search-result-document.svg") center/18px 24px no-repeat; content: ""; height: 24px; width: 18px; }
.search-overlay-results a:focus-visible { outline: 2px solid var(--search-overlay-result-focus); outline-offset: -2px; }
.search-overlay-result-copy { min-width: 0; }
.search-overlay-result-title { display: block; font-size: var(--ui-text-16); font-weight: 500; overflow-wrap: anywhere; }
.search-overlay-result-path { color: var(--text-muted); display: block; font-size: var(--ui-text-13); margin-top: var(--ui-space-4); overflow-wrap: anywhere; }
.search-overlay-result-locale { color: var(--text-muted); font-size: var(--ui-text-12); max-width: 4.5rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-overlay-empty { color: var(--text-muted); margin: 0; overflow-wrap: anywhere; padding: var(--ui-space-24) var(--ui-space-12); }
.search-overlay[data-search-state="empty"] .search-overlay-results,
.search-overlay[data-search-state="error"] .search-overlay-results { display: none; }
.search-overlay[data-search-state="error"] .search-overlay-empty { background: var(--ui-error-bg); border-radius: var(--ui-control-radius); color: var(--danger); margin: var(--ui-space-8) var(--ui-space-12); padding: var(--ui-space-16); }
.search-overlay-retry:not([hidden]) { background: var(--surface); border: 1px solid var(--border-strong); color: var(--text); display: block; margin: var(--ui-space-16) 0 0; min-height: var(--ui-action-min-height); padding: var(--ui-space-8) var(--ui-space-16); }
html[data-search-overlay-open], html[data-search-overlay-open] body { max-width: 100%; overflow: hidden; }
html[data-search-overlay-open] body > :not(.search-overlay) { max-width: 100vw; overflow-x: clip; }
@media (forced-colors: active) {
  .login-submit {
    background: ButtonFace;
    border: 1px solid ButtonText;
    box-shadow: none;
    color: ButtonText;
  }
  .login-submit:focus-visible { outline-color: Highlight; }
  .not-found-body { background: Canvas; color: CanvasText; }
  /* background-image is not forced, so a gradient survives while the text on it is
     forced to CanvasText. The not-found page was given this treatment; its two
     sibling error pages and the registration page were not, and their grounds kept
     painting #16283f to #4b2f3a under forced black text at 1.41:1. */
  .problem-body,
  .unauthorized-body { background: Canvas; background-image: none; color: CanvasText; }
  .registration-body { background: Canvas; background-image: none; color: CanvasText; }
  .registration-body::before { display: none; }
  .not-found-actions a { border-color: LinkText; color: LinkText; }
  .not-found-actions a:hover { background: Highlight; color: HighlightText; }
  .not-found-actions a:focus-visible { outline-color: Highlight; }
  .empty-home-body { background: Canvas; color: CanvasText; }
  .empty-home-wordmark { color: CanvasText; opacity: 1; }
  .empty-home-actions a {
    background: ButtonFace;
    border: 1px solid LinkText;
    box-shadow: none;
    color: LinkText;
  }
  .empty-home-actions a:hover { background: Highlight; color: HighlightText; }
  .empty-home-actions a:focus-visible { outline-color: Highlight; }
  body[data-shell-variant="admin"] :is(.app-header, .app-sidebar) { background: Canvas; color: CanvasText; }
  body[data-shell-variant="admin"] :is(.app-header .app-brand, .app-context-label) { color: CanvasText; }
  body[data-shell-variant="admin"] .app-sidebar a { color: LinkText; }
  body[data-shell-variant="admin"] .admin-dashboard-stat {
    background: Canvas;
    border: 1px solid CanvasText;
    box-shadow: none;
  }
  body[data-shell-variant="admin"] .admin-dashboard-stat :is(.admin-dashboard-stat-label, strong) { color: CanvasText; }
  body[data-shell-variant="admin"] .admin-dashboard-heading-mark,
  body[data-shell-variant="admin"] .admin-dashboard-heading-mark > span { border-color: Highlight; }
  body[data-shell-variant="account"] .app-header { background: Canvas; color: CanvasText; }
  body[data-shell-variant="account"] .app-header .app-brand { color: CanvasText; }
  body[data-shell-variant="account"] :is(input, select, textarea) { background: Field; border-color: CanvasText; color: FieldText; }
  body[data-shell-variant="account"] .header-search input { background: Field; border: 1px solid CanvasText; color: FieldText; }
  body[data-shell-variant="account"] button { background: ButtonFace; border: 1px solid ButtonText; color: ButtonText; }
  body[data-shell-variant="account"] button:disabled { border-color: GrayText; color: GrayText; }
  body[data-shell-variant="account"] .profile-card { background: Canvas; border-color: CanvasText; box-shadow: none; }
  body[data-shell-variant="account"] .profile-card > h2 { background: Canvas; border-bottom: 1px solid CanvasText; color: CanvasText; }
  body[data-shell-variant="account"] .profile-save { background: ButtonFace; border: 1px solid ButtonText; color: ButtonText; }
  body[data-shell-variant="account"] :is(button, input, select, textarea, a):focus-visible { outline-color: Highlight; }
  body[data-editor-layout="true"] :is(.app-header, .editor-selection-stage) { background: Canvas; color: CanvasText; }
  body[data-editor-layout="true"]:has(.editor-selection-shell) :is(.app-brand, .editor-selection-title, .editor-selection-heading .editor-save-action, .editor-selection-page-action) { color: CanvasText; }
  body[data-editor-layout="true"] .editor-selection-panel { background: Canvas; border-color: CanvasText; box-shadow: none; color: CanvasText; }
  body[data-editor-layout="true"] .editor-selection-card[data-editor-availability="available"] { background: Canvas; border-color: LinkText; color: LinkText; }
  body[data-editor-layout="true"] .editor-selection-card[data-editor-availability="available"] :is(strong, .editor-selection-description) { color: LinkText; }
  body[data-editor-layout="true"] .editor-selection-card[data-editor-availability="unavailable"] { background: Canvas; border-color: GrayText; color: GrayText; }
  body[data-editor-layout="true"] .editor-selection-card[data-editor-availability="unavailable"] :is(strong, .editor-selection-description, .editor-selection-availability) { color: GrayText; }
  body[data-editor-layout="true"] :is(.editor-selection-icon-surface, .editor-selection-icon-lines) { stroke: CanvasText; }
  body[data-editor-layout="true"] :is(.editor-selection-icon-surface-fill, .editor-selection-icon-page, .editor-selection-icon-glyph, .editor-selection-icon-glyph-fill) { fill: CanvasText; }
  body[data-editor-layout="true"] .editor-selection-back { background: Canvas; border: 1px solid LinkText; box-shadow: none; color: LinkText; }
  body[data-editor-layout="true"] .editor-selection-shell :is(.editor-selection-title, .editor-save-action, .editor-selection-page-action, .editor-header-icon-action, .editor-selection-stage, .editor-selection-card, .editor-selection-back):focus-visible { outline-color: Highlight; }
  .search-overlay-query:focus-within { outline: 2px solid CanvasText; }
}
/* Two panels side by side. Named search-settings-grid after the screen that
   needed it first, and then used by mail, security and storage - a layout with no
   component to build, only a name to correct. */
.ui-settings-columns { display: grid; gap: var(--ui-space-20); grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.storage-statistics { grid-template-columns: repeat(3, 1fr); }
.storage-statistics > div:nth-child(4) { border-left: 0; border-top: 1px solid var(--border); }
.storage-statistics > div:nth-child(n+5) { border-top: 1px solid var(--border); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] {
  --storage-settings-surface: var(--surface);
  --storage-settings-muted-surface: var(--surface-muted);
  --storage-settings-text: var(--text);
  --storage-settings-muted-text: var(--text-muted);
  --storage-settings-tab-bg: var(--app-bg);
  --storage-settings-boundary: color-mix(in srgb, var(--text) 55%, var(--surface));
  --storage-settings-focus: var(--accent-readable);
  --storage-settings-error-bg: var(--ui-error-bg);
  --storage-settings-error-border: color-mix(in srgb, var(--danger) 65%, var(--surface));
  --storage-settings-error-text: var(--danger);
  --storage-settings-warning-bg: var(--notice-bg);
  --storage-settings-warning-border: color-mix(in srgb, var(--notice-text) 65%, var(--surface));
  --storage-settings-warning-text: var(--notice-text);
  --storage-settings-success-bg: color-mix(in srgb, var(--success) 12%, var(--surface));
  --storage-settings-success-border: var(--success);
  --storage-settings-success-text: var(--success);
  min-width: 0;
}
body[data-shell-variant="admin"] [data-testid="storage-settings"] .settings-section-tabs,
body[data-shell-variant="admin"] [data-testid="storage-settings"] .settings-section-tabs a { background: var(--storage-settings-tab-bg); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] :is(.ui-page-heading > div:first-child, .ui-settings-columns, .storage-settings-panel, .storage-statistics) { min-width: 0; }
body[data-shell-variant="admin"] [data-testid="storage-settings"] :is(.ui-page-heading, .storage-settings-panel, .storage-statistics) :is(h1, h2, p, code, dt, dd, strong, span) { overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-health-status { align-items: center; background: var(--storage-settings-muted-surface); border: 1px solid var(--storage-settings-boundary); color: var(--storage-settings-muted-text); display: inline-flex; gap: var(--ui-space-8); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-health-status[data-storage-health="ready"] { background: var(--storage-settings-success-bg); border-color: var(--storage-settings-success-border); color: var(--storage-settings-success-text); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-health-status[data-storage-health="unavailable"] { background: var(--storage-settings-warning-bg); border-color: var(--storage-settings-warning-border); color: var(--storage-settings-warning-text); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-health-mark { align-items: center; border: 2px solid currentColor; border-radius: 50%; display: inline-flex; flex: 0 0 13px; height: 13px; justify-content: center; width: 13px; }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-health-mark > span { background: currentColor; display: block; height: 2px; width: 5px; }
body[data-shell-variant="admin"] [data-testid="storage-settings"] [data-storage-health="ready"] .storage-health-mark > span { background: transparent; border-bottom: 2px solid currentColor; border-right: 2px solid currentColor; height: 7px; transform: rotate(45deg) translate(-1px, -1px); width: 4px; }
body[data-shell-variant="admin"] [data-testid="storage-settings"] [data-storage-health="unavailable"] .storage-health-mark { border-radius: 2px; transform: rotate(45deg); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] [data-storage-health="unavailable"] .storage-health-mark > span { border-radius: 50%; height: 3px; transform: rotate(-45deg); width: 3px; }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-notice { background: var(--storage-settings-muted-surface); border-color: var(--storage-settings-boundary); color: var(--storage-settings-text); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-notice[data-storage-notice-tone="success"] { background: var(--storage-settings-success-bg); border-color: var(--storage-settings-success-border); color: var(--storage-settings-success-text); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-notice[data-storage-notice-tone="warning"] { background: var(--storage-settings-warning-bg); border-color: var(--storage-settings-warning-border); color: var(--storage-settings-warning-text); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-error { background: var(--storage-settings-error-bg); border-color: var(--storage-settings-error-border); color: var(--storage-settings-error-text); max-width: none; }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-statistics { background: var(--storage-settings-muted-surface); border-color: var(--storage-settings-boundary); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-statistics > div { background: var(--storage-settings-muted-surface); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-statistics > div + div,
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-statistics > div:nth-child(4),
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-statistics > div:nth-child(n+5) { border-color: var(--storage-settings-boundary); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-statistics-unavailable { display: block; }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-statistics-unavailable p { color: var(--storage-settings-muted-text); margin: 0; padding: var(--ui-space-16) var(--ui-space-20); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-panel { background: var(--storage-settings-surface); border-color: var(--storage-settings-boundary); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-panel > header { border-color: var(--storage-settings-boundary); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-panel dl { display: grid; margin: var(--ui-space-18) 0; }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-panel dl > div { border-bottom: 1px solid var(--storage-settings-boundary); display: grid; gap: var(--ui-space-12); grid-template-columns: minmax(7rem, .45fr) minmax(0, 1fr); padding: var(--ui-space-10) 0; }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-panel dl > div:last-child { border-bottom: 0; }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-panel dt { color: var(--storage-settings-muted-text); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-panel dd { margin: 0; min-width: 0; text-align: right; }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-panel form { max-width: none; }
body[data-shell-variant="admin"] [data-testid="storage-settings"] .ui-checkbox input { accent-color: var(--storage-settings-focus); }
body[data-shell-variant="admin"] [data-testid="storage-settings"] :is(button, input, .settings-section-tabs a):focus-visible { outline: 3px solid var(--storage-settings-focus); outline-offset: 2px; }
.search-provider-panel dl { display: grid; gap: 0; margin: var(--ui-space-20) 0; }
.search-provider-panel dl div { align-items: baseline; border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; padding: var(--ui-space-10) 0; }
.search-provider-panel dt { color: var(--text-muted); }
.search-provider-panel dd { font-weight: 750; margin: 0; text-align: right; }

@media (max-width: 56.25rem) {
  .search-form > div, .ui-settings-columns { grid-template-columns: 1fr; }
  .search-form button { width: 100%; }
  .header-search { max-width: none; position: static; transform: none; width: min(46vw, 360px); }
  .header-search button { display: none; }
  .search-overlay { margin-top: var(--ui-space-16); }
}
/* The block a screen opens with. Eighteen screens assembled it by hand under the
   name identity-admin-heading, taken from the screen that needed it first. */
body:is([data-shell-variant="admin"], [data-shell-variant="account"]) main#main-content > :is(.identity-admin-shell, .permission-explanation-shell) { background: transparent; border: 0; border-radius: 0; margin-inline: auto; max-width: 64rem; padding: var(--ui-space-32) var(--ui-space-24); }
body[data-shell-variant="admin"] main#main-content > [data-settings-state],
body[data-shell-variant="account"] main#main-content > .identity-admin-shell { max-width: 56rem; }
body:is([data-shell-variant="admin"], [data-shell-variant="account"]) :is(.identity-admin-shell, .permission-explanation-shell) .eyebrow { display: none; }
body[data-shell-variant="admin"] [data-settings-state] .ui-panel { background: transparent; border: 0; border-top: 1px solid var(--border); border-radius: 0; padding: var(--ui-space-24) 0; }
body[data-shell-variant="admin"] [data-settings-state] .ui-panel > header { border: 0; margin: 0 0 var(--ui-space-20); padding: 0; }
body[data-shell-variant="admin"] [data-settings-state] .ui-panel h2 { font-size: var(--ui-text-18); font-weight: 600; }
body[data-shell-variant="admin"] [data-settings-state] :is(.site-settings-grid, .ui-settings-columns) { grid-template-columns: minmax(0, 1fr); gap: 0; }
.user-directory-controls { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: var(--ui-space-16); margin-bottom: var(--ui-space-8); }
.user-directory-filters > summary { cursor: pointer; min-height: var(--ui-action-min-height); padding-block: var(--ui-space-12); }
.user-directory-filters > div { display: grid; gap: var(--ui-space-12); }
.user-directory-controls > div { min-width: 0; }
.user-directory-controls label { margin-top: 0; }
.user-directory-results { color: var(--text-muted); font-size: var(--ui-text-13); margin: var(--ui-space-8) 0 var(--ui-space-16); }
.ui-page-heading { align-items: flex-start; display: flex; flex-wrap: wrap; gap: var(--ui-space-24); justify-content: space-between; margin-bottom: var(--ui-space-32); }
.ui-page-heading h1 { font-size: var(--ui-page-title-size); letter-spacing: -.02em; line-height: 1.2; margin: 0 0 var(--ui-space-12); text-wrap: balance; }
.ui-page-heading p:last-child { color: var(--text-muted); margin: 0; }
.site-settings-shell form { max-width: none; }
body[data-shell-variant="admin"] [data-testid="site-settings"] { min-width: 0; }
body[data-shell-variant="admin"] [data-testid="site-settings"] .ui-page-heading > div:first-child { min-width: 0; }
body[data-shell-variant="admin"] [data-testid="site-settings"] .ui-page-heading :is(h1, p),
body[data-shell-variant="admin"] [data-testid="site-settings"] .ui-form-footer p,
body[data-shell-variant="admin"] [data-testid="site-settings"] .ui-revision-stamp :is(strong, span) { overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-testid="site-settings"] .ui-revision-stamp { align-items: flex-end; background: var(--site-settings-muted-surface); border-color: var(--site-settings-boundary); max-width: 100%; min-width: 0; white-space: normal; }
body[data-shell-variant="admin"] [data-testid="site-settings"] .ui-panel { background: transparent; border-color: var(--site-settings-boundary); min-width: 0; }
body[data-shell-variant="admin"] [data-testid="site-settings"] .ui-panel header,
body[data-shell-variant="admin"] [data-testid="site-settings"] .settings-choice-grid fieldset,
body[data-shell-variant="admin"] [data-testid="site-settings"] .ui-form-footer { border-color: var(--site-settings-boundary); }
body[data-shell-variant="admin"] [data-testid="site-settings"] :is(input, textarea, select) { background: var(--site-settings-surface); border-color: var(--site-settings-boundary); color: var(--site-settings-text); min-width: 0; }
body[data-shell-variant="admin"] [data-testid="site-settings"] :is(input, textarea, select):focus-visible,
body[data-shell-variant="admin"] [data-testid="site-settings"] button:focus-visible,
body[data-shell-variant="admin"] [data-testid="site-settings"] .settings-section-tabs a:focus-visible { outline: 3px solid var(--site-settings-focus); outline-offset: 2px; }
body[data-shell-variant="admin"] [data-testid="site-settings"] :is(input, textarea, select)[aria-invalid="true"] { border-color: var(--site-settings-error-border); box-shadow: inset 0 0 0 1px var(--site-settings-error-border); }
body[data-shell-variant="admin"] [data-testid="site-settings"] .site-settings-error { background: var(--site-settings-error-bg); border-color: var(--site-settings-error-border); color: var(--site-settings-error-text); max-width: none; }
body[data-shell-variant="admin"] [data-testid="security-settings"] { min-width: 0; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .settings-section-tabs,
body[data-shell-variant="admin"] [data-testid="security-settings"] .settings-section-tabs a { background: var(--security-settings-tab-bg); }
body[data-shell-variant="admin"] [data-testid="security-settings"] .ui-page-heading > div:first-child,
body[data-shell-variant="admin"] [data-testid="security-settings"] .ui-settings-columns,
body[data-shell-variant="admin"] [data-testid="security-settings"] .ui-panel { min-width: 0; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .ui-page-heading :is(h1, p),
body[data-shell-variant="admin"] [data-testid="security-settings"] .ui-revision-stamp :is(strong, span),
body[data-shell-variant="admin"] [data-testid="security-settings"] :is(.security-policy-toggle, .security-surface-links, .security-fixed-note, .security-hsts-warning) :is(strong, span, small, p) { overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .ui-revision-stamp { background: var(--security-settings-muted-surface); border-color: var(--security-settings-boundary); max-width: 100%; min-width: 0; white-space: normal; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .ui-panel { background: transparent; border-color: var(--security-settings-boundary); }
body[data-shell-variant="admin"] [data-testid="security-settings"] .ui-panel > header { border-color: var(--security-settings-boundary); }
body[data-shell-variant="admin"] [data-testid="security-settings"] form { max-width: none; }
body[data-shell-variant="admin"] [data-testid="security-settings"] :is(input, select) { background: var(--security-settings-surface); border-color: var(--security-settings-boundary); color: var(--security-settings-text); min-width: 0; }
body[data-shell-variant="admin"] [data-testid="security-settings"] :is(input, select)[aria-invalid="true"] { border-color: var(--security-settings-error-border); box-shadow: inset 0 0 0 1px var(--security-settings-error-border); }
body[data-shell-variant="admin"] [data-testid="security-settings"] :is(input, select, button):focus-visible,
body[data-shell-variant="admin"] [data-testid="security-settings"] .settings-section-tabs a:focus-visible,
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-surface-links a:focus-visible { outline: 3px solid var(--security-settings-focus); outline-offset: 2px; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-policy-toggle { align-items: start; display: grid; gap: var(--ui-space-4) var(--ui-space-10); grid-template-columns: auto minmax(0, 1fr); margin: var(--ui-space-16) 0; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-policy-toggle input { accent-color: var(--security-settings-focus); grid-row: 1 / span 2; height: 18px; margin: var(--ui-space-4) 0 0; width: 18px; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-policy-toggle span { display: grid; gap: var(--ui-space-4); min-width: 0; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-policy-toggle strong { line-height: 1.3; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-policy-toggle small { color: var(--security-settings-muted-text); font-size: var(--ui-text-12); font-weight: 400; line-height: 1.4; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-hsts-warning { background: var(--security-settings-warning-bg); border: 1px solid var(--security-settings-warning-border); border-radius: 8px; color: var(--security-settings-warning-text); display: grid; gap: var(--ui-space-4); margin: var(--ui-space-14) 0; padding: var(--ui-space-12) var(--ui-space-14); }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-hsts-warning span { color: var(--security-settings-warning-text); font-size: var(--ui-text-12); line-height: 1.45; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-surface-links { display: grid; gap: var(--ui-space-10); }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-surface-links a { background: var(--security-settings-muted-surface); border: 1px solid var(--security-settings-boundary); border-radius: 8px; color: var(--security-settings-link); display: grid; gap: var(--ui-space-4); min-width: 0; padding: var(--ui-space-12) var(--ui-space-14); text-decoration: none; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-surface-links a span { color: var(--security-settings-muted-text); font-size: var(--ui-text-12); line-height: 1.45; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-surface-empty { background: var(--security-settings-muted-surface); border: 1px solid var(--security-settings-boundary); border-radius: 8px; color: var(--security-settings-muted-text); margin: 0; padding: var(--ui-space-14); }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-fixed-note { background: var(--security-settings-muted-surface); border: 1px solid var(--security-settings-boundary); border-radius: 8px; color: var(--security-settings-text); display: grid; gap: var(--ui-space-4); margin-top: 16px; padding: var(--ui-space-12) var(--ui-space-14); }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-fixed-note span { color: var(--security-settings-muted-text); font-size: var(--ui-text-12); line-height: 1.45; }
body[data-shell-variant="admin"] [data-testid="security-settings"] .security-settings-error { background: var(--security-settings-error-bg); border-color: var(--security-settings-error-border); color: var(--security-settings-error-text); max-width: none; }
.ui-revision-stamp { align-items: flex-end; background: var(--surface-muted); border: 1px solid var(--border); border-radius: 9px; display: flex; flex-direction: column; gap: var(--ui-space-4); padding: var(--ui-space-10) var(--ui-space-14); white-space: nowrap; }
.ui-revision-stamp strong { font-size: var(--ui-text-14); }
.ui-revision-stamp span { color: var(--text-muted); font-size: var(--ui-text-11); }
.site-settings-grid { display: grid; gap: var(--ui-space-20); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ui-panel { background: var(--surface); border: var(--ui-panel-border); border-radius: var(--ui-panel-radius); padding: var(--ui-panel-padding); }
.ui-panel header { border-bottom: 1px solid var(--border); margin: -3px 0 var(--ui-space-18); padding-bottom: 13px; }
.ui-panel h2 { font-size: var(--ui-text-22); margin: var(--ui-space-2) 0 0; }
.ui-panel label { margin-top: 13px; }
.ui-panel textarea { resize: vertical; }
.settings-seo-panel { grid-column: 1 / -1; }
.settings-choice-grid { display: grid; gap: var(--ui-space-18); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.settings-choice-grid fieldset { border: 1px solid var(--border); border-radius: 8px; display: grid; gap: var(--ui-space-8); padding: var(--ui-space-12) var(--ui-space-16) var(--ui-space-16); }
.settings-choice-grid legend { font-weight: 750; padding: 0 var(--ui-space-6); }
.settings-choice-grid label { align-items: center; display: flex; gap: var(--ui-space-8); margin: 0; }
.settings-choice-grid input { width: auto; }
.ui-form-footer { align-items: center; border-top: 1px solid var(--border); display: flex; flex-wrap: wrap; gap: var(--ui-space-16); justify-content: space-between; margin-top: 22px; padding-top: 18px; }
.ui-form-footer p { color: var(--text-muted); font-size: var(--ui-text-13); margin: 0; }
.ui-form-footer button { margin: 0; }
.ui-form-footer button { flex-shrink: 0; max-width: 100%; overflow-wrap: normal; }
.localization-settings-shell form { max-width: none; }
.localization-boundary { background: var(--notice-bg); border: 1px solid color-mix(in srgb, var(--notice-text) 25%, var(--border)); border-radius: 9px; margin-bottom: 20px; padding: var(--ui-space-14) var(--ui-space-18); }
.localization-boundary strong { color: var(--notice-text); }
.localization-boundary p { color: var(--text-muted); margin: var(--ui-space-4) 0 0; }
.localization-settings-grid { display: grid; gap: var(--ui-space-20); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.localization-runtime-facts { display: grid; gap: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: var(--ui-space-24) 0 0; }
.localization-runtime-facts div { border-left: 1px solid var(--border); display: grid; gap: var(--ui-space-4); padding-left: 13px; }
.localization-runtime-facts div:first-child { border-left: 0; padding-left: 0; }
.localization-runtime-facts dt { color: var(--text-muted); font-size: var(--ui-text-11); text-transform: uppercase; }
.localization-runtime-facts dd { font-size: var(--ui-text-16); font-weight: 750; margin: 0; }
.localization-enabled-panel { border: 1px solid var(--border); border-radius: 10px; margin-top: 20px; padding: var(--ui-space-24); }
.localization-enabled-panel > header { align-items: flex-start; border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; margin: -3px 0 var(--ui-space-16); padding-bottom: 13px; }
.localization-enabled-panel h2 { font-size: var(--ui-text-22); margin: var(--ui-space-2) 0 0; }
.localization-enabled-panel > header > span { background: var(--surface-muted); border-radius: 999px; color: var(--text-muted); font-size: var(--ui-text-12); font-weight: 750; padding: var(--ui-space-6) var(--ui-space-10); }
.localization-locale-list { display: grid; gap: var(--ui-space-10); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.localization-locale-card { align-items: center; border: 1px solid var(--border); border-radius: 8px; display: grid; gap: var(--ui-space-12); grid-template-columns: auto minmax(0, 1fr) auto auto; margin: 0; padding: var(--ui-space-12) var(--ui-space-14); }
.localization-locale-card input { height: 18px; margin: 0; width: 18px; }
.localization-locale-card span { display: grid; }
.localization-locale-card small { color: var(--text-muted); }
.localization-locale-card code { color: var(--accent-readable); }
.localization-locale-card em { color: var(--text-muted); font-size: var(--ui-text-10); font-style: normal; font-weight: 800; letter-spacing: .08em; }
.appearance-settings-shell form { max-width: none; }
.appearance-settings-grid { display: grid; gap: var(--ui-space-24); grid-template-columns: minmax(0, 1fr); }
.appearance-settings-grid > .ui-panel { border: 0; border-radius: 0; padding: 0; }
.appearance-settings-grid select { max-width: 32rem; }
.appearance-css-panel > summary, .identity-user-edit > summary { cursor: pointer; font-weight: 500; min-height: var(--ui-action-min-height); padding-block: var(--ui-space-12); }
.appearance-css-panel > summary:focus-visible, .identity-user-edit > summary:focus-visible { outline: 2px solid var(--accent-readable); outline-offset: 2px; }
.appearance-css-panel textarea { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; min-height: 270px; resize: vertical; }
.appearance-swatches { display: flex; gap: var(--ui-space-8); margin-top: 9px; }
.appearance-swatches span { border: 2px solid var(--surface); border-radius: 999px; box-shadow: 0 0 0 1px var(--border-strong); height: 20px; width: 20px; }
.appearance-swatches [data-accent="blue"] { background: var(--appearance-swatch-choice-1); }
.appearance-swatches [data-accent="teal"] { background: var(--appearance-swatch-choice-2); }
.appearance-swatches [data-accent="violet"] { background: var(--appearance-swatch-choice-3); }
.appearance-swatches [data-accent="amber"] { background: var(--appearance-swatch-choice-4); }
.appearance-swatches [data-accent="rose"] { background: var(--appearance-swatch-choice-5); }
.appearance-security-note { background: var(--surface-muted); border: 1px solid var(--border); border-radius: 8px; display: grid; gap: var(--ui-space-4); margin-top: 16px; padding: var(--ui-space-12) var(--ui-space-14); }
.appearance-security-note span { color: var(--text-muted); font-size: var(--ui-text-12); }
.authoring-settings-grid { display: grid; gap: var(--ui-space-20); grid-template-columns: minmax(0, 1fr); }
.authoring-settings-grid form { max-width: none; }
body[data-shell-variant="admin"] [data-settings-state] {
  --settings-boundary: var(--text-muted);
  --settings-focus: var(--accent-readable);
  --settings-surface: var(--surface);
  --settings-muted-surface: var(--surface-muted);
  --settings-checked-bg: var(--accent-readable);
  --settings-checked-mark: var(--button-text);
  min-width: 0;
}
body[data-shell-variant="admin"] [data-settings-state] :is(.ui-page-heading > div, .ui-panel, .ui-panel header, .ui-form-footer, .ui-revision-stamp, label, span, strong, small, code, p) { min-width: 0; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-settings-state] :is(.ui-panel, .ui-panel header, .ui-form-footer, .ui-feedback, input, select, textarea) { border-color: var(--settings-boundary); }
body[data-shell-variant="admin"] [data-settings-state] :is(input, select, textarea) { background: var(--settings-surface); color: var(--text); }
body[data-shell-variant="admin"] [data-settings-state] :is(a, button, input, select, textarea, [tabindex="-1"]):focus-visible { outline: .1875rem solid var(--settings-focus); outline-offset: .1875rem; }
body[data-shell-variant="admin"] [data-settings-state] .ui-checkbox-described input[type="checkbox"] { appearance: none; background: var(--settings-surface); block-size: 1.125rem; border: .0625rem solid var(--settings-boundary); border-radius: .1875rem; box-sizing: border-box; display: grid; inline-size: 1.125rem; place-content: center; }
body[data-shell-variant="admin"] [data-settings-state] .ui-checkbox-described input[type="checkbox"]:checked { background: var(--settings-checked-bg); border-color: var(--settings-checked-bg); }
body[data-shell-variant="admin"] [data-settings-state] .ui-checkbox-described input[type="checkbox"]:checked::before { block-size: .375rem; border-color: var(--settings-checked-mark); border-style: solid; border-width: 0 0 .125rem .125rem; content: ""; inline-size: .625rem; rotate: -45deg; translate: 0 -.0625rem; }
body[data-shell-variant="admin"] [data-settings-state] .ui-checkbox-described input[type="checkbox"]:disabled { background: var(--settings-muted-surface); border-color: var(--settings-boundary); cursor: not-allowed; }
body[data-shell-variant="admin"] [data-settings-state] .ui-checkbox-described input[type="checkbox"]:disabled:checked::before { border-color: var(--settings-boundary); }
body[data-shell-variant="admin"] [data-settings-state] .ui-checkbox-described input[type="checkbox"]:disabled + span { color: var(--text-muted); cursor: not-allowed; }
.appearance-settings-shell,
.authoring-settings-shell {
  background: var(--settings-surface);
  border-color: var(--settings-boundary);
  min-width: 0;
}
body[data-shell-variant="admin"] :is([data-testid="appearance-settings"], [data-testid="authoring-settings"]) :is(.appearance-security-note, .rendering-module-list article, .rendering-module-list article > div, .rendering-module-list article p, .rendering-module-list article code) { min-width: 0; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] :is([data-testid="appearance-settings"], [data-testid="authoring-settings"]) :is(.ui-revision-stamp, .appearance-security-note, .rendering-module-list article) { border-color: var(--settings-boundary); }
body[data-shell-variant="admin"] :is([data-testid="appearance-settings"], [data-testid="authoring-settings"]) :is(.appearance-security-note, .rendering-module-list article) { background: var(--settings-muted-surface); }
body[data-shell-variant="admin"] :is([data-testid="appearance-settings"], [data-testid="authoring-settings"]) .ui-revision-stamp { flex: 0 0 auto; max-width: 100%; white-space: normal; }
body[data-shell-variant="admin"] [data-testid="appearance-settings"] .appearance-swatches span { box-shadow: 0 0 0 .0625rem var(--settings-boundary); }
body[data-shell-variant="admin"] [data-testid="authoring-settings"] .rendering-module-list article > div { flex-wrap: wrap; }
@media (min-width: 56.3125rem) and (max-width: 87.4375rem) {
  body[data-shell-variant="admin"] :is([data-testid="appearance-settings"], [data-testid="authoring-settings"]) :is(.appearance-settings-grid, .authoring-settings-grid) { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 37.5rem) {
  body[data-shell-variant="admin"] [data-settings-state] .ui-form-footer { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] [data-settings-state] .ui-form-footer button { box-sizing: border-box; width: 100%; }
}
body[data-shell-variant="admin"] :is([data-testid="localization-settings"], [data-testid="search-settings"]) {
  min-width: 0;
}
body[data-shell-variant="admin"] :is([data-testid="localization-settings"], [data-testid="search-settings"]) :is(.localization-boundary, .localization-enabled-panel, .localization-enabled-panel > header, .localization-locale-card, .search-provider-panel dl div, dt, dd) { min-width: 0; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] :is([data-testid="localization-settings"], [data-testid="search-settings"]) :is(.ui-revision-stamp, .localization-boundary, .localization-enabled-panel, .localization-enabled-panel > header, .localization-runtime-facts div, .localization-locale-card, .search-provider-panel dl div) { border-color: var(--settings-boundary); }
body[data-shell-variant="admin"] :is([data-testid="localization-settings"], [data-testid="search-settings"]) :is(.ui-revision-stamp, .localization-locale-card) { background: var(--settings-muted-surface); }
body[data-shell-variant="admin"] :is([data-testid="localization-settings"], [data-testid="search-settings"]) .ui-revision-stamp { flex: 0 0 auto; max-width: 100%; white-space: normal; }
body[data-shell-variant="admin"] [data-testid="localization-settings"] .localization-enabled-panel > header { gap: var(--ui-space-12); }
body[data-shell-variant="admin"] [data-testid="localization-settings"] .localization-locale-card input { accent-color: var(--settings-focus); }
body[data-shell-variant="admin"] [data-testid="search-settings"] .search-provider-panel dl div { display: grid; gap: var(--ui-space-12); grid-template-columns: minmax(7rem, .45fr) minmax(0, 1fr); }
body[data-shell-variant="admin"] [data-testid="search-settings"] .search-provider-panel dd { text-align: right; }
@media (min-width: 56.3125rem) and (max-width: 87.4375rem) {
  body[data-shell-variant="admin"] :is([data-testid="localization-settings"], [data-testid="search-settings"]) :is(.localization-settings-grid, .ui-settings-columns) { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] :is([data-testid="localization-settings"], [data-testid="search-settings"]) .ui-page-heading { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] :is([data-testid="localization-settings"], [data-testid="search-settings"]) .ui-revision-stamp { align-items: flex-start; }
}
@media (max-width: 37.5rem) {
  body[data-shell-variant="admin"] :is([data-testid="localization-settings"], [data-testid="search-settings"]) .ui-form-footer button { box-sizing: border-box; width: 100%; }
  body[data-shell-variant="admin"] [data-testid="localization-settings"] .localization-locale-card { grid-template-columns: auto minmax(0, 1fr) auto; }
  body[data-shell-variant="admin"] [data-testid="localization-settings"] .localization-locale-card em { grid-column: 2; }
  body[data-shell-variant="admin"] [data-testid="search-settings"] .search-provider-panel dl div { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="search-settings"] .search-provider-panel dd { text-align: left; }
}
body[data-shell-variant="admin"] :is([data-testid="analytics-settings"], [data-testid="comment-settings"]) {
  min-width: 0;
}
body[data-shell-variant="admin"] :is([data-testid="analytics-settings"], [data-testid="comment-settings"]) :is(.appearance-security-note, .comment-policy-summary dl div, dt, dd) { min-width: 0; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] :is([data-testid="analytics-settings"], [data-testid="comment-settings"]) :is(.ui-revision-stamp, .appearance-security-note, .comment-policy-summary dl div) { border-color: var(--settings-boundary); }
body[data-shell-variant="admin"] :is([data-testid="analytics-settings"], [data-testid="comment-settings"]) :is(.ui-revision-stamp, .appearance-security-note) { background: var(--settings-muted-surface); }
body[data-shell-variant="admin"] :is([data-testid="analytics-settings"], [data-testid="comment-settings"]) .ui-revision-stamp { flex: 0 0 auto; max-width: 100%; white-space: normal; }
body[data-shell-variant="admin"] [data-testid="analytics-settings"] textarea { max-width: 100%; resize: vertical; }
body[data-shell-variant="admin"] [data-testid="comment-settings"] .comment-policy-summary dl > div { grid-template-columns: minmax(5.625rem, .35fr) minmax(0, 1fr); }
@media (min-width: 56.3125rem) and (max-width: 87.4375rem) {
  body[data-shell-variant="admin"] [data-testid="analytics-settings"] .appearance-settings-grid,
  body[data-shell-variant="admin"] [data-testid="comment-settings"] .comment-settings-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] :is([data-testid="analytics-settings"], [data-testid="comment-settings"]) .ui-page-heading { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] :is([data-testid="analytics-settings"], [data-testid="comment-settings"]) .ui-revision-stamp { align-items: flex-start; }
}
@media (max-width: 37.5rem) {
  body[data-shell-variant="admin"] :is([data-testid="analytics-settings"], [data-testid="comment-settings"]) .ui-form-footer { gap: var(--ui-space-12); }
body[data-shell-variant="admin"] [data-testid="comment-settings"] .comment-policy-summary dl > div { gap: var(--ui-space-4); grid-template-columns: minmax(0, 1fr); }
}
body[data-shell-variant="admin"] :is([data-testid="mail-settings"], [data-testid="webhook-settings"]) {
  min-width: 0;
}
body[data-shell-variant="admin"] :is([data-testid="mail-settings"], [data-testid="webhook-settings"]) :is(.provider-readiness, .provider-readiness > div, .webhook-list-heading, .webhook-list-heading > div, .webhook-endpoint-card, .webhook-endpoint-card > header, .webhook-endpoint-fields, .webhook-delivery-stats, .webhook-delivery-stats > div, .webhook-contract-panel dl > div, h2, h3, dt, dd) { min-width: 0; overflow-wrap: anywhere; }
body[data-shell-variant="admin"] :is([data-testid="mail-settings"], [data-testid="webhook-settings"]) :is(.provider-readiness, .provider-readiness > div + div, .webhook-delivery-stats, .webhook-delivery-stats > div:nth-child(n+4), .webhook-contract-panel dl > div, .secondary-action, .ui-status) { border-color: var(--settings-boundary); }
body[data-shell-variant="admin"] :is([data-testid="mail-settings"], [data-testid="webhook-settings"]) :is(.provider-readiness, .webhook-delivery-stats, .secondary-action) { background: var(--settings-muted-surface); }
body[data-shell-variant="admin"] [data-testid="mail-settings"] .search-provider-panel dl div { display: grid; gap: var(--ui-space-12); grid-template-columns: minmax(7.5rem, .45fr) minmax(0, 1fr); }
body[data-shell-variant="admin"] [data-testid="mail-settings"] .mail-runtime-form { margin-top: 1.25rem; }
body[data-shell-variant="admin"] [data-testid="webhook-settings"] .webhook-endpoint-card:only-child { grid-column: 1 / -1; }
body[data-shell-variant="admin"] [data-testid="webhook-settings"] .webhook-endpoint-card > header { align-items: flex-start; }
body[data-shell-variant="admin"] [data-testid="webhook-settings"] .webhook-endpoint-card > header > .ui-status { flex: 0 0 auto; white-space: nowrap; }
body[data-shell-variant="admin"] [data-testid="webhook-settings"] .webhook-delivery-stats { border: .0625rem solid var(--settings-boundary); }
body[data-shell-variant="admin"] :is([data-testid="mail-settings"], [data-testid="webhook-settings"]) .secondary-action { align-items: center; border-style: solid; border-width: .0625rem; box-sizing: border-box; color: var(--text); display: inline-flex; justify-content: center; min-height: 2.5rem; padding: .5rem 1rem; text-decoration: none; }
@media (min-width: 56.3125rem) and (max-width: 87.4375rem) {
  body[data-shell-variant="admin"] [data-testid="mail-settings"] .ui-settings-columns,
  body[data-shell-variant="admin"] [data-testid="webhook-settings"] :is(.webhook-settings-grid, .webhook-endpoint-list) { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] :is([data-testid="mail-settings"], [data-testid="webhook-settings"]) .ui-page-heading { align-items: stretch; flex-direction: column; }
}
@media (max-width: 37.5rem) {
  body[data-shell-variant="admin"] :is([data-testid="mail-settings"], [data-testid="webhook-settings"]) .ui-form-footer { gap: var(--ui-space-12); }
  body[data-shell-variant="admin"] :is([data-testid="mail-settings"], [data-testid="webhook-settings"]) :is(.ui-form-footer button, .webhook-action-buttons button) { width: 100%; }
  body[data-shell-variant="admin"] [data-testid="webhook-settings"] :is(.webhook-list-heading, .webhook-endpoint-card > header) { align-items: stretch; flex-direction: column; gap: var(--ui-space-12); }
  body[data-shell-variant="admin"] [data-testid="webhook-settings"] .webhook-action-buttons { align-items: stretch; display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
}
.ui-checkbox-described { align-items: start; display: grid; gap: var(--ui-space-4) var(--ui-space-10); grid-template-columns: auto minmax(0, 1fr); margin: var(--ui-space-14) 0; }
.ui-checkbox-described input { grid-row: 1 / span 2; margin: var(--ui-space-4) 0 0; width: auto; }
.ui-checkbox-described span { display: grid; gap: var(--ui-space-4); }
.ui-checkbox-described strong { line-height: 1.3; }
.ui-checkbox-described small { color: var(--text-muted); font-size: var(--ui-text-12); font-weight: 400; line-height: 1.4; }
.rendering-inventory > header code { color: var(--accent-readable); display: inline-block; font-size: var(--ui-text-11); margin-top: 4px; overflow-wrap: anywhere; }
.rendering-module-list { display: grid; gap: var(--ui-space-8); margin-top: 16px; }
.rendering-module-list article { background: var(--surface-muted); border: 1px solid var(--border); border-radius: 8px; padding: var(--ui-space-10) var(--ui-space-12); }
.rendering-module-list article > div { align-items: baseline; display: flex; gap: var(--ui-space-10); justify-content: space-between; }
.rendering-module-list article code { color: var(--accent-readable); font-size: var(--ui-text-10); }
.rendering-module-list article p { color: var(--text-muted); font-size: var(--ui-text-12); margin: var(--ui-space-6) 0; }
.rendering-module-list article span { font-size: var(--ui-text-10); font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.identity-count { background: var(--surface-muted); border-radius: 999px; color: var(--text-muted); flex: 0 0 auto; font-size: var(--ui-text-13); font-weight: 700; padding: var(--ui-space-6) var(--ui-space-12); }
.identity-create-panel { border: 1px solid var(--border); border-radius: 9px; margin-bottom: 24px; padding: 0 var(--ui-space-18) var(--ui-space-18); }
.identity-create-panel summary { cursor: pointer; font-weight: 750; padding: var(--ui-space-14) 0; }
.identity-create-panel form { max-width: none; }
.identity-form-grid { display: grid; gap: var(--ui-space-14); grid-template-columns: repeat(2, minmax(0, 1fr)); }
body[data-public-page="true"] [data-testid="media-browser"] {
  --media-surface: var(--surface);
  --media-muted-surface: var(--surface-muted);
  --media-text: var(--text);
  --media-muted-text: var(--text-muted);
  --media-boundary: var(--text-muted);
  --media-focus: var(--accent-readable);
  --media-link: var(--accent-readable);
  --media-folder-mark: var(--media-link);
  --media-success: var(--success);
  --media-danger-bg: var(--danger);
  --media-danger-text: var(--danger-action-text);
  margin: 0 auto;
  max-width: 70rem;
  min-width: 0;
  padding: 1.125rem 2rem 4.375rem;
}
body[data-public-page="true"] [data-testid="media-browser"] :is(h1, h2, h3, p, strong, small, label, a, button, summary) { overflow-wrap: anywhere; }
body[data-public-page="true"] [data-testid="media-browser"] .media-heading { align-items: end; display: flex; gap: 1.125rem; justify-content: space-between; margin-bottom: 1.5rem; min-width: 0; }
body[data-public-page="true"] [data-testid="media-browser"] .media-heading > div { min-width: 0; }
body[data-public-page="true"] [data-testid="media-browser"] .media-heading h1 { font-size: var(--ui-page-title-size); margin: 0; }
body[data-public-page="true"] [data-testid="media-browser"] :is(.media-heading .eyebrow, .media-heading .secondary-link) { color: var(--media-link); }
body[data-public-page="true"] [data-testid="media-browser"] .media-heading .secondary-link { flex: 0 0 auto; }
body[data-public-page="true"] [data-testid="media-browser"] .media-path { color: var(--media-muted-text); font-family: ui-monospace, monospace; margin: .375rem 0 0; word-break: break-word; }
body[data-public-page="true"] [data-testid="media-browser"] .media-actions { background: transparent; border: 0; border-block: 1px solid var(--border); border-radius: 0; margin-bottom: var(--ui-space-24); padding: var(--ui-space-24) 0; }
body[data-public-page="true"] [data-testid="media-browser"] :is(.media-actions h2, .media-collection h2) { font-size: var(--ui-text-20); margin: 0 0 .875rem; }
body[data-public-page="true"] [data-testid="media-browser"] .media-action-grid { display: grid; gap: var(--ui-space-20); grid-template-columns: repeat(2, minmax(0, 1fr)); }
body[data-public-page="true"] [data-testid="media-browser"] .media-action-grid form { align-items: end; display: grid; gap: .5625rem; grid-template-columns: minmax(0, 1fr); max-width: none; }
body[data-public-page="true"] [data-testid="media-browser"] .media-action-grid label { grid-column: auto; margin: 0; }
body[data-public-page="true"] [data-testid="media-browser"] :is(input, .media-asset-card, .media-folder-card) { border-color: var(--media-boundary); min-width: 0; }
body[data-public-page="true"] [data-testid="media-browser"] .media-action-status { background: var(--media-muted-surface); border: .0625rem solid var(--media-boundary); border-radius: var(--ui-feedback-radius); color: var(--media-muted-text); margin: 0 0 1.25rem; min-height: 1.25rem; padding: var(--ui-feedback-padding); }
body[data-public-page="true"] [data-testid="media-browser"] .media-action-status[data-media-status-tone="success"] { color: var(--media-success); }
body[data-public-page="true"] [data-testid="media-browser"] .media-action-status[data-media-status-tone="error"] { background: var(--ui-error-bg); border-color: var(--danger); color: var(--danger); }
body[data-public-page="true"] [data-testid="media-browser"] .media-collection { margin-top: 1.25rem; }
body[data-public-page="true"] [data-testid="media-browser"] .media-folder-grid { display: grid; gap: var(--ui-space-14); grid-template-columns: repeat(auto-fill, minmax(min(11.875rem, 100%), 1fr)); }
body[data-public-page="true"] [data-testid="media-browser"] .media-folder-card { background: var(--media-surface); border: .0625rem solid var(--media-boundary); border-radius: .5625rem; color: var(--media-text); display: grid; gap: .4375rem; padding: 1rem; text-decoration: none; }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-grid { display: grid; }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-card { background: transparent; border: 0; border-block-start: 1px solid var(--border); border-radius: 0; color: var(--media-text); display: grid; grid-template-columns: 80px minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--ui-space-20); padding: var(--ui-space-20) 0; }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-summary { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--ui-space-8) var(--ui-space-16); min-width: 0; grid-column: 2 / -1; }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-summary h3 { flex-basis: 100%; }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-summary > span { color: var(--media-muted-text); font-size: var(--ui-text-14); }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-card > details { grid-column: 2; border: 0; margin: 0; padding: 0; }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-card > .media-delete-disclosure { grid-column: 3; }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-card > details summary { min-height: 44px; padding-block: var(--ui-space-12); font-size: var(--ui-text-14); font-weight: 500; }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-card > details[open] { grid-column: 1 / -1; }
body[data-public-page="true"] [data-testid="media-browser"] .media-folder-card:hover { border-color: var(--media-link); }
body[data-public-page="true"] [data-testid="media-browser"] .media-folder-entry { display: grid; gap: .625rem; min-width: 0; }
body[data-public-page="true"] [data-testid="media-browser"] .media-folder-delete-disclosure { margin: 0; }
body[data-public-page="true"] [data-testid="media-browser"] .media-folder-mark { color: var(--media-folder-mark); display: grid; grid-template-rows: .3125rem .8125rem; height: 1.125rem; justify-self: start; width: 1.5rem; }
body[data-public-page="true"] [data-testid="media-browser"] :is(.media-folder-mark-tab, .media-folder-mark-body) { border: .125rem solid currentColor; box-sizing: border-box; display: block; }
body[data-public-page="true"] [data-testid="media-browser"] .media-folder-mark-tab { border-block-end: 0; border-radius: .1875rem .1875rem 0 0; width: .75rem; }
body[data-public-page="true"] [data-testid="media-browser"] .media-folder-mark-body { border-radius: 0 .1875rem .1875rem .1875rem; }
body[data-public-page="true"] [data-testid="media-browser"] :is(.media-folder-card strong, .media-folder-card small, .media-asset-card h3, .media-asset-card > span) { min-width: 0; overflow-wrap: anywhere; }
body[data-public-page="true"] [data-testid="media-browser"] :is(.media-folder-card small, .media-asset-card > span) { color: var(--media-muted-text); }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-card h3 { font-size: var(--ui-text-16); margin: 0; }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-preview { align-items: center; aspect-ratio: 1; background: var(--media-muted-surface); border: .0625rem solid var(--media-boundary); border-radius: .375rem; color: var(--media-muted-text); display: flex; font-size: var(--ui-text-12); font-weight: 800; justify-content: center; object-fit: contain; width: 80px; }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-card .ui-status { background: var(--media-muted-surface); border: .0625rem solid var(--media-boundary); color: var(--media-muted-text); justify-self: start; }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-card .ui-status.ready { color: var(--media-success); }
body[data-public-page="true"] [data-testid="media-browser"] img.media-asset-preview { background: var(--media-thumbnail-fixed-light); }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-manage { border-top: .0625rem solid var(--media-boundary); display: grid; gap: var(--ui-space-8); margin-top: .3125rem; padding-top: .75rem; }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-manage label { font-size: var(--ui-text-12); margin: 0; }
body[data-public-page="true"] [data-testid="media-browser"] .media-asset-manage :is(input, button) { width: 100%; }
body[data-public-page="true"] [data-testid="media-browser"] .media-delete-disclosure { border-top: .0625rem solid var(--media-boundary); margin-top: .25rem; padding-top: .625rem; }
body[data-public-page="true"] [data-testid="media-browser"] .media-delete-disclosure summary { color: var(--media-muted-text); cursor: pointer; font-weight: 700; }
body[data-public-page="true"] [data-testid="media-browser"] .media-delete-disclosure p { color: var(--media-muted-text); font-size: var(--ui-text-12); margin: .625rem 0; }
body[data-public-page="true"] [data-testid="media-browser"] .media-delete-disclosure .danger-action { background: var(--media-danger-bg); color: var(--media-danger-text); width: 100%; }
body[data-public-page="true"] [data-testid="media-browser"] :is(input, button, a, summary):focus-visible { outline: .1875rem solid var(--media-focus); outline-offset: .125rem; }
@media (max-width: 56.25rem) {
  body[data-public-page="true"] [data-testid="media-browser"] .media-heading { align-items: stretch; flex-direction: column; }
  body[data-public-page="true"] [data-testid="media-browser"] .media-heading .secondary-link { align-self: flex-start; }
  body[data-public-page="true"] [data-testid="media-browser"] .media-asset-card { grid-template-columns: 64px minmax(0, 1fr); column-gap: var(--ui-space-12); }
  body[data-public-page="true"] [data-testid="media-browser"] .media-asset-preview { width: 64px; }
  body[data-public-page="true"] [data-testid="media-browser"] .media-asset-card > :is(details, .media-delete-disclosure) { grid-column: 1 / -1; }
}
@media (max-width: 87.4375rem) {
  body[data-public-page="true"] [data-testid="media-browser"] .media-action-grid { grid-template-columns: minmax(0, 1fr); }
}
.identity-form-grid label { margin-top: 6px; }
.ui-checkbox { align-items: center; display: flex; gap: var(--ui-space-10); margin-top: 14px; }
.ui-checkbox input { height: 18px; margin: 0; width: 18px; }
.identity-user-list { display: grid; gap: 0; }
.identity-user-card { border: 0; border-block-start: 1px solid var(--border); border-radius: 0; padding: var(--ui-space-20) 0; }
.identity-user-card form { max-width: none; }
.identity-user-card header { align-items: flex-start; display: flex; gap: var(--ui-space-18); justify-content: space-between; }
.identity-user-card h2 { font-size: var(--ui-text-16); margin: 0; }
.identity-user-card header p { color: var(--text-muted); margin: var(--ui-space-4) 0 0; }
.identity-badges { align-items: center; display: flex; flex-wrap: wrap; gap: var(--ui-space-8); justify-content: flex-end; }
.identity-badges span, .identity-badges small { background: color-mix(in srgb, var(--accent) 10%, var(--surface)); border-radius: 999px; color: var(--accent-readable); font-size: var(--ui-text-11); font-weight: 750; padding: var(--ui-space-4) var(--ui-space-8); }
.identity-badges .disabled-badge { background: color-mix(in srgb, var(--danger) 9%, var(--surface)); color: var(--danger); }
.identity-badges .unverified-badge { background: var(--notice-bg); color: var(--notice-text); }
.identity-toggle-row { align-items: center; display: flex; gap: var(--ui-space-18); margin-top: 12px; }
.identity-toggle-row .secondary-action { margin: 0 0 0 auto; }
.identity-metadata { color: var(--text-muted); font-size: var(--ui-text-11); margin: var(--ui-space-16) 0 0; overflow-wrap: anywhere; }
/* .secondary-button is gone: all eleven of its call sites are the Action
   primitive now, so the class that rendered three different ways across three
   admin pages has no markup left to render at all. .secondary-action keeps this
   rule until its own call sites follow. */
.secondary-action {
  align-items: center;
  background: var(--surface-muted);
  border: 1px solid var(--text-muted);
  border-radius: var(--ui-action-radius);
  box-sizing: border-box;
  color: var(--text);
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  min-height: var(--ui-action-min-height);
  padding: var(--ui-action-padding);
  text-decoration: none;
}
.identity-group-list { display: grid; gap: var(--ui-space-12); }
.identity-group-card { align-items: center; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; color: var(--text); display: flex; gap: var(--ui-space-24); justify-content: space-between; padding: var(--ui-space-20) 0; text-decoration: none; }
.identity-group-card:hover { border-color: var(--accent); }
.identity-group-card h2 { font-size: var(--ui-text-20); margin: 0; }
.identity-group-card p { color: var(--text-muted); margin: var(--ui-space-4) 0 0; }
.identity-group-card > span { color: var(--text-muted); flex: 0 0 auto; font-size: var(--ui-text-13); }
.group-detail-grid { display: grid; gap: var(--ui-space-24); grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); }
.group-settings-card, .group-members-card { border: 1px solid var(--border); border-radius: 9px; padding: var(--ui-space-20); }
.group-settings-card h2, .group-members-card h2 { font-size: var(--ui-text-20); margin: 0 0 var(--ui-space-14); }
.group-members-card h2 span { color: var(--text-muted); font-size: var(--ui-text-13); }
.group-delete-form { margin-top: 12px; }
.group-delete-form button { margin-top: 0; }
.member-add-form { border-bottom: 1px solid var(--border); margin-bottom: 10px; padding-bottom: 18px; }
.member-add-form > div { align-items: center; display: flex; gap: var(--ui-space-8); }
.member-add-form button { flex: 0 0 auto; margin: 0; }
.group-member-list { list-style: none; margin: 0; padding: 0; }
.group-member-list li { align-items: center; border-bottom: 1px solid var(--border); display: flex; gap: var(--ui-space-14); justify-content: space-between; padding: var(--ui-space-12) 0; }
.group-member-list li:last-child { border-bottom: 0; }
.group-member-list strong, .group-member-list span { display: block; }
.group-member-list span { color: var(--text-muted); font-size: var(--ui-text-13); }
.group-member-list form, .group-member-list button { margin: 0; }
body[data-shell-variant="admin"] :is([data-testid="user-administration"], [data-testid="group-administration"], [data-testid="group-detail-administration"]) {
  --identity-directory-boundary: var(--text-muted);
  --identity-directory-danger: var(--danger);
  --identity-directory-danger-text: var(--danger-action-text);
  --identity-directory-focus: var(--accent-readable);
  --identity-directory-muted-surface: var(--surface-muted);
  --identity-directory-surface: var(--surface);
  border-color: var(--identity-directory-boundary);
  min-width: 0;
}
body[data-shell-variant="admin"] :is([data-testid="user-administration"], [data-testid="group-administration"], [data-testid="group-detail-administration"]) :is(.ui-page-heading > div, .identity-create-panel, .identity-user-card, .identity-user-card form, .identity-group-card > div, .group-detail-grid > div, .group-settings-card, .group-members-card, .group-member-list li > div, .identity-readonly-facts, .identity-readonly-facts > div) { min-width: 0; }
body[data-shell-variant="admin"] :is([data-testid="user-administration"], [data-testid="group-administration"], [data-testid="group-detail-administration"]) :is(h1, h2, p, a, code, dt, dd, strong, span) { overflow-wrap: anywhere; }
body[data-shell-variant="admin"] :is([data-testid="user-administration"], [data-testid="group-administration"], [data-testid="group-detail-administration"]) :is(.identity-create-panel, .identity-user-card, .group-settings-card, .group-members-card) {
  background: var(--identity-directory-surface);
  border-color: var(--identity-directory-boundary);
}
body[data-shell-variant="admin"] [data-testid="user-administration"] .identity-user-card { background: transparent; }
body[data-shell-variant="admin"] :is([data-testid="user-administration"], [data-testid="group-administration"], [data-testid="group-detail-administration"]) :is(input, select, textarea, .secondary-action) { border-color: var(--identity-directory-boundary); }
body[data-shell-variant="admin"] :is([data-testid="user-administration"], [data-testid="group-administration"], [data-testid="group-detail-administration"]) :is(.member-add-form, .group-member-list li) { border-color: var(--identity-directory-boundary); }
body[data-shell-variant="admin"] [data-testid="group-detail-administration"] .group-member-list li { background: var(--identity-directory-muted-surface); border: .0625rem solid var(--identity-directory-boundary); border-radius: .4375rem; padding: .75rem; }
body[data-shell-variant="admin"] :is([data-testid="user-administration"], [data-testid="group-administration"], [data-testid="group-detail-administration"]) :is(a, button, input, select, textarea, summary):focus-visible,
body[data-shell-variant="admin"] :is([data-testid="user-administration"], [data-testid="group-administration"], [data-testid="group-detail-administration"]) :is(.ui-feedback[autofocus]):focus {
  outline: .1875rem solid var(--identity-directory-focus);
  outline-offset: .1875rem;
}
.identity-readonly-facts { display: grid; gap: .625rem; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 1rem 0 0; }
.identity-readonly-facts > div { background: var(--identity-directory-muted-surface); border: .0625rem solid var(--identity-directory-boundary); border-radius: .4375rem; padding: .625rem .75rem; }
.identity-readonly-facts dt { color: var(--text-muted); font-size: var(--ui-text-12); font-weight: 700; }
.identity-readonly-facts dd { margin: .25rem 0 0; }
.identity-readonly-note { color: var(--text-muted); margin: 1rem 0 0; }
.identity-directory-unavailable { background: var(--identity-directory-muted-surface); border: .0625rem solid var(--identity-directory-boundary); border-radius: .5rem; color: var(--text-muted); padding: .875rem 1rem; }
.group-danger-disclosure { background: var(--ui-error-bg); border: .0625rem solid var(--identity-directory-danger); border-radius: .5625rem; margin-top: 1rem; padding: 0 1.125rem 1.125rem; }
.group-danger-disclosure summary { color: var(--identity-directory-danger); cursor: pointer; font-weight: 750; padding: .875rem 0; }
.group-danger-disclosure p { margin: 0; }
body[data-shell-variant="admin"] [data-testid="group-detail-administration"] .group-danger-disclosure .danger-action {
  background: var(--identity-directory-danger);
  border: .0625rem solid var(--identity-directory-danger);
  color: var(--identity-directory-danger-text);
}
@media (min-width: 56.3125rem) and (max-width: 87.4375rem) {
  body[data-shell-variant="admin"] [data-testid="group-detail-administration"] .group-detail-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="group-detail-administration"] .ui-page-heading { align-items: stretch; flex-direction: column; }
}
@media (max-width: 56.25rem) {
  body[data-shell-variant="admin"] [data-testid="user-administration"] .identity-user-card header { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] [data-testid="user-administration"] .identity-user-card header > div { min-width: 0; }
  body[data-shell-variant="admin"] [data-testid="user-administration"] .identity-user-card .identity-badges { justify-content: flex-start; }
  body[data-shell-variant="admin"] [data-testid="user-administration"] .identity-user-card header .secondary-action { align-self: flex-start; }
}
body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .identity-admin-shell .ui-revision-stamp { background: transparent; border: 0; padding: 0; }
main#main-content > :is(.history-shell, .source-shell, .trash-shell, .page-delete-shell, .page-move-shell, .create-redirect-shell, .comment-edit-page, .media-browser, .error-shell) { background: transparent; border: 0; border-radius: 0; box-shadow: none; margin: 0 auto; max-width: 56rem; min-width: 0; padding: 0; width: 100%; }
main#main-content > :is(.history-shell, .media-browser) { max-width: 64rem; }
main#main-content > :is(.page-delete-shell, .error-shell) { max-width: 40rem; }
body[data-public-page="true"] main#main-content > :is(.page-move-shell, .create-redirect-shell, .comment-edit-page) { max-width: 48rem; }
:is(.source-heading, .media-heading, .page-move-shell, .create-redirect-shell) .eyebrow { display: none; }
[data-testid="media-browser"][data-media-state="ready"] .media-action-status { display: none; }
[data-testid="media-browser"] .media-action-grid button { justify-self: start; margin: 0; min-height: 44px; width: auto; }
[data-testid="media-browser"] [data-media-folder-form] button { background: var(--surface); border: 1px solid var(--border-strong); color: var(--text); }
.media-manage-disclosure { border-top: 1px solid var(--border); margin-top: var(--ui-space-12); padding-top: var(--ui-space-12); }
.media-manage-disclosure summary { cursor: pointer; font-weight: 500; min-height: 44px; padding-block: var(--ui-space-12); }
.media-manage-disclosure summary:focus-visible { outline: 3px solid var(--accent-readable); outline-offset: 2px; }
@media (max-width: 56.25rem) {
  .app-header .product-wordmark { font-size: var(--ui-text-14); }
  .edit-conflict-versions { grid-template-columns: 1fr; }
  .edit-conflict { border-radius: 0; margin: 0 0 var(--ui-space-24); max-height: calc(100dvh - 112px); padding: var(--ui-space-20); }
  .app-header { height: 3.5rem; }
  .app-layout { min-height: calc(100vh - 112px); }
  .app-layout[data-sidebar="true"] { grid-template-columns: 1fr; }
  .app-sidebar { display: none; }
  .mobile-navigation { display: block; }
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .app-header {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) 48px;
    gap: var(--ui-space-8);
    height: 4rem;
    padding: 0 var(--ui-space-8);
  }
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .app-header .app-brand {
    height: auto;
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    overflow: hidden;
    padding-left: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .header-search { display: none; }
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .app-header-actions { display: contents; }
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .app-header-actions > nav { grid-column: 3; grid-row: 1; }
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .mobile-navigation { grid-column: 1; grid-row: 1; }
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .mobile-navigation > summary { align-items: center; background: var(--surface-muted); border: 0; display: flex; font-size: 0; height: 40px; justify-content: center; padding: 0; width: 40px; }
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .mobile-navigation > summary::before { background: var(--text); box-shadow: 0 -5px 0 var(--text), 0 5px 0 var(--text); content: ""; height: 2px; width: 16px; }
  body[data-shell-variant="account"] .app-header .app-brand { flex: 1 1 auto; }
  body[data-shell-variant="account"] .app-header-actions { flex: 0 0 auto; gap: var(--ui-space-8); margin-left: auto; min-width: 0; }
  body[data-shell-variant="account"] .app-header-actions nav { flex: 0 0 auto; gap: 0; min-width: 0; }
  body[data-shell-variant="account"] .app-header-actions nav form { flex: 0 0 auto; margin: 0; }
  body[data-shell-variant="account"] .app-header-actions nav form button { white-space: nowrap; }
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) .app-layout[data-sidebar="true"] {
    grid-template-columns: minmax(0, 1fr);
    min-height: calc(100vh - 4rem);
  }
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) main#main-content {
    margin: 0;
    max-width: none;
    min-width: 0;
    padding: 1rem;
  }
  body[data-shell-variant="admin"] .app-header-actions nav,
  body[data-shell-variant="account"] .app-header-actions nav { height: 4rem; }
  body[data-shell-variant="admin"] .app-context-label { display: none; }
  body[data-shell-variant="account"] .app-footer { margin-left: 0; }
  body[data-shell-variant="account"] .profile-shell { max-width: none; }
  body[data-public-page="true"] .app-header { display: flex; height: 56px; left: 0; position: absolute; right: 0; top: 0; z-index: 3; }
  body[data-public-page="true"] .app-brand { margin-left: 46px; }
  body[data-public-page="true"] .header-search { background: transparent; border-radius: 0; height: 48px; left: auto; position: absolute; right: 56px; top: 4px; transform: none; width: 48px; }
  body[data-public-page="true"] .header-search::before { color: var(--public-header-control-muted); left: 12px; top: 12px; }
  body[data-public-page="true"] .header-search { display: none; }
  body[data-public-page="true"] .compact-search-trigger { align-items: center; color: var(--public-header-control-text); display: inline-flex; height: var(--ui-space-48); justify-content: center; position: absolute; right: var(--ui-space-56); top: var(--ui-space-4); width: var(--ui-space-48); }
  body[data-public-page="true"] .compact-search-trigger:focus-visible { outline: var(--ui-space-2) solid currentColor; outline-offset: calc(-1 * var(--ui-space-4)); }
  body[data-public-page="true"] .public-header-tags { display: none; }
  body[data-public-page="true"] .public-navigation-links a.public-navigation-compact-link { display: flex; }
  body[data-public-page="true"] .public-header-language { display: none; }
  body[data-public-page="true"] .public-header-tools :is(.public-header-admin, .public-header-edit, .public-header-new-page) { display: none; }
  body[data-public-page="true"] .wiki-destinations .wiki-compact-action { display: flex; }
  body[data-public-page="true"] .mobile-navigation-panel { display: flex; flex-direction: column; }
  body[data-public-page="true"] .mobile-navigation-panel :is(.wiki-destinations, .wiki-utilities) { display: grid; flex-shrink: 0; gap: var(--ui-space-2); }
  body[data-public-page="true"] .mobile-navigation-panel .wiki-page-index > nav { display: block; }
  body[data-public-page="true"] .mobile-navigation-panel .wiki-tree summary { background: transparent; border: 0; border-radius: var(--ui-control-radius); color: var(--text-muted); display: list-item; font-weight: 400; list-style: disclosure-closed inside; padding: var(--ui-space-12); }
  body[data-public-page="true"] .mobile-navigation-panel .wiki-tree details[open] > summary { list-style-type: disclosure-open; }
  body[data-public-page="true"] .wiki-utilities .public-header-language { display: flex; }
  body[data-public-page="true"] .document-context-bar { gap: var(--ui-space-8); padding: var(--ui-space-8) var(--ui-space-20); }
  body[data-public-page="true"] .document-context-bar .breadcrumbs { font-size: var(--ui-text-12); }
  /* The admin and account shells clamp their brand; the public one did not, so it
     ran under the header controls instead of ending in an ellipsis. */
  body[data-public-page="true"] .app-brand { max-width: calc(100% - 160px); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  body[data-public-page="true"] .public-header-login { height: 48px; right: 8px; top: 4px; }
  body[data-public-page="true"] .shell-account-menu { position: absolute; right: var(--ui-space-8); top: var(--ui-space-4); }
  body[data-public-page="true"] .app-layout[data-sidebar="true"] { grid-template-columns: minmax(0, 1fr); min-height: calc(100vh - 32px); }
  body[data-public-page="true"] main#main-content { height: auto; min-height: calc(100vh - 32px); padding-top: 56px; }
  body[data-public-page="true"]:not(:has(article[data-testid="wiki-page"])) main#main-content {
    height: auto;
    min-height: calc(100vh - 32px);
    padding: 80px var(--ui-space-12) var(--ui-space-24);
  }
  body[data-public-page="true"] main#main-content > article[data-has-breadcrumbs="true"] { transform: none; }
  body[data-public-page="true"] .mobile-navigation { height: 40px; left: 8px; position: absolute; top: 8px; width: 40px; z-index: 42; }
  body[data-public-page="true"] .mobile-navigation > summary {
    align-items: center;
    background: var(--surface-muted);
    border: 0;
    border-radius: var(--ui-control-radius);
    bottom: 0;
    box-shadow: none;
    color: transparent;
    display: flex;
    font-size: 0;
    height: 40px;
    justify-content: center;
    left: 0;
    padding: 0;
    position: absolute;
    width: 40px;
    z-index: 42;
  }
  body[data-public-page="true"] .mobile-navigation > summary::before {
    background: var(--text);
    box-shadow: 0 -5px 0 var(--text), 0 5px 0 var(--text);
    content: "";
    height: 2px;
    width: 16px;
  }
  body[data-public-page="true"] .mobile-navigation[open] > summary { z-index: 42; }
  body[data-public-page="true"] .mobile-navigation[open] > summary::before { box-shadow: none; transform: rotate(45deg); }
  body[data-public-page="true"] .mobile-navigation[open] > summary::after { background: var(--text); content: ""; height: 2px; position: absolute; transform: rotate(-45deg); width: 16px; }
  /* The scrim was styled only for the reading skin, so in the admin and account
     shells it was an empty span of no area: the click-outside handler bound to
     it could never fire, and the drawer there had no dimmed ground either. */
  .mobile-navigation-scrim { display: none; }
  .mobile-navigation[open] > .mobile-navigation-scrim {
    background: var(--public-mobile-scrim);
    display: block;
    inset: 0;
    position: fixed;
    z-index: 40;
  }
  body[data-public-page="true"] .mobile-navigation[open] > .mobile-navigation-scrim {
    background: var(--public-mobile-scrim);
    display: block;
    inset: 0;
    opacity: .99;
    position: fixed;
    z-index: 40;
  }
  body[data-public-page="true"]:has(.mobile-navigation[open]) .app-header { background: var(--public-mobile-open-header); }
  body[data-public-page="true"] .mobile-navigation-panel {
    background: var(--public-sidebar-bg);
    border: 0;
    border-radius: 0;
    bottom: 0;
    box-shadow: var(--public-mobile-panel-shadow);
    color: var(--public-on-navigation);
    left: 0;
    max-height: none;
    overflow: auto;
    padding: var(--ui-space-56) var(--ui-space-8) var(--ui-space-16);
    right: auto;
    top: 0;
    width: min(20rem, calc(100vw - 3rem));
    z-index: 41;
  }
  body[data-public-page="true"] .mobile-navigation-panel::after {
    background: var(--public-mobile-panel-edge);
    bottom: 0;
    content: "";
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    width: 1px;
  }
  body[data-public-page="true"] .mobile-navigation-panel .public-navigation-links a { position: relative; }
  body[data-public-page="true"] .mobile-navigation-panel .public-navigation-links span {
    background: transparent;
    border: 0;
    display: block;
    height: 24px;
    position: absolute;
    transform: none;
    width: 24px;
  }
  body[data-public-page="true"] .mobile-navigation-panel .public-navigation-links { position: relative; }
  body[data-public-page="true"] .mobile-navigation-panel .public-navigation-links::after {
    background: var(--public-mobile-links-edge);
    content: "";
    height: 60px;
    position: absolute;
    right: -1px;
    top: 0;
    width: 1px;
  }
  body[data-public-page="true"] .mobile-navigation-panel .public-navigation-links a { align-items: center; border-radius: 0; color: var(--public-on-navigation); display: flex; font-weight: 400; height: 40px; padding: 0 var(--ui-space-20) 0 var(--ui-space-56); width: 100%; }
  body[data-public-page="true"] .mobile-navigation-panel .public-navigation-links span { left: 16px; top: 8px; }
  body[data-public-page="true"] .mobile-navigation-panel .public-navigation-links span::before {
    border: 0;
    color: var(--public-on-navigation);
    content: "\F02DC" / "";
    font: normal normal 400 var(--ui-text-24)/1 "Material Design Icons";
    height: 24px;
    left: 0;
    text-rendering: auto;
    top: 0;
    width: 24px;
  }
  body[data-public-page="true"] .mobile-navigation-panel .tree-node :is(a, span),
  body[data-public-page="true"] .mobile-navigation-panel .tree-node .tree-marker { color: var(--public-on-navigation); }
  body[data-public-page="true"] .mobile-navigation-panel .tree-node a[aria-current="page"] { background: var(--public-sidebar-toolbar-bg); color: var(--public-on-navigation); }
  body[data-public-page="true"] article[data-testid="wiki-page"] { min-height: calc(100vh - 88px); }
  body[data-public-page="true"] article[data-testid="wiki-page"] > .breadcrumbs { display: none; }
  body[data-public-page="true"] .page-heading .page-actions { display: flex; flex: 1 1 100%; justify-content: flex-start; margin-left: 0; }
  body[data-public-page="true"] .page-public-content-grid { display: block; margin: 0; min-height: 0; padding: 0; }
  body[data-public-page="true"] .page-rendered-content { min-height: 0; padding: var(--ui-space-24) var(--ui-space-20) var(--ui-space-56); }
  body[data-public-page="true"] .page-context-rail {
    height: auto;
    inset-inline: auto;
    margin: var(--ui-space-24) var(--ui-space-12) 0;
    position: static;
    top: auto;
    width: auto;
  }
  body[data-public-page="true"] .page-context-rail .page-toc { display: none; }
  .page-contents-compact { border-block: 1px solid var(--border); display: block; margin: 0 0 var(--ui-space-24); }
  .page-contents-compact > summary { cursor: pointer; min-height: var(--ui-action-min-height); padding-block: var(--ui-space-12); }
  .page-contents-compact a { display: inline-block; padding-block: var(--ui-space-6); }
  .page-provenance { margin-inline: 0; }
  body[data-public-page="true"] .public-comment-thread > header { padding-left: 0; }
  body[data-public-page="true"] .public-comment-thread > header :is(span, strong) { transform: translateY(-1px); }
  body[data-public-page="true"] .comment-thread { margin-left: 20px; margin-right: 20px; }
  body[data-public-page="true"] .app-footer { background: var(--public-footer-bg); border: 0; color: var(--public-footer-text); font: 400 var(--ui-text-12)/32px "Roboto", sans-serif; height: 32px; justify-content: center; margin-left: 0; padding: 0; position: static; }
  body[data-public-page="true"] .app-footer > span:first-child { letter-spacing: .4px; }
  body[data-public-page="true"] .app-footer-prefix { color: var(--public-footer-text); }
  body[data-public-page="true"] .app-footer-product { color: var(--public-footer-link); }
  body[data-public-page="true"] .app-footer > span + span { display: none; }
  .mobile-navigation-panel .sidebar-tree { margin-top: 14px; padding-top: 14px; }
  main { padding: var(--ui-space-32) var(--ui-space-16); }
  .welcome, .editor-shell, .auth-shell, article, .history-shell, .error-shell, .tags-shell, .tree-shell, .danger-shell, .trash-shell, .navigation-editor-shell, .source-shell, .permission-explanation-shell, .identity-admin-shell { padding: var(--ui-space-24); }
  .history-shell { min-width: 0; overflow: hidden; }
  body[data-public-page="true"] [data-testid="page-history"] .history-heading { align-items: stretch; flex-direction: column; }
  body[data-public-page="true"] [data-testid="page-history"] .history-heading .ui-action { align-self: stretch; width: 100%; }
  .markdown-workspace[data-preview-visible="true"] .editor-surfaces { grid-template-columns: 1fr; }
  .asciidoc-import-dialog { max-height: calc(100dvh - 24px); padding: var(--ui-space-18); width: calc(100% - 24px); }
  .asciidoc-import-dialog > header { align-items: stretch; display: grid; grid-template-columns: minmax(0, 1fr); }
  .asciidoc-import-dialog > header button { width: 100%; }
  .asciidoc-import-dialog h2 { font-size: var(--ui-text-24); overflow-wrap: anywhere; }
  .asciidoc-import-grid { grid-template-columns: minmax(0, 1fr); }
  .asciidoc-import-grid textarea { min-height: 180px; resize: none; }
  .asciidoc-import-dialog .dialog-actions { align-items: stretch; display: grid; grid-template-columns: minmax(0, 1fr); }
  .asciidoc-import-dialog .dialog-actions button { width: 100%; }
  .page-content-grid { grid-template-columns: 1fr; }
  .publication-window { grid-template-columns: 1fr; }
  .mfa-setup-grid { grid-template-columns: 1fr; }
  .mfa-qr-frame { max-width: 152px; }
	.tagged-pages { grid-template-columns: 1fr; }
  .permission-explanation-grid { grid-template-columns: 1fr; }
  .permission-rule-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .permission-rule-card > summary { grid-template-columns: auto minmax(0, 1fr) auto; }
  .permission-rule-card > summary > span:not(.permission-effect) { display: block; grid-column: 2; grid-row: 2; min-width: 0; overflow-wrap: anywhere; }
  .permission-result { position: static; }
  .group-detail-grid { grid-template-columns: 1fr; }
  .token-management-grid { grid-template-columns: 1fr; }
  .token-primary-fields { grid-template-columns: 1fr; }
  .session-metadata { grid-template-columns: 1fr; }
  .profile-grid, .profile-details-grid, .profile-parity-grid { grid-template-columns: 1fr; }
  .site-settings-grid, .settings-choice-grid, .localization-settings-grid, .localization-locale-list, .appearance-settings-grid, .authoring-settings-grid { grid-template-columns: 1fr; }
  .comment-settings-grid, .webhook-settings-grid, .webhook-endpoint-list { grid-template-columns: 1fr; }
  .audit-filter { grid-template-columns: 1fr; }
  .audit-event > header { align-items: stretch; flex-direction: column; }
  .audit-event dl { grid-template-columns: 1fr; }
  .settings-seo-panel { grid-column: auto; }
  .provider-definition-list { grid-template-columns: 1fr; }
  body[data-public-page="true"] [data-testid="media-browser"] { padding: 1.25rem .5rem 3.75rem; }
  .page-toc { border-left: 0; border-top: 1px solid var(--border); padding: var(--ui-space-18) 0 0; position: static; }
  :root { --ui-page-title-size: 2rem; }
  h1 { font-size: var(--ui-text-32); }
}
@media (min-width: 56.3125rem) and (max-width: 87.4375rem) {
  body[data-shell-variant="admin"] [data-testid="system-api-key-management"] .token-management-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="navigation-editor"] .navigation-editor-heading { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] [data-testid="navigation-editor"] .navigation-editor-actions { flex-wrap: wrap; }
  body[data-shell-variant="admin"] [data-testid="site-settings"] .site-settings-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="site-settings"] .settings-seo-panel { grid-column: auto; }
  body[data-shell-variant="admin"] [data-testid="site-settings"] .ui-page-heading { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] [data-testid="site-settings"] .ui-revision-stamp { align-items: flex-start; }
  body[data-shell-variant="admin"] [data-testid="security-settings"] .ui-settings-columns { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="security-settings"] .ui-page-heading { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] [data-testid="security-settings"] .ui-revision-stamp { align-items: flex-start; }
  body[data-shell-variant="admin"] [data-testid="storage-settings"] .ui-settings-columns { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="storage-settings"] .ui-page-heading { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-health-status { align-self: flex-start; }
  body[data-public-page="true"] .header-search { width: 100%; }
  /* Below 1120px the rail cannot sit beside the article. The sidebar takes 256px
     and the gutter the rail lives in takes 262 more, so at 901px the reading
     column is 359px of actual text - the same as a 360px phone, on a screen two
     and a half times as wide, with a 254px contents list beside it taking 39% of
     what is left. Above 1120 the column clears 578px and the rail earns its
     place. */
  body[data-public-page="true"] .header-search input { width: 100%; }
  body[data-public-page="true"] .public-header-tags { left: calc(50% + 164px); }
  body[data-public-page="true"] .page-rendered-content > .page-heading { align-content: center; flex-wrap: wrap; gap: var(--ui-space-8) var(--ui-space-18); }
  body[data-public-page="true"] .page-heading h1 { flex: 1 1 100%; }
  body[data-public-page="true"] .page-heading .page-actions { flex: 1 1 100%; flex-wrap: wrap; justify-content: flex-start; margin-left: 0; }
  body[data-public-page="true"] .create-redirect-form { grid-template-columns: minmax(0, 1fr); }
}
body[data-shell-variant="admin"] .app-layout[data-sidebar="true"] :is(.settings-navigation-disclosure, nav[aria-label="Identity administration"]) { display: none; }
@media (min-width: 56.3125rem) {
  body[data-shell-variant="admin"] [data-settings-state] .ui-panel:has(> header) { display: grid; grid-template-columns: minmax(10rem, 1fr) minmax(0, 3fr); column-gap: var(--ui-space-32); }
  body[data-shell-variant="admin"] [data-settings-state] .ui-panel:has(> header) > header { grid-column: 1; grid-row: 1; margin: 0; }
  body[data-shell-variant="admin"] [data-settings-state] .ui-panel:has(> header) > :not(header) { grid-column: 2; }
}
@media (min-width: 56.3125rem) and (max-width: 87.4375rem) {
  body[data-public-page="true"] .page-public-content-grid { display: block; padding: 0; }
  body[data-public-page="true"] .page-context-rail {
    height: auto;
    inset-inline: auto;
    margin: var(--ui-space-24) var(--ui-space-12) 0;
    position: static;
    top: auto;
    width: auto;
  }
  body[data-public-page="true"] .page-context-rail .page-toc { display: none; }
  .page-contents-compact { border-block: 1px solid var(--border); display: block; margin: var(--ui-space-16); }
  .page-contents-compact > summary { cursor: pointer; min-height: var(--ui-action-min-height); padding-block: var(--ui-space-12); }
  .page-contents-compact a { display: inline-block; padding-block: var(--ui-space-6); }
  .page-provenance { margin-inline: 0; }
}
@media (max-width: 37.5rem) {
  [data-testid="permission-decision"] .permission-trace > div { grid-template-columns: minmax(0, 1fr); gap: var(--ui-space-4); }
  body[data-shell-variant="admin"] .admin-section-tabs.settings-section-tabs { flex-wrap: nowrap; max-width: 100%; overflow-x: auto; }
  body[data-shell-variant="admin"] .settings-navigation-group { flex-shrink: 0; }
	body[data-shell-variant="admin"] [data-testid="system-api-key-management"] :is(.token-management-grid, .token-card dl div) { grid-template-columns: minmax(0, 1fr); }
	body[data-shell-variant="admin"] [data-testid="system-api-key-management"] :is(.token-card header, .token-create-panel fieldset) { align-items: stretch; }
	body[data-shell-variant="admin"] [data-testid="system-api-key-management"] .token-card header { flex-direction: column; }
	body[data-shell-variant="admin"] [data-testid="system-api-key-management"] :is(.token-create-panel button, .token-card .danger-action) { box-sizing: border-box; width: 100%; }
	body[data-shell-variant="admin"] [data-testid="navigation-editor"] .navigation-editor-actions { align-items: stretch; flex-direction: column; width: 100%; }
	body[data-shell-variant="admin"] [data-testid="navigation-editor"] .navigation-editor-actions :is(form, button) { box-sizing: border-box; width: 100%; }
	body[data-public-page="true"] .page-move-shell { padding: 1rem; }
	body[data-public-page="true"] .page-move-heading,
	body[data-public-page="true"] .page-move-actions { align-items: stretch; flex-direction: column; }
	body[data-public-page="true"] .page-move-actions :is(a, button) { width: 100%; }
	body[data-public-page="true"] .page-move-source { margin: 1rem 0; }
	body[data-public-page="true"] .page-move-fields { grid-template-columns: minmax(0, 1fr); }
	body[data-public-page="true"] .create-redirect-shell { padding: 1rem; }
	body[data-public-page="true"] .create-redirect-heading,
	body[data-public-page="true"] .create-redirect-form,
	body[data-public-page="true"] .create-redirect-fields { grid-template-columns: minmax(0, 1fr); }
	body[data-public-page="true"] .create-redirect-actions { align-items: stretch; flex-direction: column; }
	body[data-public-page="true"] .create-redirect-actions :is(a, button) { width: 100%; }
	body[data-public-page="true"] .page-delete-shell { padding: 1rem; }
	body[data-public-page="true"] .page-delete-source { margin: 1rem 0; }
	body[data-public-page="true"] .page-delete-form { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="site-settings"] .ui-form-footer button { width: 100%; }
  body[data-shell-variant="admin"] [data-testid="security-settings"] button[type="submit"] { width: 100%; }
  body[data-shell-variant="admin"] [data-testid="storage-settings"] button[type="submit"] { width: 100%; }
  body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-panel dl > div { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-settings-panel dd { text-align: left; }
}
@media (max-width: 37.5rem) {
  body[data-shell-variant="account"] [data-testid="account-security"] .recovery-code-panel ul { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="account"] [data-testid="api-token-management"] :is(.token-management-grid, .token-primary-fields, .token-scope-list) { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="account"] [data-testid="api-token-management"] .token-scope-list { max-height: none; overflow-y: visible; }
  body[data-shell-variant="account"] [data-testid="api-token-management"] .token-secret-value { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="account"] [data-testid="api-token-management"] .token-card header { flex-wrap: wrap; }
  body[data-shell-variant="account"] [data-testid="api-token-management"] .token-card dl div { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="account"] [data-testid="external-connections"] .connection-provider-card > header { flex-wrap: wrap; }
  body[data-shell-variant="account"] [data-testid="external-connections"] .connection-form button { width: 100%; }
  body[data-public-page="true"] .public-comment-thread { margin-top: 46px; }
}

@media (max-width: 56.25rem) {
  body[data-shell-variant="admin"] [data-testid="navigation-editor"] .navigation-editor-heading { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] [data-testid="navigation-editor"] .navigation-editor-actions { flex-wrap: wrap; }
  body[data-public-page="true"] .page-actions-mobile {
    display: block;
    flex: 0 0 auto;
    position: relative;
  }
  body[data-public-page="true"] .page-actions-mobile > summary {
    align-items: center;
    background: var(--surface);
    border: 1px solid var(--border-strong);
    border-radius: var(--ui-control-radius);
    color: var(--text);
    cursor: pointer;
    display: flex;
    height: 48px;
    justify-content: center;
    list-style: none;
    margin-left: auto;
    width: 48px;
  }
  body[data-public-page="true"] .page-actions-mobile > summary:focus-visible {
    outline: 2px solid var(--public-heading-rule);
    outline-offset: 3px;
  }
  body[data-public-page="true"] .page-actions-mobile > summary::-webkit-details-marker { display: none; }
  body[data-public-page="true"] .page-actions-mobile-icon { fill: currentColor; height: 24px; width: 24px; }
  body[data-public-page="true"] .page-actions-mobile > nav {
    background: var(--public-surface);
    border: 1px solid var(--public-border);
    border-radius: var(--ui-panel-radius);
    display: grid;
    inset-inline-start: auto;
    inset-inline-end: 0;
    margin-top: var(--ui-space-8);
    max-height: 60dvh;
    max-width: calc(100vw - 40px);
    overflow: auto;
    position: absolute;
    width: 12rem;
  }
  body[data-public-page="true"] .page-actions-mobile a { color: var(--text); padding: var(--ui-space-12); text-decoration: none; }
  .page-actions-mobile a:hover { background: var(--public-band); }
  /* Hover and focus were one rule that suppressed the outline, so the only
     focus signal on every page action a phone has was #fff -> #f5f5f5, 1.09:1.
     The ring is the same token the trigger above already uses; it is inset
     because the menu clips its own overflow. */
  body[data-public-page="true"] .page-actions-mobile a:focus-visible {
    background: var(--public-band);
    outline: 2px solid var(--public-heading-rule);
    outline-offset: -2px;
  }
  body[data-public-page="true"] .page-actions-mobile .danger-link { color: var(--danger); }
  body[data-public-page="true"] .page-rendered-content > .page-heading { flex-wrap: wrap; gap: var(--ui-space-8) var(--ui-space-12); }
}

@media (min-width: 37.5625rem) and (max-width: 56.25rem) {
  body[data-public-page="true"] article[data-testid="wiki-page"] > .breadcrumbs {
    display: flex;
    height: auto;
    margin: 0;
    min-height: 48px;
    padding: 0 var(--ui-space-16);
    width: 100%;
  }
  body[data-public-page="true"] article[data-testid="wiki-page"] > .breadcrumbs ol { align-items: center; }
  body[data-public-page="true"] article[data-testid="wiki-page"] > .breadcrumbs li { flex: 0 0 auto; max-width: calc(100vw - 32px); }
  body[data-public-page="true"] article[data-testid="wiki-page"] > .breadcrumbs li :is(a, span[aria-current]) {
    height: auto;
    max-width: calc(100vw - 64px);
    min-height: 28px;
    overflow-wrap: anywhere;
    white-space: normal;
  }
}

@media (max-width: 37.5rem) {
  body[data-shell-variant="account"] [data-testid="account-security"] :is(.mfa-setup-panel, .recovery-code-panel) { padding: var(--ui-space-18); }
  .app-header { padding-inline: 16px; }
  .app-header-actions { gap: var(--ui-space-10); }
  .app-header nav { gap: var(--ui-space-8); }
  .header-search { display: flex; width: min(44vw, 190px); }
  body:not([data-shell-variant="admin"]):not([data-shell-variant="account"]):not([data-public-page="true"]) .app-header {
    gap: var(--ui-space-6);
    padding-inline: 12px;
  }
  body:not([data-shell-variant="admin"]):not([data-shell-variant="account"]):not([data-public-page="true"]) .app-brand {
    flex: 0 1 auto;
    font-size: var(--ui-text-16);
    max-width: 5.75rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  body:not([data-shell-variant="admin"]):not([data-shell-variant="account"]):not([data-public-page="true"]) .header-search {
    flex: 0 0 2.5rem;
    height: 2.5rem;
    left: auto;
    margin-left: auto;
    position: relative;
    transform: none;
    width: 2.5rem;
  }
  body:not([data-shell-variant="admin"]):not([data-shell-variant="account"]):not([data-public-page="true"]) .header-search::before {
    color: var(--search-overlay-chrome-muted);
    content: "\F0349" / "";
    font: normal normal 400 var(--ui-text-22)/1 "Material Design Icons";
    inset: 9px;
    pointer-events: none;
    position: absolute;
  }
  body:not([data-shell-variant="admin"]):not([data-shell-variant="account"]):not([data-public-page="true"]) .header-search input {
    cursor: pointer;
    height: 2.5rem;
    opacity: 0;
    padding: 0;
    width: 2.5rem;
  }
  body:not([data-shell-variant="admin"]):not([data-shell-variant="account"]):not([data-public-page="true"]) .app-header-actions {
    flex: 0 0 auto;
    gap: var(--ui-space-4);
  }
  body:not([data-shell-variant="admin"]):not([data-shell-variant="account"]):not([data-public-page="true"]) .mobile-navigation summary {
    align-items: center;
    display: flex;
    font-size: 0;
    height: 2.5rem;
    justify-content: center;
    padding: 0;
    width: 2.5rem;
  }
  body:not([data-shell-variant="admin"]):not([data-shell-variant="account"]):not([data-public-page="true"]) .mobile-navigation summary::before {
    content: "\F035C" / "";
    font: normal normal 400 var(--ui-text-22)/1 "Material Design Icons";
  }
  body:not([data-shell-variant="admin"]):not([data-shell-variant="account"]):not([data-public-page="true"]) .app-header-actions nav form button {
    align-items: center;
    display: flex;
    font-size: 0;
    height: 2.5rem;
    justify-content: center;
    padding: 0;
    width: 2.5rem;
  }
  body:not([data-shell-variant="admin"]):not([data-shell-variant="account"]):not([data-public-page="true"]) .app-header-actions nav form button::before {
    content: "EXIT";
    font: 500 var(--ui-text-10)/1 "Roboto", sans-serif;
    letter-spacing: .08em;
  }
  .page-actions { flex-wrap: wrap; gap: var(--ui-space-8) var(--ui-space-16); }
  .editor-heading { align-items: stretch; flex-direction: column; }
  .editor-heading-actions { flex-wrap: wrap; justify-content: flex-start; }
  .markdown-workspace:not([data-existing-editor="true"]) .editor-command-group {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(36px, 1fr));
    width: 100%;
  }
  .markdown-workspace:not([data-existing-editor="true"]) .editor-command { min-width: 0; width: 100%; }
  main { padding-inline: 10px; }
  .welcome, .editor-shell, .auth-shell, article, .history-shell, .error-shell, .tags-shell, .tree-shell, .danger-shell, .trash-shell, .navigation-editor-shell, .source-shell, .permission-explanation-shell, .identity-admin-shell { padding: var(--ui-space-20); }
  .permission-field-pair { grid-template-columns: 1fr; }
  .permission-rule-fields { grid-template-columns: 1fr; }
  .permission-selector-fields { grid-template-columns: minmax(0, 1fr); }
  .identity-form-grid { grid-template-columns: 1fr; }
  .identity-user-card header { flex-direction: column; }
  .identity-user-card header > div { min-width: 0; }
  .identity-user-card header p { overflow-wrap: anywhere; }
  .identity-user-card .identity-badges { justify-content: flex-start; }
  .identity-user-card header .secondary-action { align-self: flex-start; }
  .profile-choice-grid { grid-template-columns: 1fr; }
  .identity-toggle-row { align-items: flex-start; flex-direction: column; gap: var(--ui-space-4); }
  .identity-toggle-row .secondary-action { margin: var(--ui-space-12) 0 0; }
  body[data-shell-variant="admin"] :is([data-testid="user-administration"], [data-testid="group-administration"], [data-testid="group-detail-administration"]) .identity-readonly-facts { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] :is([data-testid="group-administration"], [data-testid="group-detail-administration"]) :is(.identity-group-card, .group-member-list li, .member-add-form > div) { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] :is([data-testid="group-administration"], [data-testid="group-detail-administration"]) :is(.identity-group-card > span, .group-member-list form, .group-member-list button, .member-add-form button, .group-danger-disclosure .danger-action) { box-sizing: border-box; width: 100%; }
  .provider-readiness { grid-template-columns: 1fr; }
  body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-statistics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-statistics > div { border: 0; padding: var(--ui-space-12); }
  body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-statistics > div:nth-child(even) { border-left: 1px solid var(--storage-settings-boundary); }
  body[data-shell-variant="admin"] [data-testid="storage-settings"] .storage-statistics > div:nth-child(n+3) { border-top: 1px solid var(--storage-settings-boundary); }
  .ui-section-nav { justify-content: flex-start; }
  .provider-readiness > div + div { border-left: 0; border-top: 1px solid var(--border); }
  .ui-page-heading, .ui-form-footer { align-items: stretch; flex-direction: column; }
  .ui-revision-stamp { align-items: flex-start; }
  .comment-card { padding: var(--ui-space-14); }
  .comment-body, .comment-hidden { margin-left: 0; }
  .comment-composer { padding: var(--ui-space-14); }
  .comment-guest-fields { grid-template-columns: 1fr; }
  .comment-composer > .comment-composer-actions { align-items: stretch; flex-direction: column; }
  .comment-composer button { width: 100%; }
}

@media (max-width: 56.25rem) {
  body[data-shell-variant="auth"] main#main-content { padding: var(--ui-space-48) var(--ui-space-24); }
  .registration-stage { padding: var(--ui-space-48) var(--ui-space-24); }
}

@media (max-width: 37.5rem) {
  .login-stage { padding: 3rem 1.5rem; }
}

@media (max-width: 87.4375rem) {
  body[data-editor-layout="true"] {
    --editor-header-actions-width: 304px;
    --editor-rail-size: 40px;
    --editor-side-rail-size: 48px;
    --editor-source-leading-size: 48px;
  }
  body[data-editor-layout="true"] .app-header .app-brand { display: none; }
  body[data-editor-layout="true"] .editor-heading { gap: var(--ui-space-8); left: 0; padding-inline: var(--ui-space-8); }
  body[data-editor-layout="true"] .editor-heading h1 {
    left: 0;
    max-width: none;
    transform: none;
  }
  body[data-editor-layout="true"] .editor-save-action,
  body[data-editor-layout="true"] .editor-page-settings > summary,
  body[data-editor-layout="true"] .editor-close-action { width: 64px; }
  body[data-editor-layout="true"] .editor-save-action > span:last-child { display: inline; }
  body[data-editor-layout="true"] .editor-page-settings > summary > span:last-child { display: none; }
  body[data-editor-layout="true"] .editor-close-action { font-size: 0; margin: 0; }
  body[data-editor-layout="true"] .editor-page-settings-panel {
    left: 16px;
    max-height: calc(100vh - var(--editor-header-size) - 16px);
    position: fixed;
    right: 16px;
    top: var(--editor-header-size);
    width: auto;
  }
  body[data-editor-layout="true"] .editor-page-properties-dialog {
    height: min(648px, calc(100vh - var(--editor-header-size) - 16px));
    inset: calc(var(--editor-header-size) + 8px) 16px auto;
    max-height: none;
    max-width: none;
    width: auto;
  }
  body[data-editor-layout="true"] .editor-page-properties-tabs {
    justify-content: flex-start;
    overflow-x: auto;
    overflow-y: hidden;
  }
  body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-surfaces {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }
  body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-surfaces > [data-markdown-editor] {
    padding-left: var(--editor-source-leading-size);
  }
  body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview {
    border-left: 0;
    border-top: 1px solid var(--editor-preview-boundary);
    overflow: hidden;
    padding: var(--ui-space-18) var(--ui-space-20) var(--ui-space-18) calc(var(--editor-side-rail-size) + 20px);
  }
  body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .preview-state-banner {
    left: calc(var(--editor-side-rail-size) + 20px);
    right: 20px;
  }
  body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview:has(.preview-state-banner[data-preview-state="error"]:not([hidden])) .markdown-preview-viewport { padding-top: 116px; }
  body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview-viewport {
    height: 100%;
    overflow: auto;
    width: 100%;
  }
  body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .markdown-preview-body { padding: 0; }
  body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-statusbar {
    display: grid;
    grid-template-columns: var(--editor-rail-size) minmax(0, 1fr) auto;
  }
  body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] :is(.editor-status-path, .editor-status-position) { margin-left: 0; }
  body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-status-format { display: none; }
}

@media (max-width: 37.5rem) {
  body[data-editor-layout="true"] .editor-heading h1 {
    flex: 1 1 auto;
    font-size: var(--ui-text-14);
    margin: 0;
    overflow: hidden;
    padding: 0;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  body[data-editor-layout="true"] .editor-header-icon-action { display: none; }
  body[data-editor-layout="true"] .editor-heading-actions { gap: var(--ui-space-4); }
  body[data-editor-layout="true"] .editor-close-action { width: 32px; }
  body[data-editor-layout="true"] .editor-page-settings > summary { width: 40px; }
  body[data-editor-layout="true"] .editor-selection-title { display: none; }
  body[data-editor-layout="true"] .editor-selection-stage {
    align-items: flex-start;
    bottom: 0;
    inset-inline: 0;
    padding: var(--ui-space-16) var(--ui-space-24) var(--ui-space-32);
    top: var(--editor-header-size);
  }
  body[data-editor-layout="true"] .editor-selection-panel { padding-inline: 20px; }
  body[data-editor-layout="true"] .editor-selection-panel > header { align-items: flex-start; flex-direction: column; }
  body[data-editor-layout="true"] .editor-selection-grid { grid-auto-rows: minmax(104px, auto); grid-template-columns: minmax(0, 1fr); }
  body[data-editor-layout="true"] .editor-selection-card,
  body[data-editor-layout="true"] .editor-selection-card:is([data-editor-kind="markdown"], [data-editor-kind="visual"]) { grid-column: span 1; min-height: 104px; }
  body[data-editor-layout="true"] .editor-page-properties-dialog { inset-inline: 8px; }
  body[data-editor-layout="true"] .editor-page-properties-heading { padding-inline: 12px; }
  body[data-editor-layout="true"] .editor-page-properties-heading h2 { margin-left: 8px; }
  body[data-editor-layout="true"] .editor-page-properties-tabs button { min-width: 82px; padding-inline: 10px; }
}

@media (max-width: 56.25rem) {
  body[data-editor-layout="true"]:has([data-existing-editor="true"]) { --editor-toolbar-size: 144px; }
  body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] > .editor-toolbar { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); grid-auto-rows: 48px; overflow: visible; padding: 0; }
  body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] :is(.editor-command-group, .editor-toolbar-actions) { display: contents; }
  body[data-editor-layout="true"] .markdown-workspace[data-existing-editor="true"] .editor-toolbar :is(.editor-command, .secondary-action) { height: 48px; min-width: 0; width: 100%; }
  body[data-editor-layout="true"]:has([data-compact-editor="true"]) { --editor-toolbar-size: 48px; }
  body[data-editor-layout="true"] .markdown-workspace[data-compact-editor="true"] > .editor-toolbar { display: flex; gap: 0; padding-inline: var(--ui-space-8); }
  body[data-editor-layout="true"] .markdown-workspace[data-compact-editor="true"] .editor-toolbar .editor-command { flex: 0 0 44px; min-width: 44px; width: 44px; }
  body[data-editor-layout="true"] .editor-more-action { background: transparent; border: 0; color: var(--text); flex: 1; font-size: var(--ui-text-14); height: 44px; margin: 0; min-width: 60px; padding: var(--ui-space-8); }
  body[data-editor-layout="true"] .editor-modebar .editor-view-switch { align-items: center; background: transparent; border: 0; color: var(--accent-readable); display: flex; margin: 0 0 0 auto; min-height: 32px; padding: 0 var(--ui-space-8); }
  .editor-view-switch .editor-toolbar-icon { display: none; }
  .editor-view-switch .editor-view-switch-label { display: inline; }
  body[data-editor-layout="true"] .markdown-workspace[data-compact-editor="true"] .editor-surfaces { display: block; }
  body[data-editor-layout="true"] .markdown-workspace[data-compact-editor="true"] .editor-surfaces > [data-markdown-editor] { height: 100%; padding-left: 0; }
  body[data-editor-layout="true"] .markdown-workspace[data-compact-editor="true"][data-preview-visible="true"] .editor-surfaces > [data-markdown-editor] { display: none; }
  body[data-editor-layout="true"] .markdown-workspace[data-compact-editor="true"] .markdown-preview { border: 0; height: 100%; padding: var(--ui-space-20); }
  body[data-editor-layout="true"] .markdown-workspace[data-compact-editor="true"] .visual-markdown-surface { height: 100%; min-height: 0; }
  body:is([data-shell-variant="admin"], [data-shell-variant="account"]) main#main-content > :is(.identity-admin-shell, .permission-explanation-shell) { padding: 0; }
  .user-directory-controls { grid-template-columns: minmax(0, 1fr); }
  .user-directory-controls > div:first-child { grid-column: 1 / -1; }
}

@media (min-width: 56.3125rem) and (max-width: 87.4375rem) {
  body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-definition-list { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 56.25rem) {
  body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-configured-card { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-runtime-status { justify-self: start; }
  body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-section-heading { align-items: flex-start; flex-direction: column; }
  body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .registration-policy-state { justify-content: flex-start; }
}

@media (max-width: 37.5rem) {
  body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] :is(.provider-actions, .provider-actions form, .provider-actions button) { width: 100%; }
  body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-actions { align-items: stretch; display: grid; grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .provider-configure-form button[type="submit"] { width: 100%; }
  body[data-shell-variant="admin"] [data-testid="auth-provider-registry"] .registration-policy { padding: var(--ui-space-18); }
}

@media (min-width: 56.3125rem) and (max-width: 87.4375rem) {
  body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-explanation-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-rule-fields { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 56.25rem) {
  body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-explanation-heading { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-heading-actions { flex-wrap: wrap; justify-content: flex-start; }
  body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-rule-card > summary > span:not(.permission-effect) { display: block; grid-column: 2; grid-row: 2; min-width: 0; overflow-wrap: anywhere; }
  body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-rule-card > summary > small:last-child { grid-column: 3; grid-row: 1; }
}

@media (max-width: 37.5rem) {
  body[data-shell-variant="admin"] [data-testid="permission-explanation"] :is(.permission-rule-actions, .permission-rule-actions button, .permission-rule-delete button, .permission-explanation-grid > form > button) { width: 100%; }
  body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-rule-actions { align-items: stretch; display: grid; grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-rule-readonly > div { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="permission-explanation"] .permission-result { padding: var(--ui-space-18); }
}

@media (min-width: 56.3125rem) and (max-width: 87.4375rem) {
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-summary-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .ui-page-heading { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .audit-heading-actions { justify-content: flex-start; }
}

@media (max-width: 56.25rem) {
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-summary-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-table-wrap { display: none; }
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-topic-cards { display: grid; gap: var(--ui-space-14); list-style: none; margin: 0; padding: 0; }
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-section > header { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-failures li { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-failures li > div:last-child { text-align: left; }
}

@media (max-width: 37.5rem) {
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .audit-heading-actions { align-items: stretch; display: grid; grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="system-jobs"] :is(.audit-heading-actions a, .jobs-maintenance-status, .job-failures form, .job-failures button) { justify-content: center; text-align: center; width: 100%; }
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .job-summary-card { padding: var(--ui-space-18); }
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-topic-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-shell-variant="admin"] [data-testid="system-jobs"] .jobs-topic-oldest { grid-column: 1 / -1; }
}

body[data-shell-variant="admin"] [data-testid="user-detail-administration"] {
  --user-detail-surface: var(--surface);
  --user-detail-surface-muted: var(--surface-muted);
  --user-detail-boundary: var(--text-muted);
  --user-detail-error-surface: var(--ui-error-bg);
  --user-detail-error-text: var(--danger);
  --user-detail-error-boundary: var(--danger);
  --user-detail-danger-surface: var(--ui-error-bg);
  --user-detail-danger-action-bg: var(--danger);
  --user-detail-danger-action-text: var(--danger-action-text);
  --user-detail-focus: var(--accent-readable);
  min-width: 0;
}

body[data-shell-variant="admin"] [data-testid="user-detail-administration"] :is(.user-detail-heading, .user-detail-heading > div, .user-detail-column, .user-detail-card, .user-detail-form, .user-detail-group-list li > div) { min-width: 0; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] :is(h1, h2, p, dd, li, strong, label, option, summary, .field-hint, .ui-note) { overflow-wrap: anywhere; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-heading > div { max-width: 100%; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-heading h1 { line-height: 1.12; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-layout { align-items: start; display: grid; gap: var(--ui-space-24); grid-template-columns: repeat(2, minmax(0, 1fr)); }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-column { display: grid; gap: var(--ui-space-20); }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-card { background: var(--user-detail-surface); border: 1px solid var(--user-detail-boundary); border-radius: 8px; color: var(--text); display: grid; gap: var(--ui-space-14); padding: var(--ui-space-24); }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-card > h2 { color: var(--text); font-size: var(--ui-text-18); line-height: 1.25; margin: 0; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] :is(.user-detail-form, .user-detail-inline-form, .user-detail-action-form, .user-detail-danger-disclosure form) { display: grid; gap: var(--ui-space-10); min-width: 0; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] :is(input, select) { background: var(--surface); border-color: var(--user-detail-boundary); color: var(--text); max-width: 100%; min-width: 0; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] :is(a, button, input, select, summary):focus-visible { outline: 3px solid var(--user-detail-focus); outline-offset: 2px; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-feedback { border: 1px solid var(--user-detail-error-boundary); border-radius: 6px; margin: 0 0 var(--ui-space-20); max-width: 760px; padding: var(--ui-space-12) var(--ui-space-14); }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-feedback-error { background: var(--user-detail-error-surface); color: var(--user-detail-error-text); }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-facts { display: grid; gap: 0; margin: 0; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-facts > div { border-bottom: 1px solid var(--user-detail-boundary); display: grid; gap: var(--ui-space-8); grid-template-columns: minmax(110px, 0.45fr) minmax(0, 1fr); padding: var(--ui-space-10) 0; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-facts > div:last-child { border-bottom: 0; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-facts :is(dt, dd) { margin: 0; min-width: 0; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-facts dt { color: var(--text-muted); font-weight: 600; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] :is(.user-detail-capability-note, .user-detail-empty, .user-detail-count) { color: var(--text-muted); margin: 0; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-inline-form { grid-template-columns: minmax(0, 1fr) auto; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-inline-form label { grid-column: 1 / -1; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-group-list { display: grid; gap: var(--ui-space-10); list-style: none; margin: 0; padding: 0; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-group-list li { align-items: center; background: var(--user-detail-surface-muted); border: 1px solid var(--user-detail-boundary); border-radius: 6px; display: grid; gap: var(--ui-space-12); grid-template-columns: minmax(0, 1fr) auto; padding: var(--ui-space-12); }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-group-list li span { color: var(--text-muted); display: block; font-size: var(--ui-text-13); }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-group-list .secondary-action { border: 1px solid var(--user-detail-boundary); }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-provider-list { margin: 0; padding-left: 20px; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-danger-card { background: var(--user-detail-danger-surface); border-color: var(--user-detail-error-boundary); }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .danger-action { background: var(--user-detail-danger-action-bg); border-color: var(--user-detail-danger-action-bg); color: var(--user-detail-danger-action-text); }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-danger-disclosure { border: 1px solid var(--user-detail-error-boundary); border-radius: 6px; padding: var(--ui-space-12); }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-danger-disclosure > summary { cursor: pointer; font-weight: 700; }
body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-danger-disclosure[open] > summary { margin-bottom: 12px; }

@media (min-width: 56.3125rem) and (max-width: 87.4375rem) {
  body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-layout { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 56.25rem) {
  body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-layout { grid-template-columns: minmax(0, 1fr); }
  body[data-public-page="true"] .trash-heading { grid-template-columns: minmax(0, 1fr); }
  body[data-public-page="true"] .trash-count { justify-self: start; }
  body[data-public-page="true"] [data-testid="source-page"] .source-heading { align-items: stretch; flex-direction: column; }
  body[data-public-page="true"] [data-testid="source-page"] .page-actions { width: 100%; }
}

@media (max-width: 37.5rem) {
  body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-heading { align-items: stretch; flex-direction: column; }
  body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-heading > a { text-align: center; width: 100%; }
  body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-card { padding: var(--ui-space-18); }
  body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-facts > div { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-inline-form { grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="user-detail-administration"] :is(.user-detail-form button, .user-detail-inline-form button, .user-detail-action-form button, .user-detail-danger-disclosure button) { width: 100%; }
  body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-group-list li { align-items: stretch; grid-template-columns: minmax(0, 1fr); }
  body[data-shell-variant="admin"] [data-testid="user-detail-administration"] .user-detail-group-list form button { width: 100%; }
  body[data-public-page="true"] .trash-heading,
  body[data-public-page="true"] .trash-item-heading { display: grid; grid-template-columns: minmax(0, 1fr); }
  body[data-public-page="true"] .trash-restore-status { justify-self: start; white-space: normal; }
  body[data-public-page="true"] .trash-item-metadata { grid-template-columns: minmax(0, 1fr); }
  body[data-public-page="true"] .trash-item-actions,
  body[data-public-page="true"] .trash-item-actions form,
  body[data-public-page="true"] .trash-item-actions button { width: 100%; }
  body[data-public-page="true"] [data-testid="source-page"] .page-actions { align-items: stretch; display: grid; grid-template-columns: minmax(0, 1fr); }
  body[data-public-page="true"] [data-testid="source-page"] .page-actions a { box-sizing: border-box; text-align: center; width: 100%; }
  .print-page { padding: var(--ui-space-32) var(--ui-space-20); }
}

@media print {
  @page { margin: 0; }
  /* This block applies to every page, not only the dedicated print route, and
     it used to reset html alone. body kept color: var(--text), so printing any
     ordinary page while the dark theme was active put #e0e0e0 on white paper -
     1.32:1 across the whole document. */
  html { background: var(--print-canvas); }
  body { background: var(--print-canvas); color: var(--print-text); color-scheme: light; }
  .print-document { font-size: 11pt; min-height: 100vh; }
  .print-page { margin: 0; max-width: none; padding: 18mm; }
  .print-page a { color: inherit; text-decoration: underline; }
  .print-content { overflow: visible; }
  .print-page pre, .print-page table, .print-page blockquote { break-inside: avoid; }
  .print-page .mermaid-diagram iframe { display: none; }
  .print-page .mermaid-source > :not(summary) { display: block; }
  .print-heading { margin-bottom: 20px; }
}