/* Scoped color palette; the irregular verbs app keeps its existing layout. */
html[data-theme] body.irregular-exercise-page {
  --irv-ink: #20333f;
  --irv-muted: #526470;
  --irv-line: #a2b3bb;
  --irv-surface: #ffffff;
  --irv-field: #edf2f4;
  --irv-input: #ffffff;
  --irv-coral: #a83f36;
  --irv-coral-soft: #fff0ed;
  --irv-teal: #176b5b;
  --irv-teal-soft: #e1f2eb;
  --irv-purple: #654493;
  --irv-purple-soft: #f0eafb;
  --irv-gold: #795414;
  --irv-gold-soft: #fff4d7;
  --irv-coral-fill: #f2a89d;
  --irv-teal-fill: #9fddce;
  --irv-purple-fill: #d8c8ee;
  --irv-button-ink: #20313c;
  --irv-primary-hover: #f7c0b7;
  --irv-secondary: #e8eef1;
  --irv-secondary-hover: #dce7ed;
  --irv-disabled: #e6ecef;
  --irv-placeholder: #60707a;
  --irv-correct-border: #528b79;
  --irv-wrong-border: #b06c64;
  --irv-focus: #177a69;
  color: var(--irv-ink);
  background: #edf3f2;
}

html[data-theme="dark"] body.irregular-exercise-page {
  --irv-ink: #edf3f5;
  --irv-muted: #bdcdd5;
  --irv-line: #6b8694;
  --irv-surface: #203441;
  --irv-field: #293f4c;
  --irv-input: #192e3a;
  --irv-coral: #ffb8ae;
  --irv-coral-soft: #4c3039;
  --irv-teal: #a0e5d2;
  --irv-teal-soft: #254b44;
  --irv-purple: #dfccfa;
  --irv-purple-soft: #39334c;
  --irv-gold: #f5d28c;
  --irv-gold-soft: #493f2a;
  --irv-primary-hover: #ffc8bd;
  --irv-secondary: #304956;
  --irv-secondary-hover: #3b5663;
  --irv-disabled: #293f4c;
  --irv-placeholder: #aec3cf;
  --irv-correct-border: #83c9b5;
  --irv-wrong-border: #e69b91;
  --irv-focus: #a0e5d2;
  background: #15232f;
}

html[data-theme] body.irregular-exercise-page :is(.irv-topbar,.irv-mode,.irv-group-button,.irv-question,.irv-study-card) {
  background: var(--irv-surface);
  color: var(--irv-ink);
  border-color: var(--irv-line);
}
html[data-theme] body.irregular-exercise-page :is(.irv-topbar__back,.irv-topbar__table,.irv-home__stats span,.irv-form-field,.irv-result__mistakes) {
  background: var(--irv-field);
  border-color: var(--irv-line);
}
html[data-theme] body.irregular-exercise-page .irv-mode--study { --irv-mode-fill: var(--irv-purple-fill); }
html[data-theme] body.irregular-exercise-page .irv-mode--simple { --irv-mode-fill: var(--irv-teal-fill); }
html[data-theme] body.irregular-exercise-page .irv-mode--hard { --irv-mode-fill: var(--irv-coral-fill); }
html[data-theme] body.irregular-exercise-page :is(.irv-mode__number,.irv-mode__action) {
  color: var(--irv-button-ink);
  background: var(--irv-mode-fill);
}
html[data-theme] body.irregular-exercise-page .irv-group-button:is(:hover,:focus-visible) {
  color: var(--irv-ink);
  background: var(--irv-purple-soft);
  border-color: var(--irv-purple);
}
html[data-theme] body.irregular-exercise-page .irv-form-field input {
  color: var(--irv-ink);
  background: var(--irv-input);
  border-color: var(--irv-line);
  caret-color: var(--irv-ink);
  -webkit-text-fill-color: var(--irv-ink);
}
html[data-theme] body.irregular-exercise-page .irv-form-field input::placeholder {
  color: var(--irv-placeholder);
  opacity: 1;
  -webkit-text-fill-color: var(--irv-placeholder);
}
html[data-theme] body.irregular-exercise-page .irv-form-field.is-correct {
  background: var(--irv-teal-soft);
  border-color: var(--irv-correct-border);
}
html[data-theme] body.irregular-exercise-page .irv-form-field.is-wrong {
  background: var(--irv-coral-soft);
  border-color: var(--irv-wrong-border);
}
html[data-theme] body.irregular-exercise-page .irv-feedback { color: var(--irv-ink); }
html[data-theme] body.irregular-exercise-page .irv-feedback.is-correct {
  background: var(--irv-teal-soft);
  border-color: var(--irv-correct-border);
}
html[data-theme] body.irregular-exercise-page .irv-feedback.is-wrong {
  background: var(--irv-coral-soft);
  border-color: var(--irv-wrong-border);
}
html[data-theme] body.irregular-exercise-page .irv-feedback__details .is-correct strong { color: var(--irv-teal); }
html[data-theme] body.irregular-exercise-page .irv-feedback__details .is-wrong strong { color: var(--irv-coral); }
html[data-theme] body.irregular-exercise-page .irv-study-forms > div {
  background: var(--irv-purple-soft);
  color: var(--irv-ink);
  border-color: var(--irv-purple);
}
html[data-theme] body.irregular-exercise-page .irv-result__score {
  color: var(--irv-teal);
  background: var(--irv-teal-soft);
  border-color: var(--irv-correct-border);
}
html[data-theme] body.irregular-exercise-page .button--primary {
  color: var(--irv-button-ink);
  background: var(--irv-coral-fill);
  border-color: var(--irv-coral-fill);
}
html[data-theme] body.irregular-exercise-page .button--primary:is(:hover,:focus-visible) {
  color: var(--irv-button-ink);
  background: var(--irv-primary-hover);
  border-color: var(--irv-primary-hover);
}
html[data-theme] body.irregular-exercise-page :is(.irv-question__actions,.irv-study-actions,.irv-result__actions) .button--secondary {
  color: var(--irv-ink);
  background: var(--irv-secondary);
  border-color: var(--irv-line);
}
html[data-theme] body.irregular-exercise-page .button--secondary:is(:hover,:focus-visible) {
  color: var(--irv-ink);
  background: var(--irv-secondary-hover);
  border-color: var(--irv-focus);
}
html[data-theme] body.irregular-exercise-page button:disabled {
  color: var(--irv-muted);
  background: var(--irv-disabled);
  border-color: var(--irv-line);
  opacity: 1;
}
html[data-theme] body.irregular-exercise-page :is(button,a,input):focus-visible {
  outline: 2px solid var(--irv-focus);
  outline-offset: 3px;
}