:root{
  --bg:#0B0B10;
  --bg2:#17181E;
  --surface:#1E2028;
  --border:#2A2C36;
  --text:#EDEEF2;
  --text2:#B6B8C4;
  --muted:#8A8D99;
  --accent:#FF6816;
  --accentHover:#E85E14;
  --accentSoft:#FFB07A;
}

.canvas-grid{
  background-color:#0E0F14;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size: 32px 32px;
}

/* scrollbars (optional) */
* { scrollbar-color: var(--border) var(--bg); }
*::-webkit-scrollbar { height: 10px; width: 10px; }
*::-webkit-scrollbar-track { background: var(--bg); }
*::-webkit-scrollbar-thumb { background: var(--border); border-radius: 999px; }
*::-webkit-scrollbar-thumb:hover { background: #3A3D4A; }

.app-shell .app-sidebar a { color: inherit; }
.app-shell .app-sidebar a:hover { color: inherit; text-decoration: none; }