/* Portal design aliases; explicit Admin/Public palettes and DB typography. */
:root {
    --portal-color-white: #ffffff;
    --portal-color-ink-strong: #050505;
    --portal-color-overlay-dark: #090d13;
    --portal-color-slate-950: #0f172a;
    --portal-color-slate-500: #64748b;
    --portal-color-slate-50: #f8fafc;
    --portal-color-canvas-warm: #f6f6f3;
    --portal-color-tech-line: #d9e3e6;
    --portal-color-text-muted: #666666;
    --portal-primary: #5757f8;
    --portal-primary-dark: #5757f8;
    --portal-highlight: #5757f8;
    --portal-ink: #151925;
    --portal-ink-soft: #5f6b7d;
    --portal-line: #e4e7ef;
    --portal-bg: #ffffff;
    --portal-bg-alt: #f7f8fb;
    --portal-dark: #151925;
    --portal-slate: #4c5568;
    --portal-radius: 8px;
    --portal-radius-pill: 9999px;
    --portal-shadow: 0 18px 48px rgba(21, 25, 37, 0.08);
    --portal-card-hover-shadow: 0 22px 56px rgba(21, 25, 37, 0.1);
    --portal-primary-hover: #4444e8;
    --portal-primary-soft: rgba(87, 87, 248, 0.1);
    --portal-primary-focus-shadow: rgba(87, 87, 248, 0.22);
    --portal-on-primary: #ffffff;
    --portal-surface-muted: #f1f3f8;
    --portal-badge-radius: 9999px;
    --portal-badge-font-size-sm: var(--type-badge-label-size);
    --portal-badge-font-size-md: var(--type-badge-label-size);
    --portal-badge-font-size-lg: var(--type-badge-label-size);
    --portal-compact-padding-x: var(--common-page-compact-padding-x);
    --portal-compact-padding-y: var(--common-page-compact-padding-y);
    --portal-inline-gap: var(--common-page-inline-gap);
    --portal-badge-padding-sm: var(--portal-compact-padding-y) var(--portal-compact-padding-x);
    --portal-badge-padding-md: var(--portal-compact-padding-y) var(--portal-compact-padding-x);
    --portal-badge-padding-lg: var(--portal-compact-padding-y) var(--portal-compact-padding-x);
    --portal-badge-surface-neutral: #eef1f7;
    --portal-badge-surface-info: rgba(87, 87, 248, 0.1);
    --portal-badge-surface-subtle: #f1f2f5;
    --portal-badge-text-neutral: var(--portal-ink);
    --portal-badge-text-info: var(--portal-primary);
    --portal-badge-text-subtle: rgba(5, 5, 5, 0.68);
    --portal-badge-border-neutral: transparent;
    --portal-badge-surface-pinned: rgba(87, 87, 248, 0.12);
    --portal-badge-text-pinned: #3f3fd3;
    --portal-badge-surface-success: #ecfdf3;
    --portal-badge-text-success: #067647;
    --portal-badge-surface-draft: #f4f3ff;
    --portal-badge-text-draft: #6941c6;
    --portal-badge-surface-archived: #f2f4f7;
    --portal-badge-text-archived: #475467;
    --portal-panel-surface: var(--portal-color-white);
    --portal-panel-surface-muted: var(--portal-color-slate-50);
    --portal-panel-border: 0;
    --portal-panel-border-outlined: 1px solid var(--portal-line);
    --portal-panel-border-strong: 1px solid var(--portal-ink);
    --portal-panel-radius: var(--portal-radius);
    --portal-panel-radius-raised: 12px;
    --portal-panel-shadow: var(--portal-shadow);
    --portal-panel-shadow-inset: inset 0 0 0 1px rgba(148, 163, 184, 0.14);
    --portal-panel-shadow-raised: 0 12px 28px rgba(37, 99, 235, 0.10);
    --portal-panel-padding-card: var(--common-page-panel-padding-y) var(--common-page-panel-padding-x);
    --portal-panel-padding-compact: var(--common-page-panel-padding-y);
    --portal-panel-padding-detail: var(--common-page-panel-padding-y) var(--common-page-panel-padding-x);
    --portal-max-width: var(--common-page-max-width);
    --portal-font-heading: var(--type-page-title-family);
    --portal-font-body: var(--type-body-default-family);
    --portal-font-hero: var(--type-page-title-family);
    --portal-type-micro: var(--type-metadata-version-size);
    --portal-type-2xs: var(--type-badge-label-size);
    --portal-type-xs: var(--type-badge-label-size);
    --portal-type-caption: var(--type-body-secondary-size);
    --portal-type-sm: var(--type-body-secondary-size);
    --portal-type-support: var(--type-body-secondary-size);
    --portal-type-caption-lg: var(--type-body-secondary-size);
    --portal-type-body-tight: var(--type-body-default-size);
    --portal-type-label: var(--type-field-label-size);
    --portal-type-body-sm: var(--type-body-default-size);
    --portal-type-body: var(--type-body-default-size);
    --portal-type-body-compact: var(--type-body-default-size);
    --portal-type-body-lg: var(--type-body-emphasis-size);
    --portal-type-lead: var(--type-body-emphasis-size);
    --portal-type-heading-sm: var(--type-panel-title-size);
    --portal-type-heading-md: var(--type-panel-title-size);
    --portal-type-heading-lg: var(--type-page-title-size);
    --portal-public-nav-font-size: var(--type-body-secondary-size);
    --portal-public-nav-font-tracking: var(--type-body-default-tracking);
    --portal-public-nav-size: var(--portal-public-nav-font-size);
    --portal-public-nav-tracking: var(--portal-public-nav-font-tracking);
    --portal-public-hero-font-title-size: var(--type-page-title-size);
    --portal-public-hero-font-title-line-height: var(--type-page-title-line-height);
    --portal-public-hero-title-size: var(--portal-public-hero-font-title-size);
    --portal-public-hero-title-line-height: var(--portal-public-hero-font-title-line-height);
    --portal-public-hero-font-body-size: var(--type-body-emphasis-size);
    --portal-public-hero-font-body-line-height: var(--type-body-default-line-height);
    --portal-public-hero-body-size: var(--portal-public-hero-font-body-size);
    --portal-public-hero-body-line-height: var(--portal-public-hero-font-body-line-height);
    --portal-public-section-font-title-size: var(--type-page-title-size);
    --portal-public-section-font-title-line-height: var(--type-page-title-line-height);
    --portal-public-section-font-title-tracking: var(--type-page-title-tracking);
    --portal-public-section-title-size: var(--portal-public-section-font-title-size);
    --portal-public-section-title-line-height: var(--portal-public-section-font-title-line-height);
    --portal-public-section-title-tracking: var(--portal-public-section-font-title-tracking);
    --portal-public-section-font-body-line-height: var(--type-body-default-line-height);
    --portal-public-section-body-line-height: var(--portal-public-section-font-body-line-height);
    --portal-public-eyebrow-font-size: var(--type-badge-label-size);
    --portal-public-eyebrow-font-tracking: var(--type-body-default-tracking);
    --portal-public-eyebrow-size: var(--portal-public-eyebrow-font-size);
    --portal-public-eyebrow-tracking: var(--portal-public-eyebrow-font-tracking);
    --portal-public-page-hero-font-title-size: var(--type-page-title-size);
    --portal-public-page-hero-font-title-line-height: var(--type-page-title-line-height);
    --portal-public-page-hero-title-size: var(--portal-public-page-hero-font-title-size);
    --portal-public-page-hero-title-line-height: var(--portal-public-page-hero-font-title-line-height);
    --portal-public-page-hero-font-subtitle-size: var(--type-body-secondary-size);
    --portal-public-page-hero-font-subtitle-line-height: var(--type-body-default-line-height);
    --portal-public-page-hero-subtitle-size: var(--portal-public-page-hero-font-subtitle-size);
    --portal-public-page-hero-subtitle-line-height: var(--portal-public-page-hero-font-subtitle-line-height);
    --portal-public-page-hero-font-title-size-mobile: var(--type-page-title-size);
    --portal-public-page-hero-font-title-line-height-mobile: var(--type-page-title-line-height);
    --portal-public-page-hero-title-size-mobile: var(--portal-public-page-hero-font-title-size-mobile);
    --portal-public-page-hero-title-line-height-mobile: var(--portal-public-page-hero-font-title-line-height-mobile);
    --portal-public-page-hero-font-subtitle-size-mobile: var(--type-body-secondary-size);
    --portal-public-page-hero-font-subtitle-line-height-mobile: var(--type-body-default-line-height);
    --portal-public-page-hero-subtitle-size-mobile: var(--portal-public-page-hero-font-subtitle-size-mobile);
    --portal-public-page-hero-subtitle-line-height-mobile: var(--portal-public-page-hero-font-subtitle-line-height-mobile);
    --portal-public-page-hero-font-title-size-tablet: var(--type-page-title-size);
    --portal-public-page-hero-title-size-tablet: var(--portal-public-page-hero-font-title-size-tablet);
    --portal-public-page-hero-font-subtitle-size-tablet: var(--type-body-secondary-size);
    --portal-public-page-hero-subtitle-size-tablet: var(--portal-public-page-hero-font-subtitle-size-tablet);
    --portal-public-mobile-hero-font-title-size: var(--type-page-title-size);
    --portal-public-mobile-hero-title-size: var(--portal-public-mobile-hero-font-title-size);
    --portal-public-mobile-hero-font-body-size: var(--type-body-default-size);
    --portal-public-mobile-hero-body-size: var(--portal-public-mobile-hero-font-body-size);
    --portal-alert-surface-success: #ecfdf5;
    --portal-alert-text-success: #065f46;
    --portal-alert-border-success: #a7f3d0;
    --portal-alert-surface-danger: #fef2f2;
    --portal-alert-text-danger: #991b1b;
    --portal-alert-border-danger: #fecaca;
    --portal-admin-page-padding: var(--common-page-compact-padding-x);
    --portal-admin-section-gap: var(--common-page-panel-row-gap);
    --portal-admin-panel-padding: var(--common-page-compact-padding-y) var(--common-page-compact-padding-x);
    --portal-admin-grid-gap: var(--common-page-panel-row-gap) var(--common-page-panel-column-gap);
    --portal-catalog-panel-height: calc(var(--common-page-layout-unit) * 464);
}



