/* ============================================================
   Material 3 Design Tokens — Math Subject (数学)
   Scoped to .subject-overlay.subject-math AND body.subject-math.
   M3 deep blue seed (#2E5BBA) — structured, analytical.
   ============================================================ */

.subject-overlay.subject-math,
body.subject-math .sub-appbar,
body.subject-math .sub-chips,
body.subject-math .sub-page,
body.subject-math .stats-drawer,
body.subject-math .drawer-scrim {
  /* ---- M3 Color Tokens (Deep Blue seed #2E5BBA) ---- */
  --md-primary: #2E5BBA;
  --md-on-primary: #FFFFFF;
  --md-primary-container: #D8E2FA;
  --md-on-primary-container: #0E1F4A;

  --md-secondary: #4F607A;
  --md-on-secondary: #FFFFFF;
  --md-secondary-container: #D8E3F8;
  --md-on-secondary-container: #0B1D34;

  --md-tertiary: #8B4A6D;
  --md-on-tertiary: #FFFFFF;
  --md-tertiary-container: #FAD0E2;
  --md-on-tertiary-container: #2C0717;

  --md-error: #B3261E;
  --md-on-error: #FFFFFF;
  --md-error-container: #F9DEDC;
  --md-on-error-container: #410E0B;

  --md-success: #2E7D32;
  --md-success-container: #E8F5E9;
  --md-on-success-container: #1B5E20;

  /* Surface hierarchy (cool blue-tinted grays) */
  --md-surface: #F7F9FE;
  --md-surface-dim: #D9DDE5;
  --md-surface-bright: #F7F9FE;
  --md-surface-container-lowest: #FFFFFF;
  --md-surface-container-low: #F0F4FA;
  --md-surface-container: #EAEFF7;
  --md-surface-container-high: #E3E9F2;
  --md-surface-container-highest: #DDE4EF;

  --md-on-surface: #181C22;
  --md-on-surface-variant: #42474E;
  --md-outline: #72777F;
  --md-outline-variant: #C3C7CF;

  --md-inverse-surface: #2C3036;
  --md-inverse-on-surface: #ECF0F8;
  --md-inverse-primary: #B4C5F0;

  /* ---- Elevation ---- */
  --md-elevation-0: none;
  --md-elevation-1: 0 1px 2px rgba(10,20,50,0.30), 0 1px 3px 1px rgba(10,20,50,0.15);
  --md-elevation-2: 0 1px 2px rgba(10,20,50,0.30), 0 2px 6px 2px rgba(10,20,50,0.15);
  --md-elevation-3: 0 1px 3px rgba(10,20,50,0.30), 0 4px 8px 3px rgba(10,20,50,0.15);
  --md-elevation-4: 0 2px 3px rgba(10,20,50,0.30), 0 6px 10px 4px rgba(10,20,50,0.15);
  --md-elevation-5: 0 4px 4px rgba(10,20,50,0.30), 0 8px 12px 6px rgba(10,20,50,0.15);

  /* ---- Shape scale ---- */
  --md-shape-xs: 4px;
  --md-shape-sm: 8px;
  --md-shape-md: 12px;
  --md-shape-lg: 16px;
  --md-shape-xl: 28px;
  --md-shape-full: 9999px;

  /* ---- Motion ---- */
  --md-easing-emphasized: cubic-bezier(0.2, 0, 0, 1);
  --md-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --md-duration-short: 200ms;
  --md-duration-medium: 350ms;
  --md-duration-long: 500ms;

  /* ---- Type scale ---- */
  --md-font-display-lg: 57px/64px;
  --md-font-display-md: 45px/52px;
  --md-font-display-sm: 36px/44px;
  --md-font-headline-lg: 32px/40px;
  --md-font-headline-md: 28px/36px;
  --md-font-headline-sm: 24px/32px;
  --md-font-title-lg: 22px/28px;
  --md-font-title-md: 16px/24px;
  --md-font-title-sm: 14px/20px;
  --md-font-body-lg: 16px/24px;
  --md-font-body-md: 14px/20px;
  --md-font-body-sm: 12px/16px;
  --md-font-label-lg: 14px/20px;
  --md-font-label-md: 12px/16px;
  --md-font-label-sm: 11px/16px;
}

/* Apply background to overlay surface */
.subject-overlay.subject-math {
  background: var(--md-surface);
  color: var(--md-on-surface);
}
.subject-overlay.subject-math .sub-appbar,
.subject-overlay.subject-math .sub-chips {
  background: var(--md-surface);
  border-bottom-color: var(--md-outline-variant);
}