[data-theme="type2"] {
  /* =========================================
     1. Common Settings & Fonts
     ========================================= */
  /* Fonts skipped as per request */

  /* =========================================
     2. Light Mode (Bet8 Sample01)
     Based on Figma 'Bet8 Share' Sample01 (1:2189 landing / 1:6581 sports)
     Core palette (extracted via Figma REST API):
       bg #EFEFEF · surfaces #FFFFFF/#F7F7F7/#ECECEC/#E8EDF6/#D3DDE7
       borders #C1C7D2/#E2E2E2 · navy #011638/#002F7B/#00286A/#012E79/#051744
       CTA gradient #0090FF→#0047BB · green #8BD500/#6BA500 · gold #D98B0D/#FFB260/#A66602
     주석 규칙: source = Figma Sample01 노드에서 직접 추출 / derived = 팔레트에서 파생
     ========================================= */

  /* Base Colors (Light) */
  --background: #efefef; /* source: Figma 1:2189/1:6581 root frame fill */
  --foreground: #000000; /* source: Figma 1:2189 category header text */

  /* Brand Colors (Common) */
  --primary: #0047bb; /* source: Figma CTA gradient end (JOIN NOW 등) */
  --primary-foreground: #ffffff; /* source: Figma CTA button text */
  --primary-hover: #003a99; /* derived: --primary 10% darken */
  --primary-gradient-from: #0090ff; /* source: Figma CTA gradient start */
  --primary-gradient-to: #0047bb; /* source: Figma CTA gradient end */
  --primary-shadow: 0px 0px 12px 0px rgba(0, 71, 187, 0.3); /* derived */
  --primary-inset-shadow: inset 0px -2px 0px 0px #003a99; /* derived */

  /* Status Colors (Common) */
  --destructive: #e33f3f; /* source: Figma bet prediction red */
  --destructive-hover: #c93434; /* derived: --destructive darken */
  --success-gradient-from: #8bd500; /* source: Figma active stroke/scroll-top green */
  --success-gradient-to: #6ba500; /* source: Figma bet info green */
  --error: #e33f3f; /* source: Figma bet prediction red */

  /* Form Components (Light) */
  --input-bg: #ececec; /* source: Figma sports search-bar fill */
  --input-border: #c1c7d2; /* source: Figma sports button/nav strokes */
  --input-focus-border: #0047bb; /* derived: --primary */
  --input-text: #000000; /* derived: --foreground */
  --input-placeholder: #62697b; /* source: Figma filter text */
  --input-disabled-bg: #e2e2e2; /* derived */
  --input-disabled-text: #7c8697; /* source: Figma header top link muted */

  --checkbox-bg: #ffffff; /* derived: light surface */
  --checkbox-border: #c1c7d2; /* source: Figma strokes */
  --checkbox-checked-bg: #0047bb; /* derived: --primary */
  --checkbox-checked-border: #0047bb; /* derived: --primary */
  --checkbox-checked-mark: #ffffff; /* derived: on-primary */

  /* Table Colors (Light) */
  --table-card-bg: #ffffff; /* derived: light card surface */
  --table-card-border: #c1c7d2; /* source: Figma card strokes (Bet Container) */
  --table-card-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.1); /* derived: soft */
  --table-header-bg: #e8edf6; /* source: Figma odds cell fill */
  --table-header-text: #012e79; /* source: Figma title/odds navy text */
  --table-body-text: #000000; /* derived: --foreground */
  --table-muted-text: rgba(0, 0, 0, 0.5); /* derived: light equivalent */
  --table-cell-separator: rgba(0, 0, 0, 0.15); /* derived */
  --table-border: rgba(0, 0, 0, 0.08); /* derived */
  --table-row-hover: transparent;
  --table-row-even: transparent;

  /* DatePicker Specific (Light) */
  --datepicker-bg: #ffffff; /* derived: light surface */
  --datepicker-text: #000000; /* derived: --foreground */
  --datepicker-label: #62697b; /* source: Figma filter text */
  --datepicker-label-error: #e33f3f; /* derived: --destructive */

  /* UI Elements (Light) */
  --card-bg: #ffffff; /* derived: light card surface */
  --card-border: #c1c7d2; /* source: Figma card strokes */
  --muted-foreground: #7c8697; /* source: Figma header top link muted */
  --border: #c1c7d2; /* source: Figma strokes */
  --ring: #0047bb; /* derived: --primary */

  /* Dialog (Light) */
  --dialog-bg: #ffffff; /* derived: light surface */
  --dialog-border: #c1c7d2; /* source: Figma strokes */
  --dialog-text: #000000; /* derived: --foreground */
  --skeleton-bg: #e2e2e2; /* derived: 스켈레톤 로딩 톤 (라이트) */
  --warning: #d98b0d; /* source: Figma deposit/withdraw gold accent */

  /* Maintenance screen (점검중) — MaintenanceGuard 기존 녹색 디자인 토큰화(값 보존) */
  --maintenance-border: #8ce974;
  --maintenance-text: #23ff8a;
  --maintenance-text-muted: #c2f2cf;
  --maintenance-label-bg: #1a6355;

  /* Login Dialog — 라이트 서피스 매핑 */
  --login-dialog-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.15); /* derived: light shadow */
  --login-inquiry-btn-bg: #ececec; /* derived: raised surface on white dialog */

  /* Signup Dialog — colors mapped to Bet8 light theme */
  --signup-dialog-bg: var(--dialog-bg);
  --signup-input-bg: var(
    --dialog-bg
  ); /* ⚠️var(--input-bg) 금지: form 래퍼의 [--input-bg:var(--signup-input-bg)]와 순환참조→배경 transparent로 깨짐. 동일값 --dialog-bg로 우회 */
  --signup-tab-active-bg: var(--login-inquiry-btn-bg);
  --signup-tab-inactive-text: var(--muted-foreground);
  --signup-muted-text: var(--muted-foreground);
  --signup-action-gradient: linear-gradient(
    90deg,
    var(--primary-gradient-from) 0%,
    var(--primary-gradient-to) 100%
  ); /* source: Figma CTA gradient */
  --signup-dialog-shadow: var(--login-dialog-shadow);

  /* Guideline Section — colors mapped to Bet8 light theme */
  --guideline-bg: linear-gradient(
    180deg,
    var(--card-bg) 0%,
    var(--background) 100%
  );
  --guideline-border: #c1c7d2; /* source: Figma strokes */

  /* Transaction Amount Form (Deposit/Withdraw/PointExchange 공유) */
  --amount-row-bg: #f7f7f7; /* source: Figma bet slip summary section fill */
  --amount-value-bg: #ffffff; /* derived: light field surface */
  --amount-accent: #d98b0d; /* source: Figma gold accent (금액값/버튼 텍스트) */
  --amount-btn-bg: #00286a; /* source: Figma bet slip amount button fill */
  --amount-btn-border: #00286a; /* source: Figma bet slip amount button fill */

  /* Deposit Form */
  --deposit-form-card-bg: linear-gradient(
    180deg,
    rgba(255, 255, 255, 1) 0%,
    rgba(247, 247, 247, 1) 100%
  ); /* derived: light card gradient */
  --deposit-form-card-border: #c1c7d2; /* source: Figma strokes */
  --deposit-form-account-alert: #e33f3f; /* derived: --destructive */
  --deposit-form-level-bg: #d98b0d; /* source: Figma gold accent */
  --deposit-form-level-text: #000000; /* derived: on-gold text */
  --deposit-form-submit-bg:
    linear-gradient(90deg, rgba(0, 144, 255, 1) 0%, rgba(0, 71, 187, 1) 100%),
    #0047bb; /* source: Figma CTA gradient */
  --deposit-form-submit-text: #ffffff; /* source: Figma CTA text */

  /* Withdraw Form */
  --withdraw-form-card-bg: #ffffff; /* derived: light card surface */
  --withdraw-form-card-border: #c1c7d2; /* source: Figma strokes */
  --withdraw-form-submit-bg:
    linear-gradient(90deg, rgba(0, 144, 255, 1) 0%, rgba(0, 71, 187, 1) 100%),
    #0047bb; /* source: Figma CTA gradient */
  --withdraw-form-submit-text: #ffffff; /* source: Figma CTA text */

  /* Point Exchange Form */
  --point-exchange-form-card-bg: #ffffff; /* derived: light card surface */
  --point-exchange-form-card-border: #c1c7d2; /* source: Figma strokes */
  --point-exchange-form-muted: #62697b; /* source: Figma filter text */
  --point-exchange-form-submit-bg:
    linear-gradient(90deg, rgba(0, 144, 255, 1) 0%, rgba(0, 71, 187, 1) 100%),
    #0047bb; /* source: Figma CTA gradient */
  --point-exchange-form-submit-text: #ffffff; /* source: Figma CTA text */

  /* Withdraw Rolling Progress Cards */
  --withdraw-rolling-card-bg: #ffffff; /* derived: light card surface */
  --withdraw-rolling-card-border: #c1c7d2; /* source: Figma strokes */
  --withdraw-rolling-muted: #62697b; /* source: Figma filter text */
  --withdraw-rolling-text: #000000; /* derived: --foreground */
  --withdraw-rolling-accent: #d98b0d; /* source: Figma gold accent */
  --withdraw-rolling-record-bg: #f7f7f7; /* derived: light row surface */
  --withdraw-rolling-scroll-track: #e2e2e2; /* source: Figma scrollbar track */
  --withdraw-rolling-scroll-thumb: #012e79; /* source: Figma scrollbar thumb */

  /* Main Page (Light + Navy hero) */
  --main-hero-bg: #04174d; /* source: Figma 1:2189 hero Container fill */
  --main-hero-border: #2f3b4e; /* source: Figma grid item stroke */
  --main-hero-eyebrow: #ffb260; /* source: Figma hero Subtitle fill */
  --main-hero-title: #ffffff; /* source: Figma hero text */
  --main-hero-text: #ffffff; /* source: Figma hero text */
  --main-hero-text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.6); /* derived */
  --main-hero-logo-image: url("/cdn-proxy/images/header/game-menu/header-logo-68e05f.png");
  --main-hero-side-gradient: linear-gradient(
    270deg,
    rgba(4, 23, 77, 1) 0%,
    rgba(4, 23, 77, 1) 30%,
    rgba(4, 23, 77, 0) 100%
  ); /* derived: --main-hero-bg 기반 */
  --main-hero-bottom-gradient: linear-gradient(
    0deg,
    rgba(4, 23, 77, 1) 0%,
    rgba(4, 23, 77, 0) 100%
  ); /* derived: --main-hero-bg 기반 */

  --main-quickmenu-bg: #051744; /* source: Figma landing card fill */
  --main-quickmenu-gradient-from: #002f7b; /* source: Figma GNB gradient end */
  --main-quickmenu-gradient-via: #051744; /* source: Figma landing card fill */
  --main-quickmenu-gradient-to: #011638; /* source: Figma GNB gradient start */

  --main-game-card-bg: #051744; /* source: Figma landing game card fill */
  --main-game-card-border: #2f3b4e; /* source: Figma grid item stroke */
  --main-game-overlay-from: rgba(0, 0, 0, 0); /* source: Figma card overlay gradient */
  --main-game-overlay-to: rgba(0, 0, 0, 0.6); /* source: Figma card overlay gradient */
  --main-game-title-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); /* source: Figma item title drop shadow */

  /* Live Sports Section Header — source: Figma(share) 1:282 */
  --main-livesports-icon-gradient-start: #a6ff77; /* source: Figma 1:282 icon gradient first stop */
  --main-livesports-icon-gradient-end: #329000; /* source: Figma 1:282 icon gradient final stop */
  --main-livesports-title-fallback: #ffffff; /* source: Figma 1:282 title bottom fill */
  --main-livesports-title-gradient: linear-gradient(
    90deg,
    #329000 0%,
    #a6ff77 100%
  ); /* source: Figma 1:282 title/icon top fill (handles x1→x0, #A6FF77→#329000) */
  --main-livesports-action-bg:
    linear-gradient(180deg, #4b4b4b 0%, #2d2d2d 100%),
    #051744; /* source: Figma 1:282 button fills 2-layer (top gradient + base) */
  --main-livesports-action-text: #ffffff; /* source: Figma 1:282 button text/chevron fill */

  /* Landing Events — source: Figma(share) 1:392 */
  --main-landing-section-width: 1380px; /* source: Figma 1:406 dimensions.width */
  --main-event-card-size: 264px; /* source: Figma 1:407 dimensions 264x264 */
  --main-event-title-fallback: #ffffff; /* source: Figma 1:397 secondary fill */
  --main-event-title-gradient: linear-gradient(
    90deg,
    #dea251 0%,
    #f9dfb1 100%
  ); /* source: Figma 1:397 gradient handles right-to-left */
  --main-event-action-bg: var(--main-livesports-action-bg); /* source: Figma fill_33b062ec equals live-sports action fill */
  --main-event-action-text: var(--main-livesports-action-text); /* source: Figma fill_658ab2fa equals live-sports action text */

  /* Landing Notice Rules — source: Figma(share) 1:412 */
  --main-notice-section-width: var(--main-landing-section-width); /* source: Figma 1:426 dimensions.width 1380 */
  --main-notice-header-height: 29px; /* source: Figma 1:417 title natural height */
  --main-notice-title-fallback: #ffffff; /* source: Figma 1:417 secondary fill */
  --main-notice-title-gradient: linear-gradient(
    270deg,
    #6cddff 0%,
    #2266c8 100%
  ); /* source: Figma 1:417 primary fill */
  --main-notice-action-bg: var(--main-event-action-bg); /* source: Figma fill_33b062ec equals event action fill */
  --main-notice-action-text: var(--main-event-action-text); /* source: Figma fill_658ab2fa equals event action text */
  --main-notice-card-width: 264px; /* source: Figma 1:427~1:431 dimensions.width */
  --main-notice-card-height: 348px; /* source: Figma 1:427~1:431 dimensions.height */
  --main-notice-card-border: #484848; /* source: Figma fill_464f8965 */
  --main-notice-card-title-fallback: #ffffff; /* source: Figma card title secondary fill */
  --main-notice-card-title-fill: transparent; /* required for standards-based background-clip:text rendering */
  --main-notice-card-title-cyan-gradient: linear-gradient(
    180deg,
    #6fddfc 0%,
    #c7f1fc 100%
  ); /* source: Figma fill_35ed9e4d */
  --main-notice-card-title-purple-gradient: linear-gradient(
    180deg,
    #a173f6 0%,
    #e0cdf5 100%
  ); /* source: Figma fill_2d8bb7e4 */
  --main-notice-card-title-stroke: #000000; /* source: Figma fill_34dc0314 */
  --main-notice-card-title-shadow: 0 0 10px #000000; /* source: Figma effect_98ac93b9 */

  /* Landing Sports — source: Figma(share) 1:437 */
  --main-sports-section-width: var(--main-landing-section-width); /* source: Figma 1:437 dimensions.width 1380 */
  --main-sports-header-height: 29px; /* source: Figma 1:438 dimensions.height */
  --main-sports-header-icon: url("/cdn-proxy/images/main/sports-banners/sports-club.svg"); /* source: Figma 1:440 mdi:poker-club */
  --main-sports-title-fallback: var(--main-livesports-title-fallback); /* source: Figma 1:439 secondary white fill */
  --main-sports-title-gradient: var(--main-livesports-title-gradient); /* source: Figma 1:439 gradient equals 1:282 */
  --main-sports-action-bg: var(--main-event-action-bg); /* source: reuse landing section header action surface */
  --main-sports-card-width: 216px; /* source: Figma 1:442 dimensions.width */
  --main-sports-card-height: 290px; /* source: Figma 1:442 dimensions.height */
  --main-sports-card-art-width: 218px; /* source: supplied 436px export rendered at 2x */
  --main-sports-card-art-height: 314px; /* source: supplied 628px export rendered at 2x */
  --main-sports-card-inline-bleed: 1px; /* source: (218px art - 216px card) / 2 */
  --main-sports-card-gap: 16px; /* source: Figma 1:441 row gap */
  --main-sports-card-radius: 20px; /* source: Figma 1:442 cornerRadius */
  --main-sports-card-text: #ffffff; /* source: Figma 1:447/1:448 fills */
  --main-sports-card-text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25); /* source: Figma 1:447/1:448 DROP_SHADOW */
  --main-sports-card-action-bg: #00b5ff; /* source: Figma 1:449 blue action fill */
  --main-sports-card-action-text: #ffffff; /* source: Figma 1:450 blue action text */
  --main-sports-card-action-shadow:
    0 4px 4px rgba(0, 0, 0, 0.25),
    inset 0 0 8px rgba(173, 173, 173, 0.25); /* source: Figma 1:449 effects */
  --main-sports-cross-bg: #00382e; /* source: Figma 1:442 fill */
  --main-sports-cross-glow: #4ea449; /* source: Figma 1:442 DROP_SHADOW + INNER_SHADOW */
  --main-sports-cross-action-bg: #a2ff8e; /* source: Figma 1:449 fill */
  --main-sports-cross-action-text: #000000; /* source: Figma 1:450 fill */
  --main-sports-special-bg: #051744; /* source: Figma 1:459 fill */
  --main-sports-special-glow: #00bbff; /* source: Figma 1:459 DROP_SHADOW + INNER_SHADOW */
  --main-sports-realtime-bg: #260258; /* source: Figma 1:476 fill */
  --main-sports-realtime-glow: #6f00ff; /* source: Figma 1:476 DROP_SHADOW + INNER_SHADOW */
  --main-sports-europe-bg: #300014; /* source: Figma 1:493 fill */
  --main-sports-europe-glow: #ff006a; /* source: Figma 1:493 DROP_SHADOW + INNER_SHADOW */
  --main-sports-live-bg: #473b00; /* source: Figma 1:510 fill */
  --main-sports-live-glow: #ffde77; /* source: Figma 1:510 DROP_SHADOW + INNER_SHADOW */
  --main-sports-esports-bg: var(--main-sports-special-bg); /* source: Figma 1:527 fill equals special */
  --main-sports-esports-glow: var(--main-sports-special-glow); /* source: Figma 1:527 effects equal special */

  /* Subpage Title */
  --subpage-title-text: #7c8697; /* source: Figma sports Title 'European' fill */
  --subpage-title-gradient: linear-gradient(
    90deg,
    #0090ff 0%,
    #0047bb 100%
  ); /* source: Figma sports Title 'Sports' top visible gradient fill */
  --subpage-title-breadcrumb-text: #99a1af; /* source: Figma breadcrumbs fill */
  --subpage-title-breadcrumb-current: #f43f5e; /* source: Figma breadcrumbs All Link fill */

  --main-provider-bg: #ffffff; /* derived: landing provider strip on white */
  --popup-card-bg: #ffffff; /* derived: light surface */
  /* Game provider action banners — navy remap */
  --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(138,182,255,1)' offset='0'/%3E%3Cstop stop-color='rgba(0,71,187,0)' offset='1'/%3E%3C/radialGradient%3E%3C/defs%3E%3C/svg%3E"),
    linear-gradient(90deg, #051744 0%, #051744 100%); /* derived: navy card + blue glow */
  --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(138,182,255,1)' offset='0'/%3E%3Cstop stop-color='rgba(0,71,187,0)' offset='1'/%3E%3C/radialGradient%3E%3C/defs%3E%3C/svg%3E"),
    linear-gradient(90deg, #051744 0%, #051744 100%); /* derived: navy card + blue glow */
  --game-provider-action-banner-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.25); /* derived */
  --game-provider-action-banner-title: #8ab6ff; /* source: Figma amount button text blue */
  --game-provider-action-banner-telegram: #29aaed; /* 브랜드 색 유지 */
  --game-provider-action-banner-title-base: #c3c8d5; /* source: Figma light info card fill */
  --game-provider-action-banner-link: #ffffff;
  --game-provider-action-banner-title-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  --game-provider-action-banner-link-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.3);
  --game-provider-action-banner-bg-size: 100% 100%, 100% 100%;
  --game-provider-action-banner-bg-position: center top, center;

  /* Notice */
  --notice-overlay: rgba(0, 0, 0, 0.6);
  --notice-detail-card-bg: var(--table-card-bg);
  --notice-detail-card-border: var(--table-card-border);
  --notice-detail-card-shadow: var(--table-card-shadow);
  --notice-detail-section-bg: var(--table-header-bg);
  --notice-detail-field-bg: var(--table-card-bg);
  --notice-detail-heading-text: var(--foreground);
  --notice-detail-body-text: #505050; /* source: Figma match date/time text */
  --notice-detail-button-bg:
    linear-gradient(90deg, rgba(0, 144, 255, 1) 0%, rgba(0, 71, 187, 1) 100%),
    #0047bb; /* source: Figma CTA gradient */
  --notice-detail-button-text: var(--foreground); /* NOTE: on-gradient → white 필요 시 컴포넌트에서 --primary-foreground 사용 */

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

  /* Event Page Tab Bar (공지사항/이벤트) */
  --event-tab-header-gradient: linear-gradient(
    90deg,
    rgba(1, 22, 56, 1) 0%,
    rgba(0, 71, 187, 1) 50%,
    rgba(1, 22, 56, 1) 100%
  ); /* derived: navy 3-stop (기존 크림슨 3-stop 구조 유지) */
  --event-tab-bg: #ececec; /* source: Figma inactive button fill */
  --event-tab-active-border: #00286a; /* source: Figma navy button fill */
  --event-tab-active-text: #012e79; /* source: Figma navy title text */
  --event-tab-inactive-text: #62697b; /* source: Figma filter text */

  /* Event Status Filter (진행중/종료) */
  --event-filter-active-bg: #e8edf6; /* source: Figma odds cell fill */
  --event-filter-active-border: #0047bb; /* derived: --primary */
  --event-filter-active-text: #0047bb; /* derived: --primary */
  --event-filter-inactive-bg: #ececec; /* source: Figma inactive button fill */
  --event-filter-inactive-border: #c1c7d2; /* source: Figma strokes */
  --event-filter-inactive-text: #505050; /* source: Figma date/time text */

  /* Event Detail Dialog */
  --event-dialog-bg: #ffffff; /* derived: light surface */
  --event-dialog-border: #c1c7d2; /* source: Figma strokes */

  /* Inquiry */
  --inquiry-overlay: rgba(0, 0, 0, 0.6);
  --inquiry-primary: #0047bb; /* derived: --primary */
  --inquiry-primary-foreground: #ffffff;
  --inquiry-muted: #7c8697; /* source: Figma link muted */
  --inquiry-border: #c1c7d2; /* source: Figma strokes */

  /* Inquiry Status Badges (Light) */
  --inquiry-status-unanswered: #e33f3f; /* derived: --destructive */
  --inquiry-status-unanswered-bg: rgba(227, 63, 63, 0.12);
  --inquiry-status-unanswered-glow: 0 0 8px rgba(227, 63, 63, 0.4);
  --inquiry-status-answered: #1287e7; /* source: Figma odds-down blue */
  --inquiry-status-answered-bg: rgba(18, 135, 231, 0.12);
  --inquiry-status-answered-glow: 0 0 8px rgba(18, 135, 231, 0.4);
  --inquiry-status-confirmed: #6ba500; /* source: Figma bet info green */
  --inquiry-status-confirmed-bg: rgba(107, 165, 0, 0.12);
  --inquiry-status-confirmed-glow: 0 0 8px rgba(107, 165, 0, 0.4);
  --inquiry-list-status-answered: #1287e7; /* source: Figma odds-down blue */
  --inquiry-list-status-unanswered: #e33f3f; /* derived: --destructive */
  --inquiry-list-status-confirmed: var(--success-gradient-from);
  --inquiry-list-delete-bg: var(--message-delete-btn-bg);
  --inquiry-list-delete-border: var(--message-delete-btn-border);
  --inquiry-create-card-bg: #ffffff; /* derived: light card surface */
  --inquiry-create-card-border: #c1c7d2; /* source: Figma strokes */
  --inquiry-create-card-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.1); /* derived */
  --inquiry-create-row-bg: #f7f7f7; /* derived: light row surface */
  --inquiry-create-field-bg: #ffffff; /* derived: light field surface */
  --inquiry-create-label: #62697b; /* source: Figma filter text */
  --inquiry-create-placeholder: #7c8697; /* source: Figma link muted */
  --inquiry-create-muted: #505050; /* source: Figma date/time text */
  --inquiry-create-accent: #d98b0d; /* source: Figma gold accent */
  --inquiry-create-add-bg: #e8edf6; /* source: Figma odds cell fill */
  --inquiry-create-add-border: #8ab6ff; /* source: Figma amount button text blue */
  --inquiry-create-add-text: #0047bb; /* derived: --primary */
  --inquiry-attach-card-bg: #f7f7f7; /* derived: light surface */
  --inquiry-attach-card-border: #e2e2e2; /* source: Figma scrollbar track */
  --inquiry-attach-type-text: #a66602; /* source: Figma bet section title */
  --inquiry-attach-id-text: #d98b0d; /* source: Figma gold accent */
  --inquiry-attach-main-text: #000000; /* derived: --foreground */
  --inquiry-attach-status-bg: #d3dde7; /* source: Figma right sidebar fill */
  --inquiry-attach-status-text: #505050; /* source: Figma date/time text */
  --inquiry-attach-label-bg: rgba(0, 0, 0, 0.08); /* derived: light equivalent */
  --inquiry-betting-dialog-bg: #ffffff; /* derived: light surface */
  --inquiry-betting-dialog-border: #c1c7d2; /* source: Figma strokes */
  --inquiry-betting-dialog-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.1); /* derived */
  --inquiry-betting-dialog-text: #000000; /* derived: --foreground */
  --inquiry-betting-dialog-tab-bg: #ececec; /* source: Figma inactive button fill */
  --inquiry-betting-dialog-tab-border: #00286a; /* source: Figma navy button fill */
  --inquiry-betting-dialog-tab-muted: #62697b; /* source: Figma filter text */
  --inquiry-betting-dialog-date-active-bg: #e8edf6; /* source: Figma odds cell fill */
  --inquiry-betting-dialog-date-active-border: #0047bb; /* derived: --primary */
  --inquiry-betting-dialog-date-active-text: #0047bb; /* derived: --primary */
  --inquiry-betting-dialog-date-bg: #ececec; /* source: Figma inactive button fill */
  --inquiry-betting-dialog-date-border: #c1c7d2; /* source: Figma strokes */
  --inquiry-betting-dialog-date-text: #505050; /* source: Figma date/time text */
  --inquiry-betting-dialog-card-bg: #f7f7f7; /* derived: light surface */
  --inquiry-betting-dialog-card-border: #e2e2e2; /* source: Figma scrollbar track */
  --inquiry-betting-dialog-checkbox-bg: #c1c7d2; /* source: Figma strokes */
  --inquiry-betting-dialog-selected-bg: #e8edf6; /* source: Figma odds cell fill */
  --inquiry-betting-dialog-count-text: #505050; /* source: Figma date/time text */
  --inquiry-betting-dialog-confirm-bg:
    linear-gradient(90deg, rgba(0, 144, 255, 1) 0%, rgba(0, 71, 187, 1) 100%),
    #0047bb; /* source: Figma CTA gradient */

  /* Message */
  --message-overlay: rgba(0, 0, 0, 0.6);
  --message-primary: #0047bb; /* derived: --primary */
  --message-primary-foreground: #ffffff;
  --message-border: #c1c7d2; /* source: Figma strokes */
  --message-status-read-text: #1287e7; /* source: Figma odds-down blue */
  --message-status-unread-text: #e33f3f; /* derived: --destructive */
  --message-delete-btn-bg: #00286a; /* source: Figma navy button fill */
  --message-delete-btn-border: #00286a; /* source: Figma navy button fill */
  --message-detail-label-text: #62697b; /* source: Figma filter text */

  /* MyPage */
  --mypage-primary: #0047bb; /* derived: --primary */
  --mypage-primary-foreground: #ffffff;
  --mypage-border: #c1c7d2; /* source: Figma strokes */
  --mypage-section-bg: #ffffff; /* derived: light surface */
  --mypage-identity-nickname: #000000; /* derived: --foreground */
  --mypage-identity-userid: #7c8697; /* source: Figma link muted */
  --mypage-identity-level: #0047bb; /* derived: --primary */
  --mypage-summary-card-bg:
    linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(247, 247, 247, 1) 100%),
    #ffffff; /* derived: light card gradient */
  --mypage-summary-card-border: #c1c7d2; /* source: Figma strokes */
  --mypage-summary-title: #000000; /* derived: --foreground */
  --mypage-summary-label: #7c8697; /* source: Figma link muted */
  --mypage-summary-value: #000000; /* derived: --foreground */
  --mypage-summary-point-value: #d98b0d; /* source: Figma gold accent */
  --mypage-summary-divider: #e2e2e2; /* source: Figma scrollbar track */
  --mypage-summary-action-bg: #e8edf6; /* source: Figma odds cell fill */
  --mypage-summary-action-border: #8ab6ff; /* source: Figma amount button text blue */
  --mypage-summary-action-text: #0047bb; /* derived: --primary */
  --mypage-info-card-bg:
    linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(247, 247, 247, 1) 100%),
    #ffffff; /* derived: light card gradient */
  --mypage-info-card-border: #c1c7d2; /* source: Figma strokes */
  --mypage-info-title: #000000; /* derived: --foreground */
  --mypage-info-row-bg: #f7f7f7; /* derived: light row surface */
  --mypage-info-label: #7c8697; /* source: Figma link muted */
  --mypage-info-value: #000000; /* derived: --foreground */
  --mypage-history-card-bg:
    linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(247, 247, 247, 1) 100%),
    #ffffff; /* derived: light card gradient */
  --mypage-history-card-border: #c1c7d2; /* source: Figma strokes */
  --mypage-history-title: #000000; /* derived: --foreground */
  --mypage-history-tab-active-bg: #e8edf6; /* source: Figma odds cell fill */
  --mypage-history-tab-active-border: #0047bb; /* derived: --primary */
  --mypage-history-tab-active-text: #0047bb; /* derived: --primary */
  --mypage-history-tab-inactive-bg: #ececec; /* source: Figma inactive button fill */
  --mypage-history-tab-inactive-border: #c1c7d2; /* source: Figma strokes */
  --mypage-history-tab-inactive-text: #505050; /* source: Figma date/time text */
  --mypage-history-header-bg: #e8edf6; /* source: Figma odds cell fill */
  --mypage-history-row-border: #e2e2e2; /* source: Figma scrollbar track */
  --mypage-history-text: #505050; /* source: Figma date/time text */
  --attendance-calendar-card-bg: #ffffff; /* derived: light card surface */
  --attendance-calendar-card-border: #c1c7d2; /* source: Figma strokes */
  --attendance-calendar-title: #000000; /* derived: --foreground */
  --attendance-calendar-weekday: #62697b; /* source: Figma filter text */
  --attendance-calendar-day-bg: #e8edf6; /* source: Figma odds cell fill */
  --attendance-calendar-day-muted: rgba(0, 0, 0, 0.3); /* derived: light equivalent */
  --attendance-calendar-icon-on: #d98b0d; /* source: Figma gold accent */
  --attendance-calendar-icon-off: rgba(0, 0, 0, 0.25); /* derived: light equivalent */
  --attendance-info-card-bg: #ffffff; /* derived: light card surface */
  --attendance-info-card-border: #c1c7d2; /* source: Figma strokes */
  --attendance-info-muted: #62697b; /* source: Figma filter text */
  --attendance-info-title: #000000; /* derived: --foreground */
  --attendance-info-panel-bg: #e8edf6; /* source: Figma odds cell fill */
  --attendance-info-accent: #d98b0d; /* source: Figma gold accent */
  --attendance-info-chevron-mark: #080808; /* 유지: 골드 아이콘 위 다크 마크 */

  /* Common Radius */
  --radius: 4px;

  /* Button Theme */
  --button-font-family:
    "Montserrat", var(--font-geist-sans); /* source: user button theme spec */
  --button-transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1); /* source: user button theme spec */
  --button-hover-scale: 1.05; /* source: user button theme spec */

  --button-radius-sm: 8px; /* source: user button theme spec */
  --button-radius-md: 12px; /* source: user button theme spec */
  --button-radius-lg: 16px; /* source: user button theme spec */
  --button-radius-full: 9999px; /* source: user button theme spec */

  --button-text-primary: #ffffff; /* source: user button theme spec */
  --button-text-inverse: #000000; /* source: user button theme spec */
  --button-text-muted: #7c8697; /* source: Figma link muted */

  --tenant-primary: rgb(0, 144, 255); /* source: Figma CTA gradient start */
  --tenant-accent: rgb(0, 71, 187); /* source: Figma CTA gradient end */
  --button-brand-crimson: var(--tenant-primary);
  --button-brand-amber: var(--tenant-accent);
  --button-primary-gradient: linear-gradient(
    to right,
    var(--tenant-primary),
    var(--tenant-accent)
  ); /* source: Figma CTA gradient #0090FF→#0047BB */
  --button-primary-text: #ffffff; /* source: Figma CTA button text */
  --button-primary-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1), 0px 4px 6px -4px rgba(0, 0, 0, 0.1); /* source: Tailwind shadow-lg */
  --button-primary-hover-shadow:
    0px 20px 40px -12px rgba(0, 144, 255, 0.45),
    0px 10px 24px -16px rgba(0, 71, 187, 0.55); /* derived: CTA glow */
  --button-primary-glow:
    0px 0px 20px 0px rgba(0, 144, 255, 0.4),
    0px 0px 36px 0px rgba(0, 71, 187, 0.3); /* derived: CTA glow */

  --button-outline-bg: transparent;
  --button-outline-border: rgba(0, 0, 0, 0.2); /* derived: light equivalent */
  --button-outline-hover-bg: rgba(0, 0, 0, 0.06); /* derived: light equivalent */
  --button-outline-text: #012e79; /* source: Figma navy title text */

  --button-glass-bg: rgba(0, 0, 0, 0.04); /* derived: light equivalent */
  --button-glass-border: rgba(0, 0, 0, 0.08); /* derived: light equivalent */
  --button-glass-hover-bg: rgba(0, 0, 0, 0.08); /* derived: light equivalent */
  --button-glass-text: #012e79; /* source: Figma navy title text */

  --button-fifa-gradient: linear-gradient(
    to right,
    #facc15,
    #f59e0b,
    #facc15
  ); /* source: user button theme spec */
  --button-fifa-text: #ffffff;
  --button-fifa-glow:
    0px 0px 20px 0px rgba(250, 204, 21, 0.48),
    0px 0px 36px 0px rgba(245, 158, 11, 0.36);
  --button-fifa-card-gradient: linear-gradient(
    to right,
    rgba(234, 179, 8, 0.15),
    rgba(245, 158, 11, 0.1)
  );
  --button-fifa-card-hover-gradient: linear-gradient(
    to right,
    rgba(234, 179, 8, 0.25),
    rgba(245, 158, 11, 0.18)
  );
  --button-fifa-card-border: rgba(234, 179, 8, 0.3);
  --button-fifa-card-text: #012e79; /* derived: light theme text */

  --button-hero-padding-y: 16px;
  --button-hero-padding-x: 32px;
  --button-hero-font-size: 18px;
  --button-hero-font-weight: 700;
  --button-hero-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);

  --button-worldcup-gradient: linear-gradient(
    to right,
    rgb(52, 211, 153),
    rgb(6, 182, 212)
  );
  --button-worldcup-text: #000000;
  --button-top4-gradient: linear-gradient(
    135deg,
    rgb(120, 53, 15),
    rgb(146, 64, 14),
    rgb(180, 83, 9)
  );
  --button-top4-text: #ffffff;
  --button-bonus-gradient: linear-gradient(
    to right,
    var(--tenant-primary),
    var(--tenant-accent)
  ); /* source: Figma CTA gradient */
  --button-bonus-text: #ffffff; /* derived: on-gradient text */

  --button-carousel-size: 32px;
  --button-carousel-bg: rgba(0, 0, 0, 0.05); /* derived: light equivalent */
  --button-carousel-border: rgba(0, 0, 0, 0.1); /* derived: light equivalent */
  --button-carousel-text: #62697b; /* source: Figma filter text */
  --button-carousel-hover-bg: rgba(0, 0, 0, 0.1); /* derived: light equivalent */
  --button-carousel-hover-text: #012e79; /* source: Figma navy title text */

  --button-dot-size: 8px;
  --button-dot-active-width: 16px;
  --button-dot-bg: rgba(0, 0, 0, 0.2); /* derived: light equivalent */
  --button-dot-active-bg: #0047bb; /* derived: --primary */

  --button-card-padding: 16px;
  --button-card-bg: rgba(255, 255, 255, 0.9); /* derived: light equivalent */
  --button-card-hover-bg: rgba(247, 247, 247, 0.95); /* derived: light equivalent */
  --button-card-border: rgba(0, 0, 0, 0.1); /* derived: light equivalent */
  --button-card-text: #012e79; /* source: Figma navy title text */
  --button-card-backdrop-filter: blur(12px);

  --button-header-padding-y: 8px;
  --button-header-padding-x: 16px;
  --button-header-cta-padding-y: 10px;
  --button-header-cta-padding-x: 20px;
  --button-language-padding-y: 8px;
  --button-language-padding-x: 12px;
  --button-icon-padding: 10px;
  --button-bottom-nav-padding-y: 6px;
  --button-bottom-nav-padding-x: 12px;
  --button-bottom-nav-active: rgb(0, 71, 187); /* derived: --primary */

  /* Main Surfaces (Light) */
  --main-surface-1: #ffffff; /* derived: light surface */
  --main-surface-2: #f7f7f7; /* source: Figma bet slip summary fill */
  --main-surface-3: #ececec; /* source: Figma button fill */
  --main-overlay-weak: rgba(0, 0, 0, 0.1);
  --main-icon-bg: rgba(0, 40, 106, 0.08); /* derived: navy tint */
  --main-icon-border: rgba(0, 40, 106, 0.12); /* derived: navy tint */
  --glass-bg: rgba(255, 255, 255, 0.6); /* derived: light glass */
  --glass-border: rgba(0, 0, 0, 0.08); /* derived: light glass */

  /* Quick Menu Gradients (navy cards) */
  --quickmenu-hero1-gradient:
    linear-gradient(270deg, #002f7b 0%, rgba(0, 47, 123, 0) 75%), #051744; /* derived: navy family */
  --quickmenu-hero1-accent: #8ab6ff; /* source: Figma amount button text blue */

  --quickmenu-hero2-gradient:
    linear-gradient(270deg, #04174d 0%, rgba(4, 23, 77, 0) 75%), #051744; /* derived: navy family */
  --quickmenu-hero2-accent: #c3c8d5; /* source: Figma light info card fill */

  --quickmenu-slot-gradient:
    linear-gradient(
      270deg,
      rgba(0, 144, 255, 0.2) 0%,
      rgba(0, 144, 255, 0) 75%
    ),
    #051744; /* derived: navy family + CTA blue */
  --quickmenu-slot-accent: #8ab6ff; /* source: Figma amount button text blue */

  --quickmenu-popular-gradient:
    linear-gradient(270deg, #6e4a08 0%, rgba(110, 74, 8, 0) 75%), #051744; /* derived: gold tint on navy */
  --quickmenu-popular-accent: #fed678; /* source: Figma landing gold logo fill */

  --quickmenu-recent-gradient:
    linear-gradient(270deg, #3f6000 0%, rgba(63, 96, 0, 0) 75%), #051744; /* source: Figma 0원 green dark */
  --quickmenu-recent-accent: #d6ff87; /* source: Figma bet button stroke lime */

  /* Main Carousel (Light) */
  --main-carousel-card-bg: linear-gradient(180deg, #ffffff 0%, #e8edf6 100%); /* derived: light card gradient */
  --main-carousel-overlay: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.1) 0%,
    rgba(0, 0, 0, 0.2) 50%,
    rgba(0, 0, 0, 0.4) 100%
  );
  --main-casino-title: #000000; /* source: Figma landing section header text */
  --main-casino-action-bg: #ececec; /* source: Figma button fill */
  --main-casino-action-text: #62697b; /* source: Figma filter text */
  --main-casino-card-border: #c1c7d2; /* source: Figma strokes */
  --main-casino-active-border: #8bd500; /* source: Figma active card stroke 2px */
  --main-casino-active-shadow: none;
  --main-casino-active-text: #0047bb; /* derived: --primary */
  --main-slot-title: #000000; /* source: Figma landing section header text */
  --main-slot-action-bg: #ececec; /* source: Figma button fill */
  --main-slot-action-text: #62697b; /* source: Figma filter text */
  --main-slot-card-border: #373737; /* source: Figma slot image stroke */
  --market-card-bg: linear-gradient(135deg, #04174d 0%, #011638 100%); /* derived: navy card gradient */
  --market-card-border: #2f3b4e; /* source: Figma grid item stroke */
  --market-card-header-bg: rgba(1, 22, 56, 0.5); /* derived: navy tint */
  --market-card-header-border: rgba(0, 144, 255, 0.2); /* derived: CTA blue tint */
  --market-card-header-border-gradient: linear-gradient(
    90deg,
    rgba(0, 144, 255, 0.2) 0%,
    rgba(0, 144, 255, 1) 50%,
    rgba(0, 144, 255, 0.2) 100%
  ); /* derived: CTA blue */
  --market-card-header-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.5);
  --market-card-header-ellipse: radial-gradient(
    84% 140% at 50% 100%,
    rgba(0, 144, 255, 0.28) 0%,
    rgba(0, 144, 255, 0.16) 36%,
    rgba(0, 144, 255, 0) 74%
  ); /* derived: CTA blue glow */
  --market-card-header-ellipse-color: rgba(0, 144, 255, 0.5); /* derived: CTA blue */
  --market-card-overlay: linear-gradient(
    180deg,
    rgba(4, 23, 77, 0.5) 6%,
    rgba(1, 22, 56, 0.5) 60%
  ); /* derived: navy family */
  --market-card-button-bg: rgba(255, 255, 255, 0.08); /* derived: on-navy surface */
  --market-card-region: #aebdcd; /* source: Figma category button fill */
  --market-card-label: #c3c8d5; /* source: Figma light info card fill */
  --market-card-button-home-bg: rgba(0, 144, 255, 0.14); /* derived: navy card home tint */
  --market-card-button-draw-bg: rgba(255, 255, 255, 0.08); /* derived: on-navy surface */
  --market-card-button-away-bg: rgba(217, 139, 13, 0.14); /* derived: gold tint */
  --market-card-odds-home: #75a5ff; /* source: Figma team name blue */
  --market-card-odds-draw: #c3c8d5; /* source: Figma light info card fill */
  --market-card-odds-away: #ffc92f; /* source: Figma expected winnings gold */
  --market-card-live-bg: rgba(227, 63, 63, 0.16); /* derived: red tint */
  --market-card-live-border: rgba(227, 63, 63, 0.45); /* derived: red tint */
  --market-card-live-dot: #ff2222; /* source: Figma timer container red */
  --market-card-live-text: #ff6b6b; /* derived: red on navy */
  --market-card-date-text: #8ab6ff; /* source: Figma amount button text blue */
  --market-card-time-text: #aebdcd; /* source: Figma category button fill */
  --market-card-vs-text: #7c8697; /* source: Figma link muted */
  /* 팀 로고 원형 — 밝은 프로스티드 글래스 (유지) */
  --market-card-team-logo-bg: linear-gradient(
    145deg,
    rgba(255, 255, 255, 0.96) 0%,
    rgba(255, 255, 255, 0.82) 55%,
    rgba(255, 255, 255, 0.68) 100%
  );
  --markets-carousel-title-gradient: linear-gradient(
    90deg,
    #0090ff 0%,
    #0047bb 51%,
    #8ab6ff 100%
  ); /* derived: CTA blue gradient (기존 골드 3-stop 구조 유지) */

  /* Quick Links (메인 바로가기 6종) — source: Figma 랜딩 하단 info 카드 */
  --quick-link-bg: #c3c8d5; /* source: Figma league-list info card fill */
  --quick-link-border: transparent;
  --quick-link-border-active: transparent;
  --quick-link-icon-bg: transparent;
  --quick-link-icon-glow: none;
  --quick-link-subtext: #505050; /* source: Figma date/time text */
  --quick-link-action: #012e79; /* source: Figma navy title text */

  /* Top Menu (Light) — source: Figma 1:2189 Header Top (component 1:2214) */
  --topmenu-bg: #ffffff; /* source: Figma 1:2189 Header Top fill */
  --topmenu-button-bg: #00286a; /* source: Figma 로그아웃 Button fill */
  --topmenu-button-hover: #003585; /* derived: --topmenu-button-bg lighten */
  --topmenu-time-text: #000000; /* source: Figma Current Time fill */
  --topmenu-link-accent: #d98b0d; /* source: Figma Deposit link fill */
  --topmenu-withdraw: #d98b0d; /* source: Figma Withdrawal link fill */
  --topmenu-link-muted: #7c8697; /* source: Figma header top link fill */
  --topmenu-pill-bg: transparent; /* source: Figma balance pills no fill */
  --topmenu-pill-border: transparent; /* source: Figma balance pills no stroke */
  --topmenu-pill-text: #7c8697; /* source: Figma Cash/Points Balance fill */
  --topmenu-level-bg: #e4e4e4; /* source: Figma User Level Container fill */
  --topmenu-level-text: #8c8c8c; /* source: Figma User Level fill */
  --topmenu-user-name: #00286a; /* source: Figma Username fill */
  --topmenu-logout: #00286a; /* source: Figma 로그아웃 Button fill (TSX가 보더/텍스트로 사용) */
  --topmenu-badge-bg: #ff1a1a; /* source: Figma badge dot fill (Red/400) */
  --topmenu-badge-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.3); /* source: Figma badge drop shadow */
  --topmenu-icon-muted: #7c8697; /* source: Figma header top link fill */
  --topmenu-avatar-bg: #ececec; /* source: Figma button fill */
  --topmenu-avatar-border: #c1c7d2; /* source: Figma strokes */

  /* Layout Colors — GNB는 네이비 (nav 링크 text-white 하드코딩 + 디자인 일치) */
  --header-bg: #011638; /* source: Figma Header Botoom fill/gradient start */
  --header-bg-md: #011638; /* source: Figma Header Botoom fill */
  --header-glass-bg: rgba(1, 22, 56, 0.85); /* derived: navy glass */
  --header-border: rgba(1, 22, 56, 0.15); /* derived: navy tint (라이트 표면 위 보더 겸용) */
  --header-nav-border: rgba(255, 255, 255, 0.1); /* derived: on-navy divider */
  --header-glass-shadow:
    0px 12px 32px 0px rgba(0, 0, 0, 0.12),
    inset 0px 1px 0px rgba(255, 255, 255, 0.6); /* derived: light glass */
  --header-ellipse: radial-gradient(
    50% 140% at 50% 0%,
    rgba(0, 71, 187, 0.28) 0%,
    rgba(0, 71, 187, 0.16) 34%,
    rgba(0, 71, 187, 0) 74%
  ); /* derived: navy glow */
  --header-overlay: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.06) 0%,
    rgba(255, 255, 255, 0) 68%
  );
  --header-balance-pill-bg: #00286a; /* source: Figma balance button fill */
  --header-balance-pill-hover-bg: #003585; /* derived: lighten */
  --header-balance-pill-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2); /* derived */
  --header-balance-pill-currency: rgba(255, 255, 255, 0.6); /* derived: on-navy muted */
  --header-level-button-bg:
    linear-gradient(
      180deg,
      rgba(0, 71, 187, 0.12) 0%,
      rgba(0, 71, 187, 0.04) 100%
    ),
    #ffffff; /* derived: navy tint on white */
  --header-level-button-hover-bg:
    linear-gradient(
      180deg,
      rgba(0, 71, 187, 0.2) 0%,
      rgba(0, 71, 187, 0.1) 100%
    ),
    #ffffff; /* derived: navy tint on white */
  --header-user-pill-bg:
    linear-gradient(
      135deg,
      rgba(0, 71, 187, 0.16) 0%,
      rgba(0, 71, 187, 0.08) 52%,
      rgba(255, 255, 255, 0.6) 100%
    ),
    rgba(232, 237, 246, 0.9); /* derived: navy tint on light */
  --header-user-pill-text: #00286a; /* source: Figma Username fill */
  --header-user-pill-shadow:
    0px 0px 18px 0px rgba(0, 71, 187, 0.12),
    inset 0px 1px 0px rgba(255, 255, 255, 0.6); /* derived */
  --header-balance-icon-shadow: 0px 0px 14px 0px rgba(0, 71, 187, 0.28); /* derived */
  --header-balance-dialog-bg: rgba(255, 255, 255, 0.95); /* derived: light glass */
  --header-balance-dialog-border: #e2e2e2; /* source: Figma soft border */
  --header-balance-dialog-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.25); /* derived */
  --header-balance-dialog-secondary-button-bg: rgba(0, 0, 0, 0.05); /* derived */
  --header-telegram-button-bg: #0088cc; /* 브랜드 색 유지 */
  --header-telegram-button-hover-bg: #006fa6; /* 브랜드 색 유지 */
  --header-telegram-button-shadow: 0px 0px 20px 0px rgba(47, 186, 255, 0.28);
  --header-tether-button-bg:
    linear-gradient(
      135deg,
      rgba(0, 71, 187, 0.16) 0%,
      rgba(0, 71, 187, 0.06) 58%,
      rgba(255, 255, 255, 0.4) 100%
    ),
    rgba(232, 237, 246, 0.9); /* derived: navy tint on light */
  --header-tether-button-hover-bg:
    linear-gradient(
      135deg,
      rgba(0, 71, 187, 0.24) 0%,
      rgba(0, 71, 187, 0.12) 58%,
      rgba(255, 255, 255, 0.5) 100%
    ),
    rgba(232, 237, 246, 0.95); /* derived: navy tint on light */
  --header-tether-button-border: rgba(0, 71, 187, 0.28); /* derived: navy tint */
  --header-tether-button-text: #012e79; /* source: Figma navy title text */
  --header-tether-button-shadow:
    0px 10px 24px 0px rgba(0, 71, 187, 0.12),
    inset 0px 1px 0px rgba(255, 255, 255, 0.6); /* derived */
  --header-tether-button-hover-shadow:
    0px 14px 28px 0px rgba(0, 71, 187, 0.18),
    inset 0px 1px 0px rgba(255, 255, 255, 0.7); /* derived */

  --sidebar-bg: #efefef; /* derived: --background */
  --sidebar-tab-bg: #ececec; /* source: Figma button fill */
  --sidebar-tab-hover: #e2e2e2; /* derived: hover darken */
  --mobile-sidebar-overlay: rgba(0, 0, 0, 0.8);
  --mobile-sidebar-content-bg: #ffffff; /* derived: light surface */
  --mobile-sidebar-logo-shadow: 4px 8px 10px rgba(0, 0, 0, 0.15); /* derived */
  --mobile-sidebar-action-gradient: linear-gradient(
    90deg,
    #0090ff 0%,
    #0047bb 100%
  ); /* source: Figma CTA gradient */
  --mobile-sidebar-action-text: #ffffff; /* derived: on-gradient text */
  --mobile-sidebar-action-icon: rgba(255, 255, 255, 0.7); /* derived: on-gradient icon */
  --mobile-sidebar-action-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.1);
  --mobile-sidebar-game-bg: linear-gradient(
    135deg,
    #04174d 0%,
    #011638 100%
  ); /* derived: navy card gradient */
  --mobile-sidebar-game-border: #2f3b4e; /* source: Figma grid item stroke */
  --mobile-sidebar-game-text: #ffffff; /* source: Figma on-navy text */
  --mobile-sidebar-info-bg: #e8edf6; /* source: Figma odds cell fill */
  --mobile-sidebar-info-text: #0047bb; /* derived: --primary */
  --mobile-sidebar-auth-actions-bg: #f7f7f7; /* derived: light strip */
  --mobile-sidebar-auth-action-bg: #ececec; /* source: Figma button fill */
  --mobile-sidebar-auth-action-border: #c1c7d2; /* source: Figma strokes */
  --mobile-sidebar-auth-action-text: #012e79; /* source: Figma navy title text */
  --mobile-sidebar-auth-action-icon: #7c8697; /* source: Figma link muted */

  --content-bg: #efefef; /* source: Figma root frame fill */
  --content-section-bg: #ffffff; /* derived: light section surface */
  --content-border: #c1c7d2; /* source: Figma strokes */

  /* Text Colors (Light) */
  --text-primary: #000000; /* source: Figma landing heading text */
  --text-secondary: #7c8697; /* source: Figma header top link fill */
  --text-accent: #0047bb; /* derived: --primary */
  --text-danger: #e33f3f; /* source: Figma bet prediction red */

  /* Pagination (Light) */
  --pagination-item-bg: #ececec; /* source: Figma inactive button fill */
  --pagination-text: #62697b; /* source: Figma filter text */
  --pagination-active-bg: #00286a; /* source: Figma navy button fill */
  --pagination-active-text: #ffffff; /* source: Figma on-navy text */
  --pagination-hover-bg: #e2e2e2; /* derived: hover darken */

  /* Scrollbar (Light) — source: Figma 1:6581 Rectangle 7597/7598 */
  --scrollbar-size: 8px;
  --scrollbar-radius: 99px;
  --scrollbar-track: #e2e2e2; /* source: Figma Rectangle 7597 fill */
  --scrollbar-thumb: #012e79; /* source: Figma Rectangle 7598 fill */
  --scrollbar-thumb-hover: #0047bb; /* derived: --primary */

  /* Betting Components (only unique values not covered by existing vars) */
  --betting-button-bg: #e8edf6; /* source: Figma odds cell fill */
  --betting-button-hover: #d3dde7; /* source: Figma right sidebar fill */
  --betting-text-highlight: #ffc92f; /* source: Figma expected winnings fill */
  --betting-text-label: #62697b; /* source: Figma filter text */
  --betting-cart-bg: #d3dde7; /* source: Figma Right Sidebar fill */
  --betting-cart-border: #c1c7d2; /* source: Figma Right Sidebar stroke */
  --betting-cart-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15); /* derived: light shadow */
  --betting-cart-title: #012e79; /* source: Figma 베팅 슬립 title fill */
  --betting-cart-muted: #7c8697; /* source: Figma 카트비우기 fill */
  --betting-cart-badge-bg: #aebdcd; /* source: Figma Subtitle Container fill */
  --betting-cart-badge-border: #aebdcd; /* source: Figma Subtitle Container fill */
  --betting-cart-match-text: #777777; /* source: Figma Bet Matchup fill */
  --betting-cart-vs-text: #7c8697; /* source: Figma link muted */
  --betting-cart-market-text: #6ba500; /* source: Figma Bet Info fill */
  --betting-cart-team-text: #e33f3f; /* source: Figma Bet Prediction fill */
  --betting-cart-warning-bg: #efefef; /* source: Figma Bet Warning Container fill */
  --betting-cart-warning-border: #e2e2e2; /* derived: soft border */
  --betting-cart-warning-text: #000000; /* source: Figma Warning Text fill */
  --betting-cart-warning-chip-bg: #ffb260; /* source: Figma Warning Button Container fill */
  --betting-cart-odds-old: #7c8697; /* source: Figma Changed Odds Old fill */
  --betting-cart-odds-up-bg: #b41f22; /* source: Figma New Odds Container fill (up) */
  --betting-cart-odds-down-bg: #1287e7; /* source: Figma New Odds Container fill (down) */
  --betting-cart-amount-bg: #f7f7f7; /* source: Figma amount section fill */
  --betting-cart-amount-button-bg: #00286a; /* source: Figma amount Button fill */
  --betting-cart-amount-button-border: #00286a; /* source: Figma amount Button fill */
  --betting-cart-amount-button-text: #8ab6ff; /* source: Figma amount Button text fill */
  --betting-cart-submit-bg: #00286a; /* source: Figma Place Bet Button fill */
  --betting-cart-value-text: #ffc92f; /* source: Figma Expected Winnings fill */
  --minigame-cart-option-bg: #e8edf6; /* source: Figma odds cell fill */
  --minigame-cart-badge-player-bg: rgba(18, 135, 231, 0.1); /* derived: blue tint */
  --minigame-cart-badge-player-border: #1287e7; /* source: Figma odds-down blue */
  --minigame-cart-badge-player-text: #1287e7; /* source: Figma odds-down blue */
  --minigame-cart-badge-banker-bg: rgba(180, 31, 34, 0.1); /* derived: red tint */
  --minigame-cart-badge-banker-border: #b41f22; /* source: Figma odds-up red */
  --minigame-cart-badge-banker-text: #b41f22; /* source: Figma odds-up red */
  --minigame-cart-badge-tie-bg: rgba(107, 165, 0, 0.1); /* derived: green tint */
  --minigame-cart-badge-tie-border: #6ba500; /* source: Figma bet info green */
  --minigame-cart-badge-tie-text: #6ba500; /* source: Figma bet info green */

  /* Bonus Selector */
  --bonus-btn-inactive-bg: #e8edf6; /* source: Figma odds cell fill */
  --bonus-btn-active-sub-label: #6ba500; /* source: Figma bet info green */

  /* Odds Direction */
  --odds-up: #b41f22; /* source: Figma odds-up red */
  --odds-down: #1287e7; /* source: Figma odds-down blue */
  --odds-neutral: #7c8697; /* source: Figma link muted */
  --odds-indicator-down: #1287e7; /* source: Figma odds-down blue */
  --odds-indicator-icon: #ffffff; /* derived: on-colored-chip icon */

  /* Options Panel (Light) */
  --options-panel-header-bg: #d3dde7; /* source: Figma match info header fill */
  --options-panel-header-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.15); /* derived */
  --options-header-badge-bg: #aebdcd; /* source: Figma category button fill */
  --options-tab-inactive-border: #c1c7d2; /* source: Figma strokes */
  --options-tab-active-gradient: linear-gradient(
    90deg,
    rgba(1, 22, 56, 1) 0%,
    rgba(0, 71, 187, 1) 39%,
    rgba(1, 22, 56, 1) 100%
  ); /* derived: navy 3-stop (기존 구조 유지) */
  --options-tab-bg: transparent;
  --options-tab-active-bg: transparent;
  --options-tab-active-border: #00286a; /* source: Figma navy button fill */
  --options-tab-text: #012e79; /* source: Figma navy title text */
  --options-selection-bg: #ffffff; /* derived: light cell surface */
  --options-selection-border: #c1c7d2; /* source: Figma strokes */
  --options-selection-active-bg: #e8edf6; /* source: Figma odds cell fill */
  --options-selection-active-border: #0047bb; /* derived: --primary */
  --options-selection-team: #012e79; /* source: Figma navy title text */
  --options-selection-price-home: #0084f4; /* source: Figma bet type icon blue */
  --options-selection-price-draw: #6ba500; /* source: Figma bet info green */
  --options-selection-price-away: #e35b20; /* source: Figma bet button orange */
  --options-section-title: #a66602; /* source: Figma Bet section title fill */
  --handicap-positive: #b41f22; /* source: Figma odds-up red */
  --handicap-negative: #1287e7; /* source: Figma odds-down blue */
  --options-match-vs: #7c8697; /* source: Figma link muted */
  --options-match-time: rgba(0, 0, 0, 0.5); /* derived: light equivalent */
  --options-header-glow: radial-gradient(
    ellipse 100% 80% at 50% 0%,
    rgba(0, 71, 187, 0.15) 0%,
    rgba(0, 71, 187, 0.06) 40%,
    rgba(0, 71, 187, 0) 100%
  ); /* derived: navy glow */
  --options-header-badge-text: #012e79; /* source: Figma navy title text */
  --options-header-divider: rgba(255, 255, 255, 0.1); /* source: Figma Line 13 stroke */
  --options-header-competition: #a66602; /* source: Figma Bet section title fill */
  --options-market-count-active: #a66602; /* source: Figma Bet section title fill */
  --sports-score-panel-overlay: linear-gradient(
    180deg,
    rgba(1, 22, 56, 0.08) 0%,
    rgba(0, 47, 123, 0.24) 100%
  ); /* derived: navy family */
  --sports-score-panel-bottom-overlay: linear-gradient(
    180deg,
    rgba(0, 47, 123, 0) 34%,
    rgba(1, 22, 56, 0.42) 100%
  ); /* derived: navy family */
  --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(0, 40, 106, 0.46); /* derived: navy tint */
  --sports-score-panel-badge-border: rgba(214, 232, 244, 0.22);
  --sports-score-panel-badge-shadow:
    0px 14px 30px 0px rgba(5, 11, 16, 0.26),
    inset 0px 1px 0px rgba(255, 255, 255, 0.16);
  --sports-score-panel-badge-text: #f4fbff;
  --sports-score-panel-chip-bg: rgba(1, 22, 56, 0.34); /* derived: navy tint */
  --sports-score-panel-chip-border: rgba(214, 232, 244, 0.18);
  --sports-score-panel-chip-shadow:
    0px 14px 32px 0px rgba(4, 9, 14, 0.24),
    inset 0px 1px 0px rgba(255, 255, 255, 0.14);
  --sports-score-panel-chip-label: #c4d7e2;
  --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(14, 22, 29, 0.38);
  --sports-score-panel-card-icon-shadow: 0px 6px 14px 0px rgba(3, 7, 11, 0.28);
  --sports-score-panel-yellow-card: #f5dc4a;
  --sports-score-panel-red-card: #d73b41;
  --sports-score-panel-indicator-active: #0047bb; /* derived: --primary */
  --sports-score-panel-indicator-border: rgba(214, 232, 244, 0.26);

  /* Banner */
  --banner-accent: #0090ff; /* source: Figma CTA gradient start */

  /* Signup/Auth */
  --auth-step-complete: #8bd500; /* source: Figma active green */
  --auth-step-active: #0047bb; /* derived: --primary */
  --auth-step-active-ring: rgba(0, 71, 187, 0.3); /* derived: --primary tint */

  /* Games (only unique values) */
  --games-active: #e33f3f; /* derived: --destructive */
  --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: #00286a; /* source: Figma navy button fill */
  --games-filter-tab-active-border: #00286a; /* source: Figma navy button fill */
  --games-filter-tab-active-text: #ffffff; /* source: Figma active nav button text */
  --games-filter-tab-active-shadow: none;
  --games-filter-tab-bg: #ececec; /* source: Figma inactive button fill */
  --games-filter-tab-border: #c1c7d2; /* source: Figma strokes */
  --games-filter-tab-hover-border: #00286a; /* source: Figma navy button fill */
  --games-filter-tab-text: #62697b; /* source: Figma filter text */
  --games-filter-tab-shadow: none;
  --minigame-brand-tabs-border-gradient: linear-gradient(
    90deg,
    rgba(1, 22, 56, 1) 0%,
    rgba(0, 71, 187, 1) 50%,
    rgba(1, 22, 56, 1) 100%
  ); /* derived: navy 3-stop */
  --minigame-brand-tab-bg: #ececec; /* source: Figma inactive button fill */
  --minigame-brand-tab-active-border: #00286a; /* source: Figma navy button fill */
  --minigame-brand-tab-active-text: #012e79; /* source: Figma navy title text */
  --minigame-brand-tab-inactive-text: #62697b; /* source: Figma filter text */
  --minigame-subtab-active-bg: #e8edf6; /* source: Figma odds cell fill */
  --minigame-subtab-active-border: #0047bb; /* derived: --primary */
  --minigame-subtab-active-text: #0047bb; /* derived: --primary */
  --minigame-subtab-bg: #ececec; /* source: Figma inactive button fill */
  --minigame-subtab-border: #c1c7d2; /* source: Figma strokes */
  --minigame-subtab-text: #505050; /* source: Figma date/time text */
  --minigame-bet-history-card-bg: #ffffff; /* derived: light card surface */
  --minigame-bet-history-card-border: #c1c7d2; /* source: Figma strokes */
  --minigame-bet-history-card-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.1); /* derived */
  --minigame-bet-history-title: #62697b; /* source: Figma filter text */
  --minigame-bet-history-refresh-bg: #00286a; /* source: Figma navy button fill */
  --minigame-bet-history-refresh-border: #00286a; /* source: Figma navy button fill */
  --minigame-bet-history-refresh-text: #ffffff; /* derived: on-navy text */
  --minigame-bet-history-header-bg: #e8edf6; /* source: Figma odds cell fill */
  --minigame-bet-history-header-text: #62697b; /* source: Figma filter text */
  --minigame-bet-history-cell-separator: rgba(0, 0, 0, 0.15); /* derived */
  --minigame-bet-history-row-border: rgba(0, 0, 0, 0.08); /* derived */
  --minigame-bet-history-row-muted: rgba(0, 0, 0, 0.5); /* derived */
  --minigame-bet-history-row-text: #505050; /* source: Figma date/time text */
  --minigame-bet-history-win-text: #1287e7; /* source: Figma odds-down blue */
  --minigame-bet-history-lose-text: #e33f3f; /* derived: --destructive */
  --bet365-subtab-bg: var(--sport-tab-bg);
  --bet365-subtab-border: var(--sport-tab-container-border);
  --bet365-subtab-text: var(--sport-tab-count);
  --bet365-subtab-active-bg: color-mix(
    in srgb,
    var(--success-gradient-to) 18%,
    var(--sport-tab-bg)
  );
  --bet365-subtab-active-border: var(--success-gradient-from);
  --bet365-subtab-active-text: var(--success-gradient-from);
  --bet365-subtab-hover-border: var(--success-gradient-to);
  --bet365-subtab-hover-text: var(--success-gradient-from);
  --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: #d3dde7; /* source: Figma right sidebar fill */

  /* Sidebar Banner Brand Colors */
  --sidebar-banner-pragmatic-text: #f9d9bd;
  --sidebar-banner-pragmatic-accent: #f7941e;
  --sidebar-banner-dot-text: #03f682;
  --sidebar-banner-dot-accent: #def3e0;

  /* Icons */
  --icon-user-online: #8bd500; /* source: Figma active green */

  /* Casino Icons */
  --casino-icon-stroke: #ff3b3b;
  --casino-icon-gradient-start: #ff6b6b;
  --casino-icon-gradient-mid: #ff2222;
  --casino-icon-gradient-end: #d10000;

  /* Event Card Colors */
  --event-signup: #ffe5cc;
  --event-deposit: #e5f3ff;
  --event-attendance: #e5ffe5;
  --event-referral: #ffe5f3;
  --event-casino: #f3e5ff;
  --event-sports: #ffffe5;
  --event-vip: #ffe5e5;
  --event-slot: #e5ffff;
  --event-loyalty: #f0ffe5;
  --event-birthday: #ffe5f0;
  --event-cashback: #e5f0ff;
  --event-special: #ffe5b3;
  --event-mobile: #b3ffe5;
  --event-live: #e5b3ff;
  --event-lottery: #ffb3e5;
  --event-tutorial: #b3e5ff;
  --event-login: #ffffb3;
  --event-seasonal: #ffb3b3;
  --event-levelup: #b3ffb3;
  --event-survey: #b3b3ff;
  --event-default: #d9d9d9;
  --event-text: #333333;

  /* Toast Colors */
  --toast-icon-bg: #e8edf6; /* source: Figma odds cell fill */
  --toast-success-from: #22c55e;
  --toast-success-to: #4ade80;
  --toast-warning-from: #f59e0b;
  --toast-warning-to: #fcd34d;
  --toast-info-from: #3b82f6;
  --toast-info-to: #60a5fa;
  --toast-muted-from: #6b7280;
  --toast-muted-to: #9ca3af;

  /* Coupon Card */
  --coupon-bg: #ffffff; /* derived: light card surface */
  --coupon-bg-disabled: #ececec; /* source: Figma inactive button fill */
  --coupon-border: #c1c7d2; /* source: Figma strokes */
  --coupon-badge-bg: #e8edf6; /* source: Figma odds cell fill */
  --coupon-accent: #0047bb; /* derived: --primary */

  /* Coupon Game Type Colors */
  --coupon-color-all: #c1c7d2; /* source: Figma strokes */
  --coupon-color-casino: #ffe074;
  --coupon-color-slot: #37acff;
  --coupon-color-sports: #70ff57;
  --coupon-color-minigame: #ff787a;

  /* Coupon Card v2 (쿠폰 페이지) */
  --coupon-card-bg: #ffffff; /* derived: light card surface */
  --coupon-card-border: #c1c7d2; /* source: Figma strokes */
  --coupon-avail-label: #62697b; /* source: Figma filter text */
  --coupon-avail-count: #b41f22; /* source: Figma odds-up red */
  --coupon-register-bg: #00286a; /* source: Figma navy button fill */
  --coupon-register-border: #00286a; /* source: Figma navy button fill */
  --coupon-expiry-text: #a66602; /* source: Figma Bet section title fill */
  --coupon-expiry-time: #d98b0d; /* source: Figma gold accent */
  --coupon-btn-action: #000000; /* 유지: 골드 그라디언트 위 다크 텍스트 */
  --coupon-type-sports: linear-gradient(
    90deg,
    rgba(253, 153, 0, 1) 0%,
    rgba(255, 105, 0, 1) 100%
  );
  --coupon-type-minigame: linear-gradient(
    90deg,
    rgba(142, 78, 255, 1) 0%,
    rgba(152, 19, 250, 1) 100%
  );
  --coupon-type-casino: linear-gradient(
    90deg,
    rgba(175, 71, 255, 1) 0%,
    rgba(243, 54, 159, 1) 100%
  );
  --coupon-type-all: linear-gradient(
    90deg,
    rgba(0, 144, 255, 1) 0%,
    rgba(0, 71, 187, 1) 100%
  ); /* derived: CTA gradient */

  /* Betting History Card v2 (스포츠 베팅내역) */
  --bet-card-bg: #ffffff; /* derived: light card surface */
  --bet-card-border: #c1c7d2; /* source: Figma strokes */
  --bet-ticket-number: #d98b0d; /* source: Figma gold accent */
  --bet-status-hit: #1287e7; /* source: Figma odds-down blue */
  --bet-status-miss: #e33f3f; /* derived: --destructive */
  --bet-table-header-bg: #e8edf6; /* source: Figma odds cell fill */
  --bet-match-badge-bg: #d3dde7; /* source: Figma right sidebar fill */
  --bet-match-badge-text: #505050; /* source: Figma date/time text */
  --bet-summary-bar-bg: #f7f7f7; /* source: Figma bet slip summary fill */
  --bet-summary-badge-bg: rgba(0, 0, 0, 0.08); /* derived: light equivalent */
  --bet-type-pre: #0084f4; /* source: Figma bet type icon blue */
  --bet-timestamp: #7c8697; /* source: Figma link muted */
  --bet-cell-border: rgba(0, 0, 0, 0.15); /* derived */
  --bet-row-border: rgba(0, 0, 0, 0.08); /* derived */
  --bet-delete-btn-bg: #00286a; /* source: Figma navy button fill */
  --bet-delete-btn-border: #00286a; /* source: Figma navy button fill */

  /* Minigame Bet Colors */
  --bet-blue: #1287e7; /* source: Figma odds-down blue */
  --bet-red: #e33f3f; /* derived: --destructive */

  /* Sports Tab Colors (9-color cycle by display order) */
  --sport-tab-container-bg: #ffffff; /* derived: nav bar light surface */
  --sport-tab-container-border: #e2e2e2; /* source: Figma nav bar stroke */
  --sport-tab-bg: #ececec; /* source: Figma nav button fill */
  --sport-tab-all-border: #c1c7d2; /* source: Figma nav button stroke */
  --sport-tab-count: #7c8697; /* source: Figma nav Counter fill */
  --sport-tab-label: #00286a; /* source: Figma nav Icon text fill */
  --sport-tab-active-border: #8bd500; /* source: Figma active stroke green */
  --sport-tab-active-text: #0047bb; /* derived: --primary */
  --sport-tab-active-shadow:
    0px 0px 10px 0px rgba(0, 71, 187, 0.25),
    inset 0px 0px 20px 0px rgba(0, 71, 187, 0.12); /* derived: navy glow */
  --sport-tab-color-1: #32d6ff;
  --sport-tab-color-2: #5479ff;
  --sport-tab-color-3: #a941ff;
  --sport-tab-color-4: #ff76df;
  --sport-tab-color-5: #ff5053;
  --sport-tab-color-6: #ffb14c;
  --sport-tab-color-7: #d5ff4c;
  --sport-tab-color-8: #4cff52;
  --sport-tab-color-9: #012e79; /* derived: white → navy (라이트 배경 대비) */

  /* Sports Filter Bar V2 Colors */
  --filter-v2-sort-active: #0047bb; /* source: Figma Sort by Time gradient text */
  --filter-v2-sort-inactive: #62697b; /* source: Figma filter text */
  --filter-v2-search-bg: #ececec; /* source: Figma search-bar fill */
  --filter-v2-search-border: #c1c7d2; /* source: Figma search-bar stroke */
  --filter-v2-search-placeholder: #62697b; /* source: Figma filter text */
  --sports-filter-select-bg: #e8edf6; /* source: Figma odds cell fill */
  --sports-filter-select-text: #0047bb; /* derived: --primary */

  /* Sports Tab V2 Colors */
  --sport-tab-v2-wrap-bg: #e8edf6; /* source: Figma odds cell fill */
  --sport-tab-v2-label: #62697b; /* source: Figma filter text */
  --sport-tab-v2-count: #7c8697; /* source: Figma nav Counter fill */
  --sport-tab-v2-active-text: #ffffff; /* source: Figma active nav button text */
  --sport-tab-v2-active-bg: #00286a; /* source: Figma navy button fill */
  --sport-tab-v2-active-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);

  /* Sports Tab Bar (종목 탭) */
  --sport-tab-bar-bottom-border: linear-gradient(
    90deg,
    rgba(1, 22, 56, 1) 0%,
    rgba(0, 71, 187, 1) 50%,
    rgba(1, 22, 56, 1) 100%
  ); /* derived: navy 3-stop */
  --sport-tab-bar-btn-bg: #ececec; /* source: Figma nav button fill */
  --sport-tab-bar-active-border: #00286a; /* source: Figma navy button fill */
  --sport-tab-bar-text: #62697b; /* source: Figma filter text */
  --sport-tab-bar-active-text: #012e79; /* source: Figma navy title text */

  /* League Quick Tabs (리그 선택 pill) */
  --league-tab-btn-bg: #ececec; /* source: Figma inactive button fill */
  --league-tab-btn-border: #c1c7d2; /* source: Figma strokes */
  --league-tab-active-bg: #e8edf6; /* source: Figma odds cell fill */
  --league-tab-active-border: #0047bb; /* derived: --primary */
  --league-tab-active-text: #0047bb; /* derived: --primary */

  /* SubTitle Component */
  --subtitle-bar-color: rgba(0, 71, 187, 1); /* derived: --primary */
  --subtitle-bar-glow: rgba(0, 71, 187, 0.4); /* derived: --primary tint */
  --subtitle-watermark: #e8edf6; /* source: Figma odds cell fill */

  /* Sports Group Header */
  --sport-group-bg: #e8edf6; /* source: Figma odds cell fill */
  --sport-group-bg-from: rgba(255, 255, 255, 1); /* derived: light gradient */
  --sport-group-bg-to: rgba(232, 237, 246, 1); /* derived: light gradient */
  --sport-group-border-from: #0090ff; /* source: Figma CTA gradient start */
  --sport-group-border-via: #0047bb; /* source: Figma CTA gradient end */
  --sport-group-border-to: #0090ff; /* source: Figma CTA gradient start */
  --sport-group-shadow: 0px 4px 0px 0px rgba(0, 0, 0, 0.08); /* derived */
  --sport-group-radius: 5px;
  --sport-group-country: #012e79; /* source: Figma navy title text */
  --sport-group-league: #0084f4; /* source: Figma bet type icon blue */
  --sport-group-separator: #7c8697; /* source: Figma link muted */
  --sport-group-badge-bg: #d3dde7; /* source: Figma right sidebar fill */
  --sport-group-badge-text: #012e79; /* source: Figma navy title text */
  --sports-list-toolbar-active: #012e79; /* source: Figma navy title text */
  --sports-list-toolbar-inactive: #7c8697; /* source: Figma link muted */
  --sports-list-toolbar-accent: #0084f4; /* source: Figma bet type icon blue */
  /* sports list shell (light) */
  --sports-list-outer-bg: #efefef; /* source: Figma root frame fill */
  --sports-list-outer-border: #c1c7d2; /* source: Figma strokes */
  --sports-list-shell-bg: linear-gradient(
    -90deg,
    rgba(255, 255, 255, 1) 0%,
    rgba(247, 247, 247, 1) 100%
  ); /* derived: light shell gradient */
  --sports-list-shell-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.12); /* derived */
  --sports-asian-group-bg: #e8edf6; /* source: Figma odds cell fill */
  --sports-asian-group-text: #012e79; /* source: Figma navy title text */
  --sports-asian-group-meta: #62697b; /* source: Figma filter text */
  --sports-asian-row-bg: #ffffff; /* derived: light row surface */
  --sports-asian-row-divider: #e2e2e2; /* source: Figma soft border */
  --sports-asian-team-text: #012e79; /* source: Figma navy title text */
  --sports-asian-center-text: #505050; /* source: Figma date/time text */
  --sports-asian-handicap-indicator: #8bd500; /* source: Figma active green */
  --sports-list-group-bg: #e8edf6; /* source: Figma odds cell fill */
  --sports-list-group-border: #c1c7d2; /* source: Figma strokes */
  --sports-list-group-ellipse: none;
  --sports-list-group-label: #012e79; /* source: Figma navy title text */
  /* market header (light) */
  --sports-market-header-bg: #e8edf6; /* source: Figma odds cell fill */
  --sports-market-header-border: #c1c7d2; /* source: Figma strokes */
  --sports-market-header-text: #a66602; /* source: Figma Bet section title fill */
  /* cross market row (light) */
  --sports-cross-market-time-text: #505050; /* source: Figma match date/time fill */
  --sports-cross-market-cell-bg: #e8edf6; /* source: Figma odds Button fill */
  --sports-cross-market-cell-border: #c1c7d2; /* source: Figma strokes */
  --sports-cross-market-odds-text: #012e79; /* source: Figma odds Button text fill */
  --sports-cross-market-team-text: #012e79; /* source: Figma navy title text */
  --sports-cross-market-active-bg: linear-gradient(
    180deg,
    rgba(1, 22, 56, 1) 0%,
    rgba(0, 47, 123, 1) 100%
  ); /* source: Figma active nav button gradient */
  --sports-cross-market-active-border: #00286a; /* source: Figma navy button fill */
  --sports-cross-market-active-text: #ffffff; /* source: Figma active nav button text */
  --sports-cross-market-bet-bg: #e8edf6; /* source: Figma odds cell fill */
  --sports-list-row-divider: rgba(0, 0, 0, 0.08); /* derived */
  --sports-list-row-meta: rgba(0, 0, 0, 0.5); /* derived */
  --sports-list-row-cell-bg: #e8edf6; /* source: Figma odds cell fill */
  --sports-list-row-cell-active-border: #00286a; /* source: Figma navy button fill */
  --sports-list-row-cell-active-bg: #00286a; /* source: Figma navy button fill */
  --sports-list-row-more-bg: #e8edf6; /* source: Figma odds cell fill */
  --sports-list-row-icon-bg: #e8edf6; /* source: Figma odds cell fill */
  --sports-list-row-icon-text: #012e79; /* source: Figma navy title text */
  --sports-live-period-text: #0084f4; /* source: Figma bet type icon blue */
  --sports-live-score: #1287e7; /* source: Figma odds-down blue */
  --sports-live-score-diff: #d98b0d; /* source: Figma gold accent */
  /* live sports row (light) */
  --sports-live-score-gradient: linear-gradient(
    90deg,
    rgba(0, 144, 255, 1) 0%,
    rgba(0, 71, 187, 1) 100%
  ); /* source: Figma CTA gradient */
  --sports-live-score-vs: #7c8697; /* source: Figma link muted */
  --sports-live-market-cell-bg: #e8edf6; /* source: Figma odds cell fill */
  --sports-live-odds-home: #0084f4; /* source: Figma bet type icon blue */
  --sports-live-odds-draw: #6ba500; /* source: Figma bet info green */
  --sports-live-odds-away: #e35b20; /* source: Figma bet button orange */
  --sports-live-more-active-bg: #d3dde7; /* source: Figma right sidebar fill */
  /* lock overlay (light) */
  --sports-lock-overlay-bg: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.55) 0%,
    rgba(238, 238, 238, 0.95) 100%
  ); /* derived: light overlay */
  --sports-lock-overlay-border: rgba(193, 199, 210, 0.5); /* source: Figma strokes + 0.5 */
  --sports-lock-icon-bg: #a66602; /* source: Figma Bet section title fill */
  --sports-lock-icon-fg: #000000;
  --sports-lock-hidden-pattern: repeating-linear-gradient(
    135deg,
    transparent,
    transparent 4px,
    rgba(128, 128, 128, 0.35) 4px,
    rgba(128, 128, 128, 0.35) 6px
  );
  --sports-upcoming-started-overlay-bg: color-mix(
    in srgb,
    var(--background) 72%,
    transparent
  );
  --sports-upcoming-refresh-bg: color-mix(
    in srgb,
    var(--sports-lock-icon-bg) 18%,
    transparent
  );
  --sports-upcoming-refresh-hover-bg: color-mix(
    in srgb,
    var(--sports-lock-icon-bg) 28%,
    transparent
  );
  --sports-upcoming-refresh-text: var(--foreground);
  --sports-upcoming-refresh-shadow: 0px 4px 12px 0px
    color-mix(in srgb, var(--sports-lock-icon-bg) 22%, transparent);
  --sports-live-indicator-bg: var(--primary);
  --sports-live-badge-bg: color-mix(in srgb, var(--primary) 15%, transparent);
  --sports-live-badge-text: var(--primary-gradient-from);
  --sports-market-active-muted-text: color-mix(
    in srgb,
    var(--foreground) 80%,
    transparent
  );
  --sports-scroll-control-border: var(--sports-lock-icon-bg);
  --sports-scroll-control-bg: var(--background);
  --sports-scroll-control-text: var(--sports-lock-icon-bg);
  --sports-scroll-control-shadow: 0px 0px 10px 0px
    color-mix(in srgb, var(--sports-lock-icon-bg) 25%, transparent);
  --sports-scroll-control-hover-bg: var(--sports-lock-icon-bg);
  --sports-scroll-control-hover-text: var(--sports-lock-icon-fg);
  --sports-scroll-control-hover-shadow: 0px 0px 14px 0px
    color-mix(in srgb, var(--sports-lock-icon-bg) 40%, transparent);
  --sports-modal-overlay-bg: color-mix(
    in srgb,
    var(--background) 72%,
    transparent
  );
  --sports-market-overlay-soft-bg: color-mix(
    in srgb,
    var(--background) 35%,
    transparent
  );
  --sports-market-overlay-strong-bg: color-mix(
    in srgb,
    var(--background) 82%,
    transparent
  );
  --sports-selection-label: #62697b; /* source: Figma filter text */
  --sports-asian-odds: #0084f4; /* source: Figma bet type icon blue */

  /* Util Sidebar (Light) */
  --util-sidebar-group-active-from: #d3dde7; /* source: Figma right sidebar fill */
  --util-sidebar-group-active-to: #efefef; /* source: Figma root frame fill */
  --util-sidebar-subitem-from: #c1c7d2; /* source: Figma strokes */
  --util-sidebar-subitem-to: #efefef; /* source: Figma root frame fill */
  --util-sidebar-balance-bg: #e8edf6; /* source: Figma odds cell fill */
  --util-sidebar-shadow: 0px 6px 0px 0px #c1c7d2; /* derived: light shadow line */
}

