:root {
  color-scheme: dark;

  --gb-bg: #111015;
  --gb-surface: #16151B;
  --gb-surface-2: #1B1A21;
  --gb-surface-hover: #26242E;
  --gb-border: #26242E;
  --gb-border-strong: #34313F;
  --gb-text: #F3F0F7;
  --gb-text-soft: #CFCAD8;
  --gb-text-dim: #A9A4B4;
  --gb-accent: #B7AAFF;
  --gb-accent-soft: #241F3C;
  --gb-on-accent: #15121F;
  --gb-success: #4FC4B0;
  --gb-danger: #F28DB2;
  --gb-radius: 12px;
  --gb-radius-sm: 8px;
  --gb-pill: 999px;
  --gb-font: var(--ui-font, 'IBM Plex Sans KR', system-ui, sans-serif);
  --gb-gutter: 16px;
  --cc-bg: #111015;
  --cc-surface: #16151B;
  --cc-surface-card: #1B1A21;
  --cc-surface-selected: #1F1C30;
  --cc-border: #26242E;
  --cc-border-strong: #34313F;
  --cc-border-width: 1px;
  --cc-fg: #F3F0F7;
  --cc-fg-soft: #CFCAD8;
  --cc-fg-muted: #A9A4B4;
  --cc-fg-faint: #8E899A;
  --cc-accent: #B7AAFF;
  --cc-accent-soft: #241F3C;
  --cc-accent-deep: #9D8CFF;
  --cc-pink: #F28DB2;
  --cc-gold: #F0B54A;
  --cc-teal: #4FC4B0;
  --cc-mode-chat: #9D8CFF;
  --cc-mode-chat-bg: #241F3C;
  --cc-mode-free: #4FC4B0;
  --cc-mode-free-bg: #15332E;
  --cc-mode-story: #F28DB2;
  --cc-mode-story-bg: #3A2238;
  --cc-font-ui: 'IBM Plex Sans KR', system-ui, sans-serif;
  --cc-font-story: 'Gowun Batang', serif;
  --cc-text-12: 12px;
  --cc-text-14: 14px;
  --cc-text-16: 16px;
  --cc-text-18: 18px;
  --cc-text-22: 22px;
  --cc-text-wordmark: 19px;
  --cc-weight-semibold: 600;
  --cc-weight-bold: 700;
  --cc-leading-body: 1.5;
  --cc-space-0: 0;
  --cc-space-2: 2px;
  --cc-space-4: 4px;
  --cc-space-8: 8px;
  --cc-space-12: 12px;
  --cc-space-16: 16px;
  --cc-space-20: 20px;
  --cc-space-24: 24px;
  --cc-space-32: 32px;
  --cc-size-icon: 22px;
  --cc-size-action: 44px;
  --cc-size-topbar: 56px;
  --cc-size-tabbar: 72px;
  --cc-z-tabbar: 30;
  --cc-z-dropdown: 5;
  --cc-radius-card: 14px;
  --cc-radius-chip: 18px;
  --cc-radius-round: 50%;
  --cc-letter-tight: -0.3px;
  --cc-bg-banner: #2A2140;
  --cc-fg-banner: #D9D2EC;
  --cc-fg-banner-soft: #CFC4F5;
  --cc-bg-chip-on: #F3F0F7;
  --cc-fg-chip-on: #111015;
  --cc-bg-new: #F0B54A;
  --cc-fg-new: #1A1405;
  --cc-bg-mode-chat: #3A2A22;
  --cc-bg-mode-free: #173230;
  --cc-bg-mode-story: #2C2645;
  --cc-fg-mode-chat: #F4BFA1;
  --cc-fg-mode-free: #7FDCCB;
  --cc-fg-mode-story: #C9BFFF;
  --cc-width-page: 100%;
  --cc-app-width: 480px;
  --cc-width-rail-card: 132px;
  --cc-width-banner-poster: 120px;
  --cc-width-rank: 24px;
  --cc-width-rank-cover: 64px;
  --cc-width-continue-cover: 56px;
  --cc-height-banner: 224px;
  --cc-height-page-title: 48px;
  --cc-height-search: 44px;
  --cc-height-chip: 36px;
  --cc-height-chip-small: 28px;
  --cc-radius-banner: 16px;
  --cc-radius-cover: 10px;
  --cc-radius-cover-small: 8px;
  --cc-radius-badge: 4px;
  --cc-radius-chip-large: 18px;
  --cc-pill: 999px;
  --cc-radius-panel: 12px;
  --cc-gap-6: 6px;
  --cc-gap-10: 10px;
  --cc-gap-24: 24px;
  --cc-space-28: 28px;
  --cc-space-14: 14px;
  --cc-space-10: 10px;
  --cc-space-6: 6px;
  --cc-text-11: 11px;
  --cc-text-13: 13px;
  --cc-text-15: 15px;
  --cc-text-20: 20px;
  --cc-text-26: 26px;
  --cc-weight-medium: 500;
  --cc-leading-tight: 1.25;
  --cc-leading-copy: 1.4;
  --cc-leading-note: 1.5;
  --cc-border-accent: #5B4FA8;
  --cc-border-muted: #3A3746;
  --cc-bg-sheet-dim: #3A2238;
  --cc-bg-sheet: #0B0A0E;
  --cc-fg-story-title: #D9B8CE;
  --cc-fg-summary: #DAD5E3;
  --cc-fg-quote: #E8E2EE;
  --cc-fg-gold: #F0B54A;
  --cc-action-ink-2: #15121F;
  --cc-mode-dot-chat: #F28DB2;
  --cc-mode-dot-free: #4FC4B0;
  --cc-mode-dot-story: #9D8CFF;
  --cc-mode-story-outline: #5B4FA8;
  --cc-mode-segment-selected: #241F3C;
  --cc-mode-segment-selected-border: #9D8CFF;
  --cc-size-portrait-width: 112px;
  --cc-size-portrait-height: 148px;
  --cc-size-avatar: 80px;
  --cc-size-avatar-small: 56px;
  --cc-size-cta-height: 52px;
  --cc-size-dialog: 720px;
  --cc-size-sheet-cover: 48px;
  --cc-size-dialog-handle: 40px;
  --cc-weight-normal: 400;
  --cc-leading-hero: 1.25;
  --cc-leading-summary: 1.65;
  --cc-leading-quote: 1.7;
  --cc-leading-fact: 1.55;
  --cc-opacity-dim: 0.35;
  --cc-z-sheet: 40;
  --cc-text-28: 28px;
  --cc-radius-sheet: 20px;
  --cc-width-run-cover: 52px;
  --cc-height-progress: 4px;
  --cc-height-menu-item: 52px;
  --cc-height-wallet-button: 40px;
  --cc-leading-hint: 1.55;
  --cc-bg-cover-shade: rgb(17 16 21 / 72%);
  --cc-blur-cover: 16px;
  --cc-z-cover-background: -2;
  --cc-z-cover-overlay: -1;
  --cc-z-cover-content: 0;
  --cc-z-cover-control: 1;
}