/* BeautyPortal shared visual foundation.
   This file is intentionally loaded last while legacy styles are migrated.
   Page-local CSS may arrange domain content, but shared typography, controls,
   surfaces, tables, badges, and actions belong here. */

:root {
    color-scheme: light;

    /* One clear, native UI family with no page- or module-specific typefaces. */
    --bp-font-ui: "Segoe UI Variable Text", "Aptos", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --bp-font-system: var(--bp-font-ui);
    --bp-font-heading: var(--bp-font-ui);
    --bp-font-display: var(--bp-font-ui);
    --font-sans: var(--bp-font-ui);
    --font-heading: var(--bp-font-ui);
    --font-serif: var(--bp-font-ui);
    --font-mono: var(--bp-font-ui);

    /* Brand and semantic foundations. */
    --bp-primary: #003faa;
    --bp-primary-deep: #002f82;
    --bp-primary-soft: #edf4ff;
    --bp-accent: #409dc1;
    --bp-accent-soft: #eaf6fb;
    --bp-background: #f5f8fc;
    --bp-surface: #ffffff;
    --bp-surface-soft: #f7fafd;
    --bp-border: #d7e2ee;
    --bp-border-strong: #b9c9d9;
    --bp-text: #10233f;
    --bp-muted: #52657a;
    --bp-subtle: #6b7c8f;
    --bp-success: #16855b;
    --bp-warning: #e78a16;
    --bp-error: #c43d4d;

    /* Compatibility aliases for legacy selectors during migration. */
    --bp-ink: var(--bp-text);
    --bp-text-secondary: var(--bp-muted);
    --bp-surface-subtle: var(--bp-surface-soft);
    --bp-line: var(--bp-border);
    --bp-wine-600: var(--bp-primary);
    --bp-wine-500: var(--bp-primary);
    --bp-plum-900: var(--bp-primary-deep);
    --bp-plum-800: var(--bp-text);
    --bp-plum-700: var(--bp-primary-deep);
    --bp-gold: var(--bp-accent);
    --bp-teal: var(--bp-accent);
    --bp-teal-bright: var(--bp-accent);
    --bp-teal-soft: var(--bp-accent-soft);
    --bp-section-accent: var(--bp-accent);
    --module-accent: var(--bp-primary);
    --module-accent-dark: var(--bp-primary-deep);
    --module-accent-rgb: 0, 63, 170;
    --module-soft: var(--bp-accent-soft);

    /* Four-pixel spacing grid. */
    --bp-space-1: 0.25rem;
    --bp-space-2: 0.5rem;
    --bp-space-3: 0.75rem;
    --bp-space-4: 1rem;
    --bp-space-6: 1.5rem;
    --bp-space-8: 2rem;
    --bp-space-12: 3rem;

    --bp-radius-control: 6px;
    --bp-radius-surface: 10px;
    --bp-radius-overlay: 12px;
    --bp-radius-pill: 999px;
    --bp-control-height: 48px;
    --bp-button-height: var(--bp-control-height);
    --bp-shadow-overlay: 0 18px 48px rgba(16, 35, 63, 0.18);
    --bp-focus-ring: 0 0 0 3px rgba(64, 157, 193, 0.28);

    --bs-primary: var(--bp-primary);
    --bs-primary-rgb: 0, 63, 170;
    --bs-body-color: var(--bp-text);
    --bs-body-bg: var(--bp-background);
    --bs-border-color: var(--bp-border);
    --bs-font-sans-serif: var(--bp-font-ui);
    --bs-border-radius: var(--bp-radius-control);
    --bs-border-radius-lg: var(--bp-radius-surface);
}

