:root {
  --radius-none: 0px;
  --radius-extra-small: 4px;
  --radius-large-increased: 20px;
  --radius-extra-large-increased: 32px;
  --radius-extra-extra-large: 48px;
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 10px;
  --radius-xl: 8px;
  --radius-small: var(--radius-sm);
  --radius-medium: var(--radius-md);
  --radius-large: var(--radius-lg);
  --radius-extra-large: var(--radius-xl);
  --color-surface: #00216c;
  --color-on-surface: #ffffff;
  --color-primary: #b2c5ff;
  --color-on-primary: #000000;
  --color-accent: #ff6a3d;
  --color-success: #60a217;
  --color-warning: #f5c842;
  --color-error: #ff6a3d;
  --color-primary-container: #314578;
  --color-on-primary-container: #dae2ff;
  --color-secondary: #c0c6dd;
  --color-on-secondary: #2a3042;
  --color-secondary-container: #404659;
  --color-on-secondary-container: #dce2f9;
  --color-tertiary: #e1bbdc;
  --color-on-tertiary: #422741;
  --color-tertiary-container: #5a3d59;
  --color-on-tertiary-container: #fed6f9;
  --color-error-container: #93000a;
  --color-on-error-container: #ffdad6;
  --color-surface-variant: #45464f;
  --color-surface-container-lowest: #000d37;
  --color-surface-container-low: #003cb3;
  --color-surface-container: #003cb3;
  --color-surface-container-high: #00216c;
  --color-surface-container-highest: #33343a;
  --color-outline-variant: #6f9fff;
  --color-inverse-surface: #e3e2e9;
  --color-on-inverse-surface: #2f3036;
  --color-inverse-primary: #495d92;
  --color-scrim: #000000;
  --color-background: #000d37;
  --color-surface-2: #003cb3;
  --color-text-muted: #e6f0ff;
  --color-border: #6f9fff;
  --color-info: #8cb8ff;
  --color-backdrop: rgba(0, 0, 0, 0.6);
  --color-landing-blue: #205bff;
  --color-landing-blue-soft: #eaf0ff;
  --color-landing-navy: #0e1b3d;
  --color-landing-ink: #16213a;
  --color-landing-muted: #5d6880;
  --color-landing-bg: #f4f6fa;
  --color-landing-line: #e3e7ef;
  --color-landing-red: #a8321e;
  --color-landing-red-soft: #fbeae6;
  --color-landing-gold-ink: #8a6508;
  --color-landing-gold-soft: #fdf5dc;
  --color-login-heading: #0e1880;
  --color-button-quiet: #ffffff;
  --color-button-pressed: #747ee6;
  --color-button-pressed-label: #ffffff;
  --color-button-hover: #4553de;
  --color-button-outline-fill: #ffffff;
  --color-page-tint: #e8e9fb;
  --color-card-fill: #ffffff;
  --color-tile-fill: #edeef0;
  --color-tile-border: #dcdde1;
  --color-card-outline: #d1d4f7;
  --color-banner-back: #ffffff;
  --color-banner-title: #ffffff;
  --color-avatar-ring: #a2a9ef;
  --color-button-outline-label: #05082b;
  --color-button-outline-pressed-label: #0e1880;
  --color-button-disabled-label: #0e3b8b;
  --color-button-outline-disabled-border: #cac4d0;
  --color-button-outline-disabled-label: #1d1b20;
  --color-button-outline-pressed: #f3f4fd;
  --color-login-action: #1728d6;
  --color-nav-ink: #ffffff;
  --color-nav-selected: #1728d6;
  --color-nav-on-selected: #ffffff;
  --color-primary: #2f74ff;
  --color-on-surface-variant: #e6f0ff;
  --color-outline: #6f9fff;
  --color-m3-error: #ff6a3d;
  --color-m3-on-primary: #ffffff;
  --color-figma-selection-purple: #9747ff;
  --color-chart-identity: #8cb8ff;
  --color-chart-location: #5ed7b4;
  --color-chart-contact: #ff9c75;
  --color-chart-relationships: #c7a4ff;
  --color-sumi-ink: #000000;
  --color-vip-gold-deep: #7e5306;
  --color-vip-gold-shadow: #ad791a;
  --color-vip-gold-mid: #c89327;
  --color-vip-gold-warm: #daa533;
  --color-vip-gold-light: #e8bf59;
  --color-vip-gold-highlight: #fff3b3;
  --color-b2b-primary: #015aff;
  --color-b2b-primary-dim: #0046d6;
  --color-b2b-accent: #ff6a3d;
  --color-b2b-success: #60a217;
  --color-b2b-success-dim: #193102;
  --color-b2b-background: #000d37;
  --color-b2b-background-deep: #000d37;
  --color-b2b-surface: #00216c;
  --color-b2b-surface-2: #003cb3;
  --color-b2b-border: #6f9fff;
  --color-b2b-on-surface: #ffffff;
  --color-b2b-on-surface-variant: #e6f0ff;
  --color-b2b-subtle: #e6f0ff;
  --color-b2b-on-primary: #ffffff;
  --color-cluzy-story-blue: #015aff;
  --color-cluzy-story-blue-dim: #0046d6;
  --color-cluzy-story-orange: #ff6a3d;
  --color-cluzy-story-green: #60a217;
  --color-cluzy-story-green-dim: #193102;
  --color-cluzy-story-bg: #000d37;
  --color-cluzy-story-bg-deep: #000d37;
  --color-cluzy-story-panel: #101833;
  --color-cluzy-story-panel-2: #182247;
  --color-cluzy-story-border: #26304f;
  --color-cluzy-story-text: #ffffff;
  --color-cluzy-story-muted: #e6f0ff;
  --color-cluzy-story-subtle: #e6f0ff;
  --color-green-100: #95f829;
  --color-green-200: #7acc20;
  --color-green-300: #60a217;
  --color-green-400: #477a0f;
  --color-green-500: #2f5407;
  --color-green-600: #193102;
  --color-green-700: #071401;
  --color-yellow-100: #feefd6;
  --color-yellow-200: #f5c842;
  --color-yellow-300: #c7a234;
  --color-yellow-400: #9b7d26;
  --color-yellow-500: #715819;
  --color-yellow-600: #493a0d;
  --color-yellow-700: #251c04;
  --color-orange-10: rgba(255, 232, 223, 0.2);
  --color-orange-50: rgba(255, 232, 223, 0.4);
  --color-orange-100: #ffe8df;
  --color-orange-200: #fa9786;
  --color-orange-300: #f05b24;
  --color-orange-400: #b44216;
  --color-orange-500: #7c2b0d;
  --color-orange-600: #481604;
  --color-orange-700: #250701;
  --color-blue-50: rgba(230, 240, 255, 0.4);
  --color-blue-100: #e6f0ff;
  --color-blue-200: #8cb8ff;
  --color-blue-300: #015aff;
  --color-blue-400: #0046d6;
  --color-blue-500: #003cb3;
  --color-blue-600: #00216c;
  --color-blue-700: #000d37;
  --color-clean-data-grey-100: #dbe0d9;
  --color-clean-data-grey-200: #b4b8b2;
  --color-clean-data-grey-300: #8e928d;
  --color-clean-data-grey-400: #6b6d69;
  --color-clean-data-grey-500: #494b4b;
  --color-clean-data-grey-600: #292b29;
  --color-clean-data-grey-700: #101110;
  --color-cluzy-grey-50: rgba(241, 240, 240, 0.4);
  --color-cluzy-grey-100: #f1f0f0;
  --color-cluzy-grey-200: #d7d3d2;
  --color-cluzy-grey-300: #b3aba9;
  --color-cluzy-grey-400: #8e8583;
  --color-cluzy-grey-500: #686260;
  --color-cluzy-grey-600: #45403f;
  --color-cluzy-grey-700: #1e1e1d;
  --color-black-10: rgba(0, 0, 0, 0.1);
  --color-black-20: rgba(0, 0, 0, 0.2);
  --color-black-30: rgba(0, 0, 0, 0.3);
  --color-black-40: rgba(0, 0, 0, 0.4);
  --color-black-50: rgba(0, 0, 0, 0.5);
  --color-black-60: rgba(0, 0, 0, 0.6);
  --color-black-70: rgba(0, 0, 0, 0.7);
  --color-black-80: rgba(0, 0, 0, 0.8);
  --color-black-90: rgba(0, 0, 0, 0.9);
  --color-black-100: #000000;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-transparent: transparent;
  --color-primary-hover: #a4b5eb;
  --bg: var(--color-background);
  --surface: var(--color-surface);
  --surface-2: var(--color-surface-2);
  --border: var(--color-border);
  --text: var(--color-on-surface);
  --text-muted: var(--color-text-muted);
  --primary: var(--color-primary);
  --primary-hover: var(--color-primary-hover);
  --error: var(--color-error);
  --success: var(--color-success);
  --warning: var(--color-warning);
  --info: var(--color-info);
  --accent: var(--color-accent);
  --on-surface: var(--color-on-surface);
  --on-primary: var(--color-on-primary);
  --on-error: #000000;
  --on-success: #000000;
  --on-accent: #000000;
  --color-accent-text: #b2c5ff;
  --accent-text: var(--color-accent-text);
  --border-width: 1px;
  --font-display-large: 400 clamp(36px, 2.25rem + 2.625vw, 57px)/1.12 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-display-large: -0.25px;
  --font-display-large-emphasized: 700 clamp(36px, 2.25rem + 2.625vw, 57px)/1.12 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-display-large-emphasized: -0.25px;
  --font-display-medium: 400 clamp(28px, 1.75rem + 2.125vw, 45px)/1.16 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-display-medium-emphasized: 700 clamp(28px, 1.75rem + 2.125vw, 45px)/1.16 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-display-small: 400 clamp(24px, 1.5rem + 1.5vw, 36px)/1.22 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-display-small-emphasized: 700 clamp(24px, 1.5rem + 1.5vw, 36px)/1.22 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-headline-large: 400 clamp(24px, 1.5rem + 1vw, 32px)/1.25 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-headline-large-emphasized: 700 clamp(24px, 1.5rem + 1vw, 32px)/1.25 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-headline-medium: 400 clamp(22px, 1.375rem + 0.75vw, 28px)/1.29 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-headline-medium-emphasized: 700 clamp(22px, 1.375rem + 0.75vw, 28px)/1.29 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-headline-small: 400 clamp(20px, 1.25rem + 0.5vw, 24px)/1.33 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-headline-small-emphasized: 700 clamp(20px, 1.25rem + 0.5vw, 24px)/1.33 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-title-large: 500 clamp(18px, 1.125rem + 0.5vw, 22px)/1.27 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-title-large-emphasized: 700 clamp(18px, 1.125rem + 0.5vw, 22px)/1.27 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-title-medium: 500 clamp(14px, 0.875rem + 0.25vw, 16px)/1.5 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-title-medium: 0.15px;
  --font-title-medium-emphasized: 700 clamp(14px, 0.875rem + 0.25vw, 16px)/1.5 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-title-medium-emphasized: 0.15px;
  --font-title-small: 500 clamp(12px, 0.75rem + 0.25vw, 14px)/1.43 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-title-small: 0.1px;
  --font-title-small-emphasized: 700 clamp(12px, 0.75rem + 0.25vw, 14px)/1.43 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-title-small-emphasized: 0.1px;
  --font-body-large: 400 clamp(14px, 0.875rem + 0.25vw, 16px)/1.5 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-body-large: 0.5px;
  --font-body-large-emphasized: 700 clamp(14px, 0.875rem + 0.25vw, 16px)/1.5 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-body-large-emphasized: 0.5px;
  --font-body-medium: 400 clamp(12px, 0.75rem + 0.25vw, 14px)/1.43 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-body-medium: 0.25px;
  --font-body-medium-emphasized: 700 clamp(12px, 0.75rem + 0.25vw, 14px)/1.43 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-body-medium-emphasized: 0.25px;
  --font-body-small: 400 clamp(11px, 0.6875rem + 0.125vw, 12px)/1.33 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-body-small: 0.4px;
  --font-body-small-emphasized: 700 clamp(11px, 0.6875rem + 0.125vw, 12px)/1.33 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-body-small-emphasized: 0.4px;
  --font-label-large: 500 14px/1.43 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-label-large: 0.1px;
  --font-label-large-emphasized: 700 14px/1.43 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-label-large-emphasized: 0.1px;
  --font-label-medium: 500 12px/1.33 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-label-medium: 0.5px;
  --font-label-medium-emphasized: 700 12px/1.33 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-label-medium-emphasized: 0.5px;
  --font-label-small: 500 11px/1.45 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-label-small: 0.5px;
  --font-label-small-emphasized: 700 11px/1.45 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-label-small-emphasized: 0.5px;
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-9: 36px;
  --space-10: 40px;
  --space-11: 44px;
  --space-12: 48px;
  --elevation-0: none;
  --elevation-1: 0 1px 2px rgba(0,0,0,0.30), 0 1px 3px 1px rgba(0,0,0,0.15);
  --elevation-2: 0 1px 2px rgba(0,0,0,0.30), 0 2px 6px 2px rgba(0,0,0,0.15);
  --elevation-3: 0 1px 3px rgba(0,0,0,0.30), 0 4px 8px 3px rgba(0,0,0,0.15);
  --elevation-4: 0 2px 3px rgba(0,0,0,0.30), 0 6px 10px 4px rgba(0,0,0,0.15);
  --elevation-5: 0 4px 4px rgba(0,0,0,0.30), 0 8px 12px 6px rgba(0,0,0,0.15);
  --duration-instant: 0ms;
  --duration-fast: 150ms;
  --duration-standard: 250ms;
  --duration-slow: 400ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-emphasized: cubic-bezier(0.3, 0, 0, 1);
  --motion-duration-short: var(--duration-fast);
  --motion-duration-medium: var(--duration-standard);
  --motion-duration-long: var(--duration-slow);
  --motion-easing-standard: var(--ease-standard);
  --motion-easing-emphasized: var(--ease-emphasized);
  --loading-spin-duration: 0.9s;
  --loading-spin-easing: linear;
  --loading-pulse-duration: 1.4s;
  --loading-pulse-min-opacity: 0.7;
  --loading-progress-curve-tau: 0.6;
  --loading-progress-bar-height: 2px;
  --loading-progress-bar-color: var(--accent);
  --motion-spring-fast-spatial: linear(0, 0.037, 0.125, 0.237, 0.355, 0.467, 0.57, 0.659, 0.735, 0.797, 0.848, 0.887, 0.918, 0.942, 0.96, 0.973, 0.983, 0.989, 0.994, 0.997, 0.999, 1, 1.001, 1.001, 1.002, 1.001, 1.001, 1.001, 1);
  --motion-spring-fast-spatial-duration: 224ms;
  --transition-fast-spatial: 224ms linear(0, 0.037, 0.125, 0.237, 0.355, 0.467, 0.57, 0.659, 0.735, 0.797, 0.848, 0.887, 0.918, 0.942, 0.96, 0.973, 0.983, 0.989, 0.994, 0.997, 0.999, 1, 1.001, 1.001, 1.002, 1.001, 1.001, 1.001, 1);
  --motion-spring-fast-effects: linear(0, 0.044, 0.142, 0.261, 0.381, 0.491, 0.589, 0.672, 0.741, 0.797, 0.842, 0.877, 0.906, 0.928, 0.945, 0.958, 0.968, 0.976, 0.982, 0.986, 0.99, 0.992, 0.994, 0.996, 0.997, 0.998, 0.998, 0.999, 1);
  --motion-spring-fast-effects-duration: 150ms;
  --transition-fast-effects: 150ms linear(0, 0.044, 0.142, 0.261, 0.381, 0.491, 0.589, 0.672, 0.741, 0.797, 0.842, 0.877, 0.906, 0.928, 0.945, 0.958, 0.968, 0.976, 0.982, 0.986, 0.99, 0.992, 0.994, 0.996, 0.997, 0.998, 0.998, 0.999, 1);
  --motion-spring-default-spatial: linear(0, 0.038, 0.126, 0.237, 0.355, 0.468, 0.57, 0.66, 0.735, 0.798, 0.848, 0.888, 0.919, 0.942, 0.96, 0.973, 0.983, 0.989, 0.994, 0.997, 0.999, 1, 1.001, 1.001, 1.002, 1.001, 1.001, 1.001, 1);
  --motion-spring-default-spatial-duration: 317ms;
  --transition-default-spatial: 317ms linear(0, 0.038, 0.126, 0.237, 0.355, 0.468, 0.57, 0.66, 0.735, 0.798, 0.848, 0.888, 0.919, 0.942, 0.96, 0.973, 0.983, 0.989, 0.994, 0.997, 0.999, 1, 1.001, 1.001, 1.002, 1.001, 1.001, 1.001, 1);
  --motion-spring-default-effects: linear(0, 0.044, 0.143, 0.262, 0.382, 0.493, 0.591, 0.674, 0.742, 0.798, 0.843, 0.879, 0.907, 0.929, 0.946, 0.959, 0.969, 0.976, 0.982, 0.987, 0.99, 0.992, 0.994, 0.996, 0.997, 0.998, 0.998, 0.999, 1);
  --motion-spring-default-effects-duration: 232ms;
  --transition-default-effects: 232ms linear(0, 0.044, 0.143, 0.262, 0.382, 0.493, 0.591, 0.674, 0.742, 0.798, 0.843, 0.879, 0.907, 0.929, 0.946, 0.959, 0.969, 0.976, 0.982, 0.987, 0.99, 0.992, 0.994, 0.996, 0.997, 0.998, 0.998, 0.999, 1);
  --motion-spring-slow-spatial: linear(0, 0.037, 0.126, 0.237, 0.355, 0.468, 0.57, 0.659, 0.735, 0.797, 0.848, 0.887, 0.918, 0.942, 0.96, 0.973, 0.983, 0.989, 0.994, 0.997, 0.999, 1, 1.001, 1.001, 1.002, 1.001, 1.001, 1.001, 1);
  --motion-spring-slow-spatial-duration: 484ms;
  --transition-slow-spatial: 484ms linear(0, 0.037, 0.126, 0.237, 0.355, 0.468, 0.57, 0.659, 0.735, 0.797, 0.848, 0.887, 0.918, 0.942, 0.96, 0.973, 0.983, 0.989, 0.994, 0.997, 0.999, 1, 1.001, 1.001, 1.002, 1.001, 1.001, 1.001, 1);
  --motion-spring-slow-effects: linear(0, 0.044, 0.142, 0.261, 0.381, 0.492, 0.589, 0.672, 0.741, 0.797, 0.842, 0.878, 0.906, 0.928, 0.945, 0.958, 0.968, 0.976, 0.982, 0.986, 0.99, 0.992, 0.994, 0.996, 0.997, 0.998, 0.998, 0.999, 1);
  --motion-spring-slow-effects-duration: 327ms;
  --transition-slow-effects: 327ms linear(0, 0.044, 0.142, 0.261, 0.381, 0.492, 0.589, 0.672, 0.741, 0.797, 0.842, 0.878, 0.906, 0.928, 0.945, 0.958, 0.968, 0.976, 0.982, 0.986, 0.99, 0.992, 0.994, 0.996, 0.997, 0.998, 0.998, 0.999, 1);
  --icon-stroke: 1.5px;
  --icon-radius: 2px;
  --icon-font-family: "Material Symbols Rounded";
  --icon-fill: 0;
  --icon-wght: 400;
  --icon-grad: 0;
  --icon-opsz: 24;
  --icon-size: 24px;
  --density: standard;
  --pangeon-page-gutter: clamp(var(--space-3), 2vw, var(--space-6));
  --pangeon-page-top: clamp(var(--space-2), 1.5vw, var(--space-4));
  --pangeon-page-bottom: clamp(var(--space-6), 5vw, var(--space-12));
  --pangeon-page-header-gap: var(--space-2);
  --pangeon-panel-gap: var(--space-3);
  --pangeon-surface-padding: var(--space-4);
  --pangeon-control-group-gap: var(--space-2);
  --pangeon-toolbar-gap: var(--space-2);
  --pangeon-toolbar-padding: var(--space-1);
  --pangeon-metadata-gap: var(--space-2);
  --pangeon-caption-gap: var(--space-2);
  --pangeon-table-cell-padding: var(--space-2) var(--space-3);
  --pangeon-overlay-inset: var(--space-2);
  --pangeon-overlay-padding: var(--space-1);
  --pangeon-scroll-container-padding: var(--space-3);
  --pangeon-empty-state-padding: var(--space-8);
  --color-overlay-soft: rgba(255,255,255,0.06);
  --color-overlay-light: rgba(255,255,255,0.12);
  --color-overlay-medium: rgba(255,255,255,0.20);
  --color-shadow-soft: rgba(0,0,0,0.15);
  --color-shadow-medium: rgba(0,0,0,0.25);
  --color-shadow-strong: rgba(0,0,0,0.40);
  --color-shadow-heavy: rgba(0,0,0,0.60);
  /* StyleGuide → buttons */
  --button-radius: 4px;
  --button-padding-x: 16px;
  --button-padding-y: 10px;
  --button-font-size: 16px;
  --button-font-weight: 500;
  --button-primary-bg: #1728d6;
  --button-primary-fg: #ffffff;
  --button-primary-border: #ffffff;
  --button-primary-bg-hover: #4553de;
  --button-secondary-bg: #ffffff;
  --button-secondary-fg: #05082b;
  --button-secondary-border: #ffffff;
  --button-secondary-bg-hover: #e8e9fb;
  --button-accent-bg: #1728d6;
  --button-accent-fg: #ffffff;
  --button-accent-border: #ffffff;
  --button-accent-bg-hover: #4553de;
  --button-info-bg: #ffffff;
  --button-info-fg: #05082b;
  --button-info-border: #ffffff;
  --button-info-bg-hover: #e8e9fb;
  --cta-radius: 4px;
  --cta-padding-x: 16px;
  --cta-padding-y: 10px;
  --cta-min-height: 48px;
  --cta-font: 500 16px/1.43 var(--font-body);
  --cta-primary-bg: #1728d6;
  --cta-primary-fg: #ffffff;
  --cta-secondary-bg: #ffffff;
  --cta-secondary-fg: #05082b;
  --cta-secondary-border: 1px solid #1728d6;
  --button-primary-hover-bg: var(--color-button-hover);
  --button-primary-hover-fg: #ffffff;
  --button-primary-hover-border: var(--color-button-hover);
  --button-primary-hover-filter: none;
  --button-primary-focus-bg: var(--button-primary-hover-bg);
  --button-primary-focus-fg: var(--button-primary-hover-fg);
  --button-primary-focus-border: var(--button-primary-hover-border);
  --button-primary-pressed-bg: var(--color-button-pressed);
  --button-primary-pressed-fg: var(--color-button-pressed-label);
  --button-primary-pressed-border: var(--color-button-pressed);
  --button-primary-pressed-filter: none;
  --button-primary-disabled-bg: var(--color-black-10);
  --button-primary-disabled-fg: color-mix(in srgb, var(--color-button-disabled-label) 38%, transparent);
  --button-primary-disabled-border: transparent;
  --button-primary-disabled-opacity: 1;
  --button-secondary-border-width: 2px;
  --button-secondary-hover-bg: #e8e9fb;
  --button-secondary-hover-fg: var(--color-button-outline-label);
  --button-secondary-hover-filter: none;
  --button-secondary-focus-bg: var(--button-secondary-hover-bg);
  --button-secondary-focus-fg: var(--button-secondary-hover-fg);
  --button-secondary-focus-border: var(--button-secondary-hover-border);
  --button-secondary-pressed-bg: var(--color-button-outline-pressed);
  --button-secondary-pressed-fg: var(--color-button-outline-pressed-label);
  --button-secondary-pressed-border: var(--color-button-hover);
  --button-secondary-pressed-filter: none;
  --button-secondary-disabled-bg: var(--color-black-10);
  --button-secondary-disabled-fg: color-mix(in srgb, var(--color-button-outline-disabled-label) 38%, transparent);
  --button-secondary-disabled-border: var(--color-button-outline-disabled-border);
  --button-secondary-disabled-opacity: 1;
  --button-accent-hover-bg: var(--color-button-hover);
  --button-accent-hover-fg: #ffffff;
  --button-accent-hover-border: var(--color-button-hover);
  --button-accent-hover-filter: none;
  --button-accent-focus-bg: var(--button-accent-hover-bg);
  --button-accent-focus-fg: var(--button-accent-hover-fg);
  --button-accent-focus-border: var(--button-accent-hover-border);
  --button-accent-pressed-bg: var(--color-button-pressed);
  --button-accent-pressed-fg: var(--color-button-pressed-label);
  --button-accent-pressed-border: var(--color-button-pressed);
  --button-accent-pressed-filter: none;
  --button-accent-disabled-bg: var(--color-black-10);
  --button-accent-disabled-fg: color-mix(in srgb, var(--color-button-disabled-label) 38%, transparent);
  --button-accent-disabled-border: transparent;
  --button-accent-disabled-opacity: 1;
  --button-info-border-width: 2px;
  --button-info-hover-bg: #e8e9fb;
  --button-info-hover-fg: var(--color-button-outline-label);
  --button-info-hover-filter: none;
  --button-info-focus-bg: var(--button-info-hover-bg);
  --button-info-focus-fg: var(--button-info-hover-fg);
  --button-info-focus-border: var(--button-info-hover-border);
  --button-info-pressed-bg: var(--color-button-outline-pressed);
  --button-info-pressed-fg: var(--color-button-outline-pressed-label);
  --button-info-pressed-border: var(--color-button-hover);
  --button-info-pressed-filter: none;
  --button-info-disabled-bg: var(--color-black-10);
  --button-info-disabled-fg: color-mix(in srgb, var(--color-button-outline-disabled-label) 38%, transparent);
  --button-info-disabled-border: var(--color-button-outline-disabled-border);
  --button-info-disabled-opacity: 1;
  --cta-primary-hover-bg: var(--color-button-hover);
  --cta-primary-hover-fg: #ffffff;
  --cta-primary-hover-border: 1px solid var(--color-button-hover);
  --cta-primary-focus-bg: var(--cta-primary-hover-bg);
  --cta-primary-focus-fg: var(--cta-primary-hover-fg);
  --cta-primary-focus-border: var(--cta-primary-hover-border);
  --cta-primary-pressed-bg: var(--color-button-pressed);
  --cta-primary-pressed-fg: var(--color-button-pressed-label);
  --cta-primary-pressed-border: 1px solid var(--color-button-pressed);
  --cta-primary-disabled-bg: var(--color-black-10);
  --cta-primary-disabled-fg: color-mix(in srgb, var(--color-button-disabled-label) 38%, transparent);
  --cta-primary-disabled-border: 1px solid transparent;
  --cta-secondary-hover-bg: #e8e9fb;
  --cta-secondary-hover-fg: var(--color-button-outline-label);
  --cta-secondary-focus-bg: var(--cta-secondary-hover-bg);
  --cta-secondary-focus-fg: var(--cta-secondary-hover-fg);
  --cta-secondary-focus-border: var(--cta-secondary-hover-border);
  --cta-secondary-pressed-bg: var(--color-button-outline-pressed);
  --cta-secondary-pressed-fg: var(--color-button-outline-pressed-label);
  --cta-secondary-pressed-border: 1px solid var(--color-button-hover);
  --cta-secondary-disabled-bg: var(--color-black-10);
  --cta-secondary-disabled-fg: color-mix(in srgb, var(--color-button-outline-disabled-label) 38%, transparent);
  --cta-secondary-disabled-border: 1px solid var(--color-button-outline-disabled-border);
  /* StyleGuide → fonts */
  --font-body: "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-heading: "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-weight-regular: 400;
  --font-weight-medium: 600;
  --font-weight-bold: 800;
  --line-height-body: 1.5;
  --type-caption: 14.17px;
  --type-body: 17px;
  --type-title: 20.4px;
  --type-headline: 24.48px;
  --fontsize-fluid-sm: 14.17px;
  --fontsize-fluid-md: 17px;
  --fontsize-fluid-lg: 20.4px;
  --type-heading-1: clamp(29.38px, calc(29.38px + 1.5vw), 35.25px);
  --type-heading-2: clamp(24.48px, calc(24.48px + 1vw), 29.38px);
  --type-heading-3: clamp(20.4px, calc(20.4px + 0.6vw), 24.48px);
  /* StyleGuide → typography roles */
  --typography-legal-font-family: var(--font-body);
  --typography-legal-size: 17px;
  --typography-legal-line-height: 1.65;
  /* StyleGuide → shapes */
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 10px;
  --radius-xl: 10px;
  --radius-extra-small: var(--radius-sm);
  --radius-large-increased: var(--radius-lg);
  --radius-extra-large-increased: var(--radius-xl);
  --radius-extra-extra-large: var(--radius-xl);
  /* StyleGuide → modals */
  --modal-bg: #00216c;
  --modal-fg: #ffffff;
  --modal-backdrop: rgba(0, 0, 0, 0.7);
  --modal-radius: var(--radius-lg);
  /* StyleGuide → forms */
  --form-error-color: #fa9786;
  --form-control-bg: #00216c;
  --form-control-fg: #ffffff;
  --form-control-border: #8cb8ff;
  --form-control-focus-border: #8cb8ff;
  --form-control-radius: var(--radius-sm);
  --form-control-chevron-color: #ffffff;
  --form-control-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff' d='M2 4l4 4 4-4'/%3E%3C/svg%3E");
  /* StyleGuide → header/navigation */
  --pangeon-nav-background: #ffffff;
  --pangeon-nav-foreground: #101115;
  --pangeon-nav-active-accent: #1728d6;
  --pangeon-nav-border-color: #898280;
  --pangeon-nav-border: 1px solid #898280;
  --pangeon-nav-height: calc(var(--space-touch) + 1.5rem);
  --pangeon-nav-title-weight: 700;
  --pangeon-nav-back-color: var(--color-banner-back);
  --pangeon-nav-actions-gap: var(--space-3);
  --pangeon-nav-spoke-breakpoint: 720px;
  --pangeon-nav-avatar-ring: var(--color-avatar-ring);
  --pangeon-nav-action-size: var(--control-size-sm);
  --pangeon-nav-action-background: var(--color-tile-fill);
  --pangeon-nav-action-ring: var(--color-card-outline);
  /* StyleGuide -> surfaces (page, card, panel, tile, ...) */
  --surface-page-bg: var(--color-page-tint);
  --surface-card-bg: var(--color-card-fill);
  --surface-card-border: none;
  --surface-card-radius: var(--radius-md);
  --surface-card-shadow: var(--elevation-1);
  --surface-card-padding: var(--pangeon-surface-padding);
  --surface-panel-bg: var(--color-card-fill);
  --surface-panel-border: none;
  --surface-panel-radius: var(--radius-md);
  --surface-panel-shadow: var(--elevation-1);
  --surface-panel-padding: var(--pangeon-surface-padding);
  --surface-default-bg: var(--color-card-fill);
  --surface-default-border: none;
  --surface-default-radius: var(--radius-md);
  --surface-default-shadow: var(--elevation-1);
  --surface-elevated-bg: var(--color-card-fill);
  --surface-elevated-border: none;
  --surface-elevated-radius: var(--radius-md);
  --surface-elevated-shadow: var(--elevation-2);
  --surface-tile-bg: var(--color-card-fill);
  --surface-tile-border: var(--border-thin) var(--border-style) var(--color-card-outline);
  --surface-tile-radius: var(--radius-md);
  --surface-tile-shadow: var(--elevation-0);
  --surface-tile-padding: var(--space-2);
  --surface-inset-bg: var(--color-card-fill);
  --surface-inset-border: var(--border-thin) var(--border-style) var(--color-card-outline);
  --surface-inset-radius: var(--radius-md);
  --surface-inset-shadow: var(--elevation-0);
  /* StyleGuide -> nav.places (bottom tabs / rail) */
  --pangeon-places-rail-from: 720px;
  --pangeon-places-ink: var(--color-nav-ink);
  --pangeon-places-selected-bg: var(--color-nav-selected);
  --pangeon-places-selected-fg: var(--color-nav-on-selected);
  --pangeon-places-selected-weight: 700;
  --pangeon-places-selected-radius: var(--radius-sm);
  --pangeon-places-disabled-opacity: 0.4;
  /* StyleGuide -> feedback.fab */
  --pangeon-feedback-fab-bg: var(--color-card-fill);
  --pangeon-feedback-fab-fg: var(--primary);
  --pangeon-feedback-fab-border: var(--border-width) solid var(--color-primary);
  --pangeon-feedback-fab-shadow: var(--elevation-1);
}
:root[data-theme="light"] {
  --radius-none: 0px;
  --radius-extra-small: 4px;
  --radius-large-increased: 20px;
  --radius-extra-large-increased: 32px;
  --radius-extra-extra-large: 48px;
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 10px;
  --radius-xl: 8px;
  --radius-small: var(--radius-sm);
  --radius-medium: var(--radius-md);
  --radius-large: var(--radius-lg);
  --radius-extra-large: var(--radius-xl);
  --color-surface: #ffffff;
  --color-on-surface: #1e1e1d;
  --color-primary: #4c5c92;
  --color-on-primary: #ffffff;
  --color-accent: #003cb3;
  --color-success: #0046d6;
  --color-warning: #b57e00;
  --color-error: #000d37;
  --color-primary-container: #dce1ff;
  --color-on-primary-container: #344479;
  --color-secondary: #595e72;
  --color-on-secondary: #ffffff;
  --color-secondary-container: #dee1f9;
  --color-on-secondary-container: #414659;
  --color-tertiary: #755470;
  --color-on-tertiary: #ffffff;
  --color-tertiary-container: #ffd7f6;
  --color-on-tertiary-container: #5b3d57;
  --color-error-container: #ffdad6;
  --color-on-error-container: #93000a;
  --color-surface-variant: #e2e1ec;
  --color-surface-container-lowest: #ffffff;
  --color-surface-container-low: #f1f0f0;
  --color-surface-container: #f1f0f0;
  --color-surface-container-high: #d7d3d2;
  --color-surface-container-highest: #e3e1e9;
  --color-outline-variant: #898280;
  --color-inverse-surface: #2f3036;
  --color-on-inverse-surface: #f1f0f7;
  --color-inverse-primary: #b6c4ff;
  --color-scrim: #000000;
  --color-background: #ffffff;
  --color-surface-2: #f1f0f0;
  --color-text-muted: #686260;
  --color-border: #898280;
  --color-info: #015aff;
  --color-backdrop: rgba(0, 0, 0, 0.4);
  --color-landing-blue: #205bff;
  --color-landing-blue-soft: #eaf0ff;
  --color-landing-navy: #0e1b3d;
  --color-landing-ink: #16213a;
  --color-landing-muted: #5d6880;
  --color-landing-bg: #f4f6fa;
  --color-landing-line: #e3e7ef;
  --color-landing-red: #a8321e;
  --color-landing-red-soft: #fbeae6;
  --color-landing-gold-ink: #8a6508;
  --color-landing-gold-soft: #fdf5dc;
  --color-login-heading: #0e1880;
  --color-button-quiet: #1728d6;
  --color-button-pressed: #747ee6;
  --color-button-pressed-label: #ffffff;
  --color-button-hover: #4553de;
  --color-button-outline-fill: #ffffff;
  --color-page-tint: #e8e9fb;
  --color-card-fill: #ffffff;
  --color-tile-fill: #edeef0;
  --color-tile-border: #dcdde1;
  --color-card-outline: #d1d4f7;
  --color-banner-back: #1220ab;
  --color-banner-title: #101115;
  --color-avatar-ring: #a2a9ef;
  --color-button-outline-label: #05082b;
  --color-button-outline-pressed-label: #0e1880;
  --color-button-disabled-label: #0e3b8b;
  --color-button-outline-disabled-border: #cac4d0;
  --color-button-outline-disabled-label: #1d1b20;
  --color-button-outline-pressed: #f3f4fd;
  --color-login-action: #1728d6;
  --color-nav-ink: #0e1880;
  --color-nav-selected: #1728d6;
  --color-nav-on-selected: #ffffff;
  --color-primary: #015aff;
  --color-on-surface-variant: #686260;
  --color-outline: #b3aba9;
  --color-m3-error: #003cb3;
  --color-m3-on-primary: #ffffff;
  --color-figma-selection-purple: #9747ff;
  --color-chart-identity: #015aff;
  --color-chart-location: #007a5a;
  --color-chart-contact: #bd3f0c;
  --color-chart-relationships: #7040c8;
  --color-sumi-ink: #000000;
  --color-vip-gold-deep: #7e5306;
  --color-vip-gold-shadow: #ad791a;
  --color-vip-gold-mid: #c89327;
  --color-vip-gold-warm: #daa533;
  --color-vip-gold-light: #e8bf59;
  --color-vip-gold-highlight: #fff3b3;
  --color-b2b-primary: #015aff;
  --color-b2b-primary-dim: #0046d6;
  --color-b2b-accent: #ffe8df;
  --color-b2b-success: #003cb3;
  --color-b2b-success-dim: #000d37;
  --color-b2b-background: #ffffff;
  --color-b2b-background-deep: #ffffff;
  --color-b2b-surface: #f1f0f0;
  --color-b2b-surface-2: #e6f0ff;
  --color-b2b-border: #b3aba9;
  --color-b2b-on-surface: #1e1e1d;
  --color-b2b-on-surface-variant: #686260;
  --color-b2b-subtle: #e6f0ff;
  --color-b2b-on-primary: #ffffff;
  --color-cluzy-story-blue: #015aff;
  --color-cluzy-story-blue-dim: #0046d6;
  --color-cluzy-story-orange: #ffe8df;
  --color-cluzy-story-green: #003cb3;
  --color-cluzy-story-green-dim: #000d37;
  --color-cluzy-story-bg: #ffffff;
  --color-cluzy-story-bg-deep: #ffffff;
  --color-cluzy-story-panel: #f1f0f0;
  --color-cluzy-story-panel-2: #e6f0ff;
  --color-cluzy-story-border: #b3aba9;
  --color-cluzy-story-text: #1e1e1d;
  --color-cluzy-story-muted: #686260;
  --color-cluzy-story-subtle: #e6f0ff;
  --color-green-100: #95f829;
  --color-green-200: #7acc20;
  --color-green-300: #60a217;
  --color-green-400: #477a0f;
  --color-green-500: #2f5407;
  --color-green-600: #193102;
  --color-green-700: #071401;
  --color-yellow-100: #feefd6;
  --color-yellow-200: #f5c842;
  --color-yellow-300: #c7a234;
  --color-yellow-400: #9b7d26;
  --color-yellow-500: #715819;
  --color-yellow-600: #493a0d;
  --color-yellow-700: #251c04;
  --color-orange-10: rgba(255, 232, 223, 0.2);
  --color-orange-50: rgba(255, 232, 223, 0.4);
  --color-orange-100: #ffe8df;
  --color-orange-200: #fa9786;
  --color-orange-300: #f05b24;
  --color-orange-400: #b44216;
  --color-orange-500: #7c2b0d;
  --color-orange-600: #481604;
  --color-orange-700: #250701;
  --color-blue-50: rgba(230, 240, 255, 0.4);
  --color-blue-100: #e6f0ff;
  --color-blue-200: #8cb8ff;
  --color-blue-300: #015aff;
  --color-blue-400: #0046d6;
  --color-blue-500: #003cb3;
  --color-blue-600: #00216c;
  --color-blue-700: #000d37;
  --color-clean-data-grey-100: #dbe0d9;
  --color-clean-data-grey-200: #b4b8b2;
  --color-clean-data-grey-300: #8e928d;
  --color-clean-data-grey-400: #6b6d69;
  --color-clean-data-grey-500: #494b4b;
  --color-clean-data-grey-600: #292b29;
  --color-clean-data-grey-700: #101110;
  --color-cluzy-grey-50: rgba(241, 240, 240, 0.4);
  --color-cluzy-grey-100: #f1f0f0;
  --color-cluzy-grey-200: #d7d3d2;
  --color-cluzy-grey-300: #b3aba9;
  --color-cluzy-grey-400: #8e8583;
  --color-cluzy-grey-500: #686260;
  --color-cluzy-grey-600: #45403f;
  --color-cluzy-grey-700: #1e1e1d;
  --color-black-10: rgba(0, 0, 0, 0.1);
  --color-black-20: rgba(0, 0, 0, 0.2);
  --color-black-30: rgba(0, 0, 0, 0.3);
  --color-black-40: rgba(0, 0, 0, 0.4);
  --color-black-50: rgba(0, 0, 0, 0.5);
  --color-black-60: rgba(0, 0, 0, 0.6);
  --color-black-70: rgba(0, 0, 0, 0.7);
  --color-black-80: rgba(0, 0, 0, 0.8);
  --color-black-90: rgba(0, 0, 0, 0.9);
  --color-black-100: #000000;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-transparent: transparent;
  --color-primary-hover: #5a699b;
  --bg: var(--color-background);
  --surface: var(--color-surface);
  --surface-2: var(--color-surface-2);
  --border: var(--color-border);
  --text: var(--color-on-surface);
  --text-muted: var(--color-text-muted);
  --primary: var(--color-primary);
  --primary-hover: var(--color-primary-hover);
  --error: var(--color-error);
  --success: var(--color-success);
  --warning: var(--color-warning);
  --info: var(--color-info);
  --accent: var(--color-accent);
  --on-surface: var(--color-on-surface);
  --on-primary: var(--color-on-primary);
  --on-error: #ffffff;
  --on-success: #ffffff;
  --on-accent: #ffffff;
  --color-accent-text: #4c5c92;
  --accent-text: var(--color-accent-text);
  --border-width: 1px;
  --font-display-large: 400 clamp(36px, 2.25rem + 2.625vw, 57px)/1.12 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-display-large: -0.25px;
  --font-display-large-emphasized: 700 clamp(36px, 2.25rem + 2.625vw, 57px)/1.12 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-display-large-emphasized: -0.25px;
  --font-display-medium: 400 clamp(28px, 1.75rem + 2.125vw, 45px)/1.16 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-display-medium-emphasized: 700 clamp(28px, 1.75rem + 2.125vw, 45px)/1.16 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-display-small: 400 clamp(24px, 1.5rem + 1.5vw, 36px)/1.22 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-display-small-emphasized: 700 clamp(24px, 1.5rem + 1.5vw, 36px)/1.22 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-headline-large: 400 clamp(24px, 1.5rem + 1vw, 32px)/1.25 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-headline-large-emphasized: 700 clamp(24px, 1.5rem + 1vw, 32px)/1.25 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-headline-medium: 400 clamp(22px, 1.375rem + 0.75vw, 28px)/1.29 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-headline-medium-emphasized: 700 clamp(22px, 1.375rem + 0.75vw, 28px)/1.29 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-headline-small: 400 clamp(20px, 1.25rem + 0.5vw, 24px)/1.33 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-headline-small-emphasized: 700 clamp(20px, 1.25rem + 0.5vw, 24px)/1.33 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-title-large: 500 clamp(18px, 1.125rem + 0.5vw, 22px)/1.27 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-title-large-emphasized: 700 clamp(18px, 1.125rem + 0.5vw, 22px)/1.27 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-title-medium: 500 clamp(14px, 0.875rem + 0.25vw, 16px)/1.5 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-title-medium: 0.15px;
  --font-title-medium-emphasized: 700 clamp(14px, 0.875rem + 0.25vw, 16px)/1.5 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-title-medium-emphasized: 0.15px;
  --font-title-small: 500 clamp(12px, 0.75rem + 0.25vw, 14px)/1.43 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-title-small: 0.1px;
  --font-title-small-emphasized: 700 clamp(12px, 0.75rem + 0.25vw, 14px)/1.43 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-title-small-emphasized: 0.1px;
  --font-body-large: 400 clamp(14px, 0.875rem + 0.25vw, 16px)/1.5 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-body-large: 0.5px;
  --font-body-large-emphasized: 700 clamp(14px, 0.875rem + 0.25vw, 16px)/1.5 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-body-large-emphasized: 0.5px;
  --font-body-medium: 400 clamp(12px, 0.75rem + 0.25vw, 14px)/1.43 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-body-medium: 0.25px;
  --font-body-medium-emphasized: 700 clamp(12px, 0.75rem + 0.25vw, 14px)/1.43 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-body-medium-emphasized: 0.25px;
  --font-body-small: 400 clamp(11px, 0.6875rem + 0.125vw, 12px)/1.33 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-body-small: 0.4px;
  --font-body-small-emphasized: 700 clamp(11px, 0.6875rem + 0.125vw, 12px)/1.33 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-body-small-emphasized: 0.4px;
  --font-label-large: 500 14px/1.43 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-label-large: 0.1px;
  --font-label-large-emphasized: 700 14px/1.43 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-label-large-emphasized: 0.1px;
  --font-label-medium: 500 12px/1.33 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-label-medium: 0.5px;
  --font-label-medium-emphasized: 700 12px/1.33 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-label-medium-emphasized: 0.5px;
  --font-label-small: 500 11px/1.45 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-label-small: 0.5px;
  --font-label-small-emphasized: 700 11px/1.45 "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --tracking-label-small-emphasized: 0.5px;
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-9: 36px;
  --space-10: 40px;
  --space-11: 44px;
  --space-12: 48px;
  --elevation-0: none;
  --elevation-1: 0 1px 2px rgba(0,0,0,0.30), 0 1px 3px 1px rgba(0,0,0,0.15);
  --elevation-2: 0 1px 2px rgba(0,0,0,0.30), 0 2px 6px 2px rgba(0,0,0,0.15);
  --elevation-3: 0 1px 3px rgba(0,0,0,0.30), 0 4px 8px 3px rgba(0,0,0,0.15);
  --elevation-4: 0 2px 3px rgba(0,0,0,0.30), 0 6px 10px 4px rgba(0,0,0,0.15);
  --elevation-5: 0 4px 4px rgba(0,0,0,0.30), 0 8px 12px 6px rgba(0,0,0,0.15);
  --duration-instant: 0ms;
  --duration-fast: 150ms;
  --duration-standard: 250ms;
  --duration-slow: 400ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-emphasized: cubic-bezier(0.3, 0, 0, 1);
  --motion-duration-short: var(--duration-fast);
  --motion-duration-medium: var(--duration-standard);
  --motion-duration-long: var(--duration-slow);
  --motion-easing-standard: var(--ease-standard);
  --motion-easing-emphasized: var(--ease-emphasized);
  --loading-spin-duration: 0.9s;
  --loading-spin-easing: linear;
  --loading-pulse-duration: 1.4s;
  --loading-pulse-min-opacity: 0.7;
  --loading-progress-curve-tau: 0.6;
  --loading-progress-bar-height: 2px;
  --loading-progress-bar-color: var(--accent);
  --motion-spring-fast-spatial: linear(0, 0.037, 0.125, 0.237, 0.355, 0.467, 0.57, 0.659, 0.735, 0.797, 0.848, 0.887, 0.918, 0.942, 0.96, 0.973, 0.983, 0.989, 0.994, 0.997, 0.999, 1, 1.001, 1.001, 1.002, 1.001, 1.001, 1.001, 1);
  --motion-spring-fast-spatial-duration: 224ms;
  --transition-fast-spatial: 224ms linear(0, 0.037, 0.125, 0.237, 0.355, 0.467, 0.57, 0.659, 0.735, 0.797, 0.848, 0.887, 0.918, 0.942, 0.96, 0.973, 0.983, 0.989, 0.994, 0.997, 0.999, 1, 1.001, 1.001, 1.002, 1.001, 1.001, 1.001, 1);
  --motion-spring-fast-effects: linear(0, 0.044, 0.142, 0.261, 0.381, 0.491, 0.589, 0.672, 0.741, 0.797, 0.842, 0.877, 0.906, 0.928, 0.945, 0.958, 0.968, 0.976, 0.982, 0.986, 0.99, 0.992, 0.994, 0.996, 0.997, 0.998, 0.998, 0.999, 1);
  --motion-spring-fast-effects-duration: 150ms;
  --transition-fast-effects: 150ms linear(0, 0.044, 0.142, 0.261, 0.381, 0.491, 0.589, 0.672, 0.741, 0.797, 0.842, 0.877, 0.906, 0.928, 0.945, 0.958, 0.968, 0.976, 0.982, 0.986, 0.99, 0.992, 0.994, 0.996, 0.997, 0.998, 0.998, 0.999, 1);
  --motion-spring-default-spatial: linear(0, 0.038, 0.126, 0.237, 0.355, 0.468, 0.57, 0.66, 0.735, 0.798, 0.848, 0.888, 0.919, 0.942, 0.96, 0.973, 0.983, 0.989, 0.994, 0.997, 0.999, 1, 1.001, 1.001, 1.002, 1.001, 1.001, 1.001, 1);
  --motion-spring-default-spatial-duration: 317ms;
  --transition-default-spatial: 317ms linear(0, 0.038, 0.126, 0.237, 0.355, 0.468, 0.57, 0.66, 0.735, 0.798, 0.848, 0.888, 0.919, 0.942, 0.96, 0.973, 0.983, 0.989, 0.994, 0.997, 0.999, 1, 1.001, 1.001, 1.002, 1.001, 1.001, 1.001, 1);
  --motion-spring-default-effects: linear(0, 0.044, 0.143, 0.262, 0.382, 0.493, 0.591, 0.674, 0.742, 0.798, 0.843, 0.879, 0.907, 0.929, 0.946, 0.959, 0.969, 0.976, 0.982, 0.987, 0.99, 0.992, 0.994, 0.996, 0.997, 0.998, 0.998, 0.999, 1);
  --motion-spring-default-effects-duration: 232ms;
  --transition-default-effects: 232ms linear(0, 0.044, 0.143, 0.262, 0.382, 0.493, 0.591, 0.674, 0.742, 0.798, 0.843, 0.879, 0.907, 0.929, 0.946, 0.959, 0.969, 0.976, 0.982, 0.987, 0.99, 0.992, 0.994, 0.996, 0.997, 0.998, 0.998, 0.999, 1);
  --motion-spring-slow-spatial: linear(0, 0.037, 0.126, 0.237, 0.355, 0.468, 0.57, 0.659, 0.735, 0.797, 0.848, 0.887, 0.918, 0.942, 0.96, 0.973, 0.983, 0.989, 0.994, 0.997, 0.999, 1, 1.001, 1.001, 1.002, 1.001, 1.001, 1.001, 1);
  --motion-spring-slow-spatial-duration: 484ms;
  --transition-slow-spatial: 484ms linear(0, 0.037, 0.126, 0.237, 0.355, 0.468, 0.57, 0.659, 0.735, 0.797, 0.848, 0.887, 0.918, 0.942, 0.96, 0.973, 0.983, 0.989, 0.994, 0.997, 0.999, 1, 1.001, 1.001, 1.002, 1.001, 1.001, 1.001, 1);
  --motion-spring-slow-effects: linear(0, 0.044, 0.142, 0.261, 0.381, 0.492, 0.589, 0.672, 0.741, 0.797, 0.842, 0.878, 0.906, 0.928, 0.945, 0.958, 0.968, 0.976, 0.982, 0.986, 0.99, 0.992, 0.994, 0.996, 0.997, 0.998, 0.998, 0.999, 1);
  --motion-spring-slow-effects-duration: 327ms;
  --transition-slow-effects: 327ms linear(0, 0.044, 0.142, 0.261, 0.381, 0.492, 0.589, 0.672, 0.741, 0.797, 0.842, 0.878, 0.906, 0.928, 0.945, 0.958, 0.968, 0.976, 0.982, 0.986, 0.99, 0.992, 0.994, 0.996, 0.997, 0.998, 0.998, 0.999, 1);
  --icon-stroke: 1.5px;
  --icon-radius: 2px;
  --icon-font-family: "Material Symbols Rounded";
  --icon-fill: 0;
  --icon-wght: 400;
  --icon-grad: 0;
  --icon-opsz: 24;
  --icon-size: 24px;
  --density: standard;
  --pangeon-page-gutter: clamp(var(--space-3), 2vw, var(--space-6));
  --pangeon-page-top: clamp(var(--space-2), 1.5vw, var(--space-4));
  --pangeon-page-bottom: clamp(var(--space-6), 5vw, var(--space-12));
  --pangeon-page-header-gap: var(--space-2);
  --pangeon-panel-gap: var(--space-3);
  --pangeon-surface-padding: var(--space-4);
  --pangeon-control-group-gap: var(--space-2);
  --pangeon-toolbar-gap: var(--space-2);
  --pangeon-toolbar-padding: var(--space-1);
  --pangeon-metadata-gap: var(--space-2);
  --pangeon-caption-gap: var(--space-2);
  --pangeon-table-cell-padding: var(--space-2) var(--space-3);
  --pangeon-overlay-inset: var(--space-2);
  --pangeon-overlay-padding: var(--space-1);
  --pangeon-scroll-container-padding: var(--space-3);
  --pangeon-empty-state-padding: var(--space-8);
  --color-overlay-soft: rgba(255,255,255,0.06);
  --color-overlay-light: rgba(255,255,255,0.12);
  --color-overlay-medium: rgba(255,255,255,0.20);
  --color-shadow-soft: rgba(0,0,0,0.15);
  --color-shadow-medium: rgba(0,0,0,0.25);
  --color-shadow-strong: rgba(0,0,0,0.40);
  --color-shadow-heavy: rgba(0,0,0,0.60);
  /* StyleGuide → buttons */
  --button-radius: 4px;
  --button-padding-x: 16px;
  --button-padding-y: 10px;
  --button-font-size: 16px;
  --button-font-weight: 500;
  --button-primary-bg: #1728d6;
  --button-primary-fg: #ffffff;
  --button-primary-border: #1728d6;
  --button-primary-bg-hover: #4553de;
  --button-secondary-bg: #ffffff;
  --button-secondary-fg: #05082b;
  --button-secondary-border: #1728d6;
  --button-secondary-bg-hover: #e8e9fb;
  --button-accent-bg: #1728d6;
  --button-accent-fg: #ffffff;
  --button-accent-border: #1728d6;
  --button-accent-bg-hover: #4553de;
  --button-info-bg: #ffffff;
  --button-info-fg: #05082b;
  --button-info-border: #1728d6;
  --button-info-bg-hover: #e8e9fb;
  --cta-radius: 4px;
  --cta-padding-x: 16px;
  --cta-padding-y: 10px;
  --cta-min-height: 48px;
  --cta-font: 500 16px/1.43 var(--font-body);
  --cta-primary-bg: #1728d6;
  --cta-primary-fg: #ffffff;
  --cta-secondary-bg: #ffffff;
  --cta-secondary-fg: #05082b;
  --cta-secondary-border: 1px solid #1728d6;
  --button-primary-hover-bg: var(--color-button-hover);
  --button-primary-hover-fg: #ffffff;
  --button-primary-hover-border: var(--color-button-hover);
  --button-primary-hover-filter: none;
  --button-primary-focus-bg: var(--button-primary-hover-bg);
  --button-primary-focus-fg: var(--button-primary-hover-fg);
  --button-primary-focus-border: var(--button-primary-hover-border);
  --button-primary-pressed-bg: var(--color-button-pressed);
  --button-primary-pressed-fg: var(--color-button-pressed-label);
  --button-primary-pressed-border: var(--color-button-pressed);
  --button-primary-pressed-filter: none;
  --button-primary-disabled-bg: var(--color-black-10);
  --button-primary-disabled-fg: color-mix(in srgb, var(--color-button-disabled-label) 38%, transparent);
  --button-primary-disabled-border: transparent;
  --button-primary-disabled-opacity: 1;
  --button-secondary-border-width: 2px;
  --button-secondary-hover-bg: #e8e9fb;
  --button-secondary-hover-fg: var(--color-button-outline-label);
  --button-secondary-hover-filter: none;
  --button-secondary-focus-bg: var(--button-secondary-hover-bg);
  --button-secondary-focus-fg: var(--button-secondary-hover-fg);
  --button-secondary-focus-border: var(--button-secondary-hover-border);
  --button-secondary-pressed-bg: var(--color-button-outline-pressed);
  --button-secondary-pressed-fg: var(--color-button-outline-pressed-label);
  --button-secondary-pressed-border: var(--color-button-hover);
  --button-secondary-pressed-filter: none;
  --button-secondary-disabled-bg: var(--color-black-10);
  --button-secondary-disabled-fg: color-mix(in srgb, var(--color-button-outline-disabled-label) 38%, transparent);
  --button-secondary-disabled-border: var(--color-button-outline-disabled-border);
  --button-secondary-disabled-opacity: 1;
  --button-accent-hover-bg: var(--color-button-hover);
  --button-accent-hover-fg: #ffffff;
  --button-accent-hover-border: var(--color-button-hover);
  --button-accent-hover-filter: none;
  --button-accent-focus-bg: var(--button-accent-hover-bg);
  --button-accent-focus-fg: var(--button-accent-hover-fg);
  --button-accent-focus-border: var(--button-accent-hover-border);
  --button-accent-pressed-bg: var(--color-button-pressed);
  --button-accent-pressed-fg: var(--color-button-pressed-label);
  --button-accent-pressed-border: var(--color-button-pressed);
  --button-accent-pressed-filter: none;
  --button-accent-disabled-bg: var(--color-black-10);
  --button-accent-disabled-fg: color-mix(in srgb, var(--color-button-disabled-label) 38%, transparent);
  --button-accent-disabled-border: transparent;
  --button-accent-disabled-opacity: 1;
  --button-info-border-width: 2px;
  --button-info-hover-bg: #e8e9fb;
  --button-info-hover-fg: var(--color-button-outline-label);
  --button-info-hover-filter: none;
  --button-info-focus-bg: var(--button-info-hover-bg);
  --button-info-focus-fg: var(--button-info-hover-fg);
  --button-info-focus-border: var(--button-info-hover-border);
  --button-info-pressed-bg: var(--color-button-outline-pressed);
  --button-info-pressed-fg: var(--color-button-outline-pressed-label);
  --button-info-pressed-border: var(--color-button-hover);
  --button-info-pressed-filter: none;
  --button-info-disabled-bg: var(--color-black-10);
  --button-info-disabled-fg: color-mix(in srgb, var(--color-button-outline-disabled-label) 38%, transparent);
  --button-info-disabled-border: var(--color-button-outline-disabled-border);
  --button-info-disabled-opacity: 1;
  --cta-primary-hover-bg: var(--color-button-hover);
  --cta-primary-hover-fg: #ffffff;
  --cta-primary-hover-border: 1px solid var(--color-button-hover);
  --cta-primary-focus-bg: var(--cta-primary-hover-bg);
  --cta-primary-focus-fg: var(--cta-primary-hover-fg);
  --cta-primary-focus-border: var(--cta-primary-hover-border);
  --cta-primary-pressed-bg: var(--color-button-pressed);
  --cta-primary-pressed-fg: var(--color-button-pressed-label);
  --cta-primary-pressed-border: 1px solid var(--color-button-pressed);
  --cta-primary-disabled-bg: var(--color-black-10);
  --cta-primary-disabled-fg: color-mix(in srgb, var(--color-button-disabled-label) 38%, transparent);
  --cta-primary-disabled-border: 1px solid transparent;
  --cta-secondary-hover-bg: #e8e9fb;
  --cta-secondary-hover-fg: var(--color-button-outline-label);
  --cta-secondary-focus-bg: var(--cta-secondary-hover-bg);
  --cta-secondary-focus-fg: var(--cta-secondary-hover-fg);
  --cta-secondary-focus-border: var(--cta-secondary-hover-border);
  --cta-secondary-pressed-bg: var(--color-button-outline-pressed);
  --cta-secondary-pressed-fg: var(--color-button-outline-pressed-label);
  --cta-secondary-pressed-border: 1px solid var(--color-button-hover);
  --cta-secondary-disabled-bg: var(--color-black-10);
  --cta-secondary-disabled-fg: color-mix(in srgb, var(--color-button-outline-disabled-label) 38%, transparent);
  --cta-secondary-disabled-border: 1px solid var(--color-button-outline-disabled-border);
  /* StyleGuide → fonts */
  --font-body: "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-heading: "Host Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-weight-regular: 400;
  --font-weight-medium: 600;
  --font-weight-bold: 800;
  --line-height-body: 1.5;
  --type-caption: 14.17px;
  --type-body: 17px;
  --type-title: 20.4px;
  --type-headline: 24.48px;
  --fontsize-fluid-sm: 14.17px;
  --fontsize-fluid-md: 17px;
  --fontsize-fluid-lg: 20.4px;
  --type-heading-1: clamp(29.38px, calc(29.38px + 1.5vw), 35.25px);
  --type-heading-2: clamp(24.48px, calc(24.48px + 1vw), 29.38px);
  --type-heading-3: clamp(20.4px, calc(20.4px + 0.6vw), 24.48px);
  /* StyleGuide → typography roles */
  --typography-legal-font-family: var(--font-body);
  --typography-legal-size: 17px;
  --typography-legal-line-height: 1.65;
  /* StyleGuide → shapes */
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 10px;
  --radius-xl: 10px;
  --radius-extra-small: var(--radius-sm);
  --radius-large-increased: var(--radius-lg);
  --radius-extra-large-increased: var(--radius-xl);
  --radius-extra-extra-large: var(--radius-xl);
  /* StyleGuide → modals */
  --modal-bg: #ffffff;
  --modal-fg: #1e1e1d;
  --modal-backdrop: rgba(0, 0, 0, 0.1);
  --modal-radius: var(--radius-lg);
  /* StyleGuide → forms */
  --form-error-color: #7c2b0d;
  --form-control-bg: #ffffff;
  --form-control-fg: #000d37;
  --form-control-border: #000d37;
  --form-control-focus-border: #003cb3;
  --form-control-radius: var(--radius-sm);
  --form-control-chevron-color: #000d37;
  --form-control-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23000d37' d='M2 4l4 4 4-4'/%3E%3C/svg%3E");
  /* StyleGuide → header/navigation */
  --pangeon-nav-background: #ffffff;
  --pangeon-nav-foreground: #101115;
  --pangeon-nav-active-accent: #1728d6;
  --pangeon-nav-border-color: #898280;
  --pangeon-nav-border: 1px solid #898280;
  --pangeon-nav-height: calc(var(--space-touch) + 1.5rem);
  --pangeon-nav-title-weight: 700;
  --pangeon-nav-back-color: var(--color-banner-back);
  --pangeon-nav-actions-gap: var(--space-3);
  --pangeon-nav-spoke-breakpoint: 720px;
  --pangeon-nav-avatar-ring: var(--color-avatar-ring);
  --pangeon-nav-action-size: var(--control-size-sm);
  --pangeon-nav-action-background: var(--color-tile-fill);
  --pangeon-nav-action-ring: var(--color-card-outline);
  /* StyleGuide -> surfaces (page, card, panel, tile, ...) */
  --surface-page-bg: var(--color-page-tint);
  --surface-card-bg: var(--color-card-fill);
  --surface-card-border: none;
  --surface-card-radius: var(--radius-md);
  --surface-card-shadow: var(--elevation-1);
  --surface-card-padding: var(--pangeon-surface-padding);
  --surface-panel-bg: var(--color-card-fill);
  --surface-panel-border: none;
  --surface-panel-radius: var(--radius-md);
  --surface-panel-shadow: var(--elevation-1);
  --surface-panel-padding: var(--pangeon-surface-padding);
  --surface-default-bg: var(--color-card-fill);
  --surface-default-border: none;
  --surface-default-radius: var(--radius-md);
  --surface-default-shadow: var(--elevation-1);
  --surface-elevated-bg: var(--color-card-fill);
  --surface-elevated-border: none;
  --surface-elevated-radius: var(--radius-md);
  --surface-elevated-shadow: var(--elevation-2);
  --surface-tile-bg: var(--color-card-fill);
  --surface-tile-border: var(--border-thin) var(--border-style) var(--color-card-outline);
  --surface-tile-radius: var(--radius-md);
  --surface-tile-shadow: var(--elevation-0);
  --surface-tile-padding: var(--space-2);
  --surface-inset-bg: var(--color-card-fill);
  --surface-inset-border: var(--border-thin) var(--border-style) var(--color-card-outline);
  --surface-inset-radius: var(--radius-md);
  --surface-inset-shadow: var(--elevation-0);
  /* StyleGuide -> nav.places (bottom tabs / rail) */
  --pangeon-places-rail-from: 720px;
  --pangeon-places-ink: var(--color-nav-ink);
  --pangeon-places-selected-bg: var(--color-nav-selected);
  --pangeon-places-selected-fg: var(--color-nav-on-selected);
  --pangeon-places-selected-weight: 700;
  --pangeon-places-selected-radius: var(--radius-sm);
  --pangeon-places-disabled-opacity: 0.4;
  /* StyleGuide -> feedback.fab */
  --pangeon-feedback-fab-bg: var(--color-card-fill);
  --pangeon-feedback-fab-fg: var(--primary);
  --pangeon-feedback-fab-border: var(--border-width) solid var(--color-primary);
  --pangeon-feedback-fab-shadow: var(--elevation-1);
}
:root[data-theme="dark"] {
  --bg: var(--color-background);
  --surface: var(--color-surface);
  --surface-2: var(--color-surface-2);
  --border: var(--color-border);
  --text: var(--color-on-surface);
  --text-muted: var(--color-text-muted);
  --primary: var(--color-primary);
  --primary-hover: var(--color-primary-hover);
  --error: var(--color-error);
  --success: var(--color-success);
  --warning: var(--color-warning);
  --info: var(--color-info);
  --accent: var(--color-accent);
  --on-surface: var(--color-on-surface);
  --on-primary: var(--color-on-primary);
  --on-error: #000000;
  --on-success: #000000;
  --on-accent: #000000;
  --accent-text: var(--color-accent-text);
}
/* StyleGuide → nav.spokeBreakpoint (prototyper#1656) */
@container pangeon-header (max-width: 719.98px) {
  .pangeon-header[data-spoke] .pangeon-header-brand { display: none !important; }
}
/* StyleGuide -> nav.places.railFrom (prototyper#1655) */
@media (min-width: 720px) {
  .pangeon-app-shell.pangeon-app-shell[data-places="true"] .pangeon-app-shell-rail { display: block; }
  .pangeon-app-shell.pangeon-app-shell[data-places="true"] .pangeon-app-shell-nav { display: none; }
}
@media (max-width: 719.98px) {
  .pangeon-app-shell.pangeon-app-shell[data-places="true"] .pangeon-app-shell-rail { display: none; }
  .pangeon-app-shell.pangeon-app-shell[data-places="true"] .pangeon-app-shell-nav { display: block; }
}

