.math-trainers-page {
  display: grid;
  gap: 18px;
  padding: 18px 0 10px;
  background:
    radial-gradient(circle at top center, rgba(255, 255, 255, 0.9), transparent 34%),
    linear-gradient(180deg, #f7f7f4 0%, #f1f4f7 100%);
}

.math-trainers-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #8a6a3b;
}

.math-trainers-lead {
  max-width: 700px;
  font-size: 18px;
  line-height: 1.6;
  color: #334155;
}

.math-trainers-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(280px, 0.9fr);
  gap: 20px;
  align-items: stretch;
}

.math-trainers-hero__main,
.math-trainers-hero__side,
.math-trainers-panel,
.math-trainers-shell {
  min-width: 0;
}

.math-trainers-panel {
  border: 1px solid #dde4ea;
  border-radius: 24px;
  padding: 22px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.98)),
    #fcfdff;
  box-shadow: 0 18px 42px rgba(71, 85, 105, 0.08);
}

.math-trainers-panel--accent,
.math-trainers-panel--hero {
  background:
    radial-gradient(circle at top right, rgba(244, 213, 170, 0.16), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 249, 251, 0.98)),
    #fffdfa;
}

.math-trainers-panel--locked {
  background:
    radial-gradient(circle at top left, rgba(148, 163, 184, 0.2), transparent 35%),
    linear-gradient(180deg, rgba(247, 248, 251, 0.97), rgba(239, 244, 249, 0.98)),
    #f8fafc;
}

.math-trainers-panel__label {
  margin-bottom: 14px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8a6a3b;
}

.math-trainers-hero__actions,
.math-trainers-mode-card__actions,
.math-trainers-shell__status,
.math-trainers-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.math-trainers-btn {
  background: linear-gradient(135deg, #c97a00, #f59e0b);
  border-color: #b96c00;
  color: #fff;
}

.math-trainers-feature-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding-left: 18px;
  color: #3b2e1f;
}

.math-trainers-lock {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, 0.8fr);
  gap: 20px;
  align-items: center;
  padding: 28px;
  border-radius: 28px;
  background:
    linear-gradient(125deg, rgba(255, 246, 227, 0.95), rgba(241, 245, 249, 0.95)),
    #fff;
  border: 1px solid #ecd9b8;
}

.math-trainers-lock__badge,
.math-trainers-status {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid #d7dde4;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #6f5733;
}

.math-trainers-lock-card {
  display: grid;
  gap: 10px;
  padding: 20px;
  border-radius: 24px;
  background: #1f2937;
  color: #f8fafc;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

.math-trainers-lock-card span {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.08);
  text-transform: lowercase;
}

.math-trainers-grid,
.math-trainers-family-list,
.math-trainers-shell-preview__layout,
.math-trainers-shell__body {
  display: grid;
  gap: 18px;
}

.math-trainers-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.math-trainers-mode-card__head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

.math-trainers-chip {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #dbe3ea;
  color: #526170;
  font-size: 14px;
  text-decoration: none;
}

.math-trainers-chip.is-active {
  border-color: #d89a39;
  background: #fff7e6;
  color: #8a5200;
}

.math-trainers-family-list {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.math-trainers-family-link,
.math-trainers-submode-card {
  display: grid;
  gap: 8px;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid #eadfce;
  background: rgba(255, 255, 255, 0.82);
  color: #3b2e1f;
  text-decoration: none;
}

.math-trainers-family-link strong,
.math-trainers-submode-card h3 {
  color: #24180a;
}

.math-trainers-family-link span,
.math-trainers-submode-card p {
  margin: 0;
  color: #5b4a35;
}

.math-trainers-submode-card.is-active {
  border-color: #d89a39;
  box-shadow: 0 18px 40px rgba(184, 119, 10, 0.14);
}

.math-trainers-submode-card.is-clickable {
  cursor: pointer;
  transition: transform 140ms ease, box-shadow 140ms ease, border-color 140ms ease;
}

.math-trainers-submode-card.is-clickable:hover,
.math-trainers-submode-card.is-clickable:focus-visible {
  outline: none;
  transform: translateY(-2px);
  border-color: #d89a39;
  box-shadow: 0 18px 40px rgba(184, 119, 10, 0.14);
}

.math-trainers-submode-card__head,
.math-trainers-live__head {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  align-items: flex-start;
}

.math-trainers-breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-left: 6px;
  color: #6b7280;
  font-size: 14px;
}

.math-trainers-breadcrumbs a {
  color: #9a5d00;
  text-decoration: none;
}

.math-trainers-shell-preview {
  display: grid;
  gap: 16px;
}

.math-trainers-shell-preview__layout {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.math-trainers-shell-preview__col {
  padding: 16px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid #eadfce;
}

.math-trainers-shell {
  display: grid;
  gap: 18px;
}

.math-trainers-shell__intro {
  max-width: 720px;
  margin: 10px 0 0;
  color: #556273;
  line-height: 1.6;
}

.math-trainers-shell__top {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  padding: 16px 18px;
  border-radius: 28px;
  background:
    radial-gradient(circle at top right, rgba(241, 228, 203, 0.2), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 248, 251, 0.98)),
    #fff;
  border: 1px solid #dde4ea;
  box-shadow: 0 18px 48px rgba(71, 85, 105, 0.06);
}

.math-trainers-shell__body {
  grid-template-columns: minmax(250px, 320px) minmax(0, 1fr);
}

.math-trainers-shell__sidebar {
  display: grid;
  gap: 14px;
}

.math-trainers-workspace {
  min-height: 0;
}

.math-trainers-workspace__stage {
  display: block;
  min-height: 0;
  border-radius: 24px;
  border: 1px dashed #ccd7e1;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(247, 249, 252, 0.92)),
    #fff;
  padding: 24px;
}

.math-trainers-workspace__empty,
.math-trainers-workspace__locked {
  max-width: 540px;
}

.math-trainers-live {
  display: grid;
  gap: 14px;
  width: 100%;
}

.math-trainers-live__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.math-trainers-live__feedback {
  min-height: 24px;
  color: #455468;
}

.math-trainers-live__feedback[data-status="ok"],
[data-math-shell-last-feedback][data-status="ok"] {
  color: #166534;
}

.math-trainers-live__feedback[data-status="error"],
[data-math-shell-last-feedback][data-status="error"] {
  color: #b91c1c;
}

