/* Shared overview hierarchy. Session, lesson, and settings controls keep their
   own styles; these rules only refine the Learn/Practice entry surfaces. */
body.ls-learn-practice-shell {
  --ls-overview-ink: #101827;
  --ls-overview-muted: #58667a;
  --ls-overview-line: rgba(30, 43, 68, 0.09);
  --ls-overview-hover: #f0f7f5;
  --ls-overview-accent: #087f6d;
  --ls-overview-blue: #2563bd;
  --ls-overview-orange: #b85d19;
  --ls-overview-violet: #8050b2;
}

html.ls-dark-mode body.ls-learn-practice-shell {
  --ls-overview-ink: #eef4fa;
  --ls-overview-muted: #b3c0d0;
  --ls-overview-line: rgba(203, 214, 232, 0.08);
  --ls-overview-hover: #172b30;
  --ls-overview-accent: #65d6c1;
  --ls-overview-blue: #8bb8fa;
  --ls-overview-orange: #f0ad79;
  --ls-overview-violet: #c1a2ec;
}

html:root body.ls-learn-practice-shell :is(.ls-learn-heading, .ls-practice-heading) {
  margin-bottom: 1.25rem;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.ls-learn-practice-shell :is(.ls-learn-heading, .ls-practice-heading) h1 {
  max-width: none;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.2;
  text-wrap: balance;
}

body.ls-learn-practice-shell :is(.ls-learn-heading, .ls-practice-heading) p {
  margin-top: 0.5rem;
  color: var(--ls-overview-muted) !important;
  font-size: 1rem;
  line-height: 1.5;
}

body.ls-learn-practice-shell :is(.ls-learn-topic-copy, .ls-practice-next-copy) h2 {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.2;
  text-wrap: balance;
  overflow-wrap: anywhere;
}

body.ls-learn-practice-shell :is(.ls-learn-eyebrow, .ls-practice-eyebrow) {
  color: var(--ls-overview-accent) !important;
  font-size: 0.75rem;
  font-weight: 700;
}

body.ls-learn-practice-shell :is(.ls-learn-topic-description, .ls-practice-stat) {
  color: var(--ls-overview-muted) !important;
  line-height: 1.55;
}

body.ls-learn-practice-shell .ls-practice-stat-due {
  color: var(--ls-overview-accent) !important;
}

body.ls-learn-practice-shell :is(.ls-learn-topic-hero, .ls-practice-next-session) {
  border-color: var(--ls-overview-line) !important;
  box-shadow: none !important;
}

body.ls-learn-practice-shell :is(.ls-practice-due-row, .ls-practice-latest-topic) {
  border-color: var(--ls-overview-line) !important;
  background: transparent;
  box-shadow: none !important;
}

/* Small tools are quiet, predictable hit targets rather than floating cards. */
html:root body.ls-learn-practice-shell :is(.ls-learn-page, .ls-practice-page)
  :is(.ls-learn-assist-card, .ls-learn-utility-card, .ls-practice-utility-card) {
  border-color: var(--ls-overview-line) !important;
  background: transparent;
  box-shadow: none !important;
  transform: none;
  transition: background-color 160ms ease, border-color 160ms ease;
}

html:root body.ls-learn-practice-shell :is(.ls-learn-page, .ls-practice-page)
  :is(.ls-learn-assist-card, .ls-learn-utility-card, .ls-practice-utility-card):hover {
  border-color: var(--ls-overview-accent) !important;
  background: var(--ls-overview-hover);
  transform: none;
}

body.ls-learn-practice-shell :is(.ls-learn-assist-card, .ls-learn-utility-card) {
  grid-template-columns: 1.75rem minmax(0, 1fr);
  gap: 0.75rem;
  padding: 1.25rem 1rem 2rem;
}

body.ls-learn-practice-shell .ls-practice-utility-card {
  min-height: 11.5rem;
  padding: 1.25rem 1.25rem 2.5rem;
}

body.ls-learn-practice-shell :is(.ls-learn-assist-icon, .ls-learn-utility-icon,
  .ls-practice-utility-icon, .ls-practice-due-icon) {
  width: 1.75rem;
  height: 1.75rem;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--ls-overview-accent) !important;
}

