/* GENERATED by packages/plain-ui/scripts/gen-tokens-css.mjs from @workspace/tokens. Do not edit.
   Loaded before /_r/styles.css. sRGB hex in comments = oklchToSrgb(), identical to the native theme. */

:root {
  color-scheme: dark;

  /* Brand — colors.ts `brand`, sRGB fallback */
  --bloxwap-green: #00ff3f;
  --bloxwap-blue: #35b5ff;
  --bloxwap-purple: #b300ff;
  --bloxwap-pink: #ff479c;
  --bloxwap-yellow: #fffb38;
  --bloxwap-gold: #ffc83d;
  --bloxwap-black: #0a0a0a;

  /* Neutral ramp — every achromatic value of `semanticOklch`; the step name is L×1000 */
  --white-a10: oklch(1 0 0 / 10%); /* rgba(255, 255, 255, 0.1) */
  --white-a15: oklch(1 0 0 / 15%); /* rgba(255, 255, 255, 0.15) */
  --gray-985: oklch(0.985 0 0); /* #fafafa */
  --gray-922: oklch(0.922 0 0); /* #e5e5e5 */
  --gray-708: oklch(0.708 0 0); /* #a1a1a1 */
  --gray-556: oklch(0.556 0 0); /* #737373 */
  --gray-269: oklch(0.269 0 0); /* #262626 */
  --gray-205: oklch(0.205 0 0); /* #171717 */
  --gray-145: oklch(0.145 0 0); /* #0a0a0a */

  /* Radius — radii.ts base + shadcn offsets; pills for controls */
  --radius: 0.625rem;
  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);
  --radius-2xl: 1rem;
  --radius-full: 9999px;

  /* Type — type.ts `textScale` (rem at a 16px root) */
  --text-3xs: 0.625rem; --leading-3xs: 0.875rem;
  --text-2xs: 0.6875rem; --leading-2xs: 1rem;
  --text-xs: 0.75rem; --leading-xs: 1rem;
  --text-sm: 0.875rem; --leading-sm: 1.25rem;
  --text-base: 1rem; --leading-base: 1.5rem;
  --text-lg: 1.125rem; --leading-lg: 1.75rem;
  --text-xl: 1.25rem; --leading-xl: 1.75rem;
  --text-2xl: 1.5rem; --leading-2xl: 2rem;
  --text-3xl: 1.875rem; --leading-3xl: 2.25rem;
  --text-4xl: 2.25rem; --leading-4xl: 2.5rem;
  --text-5xl: 3rem; --leading-5xl: 1;
  --text-6xl: 3.75rem; --leading-6xl: 1;
  --text-7xl: 4.5rem; --leading-7xl: 1;
  --text-8xl: 6rem; --leading-8xl: 1;
  --text-9xl: 8rem; --leading-9xl: 1;

  /* Spacing — spacing.ts `spacingSteps` × 0.25rem */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 0.75rem;
  --space-lg: 1rem;
  --space-xl: 1.25rem;
  --space-2xl: 1.5rem;
  --space-3xl: 2rem;
  --space-4xl: 2.5rem;
  --space-5xl: 3rem;
  --space-6xl: 4rem;

  /* Motion — motion.ts */
  --duration-fast: 180ms;
  --duration-base: 260ms;
  --duration-slow: 320ms;
  --ease-spring: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-standard: ease-out;

  /* Icons — icons.ts (24×24 viewBox) */
  --icon-xs: 12px;
  --icon-sm: 14px;
  --icon-md: 16px;
  --icon-lg: 20px;
  --icon-xl: 24px;
  --icon-2xl: 36px;
  --icon-3xl: 44px;
  --icon-stroke: 2;

  /* Font stacks — copied from apps/app globals.css (body) and layout.tsx (mono fallback) */
  --font-sans: 'Bloxwap Sans', ui-rounded, 'SF Pro Rounded', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'Bloxwap Mono', ui-monospace, SFMono-Regular, Menlo, monospace, 'PingFang SC', 'Hiragino Sans GB', 'Apple SD Gothic Neo', 'Malgun Gothic';
}

@supports (color: color(display-p3 1 1 1)) {
  :root {
    --bloxwap-green: color(display-p3 0 1 0.24);
    --bloxwap-blue: color(display-p3 0.18 0.72 1);
    --bloxwap-purple: color(display-p3 0.7 0 1);
    --bloxwap-pink: color(display-p3 1 0.24 0.62);
    --bloxwap-yellow: color(display-p3 1 0.98 0.18);
    --bloxwap-gold: color(display-p3 1 0.78 0.2);
    --bloxwap-black: color(display-p3 0.04 0.04 0.04);
  }
}

/* Semantic layer — shadcn names, `semanticOklch` mapping verbatim */
:root {
  --background: var(--gray-145);
  --foreground: var(--gray-985);
  --card: var(--gray-205);
  --card-foreground: var(--gray-985);
  --popover: var(--gray-205);
  --popover-foreground: var(--gray-985);
  --primary: var(--gray-922);
  --primary-foreground: var(--gray-205);
  --secondary: var(--gray-269);
  --secondary-foreground: var(--gray-985);
  --muted: var(--gray-269);
  --muted-foreground: var(--gray-708);
  --accent: var(--gray-269);
  --accent-foreground: var(--gray-985);
  --destructive: oklch(0.704 0.191 22.216); /* #ff6467 */
  --border: var(--white-a10);
  --input: var(--white-a15);
  --ring: var(--gray-556);
  --chart-1: oklch(0.488 0.243 264.376); /* #1447e6 */
  --chart-2: oklch(0.696 0.17 162.48); /* #00bc7d */
  --chart-3: oklch(0.769 0.188 70.08); /* #fe9a00 */
  --chart-4: oklch(0.627 0.265 303.9); /* #ad46ff */
  --chart-5: oklch(0.645 0.246 16.439); /* #ff2056 */
  --sidebar: var(--gray-205);
  --sidebar-foreground: var(--gray-985);
  --sidebar-primary: oklch(0.488 0.243 264.376); /* #1447e6 */
  --sidebar-primary-foreground: var(--gray-985);
  --sidebar-accent: var(--gray-269);
  --sidebar-accent-foreground: var(--gray-985);
  --sidebar-border: var(--white-a10);
  --sidebar-ring: var(--gray-556);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 0ms;
    --duration-base: 0ms;
    --duration-slow: 0ms;
  }
}