/* +Posts design tokens */
:root {
  --mp-primary: #7F77DD;
  --mp-primary-600: #6B63D0;
  --mp-primary-700: #534AB7;
  --mp-primary-800: #3F369B;
  --mp-primary-50: #F2F1FB;
  --mp-primary-100: #E6E4F7;
  --mp-primary-200: #CFCBF0;

  --mp-accent-pink: #FF6AA8;
  --mp-accent-orange: #FFB067;
  --mp-accent-cyan: #6EE0FF;

  --mp-bg: #FAFAFC;
  --mp-surface: #FFFFFF;
  --mp-surface-alt: #F5F4FA;
  --mp-border: #EAE8F2;
  --mp-border-strong: #D6D2E3;
  --mp-text: #1A1626;
  --mp-text-muted: #6B6580;
  --mp-text-soft: #9994A8;

  --mp-success: #2CC26A;
  --mp-success-bg: #E6F8EE;
  --mp-warning: #F59E0B;
  --mp-warning-bg: #FEF3D9;
  --mp-danger: #EF4B6B;
  --mp-danger-bg: #FDE7EC;

  --mp-r-sm: 8px;
  --mp-r-md: 12px;
  --mp-r-lg: 16px;
  --mp-r-xl: 20px;
  --mp-r-2xl: 24px;
  --mp-r-pill: 999px;

  --mp-shadow-sm: 0 1px 2px rgba(26,22,38,.04), 0 1px 3px rgba(26,22,38,.04);
  --mp-shadow-md: 0 4px 12px rgba(26,22,38,.06), 0 1px 3px rgba(26,22,38,.04);
  --mp-shadow-lg: 0 12px 32px rgba(26,22,38,.1), 0 4px 12px rgba(26,22,38,.06);
  --mp-glow: 0 0 0 4px rgba(127,119,221,.14);
  --mp-glow-strong: 0 8px 32px rgba(127,119,221,.35);

  --mp-font: 'Plus Jakarta Sans', 'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --mp-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
  --mp-ease: cubic-bezier(0.22, 1, 0.36, 1);

  --mp-grad-brand: linear-gradient(135deg, #7F77DD 0%, #534AB7 100%);
  --mp-grad-aurora: linear-gradient(135deg, #7F77DD 0%, #FF6AA8 50%, #FFB067 100%);
  --mp-grad-ai: linear-gradient(135deg, #6EE0FF 0%, #7F77DD 50%, #FF6AA8 100%);
  --mp-grad-soft: linear-gradient(180deg, #F2F1FB 0%, #FFFFFF 100%);
}

[data-theme="dark"] {
  --mp-bg: #0E0B1A;
  --mp-surface: #161327;
  --mp-surface-alt: #1E1A34;
  --mp-border: #2A2540;
  --mp-border-strong: #3D3659;
  --mp-text: #F5F3FC;
  --mp-text-muted: #A39BC2;
  --mp-text-soft: #6F6890;
  --mp-primary-50: #1A1432;
  --mp-primary-100: #24204A;
  --mp-success-bg: #0F2D1C;
  --mp-warning-bg: #2D2210;
  --mp-danger-bg: #2D1620;
  --mp-shadow-sm: 0 1px 2px rgba(0,0,0,.3);
  --mp-shadow-md: 0 4px 12px rgba(0,0,0,.35);
  --mp-shadow-lg: 0 12px 32px rgba(0,0,0,.5);
  --mp-grad-soft: linear-gradient(180deg, #1A1432 0%, #0E0B1A 100%);
}

* { box-sizing: border-box; }
button { font-family: inherit; }
html, body { margin: 0; padding: 0; height: 100%; }

.mp-root {
  font-family: var(--mp-font);
  color: var(--mp-text);
  background: var(--mp-bg);
  -webkit-font-smoothing: antialiased;
  line-height: 1.4;
}

.mp-scroll::-webkit-scrollbar { width: 0; height: 0; }
.mp-scroll { scrollbar-width: none; }

@keyframes mp-shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
@keyframes mp-pulse-glow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(127, 119, 221, 0.4); }
  50% { box-shadow: 0 0 0 12px rgba(127, 119, 221, 0); }
}
@keyframes mp-float {
  0%, 100% { transform: translateY(0px) rotate(var(--float-tilt,0deg)); }
  50% { transform: translateY(-6px) rotate(var(--float-tilt,0deg)); }
}
@keyframes mp-spin { to { transform: rotate(360deg); } }
@keyframes mp-fadeUp {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes mp-sparkle {
  0%, 100% { opacity: .3; transform: scale(.8) rotate(0deg); }
  50% { opacity: 1; transform: scale(1.1) rotate(180deg); }
}

.mp-shimmer-text {
  background: linear-gradient(90deg, var(--mp-text-muted) 0%, var(--mp-primary) 50%, var(--mp-text-muted) 100%);
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: mp-shimmer 2.2s linear infinite;
}

#root { height: 100vh; overflow: hidden; }