/* XERKONIX TACTILE tokens · v4.1.0 */
:root {
  --palette-canvas: #F5F5F5;
  --palette-surface: #FBFBFC;
  --palette-white: #FFFFFF;
  --palette-mist: #CFD3DA;
  --palette-ice: #E9E9E9;
  --palette-aquamarine-light: #269DB0;
  --palette-aquamarine-dark: #65C9D9;
  --palette-ink: #111111;
  --n-0: #FFFFFF;
  --n-50: #FBFBFC;
  --n-100: #F5F5F5;
  --n-200: #E9E9E9;
  --n-300: #CFD3DA;
  --n-400: #AEB4BD;
  --n-500: #767678;
  --n-600: #636365;
  --n-700: #3A3A3C;
  --n-800: #22262C;
  --n-900: #111111;
  --white: #FFFFFF;
  --font: "Pretendard Variable",Pretendard,"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI","Apple SD Gothic Neo","Noto Sans CJK KR","Malgun Gothic",sans-serif;
  --mono: "SFMono-Regular",Consolas,"Liberation Mono",monospace;
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --ease: cubic-bezier(.22,1,.36,1);
  --duration: 220ms;
  --glass-blur: 20px;
  --radius-pill: 999px;
  --radius-input: 12px;
  --radius-card: 20px;
  --radius-panel: 28px;
  --radius-circle: 50%;
  --space-9: 96px;
  --space-10: 128px;
  --fs-display: 56px;
  --fs-h1: 40px;
  --fs-h2: 28px;
  --fs-h3: 20px;
  --fs-lead: 17px;
  --fs-body: 15px;
  --fs-small: 13px;
  --fs-label: 12px;
  --fs-caption: 12px;
  --fs-num-xl: 64px;
  --fs-num-lg: 40px;
  --fs-num-md: 28px;
  --fw-thin: 200;
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --lh-tight: 1.1;
  --lh-heading: 1.25;
  --lh-body: 1.6;
  --ls-display: -.045em;
  --ls-heading: -.03em;
  --ls-num: -.05em;
  --t-1: 120ms;
  --t-2: 200ms;
  --t-3: 320ms;
  --t-4: 560ms;
  --t-5: 900ms;
  --ease-out: cubic-bezier(.22,1,.36,1);
  --ease-inout: cubic-bezier(.65,0,.35,1);
  --press-scale: .97;
  --glass-1-blur: 16px;
  --glass-2-blur: 28px;
  --glass-2-blur-mobile: 16px;
  --glass-3-blur: 32px;
  --glass-saturate: 1.5;
  --control-h: 48px;
  --control-h-sm: 36px;
  --icon-btn-size: 44px;
  --text-to-action: 24px;
  --touch-min: 44px;
  color-scheme: light;
  --canvas: #F5F5F5;
  --surface: #FBFBFC;
  --surface-raised: #FFFFFF;
  --ink: #111111;
  --muted: #636365;
  --faint: #767678;
  --accent: #269DB0;
  --accent-deep: #111111;
  --ice: #E9E9E9;
  --mist: #CFD3DA;
  --line: rgba(17,17,17,.10);
  --line-soft: rgba(17,17,17,.065);
  --line-strong: rgba(17,17,17,.18);
  --glass-rgb: 255,255,255;
  --glass-fill: rgba(255,255,255,.56);
  --glass-rim: rgba(255,255,255,.90);
  --glass-inset: rgba(255,255,255,.80);
  --glass-fallback: #FBFBFC;
  --focus-ring: #111111;
  --selected-fill: rgba(17,17,17,.08);
  --selected-hover: rgba(17,17,17,.12);
  --selected-border: rgba(17,17,17,.35);
  --selected-text: #111111;
  --control-fill: rgba(255,255,255,.50);
  --control-hover: rgba(17,17,17,.06);
  --control-on: #111111;
  --control-mark: #FFFFFF;
  --control-track: #CFD3DA;
  --input-fill: rgba(255,255,255,.68);
  --input-border: rgba(17,17,17,.20);
  --primary-text: #F5F5F5;
  --primary-base: #111111;
  --primary-gradient: none;
  --primary-hover: #2A2A2A;
  --primary-border: #111111;
  --primary-shadow: none;
  --secondary-fill: rgba(255,255,255,.72);
  --secondary-hover: #FFFFFF;
  --secondary-border: rgba(17,17,17,.14);
  --secondary-shadow: none;
  --segment-track: rgba(17,17,17,.035);
  --segment-selected: rgba(255,255,255,.90);
  --segment-shadow: 0 1px 4px rgba(17,17,17,.07);
  --overlay-fill: rgba(251,251,252,.96);
  --overlay-border: rgba(255,255,255,.95);
  --overlay-backdrop: rgba(17,17,17,.25);
  --header-fill: rgba(245,245,245,.87);
  --code-fill: rgba(251,251,252,.80);
  --panel-fill: rgba(255,255,255,.24);
  --stage-fill: rgba(251,251,252,.60);
  --shadow: 0 8px 24px rgba(17,17,17,.05),0 1px 3px rgba(17,17,17,.04);
  --shadow-float: 0 20px 48px rgba(17,17,17,.075),0 3px 8px rgba(17,17,17,.035);
  --glass-1-fill: rgba(255,255,255,.58);
  --glass-2-fill: rgba(255,255,255,.50);
  --glass-3-fill: rgba(42,47,54,.64);
  --glass-3-ink: #F5F5F5;
  --glass-ring: rgba(255,255,255,.72);
  --glass-edge: rgba(17,17,17,.06);
  --backdrop-tint-accent: rgba(38,157,176,.14);
  --backdrop-tint-mist: rgba(207,211,218,.45);
  --backdrop-tint-white: rgba(255,255,255,.90);
  --depth-1: 0 1px 2px rgba(17,17,17,.04);
  --depth-2: 0 8px 24px rgba(17,17,17,.05),0 1px 3px rgba(17,17,17,.04);
  --depth-3: 0 20px 48px rgba(17,17,17,.075),0 3px 8px rgba(17,17,17,.035);
  --depth-4: 0 32px 80px rgba(17,17,17,.12),0 6px 16px rgba(17,17,17,.05);
}
[data-theme="dark"] {
  color-scheme: dark;
  --canvas: #111111;
  --surface: #191B1F;
  --surface-raised: #22262C;
  --ink: #F5F5F5;
  --muted: #AEB4BD;
  --faint: #9199A5;
  --accent: #65C9D9;
  --accent-deep: #F5F5F5;
  --ice: #303030;
  --mist: #383D45;
  --line: rgba(207,211,218,.13);
  --line-soft: rgba(207,211,218,.085);
  --line-strong: rgba(207,211,218,.23);
  --glass-rgb: 42,47,54;
  --glass-fill: rgba(42,47,54,.64);
  --glass-rim: rgba(207,211,218,.19);
  --glass-inset: rgba(255,255,255,.09);
  --glass-fallback: #22262C;
  --focus-ring: #F5F5F5;
  --selected-fill: rgba(245,245,245,.10);
  --selected-hover: rgba(245,245,245,.15);
  --selected-border: rgba(245,245,245,.4);
  --selected-text: #F5F5F5;
  --control-fill: rgba(207,211,218,.04);
  --control-hover: rgba(207,211,218,.10);
  --control-on: #F5F5F5;
  --control-mark: #111111;
  --control-track: #383D45;
  --input-fill: #191B1F;
  --input-border: rgba(207,211,218,.24);
  --primary-text: #111111;
  --primary-base: #F5F5F5;
  --primary-gradient: none;
  --primary-hover: #DEDEDE;
  --primary-border: #F5F5F5;
  --primary-shadow: none;
  --secondary-fill: rgba(207,211,218,.08);
  --secondary-hover: rgba(207,211,218,.10);
  --secondary-border: rgba(207,211,218,.22);
  --secondary-shadow: none;
  --segment-track: rgba(0,0,0,.20);
  --segment-selected: #30353C;
  --segment-shadow: 0 1px 4px rgba(0,0,0,.15);
  --overlay-fill: rgba(29,32,37,.96);
  --overlay-border: rgba(207,211,218,.19);
  --overlay-backdrop: rgba(0,0,0,.58);
  --header-fill: rgba(17,17,17,.88);
  --code-fill: rgba(207,211,218,.025);
  --panel-fill: rgba(207,211,218,.022);
  --stage-fill: #16181B;
  --shadow: 0 8px 24px rgba(0,0,0,.20),0 1px 3px rgba(0,0,0,.13);
  --shadow-float: 0 20px 48px rgba(0,0,0,.30),0 3px 8px rgba(0,0,0,.16);
  --glass-1-fill: rgba(42,47,54,.58);
  --glass-2-fill: rgba(42,47,54,.50);
  --glass-3-fill: rgba(42,47,54,.64);
  --glass-3-ink: #F5F5F5;
  --glass-ring: rgba(207,211,218,.19);
  --glass-edge: rgba(0,0,0,.35);
  --backdrop-tint-accent: rgba(101,201,217,.16);
  --backdrop-tint-mist: rgba(56,61,69,.55);
  --backdrop-tint-white: rgba(245,245,245,.06);
  --depth-1: 0 1px 2px rgba(0,0,0,.25);
  --depth-2: 0 8px 24px rgba(0,0,0,.20),0 1px 3px rgba(0,0,0,.13);
  --depth-3: 0 20px 48px rgba(0,0,0,.30),0 3px 8px rgba(0,0,0,.16);
  --depth-4: 0 32px 80px rgba(0,0,0,.45),0 6px 16px rgba(0,0,0,.2);
}
html, body {
  background: var(--canvas);
  color: var(--ink);
}