.landing-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--cv-space-2);
  min-height: 48px;
  padding: 0 24px;
  border: 1px solid color-mix(in srgb, var(--cv-border) 84%, var(--cv-fg-muted));
  border-radius: var(--cv-radius-sm);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--cv-elevated) 94%, #ffffff 6%) 0%, var(--cv-surface) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 10px 24px rgba(0, 0, 0, 0.18);
  color: var(--cv-fg);
  cursor: pointer;
  font-family: var(--cv-font-mono);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.03em;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    background var(--cv-duration) var(--cv-ease),
    border-color var(--cv-duration) var(--cv-ease),
    color var(--cv-duration) var(--cv-ease),
    box-shadow var(--cv-duration) var(--cv-ease),
    transform var(--cv-duration) var(--cv-ease);
  white-space: nowrap;
}

.landing-btn:hover {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--cv-elevated) 88%, #ffffff 12%) 0%, color-mix(in srgb, var(--cv-surface) 88%, #000000 12%) 100%);
  border-color: color-mix(in srgb, var(--cv-fg-muted) 72%, var(--cv-primary) 28%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 14px 28px rgba(0, 0, 0, 0.22);
  text-decoration: none;
  transform: translateY(-1px);
}

.landing-btn:active {
  transform: translateY(0) scale(0.99);
}

.landing-btn.landing-btn--primary {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--cv-primary-hover) 18%, var(--cv-primary) 82%) 0%, var(--cv-primary) 100%);
  border-color: color-mix(in srgb, var(--cv-primary) 82%, var(--cv-primary-hover));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 0 0 1px color-mix(in srgb, var(--cv-primary) 30%, transparent),
    0 12px 26px color-mix(in srgb, var(--cv-primary) 18%, transparent);
  color: #000;
  font-weight: 700;
}

.landing-btn.landing-btn--primary:hover {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--cv-primary-hover) 26%, var(--cv-primary) 74%) 0%, var(--cv-primary-hover) 100%);
  border-color: var(--cv-primary-hover);
  color: #000;
}

.landing-btn.landing-btn--secondary {
  border-color: color-mix(in srgb, var(--cv-secondary) 46%, var(--cv-border));
  color: var(--cv-secondary);
}

.landing-btn.landing-btn--secondary:hover {
  background: color-mix(in srgb, var(--cv-secondary) 12%, var(--cv-elevated));
  border-color: var(--cv-secondary);
  color: var(--cv-secondary);
}

.landing-btn.landing-btn--ghost {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  color: var(--cv-fg);
}

.landing-btn.landing-btn--ghost:hover {
  background: color-mix(in srgb, var(--cv-elevated) 84%, transparent);
  border-color: transparent;
  box-shadow: none;
  color: var(--cv-fg);
}

.landing-btn--header {
  min-height: 38px;
  padding: 0 16px;
  font-size: 11px;
  letter-spacing: 0.04em;
}

.landing-btn--block {
  width: 100%;
}

.landing-btn[disabled] {
  cursor: not-allowed;
  opacity: 0.56;
  pointer-events: none;
  transform: none;
  box-shadow: none;
}

.landing-card {
  display: block;
  padding: 24px;
  border: 1px solid color-mix(in srgb, var(--cv-border) 82%, var(--cv-fg-muted));
  border-radius: var(--cv-radius-md);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--cv-elevated) 94%, #ffffff 6%) 0%, var(--cv-elevated) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
  transition:
    border-color var(--cv-duration) var(--cv-ease),
    box-shadow var(--cv-duration) var(--cv-ease),
    transform var(--cv-duration) var(--cv-ease);
}

.landing-card:hover {
  border-color: color-mix(in srgb, var(--cv-primary) 18%, #3a4358);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 0 0 1px color-mix(in srgb, var(--cv-primary) 10%, transparent),
    var(--cv-glow-subtle);
  transform: translateY(-2px);
}

.landing-card--accent {
  border-color: color-mix(in srgb, var(--cv-secondary) 58%, var(--cv-border));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 0 0 1px color-mix(in srgb, var(--cv-secondary) 12%, transparent),
    var(--cv-glow-subtle);
}

.landing-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 22px;
  padding: 4px 12px;
  border: 1px solid color-mix(in srgb, var(--cv-border) 86%, var(--cv-fg-muted));
  border-radius: var(--cv-radius-sm);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--cv-surface) 92%, #ffffff 8%) 0%, var(--cv-surface) 100%);
  color: var(--cv-fg-muted);
  font-family: var(--cv-font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.landing-badge--primary {
  border-color: color-mix(in srgb, var(--cv-primary) 34%, var(--cv-border));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--cv-primary) 12%, var(--cv-elevated)) 0%, color-mix(in srgb, var(--cv-primary) 7%, var(--cv-surface)) 100%);
  color: var(--cv-primary);
}

.landing-badge--secondary {
  border-color: color-mix(in srgb, var(--cv-secondary) 40%, var(--cv-border));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--cv-secondary) 14%, var(--cv-elevated)) 0%, color-mix(in srgb, var(--cv-secondary) 8%, var(--cv-surface)) 100%);
  color: var(--cv-secondary);
}

.landing-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--cv-primary);
  font-family: var(--cv-font-mono);
  font-size: 12px;
  letter-spacing: 0.04em;
  line-height: 1.2;
  text-decoration: none;
  text-transform: uppercase;
  transition: color var(--cv-duration) var(--cv-ease), transform var(--cv-duration) var(--cv-ease);
}

