/* Pixal3D shared design tokens */
:root {
  color-scheme: light;

  --color-bg: #f4f1ea;
  --color-bg-soft: #ece7db;
  --color-bg-strong: #141922;
  --color-bg-stronger: #0d1118;
  --color-surface: #fffaf1;
  --color-surface-2: #f8f3e8;
  --color-panel: #1d2430;
  --color-panel-2: #263141;
  --color-ink: #16191f;
  --color-ink-soft: #38404a;
  --color-muted: #69707b;
  --color-muted-strong: #8b928c;
  --color-line: #d8cfbd;
  --color-line-dark: #384151;
  --color-white: #ffffff;

  --color-cyan: #18aebd;
  --color-cyan-dark: #0f7884;
  --color-coral: #e3564a;
  --color-coral-dark: #a83a31;
  --color-lime: #78a95a;
  --color-lime-dark: #4f7737;
  --color-violet: #6661e8;
  --color-violet-dark: #3f3aa4;
  --color-gold: #d99a29;
  --color-gold-dark: #916014;

  --gradient-brand: linear-gradient(135deg, var(--color-cyan), var(--color-violet) 55%, var(--color-coral));
  --gradient-warm: linear-gradient(135deg, var(--color-coral), var(--color-gold));
  --gradient-field:
    linear-gradient(rgba(20, 25, 34, 0.86), rgba(20, 25, 34, 0.94)),
    linear-gradient(90deg, rgba(24, 174, 189, 0.12) 1px, transparent 1px),
    linear-gradient(rgba(217, 154, 41, 0.12) 1px, transparent 1px);

  --shadow-sm: 0 1px 2px rgba(13, 17, 24, 0.08);
  --shadow-md: 0 10px 24px rgba(13, 17, 24, 0.12);
  --shadow-lg: 0 22px 56px rgba(13, 17, 24, 0.18);
  --shadow-inset: inset 0 0 0 1px rgba(255, 255, 255, 0.06);

  --font-ui: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-cjk: "Noto Sans CJK SC", "Noto Sans CJK JP", "Noto Sans KR", "Hiragino Sans", "Yu Gothic", "Malgun Gothic", var(--font-ui);
  --font-mono: "JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: 1.0625rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 2rem;
  --text-3xl: 2.75rem;
  --text-4xl: 4rem;

  --leading-tight: 1.12;
  --leading-body: 1.7;
  --leading-loose: 1.9;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-14: 3.5rem;
  --space-16: 4rem;
  --space-20: 5rem;

  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-card: 8px;
  --radius-pill: 999px;

  --layout-page-max: 1180px;
  --layout-wide-max: 1480px;
  --layout-gutter: clamp(1rem, 3vw, 2.5rem);
  --layout-section-y: clamp(3.5rem, 7vw, 6.5rem);
  --layout-nav-height: 68px;
  --layout-lang-height: 38px;
  --layout-hero-min: calc(100vh - var(--layout-nav-height));

  --transition-fast: 160ms ease;
  --transition-base: 240ms ease;
  --transition-slow: 420ms ease;
}