html,
body {
    background: var(--bp-background);
    color: var(--bp-text);
    font-family: var(--bp-font-ui);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

/* The application shell previously reintroduced a smaller inherited size. */
.bp-shell {
    background: var(--bp-background);
    font-size: 1rem;
}

body :where(button, input, select, textarea) {
    font-family: var(--bp-font-ui);
}

body :is(h1, h2, h3, h4, h5, h6, .bn-text) {
    font-family: var(--bp-font-ui) !important;
    font-synthesis: none;
}

body :where(h1, h2, h3, h4, h5, h6) {
    color: var(--bp-text);
    letter-spacing: 0;
}

body h1 { font-size: 2.125rem; font-weight: 700; line-height: 1.235; }
body h2 { font-size: 1.375rem; font-weight: 700; line-height: 1.36; }
body h3 { font-size: 1.125rem; font-weight: 600; line-height: 1.45; }
body h4,
body h5,
body h6 { font-size: 1.125rem; font-weight: 600; line-height: 1.45; }

body strong,
body b { font-weight: 700; }

body a {
    color: var(--bp-primary);
    text-underline-offset: 0.16em;
}

body a:hover { color: var(--bp-primary-deep); }

body .bn-text-h1 { font-size: 1.75rem !important; font-weight: 700 !important; line-height: 1.235 !important; }
body .bn-text-h2 { font-size: 1.375rem !important; font-weight: 700 !important; line-height: 1.36 !important; }
body .bn-text-h3 { font-size: 1.125rem !important; font-weight: 600 !important; line-height: 1.45 !important; }
body .bn-text-h4,
body .bn-text-h5,
body .bn-text-h6 { font-size: 1.125rem !important; font-weight: 600 !important; line-height: 1.45 !important; }
body .bn-text-subtitle1 { font-size: 1.125rem !important; font-weight: 600 !important; line-height: 1.45 !important; }
body .bn-text-subtitle2 { font-size: 1rem !important; font-weight: 600 !important; line-height: 1.5 !important; }
body .bn-text-body1 { font-size: 1rem !important; font-weight: 400 !important; line-height: 1.6 !important; }
body .bn-text-body2 { font-size: 0.9375rem !important; font-weight: 400 !important; line-height: 1.6 !important; }
body .bn-text-caption { font-size: 0.875rem !important; font-weight: 400 !important; line-height: 1.45 !important; }
body .bn-text-overline {
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    line-height: 1.45 !important;
    text-transform: none !important;
}

/* Page hierarchy ---------------------------------------------------- */
.bp-page-header,
.bp-shared-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--bp-space-4) var(--bp-space-6);
    min-height: 0;
    margin: 0 0 var(--bp-space-4) !important;
    padding: 0 0 12px !important;
    overflow: visible;
    border: 0 !important;
    border-bottom: 1px solid var(--bp-border) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.bp-page-header--highlighted {
    padding: 0 0 12px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--bp-border) !important;
    border-radius: 0 !important;
    background: transparent !important;
}

.bp-page-header-copy { min-width: 0; }

.bp-page-title {
    margin: 0;
    color: var(--bp-text) !important;
    font-family: var(--bp-font-ui) !important;
    font-size: 1.75rem !important;
    font-weight: 700 !important;
    letter-spacing: -0.015em !important;
    line-height: 1.235 !important;
    overflow-wrap: anywhere;
    text-shadow: none !important;
}

/* A shared row height keeps the title, controls and following content aligned. */
.bp-shared-page-header.bp-page-header {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 12px 24px;
    margin-bottom: 24px !important;
    padding-bottom: 0 !important;
    border-bottom: 0 !important;
}

.bp-shared-page-header .bp-page-heading {
    display: grid;
    flex: 1 1 26rem;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(var(--bp-heading-row-height, 40px), auto);
    align-items: start;
    column-gap: 24px;
    container: page-heading / inline-size;
}

.bp-shared-page-header .bp-page-heading:has(> .bp-page-description) {
    grid-template-columns: minmax(0, 1fr) fit-content(60%);
}

/* The rule belongs to the title row, so wrapped actions cannot move it. */
.bp-shared-page-header .bp-page-heading::before {
    content: "";
    grid-column: 1 / -1;
    grid-row: 1;
    align-self: end;
    height: 2px;
    background: var(--bp-teal);
    pointer-events: none;
}

.bp-shared-page-header .bp-page-header-copy {
    grid-column: 1;
    grid-row: 1;
    align-self: stretch;
}

.bp-shared-page-header .bp-page-description {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    min-width: 0;
    max-width: 60ch;
    margin: 0;
    align-self: center;
    padding: 0;
    color: var(--bp-muted);
    font-size: .875rem;
    line-height: 1.4;
    text-align: right;
    overflow-wrap: anywhere;
}

.bp-shared-page-header .bp-page-title {
    width: fit-content;
    max-width: 100%;
    display: flex;
    align-items: center;
    min-height: var(--bp-heading-row-height, 40px);
    padding: 8px 24px 8px 14px;
    border-radius: 0 22px 0 0;
    background: var(--bp-teal);
    color: #fff !important;
    font-size: 1rem !important;
    line-height: 22px !important;
    letter-spacing: .015em !important;
    text-transform: uppercase;
}

