:root{
    --orange:#ff5500;
    --orange-dark:#e04a00;
    --purple:#6616d8;
    --purple-dark:#5217af;
    --black:#111111;
    --white:#ffffff;
    --bg:#ececec;
    --bg-card:#ffffff;
    --line:#d8d8d8;
    --muted:#78757c;
    --radius:18px;
  }

  body.dark-mode{
    --black:#f5f5f5;
    --white:#111318;
    --bg:#17191f;
    --bg-card:#22252d;
    --line:#3a3f49;
    --muted:#a8adb7;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    font-family:'DM Sans',system-ui,sans-serif;
    background:var(--bg);
    color:var(--black);
    -webkit-font-smoothing:antialiased;
  }
  .app{max-width:1000px;margin:0 auto;padding:28px 22px 80px;}