

:root {
  
  --bg:            #090C13;
  --bg-2:          #0C1019;
  --surface:       #111624;
  --surface-2:     #161C2C;
  --surface-3:     #1C2436;
  --surface-hover: #1F293D;

  
  --line:          #212A3C;
  --line-2:        #2B3549;
  --line-3:        #3A465F;

  
  --text:          #E9EDF5;
  --text-2:        #A6B1C6;
  
  --text-3:        #7B87A0;   
  --text-4:        #7A87A3;   

  
  --accent:        #3D9EE8;
  --accent-2:      #2C86CC;
  --accent-3:      #1E6DAB;
  --accent-soft:   rgba(61, 158, 232, .13);
  --accent-line:   rgba(61, 158, 232, .34);
  --on-accent:     #04121E;

  
  --ok:            #34BC85;
  --ok-soft:       rgba(52, 188, 133, .13);
  --warn:          #D9A63C;
  --warn-soft:     rgba(217, 166, 60, .13);
  --danger:        #E05A5A;
  --danger-soft:   rgba(224, 90, 90, .13);
  --gold:          #C7A76A;
  --gold-soft:     rgba(199, 167, 106, .13);

  
  --tier-new:      #717D95;
  --tier-active:   #6E9BC4;
  --tier-trusted:  #34BC85;
  --tier-verified: #3D9EE8;
  --tier-top:      #C7A76A;

  
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px;
  --s5: 20px; --s6: 24px; --s7: 32px; --s8: 40px;
  --s9: 56px; --s10: 72px;

  
  --r-xs: 6px; --r-sm: 9px; --r-md: 12px; --r-lg: 16px; --r-xl: 20px; --r-full: 999px;

  
  --sh-1: 0 1px 2px rgba(0,0,0,.4);
  --sh-2: 0 4px 14px rgba(0,0,0,.34);
  --sh-3: 0 12px 34px rgba(0,0,0,.44);

  
  --f-xs: 12px; --f-sm: 13px; --f-md: 14px; --f-base: 15px;
  --f-lg: 17px; --f-xl: 20px; --f-2xl: 24px; --f-3xl: 30px; --f-4xl: 38px;

  
  --wrap: 1280px;
  --header-h: 62px;
  --mobile-nav-h: 60px;

  --ease: cubic-bezier(.22, .61, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }

html, body {
  margin: 0; padding: 0;
  background: var(--bg);
  color: var(--text);
}
html { -webkit-text-size-adjust: 100%; }

body {
  font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo',
               'Segoe UI', 'Noto Sans KR', 'Malgun Gothic', system-ui, sans-serif;
  font-size: var(--f-base);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;               
  word-break: keep-all;             
  overflow-wrap: anywhere;          
}

h1, h2, h3, h4 { margin: 0; font-weight: 700; line-height: 1.3; letter-spacing: -.01em; }
p { margin: 0; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
input, textarea, select { font: inherit; color: inherit; }
img, svg { max-width: 100%; }
ul, ol { margin: 0; padding: 0; list-style: none; }
table { border-collapse: collapse; width: 100%; }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }

::selection { background: rgba(61,158,232,.3); }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--bg-2); }
::-webkit-scrollbar-thumb { background: var(--line-2); border-radius: 99px; border: 2px solid var(--bg-2); }
::-webkit-scrollbar-thumb:hover { background: var(--line-3); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}