.bp-shared-page-header .bp-page-actions {
    flex: 0 0 auto;
    max-width: 100%;
    margin-left: auto;
    padding: 0;
}

/* Use the heading's available width, including when actions occupy its right side. */
@container page-heading (max-width: 560px) {
    .bp-shared-page-header .bp-page-header-copy { grid-column: 1 / -1; }
    .bp-shared-page-header .bp-page-description {
        grid-column: 1 / -1;
        grid-row: 2;
        justify-self: stretch;
        max-width: none;
        padding: 8px 0 0;
        text-align: left;
    }
}

/* FocusOnNavigate programmatically focuses this non-interactive heading. */
.bp-page-title:focus,
.bp-page-title:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}

.bp-page-description {
    max-width: 72ch;
    margin: var(--bp-space-1) 0 0;
    color: var(--bp-muted) !important;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6;
}

.bp-page-actions {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--bp-space-2);
}

.bp-section-heading {
    margin: 0 0 var(--bp-space-4);
}

.bp-section-heading .bp-section-title,
.bp-section-heading > h2 {
    margin: 0;
    color: var(--bp-text);
    font-family: var(--bp-font-ui);
    font-size: 1.375rem;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.36;
}

.bp-section-heading .bp-section-description,
.bp-section-heading > p {
    max-width: 72ch;
    margin: var(--bp-space-1) 0 0;
    color: var(--bp-muted);
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.6;
}

.portal-page-header {
    margin: 0 0 var(--bp-space-6);
    padding: 0 0 1.25rem;
    border-bottom: 1px solid var(--bp-border);
}

.portal-page-header::after { display: none !important; }
.portal-page-header h1 { margin: 0; font-size: 2.125rem; font-weight: 700; line-height: 1.235; }
.portal-page-header > p:last-child { margin: var(--bp-space-1) 0 0; color: var(--bp-muted); font-size: 1rem; line-height: 1.6; }
body .form-label {
    color: var(--bp-muted) !important;
    font-size: 0.9375rem !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    line-height: 1.4 !important;
}
body .form-control,
body .form-select {
    color: var(--bp-text);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
}
body .form-control,
body .form-select {
    border-color: var(--bp-border-strong) !important;
    border-radius: var(--bp-radius-control) !important;
}

body .form-control,
body .form-select {
    min-height: var(--bp-control-height);
    padding: 0.625rem 0.75rem;
    background: var(--bp-surface);
}
body .form-text,
body .validation-message {
    margin-top: var(--bp-space-1);
    color: var(--bp-subtle);
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.45;
}
body .form-control:focus,
body .form-select:focus {
    border-color: var(--bp-accent) !important;
    box-shadow: var(--bp-focus-ring) !important;
    outline: 0;
}
body .invalid {
    border-color: var(--bp-error) !important;
}
body .validation-message { color: var(--bp-error); }

/* Actions ----------------------------------------------------------- */
body .bn-button,
body .btn,
body .acct-btn-primary,
body .acct-btn-link {
    min-height: var(--bp-button-height);
    padding: 0.5rem 1rem;
    border-radius: var(--bp-radius-control) !important;
    font-family: var(--bp-font-ui);
    font-size: 0.9375rem;
    font-weight: 600 !important;
    letter-spacing: 0;
    line-height: 1.35;
    text-transform: none;
}
/* Account navigation actions share the alignment of native buttons. */
body a.acct-btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    text-decoration: none;
}

body .btn-sm { min-height: 44px; padding: 0.5rem 0.75rem; font-size: 0.9375rem; }
body .btn-lg { min-height: 48px; padding: 0.75rem 1.25rem; font-size: 1rem; }

body .bn-icon-button { border-radius: var(--bp-radius-control); }
body .btn-primary,
body .acct-btn-primary {
    border-color: var(--bp-primary) !important;
    background: var(--bp-primary) !important;
    color: #fff !important;
    box-shadow: none !important;
}
body .btn-primary:hover,
body .acct-btn-primary:hover {
    border-color: var(--bp-primary-deep) !important;
    background: var(--bp-primary-deep) !important;
    color: #fff !important;
    box-shadow: none !important;
    filter: none;
}
body .btn-outline-primary {
    border-color: var(--bp-primary) !important;
    background: transparent !important;
    color: var(--bp-primary) !important;
}
body .btn-outline-primary:hover {
    border-color: var(--bp-primary-deep) !important;
    background: var(--bp-primary-soft) !important;
    color: var(--bp-primary-deep) !important;
}