.math-trainers-shell-done {
  text-align: center;
  padding: 32px 16px;
}

.math-trainers-assignment-links {
  margin-top: 14px;
}

.math-trainers-assignment-links__list {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.math-trainers-assignment-links__item {
  display: block;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(220, 230, 243, 0.5);
  color: #17365d;
  text-decoration: none;
  font-size: 14px;
  line-height: 1.3;
}

.math-trainers-assignment-links__item.is-active {
  background: rgba(191, 219, 254, 0.72);
  color: #0f3a6a;
  font-weight: 700;
}

.math-trainers-session-meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
}

.math-trainers-session-meta strong {
  display: block;
  margin-top: 4px;
  color: #253140;
}

.math-trainers-fractions-page {
  display: grid;
  gap: 18px;
}

.math-trainers-fractions-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(249, 247, 242, 1) 100%);
  border: 1px solid #ded8cb;
  border-radius: 30px;
  padding: 32px;
  box-shadow: 0 20px 42px rgba(69, 56, 34, 0.08);
}

.math-trainers-fractions-prompt {
  font-size: 24px;
  font-weight: 700;
  color: #2d2412;
  margin: 0 0 12px;
}

.math-trainers-fractions-display {
  font-size: 28px;
  letter-spacing: 0.02em;
  color: #5f4c2d;
  margin-bottom: 18px;
}

.math-trainers-fractions-controls {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
  margin: 16px 0;
}

.math-trainers-fractions-input {
  min-width: 240px;
  padding: 12px 14px;
  border: 1px solid #cfd8df;
  border-radius: 14px;
  font-size: 18px;
  background: #ffffff;
}

.math-trainers-fractions-button {
  padding: 12px 18px;
  border: 0;
  border-radius: 14px;
  background: #8f6d1a;
  color: #fff;
  font-size: 16px;
  cursor: pointer;
}

.math-trainers-fractions-button[data-variant="secondary"] {
  background: #e5e9ee;
  color: #2f3b4b;
}

.math-trainers-fractions-help,
.math-trainers-fractions-progress,
.math-trainers-fractions-feedback {
  color: #566375;
}

.math-trainers-mode-card[data-math-mode-active="1"] {
  transform: translateY(-2px);
  border-color: #d89a39;
  box-shadow: 0 28px 68px rgba(184, 119, 10, 0.14);
}

.math-trainers-session-frame {
  display: grid;
  gap: 16px;
}

.math-trainers-session-frame__layout {
  display: grid;
  grid-template-columns: minmax(0, 2.2fr) minmax(250px, 0.72fr);
  gap: 18px;
  align-items: start;
}

.math-trainers-session-frame__workspace {
  display: grid;
  gap: 0;
  border: 1px solid #d9e0e7;
  border-radius: 34px;
  padding: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(245, 248, 251, 0.98)),
    #f8fafc;
  box-shadow:
    0 30px 80px rgba(71, 85, 105, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.math-trainers-session-frame__topbar {
  border: 1px solid #dfe6ed;
  padding: 18px 20px;
  background:
    radial-gradient(circle at top right, rgba(240, 230, 210, 0.14), transparent 42%),
    linear-gradient(180deg, rgba(253, 253, 252, 0.98), rgba(247, 248, 250, 0.98)),
    #fbfcfd;
}

.math-trainers-session-frame__topbar {
  border-radius: 24px 24px 18px 18px;
  box-shadow: inset 0 -1px 0 rgba(214, 221, 229, 0.85);
}

.math-trainers-session-frame__topbar,
.math-trainers-session-frame__controls,
.math-trainers-board-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

.math-trainers-session-frame__heading h2,
.math-trainers-panel h3 {
  margin: 6px 0 8px;
  color: #233041;
}

.math-trainers-session-frame__heading p,
.math-trainers-panel p {
  margin: 0;
  color: #5c6978;
}

.math-trainers-board-toolbar,
.math-trainers-board-toolbar__group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
}

.math-trainers-board-toolbar__chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid #d6dfea;
  background: rgba(255, 255, 255, 0.92);
  color: #34506d;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}

.math-trainers-board-toolbar__chip input {
  margin: 0;
  accent-color: #2a6eb3;
}

.math-trainers-board-toolbar__chip--toggle {
  color: #214f84;
}

.math-trainers-session-frame__controls {
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
}

.math-trainers-session-frame__main,
.math-trainers-session-frame__side {
  min-width: 0;
}

.math-trainers-session-frame__main {
  padding: 12px 10px 2px;
}

.math-trainers-session-frame__side {
  display: grid;
  gap: 12px;
  align-content: start;
}

.math-trainers-session-frame__side .math-trainers-panel {
  border-radius: 22px;
  padding: 16px 16px 18px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(246, 249, 252, 0.98)),
    #fcfdff;
  box-shadow: 0 14px 34px rgba(71, 85, 105, 0.07);
}

.math-trainers-workspace--board {
  min-height: 0;
  padding: 0;
  overflow: hidden;
}

.math-trainers-workspace__stage--paper {
  min-height: 0;
  padding: 16px 18px 14px;
  border: 1px solid #d8d4ca;
  border-radius: 30px;
  background:
    radial-gradient(circle at top left, rgba(255, 255, 255, 0.9), transparent 26%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(248, 250, 253, 0.99)),
    repeating-linear-gradient(
      0deg,
      rgba(126, 165, 214, 0.06) 0,
      rgba(126, 165, 214, 0.06) 1px,
      transparent 1px,
      transparent 4px
    ),
    #ffffff;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 24px 60px rgba(69, 56, 34, 0.12);
}

.math-trainers-worksheet {
  display: grid;
  gap: 0;
  min-height: 0;
}

.math-trainers-worksheet__board {
  min-height: 0;
}

.math-trainers-board-stage {
  display: grid;
  gap: 10px;
  position: relative;
}

.math-trainers-worksheet__palette-strip {
  display: grid;
  gap: 10px;
  min-height: calc(var(--board-cell, 34px) * 2.05);
  padding: 10px 12px 12px;
  border-radius: 0 0 24px 24px;
  border: 1px solid rgba(188, 201, 214, 0.72);
  border-top: 1px solid rgba(195, 207, 218, 0.58);
  background:
    linear-gradient(90deg, rgba(99, 146, 204, 0.08) 1px, transparent 1px),
    linear-gradient(180deg, rgba(99, 146, 204, 0.08) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(245, 248, 252, 0.98)),
    #fffdfa;
  background-size: 42px 42px, 42px 42px, 100% 100%, 100% 100%;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 12px 26px rgba(71, 85, 105, 0.05);
}

