/* 01-tokens.css — Design tokens */
:root {
  /* Colors */
  --c-bg:        #fafafa;
  --c-surface:   #ffffff;
  --c-surface-2: #f5f5f5;
  --c-surface-3: #eeeeee;
  --c-border:    #e0e0e0;
  --c-border-hi: #bdbdbd;
  --c-text:      #1a1a1a;
  --c-text-2:    #616161;
  --c-text-3:    #9e9e9e;
  --c-primary:     #2563eb;
  --c-primary-d:   #1d4ed8;
  --c-primary-bg:  #eff6ff;
  --c-primary-hover: #1d4ed8;
  --c-warning:     #d97706;
  --c-accent:    #059669;
  --c-accent-d:  #047857;
  --c-danger:    #dc2626;
  --c-danger-bg: #fef2f2;
  --c-warn:      #d97706;
  --c-warn-bg:   #fffbeb;
  --c-info:      #2563eb;
  --c-info-bg:   #eff6ff;
  --c-success:   #059669;
  --c-success-bg:#ecfdf5;
  --c-error:     #dc2626;
  --c-error-bg:  #fef2f2;

  /* Dark */
  --dark-bg:        #0a0a0a;
  --dark-surface:   #141414;
  --dark-surface-2: #1f1f1f;
  --dark-surface-3: #2a2a2a;
  --dark-border:    #2a2a2a;
  --dark-border-hi: #404040;
  --dark-text:      #e5e5e5;
  --dark-text-2:    #a3a3a3;
  --dark-text-3:    #737373;

  /* Spacing */
  --s-1: 0.25rem;  --s-2: 0.5rem;   --s-3: 0.75rem;
  --s-4: 1rem;     --s-5: 1.5rem;   --s-6: 2rem;
  --s-7: 3rem;     --s-8: 4rem;     --s-9: 6rem;

  /* Typography */
  --font-sans: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'SF Mono', Monaco, 'Cascadia Code', monospace;
  --text-xs:  0.64rem;  --text-sm:  0.8rem;
  --text-base: 1rem;    --text-md:  1.25rem;
  --text-lg:  1.563rem; --text-xl:  1.953rem;

  /* Motion */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 120ms;  --dur-base: 200ms;  --dur-slow: 300ms;

  /* Layout */
  --drawer-w: 260px;
  --appbar-h: 56px;
  --max-w:    1200px;
  --radius:   6px;
  --radius-sm: 4px;
  --radius-lg: 10px;
}

[data-theme="dark"] {
  --c-bg:        var(--dark-bg);
  --c-surface:   var(--dark-surface);
  --c-surface-2: var(--dark-surface-2);
  --c-surface-3: var(--dark-surface-3);
  --c-border:    var(--dark-border);
  --c-border-hi: var(--dark-border-hi);
  --c-text:      var(--dark-text);
  --c-text-2:    var(--dark-text-2);
  --c-text-3:    var(--dark-text-3);
}
