/* Mind the Mistake — guided inductive learning (22 codes) */
.app .discovery {
  --discover-blue: #347bd5;
  --discover-ink: #243f70;
  --discover-green: #248a68;
  --discover-paper: #edf1ef;
  --discover-line: #d0dfe4;
  font-family: 'Nunito', sans-serif;
}
.app .discovery__intro {
  margin: 0 0 24px;
  border-radius: 17px;
  background: linear-gradient(105deg,#e2ecee,#eae6f2);
  border: 2px solid #d2dfe5;
  padding: 17px 20px;
}
.app .discovery__intro p {
  font: 800 .94rem/1.55 'Nunito',sans-serif;
  color:#486589;margin: 7px 0 0;
}
.app .discovery__badge {
  display: inline-block;
  padding: 6px 12px; border-radius: 99px;
  background:#dee4fb;color:#5542a0;
  font:900 .74rem 'Nunito',sans-serif;letter-spacing:.06em;
}
.app .discovery__roadmap {
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));
  gap:6px;margin: 0 0 22px;
}
.app .discovery__step {
  position:relative;min-width:0;
  border:2px solid #d4e0e7;
  color:#7286a2;background:#e9eeee;
  padding:11px 4px;border-radius:12px;
  font:900 .76rem/1.3 'Nunito',sans-serif;
  display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;
  cursor:pointer;transition:background .15s,transform .15s;
}
.app .discovery__step span[aria-hidden] {font-size:1.16rem;}
.app .discovery__step:disabled {cursor:not-allowed;opacity:.52;}
.app .discovery__step:not(:disabled):hover {transform:translateY(-2px);background:#e2eaf2;}
.app .discovery__step.is-active {
  border-color: #5374da;
  background: linear-gradient(110deg,#357ce1,#7560c8);
  color:#fff;box-shadow:0 4px 0 #cdd6eb;
}
.app .discovery__step.is-done:not(.is-active) {border-color:#9dcdbc;color:#196f59;background:#e2f0e9;}
.app .discovery__sheet {
  border:2px solid #d3e1e5;border-radius:19px;
  background:#f0f2ef;padding:23px 24px;
  box-shadow: 0 6px 0 rgba(53,104,142,.06);
}
.app .discovery__topline {
  font:900 .77rem/1.4 'Nunito',sans-serif;
  letter-spacing:.12em;text-transform:uppercase;
  color:#7964b0;display:block;margin:0 0 8px;
}
.app .discovery__title {
  font:700 clamp(1.35rem,3.2vw,1.84rem)/1.2 'Fredoka','Nunito',sans-serif;
  color:#26466f;margin:0 0 11px;
}
.app .discovery__lead {
  font:700 .97rem/1.65 'Nunito',sans-serif;
  color:#4c6284;margin:0 0 17px;
}
.app .discovery__examples {display:grid;gap:12px;margin:18px 0;}
.app .discovery__pair {
  display:grid;grid-template-columns:38px 1fr 1fr;
  align-items:stretch;gap:8px;min-width:0;
}
.app .discovery__pair-label {
  display:grid;place-items:center;align-self:center;
  background:#e2def7;color:#5f51b5;
  border:1px solid #cac7eb;border-radius:11px;
  height:37px;width:37px;
  font:900 .82rem 'Nunito',sans-serif;
}
.app .discovery__sentence {
  border:2px solid #d7e3ea;border-radius:12px;
  background:#f8f6f0;color:#344c73;
  padding:17px 15px;
  font:800 .97rem/1.5 'Nunito',sans-serif;
  display:flex;align-items:center;justify-content:flex-start;
  overflow-wrap:anywhere;
}
.app .discovery__sentence:nth-child(3) {background:#e6edf0;border-color:#d5e1e6;}
.app .discovery__notice {
  margin:18px 0;padding:14px 16px;
  border-radius:13px;background:#f2e8cb;
  color:#7b6240;border-left:5px solid #dbb35e;
  font:800 .91rem/1.6 'Nunito',sans-serif;
}
.app .discovery__actions {display:flex;gap:11px;flex-wrap:wrap;margin-top:20px;}
.app .discovery__button {
  border:0;cursor:pointer;
  border-radius:13px;padding:13px 20px;min-height:44px;
  font:900 .87rem/1.3 'Nunito',sans-serif;
  background:linear-gradient(110deg,#267bd9,#7160d0);
  color:#fff;
  box-shadow:0 4px 0 rgba(51,70,153,.19);
  transition:transform .14s, filter .14s;
}
.app .discovery__button:hover:not(:disabled) {transform:translateY(-2px);filter:brightness(1.05);}
.app .discovery__button:disabled {opacity:.45;cursor:not-allowed;}
.app .discovery__button--soft {background:#dce8ef;color:#365d87;box-shadow:none;border:2px solid #c9dbe8;}
.app .discovery__button--green {background:linear-gradient(105deg,#1e986f,#46b4a1);}
.app .discovery__card {
  background:#f6f5f0;border:2px solid #d9e3e4;
  border-radius:16px;padding:19px 20px;
  margin:13px 0;
}
.app .discovery__card h4 {
  font:700 1.09rem/1.4 'Fredoka','Nunito',sans-serif;
  color:#28466e;margin:0 0 12px;
}
.app .discovery__choices {
  display:grid;gap:9px;
}
.app .discovery__choice {
  width:100%;text-align:left;
  background:#eaf0f1;color:#3e5b7c;
  border:2px solid #d3e0e6;border-radius:11px;
  padding:12px 14px;
  font:800 .88rem/1.5 'Nunito',sans-serif;
  cursor:pointer;transition:background .15s;
  overflow-wrap:anywhere;
}
.app .discovery__choice:hover:not(:disabled) {border-color:#8fb7de;background:#e0ecf2;}
.app .discovery__choice.is-correct {background:#d8eee4;border-color:#7abf9d;color:#195f46;}
.app .discovery__choice.is-wrong {background:#f4e5e8;border-color:#dfacb8;color:#8e4358;}
.app .discovery__choice:disabled {cursor:default;}
.app .discovery__feedback {
  margin:12px 0 0;
  padding:12px 15px;border-radius:12px;
  font:800 .88rem/1.45 'Nunito',sans-serif;
}
.app .discovery__feedback.is-correct {color:#1b7455;background:#dfefe7;}
.app .discovery__feedback.is-wrong {color:#915169;background:#f4e6e9;}
.app .discovery__progress {
  font:900 .85rem 'Nunito',sans-serif;color:#5f78a0;margin:12px 0 15px;
}
.app .discovery__textarea {
  display:block;width:100%;resize:vertical;min-height:130px;
  background:#f8f6f0; color:#344d70;
  border:2px solid #cadde3;border-radius:13px;
  padding:15px 17px;font:800 .98rem/1.55 'Nunito',sans-serif;
}
.app .discovery__textarea:focus {border-color:#6094cf;outline:3px solid #d9e8ee;}
.app .discovery__hypothesis-sample {
  margin-top:12px;font:800 .78rem/1.5 'Nunito',sans-serif;color:#8790a7;
}
.app .discovery__alert {color:#a0465e;background:#f3e5e7;border-radius:10px;padding:10px 14px;font-weight:900;}
.app .discovery__reflection {
  margin:0 0 20px;
  padding:17px 18px;
  border-radius:15px;border:2px solid #c9dce7;
  background:#e3ecf0;
}
.app .discovery__reflection h3 {margin:0 0 7px;color:#385f87;font:700 1.05rem 'Fredoka',sans-serif;}
.app .discovery__reflection blockquote {
  margin:0 0 10px;padding:0;
  font:800 .95rem/1.55 'Nunito',sans-serif;color:#426281;
  white-space:pre-wrap;overflow-wrap:anywhere;
}
.app .discovery__reflection p {margin:0;color:#6883a0;font:800 .82rem/1.5 'Nunito',sans-serif;}
.app .discovery__rule-head {display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin:18px 0 10px;}
.app .discovery__rule-head h3 {margin:0;font:700 1.25rem 'Fredoka',sans-serif;color:#344d78;}
.app .discovery__practice {
  border:2px solid #d9e3e4;background:#f6f5f0;
  border-radius:14px;padding:16px 17px;margin-bottom:21px;
}
.app .discovery__practice h3 {margin:0 0 8px;color:#345379;font:700 1.1rem 'Fredoka',sans-serif;}
.app .discovery__practice p {margin:0;font:700 .88rem/1.5 'Nunito',sans-serif;color:#6e82a0;}
.app .discovery__practice-selector {
  display:flex;flex-wrap:wrap;gap:8px;margin:15px 0 19px;
}
.app .discovery__practice-selector button {
  flex:1 1 170px;border-radius:12px;border:2px solid #d5dfe8;
  background:#e9eff1;color:#527196;
  padding:12px;cursor:pointer;font:900 .9rem 'Nunito',sans-serif;
}
.app .discovery__practice-selector button.is-selected {background:#3f7bd3;color:#fff;border-color:#3f7bd3;}
@media(max-width:570px) {
  .app .discovery__roadmap {gap:4px;}
  .app .discovery__step {font-size:.61rem;padding:9px 1px;border-radius:9px;}
  .app .discovery__step span[aria-hidden] {font-size:1rem;}
  .app .discovery__intro {padding:12px 14px;}
  .app .discovery__sheet {padding:15px 13px;border-radius:15px;}
  .app .discovery__pair {grid-template-columns:29px 1fr 1fr;gap:5px;}
  .app .discovery__pair-label {width:29px;height:31px;border-radius:8px;font-size:.68rem;}
  .app .discovery__sentence {padding:10px 8px;font-size:.79rem;line-height:1.45;}
  .app .discovery__card {padding:14px 11px;}
  .app .discovery__choice {font-size:.84rem;}
}

/* Align the homepage pathway with the five inductive phases. */
.pop-path { grid-template-columns: repeat(5, minmax(0,1fr)); }
@media(max-width:520px){ .pop-path__step { font-size:.57rem; } }