.landing-link:hover {
  color: var(--cv-primary-hover);
  text-decoration: none;
  transform: translateX(1px);
}

.landing-link--secondary {
  color: var(--cv-secondary);
}

.landing-link--secondary:hover {
  color: var(--cv-secondary-hover);
}

.label-mono {
  font-family: var(--cv-font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* layer: shortcuts */
.container{width:100%;}
.section-shell{margin-left:auto;margin-right:auto;max-width:1120px;}
.section-heading{display:flex;flex-direction:column;gap:var(--cv-space-md);}
.icon-box{display:inline-flex;align-items:center;justify-content:center;}
@media (min-width: 640px){
.container{max-width:640px;}
}
@media (min-width: 768px){
.container{max-width:768px;}
}
@media (min-width: 1024px){
.container{max-width:1024px;}
}
@media (min-width: 1280px){
.container{max-width:1280px;}
}
@media (min-width: 1536px){
.container{max-width:1536px;}
}
/* layer: default */
.absolute{position:absolute;}
.relative{position:relative;}
.grid{display:grid;}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.mx-auto{margin-left:auto;margin-right:auto;}
.mb-2xl{margin-bottom:var(--cv-space-2xl);}
.mb-3xl{margin-bottom:var(--cv-space-3xl);}
.mb-lg{margin-bottom:var(--cv-space-lg);}
.mb-md{margin-bottom:var(--cv-space-md);}
.mb-sm{margin-bottom:var(--cv-space-sm);}
.mb-xl{margin-bottom:var(--cv-space-xl);}
.ml{margin-left:1rem;}
.mt-lg{margin-top:var(--cv-space-lg);}
.mt-md{margin-top:var(--cv-space-md);}
.mt-xl{margin-top:var(--cv-space-xl);}
.block{display:block;}
.list-item{display:list-item;}
.hidden{display:none;}
.max-w-content{max-width:var(--cv-max-width);}
.w-full{width:100%;}
.flex{display:flex;}
.inline-flex{display:inline-flex;}
.shrink-0{flex-shrink:0;}
.flex-col{flex-direction:column;}
.flex-wrap{flex-wrap:wrap;}
.items-start{align-items:flex-start;}
.items-center{align-items:center;}
.justify-end{justify-content:flex-end;}
.justify-center{justify-content:center;}
.justify-between{justify-content:space-between;}
.gap-2xl{gap:var(--cv-space-2xl);}
.gap-3xl{gap:var(--cv-space-3xl);}
.gap-lg{gap:var(--cv-space-lg);}
.gap-md{gap:var(--cv-space-md);}
.gap-sm{gap:var(--cv-space-sm);}
.gap-xl{gap:var(--cv-space-xl);}
.gap-xs{gap:var(--cv-space-xs);}
.overflow-hidden{overflow:hidden;}
.border{border-width:1px;}
.border-border{border-color:var(--cv-border);}
.rounded-lg{border-radius:var(--cv-radius-lg);}
.rounded-md{border-radius:var(--cv-radius-md);}
.rounded-sm{border-radius:var(--cv-radius-sm);}
.bg-elevated{background-color:var(--cv-elevated);}
.bg-surface{background-color:var(--cv-surface);}
.p-lg{padding:var(--cv-space-lg);}
.p-xl{padding:var(--cv-space-xl);}
.px{padding-left:1rem;padding-right:1rem;}
.px-lg{padding-left:var(--cv-space-lg);padding-right:var(--cv-space-lg);}
.px-md{padding-left:var(--cv-space-md);padding-right:var(--cv-space-md);}
.px-x{padding-left:var(--cv-padding-x);padding-right:var(--cv-padding-x);}
.py-2xl{padding-top:var(--cv-space-2xl);padding-bottom:var(--cv-space-2xl);}
.py-3xl{padding-top:var(--cv-space-3xl);padding-bottom:var(--cv-space-3xl);}
.py-4xl{padding-top:var(--cv-space-4xl);padding-bottom:var(--cv-space-4xl);}
.py-md{padding-top:var(--cv-space-md);padding-bottom:var(--cv-space-md);}
.py-sm{padding-top:var(--cv-space-sm);padding-bottom:var(--cv-space-sm);}
.py-xs{padding-top:var(--cv-space-xs);padding-bottom:var(--cv-space-xs);}
.pb-2xl{padding-bottom:var(--cv-space-2xl);}
.pb-3xl{padding-bottom:var(--cv-space-3xl);}
.pb-4xl{padding-bottom:var(--cv-space-4xl);}
.pt-3xl{padding-top:var(--cv-space-3xl);}
.pt-4xl{padding-top:var(--cv-space-4xl);}
.pt-sm{padding-top:var(--cv-space-sm);}
.text-center{text-align:center;}
.text-fg{color:var(--cv-fg);}
.text-fg-muted{color:var(--cv-fg-muted);}
.text-primary{color:var(--cv-primary);}
.font-display{font-family:var(--cv-font-display);}
.font-mono{font-family:var(--cv-font-mono);}
.uppercase{text-transform:uppercase;}

  .cv-app-shell-root {
    display: block;
    color: var(--cv-fg);
    background: var(--cv-bg);
    font-family: var(--cv-font-body);
    line-height: 1.6;
    contain: content;

    /* ═══════════════════════════════════════════════════════════════
       COLOR SYSTEM — Void + Neon (from Brand Kit)
       ═══════════════════════════════════════════════════════════════ */

    /* Neutrals (70–80% of UI) */
    --cv-bg: #0B0D10;                    /* Void - cold almost-black */
    --cv-surface: #12151B;               /* Graphite - cards/panels */
    --cv-elevated: #1A1F2A;              /* Deep Slate - modals/top layers */
    --cv-border: #242B3A;                /* Cold Steel - thin dividers */

    /* Text */
    --cv-fg: #F2F5F7;                    /* White Noise - primary text */
    --cv-fg-muted: #A7B0C0;              /* Ash - secondary text */

    /* Brand Accents (10–15% of UI) */
    --cv-primary: #00E5FF;               /* Privy Cyan - main CTA, links, focus */
    --cv-primary-hover: #00CEE6;
    --cv-primary-active: #00B7CC;
    --cv-primary-on: #00171A;            /* Text on primary */

    --cv-secondary: #B388FF;             /* Deny Violet - secondary CTA, Pro badges */
    --cv-secondary-hover: #A17AE6;
    --cv-secondary-active: #8F6DCC;

    --cv-glow: #6200EA;                  /* Electric Purple - glow only, not for text */

    /* Semantics (≤5% of UI) */
    --cv-success: #00F5A0;               /* paired/verified/ok */
    --cv-warning: #FFB020;               /* warnings */
    --cv-danger: #FF3B30;                /* wipe/irreversible/critical */

    /* Signature gradient */
    --cv-gradient: linear-gradient(90deg, #00E5FF 0%, #B388FF 55%, #6200EA 100%);

    /* ═══════════════════════════════════════════════════════════════
       TYPOGRAPHY
       ═══════════════════════════════════════════════════════════════ */
    --cv-font-display: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --cv-font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --cv-font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

    /* ═══════════════════════════════════════════════════════════════
       SPACING (8-pt grid)
       ═══════════════════════════════════════════════════════════════ */
    --cv-space-1: 4px;
    --cv-space-2: 8px;
    --cv-space-3: 12px;
    --cv-space-4: 16px;
    --cv-space-5: 20px;
    --cv-space-6: 24px;
    --cv-space-8: 32px;
    --cv-space-10: 40px;
    --cv-space-12: 48px;
    --cv-space-16: 64px;
    --cv-space-20: 80px;
    --cv-space-24: 96px;

    /* Legacy aliases */
    --cv-space-xs: var(--cv-space-1);
    --cv-space-sm: var(--cv-space-2);
    --cv-space-md: var(--cv-space-4);
    --cv-space-lg: var(--cv-space-6);
    --cv-space-xl: var(--cv-space-8);
    --cv-space-2xl: var(--cv-space-12);
    --cv-space-3xl: var(--cv-space-16);
    --cv-space-4xl: var(--cv-space-24);

    /* ═══════════════════════════════════════════════════════════════
       LAYOUT
       ═══════════════════════════════════════════════════════════════ */
    --cv-max-width: 1200px;
    --cv-content-width: 900px;
    --cv-padding-x: clamp(16px, 5vw, 48px);

    /* ═══════════════════════════════════════════════════════════════
       RADIUS
       ═══════════════════════════════════════════════════════════════ */
    --cv-radius-sm: 8px;
    --cv-radius-md: 10px;
    --cv-radius-lg: 12px;

    /* ═══════════════════════════════════════════════════════════════
       MOTION
       ═══════════════════════════════════════════════════════════════ */
    --cv-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
    --cv-ease-snappy: cubic-bezier(0.2, 0, 0, 1);
    --cv-duration: 200ms;

    /* ═══════════════════════════════════════════════════════════════
       GLOW PRESETS
       ═══════════════════════════════════════════════════════════════ */
    --cv-glow-subtle: 0 0 24px rgba(137, 64, 239, 0.25);
    --cv-glow-medium: 0 0 48px rgba(98, 0, 234, 0.3);
    --cv-glow-hero: 0 0 80px rgba(98, 0, 234, 0.35);
    --cv-focus-ring: 0 0 0 3px #B2F7FF;

    /* UIKit token bridge */
    --cv-color-bg: var(--cv-bg);
    --cv-color-surface: var(--cv-surface);
    --cv-color-surface-2: var(--cv-elevated);
    --cv-color-surface-elevated: var(--cv-elevated);
    --cv-color-text: var(--cv-fg);
    --cv-color-text-muted: var(--cv-fg-muted);
    --cv-color-border: var(--cv-border);
    --cv-color-primary: var(--cv-primary);
    --cv-color-on-primary: var(--cv-primary-on);
    --cv-color-accent: var(--cv-secondary);
    --cv-color-success: var(--cv-success);
    --cv-color-warning: var(--cv-warning);
    --cv-color-danger: var(--cv-danger);
    --cv-color-overlay: rgba(0, 0, 0, 0.72);
    --cv-duration-fast: 120ms;
    --cv-duration-normal: var(--cv-duration);
    --cv-easing-standard: var(--cv-ease);
    --cv-font-size-base: 14px;
    --cv-font-weight-medium: 500;
  }



  .cv-app-shell-root * {
    box-sizing: border-box;
  }

  /* Reset */
  .cv-app-shell-root h1, .cv-app-shell-root h2, .cv-app-shell-root h3, .cv-app-shell-root h4, .cv-app-shell-root h5, .cv-app-shell-root h6, .cv-app-shell-root p {
    margin: 0;
  }

  .cv-app-shell-root a {
    color: var(--cv-primary);
    text-decoration: none;
    transition: color var(--cv-duration) var(--cv-ease);
  }

  .cv-app-shell-root a:hover {
    text-decoration: underline;
  }

  /* Focus styles - cyan ring */
  .cv-app-shell-root :focus-visible {
    outline: none;
    box-shadow: var(--cv-focus-ring);
  }

  /* Scrollbar */
  .cv-app-shell-root ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  .cv-app-shell-root ::-webkit-scrollbar-track {
    background: var(--cv-surface);
  }

  .cv-app-shell-root ::-webkit-scrollbar-thumb {
    background: var(--cv-border);
    border-radius: 4px;
  }

  .cv-app-shell-root ::-webkit-scrollbar-thumb:hover {
    background: #3A4358;
  }

  /* Reduced motion */
  @media (prefers-reduced-motion: reduce) {
    .cv-app-shell-root *,
    .cv-app-shell-root *::before,
    .cv-app-shell-root *::after {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
    }
  }


    .cv-app-shell-root {
      display: block;
      contain: layout style;
    }

    .cv-app-shell-root .cv-app-main {
      display: block;
      min-height: 0;
    }
  

  .cv-landing-page {
    display: block;
    color: var(--cv-fg);
    background: var(--cv-bg);
    font-family: var(--cv-font-body);
    line-height: 1.6;
    contain: content;

    /* ═══════════════════════════════════════════════════════════════
       COLOR SYSTEM — Void + Neon (from Brand Kit)
       ═══════════════════════════════════════════════════════════════ */

    /* Neutrals (70–80% of UI) */
    --cv-bg: #0B0D10;                    /* Void - cold almost-black */
    --cv-surface: #12151B;               /* Graphite - cards/panels */
    --cv-elevated: #1A1F2A;              /* Deep Slate - modals/top layers */
    --cv-border: #242B3A;                /* Cold Steel - thin dividers */

    /* Text */
    --cv-fg: #F2F5F7;                    /* White Noise - primary text */
    --cv-fg-muted: #A7B0C0;              /* Ash - secondary text */

    /* Brand Accents (10–15% of UI) */
    --cv-primary: #00E5FF;               /* Privy Cyan - main CTA, links, focus */
    --cv-primary-hover: #00CEE6;
    --cv-primary-active: #00B7CC;
    --cv-primary-on: #00171A;            /* Text on primary */

    --cv-secondary: #B388FF;             /* Deny Violet - secondary CTA, Pro badges */
    --cv-secondary-hover: #A17AE6;
    --cv-secondary-active: #8F6DCC;

    --cv-glow: #6200EA;                  /* Electric Purple - glow only, not for text */

    /* Semantics (≤5% of UI) */
    --cv-success: #00F5A0;               /* paired/verified/ok */
    --cv-warning: #FFB020;               /* warnings */
    --cv-danger: #FF3B30;                /* wipe/irreversible/critical */

    /* Signature gradient */
    --cv-gradient: linear-gradient(90deg, #00E5FF 0%, #B388FF 55%, #6200EA 100%);

    /* ═══════════════════════════════════════════════════════════════
       TYPOGRAPHY
       ═══════════════════════════════════════════════════════════════ */
    --cv-font-display: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --cv-font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --cv-font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

    /* ═══════════════════════════════════════════════════════════════
       SPACING (8-pt grid)
       ═══════════════════════════════════════════════════════════════ */
    --cv-space-1: 4px;
    --cv-space-2: 8px;
    --cv-space-3: 12px;
    --cv-space-4: 16px;
    --cv-space-5: 20px;
    --cv-space-6: 24px;
    --cv-space-8: 32px;
    --cv-space-10: 40px;
    --cv-space-12: 48px;
    --cv-space-16: 64px;
    --cv-space-20: 80px;
    --cv-space-24: 96px;

    /* Legacy aliases */
    --cv-space-xs: var(--cv-space-1);
    --cv-space-sm: var(--cv-space-2);
    --cv-space-md: var(--cv-space-4);
    --cv-space-lg: var(--cv-space-6);
    --cv-space-xl: var(--cv-space-8);
    --cv-space-2xl: var(--cv-space-12);
    --cv-space-3xl: var(--cv-space-16);
    --cv-space-4xl: var(--cv-space-24);

    /* ═══════════════════════════════════════════════════════════════
       LAYOUT
       ═══════════════════════════════════════════════════════════════ */
    --cv-max-width: 1200px;
    --cv-content-width: 900px;
    --cv-padding-x: clamp(16px, 5vw, 48px);

    /* ═══════════════════════════════════════════════════════════════
       RADIUS
       ═══════════════════════════════════════════════════════════════ */
    --cv-radius-sm: 8px;
    --cv-radius-md: 10px;
    --cv-radius-lg: 12px;

    /* ═══════════════════════════════════════════════════════════════
       MOTION
       ═══════════════════════════════════════════════════════════════ */
    --cv-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
    --cv-ease-snappy: cubic-bezier(0.2, 0, 0, 1);
    --cv-duration: 200ms;

    /* ═══════════════════════════════════════════════════════════════
       GLOW PRESETS
       ═══════════════════════════════════════════════════════════════ */
    --cv-glow-subtle: 0 0 24px rgba(137, 64, 239, 0.25);
    --cv-glow-medium: 0 0 48px rgba(98, 0, 234, 0.3);
    --cv-glow-hero: 0 0 80px rgba(98, 0, 234, 0.35);
    --cv-focus-ring: 0 0 0 3px #B2F7FF;

    /* UIKit token bridge */
    --cv-color-bg: var(--cv-bg);
    --cv-color-surface: var(--cv-surface);
    --cv-color-surface-2: var(--cv-elevated);
    --cv-color-surface-elevated: var(--cv-elevated);
    --cv-color-text: var(--cv-fg);
    --cv-color-text-muted: var(--cv-fg-muted);
    --cv-color-border: var(--cv-border);
    --cv-color-primary: var(--cv-primary);
    --cv-color-on-primary: var(--cv-primary-on);
    --cv-color-accent: var(--cv-secondary);
    --cv-color-success: var(--cv-success);
    --cv-color-warning: var(--cv-warning);
    --cv-color-danger: var(--cv-danger);
    --cv-color-overlay: rgba(0, 0, 0, 0.72);
    --cv-duration-fast: 120ms;
    --cv-duration-normal: var(--cv-duration);
    --cv-easing-standard: var(--cv-ease);
    --cv-font-size-base: 14px;
    --cv-font-weight-medium: 500;
  }



  .cv-landing-page * {
    box-sizing: border-box;
  }

  /* Reset */
  .cv-landing-page h1, .cv-landing-page h2, .cv-landing-page h3, .cv-landing-page h4, .cv-landing-page h5, .cv-landing-page h6, .cv-landing-page p {
    margin: 0;
  }

  .cv-landing-page a {
    color: var(--cv-primary);
    text-decoration: none;
    transition: color var(--cv-duration) var(--cv-ease);
  }

  .cv-landing-page a:hover {
    text-decoration: underline;
  }

  /* Focus styles - cyan ring */
  .cv-landing-page :focus-visible {
    outline: none;
    box-shadow: var(--cv-focus-ring);
  }

  /* Scrollbar */
  .cv-landing-page ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  .cv-landing-page ::-webkit-scrollbar-track {
    background: var(--cv-surface);
  }

  .cv-landing-page ::-webkit-scrollbar-thumb {
    background: var(--cv-border);
    border-radius: 4px;
  }

  .cv-landing-page ::-webkit-scrollbar-thumb:hover {
    background: #3A4358;
  }

  /* Reduced motion */
  @media (prefers-reduced-motion: reduce) {
    .cv-landing-page *,
    .cv-landing-page *::before,
    .cv-landing-page *::after {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
    }
  }


  .cv-landing-page .cv-landing-page,
  .cv-landing-page .cv-app-shell-page {
    display: flex;
    flex-direction: column;
    min-height: 100svh;
  }

  .cv-landing-page .cv-landing-main,
  .cv-landing-page .cv-app-shell-main {
    flex: 1;
  }


  .cv-app-shell-page {
    display: block;
    color: var(--cv-fg);
    background: var(--cv-bg);
    font-family: var(--cv-font-body);
    line-height: 1.6;
    contain: content;

    /* ═══════════════════════════════════════════════════════════════
       COLOR SYSTEM — Void + Neon (from Brand Kit)
       ═══════════════════════════════════════════════════════════════ */

    /* Neutrals (70–80% of UI) */
    --cv-bg: #0B0D10;                    /* Void - cold almost-black */
    --cv-surface: #12151B;               /* Graphite - cards/panels */
    --cv-elevated: #1A1F2A;              /* Deep Slate - modals/top layers */
    --cv-border: #242B3A;                /* Cold Steel - thin dividers */

    /* Text */
    --cv-fg: #F2F5F7;                    /* White Noise - primary text */
    --cv-fg-muted: #A7B0C0;              /* Ash - secondary text */

    /* Brand Accents (10–15% of UI) */
    --cv-primary: #00E5FF;               /* Privy Cyan - main CTA, links, focus */
    --cv-primary-hover: #00CEE6;
    --cv-primary-active: #00B7CC;
    --cv-primary-on: #00171A;            /* Text on primary */

    --cv-secondary: #B388FF;             /* Deny Violet - secondary CTA, Pro badges */
    --cv-secondary-hover: #A17AE6;
    --cv-secondary-active: #8F6DCC;

    --cv-glow: #6200EA;                  /* Electric Purple - glow only, not for text */

    /* Semantics (≤5% of UI) */
    --cv-success: #00F5A0;               /* paired/verified/ok */
    --cv-warning: #FFB020;               /* warnings */
    --cv-danger: #FF3B30;                /* wipe/irreversible/critical */

    /* Signature gradient */
    --cv-gradient: linear-gradient(90deg, #00E5FF 0%, #B388FF 55%, #6200EA 100%);

    /* ═══════════════════════════════════════════════════════════════
       TYPOGRAPHY
       ═══════════════════════════════════════════════════════════════ */
    --cv-font-display: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --cv-font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --cv-font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

    /* ═══════════════════════════════════════════════════════════════
       SPACING (8-pt grid)
       ═══════════════════════════════════════════════════════════════ */
    --cv-space-1: 4px;
    --cv-space-2: 8px;
    --cv-space-3: 12px;
    --cv-space-4: 16px;
    --cv-space-5: 20px;
    --cv-space-6: 24px;
    --cv-space-8: 32px;
    --cv-space-10: 40px;
    --cv-space-12: 48px;
    --cv-space-16: 64px;
    --cv-space-20: 80px;
    --cv-space-24: 96px;

    /* Legacy aliases */
    --cv-space-xs: var(--cv-space-1);
    --cv-space-sm: var(--cv-space-2);
    --cv-space-md: var(--cv-space-4);
    --cv-space-lg: var(--cv-space-6);
    --cv-space-xl: var(--cv-space-8);
    --cv-space-2xl: var(--cv-space-12);
    --cv-space-3xl: var(--cv-space-16);
    --cv-space-4xl: var(--cv-space-24);

    /* ═══════════════════════════════════════════════════════════════
       LAYOUT
       ═══════════════════════════════════════════════════════════════ */
    --cv-max-width: 1200px;
    --cv-content-width: 900px;
    --cv-padding-x: clamp(16px, 5vw, 48px);

    /* ═══════════════════════════════════════════════════════════════
       RADIUS
       ═══════════════════════════════════════════════════════════════ */
    --cv-radius-sm: 8px;
    --cv-radius-md: 10px;
    --cv-radius-lg: 12px;

    /* ═══════════════════════════════════════════════════════════════
       MOTION
       ═══════════════════════════════════════════════════════════════ */
    --cv-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
    --cv-ease-snappy: cubic-bezier(0.2, 0, 0, 1);
    --cv-duration: 200ms;

    /* ═══════════════════════════════════════════════════════════════
       GLOW PRESETS
       ═══════════════════════════════════════════════════════════════ */
    --cv-glow-subtle: 0 0 24px rgba(137, 64, 239, 0.25);
    --cv-glow-medium: 0 0 48px rgba(98, 0, 234, 0.3);
    --cv-glow-hero: 0 0 80px rgba(98, 0, 234, 0.35);
    --cv-focus-ring: 0 0 0 3px #B2F7FF;

    /* UIKit token bridge */
    --cv-color-bg: var(--cv-bg);
    --cv-color-surface: var(--cv-surface);
    --cv-color-surface-2: var(--cv-elevated);
    --cv-color-surface-elevated: var(--cv-elevated);
    --cv-color-text: var(--cv-fg);
    --cv-color-text-muted: var(--cv-fg-muted);
    --cv-color-border: var(--cv-border);
    --cv-color-primary: var(--cv-primary);
    --cv-color-on-primary: var(--cv-primary-on);
    --cv-color-accent: var(--cv-secondary);
    --cv-color-success: var(--cv-success);
    --cv-color-warning: var(--cv-warning);
    --cv-color-danger: var(--cv-danger);
    --cv-color-overlay: rgba(0, 0, 0, 0.72);
    --cv-duration-fast: 120ms;
    --cv-duration-normal: var(--cv-duration);
    --cv-easing-standard: var(--cv-ease);
    --cv-font-size-base: 14px;
    --cv-font-weight-medium: 500;
  }



  .cv-app-shell-page * {
    box-sizing: border-box;
  }

  /* Reset */
  .cv-app-shell-page h1, .cv-app-shell-page h2, .cv-app-shell-page h3, .cv-app-shell-page h4, .cv-app-shell-page h5, .cv-app-shell-page h6, .cv-app-shell-page p {
    margin: 0;
  }

  .cv-app-shell-page a {
    color: var(--cv-primary);
    text-decoration: none;
    transition: color var(--cv-duration) var(--cv-ease);
  }

  .cv-app-shell-page a:hover {
    text-decoration: underline;
  }

  /* Focus styles - cyan ring */
  .cv-app-shell-page :focus-visible {
    outline: none;
    box-shadow: var(--cv-focus-ring);
  }

  /* Scrollbar */
  .cv-app-shell-page ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  .cv-app-shell-page ::-webkit-scrollbar-track {
    background: var(--cv-surface);
  }

  .cv-app-shell-page ::-webkit-scrollbar-thumb {
    background: var(--cv-border);
    border-radius: 4px;
  }

  .cv-app-shell-page ::-webkit-scrollbar-thumb:hover {
    background: #3A4358;
  }

  /* Reduced motion */
  @media (prefers-reduced-motion: reduce) {
    .cv-app-shell-page *,
    .cv-app-shell-page *::before,
    .cv-app-shell-page *::after {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
    }
  }

.marketing-header-host {
  display: block;
  position: sticky;
  top: 0;
  z-index: 100;
  contain: none;
}

.marketing-header {
  max-width: var(--cv-max-width);
  margin: 0 auto;
  padding: var(--cv-space-md) var(--cv-padding-x);
  background: rgba(11, 13, 16, 0.85);
  border-bottom: 1px solid var(--cv-border);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

@media (max-width: 900px) {
  .marketing-header {
    background: rgba(11, 13, 16, 0.94);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

.marketing-logo {
  font-family: var(--cv-font-body);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.01em;
  text-decoration: none;
}

.marketing-logo:hover {
  text-decoration: none;
}

.marketing-logo-mark {
  position: relative;
  width: 28px;
  height: 28px;
  overflow: hidden;
  border-radius: var(--cv-radius-sm);
}

.marketing-logo-mark img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.marketing-lang-switch {
  padding: var(--cv-space-sm) var(--cv-space-md);
  border: 1px solid var(--cv-border);
  border-radius: var(--cv-radius-sm);
  color: var(--cv-fg-muted);
  font-family: var(--cv-font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    color var(--cv-duration) var(--cv-ease),
    border-color var(--cv-duration) var(--cv-ease);
}

.marketing-lang-switch:hover {
  color: var(--cv-fg);
  border-color: var(--cv-fg-muted);
  text-decoration: none;
}

.external-mark {
  margin-left: 4px;
  opacity: 0.6;
  font-size: 10px;
}

.feature-badge-pill {
  min-width: 38px;
  min-height: 20px;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--cv-border);
  background: color-mix(in srgb, var(--cv-elevated) 88%, transparent);
  font-family: var(--cv-font-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.feature-badge-pill--pro {
  border-color: color-mix(in srgb, var(--cv-secondary) 36%, var(--cv-border));
  background: color-mix(in srgb, var(--cv-secondary) 12%, var(--cv-elevated));
  color: var(--cv-secondary);
}

.feature-badge-pill--in-progress {
  border-color: color-mix(in srgb, var(--cv-primary) 32%, var(--cv-border));
  background: color-mix(in srgb, var(--cv-primary) 10%, var(--cv-elevated));
  color: var(--cv-primary);
}

.landing-sheet-trigger {
  padding: var(--cv-space-sm);
  border: 1px solid var(--cv-border);
  border-radius: var(--cv-radius-sm);
  background: transparent;
  color: var(--cv-fg);
  cursor: pointer;
  transition: border-color var(--cv-duration) var(--cv-ease);
}

.landing-sheet-trigger:hover {
  border-color: var(--cv-fg-muted);
}

.landing-sheet-trigger[aria-busy='true'] {
  opacity: 0.72;
}

.landing-sheet-trigger svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.marketing-nav-item {
  position: relative;
}

.marketing-nav-link {
  padding: var(--cv-space-sm) var(--cv-space-md);
  border-radius: var(--cv-radius-sm);
  color: var(--cv-fg-muted);
  font-family: var(--cv-font-mono);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    color var(--cv-duration) var(--cv-ease),
    background var(--cv-duration) var(--cv-ease);
}

.marketing-nav-link:hover,
.marketing-nav-trigger[aria-expanded='true'] {
  background: var(--cv-surface);
  color: var(--cv-fg);
  text-decoration: none;
}

.marketing-nav-trigger {
  gap: 6px;
  border: 1px solid var(--cv-border);
  background: transparent;
  cursor: pointer;
}

.marketing-nav-trigger::after {
  content: '▾';
  font-size: 10px;
  opacity: 0.65;
}

.marketing-nav-panel {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  z-index: 20;
  min-width: 320px;
  display: grid;
  gap: var(--cv-space-xs);
  padding: var(--cv-space-sm);
  border: 1px solid var(--cv-border);
  border-radius: var(--cv-radius-md);
  background: rgba(11, 13, 16, 0.96);
  box-shadow: var(--cv-glow-subtle);
}

.marketing-nav-panel[hidden] {
  display: none;
}

.marketing-feature-link {
  position: relative;
  display: grid;
  gap: 4px;
  padding: var(--cv-space-sm) var(--cv-space-md);
  border-radius: var(--cv-radius-sm);
  color: var(--cv-fg);
  text-decoration: none;
  transition:
    background var(--cv-duration) var(--cv-ease),
    color var(--cv-duration) var(--cv-ease);
}

.marketing-feature-link:hover {
  background: var(--cv-surface);
  color: var(--cv-primary);
  text-decoration: none;
}

.marketing-feature-title {
  font-family: var(--cv-font-mono);
  font-size: 12px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.marketing-feature-note {
  color: var(--cv-fg-muted);
  font-size: 12px;
  line-height: 1.45;
}

.marketing-feature-badge {
  position: absolute;
  top: var(--cv-space-xs);
  right: var(--cv-space-xs);
}

.marketing-footer-host {
  display: block;
  border-top: 1px solid var(--cv-border);
  background: var(--cv-bg);
}

.marketing-footer {
  max-width: var(--cv-max-width);
  margin: 0 auto;
  padding: var(--cv-space-2xl) var(--cv-padding-x) var(--cv-space-3xl);
}

.marketing-footer-top {
  gap: var(--cv-space-2xl);
  padding-bottom: var(--cv-space-xl);
  margin-bottom: var(--cv-space-xl);
  border-bottom: 1px solid var(--cv-border);
}

@media (max-width: 768px) {
  .marketing-footer-top {
    flex-direction: column;
    align-items: flex-start;
  }
}

.marketing-footer-logo {
  color: var(--cv-fg);
  font-family: var(--cv-font-mono);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.02em;
  text-decoration: none;
}

.marketing-footer-logo-mark {
  position: relative;
  width: 24px;
  height: 24px;
  overflow: hidden;
  border-radius: var(--cv-radius-sm);
}

.marketing-footer-logo-mark img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.marketing-footer-tagline {
  color: var(--cv-fg-muted);
  font-family: var(--cv-font-mono);
  font-size: 12px;
  letter-spacing: 0.02em;
}

.marketing-footer-link {
  padding: var(--cv-space-sm) var(--cv-space-md);
  border: 1px solid transparent;
  border-radius: var(--cv-radius-sm);
  color: var(--cv-fg-muted);
  font-family: var(--cv-font-mono);
  font-size: 12px;
  letter-spacing: 0.02em;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    color var(--cv-duration) var(--cv-ease),
    border-color var(--cv-duration) var(--cv-ease);
}

.marketing-footer-link:hover {
  color: var(--cv-fg);
  border-color: var(--cv-border);
  text-decoration: none;
}

.marketing-footer-link[aria-disabled='true'] {
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}

.marketing-footer-link--external::after {
  content: '↗';
  margin-left: 4px;
  font-size: 10px;
  opacity: 0.6;
}

.marketing-footer-legal {
  max-width: 700px;
  color: var(--cv-fg-muted);
  font-size: 12px;
  line-height: 1.6;
}

.marketing-footer-legal p {
  margin: 0 0 var(--cv-space-sm);
}

.marketing-footer-legal p:last-child {
  margin-bottom: 0;
}

.marketing-footer-copyright {
  color: var(--cv-fg-muted);
  font-family: var(--cv-font-mono);
  font-size: 11px;
}

.marketing-footer-mobile {
  max-width: var(--cv-content-width);
  margin: 0 auto;
  padding: var(--cv-space-xl) var(--cv-padding-x) var(--cv-space-2xl);
}

.marketing-footer-mobile-brand {
  color: var(--cv-fg);
  text-decoration: none;
}

.marketing-footer-mobile-copy {
  gap: 2px;
}

.marketing-footer-mobile-name {
  color: var(--cv-fg);
  font-family: var(--cv-font-body);
  font-size: 15px;
  font-weight: 600;
}

.marketing-footer-mobile-tagline {
  color: var(--cv-fg-muted);
  font-family: var(--cv-font-mono);
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.marketing-footer-mobile-link {
  padding: var(--cv-space-sm) var(--cv-space-md);
  border: 1px solid var(--cv-border);
  border-radius: var(--cv-radius-sm);
  color: var(--cv-fg-muted);
  font-family: var(--cv-font-mono);
  font-size: 12px;
  letter-spacing: 0.02em;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    color var(--cv-duration) var(--cv-ease),
    border-color var(--cv-duration) var(--cv-ease);
}

.marketing-footer-mobile-link:hover {
  color: var(--cv-fg);
  border-color: #3a4358;
  text-decoration: none;
}

.marketing-footer-mobile-link--external::after {
  content: '↗';
  margin-left: 4px;
  font-size: 10px;
  opacity: 0.6;
}

.marketing-footer-mobile-legal {
  padding-top: var(--cv-space-md);
  border-top: 1px solid var(--cv-border);
  color: var(--cv-fg-muted);
  font-size: 12px;
  line-height: 1.6;
}

.marketing-footer-mobile-legal p {
  margin: 0;
}

.marketing-footer-mobile-copyright {
  color: var(--cv-fg-muted);
  font-family: var(--cv-font-mono);
  font-size: 11px;
}

cv-drawer.marketing-drawer {
  --cv-drawer-size: min(300px, 80vw);
  --cv-drawer-z-index: 200;
  --cv-drawer-overlay-color: rgba(0, 0, 0, 0.6);
  --cv-drawer-overlay-closed-opacity: 0;
  --cv-drawer-overlay-transition-duration: var(--cv-drawer-transition-duration, 250ms);
  --cv-drawer-border-radius: 0px;
  --cv-drawer-header-spacing: var(--cv-space-lg);
  --cv-drawer-body-spacing: var(--cv-space-lg);
  --cv-drawer-footer-spacing: var(--cv-space-lg);
  display: block;
  height: 0;
  overflow: hidden;
  line-height: 0;
  font-size: 0;
}

cv-drawer.marketing-drawer::part(trigger) {
  display: none;
}

cv-drawer.marketing-drawer::part(overlay) {
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

cv-drawer.marketing-drawer[placement='end']::part(panel) {
  border-left: 1px solid var(--cv-border);
  inset-inline-start: auto;
  inset-block-end: auto;
  block-size: auto;
  max-block-size: 100dvh;
}

cv-drawer.marketing-drawer::part(header) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--cv-space-md);
  border-bottom: 1px solid var(--cv-border);
  background: var(--cv-bg);
}

cv-drawer.marketing-drawer::part(title) {
  margin: 0;
}

cv-drawer.marketing-drawer::part(description) {
  display: none;
}

cv-drawer.marketing-drawer::part(header-close) {
  padding: var(--cv-space-sm);
  background: transparent;
  border: 1px solid var(--cv-border);
  border-radius: var(--cv-radius-sm);
  color: var(--cv-fg);
  cursor: pointer;
}

cv-drawer.marketing-drawer::part(header-close):hover {
  border-color: var(--cv-fg-muted);
}

cv-drawer.marketing-drawer::part(body) {
  box-sizing: border-box;
}

cv-drawer.marketing-drawer::part(footer) {
  border-top: 1px solid var(--cv-border);
  background: var(--cv-bg);
}

.marketing-drawer-nav {
  gap: var(--cv-space-xs);
}

.marketing-drawer-group {
  gap: var(--cv-space-xs);
  padding-top: var(--cv-space-md);
  margin-top: var(--cv-space-sm);
  border-top: 1px solid var(--cv-border);
}

.marketing-drawer-group-label {
  padding: 0 var(--cv-space-md);
  color: var(--cv-primary);
}

.marketing-drawer-link {
  position: relative;
  display: block;
  padding: var(--cv-space-sm) var(--cv-space-md);
  border-radius: var(--cv-radius-sm);
  color: var(--cv-fg-muted);
  font-family: var(--cv-font-mono);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    color var(--cv-duration) var(--cv-ease),
    background var(--cv-duration) var(--cv-ease);
}

.marketing-drawer-link:hover {
  background: var(--cv-surface);
  color: var(--cv-fg);
  text-decoration: none;
}

.marketing-drawer-link-note {
  display: block;
  margin-top: 4px;
  color: var(--cv-fg-muted);
  font-size: 11px;
  line-height: 1.45;
  letter-spacing: 0;
  text-transform: none;
}

.marketing-drawer-badge {
  position: absolute;
  top: 8px;
  right: 16px;
}

.marketing-drawer-footer {
  width: 100%;
}