/* Header and rail navigation remain compact, but never rely on tiny copy. */
.bp-primary-nav {
    background: var(--bp-primary);
    box-shadow: none;
}

.bp-primary-nav a,
.bp-primary-nav summary {
    min-height: 48px;
    padding-inline: var(--bp-space-4);
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.35;
}

.bp-primary-nav .active { font-weight: 700; }

.bp-menu-panel a,
.bp-menu-panel button,
.bp-mobile-menu-panel > a {
    min-height: 44px;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.4;
}

.bp-header-link,
.bp-header-register,
.bp-header-admin {
    min-height: 44px;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.35;
}

.bp-header-register,
.portal-register-cta {
    background: var(--bp-primary);
    box-shadow: none;
}

.bp-account-copy { font-size: 0.875rem; line-height: 1.35; }
.bp-membership-badge { font-size: 0.875rem; line-height: 1.35; }

.portal-rail-heading {
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.5;
    text-transform: none;
}

.portal-directory-counts a,
.portal-directory-actions a,
.portal-tool-list a,
.portal-rail-link-stack a,
.portal-rail-text-link,
.portal-signin-link {
    font-size: 0.875rem;
    line-height: 1.45;
}

.portal-directory-counts strong,
.portal-directory-actions strong,
.portal-tool-list a.is-active { font-weight: 600; }

.portal-module-tools-description,
.portal-insights p,
.portal-help-card p,
.portal-benefits p,
.portal-benefits li {
    font-size: 0.875rem;
    line-height: 1.5;
}

.portal-insights { background: var(--bp-surface); }

.bp-manager-toolbar,
.bp-document-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--bp-space-2);
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius-surface);
    background: var(--bp-surface);
}

.bp-manager-toolbar { padding: var(--bp-space-3) var(--bp-space-6); }
.bp-document-toolbar { padding: var(--bp-space-3) var(--bp-space-4); }

.bp-manager-surface > .bp-manager-toolbar {
    border: 0;
    border-bottom: 1px solid var(--bp-border);
    border-radius: 0;
    background: var(--bp-surface-soft);
}

.bp-document-toolbar { margin-bottom: var(--bp-space-4); }
.bp-manager-search { flex: 1 1 18rem; width: min(100%, 22rem); }
.bp-module-status-select { flex: 0 1 12rem; width: 12rem; }
.bp-toolbar-spacer { flex: 1 1 auto; }
.bp-row-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: var(--bp-space-2); }

body :is(button, a, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid rgba(64, 157, 193, 0.42);
    outline-offset: 2px;
}

/* Navigation focus announces the new page; headings are not interactive controls. */
body h1[tabindex="-1"]:focus,
body h1[tabindex="-1"]:focus-visible { outline: none; box-shadow: none; }

/* Surfaces and workflow aliases ------------------------------------ */
body .bn-card,
.bp-card,
.bp-surface,
.cohesion-card,
.bp-editor-surface,
.bp-manager-surface,
.bp-manager-section,
.bp-object-workspace {
    border: 1px solid var(--bp-border) !important;
    border-radius: var(--bp-radius-surface) !important;
    background: var(--bp-surface) !important;
    box-shadow: none !important;
}

body .bn-dialog{ border-radius: var(--bp-radius-overlay); box-shadow: var(--bp-shadow-overlay) !important; }

/* Native portal presentation. */
body .bn-card > .bn-card-header {
    padding: var(--bp-space-6) var(--bp-space-6) var(--bp-space-2);
}

body .bn-card > .bn-card-content {
    padding: var(--bp-space-4) var(--bp-space-6) var(--bp-space-6);
}

body .bn-card > .bn-card-content:first-child { padding-top: var(--bp-space-6); }

body .bn-card > .bn-card-actions {
    padding: 0 var(--bp-space-6) var(--bp-space-6);
    gap: var(--bp-space-2);
}

body .bn-dialog-header { padding: var(--bp-space-6) var(--bp-space-6) var(--bp-space-3); }
body .bn-dialog-body { padding: var(--bp-space-6); }
body .bn-dialog-actions { padding: var(--bp-space-4) var(--bp-space-6) var(--bp-space-6); }

.bp-editor-surface,
.bp-manager-surface,
.bp-manager-section { overflow: hidden; }