.math-trainers-worksheet__palette-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
}

.math-trainers-worksheet__palette-strip .math-trainers-board-toolbar {
  justify-content: flex-end;
}

.math-trainers-board-stage,
.math-trainers-board-stage__surface {
  min-height: 0;
}

.math-trainers-explain-cloud {
  position: absolute;
  top: 112px;
  right: 18px;
  z-index: 7;
  width: min(400px, calc(100% - 28px));
  max-height: min(316px, calc(100% - 28px));
  padding: 20px 22px 18px;
  border: 0;
  border-radius: 34px 40px 30px 42px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(250, 252, 255, 0.96));
  box-shadow: 0 24px 44px rgba(80, 96, 122, 0.18);
  color: #234;
  overflow: visible;
  isolation: isolate;
}

.math-trainers-explain-cloud.is-expanded {
  width: min(640px, calc(100% - 16px));
  max-height: min(560px, calc(100% - 16px));
}

.math-trainers-explain-cloud::before,
.math-trainers-explain-cloud::after {
  content: "";
  position: absolute;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(250, 252, 255, 0.96));
  border-radius: 50%;
  box-shadow: 0 18px 28px rgba(80, 96, 122, 0.12);
  z-index: 0;
}

.math-trainers-explain-cloud::before {
  width: 72px;
  height: 58px;
  left: 18px;
  bottom: -18px;
  box-shadow:
    0 18px 28px rgba(80, 96, 122, 0.12),
    54px 8px 0 -6px rgba(252, 253, 255, 0.96),
    104px 0 0 -10px rgba(251, 252, 255, 0.95);
}

.math-trainers-explain-cloud::after {
  width: 56px;
  height: 46px;
  right: 34px;
  top: -14px;
  box-shadow:
    0 14px 24px rgba(80, 96, 122, 0.1),
    -48px 10px 0 -8px rgba(252, 253, 255, 0.94);
}

.math-trainers-explain-cloud > * {
  position: relative;
  z-index: 1;
}

.math-trainers-explain-cloud[data-status="loading"] {
  color: #4c5c70;
}

.math-trainers-explain-cloud[data-status="error"] {
  color: #7b341e;
}

.math-trainers-explain-cloud[data-status="ok"] {
  color: #14532d;
}

.math-trainers-explain-cloud__close {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 999px;
  background: rgba(226, 232, 240, 0.72);
  color: #475569;
  cursor: pointer;
}

.math-trainers-explain-cloud__eyebrow {
  margin-bottom: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8a6a3b;
}

.math-trainers-explain-cloud__title {
  margin: 0 26px 8px 0;
  font-size: 18px;
  line-height: 1.25;
}

.math-trainers-explain-cloud__body {
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
  max-height: 194px;
  overflow: hidden;
}

.math-trainers-explain-cloud.is-expanded .math-trainers-explain-cloud__body {
  max-height: 420px;
  overflow: auto;
}

.math-trainers-explain-cloud__expand {
  margin-top: 12px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #2f6eab;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  text-decoration: underline;
}

.math-trainers-assignment-cloud {
  position: fixed;
  left: 24px;
  top: 108px;
  z-index: 58;
  width: min(420px, calc(100vw - 32px));
  padding: 18px 22px;
  border-radius: 34px 42px 28px 42px;
  background: linear-gradient(180deg, rgba(248, 251, 255, 0.96), rgba(238, 245, 255, 0.94));
  box-shadow: 0 18px 34px rgba(71, 94, 132, 0.18);
  color: #17365d;
  backdrop-filter: blur(2px);
  cursor: grab;
}

.math-trainers-assignment-cloud.is-dragging {
  cursor: grabbing;
}

.math-trainers-assignment-cloud__eyebrow {
  margin-bottom: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #5f7ca5;
}

.math-trainers-assignment-cloud__title {
  margin: 0;
  color: #17365d;
  font-size: 22px;
  line-height: 1.22;
  font-weight: 700;
}

.math-trainers-session-option-group {
  display: grid;
  gap: 8px;
}

.math-trainers-session-option-group + .math-trainers-session-option-group {
  margin-top: 14px;
}

.math-trainers-shell-legacy {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.math-trainers-session-frame__palette-tray {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  min-height: calc(var(--board-cell, 34px) * 2.05);
  flex: 1 1 auto;
  padding: 2px 2px 0;
  border-radius: 18px;
  border: 0;
  background: transparent;
}

.math-trainers-board {
  display: grid;
  gap: 16px;
}

.math-trainers-board__surface-wrap {
  overflow: hidden;
  padding: 10px;
  border-radius: 28px;
  border: 1px solid rgba(172, 180, 189, 0.42);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(247, 250, 253, 0.96)),
    #f8fafc;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 8px 22px rgba(71, 85, 105, 0.08);
}

.math-trainers-board__surface {
  position: relative;
  width: var(--board-width, 100%);
  height: var(--board-height, 640px);
  min-width: 100%;
  min-height: 360px;
  border-radius: 24px;
  background:
    linear-gradient(90deg, rgba(99, 146, 204, 0.14) 1px, transparent 1px),
    linear-gradient(180deg, rgba(99, 146, 204, 0.14) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(248, 251, 255, 0.99)),
    #ffffff;
  background-size:
    var(--board-cell, 34px) var(--board-cell, 34px),
    var(--board-cell, 34px) var(--board-cell, 34px),
    100% 100%,
    100% 100%;
  box-shadow:
    inset 0 0 0 1px rgba(172, 178, 185, 0.36),
    inset 0 12px 22px rgba(255, 255, 255, 0.34);
  touch-action: none;
  user-select: none;
}

