[data-theme="type2"] {
  /* =========================================
     1. GALAXY CASINO — Palette Source
     Figma: BByE3RSKZ7w7LTOmtrs4FW
       "[HIGHEND] EPIC SOLUTION — Operator Font Demo 2026"
     Verified nodes: 2268:43397 (sidebar, logged out),
                     2268:41564 / 2268:43545 (header, logged out)

     Concept: deep-navy space ground + magenta / cyan / violet neon.
     Typography: Gmarket Sans (see globals.css `--font-sans`).

     ⚠️ TOKEN NAMES ARE A CONTRACT — never rename or delete.
        Re-value only. New tokens may be appended.
     ========================================= */

  /* -----------------------------------------
     Galaxy raw palette (new — Figma originals)
     Prefer the SEMANTIC tokens below in components;
     these are the ground truth the semantics derive from.
     ----------------------------------------- */
  --galaxy-void: #00041b; /* deepest space — app / sidebar / content bg */
  --galaxy-deep: #02071e; /* section bg */
  --galaxy-header: #000825; /* header bg (2268:43545) */
  --galaxy-surface: #0e131b; /* buttons / cards */
  --galaxy-panel: #1a2433; /* banner interior / table head */
  --galaxy-violet: #4e4bff; /* sidebar right border, header bottom border */
  --galaxy-blue: #3793ff; /* button border */
  --galaxy-cyan: #30f1ff; /* accent / focus */
  --galaxy-sky: #2aabee; /* the glow color (text-shadow / drop-shadow) */
  --galaxy-magenta: #ff66ff; /* primary CTA */
  --galaxy-purple: #5c32bb; /* magenta gradient tail */
  --galaxy-green: #8de939; /* success / 평생주소 */
  --galaxy-lime: #03ff10; /* slot gradient head */
  --galaxy-yellow: #ffdb66; /* highlight */
  --galaxy-red: #ff5656; /* danger / 고객센터 */
  --galaxy-steel: #55729e; /* muted border (2268:43599) */
  --galaxy-ice: #a7caff; /* muted text (2268:43602) */
  --galaxy-info: #29aaed; /* telegram / info blue */
  --galaxy-on-neon: #1e3e00; /* dark text on a neon-green pill (2268:43480) */
  --galaxy-green-muted: #5d954e; /* dim green body copy (2268:43485) */

  /* Login page side panels (Figma 2268:44623) */
  --galaxy-domain-badge: #a7a569; /* 평생도메인 올리브 뱃지 (2268:44638) */
  --galaxy-events-tail: #3286bb; /* 이벤트 안내 카드 그라디언트 tail (2268:44640) */
  --galaxy-event-text: #88ff78; /* 이벤트 목록 항목 텍스트 (2268:44643) */
  --galaxy-event-btn: #141a25; /* 이벤트 목록 항목 surface, rgba .9 (2268:44642) */
  --galaxy-warn-gold: #ffcf66; /* 악성배팅 강력대응 골드 (2268:44700/44712) */
  --galaxy-warn-purple: #6e056e; /* 악성배팅 버튼 텍스트 (2268:44701) */

  /* Derived navy border ramp (no direct Figma sample — dimmed --galaxy-steel) */
  --galaxy-line: #22304a; /* faint hairline / divider */
  --galaxy-line-strong: #2b3f63; /* visible neutral border */
  --galaxy-elevated: #131c2a; /* between surface and panel */
  --galaxy-muted-text: #7d94b8; /* lowest-contrast readable text */
  --galaxy-input-label: #bbd6ff; /* 회원가입 입력 라벨 (2268:44737) */
  --galaxy-input-hint: #96a3b7; /* 회원가입 입력 placeholder/hint (2268:44739) */
  --galaxy-lavender: #9f85ff; /* 사이드바 보유 머니 값 (2268:43293) */
  --galaxy-mint: #66ff7d; /* 사이드바 보유 포인트 값 (2268:43293) */
  --galaxy-menu-icon: #8cffb8; /* 모바일 메뉴 리스트 아이콘 (홈/쿠폰함/쪽지 등) */
  --galaxy-close-icon: #2092e3; /* 모바일 메뉴 드로어 닫기(X) 버튼 (2268:42672) */
  --galaxy-betbar-bg: #2092e3; /* 모바일 플로팅 베팅카트 바 배경 (2268:44181) */
  --galaxy-betbar-label: #000000; /* 베팅카트 바 라벨(선택경기/합산배당률) 텍스트 */
  --galaxy-betbar-value: #fae58f; /* 베팅카트 바 값(선택 수/합산배당률) 강조 텍스트 */
  --galaxy-betbar-button: #0061a6; /* 베팅카트 바 액션 버튼(카트비우기/카트열기) 배경 */
  --galaxy-content-bg: #000000; /* 콘텐츠 영역 배경 — 순수 블랙 (2268:41835 Main Page) */
  --galaxy-nav-bg: #131313; /* 모바일 하단 네비 배경 (2268:42062 Footer Menu) */
  --galaxy-nav-border: #2092e3; /* 모바일 하단 네비 상단 보더 (2268:42062) */

  /* Compact betting-amount section (2268:44555 BettingAmountSection) —
     shares the #131313 nav bg; distinct neutral chrome for the amount bar / chips. */
  --galaxy-betamount-bar: #24272e; /* 배팅금액 입력 바 surface */
  --galaxy-betamount-chip-from: #4b4b4b; /* 금액 칩 그라디언트 head */
  --galaxy-betamount-chip-to: #2d2d2d; /* 금액 칩 그라디언트 tail */
  --galaxy-betamount-label: #9b9b9b; /* 요약 라벨 / 단위(원) muted text */
  --galaxy-betamount-win: #ffc92f; /* 총 당첨 예상금액 값 (amber) */

  /* Mobile bet-cart selected rows (2268:44430 Container) —
     compact selection cards stacked above the betting-amount section. */
  --galaxy-betcart-accent: #008edb; /* 첫 카드 상단 강조 보더 (blue) */
  --galaxy-betcart-divider: #3c2c2c; /* 카드 사이 구분선 */
  --galaxy-betcart-vs: #cea4ff; /* 매치 타이틀 "vs" 강조 (lavender) */
  --galaxy-betcart-badge: #fae58f; /* 홈/원정 배지 배경 (gold) */
  --galaxy-betcart-team: #cdcdcd; /* 팀명 텍스트 */
  --galaxy-betcart-odds: #e33f3f; /* 배당 값 (red) */
  --galaxy-betcart-odds-new: #b41f22; /* 변경된 배당 칩 배경 */
  --galaxy-betcart-odds-old: #cecece; /* 이전 배당 취소선 텍스트 */
  --galaxy-betcart-change-bg: #222222; /* 배당 변경/경기취소 배지 컨테이너 */

  /* Neutral modal/popup shell — 공지/이용규정/이벤트/쪽지 다이얼로그 (2268:37196 등).
     페이지 크롬(navy)과 달리 팝업은 중립 다크 그레이 계열이다. */
  --galaxy-modal-bg: #000000; /* popup background */
  --galaxy-modal-border: #292929; /* popup 1px border */
  --galaxy-modal-rail: #1e1e1e; /* field group container */
  --galaxy-modal-field: #131313; /* inner field surface */
  --galaxy-modal-field-text: #9ca1c2; /* field body/placeholder text */

  /* -----------------------------------------
     Neon idiom (new)
     The design repeats exactly three glow mechanisms.
     ----------------------------------------- */
  --glow-text: 0 0 10px #2aabee; /* text-shadow on sidebar button labels */
  --glow-drop: 0 0 5px #2aabee; /* wrap in drop-shadow() */
  --glow-drop-tight: 0 0 2px #2aabee;
  --glow-inset: inset 0 0 10px 0 #a4a4a4; /* inner sheen on gradient pills */
  --glow-inset-soft: inset 0 0 4px 0 #2aabee; /* inner sheen on neon banners */
  --glow-magenta: 0 0 10px 0 rgba(255, 102, 255, 0.5);
  --glow-cyan: 0 0 10px 0 rgba(48, 241, 255, 0.5);
  --glow-violet: 0 0 15px 0 rgba(78, 75, 255, 0.5);

  /* -----------------------------------------
     Menu gradients (new) — Figma 2268:43403..43418
     Sidebar pills run 90deg; header labels run 180deg (bottom-up).
     ----------------------------------------- */
  --menu-gradient-sports: linear-gradient(90deg, #30f1ff 0%, #2a4db5 100%);
  --menu-gradient-casino: linear-gradient(90deg, #ff66ff 0%, #5c32bb 100%);
  --menu-gradient-slot: linear-gradient(90deg, #03ff10 0%, #3286bb 100%);
  --menu-gradient-minigame: linear-gradient(90deg, #f2ff66 0%, #bb4d32 100%);
  --menu-text-gradient-sports: linear-gradient(180deg, #2a4db5 0%, #30f1ff 100%);
  --menu-text-gradient-casino: linear-gradient(180deg, #5c32bb 0%, #ff66ff 100%);
  --menu-text-gradient-slot: linear-gradient(180deg, #3286bb 0%, #03ff10 100%);
  --menu-text-gradient-minigame: linear-gradient(
    180deg,
    #bb4d32 0%,
    #f2ff66 100%
  );
  /* Per-category flat accents — same coding as the gradients above */
  --menu-accent-sports: #30f1ff;
  --menu-accent-casino: #ff66ff;
  --menu-accent-slot: #03ff10;
  --menu-accent-minigame: #f2ff66;

  /* Sports mode-nav accents (new) — Figma 2268:38764 (Main Menu tabs) */
  --galaxy-mode-cross: #e3e320; /* 크로스 (active fill) */
  --galaxy-mode-special: #e37b20; /* 스페셜 */
  --galaxy-mode-realtime: #e32023; /* 실시간 */
  --galaxy-mode-esports: #8ef0ff; /* e스포츠 */
  --galaxy-mode-europe: #ff6ed3; /* 유럽형 스포츠 */
  --galaxy-mode-live: #7585ff; /* 라이브 스포츠 */

  /* Galaxy radii (new) — Figma measured */
  --galaxy-radius-btn: 5px; /* 2268:43420 */
  --galaxy-radius-menu: 6px; /* 2268:43403 */
  --galaxy-radius-card: 12px; /* 2268:43459 */
  --galaxy-radius-pill: 20px; /* 2268:43593 */

  /* =========================================
     2. Semantic tokens
     ========================================= */

  /* Base Colors */
  --background: #00041b; /* Main App Background — void */
  --foreground: #fff; /* Primary Text (21:1 on void) */

  /* Brand Colors — magenta CTA */
  --primary: #ff66ff; /* Brand Magenta (CTA, links, accents) */
  /* Dark text on a FLAT neon fill — the Figma pill idiom (2268:43410 renders
     its label in black over the #ff66ff gradient head). White would only reach
     2.44:1 here; void reaches 8.32:1. */
  --primary-foreground: #00041b; /* Text on flat --primary */
  /* The gradient CTA is the exception: Figma 2268:43594 uses white, and the
     label sits mid-gradient near #5c32bb where white is legible. */
  --primary-gradient-foreground: #ffffff; /* Text on --primary-gradient-* */
  --primary-hover: #ff8cff; /* Slightly lighter magenta */
  --primary-gradient-from: #ff66ff;
  --primary-gradient-to: #5c32bb;
  --primary-shadow: 0px 0px 12px 0px rgba(255, 102, 255, 0.4);
  --primary-inset-shadow: inset 0px 0px 10px 0px #a4a4a4; /* Figma pill sheen */

  /* Status Colors */
  --destructive: #ff5656; /* Danger/Error */
  --destructive-hover: #e63d3d;
  --success-gradient-from: #03ff10;
  --success-gradient-to: #8de939;
  --error: #ff5656;

  /* Form Components */
  --input-bg: #0e131b; /* surface */
  --input-border: #2b3f63; /* dimmed steel */
  --input-focus-border: #30f1ff; /* cyan = focus */
  --input-text: #ffffff;
  --input-placeholder: rgba(255, 255, 255, 0.58);
  --input-disabled-bg: #0e131b;
  --input-disabled-text: #6b7f9e;

  --checkbox-bg: #00041b;
  --checkbox-border: #55729e;
  --checkbox-checked-bg: #ff66ff;
  --checkbox-checked-border: #ff66ff;

  /* Transaction option checkbox (deposit/withdraw/point-exchange) — Figma
     2268:34629/35026 "priority" is a monochrome dark/white glyph, intentionally
     NOT the magenta of the shared --checkbox-* tokens above. Just two colors,
     swapped by state: checked = dark box + light check, unchecked = the inverse. */
  --checkbox-mono-dark: #1e1e1e;
  --checkbox-mono-light: #ffffff;

  /* Table Colors */
  --table-header-bg: #1a2433; /* panel — reads as a raised header band */
  --table-header-text: #ffffff;
  --table-border: #22304a;
  --table-row-hover: rgba(55, 147, 255, 0.08);
  --table-row-even: rgba(55, 147, 255, 0.04);

  /* DatePicker Specific */
  --datepicker-bg: #1a2433;
  --datepicker-text: #e6f0ff;
  --datepicker-label: #a7caff; /* Text-Secondary */
  --datepicker-label-error: #ff5656;

  /* UI Elements */
  --card-bg: #0e131b; /* Footer, Sidebar cards */
  --card-border: #22304a;
  --muted-foreground: #7d94b8; /* Text-Muted */
  --border: #22304a;
  --ring: #30f1ff;

  /* Dialog */
  --dialog-bg: #02071e;
  --dialog-border: #4e4bff; /* violet neon frame */
  --dialog-text: #f1f6ff;

  /* Main Page */
  --main-quickmenu-bg: #1a2433;
  --main-quickmenu-gradient-from: #5c32bb;
  --main-quickmenu-gradient-via: #ff66ff;
  --main-quickmenu-gradient-to: #5c32bb;

  /* 홈 퀵메뉴 카드 (Figma 2268:41565) */
  --quickmenu-card-bg: #000d31; /* 카드 배경 (dark navy) */
  --quickmenu-caption: #5a7197; /* Deposit/Withdrawal 등 캡션 */
  --quickmenu-deposit: #60afee; /* 입금 라벨 */
  --quickmenu-withdraw: #56d672; /* 출금 라벨 */
  --quickmenu-attendance: #ecd36c; /* 출석부 라벨 */
  --quickmenu-coupon: #e9c049; /* 쿠폰함 라벨 (2268:42803) */
  --quickmenu-notice: #e97776; /* 공지 라벨 */

  --main-game-card-bg: #0e131b; /* Game Cards */
  --main-game-card-border: #2b3f63;
  --main-game-overlay-from: rgba(0, 4, 27, 0);
  --main-game-overlay-to: rgba(0, 4, 27, 1);
  --main-game-title-shadow: 0px 0px 20px rgba(0, 4, 27, 1);

  --main-provider-bg: #02071e;
  /* Game provider action banners — Figma 48:5963 structure, Galaxy magenta bloom */
  --game-provider-action-banner-bg:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 342.5 70' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'%3E%3Crect x='0' y='0' height='100%25' width='100%25' fill='url(%23grad)' opacity='0.699999988079071'/%3E%3Cdefs%3E%3CradialGradient id='grad' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='10' gradientTransform='matrix(7.5471e-14 5.6875 -27.238 0.000039217 171.25 -4.375)'%3E%3Cstop stop-color='rgba(255,102,255,1)' offset='0'/%3E%3Cstop stop-color='rgba(92,50,187,0)' offset='1'/%3E%3C/radialGradient%3E%3C/defs%3E%3C/svg%3E"),
    linear-gradient(90deg, #1a2433 0%, #1a2433 100%);
  --game-provider-action-banner-bg-soft:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 342.5 70' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'%3E%3Crect x='0' y='0' height='100%25' width='100%25' fill='url(%23grad)' opacity='0.5'/%3E%3Cdefs%3E%3CradialGradient id='grad' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='10' gradientTransform='matrix(7.5471e-14 5.6875 -27.238 0.000039217 171.25 -4.375)'%3E%3Cstop stop-color='rgba(255,102,255,1)' offset='0'/%3E%3Cstop stop-color='rgba(92,50,187,0)' offset='1'/%3E%3C/radialGradient%3E%3C/defs%3E%3C/svg%3E"),
    linear-gradient(90deg, #1a2433 0%, #1a2433 100%);
  --game-provider-action-banner-shadow: 0px 4px 10px 0px rgba(0, 4, 27, 0.6);
  --game-provider-action-banner-title: #ff66ff;
  --game-provider-action-banner-telegram: #29aaed;
  --game-provider-action-banner-title-base: #a7caff;
  --game-provider-action-banner-link: #ffffff;
  --game-provider-action-banner-title-shadow: 0px 0px 10px #2aabee;
  --game-provider-action-banner-link-shadow: 0px 5px 10px 0px rgba(0, 4, 27, 0.5);
  --game-provider-action-banner-bg-size: 100% 100%, 100% 100%;
  --game-provider-action-banner-bg-position: center top, center;

  /* Notice */
  --notice-radius: 12px;
  --notice-overlay: rgba(0, 4, 27, 0.7);

  /* Event Card */
  --event-card-overlay-hover: rgba(0, 4, 27, 0.3);
  --event-card-gradient-from: rgba(0, 4, 27, 1);
  --event-card-gradient-via: rgba(0, 4, 27, 0.8);
  --event-card-gradient-to: rgba(0, 4, 27, 0);

  /* Inquiry */
  --inquiry-radius: 12px;
  --inquiry-overlay: rgba(0, 4, 27, 0.7);
  --inquiry-primary: #ff66ff;
  --inquiry-primary-foreground: #00041b; /* dark on flat magenta */
  --inquiry-muted: #a7caff;
  --inquiry-border: #22304a;

  /* Inquiry Status Neon Badges */
  --inquiry-status-unanswered: #ff5656; /* 네온 레드 */
  --inquiry-status-unanswered-bg: rgba(255, 86, 86, 0.12);
  --inquiry-status-unanswered-glow: 0 0 8px rgba(255, 86, 86, 0.6);
  --inquiry-status-answered: #30f1ff; /* 네온 시안 */
  --inquiry-status-answered-bg: rgba(48, 241, 255, 0.12);
  --inquiry-status-answered-glow: 0 0 8px rgba(48, 241, 255, 0.6);
  --inquiry-status-confirmed: #8de939; /* 네온 그린 */
  --inquiry-status-confirmed-bg: rgba(141, 233, 57, 0.12);
  --inquiry-status-confirmed-glow: 0 0 8px rgba(141, 233, 57, 0.6);

  /* Message */
  --message-radius: 12px;
  --message-overlay: rgba(0, 4, 27, 0.7);
  --message-primary: #ff66ff;
  --message-primary-foreground: #00041b; /* dark on flat magenta */
  --message-border: #22304a;

  /* MyPage */
  --mypage-radius: 12px;
  --mypage-primary: #ff66ff;
  --mypage-primary-foreground: #00041b; /* dark on flat magenta */
  --mypage-border: #22304a;
  --mypage-section-bg: #0e131b;

  /* Common Radius — Figma sidebar menu items / header cookie button */
  --radius: 6px;

  /* Main Surfaces */
  --main-surface-1: #0e131b;
  --main-surface-2: #1a2433;
  --main-surface-3: #131c2a;
  --main-overlay-weak: rgba(0, 4, 27, 0.2);
  --main-icon-bg: rgba(255, 255, 255, 0.08);
  --main-icon-border: rgba(255, 255, 255, 0.1);
  --glass-bg: rgba(255, 255, 255, 0.048);
  --glass-border: rgba(255, 255, 255, 0.3); /* Figma 2268:43403 menu stroke */

  /* Quick Menu Gradients — one hue per game category */
  --quickmenu-hero1-gradient:
    linear-gradient(270deg, #2a4db5 0%, rgba(42, 77, 181, 0) 75%), #0e131b;
  --quickmenu-hero1-accent: #30f1ff;

  --quickmenu-hero2-gradient:
    linear-gradient(270deg, #5c32bb 0%, rgba(92, 50, 187, 0) 75%), #0e131b;
  --quickmenu-hero2-accent: #ff66ff;

  --quickmenu-slot-gradient:
    linear-gradient(270deg, rgba(3, 255, 16, 0.2) 0%, rgba(3, 255, 16, 0) 75%),
    #0e131b;
  --quickmenu-slot-accent: #03ff10;

  --quickmenu-popular-gradient:
    linear-gradient(270deg, #bb4d32 0%, rgba(187, 77, 50, 0) 75%), #0e131b;
  --quickmenu-popular-accent: #ffdb66;

  --quickmenu-recent-gradient:
    linear-gradient(270deg, #2a4db5 0%, rgba(42, 77, 181, 0) 75%), #0e131b;
  --quickmenu-recent-accent: #8de939;

  /* Minigame amount chip (Figma 161-23329) */
  --minigame-amount-chip-bg: linear-gradient(180deg, #4b4b4b 0%, #2d2d2d 100%);

  /* Main Carousel */
  --main-carousel-card-bg: linear-gradient(180deg, #1a2433 0%, #02071e 100%);
  --main-carousel-overlay: linear-gradient(
    180deg,
    rgba(0, 4, 27, 0.1) 0%,
    rgba(0, 4, 27, 0.2) 50%,
    rgba(0, 4, 27, 0.4) 100%
  );
  --market-card-bg: #0e131b;
  --market-card-border: rgba(55, 147, 255, 0.3);
  --market-card-header-bg: rgba(0, 4, 27, 0.5);
  --market-card-header-border: rgba(48, 241, 255, 0.2);
  --market-card-header-border-gradient: linear-gradient(
    90deg,
    rgba(48, 241, 255, 0.2) 0%,
    rgba(48, 241, 255, 1) 50%,
    rgba(48, 241, 255, 0.2) 100%
  );
  --market-card-header-shadow: 0px 0px 20px 0px rgba(0, 4, 27, 0.6);
  --market-card-header-ellipse: radial-gradient(
    84% 140% at 50% 100%,
    rgba(48, 241, 255, 0.28) 0%,
    rgba(48, 241, 255, 0.16) 36%,
    rgba(48, 241, 255, 0) 74%
  );
  /* 피그마 원본 패턴: fill <accent>/0.5 + blur(90px) */
  --market-card-header-ellipse-color: rgba(48, 241, 255, 0.5);
  --market-card-overlay: linear-gradient(
    180deg,
    rgba(26, 36, 51, 0.5) 6%,
    rgba(14, 19, 27, 0.5) 60%
  );
  --market-card-button-bg: rgba(0, 4, 27, 0.3);
  --market-card-region: #6b7f9e;
  --market-card-label: #a7caff;

  /* Top Menu */
  --topmenu-bg: #000825;
  --topmenu-button-bg: rgba(255, 255, 255, 0.2);
  --topmenu-button-hover: rgba(255, 255, 255, 0.3);

  /* Layout Colors */
  --header-bg: #000825; /* Figma 2268:43545 — NOT void; header sits lighter */
  --header-bg-md: #000825;
  --header-glass-bg: rgba(0, 8, 37, 0.8);
  --header-border: #4e4bff; /* Figma 2268:43545 border-b violet */
  --header-nav-border: #22304a;
  --header-glass-shadow:
    0px 12px 32px 0px rgba(0, 4, 27, 0.5),
    inset 0px 1px 0px rgba(255, 255, 255, 0.04);
  --header-ellipse: radial-gradient(
    50% 140% at 50% 0%,
    rgba(78, 75, 255, 0.28) 0%,
    rgba(255, 102, 255, 0.16) 34%,
    rgba(255, 102, 255, 0) 74%
  );
  --header-overlay: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.06) 0%,
    rgba(255, 255, 255, 0) 68%
  );
  --header-balance-pill-bg: rgba(2, 7, 30, 0.7);
  --header-balance-pill-hover-bg: rgba(2, 7, 30, 0.85);
  --header-balance-pill-shadow: 0px 0px 20px 0px rgba(0, 4, 27, 0.6);
  --header-balance-pill-currency: rgba(255, 255, 255, 0.5);
  --header-level-button-bg:
    linear-gradient(
      180deg,
      rgba(78, 75, 255, 0.16) 0%,
      rgba(55, 147, 255, 0.08) 100%
    ),
    rgba(2, 7, 30, 0.62);
  --header-level-button-hover-bg:
    linear-gradient(
      180deg,
      rgba(78, 75, 255, 0.24) 0%,
      rgba(55, 147, 255, 0.14) 100%
    ),
    rgba(2, 7, 30, 0.74);
  --header-user-pill-bg:
    linear-gradient(
      135deg,
      rgba(255, 102, 255, 0.28) 0%,
      rgba(92, 50, 187, 0.18) 52%,
      rgba(255, 255, 255, 0.06) 100%
    ),
    rgba(14, 19, 27, 0.82);
  --header-user-pill-text: #ff66ff;
  --header-user-pill-shadow:
    0px 0px 18px 0px rgba(255, 102, 255, 0.16),
    inset 0px 1px 0px rgba(255, 255, 255, 0.06);
  --header-balance-icon-shadow: 0px 0px 14px 0px rgba(48, 241, 255, 0.28);
  --header-balance-dialog-bg: rgba(2, 7, 30, 0.92);
  --header-balance-dialog-border: #4e4bff;
  --header-balance-dialog-shadow: 0px 0px 50px 0px rgba(0, 4, 27, 1);
  --header-balance-dialog-secondary-button-bg: rgba(0, 4, 27, 0.3);
  --header-telegram-button-bg: #29aaed; /* Figma telegram blue */
  --header-telegram-button-hover-bg: #1b8fcc;
  --header-telegram-button-shadow: 0px 0px 20px 0px rgba(42, 171, 238, 0.4);
  --header-tether-button-bg:
    linear-gradient(
      135deg,
      rgba(141, 233, 57, 0.24) 0%,
      rgba(3, 255, 16, 0.12) 58%,
      rgba(255, 255, 255, 0.04) 100%
    ),
    rgba(14, 19, 27, 0.84);
  --header-tether-button-hover-bg:
    linear-gradient(
      135deg,
      rgba(141, 233, 57, 0.3) 0%,
      rgba(3, 255, 16, 0.18) 58%,
      rgba(255, 255, 255, 0.08) 100%
    ),
    rgba(14, 19, 27, 0.92);
  --header-tether-button-border: rgba(141, 233, 57, 0.4);
  --header-tether-button-text: #e3ffd0;
  --header-tether-button-shadow:
    0px 10px 24px 0px rgba(3, 255, 16, 0.12),
    inset 0px 1px 0px rgba(255, 255, 255, 0.08);
  --header-tether-button-hover-shadow:
    0px 14px 28px 0px rgba(3, 255, 16, 0.18),
    inset 0px 1px 0px rgba(255, 255, 255, 0.12);

  --sidebar-bg: #00041b; /* Figma 2268:43397 */
  --sidebar-tab-bg: #0e131b;
  --sidebar-tab-hover: #1a2433;

  --content-bg: #00041b;
  --content-section-bg: #02071e;
  --content-border: #22304a;

  /* Text Colors */
  --text-primary: #ffffff;
  --text-secondary: #a7caff; /* Body Text — Figma 2268:43602 */
  --text-accent: #ffdb66; /* Highlight / Warning */
  --text-danger: #ff5656;

  /* Pagination */
  --pagination-text: #a7caff;
  --pagination-active-bg: #ff66ff;
  --pagination-active-text: #00041b; /* dark on flat magenta (8.32:1) */
  --pagination-hover-bg: rgba(55, 147, 255, 0.15);

  /* Scrollbar */
  --scrollbar-size: 8px;
  --scrollbar-radius: 8px;
  --scrollbar-track: rgba(0, 4, 27, 0.4);
  --scrollbar-thumb: rgba(78, 75, 255, 0.6);
  --scrollbar-thumb-hover: rgba(48, 241, 255, 0.8);

  /* Betting Components */
  --betting-button-bg: #1a2433;
  --betting-button-hover: #24314a;
  --betting-text-highlight: #ffdb66;
  --betting-text-label: #55729e;

  /* Bonus Selector */
  --bonus-btn-inactive-bg: #142033;
  --bonus-btn-active-sub-label: #1e3e00; /* dark text on the neon-green active pill */

  /* Odds Direction */
  --odds-up: #ff5656;
  --odds-down: #3793ff;
  --odds-neutral: #a7caff;
  --odds-indicator-down: #3793ff;
  --odds-indicator-icon: #00041b;

  /* Options Panel */
  --options-tab-inactive-border: #55729e; /* 카테고리 탭 비활성 테두리 */
  --options-tab-active-gradient: linear-gradient(
    90deg,
    rgba(42, 77, 181, 1) 0%,
    rgba(48, 241, 255, 1) 39%,
    rgba(42, 77, 181, 1) 100%
  ); /* 카테고리 탭 활성 그라디언트 테두리 */
  --options-selection-team: #dce9ff; /* 셀렉션 버튼 팀명 텍스트 */
  --handicap-positive: #ff5656; /* 핸디캡 양수값 색상 */
  --handicap-negative: #30f1ff; /* 핸디캡 음수값 색상 */
  --options-match-vs: #f2ff66; /* 매치 헤더 VS 텍스트 */
  --options-header-glow: radial-gradient(
    ellipse 100% 80% at 50% 0%,
    rgba(48, 241, 255, 0.15) 0%,
    rgba(48, 241, 255, 0.06) 40%,
    rgba(48, 241, 255, 0) 100%
  ); /* 매치 헤더 시안 글로우 */
  --options-header-badge-text: #a7caff; /* 스포츠 배지 텍스트 */
  --options-header-divider: #22304a; /* 매치 헤더 구분선 */
  --options-header-competition: #30f1ff; /* 옵션스패널 헤더 리그명 */
  --options-market-count-active: #30f1ff; /* 마켓 카운트 버튼 활성 색상 */
  --sports-score-panel-overlay: linear-gradient(
    180deg,
    rgba(92, 50, 187, 0.08) 0%,
    rgba(78, 75, 255, 0.24) 100%
  );
  --sports-score-panel-bottom-overlay: linear-gradient(
    180deg,
    rgba(78, 75, 255, 0) 34%,
    rgba(92, 50, 187, 0.42) 100%
  );
  --sports-score-panel-border: rgba(255, 255, 255, 0.28);
  --sports-score-panel-cell-bg: rgba(255, 255, 255, 0.2);
  --sports-score-panel-cell-border: rgba(255, 255, 255, 0.2);
  --sports-score-panel-badge-bg: rgba(26, 36, 51, 0.46);
  --sports-score-panel-badge-border: rgba(214, 232, 244, 0.22);
  --sports-score-panel-badge-shadow:
    0px 14px 30px 0px rgba(0, 4, 27, 0.4),
    inset 0px 1px 0px rgba(255, 255, 255, 0.16);
  --sports-score-panel-badge-text: #f4fbff;
  --sports-score-panel-chip-bg: rgba(14, 19, 27, 0.34);
  --sports-score-panel-chip-border: rgba(214, 232, 244, 0.18);
  --sports-score-panel-chip-shadow:
    0px 14px 32px 0px rgba(0, 4, 27, 0.4),
    inset 0px 1px 0px rgba(255, 255, 255, 0.14);
  --sports-score-panel-chip-label: #a7caff;
  --sports-score-panel-chip-value: #ffffff;
  --sports-score-panel-score-text: #ffffff;
  --sports-score-panel-label-text: #ffffff;
  --sports-score-panel-card-icon-border: rgba(0, 4, 27, 0.38);
  --sports-score-panel-card-icon-shadow: 0px 6px 14px 0px rgba(0, 4, 27, 0.4);
  --sports-score-panel-yellow-card: #ffdb66;
  --sports-score-panel-red-card: #ff5656;
  --sports-score-panel-indicator-active: #30f1ff;
  --sports-score-panel-indicator-border: rgba(214, 232, 244, 0.26);

  /* Banner */
  --banner-accent: #2aabee;

  /* Signup/Auth */
  --auth-step-complete: #8de939;
  --auth-step-active: #5c32bb;
  --auth-step-active-ring: rgba(255, 102, 255, 0.3);

  /* Games (color-mix tokens follow --primary / --content-bg automatically) */
  --games-active: #ff5656;
  --games-filter-shell-bg: linear-gradient(
    180deg,
    color-mix(in srgb, var(--content-bg) 96%, transparent) 0%,
    color-mix(in srgb, var(--content-bg) 86%, transparent) 76%,
    color-mix(in srgb, var(--content-bg) 0%, transparent) 100%
  );
  --games-filter-shell-border: color-mix(
    in srgb,
    var(--text-primary) 5%,
    transparent
  );
  --games-filter-tab-active-bg: color-mix(
    in srgb,
    var(--primary) 5%,
    transparent
  );
  --games-filter-tab-active-border: var(--primary);
  --games-filter-tab-active-text: var(--primary);
  --games-filter-tab-active-shadow:
    0px 0px 30px 0px color-mix(in srgb, var(--primary) 10%, transparent),
    inset 0px 0px 20px 0px color-mix(in srgb, var(--primary) 10%, transparent);
  --games-filter-tab-bg: color-mix(in srgb, var(--background) 10%, transparent);
  --games-filter-tab-border: color-mix(
    in srgb,
    var(--text-primary) 30%,
    transparent
  );
  --games-filter-tab-hover-border: color-mix(
    in srgb,
    var(--primary) 45%,
    var(--text-primary)
  );
  --games-filter-tab-text: color-mix(
    in srgb,
    var(--text-primary) 50%,
    transparent
  );
  --games-filter-tab-shadow: 0px 0px 20px 0px
    color-mix(in srgb, var(--background) 50%, transparent);
  --games-filter-input-bg: var(--input-bg);
  --games-filter-input-border: var(--input-border);
  --games-filter-input-text: var(--input-text);
  --games-filter-input-placeholder: var(--input-placeholder);
  --games-filter-input-icon: var(--input-placeholder);
  --games-filter-input-shadow: 0px 0px 20px 0px
    color-mix(in srgb, var(--background) 40%, transparent);
  --games-filter-input-focus-shadow: 0px 0px 24px 0px
    color-mix(in srgb, var(--primary) 18%, transparent);

  /* Sidebar */
  --sidebar-badge-bg: #1a2433;

  /* Sidebar Banner Brand Colors */
  --sidebar-banner-pragmatic-text: #ffdb66;
  --sidebar-banner-pragmatic-accent: #ff66ff;
  --sidebar-banner-dot-text: #03ff10;
  --sidebar-banner-dot-accent: #d8ffd0;

  /* Icons */
  --icon-user-online: #8de939;

  /* Casino Icons — follows the casino menu gradient (magenta → purple) */
  --casino-icon-stroke: #ff66ff;
  --casino-icon-gradient-start: #ff66ff;
  --casino-icon-gradient-mid: #a24ce0;
  --casino-icon-gradient-end: #5c32bb;

  /* Event Card Colors — vivid tints carrying dark --event-text,
     matching the Figma neon-pill idiom (2268:43479 bg #8de939 / text #1e3e00) */
  --event-signup: #ffd8ff;
  --event-deposit: #d0f7ff;
  --event-attendance: #dcffd0;
  --event-referral: #ffccf5;
  --event-casino: #e0ccff;
  --event-sports: #ccf0ff;
  --event-vip: #fff0c2;
  --event-slot: #ccffd2;
  --event-loyalty: #e8ffcc;
  --event-birthday: #ffd6e8;
  --event-cashback: #d6e4ff;
  --event-special: #ffe89e;
  --event-mobile: #b3ffe0;
  --event-live: #d9a8ff;
  --event-lottery: #ff9ee8;
  --event-tutorial: #9ee0ff;
  --event-login: #f2ff99;
  --event-seasonal: #ffa8a8;
  --event-levelup: #a8ff9e;
  --event-survey: #b0aeff;
  --event-default: #c3d4ee;
  --event-text: #00041b;

  /* Toast Colors */
  --toast-icon-bg: #1a2433;
  --toast-success-from: #03ff10;
  --toast-success-to: #8de939;
  --toast-warning-from: #ffdb66;
  --toast-warning-to: #f2ff66;
  --toast-info-from: #3793ff;
  --toast-info-to: #30f1ff;
  --toast-muted-from: #55729e;
  --toast-muted-to: #a7caff;

  /* Coupon Card */
  --coupon-bg: #0e131b;
  --coupon-bg-disabled: #02071e;
  --coupon-border: #2b3f63;
  --coupon-badge-bg: #1a2433;
  --coupon-accent: #8de939;

  /* Coupon Game Type Colors — same category coding as the sidebar menus */
  --coupon-color-all: #55729e;
  --coupon-color-casino: #ff66ff;
  --coupon-color-slot: #03ff10;
  --coupon-color-sports: #30f1ff;
  --coupon-color-minigame: #f2ff66;

  /* Minigame Bet Colors */
  --bet-blue: #3793ff;
  --bet-red: #ff5656;

  /* Sports Tab Colors (9-color cycle by display order) */
  --sport-tab-container-bg: #02071e;
  --sport-tab-container-border: #22304a;
  --sport-tab-bg: #0e131b;
  --sport-tab-all-border: #22304a;
  --sport-tab-count: #a7caff;
  --sport-tab-label: #55729e;
  --sport-tab-active-border: #3793ff;
  --sport-tab-active-text: #30f1ff;
  --sport-tab-active-shadow:
    0px 0px 10px 0px rgba(48, 241, 255, 0.3),
    inset 0px 0px 20px 0px rgba(48, 241, 255, 0.2);
  --sport-tab-color-1: #30f1ff;
  --sport-tab-color-2: #3793ff;
  --sport-tab-color-3: #a24cff;
  --sport-tab-color-4: #ff66ff;
  --sport-tab-color-5: #ff5656;
  --sport-tab-color-6: #ffdb66;
  --sport-tab-color-7: #f2ff66;
  --sport-tab-color-8: #03ff10;
  --sport-tab-color-9: #ffffff;

  /* Sports Filter Bar V2 Colors */
  --filter-v2-sort-active: #30f1ff;
  --filter-v2-sort-inactive: #55729e;
  --filter-v2-search-bg: #0e131b;
  --filter-v2-search-placeholder: #55729e;

  /* Sports Tab V2 Colors */
  --sport-tab-v2-wrap-bg: #1a2433;
  --sport-tab-v2-label: #a7caff;
  --sport-tab-v2-count: #a7caff;
  --sport-tab-v2-active-text: #00041b; /* dark on flat magenta */
  --sport-tab-v2-active-bg: #ff66ff;
  --sport-tab-v2-active-shadow: 0px 0px 10px 0px rgba(255, 102, 255, 0.5);

  /* SubTitle Component */
  --subtitle-bar-color: rgba(255, 102, 255, 1);
  --subtitle-bar-glow: rgba(255, 102, 255, 0.4);
  --subtitle-watermark: #1a2433;

  /* Sports Group Header */
  --sport-group-bg: #0e131b;
  --sport-group-bg-from: rgba(0, 4, 27, 1);
  --sport-group-bg-to: rgba(2, 7, 30, 1);
  --sport-group-border-from: #30f1ff;
  --sport-group-border-via: #4e4bff;
  --sport-group-border-to: #30f1ff;
  --sport-group-shadow: 0px 4px 0px 0px rgba(0, 4, 27, 0.5);
  --sport-group-radius: 5px;
  --sport-group-country: #ffdb66;
  --sport-group-league: #3793ff;
  --sport-group-separator: #55729e;
  --sport-group-badge-bg: #1a2433;
  --sport-group-badge-text: #8de939;
  --sports-list-toolbar-active: #ffffff;
  --sports-list-toolbar-inactive: #55729e;
  --sports-list-toolbar-accent: #30f1ff;
  --sports-list-shell-bg: #02071e;
  --sports-list-shell-shadow: 0px 0px 10px 0px rgba(0, 4, 27, 1);
  --sports-asian-group-bg: #1a2433;
  --sports-asian-group-text: #ffffff;
  --sports-asian-group-meta: #a7caff;
  --sports-asian-row-bg: #131c2a;
  --sports-asian-row-divider: #22304a;
  --sports-asian-team-text: #ffffff;
  --sports-asian-center-text: #dce9ff;
  --sports-asian-handicap-indicator: #f2ff66;
  --sports-list-group-bg: #1a2433;
  --sports-list-group-border: #4e4bff;
  --sports-list-group-ellipse: none;
  --sports-list-group-label: #ffffff;
  --sports-list-row-divider: rgba(255, 255, 255, 0.1);
  --sports-list-row-meta: rgba(255, 255, 255, 0.5);
  --sports-list-row-cell-bg: #0e131b;
  --sports-list-row-cell-active-border: #30f1ff;
  --sports-list-row-cell-active-bg: #2a4db5;
  --sports-list-row-more-bg: #131c2a;
  --sports-list-row-icon-bg: #1a2433;
  --sports-list-row-icon-text: #dce9ff;
  --sports-live-period-text: #30f1ff;
  --sports-live-score: #3793ff;
  --sports-live-score-diff: #f2ff66;
  --sports-selection-label: #55729e;
  --sports-asian-odds: #30f1ff;

  /* Util Sidebar */
  --util-sidebar-group-active-from: #2a4db5;
  --util-sidebar-group-active-to: #0e131b;
  --util-sidebar-subitem-from: #1a2433;
  --util-sidebar-subitem-to: #0e131b;
  --util-sidebar-balance-bg: #1a2433;
  --util-sidebar-shadow: 0px 6px 0px 0px #2a4db5;
}