:root {
  /* Foundation */
  --ds-bg: #040d14;
  --ds-bg-deep: #02070d;
  --ds-sidebar: #071821;
  --ds-sidebar-soft: #043142;
  --ds-ink: #071e26;
  --ds-ink-strong: #06323a;
  --ds-muted: #56757f;
  --ds-muted-bright: #4f7f8c;
  --ds-paper: rgba(240, 251, 252, 0.78);
  --ds-paper-strong: rgba(252, 255, 255, 0.92);
  --ds-paper-soft: rgba(226, 244, 246, 0.72);
  --ds-surface-bright: #f5feff;
  --ds-surface-clean: #fafeff;
  --ds-bg-aqua: #e8fbff;

  /* Brand and semantic colors */
  --ds-brand-blue: #007fe0;
  --ds-cyan: #20e0f0;
  --ds-mint: #54efd8;
  --ds-sky: #7ddcff;
  --ds-accent: #54efd8;
  --ds-accent-strong: #0f7f90;
  --ds-accent-blue: #007fe0;
  --ds-accent-cyan: #20e0f0;
  --ds-accent-sky: #7ddcff;
  --ds-accent-soft: rgba(84, 239, 216, 0.12);
  --ds-accent-soft-2: rgba(104, 220, 255, 0.16);
  --ds-accent-bright-soft: rgba(32, 224, 240, 0.18);
  --ds-brand-blue-soft: rgba(0, 127, 224, 0.14);
  --ds-ok: #1b9a6f;
  --ds-warn: #c58c26;
  --ds-danger: #bf5568;

  /* Lines and glass */
  --ds-line: rgba(111, 220, 226, 0.1);
  --ds-line-strong: rgba(106, 234, 215, 0.32);
  --ds-line-inverse: rgba(255, 255, 255, 0.08);
  --ds-sidebar-line: rgba(184, 247, 244, 0.15);
  --ds-glow-primary: rgba(62, 247, 212, 0.25);
  --ds-glow-secondary: rgba(79, 161, 255, 0.2);
  --ds-glow-tertiary: rgba(132, 253, 226, 0.14);
  --ds-glass-specular: rgba(255, 255, 255, 0.38);
  --ds-floating-control-bg:
    radial-gradient(circle at 22% 10%, rgba(109, 255, 238, 0.36), transparent 36%),
    radial-gradient(circle at 100% 86%, rgba(67, 154, 255, 0.32), transparent 42%),
    linear-gradient(135deg, rgba(3, 28, 40, 0.9), rgba(17, 82, 99, 0.82));
  --ds-floating-control-border: rgba(118, 255, 238, 0.36);
  --ds-floating-control-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -1px 0 rgba(78, 246, 224, 0.14),
    0 18px 38px rgba(0, 10, 18, 0.28),
    0 0 32px rgba(79, 238, 219, 0.2);

  /* Typography */
  --ds-font-sans: "MiSans", "HarmonyOS Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
  --ds-font-mono: "JetBrains Mono", "Cascadia Code", "SFMono-Regular", Consolas, monospace;
  --ds-text-xs: 12px;
  --ds-text-sm: 13px;
  --ds-text-md: 14px;
  --ds-text-lg: 16px;
  --ds-title-card: 20px;
  --ds-title-section: 24px;
  --ds-title-page: 34px;
  --ds-title-display-min: 42px;
  --ds-title-display-max: 66px;
  --ds-leading-tight: 1.15;
  --ds-leading-body: 1.65;

  /* Spacing */
  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 10px;
  --ds-space-4: 12px;
  --ds-space-5: 14px;
  --ds-space-6: 16px;
  --ds-space-7: 18px;
  --ds-space-8: 20px;
  --ds-space-9: 22px;
  --ds-space-10: 24px;
  --ds-space-11: 26px;
  --ds-space-12: 30px;
  --ds-space-page-x: 30px;
  --ds-space-page-y: 26px;

  /* Shape */
  --ds-radius-sm: 14px;
  --ds-radius-md: 16px;
  --ds-radius-nav: 20px;
  --ds-radius-card: 22px;
  --ds-radius-panel: 24px;
  --ds-radius-stage: 28px;
  --ds-radius-xl: 30px;
  --ds-radius-pill: 999px;
  --ds-radius-round: 50%;

  /* Elevation and motion */
  --ds-shadow-sm: 0 12px 24px rgba(8, 42, 56, 0.06);
  --ds-shadow-card: 0 24px 64px rgba(0, 7, 12, 0.28);
  --ds-shadow-strong: 0 42px 120px rgba(0, 6, 10, 0.42);
  --ds-shadow-hover: 0 34px 72px rgba(0, 12, 18, 0.24);
  --ds-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.42);
  --ds-motion-fast: 0.18s ease;
  --ds-motion-base: 0.22s ease;
  --ds-motion-smooth: 0.62s cubic-bezier(0.22, 1, 0.36, 1);
  --ds-motion-slow: 14s ease-in-out infinite;

  /* Layout */
  --ds-sidebar-width: clamp(188px, 13vw, 224px);
  --ds-sidebar-width-dashboard: var(--ds-sidebar-width);
  --ds-shell-topnav-breakpoint: 1090px;
  --ds-content-split-min: 400px;
  --ds-content-split-min-compact: 360px;
  --ds-content-split-min-crm: 380px;
  --ds-content-split-min-product: 410px;
  --ds-content-split-min-roomy: 400px;
  --ds-grid-min-compact: 150px;
  --ds-grid-min-form: 220px;
  --ds-content-max: 1720px;
  --ds-home-max: 1740px;
  --ds-floating-action: 52px;
  --ds-floating-action-mobile: 46px;
}