.math-trainers-board__decorations,
.math-trainers-board__guides,
.math-trainers-board__zones,
.math-trainers-board__items {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.math-trainers-board__decoration,
.math-trainers-board__zone,
.math-trainers-board__item,
.math-trainers-board__ghost {
  position: absolute;
  box-sizing: border-box;
}

.math-trainers-board__decoration--text {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Segoe Print", "Comic Sans MS", cursive;
  font-size: clamp(16px, 1.8vw, 26px);
  font-weight: 700;
  color: #235d96;
}

.math-trainers-board__decoration.is-interactive {
  cursor: pointer;
  pointer-events: auto;
  border-radius: 12px;
  transition: background 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}

.math-trainers-board__decoration.is-interactive:hover {
  background: rgba(243, 217, 163, 0.28);
  box-shadow: inset 0 0 0 1px rgba(201, 131, 47, 0.24);
  transform: translateY(-1px);
}

.math-trainers-board__decoration.is-interactive.is-selected {
  background: rgba(252, 211, 77, 0.26);
  box-shadow: inset 0 0 0 2px rgba(217, 119, 6, 0.34);
}

.math-trainers-board__decoration.is-interactive.is-confirmed {
  background: rgba(134, 239, 172, 0.26);
  box-shadow: inset 0 0 0 2px rgba(22, 163, 74, 0.28);
  color: #166534;
}

.math-trainers-board__decoration--line {
  background: rgba(35, 93, 150, 0.9);
  border-radius: 999px;
}

.math-trainers-board__decoration--note {
  display: flex;
  align-items: center;
  padding-left: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #6c8fb6;
}

.math-trainers-board__zone {
  border: 1px dashed rgba(65, 124, 187, 0.34);
  border-radius: 16px;
  background: rgba(91, 151, 211, 0.06);
}

.math-trainers-board__zone-label {
  position: absolute;
  top: -20px;
  left: 2px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #5d7ea2;
}

.math-trainers-board__guide-cell {
  position: absolute;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 2px 3px;
  overflow: hidden;
  font-size: 9px;
  line-height: 1;
  color: rgba(50, 89, 129, 0.56);
  pointer-events: none;
}

.math-trainers-board__item,
.math-trainers-board__ghost,
.math-trainers-board__palette-token {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  border: 1px solid rgba(72, 116, 162, 0.16);
  background: transparent;
  box-shadow: none;
  color: #225b93;
  font-family: "Segoe Print", "Comic Sans MS", cursive;
  font-size: calc(clamp(22px, 1.8vw, 30px) * var(--math-trainers-item-scale, 1));
  font-weight: 700;
  cursor: grab;
}

.math-trainers-board__item,
.math-trainers-board__ghost {
  line-height: 1;
  pointer-events: auto;
}

.math-trainers-board__item.is-token-operator,
.math-trainers-board__ghost.is-token-operator,
.math-trainers-board__palette-token.is-token-operator {
  color: #2f6eab;
}

.math-trainers-board__item.is-token-mark,
.math-trainers-board__ghost.is-token-mark,
.math-trainers-board__palette-token.is-token-mark {
  color: #2f6eab;
}

.math-trainers-board__item.is-shrunk-above-example,
.math-trainers-board__ghost.is-shrunk-above-example {
  opacity: 0.82;
  filter: saturate(0.85);
}

.math-trainers-board__item.is-locked {
  color: #166534;
  cursor: default;
  filter: saturate(0.88);
}

.math-trainers-board__ghost {
  opacity: 0.74;
  pointer-events: none;
}

.math-trainers-board__palette-token {
  min-width: 52px;
  min-height: 52px;
  padding: 10px 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(245, 249, 255, 0.99)),
    #ffffff;
  box-shadow:
    0 8px 16px rgba(71, 85, 105, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

.math-trainers-board__palette-token-label {
  font-size: 26px;
  line-height: 1;
}

.math-trainers-board-toolbar__select {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid rgba(172, 140, 88, 0.26);
  background: rgba(255, 255, 255, 0.72);
  color: #7c5c28;
  font-size: 13px;
  font-weight: 700;
}

.math-trainers-board-toolbar__select select {
  min-width: 146px;
  padding: 8px 12px;
  border: 1px solid rgba(156, 163, 175, 0.36);
  border-radius: 999px;
  background: #fffdf8;
  color: #1f2937;
  font: inherit;
}

.math-trainers-stolbik-tutor-overlay {
  position: fixed;
  left: 24px;
  top: 120px;
  z-index: 60;
  width: min(450px, calc(100vw - 32px));
  max-height: min(72vh, 560px);
  overflow: auto;
  padding: 10px 12px;
  border-radius: 28px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background:
    linear-gradient(90deg, rgba(99, 146, 204, 0.03) 1px, transparent 1px),
    linear-gradient(180deg, rgba(99, 146, 204, 0.03) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(248, 251, 255, 0.06));
  background-size: 42px 42px, 42px 42px, 100% 100%;
  box-shadow: none;
  backdrop-filter: blur(1px);
  pointer-events: auto;
  cursor: grab;
}

.math-trainers-stolbik-tutor-overlay.is-dragging {
  cursor: grabbing;
}

.math-trainers-stolbik-tutor {
  display: grid;
  gap: 12px;
}

.math-trainers-stolbik-tutor__status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(217, 119, 6, 0.12);
  color: #92400e;
  font-size: 14px;
  font-weight: 700;
}

.math-trainers-stolbik-tutor__status[data-status="ok"] {
  background: rgba(22, 163, 74, 0.12);
  color: #166534;
}

.math-trainers-stolbik-tutor__status[data-status="error"] {
  background: rgba(220, 38, 38, 0.1);
  color: #991b1b;
}

.math-trainers-stolbik-tutor__feed {
  display: grid;
  gap: 10px;
}

.math-trainers-stolbik-tutor__entry {
  padding: 10px 12px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.04);
  box-shadow: none;
  transition: opacity 220ms ease, transform 220ms ease, filter 220ms ease;
}

.math-trainers-stolbik-tutor__entry.is-history {
  opacity: 0.54;
  transform: translateY(-6px) scale(0.96);
  filter: saturate(0.8);
}

.math-trainers-stolbik-tutor__entry[data-tone="ok"] {
  border-color: rgba(22, 163, 74, 0.24);
  color: #166534;
}

.math-trainers-stolbik-tutor__entry[data-tone="ok"] .math-trainers-stolbik-tutor__title {
  font-size: 21px;
  color: rgba(22, 163, 74, 0.92);
}

.math-trainers-stolbik-tutor__entry[data-tone="ok"] .math-trainers-stolbik-tutor__body {
  font-size: 14px;
}

