/* Base Variables */
:root {
    /* Colour Palette */
    --parchment-light: #f9f5ed;
    --parchment: #f2ead7;
    --parchment-dark: #e4d7bc;
    --parchment-darker: #d5c9a6;
    --ink: #2a2522;
    --ink-faded: #584e45;
    --ink-light: #8a7e76;
    --accent: #8b4513;
    --accent-light: #b36520;
    --accent-faded: #c8955e;
    --correct: #2e6930;
    --incorrect: #9b2d2d;
    --swipe-hint: rgba(139, 69, 19, 0.3);
    --focus-outline: #0074d9;

    /* Textures */
    --parchment-texture: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23noise)' opacity='0.08'/%3E%3C/svg%3E");
    --ink-splatter: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cpath fill='%232a2522' opacity='0.03' d='M30,50 C35,40 40,45 50,30 C60,15 65,25 70,50 C75,75 60,85 50,70 C40,55 25,60 30,50 Z'/%3E%3C/svg%3E");

    /* Typography */
    --font-serif: 'Georgia', 'Palatino', 'Baskerville', 'Times New Roman', serif;
    --font-sans: 'Palatino', 'Baskerville', 'Georgia', serif;

    /* Sizing */
    --border-radius: 6px;
    --card-shadow: 0 4px 12px rgba(42, 37, 34, 0.15);
    --card-shadow-raised: 0 8px 24px rgba(42, 37, 34, 0.2);
    --border-style: 2px solid var(--parchment-darker);
    --edge-decoration: repeating-linear-gradient(45deg, transparent, transparent 3px, rgba(42, 37, 34, 0.03) 3px, rgba(42, 37, 34, 0.03) 6px);

    /* Touch targets */
    --min-touch-target: 44px;

    /* Transitions */
    --transition-quick: 0.2s ease;
    --transition-standard: 0.3s ease;
    --transition-slow: 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Ink Theme */
body[data-theme="ink"] {
    --parchment-light: #242124;
    --parchment: #1a191a;
    --parchment-dark: #131213;
    --parchment-darker: #0c0c0c;
    --ink: #e9e7e0;
    --ink-faded: #c5c2b9;
    --ink-light: #a19e97;
    --accent: #4e94ca;
    --accent-light: #6aaee3;
    --accent-faded: #3470a0;
    --correct: #46a049;
    --incorrect: #a04649;
    --swipe-hint: rgba(78, 148, 202, 0.3);
    --focus-outline: #6aaee3;
}

/* Lavender Theme */
body[data-theme="lavender"] {
    --parchment-light: #f7f4ff;
    --parchment: #eee6ff;
    --parchment-dark: #e3d5ff;
    --parchment-darker: #d3bdff;
    --ink: #2d2a3f;
    --ink-faded: #4a4563;
    --ink-light: #766e97;
    --accent: #9473db;
    --accent-light: #ac94e3;
    --accent-faded: #7d5ec5;
    --correct: #5b9e64;
    --incorrect: #c25f65;
    --swipe-hint: rgba(148, 115, 219, 0.3);
    --focus-outline: #ac94e3;
}

/* Sky Theme */
body[data-theme="sky"] {
    --parchment-light: #f0f8ff;
    --parchment: #e1f2fd;
    --parchment-dark: #cbe7fc;
    --parchment-darker: #b7defa;
    --ink: #2a3b47;
    --ink-faded: #465a6a;
    --ink-light: #6a8399;
    --accent: #3a9ad9;
    --accent-light: #60b1e8;
    --accent-faded: #2980ba;
    --correct: #41a465;
    --incorrect: #d3575f;
    --swipe-hint: rgba(58, 154, 217, 0.3);
    --focus-outline: #60b1e8;
}

/* Dark mode variables */
@media (prefers-color-scheme: dark) {
    :root {
        --parchment-light: #302c28;
        --parchment: #2a2622;
        --parchment-dark: #252220;
        --parchment-darker: #1e1a18;
        --ink: #f2ead7;
        --ink-faded: #d5c9a6;
        --ink-light: #a69d8c;
        --accent: #d5a566;
        --accent-light: #e8bf85;
        --accent-faded: #9c7950;
        --correct: #46a049;
        --incorrect: #a04649;
        --border-style: 2px solid var(--parchment-darker);
        --swipe-hint: rgba(213, 165, 102, 0.3);
        --focus-outline: #4cc9ff;
    }
}