.bp-editor-sections { display: grid; }

.bp-editor-section {
    min-width: 0;
    padding: var(--bp-space-6);
    background: var(--bp-surface);
    border-bottom: 1px solid var(--bp-border);
}

.bp-editor-section:last-child { border-bottom: 0; }
.bp-editor-section > :last-child { margin-bottom: 0; }

.bp-editor-subsection {
    margin-top: var(--bp-space-4);
    padding: var(--bp-space-4);
    border: 0;
    border-radius: var(--bp-radius-control);
    background: var(--bp-surface-soft);
}

.bp-editor-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--bp-space-2);
    padding: var(--bp-space-4) var(--bp-space-6);
    border-top: 1px solid var(--bp-border);
    background: var(--bp-surface-soft);
    box-shadow: none;
}

.bp-editor-actions > .bp-editor-actions-spacer { flex: 1 1 auto; }

/* Compact progress for genuinely staged creation flows. This is not a tab rail. */
.bp-progress-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid var(--bp-border);
    background: var(--bp-surface-soft);
    list-style: none;
}

.bp-progress-steps li {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: var(--bp-space-3);
    padding: var(--bp-space-4) var(--bp-space-6);
    color: var(--bp-muted);
}

.bp-progress-steps li + li { border-left: 1px solid var(--bp-border); }

.bp-progress-steps li > span {
    display: grid;
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
    place-items: center;
    border: 1px solid var(--bp-border-strong);
    border-radius: var(--bp-radius-pill);
    background: var(--bp-surface);
    color: var(--bp-muted);
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1;
}

.bp-progress-steps li > div { display: grid; min-width: 0; }
.bp-progress-steps strong { color: inherit; font-size: 0.9375rem; font-weight: 600; line-height: 1.4; }
.bp-progress-steps small { overflow: hidden; color: var(--bp-subtle); font-size: 0.875rem; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.bp-progress-steps .is-current { box-shadow: inset 0 -3px 0 var(--bp-primary); color: var(--bp-primary); }
.bp-progress-steps .is-current > span { border-color: var(--bp-primary); background: var(--bp-primary); color: #fff; }
.bp-progress-steps .is-complete { color: var(--bp-text); }
.bp-progress-steps .is-complete > span { border-color: var(--bp-accent); background: var(--bp-accent-soft); color: var(--bp-primary); }

.bp-object-workspace {
    display: grid;
    min-width: 0;
}

.bp-manager-list-content { min-width: 0; }

.bp-detail-section {
    padding: var(--bp-space-6);
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius-surface);
    background: var(--bp-surface);
    box-shadow: none;
}

.bp-detail-subsection {
    padding: var(--bp-space-4);
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius-surface);
    background: var(--bp-surface-soft);
    box-shadow: none;
}

.bp-detail-label {
    display: block;
    margin: 0 0 var(--bp-space-1);
    color: var(--bp-muted);
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.5;
}

.bp-pre-line { white-space: pre-line; }
.bp-strong { font-weight: 600; }
.bp-data-number { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }

.bp-manager-section-heading {
    display: flex;
    min-height: 0;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--bp-space-4);
    padding: var(--bp-space-4) var(--bp-space-6);
    border-bottom: 1px solid var(--bp-border);
    background: var(--bp-surface-soft);
}

.bp-manager-section-heading .bp-section-heading { margin: 0; }

.bp-manager-section-heading .bn-text-h6 {
    color: var(--bp-text);
    font-size: 1.125rem !important;
    font-weight: 600 !important;
}

.bp-manager-section-count {
    min-width: 1.75rem;
    height: 1.75rem;
    padding: 0 var(--bp-space-2);
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius-pill);
    background: var(--bp-surface);
    color: var(--bp-muted);
    font-size: 0.875rem;
    font-weight: 600;
}

