/* 상상이상 LMS — generated from tokens.json */
:root {
  --blue-50: #EAF0FF;
  --blue-100: #DCE6FF;
  --blue-200: #B9CCFF;
  --blue-300: #8AABFF;
  --blue-400: #5583FF;
  --blue-500: #1C59FE;
  --blue-600: #1A47D1;
  --blue-700: #1438A6;
  --blue-800: #102C80;
  --blue-900: #0B1F5C;
  --navy-50: #E5EAF4;
  --navy-500: #002060;
  --navy-700: #001640;
  --gray-0: #FFFFFF;
  --gray-25: #F8F9FB;
  --gray-50: #F4F6F9;
  --gray-100: #EEF0F3;
  --gray-200: #E3E7ED;
  --gray-300: #D5DAE1;
  --gray-400: #A9B1BD;
  --gray-500: #8A93A0;
  --gray-600: #666E7A;
  --gray-700: #4A5260;
  --gray-800: #353B45;
  --gray-900: #2A2A2A;
  --success-50: #E2F5EC;
  --success-500: #12A267;
  --success-700: #0A7349;
  --warning-50: #FFF1D6;
  --warning-500: #D68000;
  --warning-700: #8F5200;
  --danger-50: #FDE7E8;
  --danger-500: #D52B35;
  --danger-700: #B0202A;
  --collab-50: #EFEAFF;
  --collab-500: #6A45E0;
  --collab-700: #5532C2;
  --surface: var(--gray-0);
  --surface-alt: var(--gray-50);
  --surface-sunken: var(--gray-100);
  --border: var(--gray-200);
  --border-strong: var(--gray-300);
  --border-control: var(--gray-500);
  --ink: var(--gray-900);
  --ink-secondary: var(--gray-700);
  --ink-muted: var(--gray-600);
  --ink-disabled: var(--gray-400);
  --primary: var(--blue-500);
  --primary-hover: var(--blue-600);
  --primary-pressed: var(--blue-700);
  --primary-soft: var(--blue-50);
  --on-primary: var(--gray-0);
  --link: var(--blue-600);
  --focus-ring: var(--blue-500);
  --brand-navy: var(--navy-500);
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.06);
  --shadow-md: 0 6px 16px rgba(16, 24, 40, 0.10);
  --shadow-lg: 0 16px 40px rgba(16, 24, 40, 0.18);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;
  --control-sm: 32px;
  --control-md: 40px;
  --control-lg: 48px;
  --badge-sm: 20px;
  --badge-md: 26px;
  --badge-lg: 32px;
  --gnb-height: 72px;
  --container: 1300px;
  --font-sans: "Pretendard Variable", Pretendard, -apple-system, "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
  --font-num: "Pretendard Variable", Pretendard, -apple-system, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
}
@font-face { font-family: 'Pretendard Variable'; src: url('fonts/PretendardVariable.woff2') format('woff2'); font-weight: 45 920; font-display: swap; }
.display { font-family: var(--font-sans); font-size: 32px; line-height: 42px; font-weight: 700; letter-spacing: -0.02em; }
.h1 { font-family: var(--font-sans); font-size: 24px; line-height: 34px; font-weight: 700; letter-spacing: -0.01em; }
.h2 { font-family: var(--font-sans); font-size: 20px; line-height: 30px; font-weight: 700; }
.h3 { font-family: var(--font-sans); font-size: 18px; line-height: 27px; font-weight: 600; }
.title { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 600; }
.body-lg { font-family: var(--font-sans); font-size: 16px; line-height: 26px; font-weight: 400; }
.body { font-family: var(--font-sans); font-size: 14px; line-height: 22px; font-weight: 400; }
.body-strong { font-family: var(--font-sans); font-size: 14px; line-height: 22px; font-weight: 600; }
.caption { font-family: var(--font-sans); font-size: 13px; line-height: 20px; font-weight: 400; }
.label { font-family: var(--font-sans); font-size: 12px; line-height: 18px; font-weight: 500; }
.num-xl { font-family: var(--font-num); font-size: 36px; line-height: 40px; font-weight: 700; }
.num-lg { font-family: var(--font-num); font-size: 20px; line-height: 24px; font-weight: 700; }
.num { font-family: var(--font-num); font-size: 13px; line-height: 16px; font-weight: 400; }