/* SOLEENIA DESIGN TOKENS */
:root {
  /* Brand colors */
  --coral: #ff6b6b;
  --coral-soft: #ff8787;
  --peach: #ffa94d;
  --peach-soft: #ffb976;
  --sand: #fff4ed;
  --sand-warm: #fde8db;
  --earth: #8b5a3c;
  --earth-soft: #a67656;

  /* Functional */
  --bg: #fffaf6;
  --surface: #ffffff;
  --surface-2: #fef4ec;
  --ink: #1f1510;
  --ink-2: #4a3a30;
  --ink-3: #8a7668;
  --line: #f1e3d6;
  --line-2: #e8d5c4;

  /* Semantic */
  --success: #4ecb71;
  --warning: #ffa94d;
  --danger: #ff6b6b;
  --info: #6babff;

  /* Gradients */
  --grad-sunset: linear-gradient(135deg, #ff6b6b 0%, #ffa94d 100%);
  --grad-soft: linear-gradient(135deg, #ffe6d9 0%, #fff4ed 100%);
  --grad-natural: linear-gradient(135deg, #fff4ed 0%, #fef9f5 100%);

  /* Radii */
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 999px;

  /* Shadow */
  --sh-sm: 0 1px 2px rgba(139,90,60,.06), 0 1px 1px rgba(139,90,60,.04);
  --sh-md: 0 4px 16px rgba(139,90,60,.08), 0 1px 3px rgba(139,90,60,.06);
  --sh-lg: 0 12px 32px rgba(255,107,107,.12), 0 4px 12px rgba(139,90,60,.08);
  --sh-coral: 0 8px 24px rgba(255,107,107,.32);

  /* Type */
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-display: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; font-family: var(--font-sans); color: var(--ink); background: var(--bg); -webkit-font-smoothing: antialiased; }
button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }
input, textarea, select { font-family: inherit; }
a { color: inherit; text-decoration: none; }

/* Logo mark as inline SVG helper */
.sol-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--grad-sunset);
  color: white;
  border-radius: 30%;
  flex-shrink: 0;
}

/* Common components */
.btn-primary {
  background: var(--grad-sunset);
  color: white;
  padding: 14px 24px;
  border-radius: var(--r-pill);
  font-weight: 600;
  box-shadow: var(--sh-coral);
  transition: transform .15s ease, box-shadow .15s ease;
}
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 12px 28px rgba(255,107,107,.4); }
.btn-primary:active { transform: translateY(0); }

.btn-ghost {
  background: var(--sand-warm);
  color: var(--earth);
  padding: 12px 20px;
  border-radius: var(--r-pill);
  font-weight: 600;
}

.pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: var(--r-pill);
  font-size: 12px;
  font-weight: 600;
}
.pill-coral { background: rgba(255,107,107,.12); color: var(--coral); }
.pill-peach { background: rgba(255,169,77,.14); color: #e8862b; }
.pill-earth { background: rgba(139,90,60,.10); color: var(--earth); }

.card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 20px;
}

/* Scrollbar */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--line-2); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--earth-soft); }