/* Saved-object peer views, not creation progress. */
.bp-workspace-tabs,
body .bp-workspace-tabs.bn-tabs {
    display: flex;
    max-width: 100%;
    min-width: 0;
    align-items: flex-end;
    gap: var(--bp-space-1);
    padding: 0 var(--bp-space-4);
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scroll-padding-inline: var(--bp-space-4);
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
    border: 0 !important;
    border-bottom: 1px solid var(--bp-border) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
.bp-workspace-tabs > [role="tab"] {
    appearance: none;
    flex: 0 0 auto;
    min-height: 48px;
    padding: 0 var(--bp-space-4);
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: transparent;
    color: var(--bp-muted);
    font-family: var(--bp-font-ui);
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
    cursor: pointer;
}
.bp-workspace-tabs > [role="tab"]:hover {
    background: var(--bp-primary-soft);
    color: var(--bp-primary-deep);
}
.bp-workspace-tabs > [role="tab"].is-active,
.bp-workspace-tabs > [role="tab"][aria-selected="true"] {
    border-bottom-color: var(--bp-primary);
    color: var(--bp-primary);
}

.bp-workspace-tabs > [role="tab"]:focus-visible {
    outline: 2px solid var(--bp-accent);
    outline-offset: -3px;
}

/* Tables ------------------------------------------------------------ */
body .bn-table,
.bp-module-table,
body .table {
    overflow: hidden;
    border: 1px solid var(--bp-border) !important;
    border-radius: var(--bp-radius-surface) !important;
    background: var(--bp-surface) !important;
    box-shadow: none !important;
}

body .bn-table-head,
body .bn-table-header,
body .table > thead { background: var(--bp-surface-soft) !important; }

body .bn-table-head .bn-table-cell,
body .bn-table-header .bn-table-cell,
.bp-module-table th,
body .table > thead th {
    padding: var(--bp-space-3) var(--bp-space-4);
    border-color: var(--bp-border) !important;
    color: var(--bp-muted) !important;
    font-size: 0.9375rem !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    line-height: 1.4;
    text-transform: none !important;
}

body .bn-table-body .bn-table-cell,
.bp-module-table td,
body .table > tbody > tr > td {
    min-height: 60px;
    padding: var(--bp-space-3) var(--bp-space-4);
    border-color: var(--bp-border) !important;
    color: var(--bp-text);
    font-size: 0.9375rem;
    line-height: 1.6;
    vertical-align: middle;
}

body .bn-table-body .bn-table-row:hover { background: var(--bp-primary-soft) !important; }

.bp-manager-section > .bp-module-table,
.bp-manager-surface > .bp-module-table,
.bp-manager-surface > .bp-manager-table-shell > .bp-module-table {
    border: 0 !important;
    border-radius: 0 !important;
}

.bp-manager-table-shell {
    min-width: 0;
    width: 100%;
    overflow: hidden;
}

.bp-module-table .bn-table-pager,
.bp-module-pager {
    min-height: 52px;
    padding: 0 var(--bp-space-6);
    border-top: 1px solid var(--bp-border);
    background: var(--bp-surface);
    color: var(--bp-muted);
    font-size: 0.875rem;
}
.bp-module-table .bn-table-pager .bn-icon-button {
    min-width: 44px;
    width: 44px;
    min-height: 44px;
    height: 44px;
}

/* Badges, tags, and empty states ----------------------------------- */
body .bn-chip{
    min-height: 28px;
    border-radius: var(--bp-radius-pill);
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    letter-spacing: 0;
}

.bp-status-badge {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0.125rem 0.5rem;
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius-pill);
    background: #f1f5f9;
    color: var(--bp-muted);
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.5;
    white-space: nowrap;
}

