@charset "UTF-8";
:root {
  --mobile: 768px;
  --color-white: #FFFFFF;
  --color-black: #17212B;
  --color-primary: #4C739B;
  --color-secondary: #7394B5;
  --color-action: #4C739B;
  --color-on-action: #FFFFFF;
  --color-accent-ink: #365B7F;
  --color-accent-surface: #DDEAF7;
  --color-success: #287652;
  --color-warning: #8A6200;
  --color-danger: #B6423C;
  --color-info: #365B7F;
  --color-gray-100: #F4F7FB;
  --color-gray-200: #EEF4FA;
  --color-gray-300: #E3EAF1;
  --color-gray-400: #D7E1EB;
  --color-gray-500: #B9C4CF;
  --color-gray-600: #7B8794;
  --color-gray-700: #5B6672;
  --color-gray-800: #35414D;
  --color-gray-900: #17212B;
  --color-gray-10: #17212B;
  --color-background: #F4F7FB;
  --color-grouped-content-background: #FFFFFF;
  --color-surface-muted: #EEF4FA;
  --color-text-primary: #17212B;
  --color-text-secondary: #5B6672;
  --color-border: #D7E1EB;
  --color-control-border: #7B8794;
  --color-focus-ring: #456A94;
  --cloud-ground: #F4F7FB;
  --cloud-surface: #FFFFFF;
  --cloud-surface-muted: #EEF4FA;
  --cloud-line: #D7E1EB;
  --cloud-text: #17212B;
  --cloud-text-muted: #5B6672;
  --cloud-action: #4C739B;
  --cloud-on-action: #FFFFFF;
  --cloud-accent-ink: #365B7F;
  --cloud-accent-surface: #DDEAF7;
  --cloud-accent: #365B7F;
  --cloud-focus: #456A94;
  --cloud-radius-sm: 6px;
  --cloud-radius-md: 8px;
  --cloud-radius-lg: 0.75rem;
  --cloud-motion-fast: 160ms;
  --container-max-width: 1366px;
  --cloud-content-max: 76rem;
  --base-font-family: SF Pro KR, SF Pro Text, Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, Apple SD Gothic Neo, Malgun Gothic, Noto Sans KR, Segoe UI, sans-serif;
  --border-radius-1: 6px;
  --border-radius-2: 8px;
  --border-radius-3: 0.75rem;
  --border-radius-4: 1rem;
  --box-shadow-1: rgba(0,0,0,0.1) 0 0 8px;
  --box-shadow-2: rgba(0,0,0,0.05) 0 6px 24px;
  --card-shadow: rgba(0,0,0,0.05) 0 6px 20px;
  --bottom-nav-height: 3.5rem;
  --bottom-nav-ios-padding: 1rem;
  --aside-side-nav-width: calc(var(--aside-width) + var(--side-nav-width));
}
.app-theme-dark {
  --box-shadow-1: var(--color-gray-500) 0 0 10px -1px;
}

