/**
 * Autional Design Tokens — GENERATED FILE — DO NOT EDIT. Source: tokens/tokens.json · Regenerate: pnpm gen · v0.1.0-rc
 */

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('./fonts/inter-latin-wght-normal.woff2') format('woff2');
}

:root {
/* ── color ── */
--color-primary-50: #e8f1f8;
--color-primary-100: #d1e3f1;
--color-primary-200: #a3c7e3;
--color-primary-300: #75abd5;
--color-primary-400: #478fc7;
--color-primary-500: #235f84;
--color-primary-600: #004565;
--color-primary-700: #003153;
--color-primary-800: #002540;
--color-primary-900: #041d31;
--color-sky-50: #f2fafd;
--color-sky-100: #eef9fd;
--color-sky-200: #d5f0f9;
--color-sky-300: #bde6f5;
--color-sky-400: #a2dcf0;
--color-sky-500: #87ceeb;
--color-sky-600: #64b4d8;
--color-sky-700: #429bc5;
--color-sky-800: #2d7ca3;
--color-sky-900: #1c5d7e;
--color-amber-50: #fffcf0;
--color-amber-100: #fff8e6;
--color-amber-200: #ffefb3;
--color-amber-300: #ffe480;
--color-amber-400: #ffd94d;
--color-amber-500: #ffbf00;
--color-amber-600: #d9a300;
--color-amber-700: #b38700;
--color-amber-800: #8c6b00;
--color-amber-900: #664f00;
--color-neutral-0: #ffffff;
--color-neutral-50: #fafbfc;
--color-neutral-100: #f7fafd;
--color-neutral-200: #eef2f6;
--color-neutral-300: #dce3ea;
--color-neutral-400: #b0bcc8;
--color-neutral-500: #8896a6;
--color-neutral-600: #64748b;
--color-neutral-700: #475569;
--color-neutral-800: #334155;
--color-neutral-900: #1e293b;
--color-success: #52c41a;
--color-warning: #faad14;
--color-danger: #ff4d4f;
--color-danger-text: #c62828;
--color-info: #1890ff;
--color-chart-1: #003153;
--color-chart-2: #235f84;
--color-chart-3: #429bc5;
--color-chart-4: #b38700;
--color-chart-5: #664f00;
--color-chart-6: #059669;
--color-chart-7: #8b5cf6;
--color-chart-8: #ef4444;
--color-method-get: var(--color-primary-600);
--color-method-post: var(--color-success);
--color-method-put: var(--color-amber-600);
--color-method-patch: var(--color-sky-600);
--color-method-delete: var(--color-danger);
--color-method-head: var(--color-neutral-500);
--color-bg-primary: var(--color-neutral-50);
--color-bg-surface: var(--color-neutral-0);
--color-bg-elevated: var(--color-neutral-0);
--color-bg-muted: #f8fbfe;
--color-bg-developer: #031425;
--color-text-primary: var(--color-primary-900);
--color-text-secondary: var(--color-primary-600);
--color-text-muted: #64748d;
--color-text-inverse: #f8fbfe;
--color-border: var(--color-border-subtle);
--color-border-subtle: var(--color-primary-200);
--color-border-strong: #2d7ca3;
--color-brand-base: var(--color-primary-700);
--color-brand-hover-base: var(--color-primary-600);
--color-brand-dark: var(--color-sky-500);
--color-brand-dark-hover: var(--color-sky-400);
--color-on-brand-base: #ffffff;
--color-on-brand: var(--color-on-brand-base);
--color-on-brand-dark: #0a0f1a;
--color-brand: var(--color-brand-base);
--color-brand-hover: var(--color-brand-hover-base);
--color-brand-soft: var(--color-sky-300);
--color-brand-active: var(--color-primary-800);
--color-accent: var(--color-amber-500);

/* ── font ── */
--font-sans: Inter, -apple-system, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', 'Noto Sans CJK SC', sans-serif;
--font-serif: 'Source Han Serif SC', 'Noto Serif SC', serif;
--font-mono: 'JetBrains Mono', 'Fira Code', Consolas, monospace;

/* ── font-size ── */
--font-size-xs: 12px;
--line-height-xs: 16px;
--font-size-sm: 14px;
--line-height-sm: 20px;
--font-size-base: 16px;
--line-height-base: 24px;
--font-size-lg: 18px;
--line-height-lg: 28px;
--font-weight-lg: 500;
--font-size-xl: 20px;
--line-height-xl: 28px;
--font-weight-xl: 600;
--font-size-2xl: 24px;
--line-height-2xl: 32px;
--font-weight-2xl: 700;
--font-size-3xl: 30px;
--line-height-3xl: 36px;
--font-weight-3xl: 700;
--font-size-4xl: 36px;
--line-height-4xl: 40px;
--font-size-display-xl: 48px;
--line-height-display-xl: 1.16;
--font-weight-display-xl: 800;
--letter-spacing-display-xl: -0.02em;
--font-size-display-lg: 40px;
--line-height-display-lg: 1.2;
--font-weight-display-lg: 800;
--letter-spacing-display-lg: -0.015em;
--font-size-heading-lg: 30px;
--line-height-heading-lg: 1.35;
--font-weight-heading-lg: 700;
--letter-spacing-heading-lg: -0.01em;
--font-size-heading-md: 22px;
--line-height-heading-md: 1.45;
--font-weight-heading-md: 700;
--letter-spacing-heading-md: 0;
--font-size-body-lg: 18px;
--line-height-body-lg: 1.75;
--font-size-body-md: 16px;
--line-height-body-md: 1.75;
--font-size-body-sm: 14px;
--line-height-body-sm: 1.6;
--font-size-label-md: 14px;
--line-height-label-md: 1.43;
--font-weight-label-md: 600;
--font-size-label-caps: 12px;
--line-height-label-caps: 1.35;
--font-weight-label-caps: 600;
--letter-spacing-label-caps: 0.12em;
--font-size-code-md: 14px;
--line-height-code-md: 1.75;

/* ── space ── */
--space-1: 4px;
--space-2: 8px;
--space-3: 12px;
--space-4: 16px;
--space-5: 20px;
--space-6: 24px;
--space-8: 32px;
--space-10: 40px;
--space-12: 48px;

/* ── radius ── */
--radius-sm: 8px;
--radius-md: 16px;
--radius-lg: 24px;
--radius-xl: 28px;
--radius-xxl: 32px;
--radius-full: 9999px;

/* ── shadow ── */
--shadow-soft: 0 8px 20px rgba(0, 49, 83, 0.08);
--shadow-card: 0 12px 36px rgba(0, 49, 83, 0.10);
--shadow-brand: 0 24px 80px rgba(0, 49, 83, 0.14);

/* ── motion ── */
--motion-duration-instant: 100ms;
--motion-duration-fast: 150ms;
--motion-duration-base: 200ms;
--motion-duration-slow: 300ms;
--motion-duration-slower: 500ms;
--motion-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
--motion-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
--motion-ease-in: cubic-bezier(0.4, 0, 1, 1);
--motion-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

/* ── focus ── */
--focus-ring-width: 2px;
--focus-ring-offset: 2px;
--focus-ring-color: var(--color-primary-500);

/* ── z ── */
--z-base: 0;
--z-dropdown: 1000;
--z-sticky: 1020;
--z-fixed: 1030;
--z-modal-backdrop: 1040;
--z-modal: 1050;
--z-popover: 1060;
--z-toast: 1070;
--z-tooltip: 1080;

/* ── layout ── */
--layout-max-width: 1280px;
--layout-prose-width: 768px;
--layout-breakpoint-sm: 640px;
--layout-breakpoint-md: 768px;
--layout-breakpoint-lg: 1024px;
--layout-breakpoint-xl: 1280px;
--layout-breakpoint-2xl: 1536px;

/* ── a11y ── */
--a11y-touch-target: 44px;

/* ── image ── */
--image-brand-radial: radial-gradient(circle at top, rgba(135, 206, 235, 0.22), transparent 44%);
--image-brand-grid: linear-gradient(rgba(0, 49, 83, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 49, 83, 0.08) 1px, transparent 1px);
--image-page-light: radial-gradient(circle at top left, rgba(135, 206, 235, 0.18), transparent 28%), radial-gradient(circle at top right, rgba(255, 191, 0, 0.10), transparent 22%), linear-gradient(180deg, #f8fbfe 0%, #ffffff 26%, #f7fafd 100%);
--image-page-dark: radial-gradient(circle at top left, rgba(135, 206, 235, 0.12), transparent 28%), radial-gradient(circle at top right, rgba(255, 191, 0, 0.08), transparent 20%), linear-gradient(180deg, #041d31 0%, #031425 45%, #020b14 100%);
}

@layer base {
  html {
    font-family: var(--font-sans);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  body {
    background-color: var(--color-bg-primary);
    color: var(--color-text-primary);
    margin: 0;
  }
  :focus-visible {
    outline: var(--focus-ring-width) solid var(--focus-ring-color);
    outline-offset: var(--focus-ring-offset);
  }
}

[data-theme="portal"] {
/* ── color ── */
--color-bg-primary: var(--color-neutral-0);
--color-brand: var(--color-brand-base, var(--color-primary-600));
--color-brand-hover: var(--color-brand-hover-base, var(--color-primary-500));
--color-brand-soft: var(--color-sky-400);
}

[data-theme="auth"] {
/* ── color ── */
--color-bg-primary: var(--color-neutral-0);
--color-brand: var(--color-brand-base, var(--color-primary-600));
--color-brand-hover: var(--color-brand-hover-base, var(--color-primary-500));
}

.dark,
[data-theme="dark"] {
  color-scheme: dark;

/* ── color ── */
--color-neutral-0: #0a0f1a;
--color-neutral-50: #0f1a2e;
--color-neutral-100: #142238;
--color-neutral-200: #1a2a42;
--color-neutral-300: #1f3350;
--color-neutral-400: #2a4060;
--color-neutral-500: #4a6585;
--color-neutral-600: #6b8caa;
--color-neutral-700: #8fb0cc;
--color-neutral-800: #b5d0e6;
--color-neutral-900: #e2edf5;
--color-bg-primary: var(--color-primary-900);
--color-bg-surface: #0a2940;
--color-bg-elevated: #0f3348;
--color-bg-muted: #0a1f30;
--color-text-primary: #f8fbfe;
--color-text-secondary: #87ceeb;
--color-text-muted: #8896a6;
--color-border-subtle: #1a4a65;
--color-border-strong: #429bc5;
--color-border: var(--color-border-strong);
--color-danger-text: #ff4d4f;
--color-brand: var(--color-brand-dark);
--color-brand-hover: var(--color-brand-dark-hover);
--color-on-brand: var(--color-on-brand-dark);
--color-brand-soft: var(--color-sky-700);
--color-chart-1: #75abd5;
--color-chart-2: #bde6f5;
--color-chart-3: #87ceeb;
--color-chart-4: #ffe480;
--color-chart-5: #ffbf00;
--color-chart-6: #6ee7b7;
--color-chart-7: #a78bfa;
--color-chart-8: #f87171;

/* ── focus ── */
--focus-ring-color: var(--color-sky-500);
}

[data-theme="authenticator"] {
  color-scheme: dark;

/* ── color ── */
--color-neutral-0: #0a0f1a;
--color-neutral-50: #0f1a2e;
--color-neutral-100: #142238;
--color-neutral-200: #1a2a42;
--color-neutral-300: #1f3350;
--color-neutral-400: #2a4060;
--color-neutral-500: #4a6585;
--color-neutral-600: #6b8caa;
--color-neutral-700: #8fb0cc;
--color-neutral-800: #b5d0e6;
--color-neutral-900: #e2edf5;
--color-bg-primary: #0a0a0a;
--color-bg-surface: #141414;
--color-bg-elevated: #1f1f1f;
--color-bg-muted: #0a1f30;
--color-text-primary: #f5f5f5;
--color-text-secondary: #a3a3a3;
--color-text-muted: #8896a6;
--color-border-subtle: #2a2a2a;
--color-border-strong: #666666;
--color-border: var(--color-border-strong);
--color-danger-text: #ff4d4f;
--color-brand: var(--color-primary-500);
--color-brand-hover: var(--color-primary-400);
--color-on-brand: var(--color-on-brand-dark);
--color-brand-soft: var(--color-sky-700);
--color-chart-1: #75abd5;
--color-chart-2: #bde6f5;
--color-chart-3: #87ceeb;
--color-chart-4: #ffe480;
--color-chart-5: #ffbf00;
--color-chart-6: #6ee7b7;
--color-chart-7: #a78bfa;
--color-chart-8: #f87171;

/* ── focus ── */
--focus-ring-color: var(--color-sky-500);
}

@media (prefers-reduced-motion: reduce) {
  *,
  ::before,
  ::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
