/* exo — exercise cards, hint folds (sequential unlock), solution fold */

.exo {
  margin: 1.2rem 0;
  padding: 0.6rem 0.9rem;
  border: 1px solid color-mix(in srgb, var(--calc-notecolor, #B45309) 35%, transparent);
  border-left: 3px solid var(--calc-notecolor, #B45309);
  border-radius: 0.35rem;
  scroll-margin-top: 5rem;
}
.exo-head p { margin: 0 0 0.4rem; }
.exo-head strong { color: var(--calc-notecolor, #B45309); }

.exo details {
  margin: 0.45rem 0;
  border-radius: 0.3rem;
}
.exo details > summary {
  cursor: pointer;
  list-style: none;
  user-select: none;
  font-size: 0.9em;
  font-weight: 600;
}
.exo details > summary::-webkit-details-marker { display: none; }
.exo details > summary::before { content: "▸ "; }
.exo details[open] > summary::before { content: "▾ "; }

/* hints: small highlight boxes */
.exo-hint {
  background: color-mix(in srgb, var(--calc-notecolor, #B45309) 6%, transparent);
  border: 1px solid color-mix(in srgb, var(--calc-notecolor, #B45309) 30%, transparent);
  padding: 0.25rem 0.6rem;
}
.exo-hint > summary { color: var(--calc-notecolor, #B45309); }

/* locked hints: unlock one by one */
.exo-hint.exo-locked > summary {
  cursor: not-allowed;
  opacity: 0.45;
}
.exo-hint.exo-locked > summary::before { content: "🔒 "; }

/* solution: closed by default, visually separated */
.exo-sol {
  border-top: 1px dashed color-mix(in srgb, var(--calc-notecolor, #B45309) 40%, transparent);
  padding: 0.35rem 0.1rem 0.1rem;
}

.exo-fold-body { margin-top: 0.3rem; }
.exo-fold-body > p:first-child { margin-top: 0; }
.exo-fold-body > p:last-child { margin-bottom: 0; }

@media print {
  .exo details > summary::before { content: ""; }
  .exo-hint.exo-locked > summary { opacity: 1; cursor: default; }
}