@charset "UTF-8";

/* ==================== 변수 (다크 테마) ==================== */
:root {
    --c-main: #1877f2;
    --c-main-dark: #1259c3;
    --c-main-light: #4a9bf5;
    --c-bg: #0d1421;
    --c-bg-alt: #111927;
    --c-bg-card: #161e2e;
    --c-text: #ffffff;
    --c-text-dim: #a0a0a0;
    --c-text-muted: #666666;
    --c-border: rgba(24, 119, 242, 0.2);
    --c-glow: rgba(24, 119, 242, 0.3);
    --font: 'Noto Sans KR', sans-serif;
    --radius: 8px;
    --radius-lg: 12px;
    --transition: 0.25s ease;
}

/* ==================== 라이트 테마 ==================== */
[data-theme="light"] {
    --c-bg: #f5f5f5;
    --c-bg-alt: #ffffff;
    --c-bg-card: #ffffff;
    --c-text: #1a1a1a;
    --c-text-dim: #555555;
    --c-text-muted: #888888;
    --c-border: rgba(24, 119, 242, 0.3);
}

/* ==================== 리셋 ==================== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
    font-family: var(--font);
    background: var(--c-bg);
    color: var(--c-text);
    line-height: 1.7;
    min-height: 100vh;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
ul, ol { list-style: none; }
button { font: inherit; cursor: pointer; border: none; background: none; }

/* ==================== 접근성 ==================== */
.skip-link {
    position: absolute;
    top: -50px;
    left: 0;
    background: var(--c-main);
    color: #000;
    padding: 8px 16px;
    z-index: 9999;
}
.skip-link:focus { top: 0; }