/* DirtyMinds — Design Tokens & Base Styles */

:root {
  /* Background */
  --color-bg: #0f0f13;
  --color-surface: #1a1a24;
  --color-surface-raised: #22222f;
  --color-border: #2e2e3f;

  /* Brand */
  --color-primary: #ff4d8f;
  --color-primary-dim: #ff4d8f26;
  --color-accent: #ff8c42;

  /* Text */
  --color-text: #f0f0f5;
  --color-text-muted: #8888aa;
  --color-text-faint: #44445a;

  /* Status colors — card borders */
  --status-open: #f5c842;
  --status-active: #ff4d4d;
  --status-paused: #ff8c42;
  --status-done: #4dcc8f;
  --status-followup: #4d9fff;
  --status-archived: #666680;

  /* Reactions */
  --reaction-bg: #ffffff0f;
  --reaction-bg-active: #ff4d8f22;
  --reaction-border-active: #ff4d8f66;

  /* Typography */
  --font-body: 'Inter', system-ui, -apple-system, sans-serif;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-bold: 700;

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;

  /* Layout */
  --nav-height: 64px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-top: env(safe-area-inset-top, 0px);
  --card-radius: 16px;
  --sheet-radius: 24px;
  --touch-min: 48px;
}

* {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  -webkit-user-select: none;
  user-select: none;
}

body {
  font-family: var(--font-body);
  font-size: var(--font-size-base);
  line-height: 1.5;
  color: var(--color-text);
  background-color: var(--color-bg);
  overflow: hidden;
}

input, textarea {
  -webkit-user-select: text;
  user-select: text;
}

button {
  cursor: pointer;
  border: none;
  background: none;
  font-family: inherit;
  font-size: inherit;
}

/* Scrollbar (for modal content) */
::-webkit-scrollbar {
  width: 4px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: var(--color-border);
  border-radius: 2px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--color-text-muted);
}