/* GENERATED from tokens.json; edit the JSON and run build-tokens.cjs.
 * Opt-in token definitions only; no resets, element styles, fonts or JS.
 * Scope each section separately. Reference metrics require a second explicit opt-in. */
[data-ax-ds="mathflat"] {
  --ax-mf-unit: 1px;
  --ax-mf-color-white: #FFFFFF;
  --ax-mf-color-black: #111111;
  --ax-mf-color-gray-100: #F8F8F8;
  --ax-mf-color-gray-200: #F4F4F4;
  --ax-mf-color-gray-300: #EEEEEE;
  --ax-mf-color-gray-400: #DDDDDD;
  --ax-mf-color-gray-500: #BBBBBB;
  --ax-mf-color-gray-600: #999999;
  --ax-mf-color-gray-700: #666666;
  --ax-mf-color-gray-800: #333333;
  --ax-mf-color-primary: #0080FF;
  --ax-mf-color-secondary: #004FFF;
  --ax-mf-color-review-hover: #A0E1FD;
  --ax-mf-font-family: "MathflatPretendard", "Pretendard", system-ui, sans-serif;
  --ax-mf-font-weight-400: 400;
  --ax-mf-font-weight-500: 500;
  --ax-mf-font-weight-700: 700;
  --ax-mf-tracking-heading: -0.02em;
  --ax-mf-tracking-body: -0.01em;
  --ax-mf-font-size-01: calc(64 * var(--ax-mf-unit));
  --ax-mf-line-height-01: 1.25;
  --ax-mf-font-size-02: calc(56 * var(--ax-mf-unit));
  --ax-mf-line-height-02: 1.3;
  --ax-mf-font-size-03: calc(48 * var(--ax-mf-unit));
  --ax-mf-line-height-03: 1.3;
  --ax-mf-font-size-04: calc(40 * var(--ax-mf-unit));
  --ax-mf-line-height-04: 1.35;
  --ax-mf-font-size-05: calc(32 * var(--ax-mf-unit));
  --ax-mf-line-height-05: 1.4;
  --ax-mf-font-size-06: calc(26 * var(--ax-mf-unit));
  --ax-mf-line-height-06: 1.4;
  --ax-mf-font-size-07: calc(24 * var(--ax-mf-unit));
  --ax-mf-line-height-07: 1.4;
  --ax-mf-font-size-08: calc(20 * var(--ax-mf-unit));
  --ax-mf-line-height-08: 1.6;
  --ax-mf-font-size-09: calc(18 * var(--ax-mf-unit));
  --ax-mf-line-height-09: 1.5;
  --ax-mf-font-size-10: calc(16 * var(--ax-mf-unit));
  --ax-mf-line-height-10: 1.7;
  --ax-mf-font-size-11: calc(14 * var(--ax-mf-unit));
  --ax-mf-line-height-11: 1.6;
  --ax-mf-font-size-12: calc(13 * var(--ax-mf-unit));
  --ax-mf-line-height-12: 1.4;
  --ax-mf-space-4: calc(4 * var(--ax-mf-unit));
  --ax-mf-space-8: calc(8 * var(--ax-mf-unit));
  --ax-mf-space-10: calc(10 * var(--ax-mf-unit));
  --ax-mf-space-12: calc(12 * var(--ax-mf-unit));
  --ax-mf-space-16: calc(16 * var(--ax-mf-unit));
  --ax-mf-space-20: calc(20 * var(--ax-mf-unit));
  --ax-mf-space-21: calc(21 * var(--ax-mf-unit));
  --ax-mf-space-24: calc(24 * var(--ax-mf-unit));
  --ax-mf-space-30: calc(30 * var(--ax-mf-unit));
  --ax-mf-space-32: calc(32 * var(--ax-mf-unit));
  --ax-mf-space-36: calc(36 * var(--ax-mf-unit));
  --ax-mf-space-40: calc(40 * var(--ax-mf-unit));
  --ax-mf-space-50: calc(50 * var(--ax-mf-unit));
  --ax-mf-space-60: calc(60 * var(--ax-mf-unit));
  --ax-mf-space-70: calc(70 * var(--ax-mf-unit));
  --ax-mf-space-80: calc(80 * var(--ax-mf-unit));
  --ax-mf-space-100: calc(100 * var(--ax-mf-unit));
  --ax-mf-space-120: calc(120 * var(--ax-mf-unit));
  --ax-mf-space-140: calc(140 * var(--ax-mf-unit));
  --ax-mf-space-160: calc(160 * var(--ax-mf-unit));
  --ax-mf-space-180: calc(180 * var(--ax-mf-unit));
  --ax-mf-space-200: calc(200 * var(--ax-mf-unit));
  --ax-mf-radius-8: calc(8 * var(--ax-mf-unit));
  --ax-mf-radius-10: calc(10 * var(--ax-mf-unit));
  --ax-mf-radius-16: calc(16 * var(--ax-mf-unit));
  --ax-mf-radius-circle: 50%;
  --ax-mf-shadow-popup: 0 calc(4 * var(--ax-mf-unit)) calc(30 * var(--ax-mf-unit)) 0 rgba(0, 0, 0, 0.3);
  --ax-mf-focus-width: 2px;
  --ax-mf-gradient-review-badge: linear-gradient(95deg, #0080FF 1.78%, #05D959 97.65%);
  --ax-mf-motion-feedback: 300ms;
  --ax-mf-motion-popup: 400ms;
  --ax-mf-motion-accordion: 500ms;
  --ax-mf-motion-flip: 600ms;
  --ax-mf-motion-slider: 1000ms;
  --ax-mf-surface-page: var(--ax-mf-color-white);
  --ax-mf-surface-subtle: var(--ax-mf-color-gray-100);
  --ax-mf-surface-card: var(--ax-mf-color-gray-200);
  --ax-mf-surface-card-hover: var(--ax-mf-color-review-hover);
  --ax-mf-text-primary: var(--ax-mf-color-black);
  --ax-mf-text-secondary: var(--ax-mf-color-gray-800);
  --ax-mf-text-muted: var(--ax-mf-color-gray-700);
  --ax-mf-text-on-accent: var(--ax-mf-color-white);
  --ax-mf-accent: var(--ax-mf-color-primary);
  --ax-mf-accent-strong: var(--ax-mf-color-secondary);
  --ax-mf-border-subtle: var(--ax-mf-color-gray-400);
  --ax-mf-heading-size: var(--ax-mf-font-size-02);
  --ax-mf-heading-line-height: var(--ax-mf-line-height-02);
  --ax-mf-heading-weight: var(--ax-mf-font-weight-700);
  --ax-mf-heading-tracking: var(--ax-mf-tracking-heading);
  --ax-mf-body-size: var(--ax-mf-font-size-07);
  --ax-mf-body-line-height: var(--ax-mf-line-height-07);
  --ax-mf-body-weight: var(--ax-mf-font-weight-500);
  --ax-mf-body-tracking: var(--ax-mf-tracking-body);
  --ax-mf-caption-size: var(--ax-mf-font-size-11);
  --ax-mf-caption-line-height: var(--ax-mf-line-height-11);
  --ax-mf-card-radius: var(--ax-mf-radius-16);
  --ax-mf-focus-color: var(--ax-mf-color-secondary);
  --ax-mf-container-wide: calc(1600 * var(--ax-mf-unit));
  --ax-mf-section-space: calc(200 * var(--ax-mf-unit));
  --ax-mf-heading-gap: calc(80 * var(--ax-mf-unit));
  --ax-mf-description-gap: calc(16 * var(--ax-mf-unit));
  --ax-mf-gutter: calc(0 * var(--ax-mf-unit));
  --ax-mf-bank-width: calc(1240 * var(--ax-mf-unit));
  --ax-mf-bank-slide-half-gap: calc(10 * var(--ax-mf-unit));
  --ax-mf-bank-radius: calc(16 * var(--ax-mf-unit));
  --ax-mf-review-height: calc(708 * var(--ax-mf-unit));
  --ax-mf-review-radius: calc(16 * var(--ax-mf-unit));
  --ax-mf-review-padding-x: calc(40 * var(--ax-mf-unit));
  --ax-mf-review-padding-top: calc(40 * var(--ax-mf-unit));
  --ax-mf-review-padding-bottom: calc(60 * var(--ax-mf-unit));
  --ax-mf-solution-gap: calc(20 * var(--ax-mf-unit));
  --ax-mf-solution-radius: calc(16 * var(--ax-mf-unit));
  --ax-mf-accordion-control-width: calc(520 * var(--ax-mf-unit));
  --ax-mf-accordion-media-width: calc(790 * var(--ax-mf-unit));
  --ax-mf-accordion-gap: calc(100 * var(--ax-mf-unit));
  --ax-mf-accordion-radius: calc(16 * var(--ax-mf-unit));
  --ax-mf-article-heading-gap: calc(80 * var(--ax-mf-unit));
  --ax-mf-article-description-gap: calc(24 * var(--ax-mf-unit));
  --ax-mf-bank-ratio: 1 / 0.4677;
  --ax-mf-solution-ratio: 1 / 1.3846;
  --ax-mf-review-video-ratio: 1 / 0.5651;
  --ax-mf-accordion-media-ratio: 1 / 0.9113;
  --ax-mf-concept-night: #090A12;
  --ax-mf-concept-night-raised: #111A30;
  --ax-mf-concept-night-text: #F6F8FF;
  --ax-mf-concept-night-muted: #C4CEE3;
  --ax-mf-concept-halo: color-mix(in srgb, var(--ax-mf-accent) 9%, transparent);
  --ax-mf-concept-halo-soft: color-mix(in srgb, var(--ax-mf-accent) 4%, transparent);
  --ax-mf-concept-outline: color-mix(in srgb, var(--ax-mf-accent-strong) 12%, transparent);
  --ax-mf-concept-shadow-card: 0 18px 50px rgba(16, 37, 85, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.95);
  --ax-mf-concept-shadow-control: 0 8px 24px rgba(0, 79, 255, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.35);
  --ax-mf-concept-shadow-dark: 0 18px 52px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.15);
  --ax-mf-concept-stars: url("/assets/design-system/cosmic/stars.svg");
}

