/* Light theme */
[data-theme="light"] {
    --bg: #f0f0f5;
    --surface: rgba(255,255,255,0.95);
    --surface2: rgba(230,230,245,0.85);
    --text: #1a1a2e;
    --text2: #6a6a8e;
    --accent: #6c5ce7;
    --accent2: #5a4bd8;
    --border: rgba(108,92,231,0.25);
    --shadow: 0 4px 24px rgba(0,0,0,0.12);
}

/* Sepia theme */
[data-theme="sepia"] {
    --bg: #f4ecd8;
    --surface: rgba(244,236,216,0.95);
    --surface2: rgba(224,214,190,0.85);
    --text: #3b2f1e;
    --text2: #7a6b50;
    --accent: #8b6f47;
    --accent2: #6d5939;
    --border: rgba(139,111,71,0.3);
    --shadow: 0 4px 24px rgba(0,0,0,0.15);
}

/* Dark theme (default) */
[data-theme="dark"] {
    --bg: #1a1a2e;
    --surface: rgba(30,30,60,0.92);
    --surface2: rgba(40,40,80,0.85);
    --text: #e0e0ff;
    --text2: #a0a0cc;
    --accent: #7c6bf5;
    --accent2: #5a4bd8;
    --border: rgba(124,107,245,0.3);
    --shadow: 0 4px 24px rgba(0,0,0,0.5);
}

/* Grid colors for themes */
[data-theme="light"] #grid-canvas { --grid-color: rgba(0,0,0,0.12); --grid-center: rgba(0,0,0,0.25); }
[data-theme="sepia"] #grid-canvas { --grid-color: rgba(59,47,30,0.15); --grid-center: rgba(59,47,30,0.3); }
[data-theme="dark"] #grid-canvas { --grid-color: rgba(255,255,255,0.08); --grid-center: rgba(255,255,255,0.2); }