/**
 * UnlockOS Design Tokens - Auto Generated
 * Theme: dark
 * Generated: 2026-01-17T04:49:39.023Z
 * Source: packages/full-package/src/sdk-ui/designTokens.ts
 *
 * DO NOT EDIT THIS FILE DIRECTLY
 * Run: pnpm run generate:tokens
 */

/* Dark theme for developer documentation */

/* Typography - Google Fonts (optimized: 7 weights instead of 14) */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700;900&family=JetBrains+Mono:wght@400&family=Inter:wght@400;700;900&display=swap');

:root {
  /* === OTHER === */
  --color-brand-primary: #488DE0;
  --color-brand-primary-hover: #3A7DD0;
  --color-brand-primary-active: #356DB0;
  --color-brand-primary-disabled: rgba(72, 141, 224, 0.5);
  --color-brand-secondary: #9B58DB;
  --color-brand-secondary-hover: #8B48CB;
  --color-brand-secondary-active: #7732C2;
  --color-brand-primary-light: #E0F2F9;
  --color-brand-primary-lighter: #F0F8FC;
  --color-brand-accent: #3BC3B9;
  --color-brand-accent-hover: #2DB3A9;
  --color-brand-accent-active: #25A399;
  --color-brand-sky-blue: #4AB4E8;
  --color-brand-coral-red: #FD706F;
  --color-brand-yellow: #F9D371;
  --color-bg-page: #0f172a;
  --color-bg-base: #1e293b;
  --color-bg-surface: #334155;
  --color-bg-disabled: #475569;
  --color-fg-primary: #f8fafc;
  --color-fg-muted: #94a3b8;
  --color-fg-subtle: #64748b;
  --color-fg-disabled: #475569;
  --color-status-danger: #DC3545;
  --color-status-danger-hover: #b91c1c;
  --color-status-danger-active: #991b1b;
  --color-status-danger-light: #FDEDEE;
  --color-status-danger-text: #DC3545;
  --color-status-success: #3BC3B9;
  --color-status-success-hover: #2DB3A9;
  --color-status-success-active: #25A399;
  --color-status-success-light: #E0F7F5;
  --color-status-success-text: #3BC3B9;
  --color-status-warning: #FFC107;
  --color-status-warning-light: #FFF8E7;
  --color-status-warning-text: #C28B00;
  --color-status-info: #4AB4E8;
  --color-status-info-light: #E0F2F9;
  --color-status-info-text: #4AB4E8;
  --color-border-base: rgba(255, 255, 255, 0.1);
  --color-border-focus: #488DE0;
  --color-glass-backdrop: rgba(0, 0, 0, 0.7);
  --color-glass-modal: rgba(30, 41, 59, 0.95);
  --color-glass-message: rgba(30, 41, 59, 1);
  --color-glass-border: rgba(255, 255, 255, 0.1);
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-full: 9999px;
  --radius-premium-card: 1rem;
  --radius-premium-modal: 1.5rem;
  --radius-premium-button: 9999px;
  --radius-premium-dropdown: 0.75rem;
  --radius-premium-input: 0.5rem;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --motion-fast: 120ms;
  --motion-base: 180ms;
  --motion-slow: 240ms;
  --motion-easing: ease-in-out;
  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --shadow-focus: 0 0 0 3px rgba(72, 141, 224, 0.4);
  --shadow-button: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --shadow-button-hover: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --shadow-secondary-button: 0 2px 4px -1px rgb(0 0 0 / 0.06), 0 1px 2px -1px rgb(0 0 0 / 0.06);
  --shadow-secondary-button-hover: 0 4px 6px -1px rgb(0 0 0 / 0.08), 0 2px 4px -2px rgb(0 0 0 / 0.08);
  --shadow-premium-card: 0 25px 60px -15px rgba(0, 0, 0, 0.06);
  --shadow-premium-card-hover: 0 45px 90px -20px rgba(0, 0, 0, 0.1);
  --shadow-premium-button-glow-primary: 0 15px 30px -5px rgba(72, 141, 224, 0.5);
  --shadow-premium-button-glow-secondary: 0 15px 30px -5px rgba(155, 88, 219, 0.5);
  --shadow-premium-button-glow-accent: 0 15px 30px -5px rgba(59, 195, 185, 0.5);
  --shadow-premium-button-glow-danger: 0 15px 30px -5px rgba(220, 53, 69, 0.5);
  --effect-button-hover-transform: scale(1.02);
  --effect-button-active-transform: scale(1);
  --effect-secondary-button-hover-transform: scale(1.02);
  --effect-secondary-button-active-transform: scale(1);
  --effect-premium-card-hover-transform: translateY(-12px);
  --effect-premium-card-hover-transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  --effect-premium-button-hover-transform: translateY(-4px) scale(1.02);
  --effect-premium-button-active-transform: translateY(-2px) scale(1);
  --state-disabled-opacity: 0.5;
  --state-disabled-cursor: not-allowed;
  --backdrop-blur-light: 2px;
  --backdrop-blur-medium: 4px;
  --backdrop-blur-strong: 8px;
  --backdrop-filter-light: blur(2px);
  --backdrop-filter-medium: blur(4px);
  --backdrop-filter-strong: blur(8px);
  --backdrop-filter-glass: blur(4px) saturate(180%);
  --backdrop-modal-background-color: rgba(0, 0, 0, 0.1);
  --backdrop-modal-backdrop-filter: blur(8px);
  --backdrop-modal-webkit-backdrop-filter: blur(8px);
  --backdrop-modal-content-background-color: rgba(255, 255, 255, 0.9);
  --backdrop-modal-content-backdrop-filter: blur(4px);
  --backdrop-modal-content-webkit-backdrop-filter: blur(4px);
  --glass-premium-backdrop: blur(25px);
  --glass-premium-background: rgba(255, 255, 255, 0.7);
  --glass-premium-background-strong: rgba(255, 255, 255, 0.85);
  --glass-premium-border: 2px solid rgba(255, 255, 255, 0.8);
  --glass-premium-border-subtle: 2px solid rgba(255, 255, 255, 0.5);
  --transition-modal-duration: 0.3s;
  --transition-modal-easing: ease-out;
  --transition-modal-overlay-duration: 0.2s;
  --transition-modal-overlay-easing: ease-out;
  --transition-modal-content-duration: 0.3s;
  --transition-modal-content-easing: ease-out;
  --transition-button-duration: 0.2s;
  --transition-button-easing: ease-out;
  --transition-default-duration: 0.2s;
  --transition-default-easing: ease-out;
  --typography-font-family-primary: 'Noto Sans JP', 'Inter', system-ui, -apple-system, sans-serif;
  --typography-font-family-mono: 'JetBrains Mono', 'SFMono-Regular', Menlo, Monaco, Consolas, monospace;
  --typography-font-size-xs: 0.75rem;
  --typography-font-size-sm: 0.875rem;
  --typography-font-size-base: 1rem;
  --typography-font-size-lg: 1.125rem;
  --typography-font-size-xl: 1.25rem;
  --typography-font-size-2xl: 1.5rem;
  --typography-font-size-3xl: 1.875rem;
  --typography-font-size-4xl: 2.25rem;
  --typography-font-size-5xl: 3rem;
  --typography-font-weight-light: 300;
  --typography-font-weight-normal: 400;
  --typography-font-weight-medium: 500;
  --typography-font-weight-semibold: 600;
  --typography-font-weight-bold: 700;
  --typography-font-weight-black: 900;
  --typography-line-height-tight: 1.25;
  --typography-line-height-snug: 1.375;
  --typography-line-height-normal: 1.5;
  --typography-line-height-relaxed: 1.625;
  --typography-line-height-loose: 2;
  --typography-letter-spacing-tighter: -0.05em;
  --typography-letter-spacing-tight: -0.025em;
  --typography-letter-spacing-normal: 0;
  --typography-letter-spacing-wide: 0.025em;
  --typography-letter-spacing-wider: 0.05em;

}