.portal-public {
    --portal-public-page-gutter: clamp(1.25rem, 4vw, 4.5rem);
    --portal-public-layout-gap: clamp(2rem, 4vw, 4.5rem) clamp(1.25rem, 3vw, 3rem);
    --portal-public-airy-section-space: clamp(4.5rem, 9vw, 8.5rem);
    --portal-public-airy-section-space-mobile: clamp(3.5rem, 16vw, 5rem);
    --portal-premium-radius: 1.15rem;
    --portal-premium-shadow: 0 1.5rem 4rem rgba(15, 23, 42, 0.1);
    --portal-premium-dark-shadow: 0 1.75rem 4.5rem rgba(2, 6, 23, 0.24);
    --portal-primary: #ffc500;
    --portal-primary-dark: #ffc500;
    --portal-highlight: #ffc500;
    --portal-ink: #070707;
    --portal-ink-soft: #6c6c6c;
    --portal-line: #e8e8e8;
    --portal-bg-alt: #f6f6f3;
    --portal-radius: 0;
    --portal-radius-pill: 0;
    --portal-shadow: none;
    --portal-card-hover-shadow: var(--portal-card-shadow-hover);
    --portal-primary-hover: #e5b000;
    --portal-primary-soft: rgba(255, 197, 0, 0.14);
    --portal-primary-focus-shadow: rgba(255, 197, 0, 0.24);
    --portal-on-primary: #171b24;
    --portal-surface-muted: #f8fafc;
    --portal-badge-surface-neutral: var(--portal-color-white);
    --portal-badge-surface-info: color-mix(in srgb, var(--portal-tech-highlight) 9%, transparent);
    --portal-badge-text-neutral: var(--portal-ink-readable);
    --portal-badge-text-info: var(--portal-on-dark-label);
    --portal-badge-border-neutral: #dce3ed;
    --portal-badge-surface-hero: color-mix(in srgb, var(--portal-tech-highlight) 9%, transparent);
    --portal-badge-border-hero: color-mix(in srgb, var(--portal-tech-highlight) 28%, transparent);
    --portal-badge-text-hero: var(--portal-on-dark-label);
    --portal-header-offset: var(--portal-header-height);
    --portal-commercial-dark: #171c28;
    --portal-commercial-dark-soft: #22293b;
    --portal-commercial-paper: #ffffff;
    --portal-commercial-paper-soft: #f8fafc;
    --portal-ink-readable: #171b24;
    --portal-muted-readable: #3f4654;
    --portal-paper: var(--portal-commercial-paper);
    --portal-paper-warm: var(--portal-commercial-paper-soft);
    --portal-text: var(--portal-ink-readable);
    --portal-muted: var(--portal-muted-readable);
    --portal-dark: var(--portal-commercial-dark);
    --portal-surface: #fffdf7;
    --portal-surface-strong: #fff7d8;
    --portal-tech: #2f6bff;
    --portal-tech-highlight: #22d3ee;
    --portal-tech-soft: rgba(47, 107, 255, 0.12);
    --portal-tech-highlight-soft: rgba(34, 211, 238, 0.14);
    --portal-accent-blue: var(--portal-tech);
    --portal-accent-cyan: var(--portal-tech-highlight);
    --portal-accent-blue-soft: var(--portal-tech-soft);
    --portal-accent-cyan-soft: var(--portal-tech-highlight-soft);
    --portal-card-radius: 14px;
    --portal-card-border: rgba(23, 27, 36, 0.08);
    --portal-card-shadow: 0 1px 2px rgba(16, 20, 29, 0.04), 0 10px 26px rgba(16, 20, 29, 0.06);
    --portal-card-shadow-hover: 0 2px 6px rgba(16, 20, 29, 0.06), 0 22px 48px rgba(23, 45, 92, 0.14);
    --portal-panel-surface-card: var(--portal-panel-surface);
    --portal-panel-surface-card-hover: var(--portal-panel-surface-card);
    --portal-panel-surface-product: var(--portal-panel-surface-card);
    --portal-panel-border-card: 1px solid var(--portal-card-border);
    --portal-panel-border-card-hover: 1px solid color-mix(in srgb, var(--portal-tech) 28%, transparent);
    --portal-panel-border-product-hover: 1px solid color-mix(in srgb, var(--portal-tech) 34%, transparent);
    --portal-panel-radius-card: var(--portal-card-radius);
    --portal-panel-shadow-card: var(--portal-card-shadow);
    --portal-panel-shadow-card-hover: var(--portal-card-shadow-hover);
    --portal-tech-gradient: linear-gradient(135deg, var(--portal-tech), var(--portal-tech-highlight));
    --portal-hero-foreground: var(--portal-color-white);
    --portal-hero-subtitle: var(--portal-on-dark-muted);
    --portal-hero-surface-menu: radial-gradient(circle at 86% 14%, rgba(255, 197, 0, 0.11), transparent 24%), var(--portal-commercial-dark);
    --portal-hero-menu-min-height: 0;
    --portal-hero-menu-height: auto;
    --portal-hero-menu-height-mobile: auto;
    --portal-hero-menu-padding: var(--common-page-panel-padding-y) var(--common-page-panel-padding-x);
    --portal-hero-menu-padding-tablet: var(--common-page-panel-padding-y) var(--common-page-panel-padding-x);
    --portal-hero-menu-padding-mobile: var(--common-page-compact-padding-y) var(--common-page-compact-padding-x);
    --portal-hero-title-max-width: var(--common-page-max-width);
    --portal-hero-title-size: var(--type-page-title-size);
    --portal-hero-title-max-width-mobile: var(--common-page-max-width);
    --portal-hero-title-size-mobile: var(--type-page-title-size);
    --portal-hero-subtitle-max-width: var(--common-page-max-width);
    --portal-hero-subtitle-size: var(--type-body-secondary-size);
    --portal-hero-subtitle-size-mobile: var(--type-body-secondary-size);
    --portal-hero-landing-min-height: 0;
    --portal-hero-landing-padding: var(--common-page-panel-padding-y);
    --portal-hero-landing-title-size: var(--type-page-title-size);
    --portal-hero-landing-title-size-mobile: var(--type-page-title-size);
    --portal-hero-landing-min-height-mobile: 0;
    --portal-hero-landing-padding-mobile: var(--common-page-compact-padding-y);
    --portal-accent: #ffc500;
    --portal-accent-strong: #ffd43b;
    --portal-accent-contrast: #171b24;
    --portal-cta-background: var(--portal-accent);
    --portal-cta-foreground: var(--portal-accent-contrast);
    --portal-cta-font-family: var(--portal-font-body);
    --portal-cta-font-weight: var(--portal-weight-semibold);
    --portal-cta-radius: var(--portal-control-radius);
    --portal-header-bg: var(--portal-commercial-dark);
    --portal-header-bg-scrolled: #151a27;
    --portal-header-height: calc(var(--common-page-layout-unit) * 90);
    --portal-header-height-scrolled: calc(var(--common-page-layout-unit) * 60);
    --portal-on-dark: #ffffff;
    --portal-on-dark-muted: rgba(255, 255, 255, 0.72);
    --portal-on-dark-subtle: rgba(255, 255, 255, 0.76);
    --portal-on-dark-label: #a5f3fc;
    --portal-on-dark-copy: #eef6ff;
    --portal-on-dark-muted-readable: #cbd5e1;
    --portal-control-height: var(--common-page-control-height);
    --portal-control-header-width: calc(var(--common-page-layout-unit) * 132);
    --portal-control-header-height: calc(var(--portal-header-height) * 44 / 90);
    --portal-control-header-height-scrolled: calc(var(--portal-header-height-scrolled) * 44 / 90);
    --portal-control-header-locale-width: calc(var(--portal-control-header-width) / 2);
    --portal-control-action-height: calc(var(--common-page-layout-unit) * 42);
    --portal-control-action-height-lg: calc(var(--common-page-layout-unit) * 46);
    --portal-control-padding-x: var(--common-page-compact-padding-x);
    --portal-control-padding-y: var(--common-page-compact-padding-y);
    --portal-control-radius: 6px;
    --portal-control-radius-sm: 4px;
    --portal-weight-medium: var(--type-body-emphasis-weight);
    --portal-weight-semibold: var(--type-action-label-weight);
    --portal-weight-bold: var(--type-page-title-weight);
    --portal-focus-ring: 2px solid var(--portal-accent);
    --portal-page-gutter: var(--common-page-horizontal-padding);
    --portal-section-space-top: var(--common-page-panel-row-gap);
    --portal-section-space-bottom: var(--common-page-panel-row-gap);
    --portal-panel-padding-compact: var(--common-page-panel-padding-y);
    --portal-panel-padding-standard: var(--common-page-panel-padding-y) var(--common-page-panel-padding-x);
    --portal-panel-padding: var(--common-page-panel-padding-y) var(--common-page-panel-padding-x);
    --portal-layout-gap: var(--common-page-panel-row-gap) var(--common-page-panel-column-gap);
    --portal-airy-section-space: var(--common-page-panel-row-gap);
    --portal-airy-section-space-mobile: var(--common-page-panel-row-gap);
    --portal-airy-content-gap: var(--common-page-panel-row-gap);
    --portal-reading-measure: var(--common-page-max-width);
    --portal-heading-measure: var(--common-page-max-width);
    --portal-simple-border: rgba(23, 27, 36, 0.1);
    --portal-simple-surface: #ffffff;
    --portal-simple-surface-alt: #f8fafc;
    --portal-badge-font-size-sm: var(--type-badge-label-size);
    --portal-badge-font-size-md: var(--type-badge-label-size);
    --portal-badge-font-size-lg: var(--type-badge-label-size);
    --portal-font-heading: var(--type-page-title-family);
    --portal-font-body: var(--type-body-default-family);
    --portal-font-hero: var(--type-page-title-family);
}