/* ========================================================================== */
/* Figma dark theme sync — canonical type2 overrides                          */
/* ========================================================================== */

[data-theme="type2"] {
  /* Core */
  --background: #000000;
  --foreground: #ffffff;
  --primary: #2987fb;
  --primary-foreground: #ffffff;
  --primary-hover: #3a6de9;
  --primary-deep: #00286a;
  --primary-gradient: linear-gradient(
    138deg,
    #3a6de9 0%,
    #36e1ff 64%,
    #3a6de9 100%
  );
  --primary-gradient-from: #3a6de9;
  --primary-gradient-via: #36e1ff;
  --primary-gradient-to: #3a6de9;
  --primary-shadow: 0 0 12px color-mix(in srgb, var(--primary) 55%, transparent);
  --primary-inset-shadow: inset 0 -2px #3a6de9;
  --hero-cta-gradient: linear-gradient(0deg, #0090ff 0%, #0047bb 100%);
  --destructive: #b41f22;
  --destructive-foreground: #ffffff;
  --destructive-hover: #7f191f;
  --error: #b41f22;

  /* Existing aliases */
  --tenant-primary: #3a6de9;
  --tenant-primary-light: #36e1ff;
  --tenant-primary-dark: #3a6de9;
  --tenant-accent: #36e1ff;
  --tenant-accent-light: #36e1ff;
  --tenant-accent-dark: #3a6de9;

  /* Buttons — Figma node 1:1311 keeps both fill layers and both shadows */
  --button-primary-gradient:
    linear-gradient(138deg, #3a6de9 0%, #36e1ff 64%, #3a6de9 100%),
    linear-gradient(
      138deg,
      #b57e10 0%,
      #e5c25b 24%,
      #f9df7b 30%,
      #fff3a6 62%,
      #f9df7b 96%,
      #b57e10 100%
    );
  --button-primary-gradient-hover: linear-gradient(
    138deg,
    #36e1ff 0%,
    #3a6de9 64%,
    #36e1ff 100%
  );
  --button-primary-shadow:
    0 6px 10px rgba(0, 0, 0, 0.6),
    2px 3px 0 #004b8b;
  --button-primary-text: #000000;
  --button-secondary-bg: #2b3037;
  --button-secondary-bg-hover: #343a45;
  --button-secondary-border: #3d4a5d;
  --button-secondary-text: #ffffff;
  --button-glass-bg: rgba(255, 255, 255, 0.06);
  --button-glass-bg-hover: rgba(255, 255, 255, 0.1);
  --button-glass-border: rgba(255, 255, 255, 0.16);
  --button-glass-text: #ffffff;
  --button-outline-border: #3d4a5d;
  --button-outline-border-hover: #2987fb;
  --button-outline-text: #ffffff;
  --button-outline-bg-hover: rgba(41, 135, 251, 0.12);
  --button-text-color: #ffffff;
  --button-text-bg-hover: rgba(255, 255, 255, 0.08);

  /* Form and shared surfaces */
  --input-bg: #191c21;
  --input-border: #3d4a5d;
  --input-focus-border: #2987fb;
  --input-text: #ffffff;
  --input-placeholder: #bcc3d0;
  --input-disabled-bg: #222527;
  --input-disabled-text: #7c8697;
  --checkbox-bg: #222527;
  --checkbox-border: #3d4a5d;
  --checkbox-checked-bg: #2987fb;
  --checkbox-checked-border: #2987fb;
  --checkbox-checked-mark: #ffffff;
  --card-bg: #131313;
  --card-border: #363636;
  --card-muted: #7c8697;
  --muted-foreground: #7c8697;
  --border: #353535;
  --ring: #2987fb;
  --dialog-bg: #131313;
  --dialog-border: #363636;
  --dialog-text: #ffffff;
  --skeleton-bg: #2b3037;
  --warning: #fed50c;
  --warning-foreground: #000000;
  --surface: #131313;

  /* Auth dialogs — current type2 dark theme mapping */
  --auth-dialog-overlay: var(--mobile-sidebar-overlay); /* source: current type2 dark overlay */
  --auth-dialog-bg: var(--dialog-bg); /* source: current type2 dialog surface */
  --auth-dialog-border: var(--dialog-border); /* source: current type2 dialog stroke */
  --auth-dialog-shadow: var(--header-balance-dialog-shadow); /* source: current type2 BalanceDialog */
  --auth-dialog-radius: 8px; /* source: current type2 BalanceDialog radius */
  --auth-primary-bg: var(--button-primary-gradient); /* source: Figma type2 CTA / header 회원가입 */
  --auth-primary-bg-hover: var(--button-primary-gradient-hover); /* source: current type2 CTA hover */
  --auth-primary-text: var(--button-primary-text); /* source: current type2 CTA text */
  --auth-primary-shadow: var(--button-primary-shadow); /* source: current type2 CTA shadow */
  --auth-secondary-bg: var(--button-secondary-bg); /* source: current type2 secondary button */
  --auth-secondary-bg-hover: var(--button-secondary-bg-hover); /* source: current type2 secondary hover */
  --auth-secondary-border: var(--button-secondary-border); /* source: current type2 secondary stroke */
  --auth-secondary-text: var(--button-secondary-text); /* source: current type2 secondary text */
  --auth-input-bg: var(--input-bg); /* source: current type2 form surface */
  --login-dialog-shadow: var(--auth-dialog-shadow);
  --login-inquiry-btn-bg: var(--auth-secondary-bg);
  --signup-dialog-bg: var(--auth-dialog-bg);
  --signup-input-bg: var(--auth-input-bg);
  --signup-tab-active-bg: var(--primary);
  --signup-tab-inactive-text: var(--auth-secondary-text);
  --signup-muted-text: var(--text-secondary);
  --signup-action-gradient: var(--auth-primary-bg);
  --signup-dialog-shadow: var(--auth-dialog-shadow);

  /* Tables and date controls */
  --table-card-bg: #0f0f0f;
  --table-card-border: #353535;
  --table-card-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
  --table-header-bg: #2b3037;
  --table-header-text: #ffffff;
  --table-body-text: #ffffff;
  --table-muted-text: rgba(255, 255, 255, 0.5);
  --table-cell-separator: rgba(255, 255, 255, 0.2);
  --table-border: rgba(255, 255, 255, 0.1);
  --datepicker-bg: #191c21;
  --datepicker-border: #3d4a5d;
  --datepicker-text: #ffffff;
  --datepicker-label: #7c8697;

  /* Top menu — Figma node 1:197 */
  --topmenu-bg: #151515;
  --topmenu-text: #ffffff;
  --topmenu-time: #af71ff;
  --topmenu-time-text: #af71ff;
  --topmenu-deposit: #ffc66a;
  --topmenu-withdraw: #00a6ff;
  --topmenu-menu: #62ff91;
  --topmenu-level-bg: #e4e4e4;
  --topmenu-level-text: #8c8c8c;
  --topmenu-username: #f86aff;
  --topmenu-badge-bg: #ff1a1a;
  --topmenu-badge-text: #ffffff;
  --topmenu-logout: #6c6c6c;
  --topmenu-link-accent: #ffc66a;
  --topmenu-link-muted: #62ff91;
  --topmenu-user-name: #f86aff;
  --topmenu-icon-muted: #62ff91;
  --topmenu-avatar-bg: #2b3037;
  --topmenu-avatar-border: #3d4a5d;
  --topmenu-button-bg: rgba(255, 255, 255, 0.1);
  --topmenu-button-hover: rgba(255, 255, 255, 0.16);
  --topmenu-badge-shadow: 0 5px 5px rgba(0, 0, 0, 0.3);
  --topmenu-pill-bg: rgba(255, 255, 255, 0.1);
  --topmenu-pill-border: rgba(255, 255, 255, 0.16);
  --topmenu-pill-text: #ffffff;

  /* Header — Figma node 1:153 preserves all fill and stroke paint layers */
  --header-bg: #151515;
  --header-bg-md: #151515;
  --header-game-nav-bg: #151515;
  --header-nav-bg:
    linear-gradient(180deg, #000000 0%, #272727 100%),
    linear-gradient(180deg, #011638 0%, #002f7b 100%),
    #011638;
  --header-nav-border-gradient:
    linear-gradient(
      -51deg,
      #b57e10 9%,
      #be8c1f 15%,
      #b78113 21%,
      #f9df7b 34%,
      #a07718 39%,
      #a37a0c 51%,
      #f9df7b 53%,
      #f2d570 58%,
      #f9df7b 65%,
      #fff3a6 80%,
      #b57e10 89%,
      #e5c25b 91%,
      #f9df7b 100%,
      #c79b35 100%
    ),
    linear-gradient(90deg, #e3b06d 0%, #f2ff68 53%, #ffd38c 100%);
  --header-shadow: 0 0 40px rgba(0, 0, 0, 1);
  --content-shell-width: 1480px;
  --content-inner-width: 1440px;
  --desktop-sidebar-width: 280px; /* source: user-provided Figma reference, 560px @2x */
  --header-desktop-height: 150px;
  --header-game-nav-height: 100px;
  --header-game-nav-content-width: var(--content-shell-width);
  --header-game-nav-logo-width: 116px;
  --header-game-nav-logo-height: 65px;
  --header-game-nav-icon-size: 50px;
  --header-game-nav-gap: 40px;
  --header-game-nav-light-width: 55px;
  --header-game-nav-light-height: 7px;
  --header-game-nav-light-offset: -3px;
  --header-game-nav-light-top-duration: 4.5s;
  --header-game-nav-light-bottom-duration: 7.5s;
  --header-game-nav-light-bottom-delay: -3s;
  --header-game-nav-light-image: url("/cdn-proxy/assets/gnb/light-fx.png");
  --header-game-menu-animation-width: 95px;
  --header-game-menu-animation-height: 90px;
  --header-game-nav-icon-shadow: 0 4px 4px rgba(0, 0, 0, 0.5);
  --header-game-nav-text-shadow: 0 4px 4px rgba(0, 0, 0, 0.5);
  --header-notice-height: 50px;
  --header-authenticated-desktop-height: calc(
    var(--header-desktop-height) + var(--header-notice-height)
  );
  --header-notice-content-width: var(--content-shell-width);
  --header-notice-bg: var(--header-nav-bg);
  --header-notice-accent: var(--topmenu-link-accent);
  --header-notice-text: var(--topmenu-link-accent);
  --header-game-menu-width-general: 65px;
  --header-game-menu-width-casino: 50px;
  --header-game-menu-width-slot: 50px;
  --header-game-menu-width-sports: 50px;
  --header-game-menu-width-cross: 65px;
  --header-game-menu-width-special: 65px;
  --header-game-menu-width-realtime: 65px;
  --header-game-menu-width-esports: 50px;
  --header-game-menu-width-live-sports: 78px;
  --header-game-menu-width-mini: 52px;
  --header-game-menu-icon-general: url("/cdn-proxy/images/header/game-menu/tt-gaming-2b8d23.png");
  --header-game-menu-icon-casino: url("/cdn-proxy/images/header/game-menu/casino-21a95a.png");
  --header-game-menu-icon-slot: url("/cdn-proxy/images/header/game-menu/slot-45ac0f.png");
  --header-game-menu-icon-sports: url("/cdn-proxy/images/header/game-menu/sports-408368.png");
  --header-game-menu-icon-cross: url("/cdn-proxy/images/header/game-menu/cross-betting-6eb56f.png");
  --header-game-menu-icon-special: url("/cdn-proxy/images/header/game-menu/special-betting-22508d.png");
  --header-game-menu-icon-realtime: url("/cdn-proxy/images/header/game-menu/live-betting-77a4f6.png");
  --header-game-menu-icon-esports: url("/cdn-proxy/images/header/game-menu/esports-58d12d.png");
  --header-game-menu-icon-live-sports: url("/cdn-proxy/images/header/game-menu/live-sports-65f0ec.png");
  --header-game-menu-icon-mini: url("/cdn-proxy/images/header/game-menu/mini-game-1c868f.png");
  --header-border: #353535;
  --header-nav-border: #353535;
  --header-menu-general: #ffffff;
  --header-menu-casino: #ed7b5b;
  --header-menu-slot: #f04f8c;
  --header-menu-cross: #4b7dfd;
  --header-menu-special: #c16afd;
  --header-menu-realtime: #fcd10b;
  --header-menu-esports: #00cee8;
  --header-menu-sports: #48e798;
  --header-menu-live-sports: #ad71ec;
  --header-menu-mini: #e8b533;
  --header-mobile-button-bg: #2b3037;
  --header-mobile-button-border: #3d4a5d;
  --header-mobile-button-text: #ffffff;
  --header-glass-bg: rgba(21, 21, 21, 0.9);
  --header-glass-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
  --header-ellipse: radial-gradient(
    50% 140% at 50% 0%,
    rgba(54, 225, 255, 0.22) 0%,
    rgba(58, 109, 233, 0.12) 34%,
    rgba(58, 109, 233, 0) 74%
  );
  --header-overlay: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.06) 0%,
    rgba(255, 255, 255, 0) 68%
  );
  --header-balance-dialog-bg: #191c21;
  --header-balance-dialog-border: #3d4a5d;
  --header-balance-dialog-shadow: 0 0 50px rgba(0, 0, 0, 0.5);
  --header-balance-dialog-secondary-button-bg: #2b3037;

  /* Layout and navigation */
  --sidebar-bg: #131313;
  --sidebar-border: #363636;
  --sidebar-tab-bg: #0f0f0f;
  --sidebar-tab-hover: #2b3037;
  --sidebar-tab-hover-bg: #2b3037;
  --sidebar-tab-text: #ffffff;
  --sidebar-tab-muted: #7c8697;
  --desktop-sidebar-panel-bg: #000000; /* source: user-provided Figma reference pixel (40, 60) */
  --desktop-sidebar-row-bg: #121212; /* source: user-provided Figma reference pixel (80, 90) */
  --desktop-sidebar-primary-border: #00ffff; /* source: user-provided Figma reference border pixels */
  --desktop-sidebar-info-border: #b3ff7d; /* source: user-provided Figma reference border pixels */
  --desktop-sidebar-info-accent: #fae58f; /* source: user-provided Figma reference dominant text pixels */
  --desktop-sidebar-accent-profile: #08ff82; /* source: user-provided Figma reference row 1 pixels */
  --desktop-sidebar-accent-betting: #ffff00; /* source: user-provided Figma reference row 2 pixels */
  --desktop-sidebar-accent-deposit: #b67fff; /* source: user-provided Figma reference row 3 pixels */
  --desktop-sidebar-accent-withdraw: #ff3488; /* source: user-provided Figma reference row 4 pixels */
  --desktop-sidebar-accent-point: #ffc876; /* source: user-provided Figma reference row 5 pixels */
  --desktop-sidebar-accent-coupon: #0091ff; /* source: user-provided Figma reference row 6 pixels */
  --desktop-sidebar-panel-shadow: 0 10px 20px rgba(0, 0, 0, 0.45); /* source: user-provided Figma reference panel shadow */
  --mobile-sidebar-bg: #131313;
  --mobile-sidebar-border: #363636;
  --mobile-sidebar-overlay: rgba(0, 0, 0, 0.72);
  --mobile-sidebar-content-bg: #131313;
  --mobile-sidebar-logo-shadow: 4px 8px 10px rgba(0, 0, 0, 0.45);
  --mobile-sidebar-action-gradient: var(--primary-gradient);
  --mobile-sidebar-action-text: #ffffff;
  --mobile-sidebar-action-icon: rgba(255, 255, 255, 0.7);
  --mobile-sidebar-action-shadow: 0 4px 10px rgba(0, 0, 0, 0.35);
  --mobile-sidebar-game-bg: linear-gradient(135deg, #2b3037 0%, #191c21 100%);
  --mobile-sidebar-game-border: #3d4a5d;
  --mobile-sidebar-game-text: #ffffff;
  --mobile-sidebar-info-bg: #222527;
  --mobile-sidebar-info-text: #36e1ff;
  --mobile-sidebar-auth-actions-bg: #0f0f0f;
  --mobile-sidebar-auth-action-bg: #222527;
  --mobile-sidebar-auth-action-border: #3d4a5d;
  --mobile-sidebar-auth-action-text: #ffffff;
  --mobile-sidebar-auth-action-icon: #7c8697;
  --content-bg: #000000;
  --content-card-bg: #131313;
  --content-card-border: #363636;
  --content-section-bg: #131313;
  --content-border: #363636;
  --text-primary: #ffffff;
  --text-secondary: #7c8697;
  --text-accent: #2987fb;
  --text-danger: #b41f22;
  --pagination-bg: #191c21;
  --pagination-bg-hover: #2b3037;
  --pagination-border: #3d4a5d;
  --pagination-text: #ffffff;
  --pagination-active-bg: #2987fb;
  --pagination-active-text: #ffffff;
  --scrollbar-track: #191c21;
  --scrollbar-thumb: #7c8697;
  --scrollbar-thumb-hover: #2987fb;

  /* Subpages — source: Figma 1:3784, 1:4099, 1:4251, 1:4833 */
  --subpage-page-bg: #111419; /* source: Figma 1:3784 root fills */
  --subpage-surface: #191c21; /* source: Figma 1:4251 fills */
  --subpage-surface-raised: #2b3037; /* source: Figma 1:4100, 1:4535 fills */
  --subpage-surface-muted: #222527; /* source: Figma 1:5125 fills */
  --subpage-border: #323232; /* source: Figma 1:4251, 1:4833 strokes */
  --subpage-control-border: #3d4a5d; /* source: Figma 1:4099 strokes */
  --subpage-text: #ffffff; /* source: Figma 1:4101 fills */
  --subpage-text-secondary: #bcc3d0; /* source: Figma 1:4217 fills */
  --subpage-text-muted: #7c8697; /* source: Figma 1:4106 fills */
  --subpage-accent: #fed50c; /* source: Figma 1:5126~1:5163 fills */
  --subpage-positive: #2fffc7; /* source: Figma 1:4232 fills */
  --subpage-info: var(--odds-down); /* source: current type2 semantic token */
  --subpage-negative: var(--destructive); /* source: current type2 semantic token */
  --subpage-overlay: var(--mobile-sidebar-overlay); /* source: current type2 overlay token */
  --game-card-lock-overlay: rgba(0, 0, 0, 0.72); /* source: current type2 mobile sidebar overlay */
  --game-card-lock-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --game-card-hover-overlay: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.8),
    rgba(0, 0, 0, 0.5),
    transparent
  ); /* source: current type2 game thumbnail hover treatment */
  --game-card-favorite: var(--destructive); /* source: current type2 semantic favorite/status color */
  --game-stage-bg: #000000; /* source: embedded game viewport background */
  --qr-code-surface: #ffffff; /* source: QR contrast surface required for scanning */
  --status-success: var(--subpage-positive); /* source: Figma 1:4232 fills */
  --status-success-bg: color-mix(
    in srgb,
    var(--status-success) 12%,
    transparent
  ); /* source: current type2 semantic status tint */
  --status-success-border: color-mix(
    in srgb,
    var(--status-success) 28%,
    transparent
  ); /* source: current type2 semantic status tint */
  --status-danger: var(--subpage-negative); /* source: current type2 destructive token */
  --status-danger-bg: color-mix(
    in srgb,
    var(--status-danger) 12%,
    transparent
  ); /* source: current type2 semantic status tint */
  --status-danger-border: color-mix(
    in srgb,
    var(--status-danger) 28%,
    transparent
  ); /* source: current type2 semantic status tint */
  --status-warning: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --status-warning-bg: color-mix(
    in srgb,
    var(--status-warning) 12%,
    transparent
  ); /* source: current type2 semantic status tint */
  --status-warning-border: color-mix(
    in srgb,
    var(--status-warning) 28%,
    transparent
  ); /* source: current type2 semantic status tint */

  /* Shared subpage controls */
  --guideline-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --guideline-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --amount-row-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --amount-value-bg: var(--subpage-surface-raised); /* source: Figma 1:5157 field context */
  --amount-accent: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --amount-btn-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --amount-btn-border: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --pagination-item-bg: var(--subpage-surface); /* source: Figma 1:4099 inactive fills */
  --pagination-hover-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 active fills */
  --pagination-bg: var(--subpage-surface); /* source: Figma 1:4099 inactive fills */
  --pagination-bg-hover: var(--subpage-surface-raised); /* source: Figma 1:4100 active fills */
  --pagination-border: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --pagination-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --pagination-active-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --pagination-active-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --subpage-title-text: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --subpage-title-gradient: var(--button-primary-gradient); /* source: current type2 CTA token */
  --subpage-title-breadcrumb-text: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --subpage-title-breadcrumb-current: var(--subpage-positive); /* source: Figma 1:4232 fills */

  /* Finance */
  --deposit-form-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --deposit-form-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --deposit-form-account-alert: var(--subpage-negative); /* source: current type2 destructive token */
  --deposit-form-level-bg: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --deposit-form-level-text: var(--button-primary-text); /* source: current type2 on-accent text */
  --deposit-form-submit-bg: var(--button-primary-gradient); /* source: current type2 CTA token */
  --deposit-form-submit-text: var(--button-primary-text); /* source: current type2 CTA token */
  --withdraw-form-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --withdraw-form-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --withdraw-form-submit-bg: var(--button-primary-gradient); /* source: current type2 CTA token */
  --withdraw-form-submit-text: var(--button-primary-text); /* source: current type2 CTA token */
  --point-exchange-form-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --point-exchange-form-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --point-exchange-form-muted: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --point-exchange-form-submit-bg: var(--button-primary-gradient); /* source: current type2 CTA token */
  --point-exchange-form-submit-text: var(--button-primary-text); /* source: current type2 CTA token */
  --withdraw-rolling-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --withdraw-rolling-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --withdraw-rolling-muted: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --withdraw-rolling-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --withdraw-rolling-accent: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --withdraw-rolling-record-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --withdraw-rolling-scroll-track: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --withdraw-rolling-scroll-thumb: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */

  /* Notice and event */
  --notice-overlay: var(--subpage-overlay); /* source: current type2 overlay token */
  --notice-detail-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --notice-detail-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --notice-detail-card-shadow: var(--table-card-shadow); /* source: current type2 table token */
  --notice-detail-section-bg: var(--subpage-surface-raised); /* source: Figma 1:4535 fills */
  --notice-detail-field-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --notice-detail-heading-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --notice-detail-body-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --notice-detail-button-bg: var(--button-primary-gradient); /* source: current type2 CTA token */
  --notice-detail-button-text: var(--button-primary-text); /* source: current type2 CTA token */
  --event-tab-header-gradient: linear-gradient(
    90deg,
    transparent 0%,
    var(--subpage-control-border) 50%,
    transparent 100%
  ); /* source: Figma 1:4099 control stroke */
  --event-tab-bg: var(--subpage-surface); /* source: Figma 1:4099 inactive fills */
  --event-tab-active-border: var(--primary); /* source: current type2 primary token */
  --event-tab-active-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --event-tab-inactive-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --event-filter-active-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --event-filter-active-border: var(--primary); /* source: current type2 primary token */
  --event-filter-active-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --event-filter-inactive-bg: var(--subpage-surface); /* source: Figma 1:4099 fills */
  --event-filter-inactive-border: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --event-filter-inactive-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --event-dialog-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --event-dialog-border: var(--subpage-border); /* source: Figma 1:4251 strokes */

  /* Inquiry and messages */
  --inquiry-overlay: var(--subpage-overlay); /* source: current type2 overlay token */
  --inquiry-primary: var(--primary); /* source: current type2 primary token */
  --inquiry-primary-foreground: var(--button-primary-text); /* source: current type2 CTA token */
  --inquiry-muted: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --inquiry-border: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --inquiry-status-unanswered: var(--subpage-negative); /* source: current type2 destructive token */
  --inquiry-status-unanswered-bg: var(--status-danger-bg); /* source: current type2 semantic status tint */
  --inquiry-status-unanswered-glow: none; /* source: Figma 1:4251 effects absent */
  --inquiry-status-answered: var(--subpage-info); /* source: current type2 odds-down token */
  --inquiry-status-answered-bg: color-mix(
    in srgb,
    var(--subpage-info) 12%,
    transparent
  ); /* source: current type2 semantic status tint */
  --inquiry-status-answered-glow: none; /* source: Figma 1:4251 effects absent */
  --inquiry-status-confirmed: var(--subpage-positive); /* source: Figma 1:4232 fills */
  --inquiry-status-confirmed-bg: var(--status-success-bg); /* source: current type2 semantic status tint */
  --inquiry-status-confirmed-glow: none; /* source: Figma 1:4251 effects absent */
  --inquiry-list-status-answered: var(--subpage-info); /* source: current type2 odds-down token */
  --inquiry-list-status-unanswered: var(--subpage-negative); /* source: current type2 destructive token */
  --inquiry-list-status-confirmed: var(--subpage-positive); /* source: Figma 1:4232 fills */
  --inquiry-list-delete-bg: var(--subpage-negative); /* source: current type2 destructive token */
  --inquiry-list-delete-border: var(--subpage-negative); /* source: current type2 destructive token */
  --inquiry-create-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --inquiry-create-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --inquiry-create-card-shadow: var(--table-card-shadow); /* source: current type2 table token */
  --inquiry-create-row-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --inquiry-create-field-bg: var(--subpage-surface-raised); /* source: Figma 1:4535 fills */
  --inquiry-create-label: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --inquiry-create-placeholder: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --inquiry-create-muted: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --inquiry-create-accent: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --inquiry-create-add-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --inquiry-create-add-border: var(--primary); /* source: current type2 primary token */
  --inquiry-create-add-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --inquiry-attach-card-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --inquiry-attach-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --inquiry-attach-type-text: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --inquiry-attach-id-text: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --inquiry-attach-main-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --inquiry-attach-status-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --inquiry-attach-status-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --inquiry-attach-label-bg: color-mix(
    in srgb,
    var(--subpage-text) 12%,
    transparent
  ); /* source: current type2 semantic label tint */
  --inquiry-betting-dialog-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --inquiry-betting-dialog-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --inquiry-betting-dialog-shadow: var(--table-card-shadow); /* source: current type2 table token */
  --inquiry-betting-dialog-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --inquiry-betting-dialog-tab-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --inquiry-betting-dialog-tab-border: var(--primary); /* source: current type2 primary token */
  --inquiry-betting-dialog-tab-muted: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --inquiry-betting-dialog-date-active-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --inquiry-betting-dialog-date-active-border: var(--primary); /* source: current type2 primary token */
  --inquiry-betting-dialog-date-active-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --inquiry-betting-dialog-date-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --inquiry-betting-dialog-date-border: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --inquiry-betting-dialog-date-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --inquiry-betting-dialog-card-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --inquiry-betting-dialog-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --inquiry-betting-dialog-checkbox-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --inquiry-betting-dialog-selected-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --inquiry-betting-dialog-count-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --inquiry-betting-dialog-confirm-bg: var(--button-primary-gradient); /* source: current type2 CTA token */
  --message-overlay: var(--subpage-overlay); /* source: current type2 overlay token */
  --message-primary: var(--primary); /* source: current type2 primary token */
  --message-primary-foreground: var(--button-primary-text); /* source: current type2 CTA token */
  --message-border: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --message-status-read-text: var(--subpage-info); /* source: current type2 odds-down token */
  --message-status-unread-text: var(--subpage-negative); /* source: current type2 destructive token */
  --message-delete-btn-bg: var(--subpage-negative); /* source: current type2 destructive token */
  --message-delete-btn-border: var(--subpage-negative); /* source: current type2 destructive token */
  --message-detail-label-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */

  /* My page and attendance */
  --mypage-primary: var(--primary); /* source: current type2 primary token */
  --mypage-primary-foreground: var(--button-primary-text); /* source: current type2 CTA token */
  --mypage-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --mypage-section-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --mypage-identity-nickname: var(--subpage-text); /* source: Figma 1:4101 fills */
  --mypage-identity-userid: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --mypage-identity-level: var(--subpage-positive); /* source: Figma 1:4232 fills */
  --mypage-summary-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --mypage-summary-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --mypage-summary-title: var(--subpage-text); /* source: Figma 1:4101 fills */
  --mypage-summary-label: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --mypage-summary-value: var(--subpage-text); /* source: Figma 1:4101 fills */
  --mypage-summary-point-value: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --mypage-summary-divider: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --mypage-summary-action-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --mypage-summary-action-border: var(--primary); /* source: current type2 primary token */
  --mypage-summary-action-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --mypage-info-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --mypage-info-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --mypage-info-title: var(--subpage-text); /* source: Figma 1:4101 fills */
  --mypage-info-row-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --mypage-info-label: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --mypage-info-value: var(--subpage-text); /* source: Figma 1:4101 fills */
  --mypage-history-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --mypage-history-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --mypage-history-title: var(--subpage-text); /* source: Figma 1:4101 fills */
  --mypage-history-tab-active-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --mypage-history-tab-active-border: var(--primary); /* source: current type2 primary token */
  --mypage-history-tab-active-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --mypage-history-tab-inactive-bg: var(--subpage-surface); /* source: Figma 1:4099 fills */
  --mypage-history-tab-inactive-border: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --mypage-history-tab-inactive-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --mypage-history-header-bg: var(--subpage-surface-raised); /* source: Figma 1:4535 fills */
  --mypage-history-row-border: var(--table-border); /* source: current type2 table token */
  --mypage-history-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --attendance-calendar-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --attendance-calendar-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --attendance-calendar-title: var(--subpage-text); /* source: Figma 1:4101 fills */
  --attendance-calendar-weekday: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --attendance-calendar-day-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --attendance-calendar-day-muted: color-mix(
    in srgb,
    var(--subpage-text) 30%,
    transparent
  ); /* source: current type2 semantic muted tint */
  --attendance-calendar-icon-on: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --attendance-calendar-icon-off: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --attendance-info-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --attendance-info-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --attendance-info-muted: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --attendance-info-title: var(--subpage-text); /* source: Figma 1:4101 fills */
  --attendance-info-panel-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --attendance-info-accent: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --attendance-info-chevron-mark: var(--button-primary-text); /* source: current type2 on-accent text */

  /* Game lists and minigames */
  --games-filter-shell-bg: var(--subpage-surface); /* source: Figma 1:4099 fills */
  --games-filter-shell-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --games-filter-tab-active-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --games-filter-tab-active-border: var(--primary); /* source: current type2 primary token */
  --games-filter-tab-active-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --games-filter-tab-active-shadow: none; /* source: Figma 1:4100 effects absent */
  --games-filter-tab-bg: var(--subpage-surface); /* source: Figma 1:4099 fills */
  --games-filter-tab-border: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --games-filter-tab-hover-border: var(--primary); /* source: current type2 primary token */
  --games-filter-tab-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --games-filter-tab-shadow: none; /* source: Figma 1:4099 effects absent */
  --games-filter-input-bg: var(--subpage-surface-raised); /* source: Figma 1:4246 fills */
  --games-filter-input-border: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --games-filter-input-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --games-filter-input-placeholder: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --games-filter-input-icon: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --games-filter-input-shadow: none; /* source: Figma 1:4246 effects absent */
  --games-filter-input-focus-shadow: none; /* source: Figma 1:4246 effects absent */
  --minigame-brand-tabs-border-gradient: linear-gradient(
    90deg,
    transparent 0%,
    var(--subpage-control-border) 50%,
    transparent 100%
  ); /* source: Figma 1:4099 control stroke */
  --minigame-brand-tab-bg: var(--subpage-surface); /* source: Figma 1:4099 fills */
  --minigame-brand-tab-active-border: var(--primary); /* source: current type2 primary token */
  --minigame-brand-tab-active-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --minigame-brand-tab-inactive-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --minigame-subtab-active-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --minigame-subtab-active-border: var(--primary); /* source: current type2 primary token */
  --minigame-subtab-active-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --minigame-subtab-bg: var(--subpage-surface); /* source: Figma 1:4099 fills */
  --minigame-subtab-border: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --minigame-subtab-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --minigame-bet-history-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --minigame-bet-history-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --minigame-bet-history-card-shadow: var(--table-card-shadow); /* source: current type2 table token */
  --minigame-bet-history-title: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --minigame-bet-history-refresh-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --minigame-bet-history-refresh-border: var(--primary); /* source: current type2 primary token */
  --minigame-bet-history-refresh-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --minigame-bet-history-header-bg: var(--subpage-surface-raised); /* source: Figma 1:4535 fills */
  --minigame-bet-history-header-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --minigame-bet-history-cell-separator: var(--table-cell-separator); /* source: current type2 table token */
  --minigame-bet-history-row-border: var(--table-border); /* source: current type2 table token */
  --minigame-bet-history-row-muted: var(--table-muted-text); /* source: current type2 table token */
  --minigame-bet-history-row-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --minigame-bet-history-win-text: var(--subpage-info); /* source: current type2 odds-down token */
  --minigame-bet-history-lose-text: var(--subpage-negative); /* source: current type2 destructive token */
  --minigame-cart-option-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --minigame-cart-badge-player-bg: color-mix(
    in srgb,
    var(--subpage-info) 12%,
    transparent
  ); /* source: current type2 semantic status tint */
  --minigame-cart-badge-player-border: var(--subpage-info); /* source: current type2 odds-down token */
  --minigame-cart-badge-player-text: var(--subpage-info); /* source: current type2 odds-down token */
  --minigame-cart-badge-banker-bg: var(--status-danger-bg); /* source: current type2 semantic status tint */
  --minigame-cart-badge-banker-border: var(--subpage-negative); /* source: current type2 destructive token */
  --minigame-cart-badge-banker-text: var(--subpage-negative); /* source: current type2 destructive token */
  --minigame-cart-badge-tie-bg: var(--status-success-bg); /* source: current type2 semantic status tint */
  --minigame-cart-badge-tie-border: var(--subpage-positive); /* source: Figma 1:4232 fills */
  --minigame-cart-badge-tie-text: var(--subpage-positive); /* source: Figma 1:4232 fills */

  /* Coupon and betting history */
  --coupon-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --coupon-bg-disabled: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --coupon-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --coupon-badge-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --coupon-accent: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --coupon-color-all: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --coupon-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --coupon-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --coupon-avail-label: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --coupon-avail-count: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --coupon-register-bg: var(--button-primary-gradient); /* source: current type2 CTA token */
  --coupon-register-border: var(--primary); /* source: current type2 primary token */
  --coupon-expiry-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --coupon-expiry-time: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --coupon-btn-action: var(--button-primary-text); /* source: current type2 on-accent text */
  --bet-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --bet-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --bet-ticket-number: var(--subpage-accent); /* source: Figma 1:5126~1:5163 fills */
  --bet-status-hit: var(--subpage-info); /* source: current type2 odds-down token */
  --bet-status-miss: var(--subpage-negative); /* source: current type2 destructive token */
  --bet-table-header-bg: var(--subpage-surface-raised); /* source: Figma 1:4535 fills */
  --bet-match-badge-bg: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --bet-match-badge-text: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --bet-summary-bar-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --bet-summary-badge-bg: color-mix(
    in srgb,
    var(--subpage-text) 12%,
    transparent
  ); /* source: current type2 semantic label tint */
  --bet-type-pre: var(--subpage-positive); /* source: Figma 1:4232 fills */
  --bet-timestamp: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --bet-cell-border: var(--table-cell-separator); /* source: current type2 table token */
  --bet-row-border: var(--table-border); /* source: current type2 table token */
  --bet-delete-btn-bg: var(--subpage-negative); /* source: current type2 destructive token */
  --bet-delete-btn-border: var(--subpage-negative); /* source: current type2 destructive token */
  --bet-blue: var(--subpage-info); /* source: current type2 odds-down token */
  --bet-red: var(--subpage-negative); /* source: current type2 destructive token */

  /* Main page */
  --main-hero-bg: #04174d;
  --main-hero-border: #343a45;
  --main-hero-eyebrow: #ffb260;
  --main-hero-title: #ffffff;
  --main-hero-text: #ffffff;
  --main-hero-text-shadow: 0 0 10px rgba(0, 0, 0, 1);
  --landing-hover-default-accent: var(--primary-gradient-via); /* source: current type2 primary gradient token */
  --landing-event-media-filter: brightness(1.12) saturate(1.25) contrast(1.04); /* source: user-defined warm event hover treatment */
  --landing-notice-media-filter: brightness(1.08) saturate(1.12) contrast(1.08); /* source: user-defined crisp notice hover treatment */
  --landing-sports-media-filter: brightness(1.08) saturate(1.14); /* source: user-defined neon sports hover treatment */
  --landing-quick-media-filter: brightness(1.12) saturate(1.18) contrast(1.06); /* source: user-defined vivid quick-link hover treatment */
  --landing-hover-odds-filter: brightness(1.15) saturate(1.12); /* source: client-requested vivid odds emphasis */
  --landing-hover-action-filter: brightness(1.2) saturate(1.12); /* source: client-requested vivid action emphasis */
  --landing-active-action-filter: brightness(0.94); /* source: user-approved press feedback without scaling */
  --landing-hover-teams-bg: color-mix(
    in srgb,
    var(--market-card-teams-bg) 88%,
    var(--landing-card-accent) 12%
  ); /* source: current type2 market surface + section accent */
  --main-hero-side-gradient: linear-gradient(
    270deg,
    rgba(166, 255, 119, 0.59),
    rgba(166, 255, 119, 0)
  );
  --main-hero-bottom-gradient: linear-gradient(
    0deg,
    rgba(0, 0, 0, 1),
    rgba(0, 0, 0, 0)
  );
  --main-quickmenu-bg: #131313;
  --main-quickmenu-gradient-from: #2b3037;
  --main-quickmenu-gradient-via: #191c21;
  --main-quickmenu-gradient-to: #0f0f0f;
  --main-quickmenu-gradient: linear-gradient(
    180deg,
    #2b3037 0%,
    #191c21 52%,
    #0f0f0f 100%
  );
  --main-game-card-bg: #0f0f0f;
  --main-game-card-border: #353535;
  --main-game-overlay-from: rgba(0, 0, 0, 0);
  --main-game-overlay-to: rgba(0, 0, 0, 0.72);
  --main-game-title-shadow: 0 4px 4px rgba(0, 0, 0, 0.5);
  --main-game-card-overlay: rgba(0, 0, 0, 0.72);
  --main-provider-bg: #131313;
  --popup-card-bg: #131313;
  --main-surface-1: #131313;
  --main-surface-2: #0f0f0f;
  --main-surface-3: #353535;
  --main-surface-4: #000000;
  --glass-bg: rgba(255, 255, 255, 0.048);
  --glass-border: rgba(255, 255, 255, 0.1);
  --main-carousel-card-bg: linear-gradient(180deg, #131313 0%, #0f0f0f 100%);
  --main-carousel-overlay: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.1) 0%,
    rgba(0, 0, 0, 0.4) 50%,
    rgba(0, 0, 0, 0.8) 100%
  );
  --main-casino-title: #ffffff;
  --main-casino-action-bg: #2b3037;
  --main-casino-action-text: #bcc3d0;
  --main-casino-card-border: #353535;
  --main-casino-active-border: #2987fb;
  --main-casino-active-shadow: 0 0 12px rgba(41, 135, 251, 0.35);
  --main-casino-active-text: #36e1ff;
  --main-slot-title: #ffffff;
  --main-slot-action-bg: #2b3037;
  --main-slot-action-text: #bcc3d0;
  --main-slot-card-border: #353535;
  --main-glass-bg: rgba(255, 255, 255, 0.048);
  --main-glass-border: rgba(255, 255, 255, 0.1);
  --market-card-bg: #0f0f0f;
  --market-card-border: #353535;
  --market-card-header-bg: rgba(0, 0, 0, 0.5);
  --market-card-title: #ffffff;
  --market-card-label: #afafaf;
  --market-card-versus: #6b6b6b;
  --market-card-live-bg: #4b1316;
  --market-card-live-border: #7f191f;
  --market-card-live-dot: #ae2128;
  --market-card-live-text: #f96164;
  --market-card-date: #a7ff8c;
  --market-card-home-bg: #283f3f;
  --market-card-home-odds: #00ffff;
  --market-card-draw-bg: #3f3f3f;
  --market-card-draw-odds: #c4c6cc;
  --market-card-away-bg: #4a4026;
  --market-card-away-odds: #ffba08;
  --market-card-teams-bg: rgba(255, 255, 255, 0.08); /* source: Figma 1:296 Match Teams fill */
  --market-card-team-logo-bg: #040404; /* source: Figma 1:296 Team Logo fill */
  --market-card-league-logo-bg: #ffffff; /* source: Figma 1:296 league_logo fill */
  --quick-links-width: 1400px; /* source: Figma 1:566/1:596 designedWidth */
  --quick-link-bg: #131313; /* source: Figma EL-7f938d44 fills */
  --quick-link-title: #7c8697; /* source: Figma fill_224a9c9a */
  --quick-link-title-tracking: 0em; /* source: Figma 1:592/1:604/1:614/1:623 text styles */
  --quick-link-subtext: #7c8697; /* source: Figma fill_224a9c9a */
  --quick-link-subtitle-tracking: 0em; /* source: Figma 1:593/1:605/1:615/1:624 text styles */
  --quick-link-action: #0091ff; /* source: Figma fill_a2477815 */
  --quick-link-icon-bg: #111f2a; /* source: Figma 1:620 fills */
  --quick-link-icon-border: #0091ff; /* source: Figma 1:620 strokes */
  --quick-link-icon-border-width: 1px; /* source: Figma 1:620 strokeWeight */
  --quick-link-icon-glow: none; /* source: Figma 1:620 effects 없음 */

  /* Betting cart and option panels */
  --betting-button-bg: #24272e;
  --betting-button-hover: #343a45;
  --betting-button-bg-hover: #343a45;
  --betting-button-highlight: #ffd171;
  --betting-button-label: #9ca1c2;
  --betting-text-highlight: #ffd171;
  --betting-text-label: #9ca1c2;
  --betting-cart-bg: #131313;
  --betting-cart-border: #363636;
  --betting-cart-shadow: 0 10px 30px rgba(0, 0, 0, 0.55);
  --betting-cart-title: #ffffff;
  --betting-cart-muted: #9a9aa7;
  --betting-cart-badge-bg: #343a45;
  --betting-cart-badge-border: #3d4a5d;
  --betting-cart-badge-text: #ffffff;
  --betting-cart-match-text: #ffffff;
  --betting-cart-vs-text: #7c8697;
  --betting-cart-market-text: #36e1ff;
  --betting-cart-team-text: #ffffff;
  --betting-cart-market: #36e1ff;
  --betting-cart-team: #ffffff;
  --betting-cart-warning-bg: #24272e;
  --betting-cart-warning-border: #3d4a5d;
  --betting-cart-warning-text: #ffffff;
  --betting-cart-warning-chip-bg: #fed50c;
  --betting-cart-odds-old: #7c8697;
  --betting-cart-odds-up-bg: #b41f22;
  --betting-cart-odds-down-bg: #1287e7;
  --betting-cart-amount-bg: #000000; /* source: Figma 1:779 배팅금액 박스 fill */
  --betting-cart-amount-input-bg: #24272e; /* source: Figma 1:779 betAmount fill */
  --betting-cart-amount-input-icon: #626874; /* source: Figma 1:779 refresh icon stroke */
  --betting-cart-empty-border: #343a45; /* source: Figma 1:779 Bet Slip Container stroke */
  --betting-cart-amount-button-bg: linear-gradient(180deg, #4b4b4b, #2d2d2d);
  --betting-cart-amount-border: #3d4a5d;
  --betting-cart-amount-text: #fbe686;
  --betting-cart-amount-button-border: #000000; /* source: Figma 1:779 preset Button stroke */
  --betting-cart-amount-button-text: #fbe686;
  --betting-cart-submit-bg:
    linear-gradient(138deg, #3a6de9 0%, #36e1ff 52%, #3a6de9 100%),
    linear-gradient(
      138deg,
      #b57e10 0%,
      #e5c25b 22%,
      #f9df7b 26%,
      #fff3a6 50%,
      #f9df7b 76%,
      #b57e10 92%
    ); /* source: Figma 1:779 GOLD BUTTON fills 2-layer, handles (-0.04,0)→(1.09,1.26)≈138deg */
  --betting-cart-submit-text: #000000;
  --betting-cart-value: #ffc92f;
  --betting-cart-value-text: #ffc92f;
  --options-header-bg: #2b3037;
  --options-header-text: #ffffff;
  --options-tab-bg: #191c21;
  --options-tab-text: #bcc3d0;
  --options-tab-active-bg: #222527;
  --options-tab-active-text: #ffffff;
  --options-tab-active-border: #2987fb;
  --options-selection-bg: #222527;
  --options-selection-border: #3d4a5d;
  --options-selection-active-bg: #2987fb;
  --options-selection-active-text: #ffffff;
  --options-section-title: #2fffc7;
  --options-panel-header-bg: #2b3037;
  --options-panel-header-shadow: 0 0 12px rgba(0, 0, 0, 0.35);
  --options-header-badge-bg: #343a45;
  --options-header-badge-text: #ffffff;
  --options-header-divider: rgba(255, 255, 255, 0.1);
  --options-header-competition: #fed50c;
  --options-tab-inactive-border: #3d4a5d;
  --options-tab-active-gradient: var(--primary-gradient);
  --options-selection-active-border: #2987fb;
  --options-selection-team: #ffffff;
  --options-selection-price-home: #00d5be;
  --options-selection-price-draw: #05df72;
  --options-selection-price-away: #c27aff;
  --handicap-positive: #b41f22;
  --handicap-negative: #1287e7;
  --options-match-vs: #7c8697;
  --options-match-time: rgba(255, 255, 255, 0.5);
  --options-header-glow: radial-gradient(
    ellipse 100% 80% at 50% 0%,
    rgba(54, 225, 255, 0.18) 0%,
    rgba(58, 109, 233, 0.08) 40%,
    rgba(58, 109, 233, 0) 100%
  );

  /* Sports — Figma node 1:911 */
  --sports-bg: #191c21;
  --sports-surface: #2b3037;
  --sports-surface-raised: #2b3037;
  --sports-card-bg: #222527;
  --sports-card-border: #323232;
  --sports-control-border: #3d4a5d;
  --sports-text: #ffffff;
  --sports-muted: #7c8697;
  --sports-placeholder: #bcc3d0;
  --sports-active: #2fffc7;
  --sports-league-accent: #fed50c;
  --sports-market-tab: #a2afc5;
  --sports-selected: #2987fb;
  --sports-odds-up: #b41f22;
  --sports-odds-down: #1287e7;
  --sports-score-panel-badge-bg: rgba(41, 135, 251, 0.3);
  --sports-score-panel-chip-bg: rgba(25, 28, 33, 0.72);
  --sports-score-panel-indicator-active: #2987fb;
  --odds-up: #b41f22;
  --odds-down: #1287e7;
  --odds-neutral: #7c8697;
  --odds-indicator-down: #1287e7;
  --odds-indicator-icon: #ffffff;

  /* Sports component aliases retain the existing variable API */
  --sport-tab-container-bg: #2b3037;
  --sport-tab-container-border: #323232;
  --sport-tab-bg: #222527;
  --sport-tab-all-border: #3d4a5d;
  --sport-tab-count: #7c8697;
  --sport-tab-label: #ffffff;
  --sport-tab-active-border: #2987fb;
  --sport-tab-active-text: #2fffc7;
  --sport-tab-active-shadow:
    0 0 10px rgba(41, 135, 251, 0.35),
    inset 0 0 20px rgba(41, 135, 251, 0.15);
  --filter-v2-sort-active: #2fffc7;
  --filter-v2-sort-inactive: #bcc3d0; /* source: Figma 1:1442 비활성 정렬 텍스트/아이콘 fill */
  --filter-v2-search-bg: #2b3037; /* source: Figma 1:1442 search-bar fill */
  --filter-v2-search-border: #3d4a5d;
  --filter-v2-search-placeholder: #bcc3d0;
  --sports-filter-select-bg: #2b3037; /* source: Figma 1:1442 Dropdown Container fill */
  --sports-filter-select-text: #bcc3d0; /* source: Figma 1:1442 드롭다운 텍스트/셰브론 fill */
  --sport-tab-v2-wrap-bg: #2b3037;
  --sport-tab-v2-label: #bcc3d0;
  --sport-tab-v2-count: #7c8697;
  --sport-tab-v2-active-text: #ffffff;
  --sport-tab-v2-active-bg: #2987fb;
  --sport-tab-v2-active-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  --sport-tab-bar-bottom-border: var(--primary-gradient);
  --sport-tab-bar-btn-bg: #222527;
  --sport-tab-bar-active-border: #2987fb;
  --sport-tab-bar-text: #a2afc5;
  --sport-tab-bar-active-text: #2fffc7;
  /* Sports nav segment bar — source: Figma 1:1326 */
  --sports-nav-tab-bg: #191c21; /* source: Figma 1:1326 비활성 Button fill */
  --sports-nav-tab-active-bg: #2b3037; /* source: Figma 1:1326 전체(활성) Button fill */
  --sports-nav-tab-border: #3d4a5d; /* source: Figma 1:1326 Button 우측 stroke */
  --sports-nav-tab-text: #ffffff; /* source: Figma 1:1326 label/icon fill */
  --sports-nav-tab-count: #7c8697; /* source: Figma 1:1326 Item count fill */
  --sports-nav-tab-muted-text: #bcc3d0; /* source: Figma 1:1351 리그탭 비활성/초기화 텍스트·아이콘 fill */
  --league-tab-btn-bg: #222527;
  --league-tab-btn-border: #3d4a5d;
  --league-tab-active-bg: #2987fb;
  --league-tab-active-border: #2987fb;
  --league-tab-active-text: #ffffff;
  --sport-group-bg: #2b3037;
  --sport-group-bg-from: #2b3037;
  --sport-group-bg-to: #191c21;
  --sport-group-border-from: #3a6de9;
  --sport-group-border-via: #36e1ff;
  --sport-group-border-to: #3a6de9;
  --sport-group-shadow: 0 4px 0 rgba(0, 0, 0, 0.2);
  --sport-group-country: #ffffff;
  --sport-group-league: #fed50c;
  --sport-group-separator: #7c8697;
  --sport-group-badge-bg: #222527;
  --sport-group-badge-text: #ffffff;
  --sports-list-toolbar-active: #ffffff;
  --sports-list-toolbar-inactive: #7c8697;
  --sports-list-toolbar-accent: #2fffc7;
  --sports-list-outer-bg: #191c21;
  --sports-list-outer-border: #323232;
  --sports-list-shell-bg: #191c21;
  --sports-list-shell-shadow: 0 0 10px rgba(0, 0, 0, 0.35);
  --sports-asian-group-bg: #2b3037;
  --sports-asian-group-text: #ffffff;
  --sports-asian-group-meta: #7c8697;
  --sports-asian-row-bg: #191c21;
  --sports-asian-row-divider: #323232;
  --sports-asian-team-text: #ffffff;
  --sports-asian-center-text: #bcc3d0;
  --sports-asian-handicap-indicator: #2fffc7;
  --sports-list-group-bg: #2b3037;
  --sports-list-group-border: #323232;
  --sports-list-group-ellipse: none;
  --sports-list-group-label: #ffffff;
  --sports-market-header-bg: #2b3037;
  --sports-market-header-border: #323232;
  --sports-market-header-text: #fed50c;
  --sports-market-header-icon: #ffffff; /* source: Figma 1:1482 종목 아이콘 fill */
  --sports-cross-market-time-text: #7c8697;
  --sports-cross-market-cell-bg: #222527;
  --sports-cross-market-cell-border: transparent; /* source: Figma 1:1491 버튼 strokes 없음 — 보더 색만 투명화(레이아웃 불변) */
  --sports-cross-market-odds-text: #7c8697; /* source: Figma 1:1491 비활성 배당 텍스트 fill */
  --sports-cross-market-team-text: #ffffff;
  --sports-cross-market-active-bg: #2987fb;
  --sports-cross-market-active-border: #2987fb;
  --sports-cross-market-active-text: #ffffff;
  --sports-cross-market-bet-bg: #222527;
  --sports-list-row-divider: transparent; /* source: Figma 1:1491 행 구분선 strokes 없음 (간격은 기존 패딩 유지) */
  --sports-list-row-meta: #7c8697;
  --sports-list-row-cell-bg: #222527;
  --sports-list-row-cell-active-border: #2987fb;
  --sports-list-row-cell-active-bg: #2987fb;
  --sports-list-row-more-bg: #2b3037;
  --sports-list-row-icon-bg: #2b3037;
  --sports-list-row-icon-text: #ffffff;
  --sports-live-period-text: #2fffc7;
  --sports-live-score: #ffffff;
  --sports-live-score-diff: #fed50c;
  --sports-live-score-gradient: var(--primary-gradient);
  --sports-live-score-vs: #7c8697;
  --sports-live-market-cell-bg: #222527;
  --sports-live-odds-home: #00d5be;
  --sports-live-odds-draw: #05df72;
  --sports-live-odds-away: #c27aff;
  --sports-live-more-active-bg: #2b3037;
  --sports-lock-overlay-bg: linear-gradient(
    180deg,
    rgba(25, 28, 33, 0.55) 0%,
    rgba(15, 15, 15, 0.95) 100%
  );
  --sports-lock-overlay-border: rgba(61, 74, 93, 0.5);
  --sports-lock-icon-bg: #fed50c;
  --sports-lock-icon-fg: #000000;
  --sports-lock-hidden-pattern: repeating-linear-gradient(
    135deg,
    transparent,
    transparent 4px,
    rgba(124, 134, 151, 0.35) 4px,
    rgba(124, 134, 151, 0.35) 6px
  );
  --sports-live-indicator-bg: #2987fb;
  --sports-live-badge-bg: rgba(41, 135, 251, 0.15);
  --sports-live-badge-text: #36e1ff;
  --sports-market-active-muted-text: rgba(255, 255, 255, 0.8);
  --sports-scroll-control-border: #fed50c;
  --sports-scroll-control-bg: #191c21;
  --sports-scroll-control-text: #fed50c;
  --sports-scroll-control-shadow: 0 0 10px rgba(254, 213, 12, 0.25);
  --sports-scroll-control-hover-bg: #fed50c;
  --sports-scroll-control-hover-text: #000000;
  --sports-scroll-control-hover-shadow: 0 0 14px rgba(254, 213, 12, 0.4);
  --sports-modal-overlay-bg: rgba(0, 0, 0, 0.72);
  --sports-market-overlay-soft-bg: rgba(0, 0, 0, 0.35);
  --sports-market-overlay-strong-bg: rgba(0, 0, 0, 0.82);
  --sports-selection-label: #bcc3d0;
  --sports-asian-odds: #ffffff;
  --sidebar-badge-bg: #2b3037;
  --icon-user-online: #2fffc7;
}

/* Subpage theme scope — source: Figma 1:3784, 1:4251 */
[data-theme="type2"] .subpage-theme {
  --radius: 5px; /* source: Figma 1:4251, 1:4833 borderRadius */
  --background: var(--subpage-page-bg); /* source: Figma 1:3784 root fills */
  --foreground: var(--subpage-text); /* source: Figma 1:4101 fills */
  --card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --muted: var(--subpage-surface-raised); /* source: Figma 1:4100 fills */
  --border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --content-bg: var(--subpage-page-bg); /* source: Figma 1:3784 root fills */
  --content-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --content-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --content-section-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --content-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --input-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --input-border: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --input-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --input-placeholder: var(--subpage-text-secondary); /* source: Figma 1:4217 fills */
  --checkbox-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --checkbox-border: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --dialog-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --dialog-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --dialog-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --table-card-bg: var(--subpage-surface); /* source: Figma 1:4251 fills */
  --table-card-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --table-header-bg: var(--subpage-surface-raised); /* source: Figma 1:4535 fills */
  --table-header-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --table-body-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --table-muted-text: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --table-border: var(--subpage-border); /* source: Figma 1:4251 strokes */
  --datepicker-bg: var(--subpage-surface-muted); /* source: Figma 1:5125 fills */
  --datepicker-border: var(--subpage-control-border); /* source: Figma 1:4099 strokes */
  --datepicker-text: var(--subpage-text); /* source: Figma 1:4101 fills */
  --datepicker-label: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --skeleton-bg: var(--subpage-surface-raised); /* source: Figma 1:4535 fills */
  --text-primary: var(--subpage-text); /* source: Figma 1:4101 fills */
  --text-secondary: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  --muted-foreground: var(--subpage-text-muted); /* source: Figma 1:4106 fills */
  min-width: 0;
  background: var(--subpage-page-bg); /* source: Figma 1:3784 root fills */
  color: var(--subpage-text); /* source: Figma 1:4101 fills */
}

/* Auth dialogs and entry actions — current type2 dark theme */
[data-theme="type2"] .auth-dialog-overlay {
  background: var(--auth-dialog-overlay);
  backdrop-filter: blur(2px);
}

[data-theme="type2"] .auth-dialog-shell {
  border: 1px solid var(--auth-dialog-border);
  border-radius: var(--auth-dialog-radius);
  background: var(--auth-dialog-bg);
  box-shadow: var(--auth-dialog-shadow);
}

[data-theme="type2"] .auth-primary-action {
  border-color: transparent;
  border-radius: var(--auth-dialog-radius);
  background-color: transparent;
  background-image: var(--auth-primary-bg);
  box-shadow: var(--auth-primary-shadow);
  color: var(--auth-primary-text);
}

[data-theme="type2"] .auth-primary-action:hover {
  background-image: var(--auth-primary-bg-hover);
}

[data-theme="type2"] .auth-secondary-action {
  border: 1px solid var(--auth-secondary-border);
  border-radius: var(--auth-dialog-radius);
  background: var(--auth-secondary-bg);
  color: var(--auth-secondary-text);
}

[data-theme="type2"] .auth-secondary-action:hover {
  background: var(--auth-secondary-bg-hover);
}

[data-theme="type2"] .auth-tab-active {
  border-color: transparent;
  background-color: transparent;
  background-image: var(--auth-primary-bg);
  color: var(--auth-primary-text);
}

[data-theme="type2"] .auth-tab-inactive {
  border-color: var(--auth-secondary-border);
  background: var(--auth-secondary-bg);
  color: var(--auth-secondary-text);
}

[data-theme="type2"] .auth-tab-inactive:hover {
  background: var(--auth-secondary-bg-hover);
}

/* Popup and dialog actions — current type2 dark theme */
[data-theme="type2"] .popup-campaign-overlay {
  background: var(--auth-dialog-overlay) !important; /* source: current type2 auth overlay token */
  backdrop-filter: blur(2px); /* source: existing auth-dialog-overlay */
}

[data-theme="type2"] .popup-campaign-card {
  position: relative;
  isolation: isolate;
  border: 2px solid var(--primary) !important; /* source: existing Type2PopupDialog intended card stroke */
  border-radius: 12px !important; /* source: existing Type2PopupDialog intended card radius */
  background: var(--popup-card-bg) !important; /* source: current type2 popup surface token */
  box-shadow: var(--primary-shadow); /* source: current type2 primary shadow token */
}

[data-theme="type2"] .popup-campaign-artwork {
  width: 100% !important;
  max-width: 100%;
  height: 100% !important;
  margin: 0;
  transform: scale(1.04); /* source: supplied screenshot; 300px card × 4% / 2 = 6px crop per horizontal edge */
  transform-origin: center;
}

[data-theme="type2"] .popup-campaign-scroll-area {
  scrollbar-width: none; /* source: runtime mobile verification; popup artwork has no visible scrollbar */
}

[data-theme="type2"] .popup-campaign-scroll-area::-webkit-scrollbar {
  display: none; /* source: runtime mobile verification; popup artwork has no visible scrollbar */
}

[data-theme="type2"] .popup-campaign-hide-check {
  border-color: var(--primary) !important; /* source: current type2 primary token */
}

[data-theme="type2"] .theme-dialog-primary-action {
  border-color: transparent !important;
  border-radius: var(--auth-dialog-radius) !important; /* source: current type2 auth action radius */
  background-color: transparent !important;
  background-image: var(--button-primary-gradient) !important; /* source: Figma-based current type2 CTA token */
  box-shadow: var(--button-primary-shadow); /* source: Figma-based current type2 CTA token */
  color: var(--button-primary-text) !important; /* source: Figma-based current type2 CTA token */
}

[data-theme="type2"] .theme-dialog-primary-action:hover {
  background-image: var(--button-primary-gradient-hover) !important; /* source: current type2 CTA hover token */
}

/* 랜딩 하단 QuickLinks — source: Figma 1:566, 1:596 */
[data-theme="type2"] .quick-link-icon {
  border-width: var(--quick-link-icon-border-width);
  border-style: solid;
  border-color: var(--quick-link-icon-border);
  background: var(--quick-link-icon-bg);
  box-shadow: var(--quick-link-icon-glow);
}

[data-theme="type2"] .quick-link-title {
  color: var(--quick-link-title);
  letter-spacing: var(--quick-link-title-tracking);
}

[data-theme="type2"] .quick-link-subtitle {
  color: var(--quick-link-subtext);
  letter-spacing: var(--quick-link-subtitle-tracking);
}

[data-theme="type2"] .quick-link-action {
  color: var(--quick-link-action);
}

[data-theme="type2"] .quick-link-card:nth-child(1) {
  --quick-link-title: #ffffff; /* source: Figma 1:573 fills */
  --quick-link-title-tracking: -0.04em; /* source: Figma style_aaa140b5 */
  --quick-link-subtitle-tracking: -0.04em; /* source: Figma style_c1b9e5dc */
  --quick-link-action: #62ff91; /* source: Figma 1:576 fills */
  --quick-link-icon-bg: #ffffff; /* source: Figma 1:569 fills */
  --quick-link-icon-border: transparent; /* source: Figma 1:569 strokes 없음 */
  --quick-link-icon-border-width: 0px; /* source: Figma 1:569 strokes 없음 */
  --quick-link-icon-glow: 0 0 20px rgba(156, 106, 255, 1); /* source: Figma 1:569 effect */
}

[data-theme="type2"] .quick-link-card:nth-child(2) {
  --quick-link-title-tracking: -0.04em; /* source: Figma style_aaa140b5 */
  --quick-link-subtitle-tracking: -0.04em; /* source: Figma style_c1b9e5dc */
  --quick-link-action: #ffff00; /* source: Figma 1:586 fills */
  --quick-link-icon-bg: #2a2a11; /* source: Figma 1:579 fills */
  --quick-link-icon-border: #ffff00; /* source: Figma 1:579 strokes */
}

[data-theme="type2"] .quick-link-card:nth-child(3) {
  --quick-link-action: #b67fff; /* source: Figma 1:595 fills */
  --quick-link-icon-bg: #231d2a; /* source: Figma 1:589 fills */
  --quick-link-icon-border: #b67fff; /* source: Figma 1:589 strokes */
}

[data-theme="type2"] .quick-link-card:nth-child(4) {
  --quick-link-action: #ff3488; /* source: Figma 1:607 fills */
  --quick-link-icon-bg: #2a161e; /* source: Figma 1:599 fills */
  --quick-link-icon-border: #ff3488; /* source: Figma 1:599 strokes */
}

[data-theme="type2"] .quick-link-card:nth-child(5) {
  --quick-link-action: #ffc876; /* source: Figma 1:617 fills */
  --quick-link-icon-bg: #2a251d; /* source: Figma 1:610 fills */
  --quick-link-icon-border: #ffc876; /* source: Figma 1:610 strokes */
}

[data-theme="type2"] .quick-link-card:nth-child(6) {
  --quick-link-action: #0091ff; /* source: Figma 1:626 fills */
  --quick-link-icon-bg: #111f2a; /* source: Figma 1:620 fills */
  --quick-link-icon-border: #0091ff; /* source: Figma 1:620 strokes */
}

[data-theme="type2"] .sports-live-row .sports-live-score-text {
  background-image: var(--sports-live-score-gradient);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}

/* 라이브 스포츠 섹션 타이틀 — 그라디언트 텍스트 (폴백: 흰색 하단 fill 보존) */
[data-theme="type2"] .main-livesports-title {
  color: var(--main-livesports-title-fallback); /* source: Figma 1:282 title bottom fill */
  background-image: var(--main-livesports-title-gradient); /* source: Figma 1:282 title top fill */
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Landing hover feedback — unique per section; geometry and media bounds stay unchanged. */
[data-theme="type2"] .landing-section-action {
  transition:
    filter 200ms ease-out,
    box-shadow 200ms ease-out;
}

[data-theme="type2"] .landing-live-match-card {
  --landing-card-accent: var(--main-livesports-icon-gradient-start);
  isolation: isolate;
  transition:
    border-color 200ms ease-out,
    box-shadow 200ms ease-out;
}

[data-theme="type2"] .landing-live-match-card::before {
  position: absolute;
  inset: 0;
  z-index: 4;
  border-radius: inherit;
  box-shadow:
    inset 0 0 0 1px var(--landing-card-accent),
    inset 0 0 24px
      color-mix(in srgb, var(--landing-card-accent) 58%, transparent);
  content: "";
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease-out;
}

[data-theme="type2"] .landing-live-teams {
  transition:
    background-color 200ms ease-out,
    box-shadow 200ms ease-out;
}

[data-theme="type2"] .landing-live-odds-cell {
  transition: filter 200ms ease-out;
}

[data-theme="type2"] .landing-live-odds-cell > span:first-child {
  transition: text-shadow 200ms ease-out;
}

[data-theme="type2"] .landing-event-card {
  --landing-card-accent: var(--subpage-accent);
  isolation: isolate;
  transition: box-shadow 200ms ease-out;
}

[data-theme="type2"] .landing-event-card::before {
  position: absolute;
  inset: 0;
  z-index: 4;
  border-radius: inherit;
  background: linear-gradient(
    118deg,
    transparent 20%,
    color-mix(in srgb, var(--landing-card-accent) 8%, transparent) 37%,
    color-mix(in srgb, var(--landing-card-accent) 68%, transparent) 50%,
    color-mix(in srgb, var(--landing-card-accent) 8%, transparent) 63%,
    transparent 80%
  );
  background-position: 130% 0;
  background-size: 250% 100%;
  content: "";
  opacity: 0;
  pointer-events: none;
  transition:
    opacity 140ms ease-out,
    background-position 650ms ease-out;
}

[data-theme="type2"] .landing-event-card > img {
  transition: filter 200ms ease-out;
}

[data-theme="type2"] .main-notice-card {
  --landing-card-accent: var(--primary-gradient-via);
  isolation: isolate;
  transition: border-color 200ms ease-out;
}

[data-theme="type2"] .main-notice-card::before {
  position: absolute;
  top: -35%;
  right: 0;
  left: 0;
  z-index: 4;
  height: 35%;
  background: linear-gradient(
    180deg,
    transparent 0%,
    color-mix(in srgb, var(--landing-card-accent) 12%, transparent) 48%,
    color-mix(in srgb, var(--landing-card-accent) 72%, transparent) 82%,
    transparent 100%
  );
  content: "";
  mix-blend-mode: screen;
  opacity: 0;
  pointer-events: none;
}

[data-theme="type2"] .main-notice-card::after {
  position: absolute;
  inset: 0;
  z-index: 3;
  border-radius: inherit;
  background: linear-gradient(
    180deg,
    transparent 46%,
    color-mix(in srgb, var(--landing-card-accent) 24%, transparent) 100%
  );
  box-shadow: inset 0 0 0 1px var(--landing-card-accent);
  content: "";
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease-out;
}

[data-theme="type2"] .main-notice-card > img {
  transition: filter 200ms ease-out;
}

[data-theme="type2"] .main-sports-card {
  --landing-card-accent: var(
    --main-sports-card-glow,
    var(--landing-hover-default-accent)
  );
  transition:
    filter 200ms ease-out,
    box-shadow 200ms ease-out;
}

[data-theme="type2"] .main-sports-card-image,
[data-theme="type2"] .main-sports-play-button {
  transition:
    filter 200ms ease-out,
    box-shadow 200ms ease-out;
}

[data-theme="type2"] .quick-link-card {
  --landing-card-accent: var(
    --quick-link-action,
    var(--landing-hover-default-accent)
  );
  isolation: isolate;
}

[data-theme="type2"] .quick-link-card::before {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 4;
  height: 3px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    var(--landing-card-accent) 35%,
    var(--landing-card-accent) 65%,
    transparent 100%
  );
  background-position: 150% 0;
  background-size: 200% 100%;
  content: "";
  opacity: 0;
  pointer-events: none;
}

[data-theme="type2"] .quick-link-card::after {
  position: absolute;
  inset: 0;
  z-index: 3;
  border-radius: inherit;
  background: radial-gradient(
    ellipse at 50% 120%,
    color-mix(in srgb, var(--landing-card-accent) 38%, transparent) 0%,
    transparent 62%
  );
  content: "";
  opacity: 0;
  pointer-events: none;
  transition: opacity 200ms ease-out;
}

[data-theme="type2"] .quick-link-card > video {
  transition: filter 200ms ease-out;
}

@keyframes landing-live-energy-pulse {
  from {
    filter: brightness(0.92);
  }

  to {
    filter: brightness(1.35);
  }
}

@keyframes landing-notice-scan {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(420%);
  }
}

@keyframes landing-quick-tracer {
  from {
    background-position: 150% 0;
  }

  to {
    background-position: -150% 0;
  }
}

@media (hover: hover) and (pointer: fine) {
  [data-theme="type2"]
    .main-livesports-section
    .landing-section-action:not(:disabled):hover {
    filter: var(--landing-hover-action-filter);
    box-shadow: 0 0 16px
      color-mix(
        in srgb,
        var(--main-livesports-icon-gradient-start) 72%,
        transparent
      );
  }

  [data-theme="type2"]
    .main-event-section
    .landing-section-action:not(:disabled):hover {
    filter: var(--landing-hover-action-filter);
    box-shadow:
      inset 0 -2px 0 var(--subpage-accent),
      0 4px 12px color-mix(in srgb, var(--subpage-accent) 48%, transparent);
  }

  [data-theme="type2"]
    .main-notice-section
    .landing-section-action:not(:disabled):hover {
    filter: var(--landing-hover-action-filter);
    box-shadow:
      inset 0 0 12px
        color-mix(in srgb, var(--primary-gradient-via) 42%, transparent),
      0 0 0 1px var(--primary-gradient-via);
  }

  [data-theme="type2"]
    .main-sports-section
    .landing-section-action:not(:disabled):hover {
    filter: brightness(1.28) saturate(1.16);
    box-shadow: 0 0 12px
      color-mix(
        in srgb,
        var(--main-livesports-icon-gradient-start) 62%,
        transparent
      );
  }

  [data-theme="type2"] .landing-section-action:not(:disabled):active {
    filter: var(--landing-active-action-filter);
  }

  [data-theme="type2"] .landing-live-match-card:hover {
    border-color: var(--landing-card-accent);
    box-shadow: 0 0 18px
      color-mix(in srgb, var(--landing-card-accent) 36%, transparent);
  }

  [data-theme="type2"] .landing-live-match-card:hover::before {
    animation: landing-live-energy-pulse 900ms ease-in-out infinite alternate;
    opacity: 1;
  }

  [data-theme="type2"] .landing-live-match-card:hover .landing-live-teams {
    background-color: var(--landing-hover-teams-bg);
    box-shadow: inset 0 0 18px
      color-mix(in srgb, var(--landing-card-accent) 18%, transparent);
  }

  [data-theme="type2"] .landing-live-odds-cell:not(:disabled):hover {
    filter: var(--landing-hover-odds-filter);
  }

  [data-theme="type2"]
    .landing-live-odds-cell:not(:disabled):hover
    > span:first-child {
    text-shadow: 0 0 10px currentColor;
  }

  [data-theme="type2"] .landing-event-card:hover {
    box-shadow:
      inset 0 0 0 2px var(--landing-card-accent),
      inset 0 -28px 30px
        color-mix(in srgb, var(--landing-card-accent) 22%, transparent);
  }

  [data-theme="type2"] .landing-event-card:hover::before {
    background-position: -130% 0;
    opacity: 1;
  }

  [data-theme="type2"] .landing-event-card:hover > img {
    filter: var(--landing-event-media-filter);
  }

  [data-theme="type2"] .main-notice-card:hover {
    border-color: var(--landing-card-accent);
  }

  [data-theme="type2"] .main-notice-card:hover::before {
    animation: landing-notice-scan 900ms ease-in-out infinite;
    opacity: 1;
  }

  [data-theme="type2"] .main-notice-card:hover::after {
    opacity: 1;
  }

  [data-theme="type2"] .main-notice-card:hover > img {
    filter: var(--landing-notice-media-filter);
  }

  [data-theme="type2"] .main-sports-card:hover {
    filter: brightness(1.08) saturate(1.12);
    box-shadow:
      0 0 34px var(--landing-card-accent),
      0 0 10px color-mix(in srgb, var(--landing-card-accent) 82%, transparent),
      inset 0 0 72px
        color-mix(in srgb, var(--landing-card-accent) 78%, transparent);
  }

  [data-theme="type2"] .main-sports-card:hover .main-sports-card-image {
    filter: var(--landing-sports-media-filter);
  }

  [data-theme="type2"] .main-sports-card:hover .main-sports-play-button {
    filter: var(--landing-hover-action-filter);
    box-shadow:
      var(--main-sports-card-action-shadow),
      0 0 18px
        color-mix(in srgb, var(--landing-card-accent) 84%, transparent);
  }

  [data-theme="type2"] .quick-link-card:hover::before {
    animation: landing-quick-tracer 1100ms linear infinite;
    opacity: 1;
  }

  [data-theme="type2"] .quick-link-card:hover::after {
    opacity: 1;
  }

  [data-theme="type2"] .quick-link-card:hover > video {
    filter: var(--landing-quick-media-filter);
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-theme="type2"] .landing-section-action,
  [data-theme="type2"] .landing-live-match-card,
  [data-theme="type2"] .landing-live-match-card::before,
  [data-theme="type2"] .landing-live-teams,
  [data-theme="type2"] .landing-live-odds-cell,
  [data-theme="type2"] .landing-live-odds-cell > span:first-child,
  [data-theme="type2"] .landing-event-card,
  [data-theme="type2"] .landing-event-card::before,
  [data-theme="type2"] .landing-event-card > img,
  [data-theme="type2"] .main-notice-card,
  [data-theme="type2"] .main-notice-card::before,
  [data-theme="type2"] .main-notice-card::after,
  [data-theme="type2"] .main-notice-card > img,
  [data-theme="type2"] .main-sports-card,
  [data-theme="type2"] .main-sports-card-image,
  [data-theme="type2"] .main-sports-play-button,
  [data-theme="type2"] .quick-link-card::before,
  [data-theme="type2"] .quick-link-card::after,
  [data-theme="type2"] .quick-link-card > video {
    animation: none;
    transition: none;
  }
}

/* 랜딩 공지 및 규정 — source: Figma(share) 1:412 */
[data-theme="type2"] .main-notice-section {
  max-width: var(--main-notice-section-width); /* source: Figma 1:426 dimensions.width */
}

[data-theme="type2"] .main-notice-header {
  height: var(--main-notice-header-height); /* source: Figma 1:413/1:417 */
}

[data-theme="type2"] .main-notice-card-title {
  color: var(--main-notice-card-title-fallback);
  font-family: "Paperlogy", sans-serif;
  font-weight: 700; /* source: Figma style_b7ac7314.fontWeight */
}

[data-theme="type2"] .main-notice-card-title-outline {
  color: var(--main-notice-card-title-stroke);
  text-shadow: var(--main-notice-card-title-shadow); /* source: Figma effect_98ac93b9 */
  -webkit-text-stroke: 4px var(--main-notice-card-title-stroke); /* source: Figma 1:432~1:436 strokeWeight */
}

[data-theme="type2"] .main-notice-card-title-fill {
  color: var(--main-notice-card-title-fill);
  background-position: center;
  background-repeat: no-repeat;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

[data-theme="type2"] .main-notice-card-title-cyan {
  background-image: var(--main-notice-card-title-cyan-gradient); /* source: Figma fill_35ed9e4d */
}

[data-theme="type2"] .main-notice-card-title-purple {
  background-image: var(--main-notice-card-title-purple-gradient); /* source: Figma fill_2d8bb7e4 */
}

/* 랜딩 스포츠 카드 — source: Figma(share) 1:437 */
[data-theme="type2"] .main-sports-section {
  max-width: var(--main-sports-section-width);
}

[data-theme="type2"] .main-sports-header {
  height: var(--main-sports-header-height);
}

[data-theme="type2"] .main-sports-title {
  display: flex;
  width: 95px; /* source: Figma 1:439 dimensions.width */
  height: var(--main-sports-header-height);
  flex: none;
  align-items: center;
  gap: 5px; /* source: Figma 1:439 itemSpacing */
  color: var(--main-sports-title-fallback);
  background-image: var(--main-sports-title-gradient);
  background-position: right center;
  background-repeat: no-repeat;
  background-size: 66px 100%; /* source: Figma 1:439 title width = 95 - 24 icon - 5 gap */
  background-clip: text;
  -webkit-background-clip: text;
  font-size: 24px; /* source: mobile title size reduced by 1px */
  line-height: 29px; /* source: Figma 1:439 dimensions.height */
  white-space: nowrap;
  -webkit-text-fill-color: transparent;
}

@media (min-width: 768px) {
  [data-theme="type2"] .main-sports-title {
    font-size: 25px; /* source: Figma 1:439 fontSize */
  }
}

[data-theme="type2"] .main-sports-title::before {
  width: 24px; /* source: Figma 1:440 dimensions.width */
  height: 24px; /* source: Figma 1:440 dimensions.height */
  flex: none;
  background-image: var(--main-sports-header-icon);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
}

[data-theme="type2"] .main-sports-list {
  height: 310px; /* source: Figma 1:441 20px top padding + 290px cards */
  margin-top: 0; /* source: supplied PC screenshot; preserve full 20px slider top clearance */
  padding-top: 20px; /* source: Figma 1:441 paddingTop */
  padding-right: var(--main-sports-card-inline-bleed); /* source: 218px art requires 1px right bleed */
  padding-left: var(--main-sports-card-inline-bleed); /* source: 218px art requires 1px left bleed */
  overflow-x: clip;
  overflow-y: visible;
}

[data-theme="type2"] .main-sports-list .swiper-wrapper {
  height: var(--main-sports-card-height);
}

[data-theme="type2"] .main-sports-slide {
  width: var(--main-sports-card-width) !important;
  height: var(--main-sports-card-height);
}

[data-theme="type2"] .main-sports-card {
  height: var(--main-sports-card-height);
  overflow: visible;
  border-radius: var(--main-sports-card-radius);
  background: var(--main-sports-card-bg);
  box-shadow:
    0 0 20px var(--main-sports-card-glow),
    inset 0 0 50px var(--main-sports-card-glow); /* source: Figma card frame effects */
}

[data-theme="type2"] .main-sports-card:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

[data-theme="type2"] .main-sports-card-media {
  height: var(--main-sports-card-height);
  overflow: visible;
  border-radius: inherit;
}

[data-theme="type2"] .main-sports-card-image {
  position: absolute !important;
  top: auto !important;
  right: auto !important;
  bottom: -1px !important;
  left: 50% !important;
  width: var(--main-sports-card-art-width) !important;
  max-width: none !important;
  height: var(--main-sports-card-art-height) !important;
  object-fit: contain;
  transform: translateX(-50%);
}

[data-theme="type2"] .main-sports-card-copy {
  z-index: 1;
  color: var(--main-sports-card-text);
  font-family: "Paperlogy", sans-serif;
  text-shadow: var(--main-sports-card-text-shadow);
}

[data-theme="type2"] .main-sports-card-copy::before,
[data-theme="type2"] .main-sports-card-copy::after {
  position: absolute;
  left: 25px; /* source: Figma card text x */
  font-weight: 700;
  white-space: pre;
}

[data-theme="type2"] .main-sports-card-copy::before {
  top: 56px; /* source: Figma card title y */
  font-size: 28px;
  line-height: 33px;
  content: var(--main-sports-card-title);
}

[data-theme="type2"] .main-sports-card-copy::after {
  top: var(--main-sports-card-subtitle-top, 89px);
  font-size: 16px;
  line-height: 19px;
  opacity: 0.5;
  content: var(--main-sports-card-subtitle);
}

[data-theme="type2"] .main-sports-play-button {
  top: 224px; /* source: Figma action y */
  left: 62px; /* source: Figma action x */
  width: 96px; /* source: Figma action dimensions.width */
  height: 23px; /* source: Figma action dimensions.height */
  background: var(--main-sports-card-action-bg);
  box-shadow: var(--main-sports-card-action-shadow);
  color: var(--main-sports-card-action-text);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  text-shadow: none;
}

[data-theme="type2"] .main-sports-slide:nth-child(1) {
  --main-sports-card-bg: var(--main-sports-cross-bg);
  --main-sports-card-glow: var(--main-sports-cross-glow);
  --main-sports-card-title: "크로스";
  --main-sports-card-subtitle: "CROSS";
  --main-sports-card-action-bg: var(--main-sports-cross-action-bg);
  --main-sports-card-action-text: var(--main-sports-cross-action-text);
}

[data-theme="type2"] .main-sports-slide:nth-child(2) {
  --main-sports-card-bg: var(--main-sports-special-bg);
  --main-sports-card-glow: var(--main-sports-special-glow);
  --main-sports-card-title: "스페셜";
  --main-sports-card-subtitle: "SPECIAL";
}

[data-theme="type2"] .main-sports-slide:nth-child(3) {
  --main-sports-card-bg: var(--main-sports-realtime-bg);
  --main-sports-card-glow: var(--main-sports-realtime-glow);
  --main-sports-card-title: "실시간";
  --main-sports-card-subtitle: "REAL-TIME";
}

[data-theme="type2"] .main-sports-slide:nth-child(4) {
  --main-sports-card-bg: var(--main-sports-europe-bg);
  --main-sports-card-glow: var(--main-sports-europe-glow);
  --main-sports-card-title: "유럽형\A 스포츠";
  --main-sports-card-subtitle: "EUROPEAN";
  --main-sports-card-subtitle-top: 122px;
}

[data-theme="type2"] .main-sports-slide:nth-child(5) {
  --main-sports-card-bg: var(--main-sports-live-bg);
  --main-sports-card-glow: var(--main-sports-live-glow);
  --main-sports-card-title: "라이브\A 스포츠";
  --main-sports-card-subtitle: "LIVE";
  --main-sports-card-subtitle-top: 122px;
}

[data-theme="type2"] .main-sports-slide:nth-child(6) {
  --main-sports-card-bg: var(--main-sports-esports-bg);
  --main-sports-card-glow: var(--main-sports-esports-glow);
  --main-sports-card-title: "e스포츠";
  --main-sports-card-subtitle: "eSPORTS";
}

[data-theme="type2"]
  .sports-live-row
  .sports-live-odds-row
  > button:not([data-active="true"]):nth-of-type(1)
  .sports-selection-odds-value {
  color: var(--sports-live-odds-home);
}

[data-theme="type2"]
  .sports-live-row
  .sports-live-odds-row
  > button:not([data-active="true"]):nth-of-type(2) {
  color: var(--sports-live-odds-draw) !important;
}

[data-theme="type2"]
  .sports-live-row
  .sports-live-odds-row
  > button:not([data-active="true"]):nth-of-type(3)
  .sports-selection-odds-value {
  color: var(--sports-live-odds-away);
}

[data-theme="type2"] .mypage-history-table > div {
  border: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
  border-radius: 0;
}

[data-theme="type2"] .mypage-history-table table {
  min-width: 0;
}

[data-theme="type2"] .mypage-history-table thead tr {
  height: auto;
}

[data-theme="type2"] .mypage-history-table thead th {
  height: auto;
  border-left: 0;
  background: var(--mypage-history-header-bg);
  padding: 10px 20px;
  color: var(--mypage-history-text);
  font-family: "Montserrat", var(--font-geist-sans);
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
}

[data-theme="type2"] .mypage-history-table thead th > div {
  height: auto;
}

[data-theme="type2"] .mypage-history-table tbody tr {
  background: transparent;
}

[data-theme="type2"] .mypage-history-table tbody td {
  height: auto;
  border-bottom: 1px solid var(--mypage-history-row-border);
  padding: 10px 20px;
  color: var(--mypage-history-text);
  font-family: "Montserrat", var(--font-geist-sans);
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
}

[data-theme="type2"] .mypage-history-table tbody tr:last-child td {
  border-bottom: 0;
}

[data-theme="type2"] .mypage-history-table tbody span {
  color: var(--mypage-history-text);
  font-family: "Montserrat", var(--font-geist-sans);
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
}

[data-theme="type2"] .inquiry-betting-date-range {
  display: flex;
  justify-content: center;
  align-items: center;
  border: 0;
  background: transparent;
  padding: 0;
}

[data-theme="type2"] .inquiry-betting-date-range .date-range-selector-scroll {
  width: 264px; /* source: Framelink 4052:9539 dimensions.width */
  height: 35px; /* source: Figma screenshot 4052:9539 dimensions.height */
  overflow: visible;
}

[data-theme="type2"] .inquiry-betting-date-range .date-range-selector-row {
  width: 264px; /* source: Figma metadata 4052:9539 width */
  min-width: 264px; /* source: Figma get_design_context 4052:9539 size-full, no horizontal scroll */
  height: 35px; /* source: Figma metadata 4052:9539 height */
  flex-wrap: nowrap; /* source: Figma get_design_context 4052:9539 single-row buttons */
  justify-content: center;
  align-items: center;
  gap: 10px; /* source: Framelink 4052:9539 layout.gap */
}

[data-theme="type2"] .inquiry-betting-date-range .date-range-separator {
  display: none; /* source: Framelink 4052:9539 has no separator node */
}

[data-theme="type2"] .inquiry-betting-date-range .inquiry-date-custom-icon {
  display: none; /* source: Framelink 4052:9546 has text only, no icon layer */
}

[data-theme="type2"] .inquiry-betting-date-range .react-datepicker-wrapper,
[data-theme="type2"]
  .inquiry-betting-date-range
  .react-datepicker__input-container {
  width: 75px; /* source: Figma metadata 4052:9546 width */
  flex: 0 0 75px; /* source: Figma metadata 4052:9546 fixed child width */
  display: block;
}

[data-theme="type2"] .inquiry-betting-date-range .inquiry-date-preset-button {
  display: flex; /* source: Framelink 4052:9540 layout.mode=row */
  flex: 0 0 auto; /* source: Figma metadata 4052:9540~9546 fixed child widths */
  box-sizing: border-box;
  height: 35px; /* source: Framelink 4052:9540 dimensions.height */
  justify-content: center; /* source: Framelink 4052:9540 justifyContent=center */
  align-items: center; /* source: Framelink 4052:9540 alignItems=center */
  gap: 5px; /* source: Framelink 4052:9540 layout.gap */
  overflow: hidden; /* source: Figma get_design_context 4052:9540 overflow-clip */
  border-radius: 5px; /* source: Framelink 4052:9540 borderRadius */
  padding: 0 15px; /* source: Framelink 4052:9540 layout.padding */
  font-family: "Pretendard", var(--font-geist-sans);
  font-size: 12px; /* source: Framelink 4052:9541 textStyle.fontSize */
  font-weight: 500; /* source: Framelink 4052:9541 textStyle.fontWeight */
  line-height: normal; /* source: Figma get_design_context 4052:9541 leading normal */
  white-space: nowrap; /* source: Figma get_design_context 4052:9541 whitespace-nowrap */
}

[data-theme="type2"]
  .inquiry-betting-date-range
  .date-range-selector-row
  > .inquiry-date-preset-button:nth-of-type(1) {
  width: 48px; /* source: Figma metadata 4052:9540 width */
}

[data-theme="type2"]
  .inquiry-betting-date-range
  .date-range-selector-row
  > .inquiry-date-preset-button:nth-of-type(2) {
  width: 54px; /* source: Figma metadata 4052:9542 width */
}

[data-theme="type2"]
  .inquiry-betting-date-range
  .date-range-selector-row
  > .inquiry-date-preset-button:nth-of-type(3) {
  width: 57px; /* source: Figma metadata 4052:9544 width */
}

[data-theme="type2"] .inquiry-betting-date-range .date-range-custom-trigger {
  width: 75px; /* source: Figma metadata 4052:9546 width */
}

[data-theme="type2"] .inquiry-betting-date-range .inquiry-date-preset-active {
  border: 2px solid var(--inquiry-betting-dialog-date-active-border) !important; /* source: Framelink 4052:9540 strokeWeight/strokes */
  background: var(
    --inquiry-betting-dialog-date-active-bg
  ) !important; /* source: Framelink 4052:9540 fills */
  color: var(
    --inquiry-betting-dialog-date-active-text
  ) !important; /* source: Framelink 4052:9541 fills */
}

[data-theme="type2"] .inquiry-betting-date-range .inquiry-date-preset-inactive {
  border: 1px solid var(--inquiry-betting-dialog-date-border) !important; /* source: Framelink 4052:9542 strokeWeight/strokes */
  background: var(
    --inquiry-betting-dialog-date-bg
  ) !important; /* source: Framelink 4052:9542 fills */
  color: var(
    --inquiry-betting-dialog-date-text
  ) !important; /* source: Framelink 4052:9543 fills */
}

[data-theme="type2"] .options-market-row .options-selection-price {
  color: var(
    --options-selection-price-home
  ); /* source: Framelink EL-69d770cc fills #00D5BE */
}

[data-theme="type2"]
  .options-market-row
  > button:nth-child(2)
  .options-selection-price {
  color: var(
    --options-selection-price-away
  ); /* source: Framelink EL-1a892a71 fills #C27AFF */
}

[data-theme="type2"]
  .options-market-row-three
  > button:nth-child(2)
  .options-selection-price {
  color: var(
    --options-selection-price-draw
  ); /* source: Framelink 4007:6275 fills #05DF72 */
}

[data-theme="type2"]
  .options-market-row-three
  > button:nth-child(3)
  .options-selection-price {
  color: var(
    --options-selection-price-away
  ); /* source: Framelink EL-1a892a71 fills #C27AFF */
}

/* Desktop application shell and left sidebar — Figma node 1:628 */
[data-theme="type2"] .app-shell {
  --app-fixed-top-height: var(
    --header-desktop-height
  ); /* source: existing type2 desktop header token */
}

[data-theme="type2"] .app-shell-notice-visible {
  --app-fixed-top-height: var(
    --header-authenticated-desktop-height
  ); /* source: existing type2 authenticated header token */
}

@media (max-width: 767px) {
  [data-theme="type2"] .app-shell,
  [data-theme="type2"] .app-shell-notice-visible {
    --app-fixed-top-height: 101px; /* source: active mobile shell = TopMenu 51px + auth/status row 50px */
  }

  [data-theme="type2"] .mobile-history-table {
    min-width: 640px !important; /* source: AppTable DEFAULT_COLUMN_WIDTH 100px × up to 6 history columns + cell padding */
  }
}

@media (min-width: 768px) and (max-width: 1279px) {
  [data-theme="type2"] .app-shell,
  [data-theme="type2"] .app-shell-notice-visible {
    --app-fixed-top-height: 51px; /* source: active compact TopMenu height; game navigation is desktop-only from 1280px */
  }
}

/* Header game navigation — Figma node 1:913 */
@keyframes type2-header-game-nav-light-top {
  from {
    background-position: 100% center;
  }

  to {
    background-position: 0 center;
  }
}

@keyframes type2-header-game-nav-light-bottom {
  from {
    background-position: 0 center;
  }

  to {
    background-position: 100% center;
  }
}

[data-theme="type2"] .header-game-nav-light-track {
  right: 0;
  left: 0;
  z-index: 1;
  display: block;
  height: var(--header-game-nav-light-height);
  background-image: var(--header-game-nav-light-image);
  background-position: center;
  background-repeat: no-repeat;
  background-size: var(--header-game-nav-light-width)
    var(--header-game-nav-light-height);
}

[data-theme="type2"] .header-game-nav-light-track-top {
  top: var(--header-game-nav-light-offset);
  animation: type2-header-game-nav-light-top
    var(--header-game-nav-light-top-duration) linear infinite alternate;
}

[data-theme="type2"] .header-game-nav-light-track-bottom {
  bottom: var(--header-game-nav-light-offset);
  animation: type2-header-game-nav-light-bottom
    var(--header-game-nav-light-bottom-duration) linear
    var(--header-game-nav-light-bottom-delay) infinite alternate;
}

[data-theme="type2"] .header-game-menu > :nth-child(1) {
  --header-game-menu-item-width: var(--header-game-menu-width-general);
  --header-game-menu-icon: var(--header-game-menu-icon-general);
}

[data-theme="type2"] .header-game-menu > :nth-child(2) {
  --header-game-menu-item-width: var(--header-game-menu-width-casino);
  --header-game-menu-icon: var(--header-game-menu-icon-casino);
}

[data-theme="type2"] .header-game-menu > :nth-child(3) {
  --header-game-menu-item-width: var(--header-game-menu-width-slot);
  --header-game-menu-icon: var(--header-game-menu-icon-slot);
}

[data-theme="type2"] .header-game-menu > :nth-child(4) {
  --header-game-menu-item-width: var(--header-game-menu-width-cross);
  --header-game-menu-icon: var(--header-game-menu-icon-cross);
}

[data-theme="type2"] .header-game-menu > :nth-child(5) {
  --header-game-menu-item-width: var(--header-game-menu-width-special);
  --header-game-menu-icon: var(--header-game-menu-icon-special);
}

[data-theme="type2"] .header-game-menu > :nth-child(6) {
  --header-game-menu-item-width: var(--header-game-menu-width-realtime);
  --header-game-menu-icon: var(--header-game-menu-icon-realtime);
}

[data-theme="type2"] .header-game-menu > :nth-child(7) {
  --header-game-menu-item-width: var(--header-game-menu-width-esports);
  --header-game-menu-icon: var(--header-game-menu-icon-esports);
}

[data-theme="type2"] .header-game-menu > :nth-child(8) {
  --header-game-menu-item-width: var(--header-game-menu-width-sports);
  --header-game-menu-icon: var(--header-game-menu-icon-sports);
}

[data-theme="type2"] .header-game-menu > :nth-child(9) {
  --header-game-menu-item-width: var(--header-game-menu-width-live-sports);
  --header-game-menu-icon: var(--header-game-menu-icon-live-sports);
}

[data-theme="type2"] .header-game-menu > :nth-child(10) {
  --header-game-menu-item-width: var(--header-game-menu-width-mini);
  --header-game-menu-icon: var(--header-game-menu-icon-mini);
}

@media (min-width: 1280px) {
  [data-theme="type2"] .desktop-left-sidebar {
    display: flex;
    position: fixed; /* source: user-requested fixed desktop sidebar */
    top: var(
      --app-fixed-top-height
    ); /* source: existing type2 header height tokens */
    left: 0; /* source: Figma node 1:628 */
    width: var(
      --desktop-sidebar-width
    ); /* source: user-provided Figma reference, 280px */
    height: calc(
      100dvh - var(--app-fixed-top-height)
    ); /* source: user-requested remaining viewport height */
    border-right: 1px solid
      var(--sidebar-border); /* source: Figma node 1:628 divider mapped to semantic token */
  }

  [data-theme="type2"] .desktop-sidebar-scroll {
    padding-top: 20px; /* source: user-provided Figma reference y=40px @2x */
  }

  [data-theme="type2"] .desktop-sidebar-panel {
    width: 250px; /* source: user-provided Figma reference x=30..529px @2x */
    margin-inline: auto;
    padding: 20px; /* source: panel x=15px, first row x=35px */
    border-radius: 12px; /* source: user-provided Figma reference */
    background: var(--desktop-sidebar-panel-bg);
    box-shadow: var(--desktop-sidebar-panel-shadow);
  }

  [data-theme="type2"] .desktop-sidebar-primary-panel {
    box-shadow:
      inset 0 0 0 1px var(--desktop-sidebar-primary-border),
      var(--desktop-sidebar-panel-shadow); /* source: cyan 1px panel stroke */
  }

  [data-theme="type2"] .desktop-sidebar-info-panel {
    margin-top: 20px; /* source: first panel bottom 362px, second panel top 382px */
    box-shadow:
      inset 0 0 0 1px var(--desktop-sidebar-info-border),
      var(--desktop-sidebar-panel-shadow); /* source: green 1px panel stroke */
  }

  [data-theme="type2"] .desktop-sidebar-menu {
    display: flex;
    flex-direction: column;
    gap: 4px; /* source: user-provided Figma reference 8px @2x */
  }

  [data-theme="type2"] .desktop-sidebar-menu-item {
    display: flex;
    width: 210px; /* source: user-provided Figma reference 420px @2x */
    height: 30px; /* source: user-provided Figma reference 60px @2x */
    align-items: center;
    gap: 7px; /* source: final side-by-side render comparison with user-provided Figma reference */
    padding-inline: 12px; /* source: row x=35px, icon box x=47px */
    border-radius: 6px; /* source: user-provided Figma reference */
    background: var(--desktop-sidebar-row-bg);
    color: var(--desktop-sidebar-item-accent);
    font-family: var(--font-pretendard), sans-serif;
    font-size: 16px; /* source: user-provided Figma reference 2x text raster */
    font-weight: 700;
    line-height: 1;
  }

  [data-theme="type2"] .desktop-sidebar-menu-item > svg,
  [data-theme="type2"] .desktop-sidebar-menu-item > .cdn-mask-icon {
    width: 16px; /* source: user-provided Figma reference 32px @2x */
    height: 16px;
    flex: none;
  }

  [data-theme="type2"]
    .desktop-sidebar-primary-menu
    > :nth-child(1) {
    --desktop-sidebar-item-accent: var(--desktop-sidebar-accent-profile);
  }

  [data-theme="type2"]
    .desktop-sidebar-primary-menu
    > :nth-child(2) {
    --desktop-sidebar-item-accent: var(--desktop-sidebar-accent-betting);
  }

  [data-theme="type2"]
    .desktop-sidebar-primary-menu
    > :nth-child(3) {
    --desktop-sidebar-item-accent: var(--desktop-sidebar-accent-deposit);
  }

  [data-theme="type2"]
    .desktop-sidebar-primary-menu
    > :nth-child(4) {
    --desktop-sidebar-item-accent: var(--desktop-sidebar-accent-withdraw);
  }

  [data-theme="type2"]
    .desktop-sidebar-primary-menu
    > :nth-child(5) {
    --desktop-sidebar-item-accent: var(--desktop-sidebar-accent-point);
  }

  [data-theme="type2"]
    .desktop-sidebar-primary-menu
    > :nth-child(6) {
    --desktop-sidebar-item-accent: var(--desktop-sidebar-accent-coupon);
  }

  [data-theme="type2"]
    .desktop-sidebar-primary-menu
    > :nth-child(7) {
    --desktop-sidebar-item-accent: var(--desktop-sidebar-accent-profile);
  }

  [data-theme="type2"]
    .desktop-sidebar-primary-menu
    > :nth-child(8) {
    --desktop-sidebar-item-accent: var(--desktop-sidebar-accent-betting);
  }

  [data-theme="type2"]
    .desktop-sidebar-primary-menu
    > :nth-child(9) {
    --desktop-sidebar-item-accent: var(--desktop-sidebar-accent-deposit);
  }

  [data-theme="type2"] .desktop-sidebar-info-menu {
    --desktop-sidebar-item-accent: var(--desktop-sidebar-info-accent);
  }

  [data-theme="type2"]
    .desktop-sidebar-info-menu
    > :first-child
    > svg {
    fill: currentColor; /* source: filled bell silhouette in user-provided Figma reference */
  }

  [data-theme="type2"] .desktop-sidebar-promotions {
    position: relative;
    width: 100%; /* center against the scrollable content width, excluding the 8px scrollbar */
    height: 256px; /* source: Figma node 1:1159 */
  }

  [data-theme="type2"] .desktop-sidebar-content-offset {
    padding-left: var(
      --desktop-sidebar-width
    ); /* source: existing fixed desktop sidebar width */
    padding-right: 0; /* source: user-provided deposit screenshot has no right betting cart */
  }

  [data-theme="type2"]
    .app-shell:has(.desktop-cart-content-offset)
    .desktop-sidebar-content-offset {
    padding-right: var(
      --desktop-sidebar-width
    ); /* source: landing and sports right betting cart width */
  }

  [data-theme="type2"] .app-shell-game-player .desktop-left-sidebar {
    display: none; /* source: existing full-screen game-player layout constraint */
  }

  [data-theme="type2"]
    .app-shell-game-player
    .desktop-sidebar-content-offset {
    padding-inline: 0; /* source: existing full-screen game-player layout constraint */
  }

  [data-theme="type2"] .header-spacer {
    height: var(--header-desktop-height);
  }

  [data-theme="type2"] .header-spacer-authenticated {
    height: var(--header-authenticated-desktop-height);
  }

  [data-theme="type2"] .header-game-nav {
    height: var(--header-game-nav-height);
  }

  [data-theme="type2"] .header-game-nav-inner {
    max-width: var(--header-game-nav-content-width);
    justify-content: space-between;
    padding-block: 16px;
    padding-inline: 20px;
  }

  [data-theme="type2"] .header-game-logo {
    width: var(--header-game-nav-logo-width);
    height: var(--header-game-nav-logo-height);
  }

  [data-theme="type2"] .header-game-menu {
    flex: 0 0 auto;
    height: auto;
    justify-content: flex-start;
    gap: var(--header-game-nav-gap);
  }

  [data-theme="type2"] .header-game-menu-link {
    width: var(--header-game-menu-item-width);
    height: auto;
    flex-direction: column;
    justify-content: flex-start;
    gap: 0;
    padding: 0;
    border-radius: 0;
    font-family: var(--font-pretendard), sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: normal;
  }

  [data-theme="type2"] .header-game-menu-video-frame {
    width: var(--header-game-menu-animation-width);
    height: var(--header-game-menu-animation-height);
  }

  [data-theme="type2"] .header-game-menu-icon {
    display: block;
    width: var(--header-game-nav-icon-size);
    height: var(--header-game-nav-icon-size);
    flex: none;
    background-image: var(--header-game-menu-icon);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    box-shadow: var(--header-game-nav-icon-shadow);
  }

  [data-theme="type2"] .header-game-menu-label {
    white-space: nowrap;
    text-shadow: var(--header-game-nav-text-shadow);
  }

  [data-theme="type2"] .header-game-menu-skeleton {
    width: 100%;
    max-width: var(--header-game-nav-content-width);
    height: 100%;
    padding-inline: 20px;
  }

  [data-theme="type2"] .header-game-menu-skeleton-default {
    display: none;
  }

  [data-theme="type2"] .header-game-menu-skeleton-type2 {
    display: flex;
  }

}

@media (prefers-reduced-motion: reduce) {
  [data-theme="type2"] .header-game-nav-light-track {
    background-position: center;
    animation: none !important;
  }
}

/* Compact desktop right betting cart reservation before the fixed sidebar appears */
@media (min-width: 1024px) and (max-width: 1279px) {
  [data-theme="type2"] .desktop-cart-content-offset {
    padding-right: var(
      --desktop-sidebar-width
    ); /* source: existing lg betting cart width before the 1280px symmetric rail layout */
  }

  [data-theme="type2"] .app-shell-game-player .desktop-cart-content-offset {
    padding-right: 0; /* source: 기존 full-screen game-player 레이아웃 제약과 동일 */
  }
}