.bp-status-badge--success { border-color: #b8dec9; background: #eaf7f0; color: #12603f; }
.bp-status-badge--warning { border-color: #efd7a6; background: #fff6e5; color: #744800; }
.bp-status-badge--info { border-color: #b9dce9; background: var(--bp-accent-soft); color: #174d6b; }
.bp-status-badge--error { border-color: #ecc3c8; background: #fff0f2; color: #982a36; }
.bp-status-badge--neutral { border-color: var(--bp-border); background: #f1f5f9; color: var(--bp-muted); }

.bp-empty-state {
    display: grid;
    min-height: 12rem;
    place-items: center;
    align-content: center;
    margin: 0;
    padding: var(--bp-space-12) var(--bp-space-6);
    border: 1px dashed var(--bp-border-strong);
    border-radius: var(--bp-radius-surface);
    background: var(--bp-surface);
    color: var(--bp-muted);
    text-align: center;
}

.bp-empty-state-visual {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: var(--bp-radius-surface);
    background: var(--bp-accent-soft);
    color: var(--bp-primary);
    font-size: 1.75rem;
    line-height: 1;
}

.bp-empty-state-visual .bn-icon { width: 28px; height: 28px; font-size: 28px; }

.bp-empty-state-title {
    margin: var(--bp-space-3) 0 0;
    color: var(--bp-text);
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.45;
}

.bp-empty-state-message {
    max-width: 56ch;
    margin: var(--bp-space-1) 0 0;
    color: var(--bp-muted);
    font-size: 0.9375rem;
    line-height: 1.6;
}

.bp-empty-state-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--bp-space-2);
    margin-top: var(--bp-space-4);
}

:is(.bp-manager-section, .bp-manager-surface, .bp-editor-surface) > .bp-empty-state {
    min-height: 10rem;
    border: 0;
    border-radius: 0;
    background: transparent;
}

@media (max-width: 700px) {
    .bp-page-header,
    .bp-shared-page-header {
        flex-direction: column;
        align-items: stretch;
        padding-bottom: var(--bp-space-4) !important;
    }

    .bp-page-title { font-size: 1.5rem !important; line-height: 1.35 !important; }
    .bp-shared-page-header .bp-page-title { font-size: 1rem !important; }
    .bp-shared-page-header .bp-page-heading { flex-basis: 100%; }
    .bp-shared-page-header .bp-page-actions { flex-basis: 100%; margin-left: 0; }
    .bp-page-actions { width: 100%; justify-content: flex-start; }
    .bp-page-actions > * { max-width: 100%; }
    .bp-page-actions > .bn-button { flex: 1 1 auto; }

    .bp-editor-section { padding: var(--bp-space-4); }
    .bp-detail-section { padding: var(--bp-space-4); }
    body .bn-card > .bn-card-header { padding: var(--bp-space-4) var(--bp-space-4) var(--bp-space-2); }
    body .bn-card > .bn-card-content { padding: var(--bp-space-3) var(--bp-space-4) var(--bp-space-4); }
    body .bn-card > .bn-card-content:first-child { padding-top: var(--bp-space-4); }
    body .bn-card > .bn-card-actions { padding: 0 var(--bp-space-4) var(--bp-space-4); }
    body .bn-dialog-header { padding: var(--bp-space-4) var(--bp-space-4) var(--bp-space-2); }
    body .bn-dialog-body { padding: var(--bp-space-4); }
    body .bn-dialog-actions { padding: var(--bp-space-3) var(--bp-space-4) var(--bp-space-4); }
    .bp-manager-toolbar,
    .bp-document-toolbar { align-items: stretch; }
    .bp-manager-toolbar { padding: var(--bp-space-4); }
    .bp-module-table .bn-table-pager,
    .bp-module-pager { padding-inline: var(--bp-space-4); }
    .bp-manager-search,
    .bp-module-status-select { flex-basis: 100%; width: 100%; }
    .bp-toolbar-spacer { display: none; }
    .bp-document-toolbar .bn-button { flex: 1 1 auto; }
    body .bn-dialog-actions { flex-wrap: wrap; }
    .bp-editor-actions {
        position: sticky;
        z-index: 5;
        bottom: calc(4.35rem + env(safe-area-inset-bottom, 0px));
        flex-wrap: wrap;
        padding: var(--bp-space-3) var(--bp-space-4);
        box-shadow: 0 -8px 20px rgba(16, 35, 63, 0.08);
    }
    .bp-editor-actions > .bp-editor-actions-spacer { flex-basis: 100%; }
    .bp-editor-actions .bn-button { flex: 1 1 calc(50% - var(--bp-space-2)); }

    .bp-progress-steps li { justify-content: center; padding: var(--bp-space-3) var(--bp-space-2); }
    .bp-progress-steps li > span { width: 1.75rem; height: 1.75rem; flex-basis: 1.75rem; }
    .bp-progress-steps li > div,
    .bp-progress-steps li > strong { display: none; }

    .bp-empty-state { min-height: 10rem; padding: var(--bp-space-8) var(--bp-space-4); }
}

@media (max-width: 900px) {
    .bp-mobile-menu-title span { font-size: 1rem; font-weight: 600; line-height: 1.4; }
    .bp-mobile-menu-title small { font-size: 0.875rem; line-height: 1.4; }
    .bp-mobile-menu-group {
        font-size: 0.875rem;
        font-weight: 600;
        letter-spacing: 0;
        line-height: 1.4;
        text-transform: none;
    }
    .bp-mobile-dock a { font-size: 0.875rem; font-weight: 600; line-height: 1.2; }
    .bp-header-link,
    .bp-header-register { font-size: 0.875rem; }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}