:root {
  --text: #1a1a1a;
  --text-soft: #5c6670;
  --brand: #3179d9;
  --brand-dark: #2e69a6;
  --brand-hover: #004588;
  --brand-gradient: linear-gradient(225deg, #4a95ef 0%, #2e69a6 100%);
  --brand-gradient-hover: linear-gradient(225deg, #5ba0f5 0%, #3574b5 100%);
  --bg: #fcffff;
  --bg-alt: #f3f4f7;
  --bg-muted: #f0eff2;
  --white: #fff;
  --line: rgba(46, 105, 166, 0.1);
  --shadow: 0 8px 32px rgba(46, 105, 166, 0.1);
  --shadow-video: 0 12px 48px rgba(46, 105, 166, 0.14);
  --radius: 12px;
  --radius-lg: 16px;
  --container: 1120px;
  --header-h: 72px;
  --nav-gap: 1.5rem;
  --font: "Inter", system-ui, sans-serif;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --t: 0.3s var(--ease);
}

@view-transition { navigation: auto; }