/* ── PretendardGOV @font-face ── */ @font-face { font-family: 'PretendardGOV'; font-weight: 400; font-style: normal; font-display: swap; src: url('/fonts/PretendardGOV-Regular.otf') format('opentype'); } @font-face { font-family: 'PretendardGOV'; font-weight: 500; font-style: normal; font-display: swap; src: url('/fonts/PretendardGOV-Medium.otf') format('opentype'); } @font-face { font-family: 'PretendardGOV'; font-weight: 600; font-style: normal; font-display: swap; src: url('/fonts/PretendardGOV-SemiBold.otf') format('opentype'); } @font-face { font-family: 'PretendardGOV'; font-weight: 700; font-style: normal; font-display: swap; src: url('/fonts/PretendardGOV-Bold.otf') format('opentype'); } @layer base { :root { /* bg — Background */ --bg-base: #0a0e1a; --bg-surface: #0f1524; --bg-elevated: #121929; --bg-card: #1a2236; --bg-surface-hover: #1e2844; /* stroke — Border */ --stroke-default: #1e2a42; --stroke-light: #2a3a5c; /* fg — Foreground */ --fg-default: #edf0f7; --fg-sub: #c0c8dc; --fg-disabled: #9ba3b8; /* color — Palette */ --color-info: #3b82f6; --color-accent: #06b6d4; --color-accent-muted: #0e7490; --color-danger: #ef4444; --color-warning: #f97316; --color-caution: #eab308; --color-success: #22c55e; --color-tertiary: #a855f7; --color-boom: #f59e0b; --color-boom-hover: #fbbf24; --color-navy: #1e40af; --color-navy-hover: #1d4ed8; /* font */ --font-korean: 'PretendardGOV', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Pretendard Variable', Pretendard, Roboto, 'Noto Sans KR', 'Segoe UI', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif; --font-mono: 'PretendardGOV', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Pretendard Variable', Pretendard, Roboto, 'Noto Sans KR', 'Segoe UI', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif; /* radius */ --radius-sm: 6px; --radius-md: 8px; /* typography — font-size */ --font-size-display-1: 3.75rem; --font-size-display-2: 2.5rem; --font-size-display-3: 2.25rem; --font-size-heading-1: 2rem; --font-size-heading-2: 1.5rem; --font-size-heading-3: 1.375rem; --font-size-title-1: 1.125rem; --font-size-subtitle: 0.9375rem; --font-size-title-2: 1rem; --font-size-title-3: 0.875rem; --font-size-title-4: 0.8125rem; --font-size-title-5: 0.75rem; --font-size-title-6: 0.6875rem; --font-size-body-1: 0.875rem; --font-size-body-2: 0.8125rem; --font-size-label-1: 0.75rem; --font-size-label-2: 0.6875rem; --font-size-caption: 0.6875rem; /* typography — font-weight */ --font-weight-thin: 300; --font-weight-regular: 400; --font-weight-medium: 500; --font-weight-bold: 700; /* typography — line-height */ --line-height-tight: 1.3; --line-height-snug: 1.4; --line-height-normal: 1.5; --line-height-relaxed: 1.6; /* typography — letter-spacing */ --letter-spacing-display: 0.06em; --letter-spacing-heading: 0.02em; --letter-spacing-body: 0em; --letter-spacing-navigation: 0.02em; --letter-spacing-label: 0.04em; /* === Design Token System === */ /* Static */ --static-black: #131415; --static-white: #ffffff; /* Gray */ --gray-100: #f1f5f9; --gray-200: #e2e8f0; --gray-300: #cbd5e1; --gray-400: #94a3b8; --gray-500: #64748b; --gray-600: #475569; --gray-700: #334155; --gray-800: #1e293b; --gray-900: #0f172a; --gray-1000: #020617; /* Blue */ --blue-100: #dbeafe; --blue-200: #bfdbfe; --blue-300: #93c5fd; --blue-400: #60a5fa; --blue-500: #3b82f6; --blue-600: #2563eb; --blue-700: #1d4ed8; --blue-800: #1e40af; --blue-900: #1e3a8a; --blue-1000: #172554; /* Green */ --green-100: #dcfce7; --green-200: #bbf7d0; --green-300: #86efac; --green-400: #4ade80; --green-500: #22c55e; --green-600: #16a34a; --green-700: #15803d; --green-800: #166534; --green-900: #14532d; --green-1000: #052e16; /* Yellow */ --yellow-100: #fef9c3; --yellow-200: #fef08a; --yellow-300: #fde047; --yellow-400: #facc15; --yellow-500: #eab308; --yellow-600: #ca8a04; --yellow-700: #a16207; --yellow-800: #854d0e; --yellow-900: #713f12; --yellow-1000: #422006; /* Red */ --red-100: #fee2e2; --red-200: #fecaca; --red-300: #fca5a5; --red-400: #f87171; --red-500: #ef4444; --red-600: #dc2626; --red-700: #b91c1c; --red-800: #991b1b; --red-900: #7f1d1d; --red-1000: #450a0a; /* Purple */ --purple-100: #f3e8ff; --purple-200: #e9d5ff; --purple-300: #d8b4fe; --purple-400: #c084fc; --purple-500: #a855f7; --purple-600: #9333ea; --purple-700: #7e22ce; --purple-800: #6b21a8; --purple-900: #581c87; --purple-1000: #3b0764; /* hover overlay */ --hover-overlay: rgba(255, 255, 255, 0.06); --dropdown-bg: rgba(18, 25, 41, 0.97); } /* ── Light theme overrides ── */ [data-theme='light'] { --bg-base: #f8fafc; --bg-surface: #ffffff; --bg-elevated: #f1f5f9; --bg-card: #ffffff; --bg-surface-hover: #e2e8f0; --stroke-default: #cbd5e1; --stroke-light: #e2e8f0; --fg-default: #0f172a; --fg-sub: #475569; --fg-disabled: #94a3b8; --hover-overlay: rgba(0, 0, 0, 0.04); --dropdown-bg: rgba(255, 255, 255, 0.97); --color-accent-muted: #0891b2; --color-navy: #1d4ed8; --color-navy-hover: #2563eb; } * { margin: 0; padding: 0; box-sizing: border-box; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body { font-family: 'PretendardGOV', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Pretendard Variable', Pretendard, Roboto, 'Noto Sans KR', 'Segoe UI', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif; background: var(--bg-base); color: var(--fg-default); height: 100vh; overflow: hidden; font-weight: 400; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; } /* Date input calendar icon — white for dark theme */ input[type='date']::-webkit-calendar-picker-indicator { filter: invert(1); cursor: pointer; opacity: 0.7; } input[type='date']::-webkit-calendar-picker-indicator:hover { opacity: 1; } /* Light theme: calendar icon reset */ [data-theme='light'] input[type='date']::-webkit-calendar-picker-indicator { filter: none; } /* Light theme: invert white logos */ [data-theme='light'] .wing-logo { filter: brightness(0) saturate(100%); } }