button, .button, .app-link {
  display:inline-flex; align-items:center; justify-content:center; min-height:var(--cta-min-height);
  border-radius:var(--button-radius)!important; padding:var(--button-padding-y) var(--button-padding-x)!important;
  background:var(--button-primary-bg)!important; color:var(--button-primary-fg)!important;
  font-size:var(--button-font-size)!important; font-weight:var(--button-font-weight)!important;
  border:1px solid var(--button-primary-border)!important; text-decoration:none!important;
}
.button.secondary { background:var(--button-secondary-bg)!important; color:var(--button-secondary-fg)!important; }
:is(button,.button,.app-link):hover { background:var(--button-primary-bg-hover)!important; }
.button.secondary:hover { background:var(--button-secondary-bg-hover)!important; }
:is(button,.button,.app-link):focus-visible { outline:calc(var(--border-width) * 3) solid var(--color-login-action); outline-offset:var(--space-1); }
:is(button,.button,.app-link):active { background:var(--color-button-pressed)!important; color:var(--color-button-pressed-label)!important; }
.static-legal { display:flex; flex-wrap:wrap; justify-content:center; gap:var(--space-4); padding:var(--space-6) var(--space-4); }
.static-legal a { color:var(--color-text-muted); min-height:var(--cta-min-height); display:inline-flex; align-items:center; }