/* Observed Mathflat reference metrics at max-width 1900px; explicit opt-in only. */
@media (max-width: 1900px) {
  [data-ax-ds="mathflat"][data-ax-ds-metrics="reference"] {
    --ax-mf-unit: 0.0526vw;
  }
}

/* Observed Mathflat reference metrics at max-width 1680px; explicit opt-in only. */
@media (max-width: 1680px) {
  [data-ax-ds="mathflat"][data-ax-ds-metrics="reference"] {
    --ax-mf-section-space: calc(180 * var(--ax-mf-unit));
  }
}

/* Observed Mathflat reference metrics at max-width 1480px; explicit opt-in only. */
@media (max-width: 1480px) {
  [data-ax-ds="mathflat"][data-ax-ds-metrics="reference"] {
    --ax-mf-unit: 0.06756756756756757vw;
    --ax-mf-font-size-01: calc(60 * var(--ax-mf-unit));
    --ax-mf-font-size-02: calc(54 * var(--ax-mf-unit));
    --ax-mf-font-size-03: calc(46 * var(--ax-mf-unit));
    --ax-mf-font-size-04: calc(38 * var(--ax-mf-unit));
    --ax-mf-font-size-05: calc(30 * var(--ax-mf-unit));
    --ax-mf-container-wide: none;
    --ax-mf-gutter: calc(60 * var(--ax-mf-unit));
    --ax-mf-section-space: calc(160 * var(--ax-mf-unit));
    --ax-mf-bank-width: calc(1136 * var(--ax-mf-unit));
    --ax-mf-review-height: calc(660 * var(--ax-mf-unit));
    --ax-mf-accordion-gap: calc(80 * var(--ax-mf-unit));
  }
}