.math-trainers-stolbik-tutor__entry[data-tone="error"] {
  border-color: rgba(220, 38, 38, 0.24);
  color: #991b1b;
}

.math-trainers-stolbik-tutor__eyebrow {
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #9a6a1f;
}

.math-trainers-stolbik-tutor__title {
  margin: 0 0 8px;
  font-size: 20px;
  line-height: 1.25;
  color: #172554;
}

.math-trainers-stolbik-tutor__body,
.math-trainers-stolbik-tutor__body p {
  margin: 0;
  font-size: 18px;
  white-space: pre-line;
  line-height: 1.58;
}

.math-trainers-board__item[data-token-type="line-horizontal"],
.math-trainers-board__ghost[data-token-type="line-horizontal"],
.math-trainers-board__item[data-token-type="bar"],
.math-trainers-board__ghost[data-token-type="bar"] {
  border: 0;
  border-radius: 999px;
  background: rgba(35, 93, 150, 0.92);
}

.math-trainers-board__item[data-token-type="line-vertical"],
.math-trainers-board__ghost[data-token-type="line-vertical"] {
  border: 0;
  border-radius: 999px;
  background: rgba(35, 93, 150, 0.92);
}

.math-trainers-board__palette-token[data-token-type="line-horizontal"],
.math-trainers-board__palette-token[data-token-type="bar"],
.math-trainers-board__palette-token[data-token-type="line-vertical"] {
  position: relative;
  color: transparent;
  min-width: 68px;
}

.math-trainers-board__palette-token[data-token-type="line-horizontal"] .math-trainers-board__palette-token-label,
.math-trainers-board__palette-token[data-token-type="bar"] .math-trainers-board__palette-token-label,
.math-trainers-board__palette-token[data-token-type="line-vertical"] .math-trainers-board__palette-token-label {
  color: transparent;
}

.math-trainers-board__palette-token[data-token-type="line-horizontal"]::after,
.math-trainers-board__palette-token[data-token-type="bar"]::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: calc(16px + (var(--token-span-x, 1) * 16px));
  height: 4px;
  margin-left: calc((16px + (var(--token-span-x, 1) * 16px)) / -2);
  margin-top: -2px;
  border-radius: 999px;
  background: rgba(35, 93, 150, 0.92);
}

.math-trainers-board__palette-token[data-token-type="line-vertical"]::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 4px;
  height: calc(16px + (var(--token-span-y, 1) * 16px));
  margin-left: -2px;
  margin-top: calc((16px + (var(--token-span-y, 1) * 16px)) / -2);
  border-radius: 999px;
  background: rgba(35, 93, 150, 0.92);
}

.math-trainers-board__palette-empty {
  color: #667384;
}

.math-trainers-board__surface.is-drop-active {
  box-shadow:
    inset 0 0 0 2px rgba(184, 145, 77, 0.26),
    inset 0 12px 22px rgba(255, 255, 255, 0.34);
}

.math-trainers-board--readonly .math-trainers-board__surface {
  touch-action: auto;
}

.math-trainers-board__palette-token:active,
.math-trainers-board__item:active {
  cursor: grabbing;
}

.math-trainers-english-shell {
  display: grid;
  gap: 18px;
}

.math-trainers-english-layout {
  display: grid;
  grid-template-columns: minmax(0, 2.1fr) minmax(280px, 0.9fr);
  gap: 18px;
  align-items: start;
}

.math-trainers-english-main,
.math-trainers-english-side {
  display: grid;
  gap: 18px;
}

.math-trainers-english-stage {
  display: grid;
  gap: 16px;
  border-radius: 30px;
  background:
    radial-gradient(circle at top right, rgba(247, 220, 181, 0.16), transparent 38%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(249, 247, 243, 0.99)),
    #fffdfa;
}

.math-trainers-english-stage__head,
.math-trainers-english-stage__actions,
.math-trainers-english-panel__head,
.math-trainers-cloud-modal__header,
.math-trainers-cloud-modal__footer {
  display: flex;
  gap: 14px;
  justify-content: space-between;
  align-items: flex-start;
}

