/* ===== MessBoss design tokens ===== */
:root{
  --font-display:'Montserrat',system-ui,sans-serif;
  --font-body:'Poppins',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;

  --bg:#f6f8fb;
  --bg-soft:#eef2f7;
  --surface:#ffffff;
  --surface-2:#fafbfe;
  --surface-3:#f3f6fb;
  --border:#e8edf3;
  --border-strong:#dbe3ec;
  --text:#0f172a;
  --text-2:#4a5870;
  --text-3:#8593a8;

  --primary:#4f46e5;
  --primary-600:#4338ca;
  --primary-700:#3730a3;
  --primary-soft:#eef2ff;
  --on-primary:#ffffff;

  --emerald:#10b981;
  --emerald-600:#059669;
  --emerald-soft:#ecfdf5;
  --amber:#f59e0b;
  --amber-600:#d97706;
  --amber-soft:#fef3c7;
  --rose:#ef4444;
  --rose-soft:#fee2e2;
  --violet:#8b5cf6;
  --violet-soft:#f3e8ff;

  --hero-glow-a:rgba(99,102,241,.12);
  --hero-glow-b:rgba(16,185,129,.09);
  --ink-card-a:#0f172a;
  --ink-card-b:#1e293b;

  --shadow-sm:0 2px 8px rgba(15,23,42,.04);
  --shadow-md:0 6px 18px rgba(15,23,42,.06);
  --shadow-lg:0 24px 60px -18px rgba(15,23,42,.22);
  --shadow-primary:0 12px 28px rgba(79,70,229,.32);

  --nav-bg:rgba(246,248,251,.82);
  --radius:16px;
}

html.dark{
  --bg:#0b0f1a;
  --bg-soft:#0e1320;
  --surface:#141a2a;
  --surface-2:#1a2233;
  --surface-3:#1e2740;
  --border:#242e44;
  --border-strong:#2f3a55;
  --text:#eef2f8;
  --text-2:#a7b3c7;
  --text-3:#6a778f;

  --primary:#6366f1;
  --primary-600:#4f46e5;
  --primary-700:#4338ca;
  --primary-soft:#1c2140;
  --on-primary:#ffffff;

  --emerald:#34d399;
  --emerald-600:#10b981;
  --emerald-soft:#0d2a21;
  --amber:#fbbf24;
  --amber-600:#f59e0b;
  --amber-soft:#2c2310;
  --rose:#f87171;
  --rose-soft:#2c1717;
  --violet:#a78bfa;
  --violet-soft:#221a33;

  --hero-glow-a:rgba(99,102,241,.20);
  --hero-glow-b:rgba(16,185,129,.12);
  --ink-card-a:#161d30;
  --ink-card-b:#0d1322;

  --shadow-sm:0 2px 8px rgba(0,0,0,.3);
  --shadow-md:0 6px 18px rgba(0,0,0,.35);
  --shadow-lg:0 24px 60px -18px rgba(0,0,0,.6);
  --shadow-primary:0 12px 28px rgba(79,70,229,.4);

  --nav-bg:rgba(11,15,26,.8);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0;
  font-family:var(--font-body);
  background:var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  transition:background .3s ease,color .3s ease;
}
::selection{background:#c7d2fe;color:#1e1b4b;}
html.dark ::selection{background:#3730a3;color:#e0e7ff;}
a{color:inherit;}

input[type=range]{-webkit-appearance:none;appearance:none;height:6px;border-radius:99px;outline:none;cursor:pointer;}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--primary);box-shadow:0 2px 8px rgba(79,70,229,.35);cursor:pointer;transition:transform .15s;}
input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.12);}
input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--primary);box-shadow:0 2px 8px rgba(79,70,229,.35);cursor:pointer;}
input:focus,textarea:focus,select:focus{outline:none;}

::-webkit-scrollbar{width:11px;height:11px;}
::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:99px;border:3px solid var(--bg);}
::-webkit-scrollbar-track{background:transparent;}

@keyframes mbPulse{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes mbPing{0%{transform:scale(.6);opacity:.7}80%,100%{transform:scale(2.2);opacity:0}}
@keyframes mbSpin{to{transform:rotate(360deg)}}
@keyframes mbMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes mbFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}