/* Observed Mathflat reference metrics at max-width 1200px; explicit opt-in only. */
@media (max-width: 1200px) {
  [data-ax-ds="mathflat"][data-ax-ds-metrics="reference"] {
    --ax-mf-unit: 0.0833333333333333vw;
    --ax-mf-font-size-01: calc(56 * var(--ax-mf-unit));
    --ax-mf-font-size-02: calc(50 * var(--ax-mf-unit));
    --ax-mf-font-size-03: calc(42 * var(--ax-mf-unit));
    --ax-mf-font-size-04: calc(34 * var(--ax-mf-unit));
    --ax-mf-font-size-05: calc(28 * var(--ax-mf-unit));
    --ax-mf-font-size-06: calc(24 * var(--ax-mf-unit));
    --ax-mf-font-size-07: calc(22 * var(--ax-mf-unit));
    --ax-mf-gutter: calc(40 * var(--ax-mf-unit));
    --ax-mf-section-space: calc(140 * var(--ax-mf-unit));
    --ax-mf-heading-gap: calc(70 * var(--ax-mf-unit));
    --ax-mf-bank-width: calc(896 * var(--ax-mf-unit));
    --ax-mf-accordion-gap: calc(60 * var(--ax-mf-unit));
  }
}

/* Observed Mathflat reference metrics at max-width 860px; explicit opt-in only. */
@media (max-width: 860px) {
  [data-ax-ds="mathflat"][data-ax-ds-metrics="reference"] {
    --ax-mf-unit: 0.13020833333333335vw;
    --ax-mf-font-size-01: calc(52 * var(--ax-mf-unit));
    --ax-mf-font-size-02: calc(46 * var(--ax-mf-unit));
    --ax-mf-font-size-03: calc(38 * var(--ax-mf-unit));
    --ax-mf-font-size-04: calc(30 * var(--ax-mf-unit));
    --ax-mf-font-size-05: calc(26 * var(--ax-mf-unit));
    --ax-mf-font-size-06: calc(22 * var(--ax-mf-unit));
    --ax-mf-font-size-07: calc(20 * var(--ax-mf-unit));
    --ax-mf-font-size-08: calc(18 * var(--ax-mf-unit));
    --ax-mf-font-size-09: calc(16 * var(--ax-mf-unit));
    --ax-mf-font-size-10: calc(15 * var(--ax-mf-unit));
    --ax-mf-font-size-11: calc(13 * var(--ax-mf-unit));
    --ax-mf-font-size-12: calc(12 * var(--ax-mf-unit));
    --ax-mf-gutter: calc(30 * var(--ax-mf-unit));
    --ax-mf-section-space: calc(120 * var(--ax-mf-unit));
    --ax-mf-heading-gap: calc(60 * var(--ax-mf-unit));
    --ax-mf-bank-width: calc(636 * var(--ax-mf-unit));
    --ax-mf-bank-slide-half-gap: calc(8 * var(--ax-mf-unit));
    --ax-mf-review-height: calc(543 * var(--ax-mf-unit));
    --ax-mf-review-padding-x: calc(30 * var(--ax-mf-unit));
    --ax-mf-review-padding-top: calc(30 * var(--ax-mf-unit));
    --ax-mf-review-padding-bottom: calc(50 * var(--ax-mf-unit));
    --ax-mf-solution-gap: calc(16 * var(--ax-mf-unit));
    --ax-mf-accordion-gap: calc(40 * var(--ax-mf-unit));
  }
}

