/* === CSS VARIABLES ===
   모든 CSS 커스텀 프로퍼티(변수)들을 정의합니다. */

:root {
    --bg-dark: #080d18;
    --bg-light: #101827;
    --surface: #1b2940;
    --surface-elevated: #263956;
    --surface-muted: #121b2d;
    --primary: #ef4444;
    --primary-strong: #b91c1c;
    --secondary: #000000;
    --accent: #ffe600;
    --accent-cool: #5f9fcb;
    --accent-warm: #ff9f1c;
    --border-strong: #03050b;
    --border-soft: #5f6f8f;
    --text-light: #ffffff;
    --text-dark: #e2e8f0;
    --text-muted: #bac7d8;
    --correct: #00c853;
    --incorrect: #ef4444;
    --retrying: #ff9f1c;
    --revealed: #5f9fcb;
    --subject-high-accuracy: #ef4444;

    --font-base: 'Noto Sans KR', sans-serif;
    --font-display: 'Galmuri9', 'Galmuri11', 'Press Start 2P', cursive;
    --font-mono: 'Galmuri9', monospace;

    --space-xs: 0.4rem;
    --space-sm: 0.8rem;
    --space-md: 1.6rem;
    --space-lg: 2.4rem;
    --space-xl: 3.2rem;
    --radius-sm: 0;
    --radius-md: 0;
    --radius-lg: 0;
    --pixel-border: 0.3rem solid var(--border-strong);
    --shadow-hard: 0.5rem 0.5rem 0 var(--border-strong);
    --shadow-soft: 0.3rem 0.3rem 0 rgba(3, 5, 11, 0.92);

    --mushroom-outline-width: 3px; /* 버섯 캐릭터와 동일한 외곽선 두께 */

    font-size: 10px;
}

/* === 다크 테마 지원 ===
   추후 테마 전환 기능을 위한 준비 */
[data-theme='dark'] {
    --bg-dark: #1a1a2e;
    --bg-light: #16213e;
    --text-light: #f0f0f0;
    --text-dark: #a0a0a0;
}

[data-theme='light'] {
    --bg-dark: #f8f9fa;
    --bg-light: #ffffff;
    --text-light: #212529;
    --text-dark: #6c757d;
}