body.ls-learn-practice-shell :is(.ls-learn-assist-icon.is-blue,
  .ls-learn-utility-icon-blue, .ls-practice-utility-icon-blue) {
  color: var(--ls-overview-blue) !important;
}

body.ls-learn-practice-shell :is(.ls-learn-assist-icon.is-orange,
  .ls-learn-utility-icon-orange, .ls-practice-utility-icon-orange) {
  color: var(--ls-overview-orange) !important;
}

body.ls-learn-practice-shell :is(.ls-learn-assist-icon.is-violet,
  .ls-learn-utility-icon-violet, .ls-practice-utility-icon-violet) {
  color: var(--ls-overview-violet) !important;
}

body.ls-learn-practice-shell :is(.ls-learn-assist-copy strong,
  .ls-learn-utility-card h3, .ls-practice-utility-card h3) {
  color: var(--ls-overview-ink) !important;
  font-size: 1rem;
  font-weight: 650;
  line-height: 1.35;
}

body.ls-learn-practice-shell :is(.ls-learn-assist-copy > span,
  .ls-learn-utility-card p, .ls-practice-utility-card p) {
  max-width: none;
  color: var(--ls-overview-muted) !important;
  font-size: 0.875rem;
  line-height: 1.5;
}

body.ls-learn-practice-shell .ls-practice-due-row {
  min-height: 5.5rem;
}

body.ls-learn-practice-shell .ls-practice-due-count {
  font-variant-numeric: tabular-nums;
}

/* Outrank legacy generic dark buttons without changing assessment controls. */
html:root body.ls-learn-practice-shell :is(.ls-learn-topic-actions, .ls-practice-next-copy,
  .ls-practice-topic-actions) :is(.ls-learn-primary-action, .ls-practice-primary-action) {
  min-height: 2.875rem;
  border-color: #087f6d !important;
  background: #087f6d;
  color: #ffffff !important;
  box-shadow: none;
  transform: none;
}

html:root body.ls-learn-practice-shell :is(.ls-learn-topic-actions, .ls-practice-next-copy,
  .ls-practice-topic-actions) :is(.ls-learn-primary-action, .ls-practice-primary-action) > span {
  color: inherit !important;
}

html:root body.ls-learn-practice-shell :is(.ls-learn-topic-actions, .ls-practice-next-copy,
  .ls-practice-topic-actions) :is(.ls-learn-primary-action, .ls-practice-primary-action):hover {
  border-color: #066b5c !important;
  background: #066b5c;
}

html:root body.ls-learn-practice-shell :is(.ls-practice-due-row, .ls-practice-topic-actions)
  :is(.ls-practice-secondary-action, .ls-practice-outline-action) {
  min-height: 2.875rem;
  background: transparent;
  color: var(--ls-overview-accent);
  border-color: var(--ls-overview-accent) !important;
  box-shadow: none;
  transform: none;
}

html:root body.ls-learn-practice-shell :is(.ls-practice-due-row, .ls-practice-topic-actions)
  :is(.ls-practice-secondary-action, .ls-practice-outline-action) > span {
  color: inherit !important;
}

body.ls-learn-practice-shell :is(.ls-learn-assist-card, .ls-learn-utility-card,
  .ls-practice-utility-card, .ls-practice-due-row button,
  .ls-learn-topic-actions button, .ls-practice-next-copy button):focus-visible {
  outline: 2px solid var(--ls-overview-accent);
  outline-offset: 3px;
}

@media (max-width: 700px) {
  body.ls-learn-practice-shell :is(.ls-learn-heading, .ls-practice-heading) h1 {
    font-size: 1.75rem;
    text-wrap: initial;
  }

  body.ls-learn-practice-shell :is(.ls-learn-topic-copy, .ls-practice-next-copy) h2 {
    font-size: 1.75rem;
    text-wrap: initial;
  }

  body.ls-learn-practice-shell .ls-practice-utility-card {
    min-height: 9.5rem;
  }

  body.ls-learn-practice-shell .ls-practice-due-row {
    grid-template-columns: 1.75rem minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  html:root body.ls-learn-practice-shell :is(.ls-learn-assist-card,
    .ls-learn-utility-card, .ls-practice-utility-card) {
    transition: none;
  }
}