.math-trainers-english-stage__actions,
.math-trainers-cloud-modal__controls {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.math-trainers-english-progress {
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid #dfd5c2;
  background: rgba(255, 249, 240, 0.92);
  color: #62492a;
  font-weight: 600;
}

.math-trainers-english-timer-panel {
  position: fixed;
  left: 18px;
  bottom: 18px;
  z-index: 65;
  display: grid;
  gap: 3px;
  width: min(18vw, 240px);
  min-width: 190px;
  padding: 10px 12px;
  border-radius: 22px;
  border: 1px solid rgba(218, 204, 180, 0.92);
  background:
    radial-gradient(circle at top left, rgba(255, 255, 255, 0.95), transparent 34%),
    linear-gradient(180deg, rgba(255, 251, 244, 0.98), rgba(247, 250, 255, 0.96)),
    #fffdfa;
  box-shadow: 0 18px 42px rgba(48, 62, 83, 0.18);
}

.math-trainers-english-timer-panel[hidden] {
  display: none;
}

.math-trainers-english-timer-panel__eyebrow {
  color: #6b7280;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.math-trainers-english-timer-panel__task {
  color: #23374f;
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
}

.math-trainers-english-timer-panel__week,
.math-trainers-english-timer-panel__meta {
  color: #546375;
  font-size: 11px;
  line-height: 1.25;
}

.math-trainers-english-task {
  display: grid;
  gap: 14px;
}

.math-trainers-english-task__targets {
  color: #6b4f1d;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.01em;
}

.math-trainers-english-task__prompt {
  position: relative;
  min-height: 190px;
  padding: 24px;
  border-radius: 26px;
  border: 1px solid #e2d4bc;
  background:
    radial-gradient(circle at top left, rgba(255, 255, 255, 0.9), transparent 26%),
    linear-gradient(180deg, rgba(255, 248, 236, 0.96), rgba(255, 255, 255, 0.98)),
    #fff8ec;
  color: #2f2a21;
  font-size: 24px;
  line-height: 1.5;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

.math-trainers-english-prompt-token {
  display: inline-block;
  position: relative;
  padding: 0 2px;
  border-bottom: 1px dashed rgba(181, 130, 39, 0.55);
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 140ms ease, box-shadow 140ms ease;
}

.math-trainers-english-prompt-token:hover,
.math-trainers-english-prompt-token.is-active {
  background: rgba(222, 186, 120, 0.22);
  box-shadow: 0 0 0 1px rgba(181, 130, 39, 0.24);
}

.math-trainers-english-prompt-tooltip {
  position: absolute;
  z-index: 5;
  max-width: min(420px, calc(100% - 18px));
  padding: 10px 12px;
  border-radius: 16px;
  background: rgba(30, 41, 59, 0.82);
  color: #f8fafc;
  backdrop-filter: blur(12px);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.22);
  font-size: 15px;
  line-height: 1.45;
}

.math-trainers-english-prompt-tooltip .is-target {
  font-weight: 800;
  color: #fde68a;
}

.math-trainers-english-prompt-tooltip__sep {
  color: rgba(226, 232, 240, 0.72);
}

.math-trainers-english-debug {
  margin-top: 4px;
  padding: 12px 14px;
  border: 1px solid #d8dce4;
  border-radius: 18px;
  background: rgba(247, 249, 252, 0.96);
  color: #334155;
}

.math-trainers-english-debug summary {
  cursor: pointer;
  font-weight: 700;
  color: #1f2937;
}

.math-trainers-english-debug__body {
  margin-top: 10px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 13px;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
}

.math-trainers-english-answer-label {
  color: #37485c;
  font-weight: 700;
}

.math-trainers-english-answer {
  width: 100%;
  min-height: 150px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid #d9dee5;
  background: #fff;
  font-size: 18px;
  line-height: 1.55;
  resize: vertical;
}

.math-trainers-english-manual-input {
  width: 100%;
  min-height: 240px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid #d9dee5;
  background: #fff;
  color: #2f2a21;
  font-size: 17px;
  line-height: 1.5;
  resize: vertical;
}

.math-trainers-english-task__controls {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.math-trainers-english-feedback,
.math-trainers-english-glossary__body,
.math-trainers-english-upload__status,
.math-trainers-english-uploads,
.math-trainers-english-current-block {
  color: #5c6978;
  line-height: 1.55;
}

.math-trainers-english-feedback {
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid #d9e1e8;
  background: rgba(247, 250, 253, 0.98);
  color: #0f172a;
  display: grid;
  gap: 14px;
}

.math-trainers-english-feedback__grade {
  display: block;
  color: #111111;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0.01em;
  margin-bottom: 8px;
}

.math-trainers-english-feedback p {
  margin: 10px 0;
}

.math-trainers-english-feedback strong {
  color: #111827;
  font-weight: 800;
}

.math-trainers-english-feedback__paragraphs {
  display: grid;
  gap: 10px;
}

.math-trainers-english-feedback__paragraphs p {
  margin: 0;
}

.math-trainers-english-feedback__section {
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(210, 221, 232, 0.95);
}

.math-trainers-english-feedback__section--problems {
  background: rgba(255, 246, 239, 0.96);
  border-color: rgba(236, 196, 158, 0.95);
}

.math-trainers-english-feedback__section--good {
  background: rgba(240, 248, 241, 0.96);
  border-color: rgba(174, 211, 182, 0.95);
}

.math-trainers-english-feedback__section--warnings {
  background: rgba(250, 247, 237, 0.96);
  border-color: rgba(222, 205, 154, 0.95);
}

.math-trainers-english-feedback__section-title {
  color: #203042;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.math-trainers-english-feedback__list {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 6px;
}

.math-trainers-english-feedback__list li {
  margin: 0;
  color: #223246;
}

.math-trainers-english-feedback__word-list {
  display: grid;
  gap: 8px;
}

.math-trainers-english-feedback__word-item {
  display: grid;
  gap: 3px;
}

.math-trainers-english-feedback__word-item strong {
  font-size: 14px;
}

.math-trainers-english-feedback__word-item span {
  color: #475569;
}

.math-trainers-english-feedback__meta-grid {
  display: grid;
  gap: 10px;
}

.math-trainers-english-feedback__meta-card {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(214, 223, 232, 0.95);
}

.math-trainers-english-feedback__meta-card span {
  color: #607284;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.math-trainers-english-feedback__meta-card strong,
.math-trainers-english-feedback__meta-card div {
  color: #172433;
}

.math-trainers-english-feedback__meta-card--answer div {
  line-height: 1.6;
}

.math-trainers-english-feedback__comparison {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #d6dde5;
}

.math-trainers-english-glossary__item,
.math-trainers-english-upload-item {
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  background: rgba(255, 255, 255, 0.92);
}

.math-trainers-english-glossary__section {
  display: grid;
  gap: 10px;
}

.math-trainers-english-glossary__title {
  color: #37485c;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.math-trainers-english-glossary__body,
.math-trainers-english-uploads,
.math-trainers-english-current-block__words {
  display: grid;
  gap: 10px;
}

.math-trainers-english-current-block__words {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.math-trainers-english-glossary__body {
  min-height: 92px;
  align-content: start;
  position: relative;
}

.math-trainers-english-glossary__item--target {
  border-color: #ead7b7;
  background:
    linear-gradient(180deg, rgba(255, 249, 238, 0.98), rgba(255, 255, 255, 0.98)),
    #fffaf2;
}

.math-trainers-english-glossary__line {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.math-trainers-english-glossary__token {
  display: inline-flex;
  align-items: center;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: rgba(255, 255, 255, 0.94);
  color: #334155;
  font-size: 14px;
  cursor: pointer;
}

.math-trainers-english-glossary__token.is-active {
  box-shadow: 0 0 0 1px rgba(181, 130, 39, 0.24);
  background: rgba(255, 248, 230, 0.96);
}

.math-trainers-english-glossary__token--target {
  border-color: #d7c18a;
  background: rgba(255, 248, 230, 0.96);
  color: #6d4c00;
}

.math-trainers-english-word-status {
  display: grid;
  gap: 14px;
}

.math-trainers-english-word-status__group {
  display: grid;
  gap: 10px;
  padding: 16px;
  border-radius: 22px;
  border: 1px solid #dee6ee;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(247, 250, 253, 0.98)),
    #fcfdff;
}

.math-trainers-english-word-stats-summary,
.math-trainers-english-stats-row {
  display: grid;
  gap: 6px;
}

.math-trainers-english-stats-row {
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  background: rgba(255, 255, 255, 0.94);
}

.math-trainers-english-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 10px;
}

.math-trainers-english-stats-card {
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid #dce4ee;
  background: rgba(255, 255, 255, 0.97);
  min-height: 108px;
}

.math-trainers-english-stats-card--problem {
  border-color: #e7b5b0;
  background: linear-gradient(180deg, rgba(255, 245, 244, 0.98), rgba(255, 255, 255, 0.98));
}

.math-trainers-english-stats-card strong {
  color: #16263a;
  font-size: 15px;
  line-height: 1.25;
}

.math-trainers-english-stats-card__score {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 13px;
  font-weight: 800;
}

.math-trainers-english-stats-card__plus {
  color: #166534;
}

.math-trainers-english-stats-card__minus {
  color: #b91c1c;
}

.math-trainers-english-stats-card__net {
  color: #475569;
}

.math-trainers-english-word-status__title {
  color: #31465d;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.math-trainers-english-word-status__body {
  display: grid;
  gap: 10px;
  min-height: 92px;
  align-content: start;
}

.math-trainers-english-status-word {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid #e0e7ef;
  background: rgba(255, 255, 255, 0.96);
}

.math-trainers-english-status-word__main {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.math-trainers-english-status-word__main strong {
  color: #25384d;
  font-size: 16px;
}

.math-trainers-english-status-toggle {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 4px 6px 4px 4px;
  border-radius: 999px;
  border: 1px solid #d7dee8;
  background: rgba(241, 245, 249, 0.96);
  color: #3f536a;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}

.math-trainers-english-status-toggle input {
  appearance: none;
  inline-size: 42px;
  block-size: 24px;
  margin: 0;
  position: relative;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, #d4dce5, #e8edf3);
  box-shadow: inset 0 1px 2px rgba(71, 85, 105, 0.12);
  cursor: pointer;
  transition: background 140ms ease;
}

.math-trainers-english-status-toggle input::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  inline-size: 18px;
  block-size: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 6px rgba(71, 85, 105, 0.18);
  transition: transform 140ms ease;
}

.math-trainers-english-status-toggle input:checked {
  background: linear-gradient(135deg, #4f9d3d, #22c55e);
}

.math-trainers-english-status-toggle input:checked::after {
  transform: translateX(18px);
}

.math-trainers-english-upload {
  display: grid;
  gap: 10px;
}

.math-trainers-english-upload__label {
  color: #36485b;
  font-weight: 700;
}

.math-trainers-english-upload input[type="file"] {
  width: 100%;
  padding: 12px;
  border-radius: 16px;
  border: 1px dashed #c6d1dc;
  background: rgba(250, 252, 255, 0.96);
}

.math-trainers-english-current-block__words {
  margin-top: 12px;
  grid-template-columns: repeat(auto-fit, minmax(120px, max-content));
}

.math-trainers-english-selected-blocks {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.math-trainers-english-selected-block {
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid #dfe6ee;
  background: rgba(255, 255, 255, 0.94);
}

.math-trainers-cloud-modal {
  position: fixed;
  inset: 0;
  z-index: 70;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.math-trainers-cloud-modal[hidden] {
  display: none;
}

.math-trainers-cloud-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(23, 35, 52, 0.42);
  backdrop-filter: blur(3px);
}

.math-trainers-cloud-modal__window {
  position: relative;
  width: min(860px, 100%);
  height: min(86vh, calc(100vh - 40px));
  max-height: min(86vh, calc(100vh - 40px));
  margin: 0;
  padding: 22px;
  border-radius: 36px;
  background:
    radial-gradient(circle at top right, rgba(255, 255, 255, 0.88), transparent 28%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 253, 0.98)),
    #fff;
  box-shadow: 0 36px 82px rgba(48, 62, 83, 0.26);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 16px;
  overflow: hidden;
}

.math-trainers-cloud-modal__window--resizable {
  min-width: min(620px, calc(100vw - 28px));
  min-height: min(460px, calc(100vh - 28px));
  max-width: min(1100px, calc(100vw - 28px));
  max-height: min(90vh, calc(100vh - 28px));
  resize: both;
}

.math-trainers-cloud-modal__window--cloud {
  border-radius: 42px 48px 36px 50px;
  background:
    radial-gradient(circle at top left, rgba(255, 255, 255, 0.96), transparent 30%),
    linear-gradient(180deg, rgba(255, 251, 244, 0.99), rgba(249, 251, 255, 0.98)),
    #fffdfa;
}

.math-trainers-cloud-modal__window--cloud::before,
.math-trainers-cloud-modal__window--cloud::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 16px 26px rgba(72, 88, 113, 0.12);
}

.math-trainers-cloud-modal__window--cloud::before {
  width: 90px;
  height: 62px;
  left: 38px;
  bottom: -18px;
}

.math-trainers-cloud-modal__window--cloud::after {
  width: 74px;
  height: 54px;
  right: 64px;
  top: -18px;
}

.math-trainers-cloud-modal__header h3,
.math-trainers-english-panel__head h3 {
  margin: 4px 0 0;
}

.math-trainers-cloud-modal__controls button {
  padding: 8px 12px;
  border: 1px solid #dbe3ea;
  border-radius: 999px;
  background: #fff;
  color: #41556d;
  cursor: pointer;
}

.math-trainers-cloud-modal__body {
  min-height: 0;
  overflow: auto;
  display: grid;
  align-content: start;
  gap: 12px;
  padding-right: 4px;
}

.math-trainers-cloud-modal__footer {
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.math-trainers-cloud-modal.is-collapsed .math-trainers-cloud-modal__body,
.math-trainers-cloud-modal.is-collapsed .math-trainers-cloud-modal__footer {
  display: none;
}

.math-trainers-cloud-modal.is-expanded .math-trainers-cloud-modal__window {
  width: min(70vw, calc(100vw - 28px));
  height: min(70vh, calc(100vh - 28px));
  max-height: min(70vh, calc(100vh - 28px));
}

.math-trainers-english-word-page-meta {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 16px;
  background: rgba(242, 246, 252, 0.92);
  color: #516074;
  font-size: 13px;
}

.math-trainers-english-word-filters {
  display: grid;
  gap: 6px;
  padding: 8px 10px;
  border-radius: 14px;
  border: 1px solid #d9e4ef;
  background: rgba(248, 251, 255, 0.96);
}

.math-trainers-english-word-filters__title {
  font-weight: 700;
  color: #31465d;
  font-size: 12px;
}

.math-trainers-english-word-filters__list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.math-trainers-english-word-filters__item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid #dbe6f1;
  background: #fff;
  color: #46576b;
  font-size: 12px;
}

.math-trainers-english-word-filters__item input,
.math-trainers-english-word-row__check input {
  accent-color: #2a6eb3;
  inline-size: 13px;
  block-size: 13px;
}

.math-trainers-english-word-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid #e0e7ef;
  background: rgba(255, 255, 255, 0.95);
}

.math-trainers-english-word-row__word {
  font-size: 14px;
  font-weight: 700;
  color: #27364a;
}

.math-trainers-english-word-row__count {
  color: #6a7481;
}

.math-trainers-english-word-row__check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #4f5d6d;
}

.math-trainers-english-word-pager {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.math-trainers-english-block-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}

.math-trainers-english-block-card {
  display: grid;
  gap: 10px;
  padding: 18px;
  border-radius: 24px;
  border: 1px solid #ebdcc7;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(252, 248, 241, 0.98)),
    #fffdfa;
}

.math-trainers-english-block-card.is-selected {
  border-color: #b8d1eb;
  box-shadow: 0 14px 28px rgba(43, 93, 151, 0.12);
}

.math-trainers-english-block-card__toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #36506c;
  font-weight: 700;
}

.math-trainers-english-block-card__toggle input,
.math-trainers-english-rule-item input {
  accent-color: #2a6eb3;
  inline-size: 15px;
  block-size: 15px;
}

.math-trainers-english-block-card__title {
  width: 100%;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid #d6e0ea;
  background: rgba(255, 255, 255, 0.98);
  color: #22364b;
  font: inherit;
  font-weight: 700;
}

.math-trainers-english-block-card__words {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.math-trainers-english-block-card__word {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  padding: 7px 10px;
  border-radius: 12px;
  border: 1px solid #e5dccd;
  background: rgba(255, 255, 255, 0.92);
  color: #49586b;
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.math-trainers-english-rules-group {
  display: grid;
  gap: 10px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid #dde4eb;
  background: rgba(251, 252, 255, 0.96);
}

.math-trainers-english-rules-group h4 {
  margin: 0;
  color: #2d4157;
}

.math-trainers-english-rules-group__list {
  display: grid;
  gap: 10px;
}

.math-trainers-english-rule-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid #e0e7ef;
  background: rgba(255, 255, 255, 0.96);
}

.math-trainers-english-rule-item__content {
  display: grid;
  gap: 4px;
  color: #506074;
  font-size: 14px;
}

.math-trainers-english-rule-item__content strong {
  color: #26374b;
}

.math-trainers-english-preview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.math-trainers-english-preview-row {
  display: flex;
  gap: 12px;
  align-items: baseline;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  background: rgba(255, 255, 255, 0.95);
}

.math-trainers-cloud-modal__body[data-english-preview-body] {
  max-height: min(70vh, 760px);
  overflow: auto;
}

@media (max-width: 980px) {
  .math-trainers-hero,
  .math-trainers-lock,
  .math-trainers-grid,
  .math-trainers-family-list,
  .math-trainers-shell-preview__layout,
  .math-trainers-shell__body,
  .math-trainers-session-frame__layout,
  .math-trainers-english-layout {
    grid-template-columns: 1fr;
  }

  .math-trainers-shell__top,
  .math-trainers-mode-card__head,
  .math-trainers-live__actions,
  .math-trainers-fractions-controls,
  .math-trainers-session-frame__topbar,
  .math-trainers-session-frame__controls,
  .math-trainers-board-toolbar,
  .math-trainers-english-stage__head,
  .math-trainers-english-stage__actions,
  .math-trainers-cloud-modal__header {
    flex-direction: column;
  }

  .math-trainers-fractions-input,
  .math-trainers-fractions-button,
  .math-trainers-session-frame__controls .btn,
  .math-trainers-english-task__controls .btn {
    width: 100%;
  }

  .math-trainers-english-preview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .math-trainers-workspace__stage--paper {
    min-height: 520px;
    padding: 18px;
  }

  .math-trainers-board-stage,
  .math-trainers-board-stage__surface,
  .math-trainers-board__surface,
  .math-trainers-worksheet {
    min-height: 0;
  }

  .math-trainers-session-frame__workspace {
    padding: 12px;
  }

  .math-trainers-session-frame__main {
    padding: 16px 8px 0;
  }

  .math-trainers-session-frame__palette-tray {
    min-height: 0;
  }

  .math-trainers-worksheet__palette-controls {
    flex-direction: column;
    align-items: stretch;
  }

  .math-trainers-board-toolbar__select {
    justify-content: space-between;
  }

  .math-trainers-board-toolbar__select select {
    min-width: 0;
    width: 100%;
  }

  .math-trainers-stolbik-tutor-overlay {
    left: 10px;
    right: 10px;
    top: auto;
    bottom: 10px;
    width: 100%;
    max-height: none;
    margin-bottom: 0;
  }

  .math-trainers-session-frame__controls .btn {
    width: 100%;
  }

  .math-trainers-english-task__prompt {
    min-height: 150px;
    font-size: 20px;
  }

  .math-trainers-explain-cloud {
    position: relative;
    top: auto;
    right: auto;
    width: 100%;
    margin-top: 12px;
  }

  .math-trainers-cloud-modal__window,
  .math-trainers-cloud-modal.is-expanded .math-trainers-cloud-modal__window {
    width: min(100vw - 20px, 100%);
    height: min(88vh, calc(100vh - 20px));
    max-height: min(88vh, calc(100vh - 20px));
    padding: 16px;
  }

  .math-trainers-english-word-page-meta {
    flex-direction: column;
    align-items: flex-start;
  }

  .math-trainers-english-word-row {
    grid-template-columns: 1fr;
  }

  .math-trainers-english-status-word {
    grid-template-columns: 1fr;
  }

  .math-trainers-english-status-toggle {
    justify-self: start;
  }

  .math-trainers-english-timer-panel {
    left: 12px;
    right: 12px;
    bottom: 12px;
    width: auto;
    min-width: 0;
  }
}

@media (max-width: 720px) {
  .math-trainers-english-preview-grid,
  .math-trainers-english-block-card__words,
  .math-trainers-english-current-block__words {
    grid-template-columns: 1fr;
  }
}