:root{
 /* Spacing Tokens */
 --space-1:8px;
 --space-2:16px;
 --space-3:24px;
 --space-4:32px;

 /* Border Radius */
 --radius-sm:8px;
 --radius:16px;
 --radius-lg:24px;

 /* Typography */
 --fs-h1:24px;
 --fs-title:18px;
 --fs-body:14px;
 --fs-small:12px;

 /* Colors - Light Mode by default for Naver feel */
 --bg-base:#f5f6f8;
 --bg-surface:#ffffff;
 --bg-elevated:#ffffff;
 --bg-overlay:rgba(0,0,0,0.05);

 --text-primary:#1e2022;
 --text-secondary:#505866;
 --text-muted:#8f97a3;

 --brand-primary:#3b82f6; /* Modern Blue */
 --brand-secondary:#8b5cf6; /* Modern Purple */
 
 --color-up:#ef4444; /* Red for up in KR market */
 --color-down:#3b82f6; /* Blue for down in KR market */

 /* Layout Constraints */
 --container:1200px;
 --safe-area-bottom:env(safe-area-inset-bottom, 20px);
}

@media (min-width: 1441px) {
 :root {
  /* Typography - Elegant compact scale for large screens matching dashboard densities */
  --fs-h1: 24px;
  --fs-title: 16px;
  --fs-body: 13px;
  --fs-small: 11px;

  /* Layout Constraints - wider screen */
  --container: 95%;
 }
}