/* Observed Mathflat reference metrics at max-width 540px; explicit opt-in only. */
@media (max-width: 540px) {
  [data-ax-ds="mathflat"][data-ax-ds-metrics="reference"] {
    --ax-mf-unit: 0.2564102564102564vw;
    --ax-mf-font-size-01: calc(48 * var(--ax-mf-unit));
    --ax-mf-font-size-02: calc(40 * var(--ax-mf-unit));
    --ax-mf-font-size-03: calc(32 * var(--ax-mf-unit));
    --ax-mf-font-size-04: calc(26 * var(--ax-mf-unit));
    --ax-mf-font-size-05: calc(22 * var(--ax-mf-unit));
    --ax-mf-font-size-06: calc(20 * var(--ax-mf-unit));
    --ax-mf-font-size-07: calc(17 * var(--ax-mf-unit));
    --ax-mf-font-size-08: calc(16 * var(--ax-mf-unit));
    --ax-mf-font-size-09: calc(15 * var(--ax-mf-unit));
    --ax-mf-font-size-10: calc(14 * var(--ax-mf-unit));
    --ax-mf-font-size-11: calc(12 * var(--ax-mf-unit));
    --ax-mf-font-size-12: calc(11 * var(--ax-mf-unit));
    --ax-mf-line-height-04: 1.5;
    --ax-mf-line-height-05: 1.5;
    --ax-mf-line-height-06: 1.3;
    --ax-mf-line-height-07: 1.4;
    --ax-mf-line-height-10: 1.5;
    --ax-mf-line-height-11: 1.5;
    --ax-mf-line-height-12: 1.5;
    --ax-mf-gutter: calc(21 * var(--ax-mf-unit));
    --ax-mf-section-space: calc(100 * var(--ax-mf-unit));
    --ax-mf-heading-gap: calc(40 * var(--ax-mf-unit));
    --ax-mf-bank-width: calc(318 * var(--ax-mf-unit));
    --ax-mf-bank-slide-half-gap: calc(6 * var(--ax-mf-unit));
    --ax-mf-bank-radius: calc(8 * var(--ax-mf-unit));
    --ax-mf-review-height: calc(335 * var(--ax-mf-unit));
    --ax-mf-review-radius: calc(10 * var(--ax-mf-unit));
    --ax-mf-review-padding-x: calc(20 * var(--ax-mf-unit));
    --ax-mf-review-padding-top: calc(20 * var(--ax-mf-unit));
    --ax-mf-review-padding-bottom: calc(24 * var(--ax-mf-unit));
    --ax-mf-solution-gap: calc(14 * var(--ax-mf-unit));
    --ax-mf-solution-radius: calc(8 * var(--ax-mf-unit));
    --ax-mf-accordion-gap: calc(20 * var(--ax-mf-unit));
    --ax-mf-accordion-radius: calc(8 * var(--ax-mf-unit));
    --ax-mf-bank-ratio: 1 / 1.4465;
  }
}