/* ===========================================================
   Linguas — Aula Virtual: lesson player styles
   Brand tokens from linguas.css (--lg-*). All classes lg-aula__*
   =========================================================== */

.lg-aula{
  max-width:920px;margin-inline:auto;
  background:#fff;border-radius:var(--lg-r);
  box-shadow:var(--lg-sh),inset 0 0 0 1px var(--lg-line);
  overflow:hidden;font-family:var(--lg-body);color:var(--lg-text);
}

/* ---------- header (classroom-style top bar) ---------- */
.lg-aula__header{background:#0E1430;color:#fff;padding:clamp(1rem,3vw,1.6rem) clamp(1.2rem,4vw,2.2rem) clamp(1.2rem,3.5vw,1.8rem);}
.lg-aula__bardots{display:flex;align-items:center;gap:7px;margin-bottom:1rem;}
.lg-aula__bardots i{width:11px;height:11px;border-radius:50%;display:block;}
.lg-aula__bardots i:nth-child(1){background:#ff5f57;}
.lg-aula__bardots i:nth-child(2){background:#febc2e;}
.lg-aula__bardots i:nth-child(3){background:#28c840;}
.lg-aula__bardots span{margin-left:auto;color:#9aa6d6;font-size:.74rem;font-weight:700;letter-spacing:.03em;}
.lg-aula__level{display:inline-block;font-family:var(--lg-display);font-weight:700;font-size:.78rem;
  letter-spacing:.05em;text-transform:uppercase;color:#9fc0ff;background:rgba(43,97,183,.30);
  padding:.3rem .8rem;border-radius:99px;margin-bottom:.6rem;}
.lg-aula__lessontitle{font-family:var(--lg-display);font-weight:800;color:#fff;
  font-size:clamp(1.4rem,3.6vw,2rem);line-height:1.1;letter-spacing:-.02em;margin:0;}
.lg-aula__lessonsub{color:#c3cdf0;margin:.5rem 0 0;font-size:.96rem;line-height:1.5;}

/* ---------- nav: progress + step list ---------- */
.lg-aula__nav{padding:clamp(1rem,3vw,1.4rem) clamp(1.2rem,4vw,2.2rem) 0;}
.lg-aula__progress{height:8px;border-radius:99px;background:var(--lg-line);overflow:hidden;margin-bottom:1rem;}
.lg-aula__progress>span{display:block;height:100%;width:0;border-radius:99px;
  background:linear-gradient(90deg,var(--lg-blue),var(--lg-coral));
  transition:width .4s cubic-bezier(.2,.7,.2,1);}
.lg-aula__steps{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.45rem;}
.lg-aula__step{margin:0;}
.lg-aula__stepbtn{display:inline-flex;align-items:center;gap:.45rem;cursor:pointer;
  font-family:var(--lg-display);font-weight:600;font-size:.84rem;color:var(--lg-muted);
  background:var(--lg-mist);border:1px solid var(--lg-line);border-radius:99px;
  padding:.35rem .8rem .35rem .4rem;transition:all .2s;line-height:1;}
.lg-aula__stepbtn:hover{border-color:var(--lg-blue);color:var(--lg-blue);}
.lg-aula__stepnum{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;
  background:#fff;box-shadow:inset 0 0 0 1px var(--lg-line);font-size:.72rem;color:var(--lg-muted);flex:0 0 auto;}
.lg-aula__step.is-active .lg-aula__stepbtn{background:var(--lg-blue);border-color:var(--lg-blue);color:#fff;
  box-shadow:0 8px 20px -10px rgba(43,97,183,.6);}
.lg-aula__step.is-active .lg-aula__stepnum{background:#fff;color:var(--lg-blue);}
.lg-aula__step.is-done .lg-aula__stepbtn{color:var(--lg-blue);border-color:var(--lg-blue-l);background:var(--lg-blue-xl);}
.lg-aula__step.is-done .lg-aula__stepnum{background:var(--lg-blue);color:#fff;box-shadow:none;}
.lg-aula__step.is-done .lg-aula__stepnum::after{content:"✓";}
.lg-aula__step.is-done .lg-aula__stepnum{font-size:.68rem;}

/* ---------- stage ---------- */
.lg-aula__stage{padding:clamp(1.2rem,4vw,2rem) clamp(1.2rem,4vw,2.2rem);min-height:200px;}
.lg-aula__blockhead{margin-bottom:1.2rem;}
.lg-aula__kicker{display:inline-block;font-family:var(--lg-display);font-weight:700;font-size:.74rem;
  letter-spacing:.06em;text-transform:uppercase;color:var(--lg-coral-d);margin-bottom:.35rem;}
.lg-aula__blocktitle{font-family:var(--lg-display);font-weight:700;color:var(--lg-ink);
  font-size:clamp(1.3rem,2.6vw,1.7rem);line-height:1.1;margin:0;}
.lg-aula__muted{color:var(--lg-muted);}
.lg-aula__hint,.lg-aula__point{color:var(--lg-muted);}
.lg-aula__point{font-family:var(--lg-display);font-weight:700;color:var(--lg-ink);font-size:1.08rem;margin:0 0 1rem;}

/* ---------- 🔊 speak button ---------- */
.lg-aula__say{display:inline-grid;place-items:center;width:36px;height:36px;flex:0 0 auto;
  border:0;cursor:pointer;border-radius:50%;background:var(--lg-blue-l);color:var(--lg-blue);
  font-size:1rem;line-height:1;transition:transform .18s,background .18s;}
.lg-aula__say:hover{background:var(--lg-blue);color:#fff;transform:translateY(-2px);}
.lg-aula__say.is-saying{animation:lg-aula-pulse .6s ease;}
@keyframes lg-aula-pulse{0%{transform:scale(1)}40%{transform:scale(1.18)}100%{transform:scale(1)}}

/* ---------- warmup ---------- */
.lg-aula__prompt{font-size:1.1rem;color:var(--lg-ink);font-weight:600;margin:0 0 1rem;}
.lg-aula__exchange,.lg-aula__promptcard{background:var(--lg-mist);border:1px solid var(--lg-line);
  border-radius:var(--lg-r-sm);padding:1rem 1.2rem;}
.lg-aula__line{margin:.2rem 0;color:var(--lg-text);}
.lg-aula__exchange .lg-aula__line:first-child,.lg-aula__promptcard .lg-aula__line:first-child{margin-top:0;}

/* ---------- vocabulary grid ---------- */
.lg-aula__vocab{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem;}
.lg-aula__card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--lg-line);
  border-radius:var(--lg-r-sm);overflow:hidden;box-shadow:var(--lg-sh-sm);transition:transform .2s,box-shadow .2s;}
.lg-aula__card:hover{transform:translateY(-3px);box-shadow:var(--lg-sh);}
.lg-aula__cardimg{width:100%;height:96px;object-fit:contain;background:var(--lg-blue-xl);padding:.8rem;}
.lg-aula__cardbody{padding:.85rem 1rem 1rem;display:flex;flex-direction:column;gap:.25rem;}
.lg-aula__cardhead{display:flex;align-items:center;gap:.5rem;justify-content:space-between;}
.lg-aula__term{font-family:var(--lg-display);font-weight:700;font-size:1.12rem;color:var(--lg-ink);line-height:1.15;}
.lg-aula__cardsub{font-size:.84rem;color:var(--lg-muted);}
.lg-aula__ipa{font-size:.82rem;color:var(--lg-blue);font-style:italic;}
.lg-aula__ex{font-size:.84rem;color:var(--lg-muted);}

/* ---------- grammar table ---------- */
.lg-aula__tablewrap{overflow-x:auto;border-radius:var(--lg-r-sm);border:1px solid var(--lg-line);}
.lg-aula__table{border-collapse:collapse;width:100%;font-size:.96rem;}
.lg-aula__table th,.lg-aula__table td{padding:.7rem 1rem;text-align:left;border-bottom:1px solid var(--lg-line);}
.lg-aula__table thead th{background:var(--lg-blue-xl);font-family:var(--lg-display);font-weight:700;color:var(--lg-ink);
  font-size:.78rem;letter-spacing:.03em;text-transform:uppercase;}
.lg-aula__table tbody tr:last-child td{border-bottom:0;}
.lg-aula__table tbody tr:nth-child(even){background:var(--lg-mist);}

/* ---------- fill-in / inputs ---------- */
.lg-aula__input{font-family:var(--lg-body);font-size:1rem;font-weight:600;color:var(--lg-ink);
  border:0;border-bottom:2px solid var(--lg-blue);background:var(--lg-blue-xl);
  border-radius:6px 6px 0 0;padding:.25rem .5rem;min-width:7ch;width:9ch;margin:0 .15rem;transition:all .18s;}
.lg-aula__input:focus{outline:none;background:#fff;box-shadow:0 0 0 2px var(--lg-blue);}
.lg-aula__input.is-ok{border-bottom-color:#16a34a;background:#e6f7ee;color:#14823c;}
.lg-aula__input.is-no{border-bottom-color:#dc2626;background:#fdeaea;color:#b42121;}
.lg-aula__fillrow{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;padding:.7rem 0;border-bottom:1px dashed var(--lg-line);}
.lg-aula__fillline{margin:0;font-size:1.06rem;line-height:2;color:var(--lg-text);flex:1;}
.lg-aula__mark{font-weight:800;font-size:1.1rem;min-width:1.2em;}
.lg-aula__mark.is-ok{color:#16a34a;}
.lg-aula__mark.is-no{color:#dc2626;}
.lg-aula__actions{display:flex;align-items:center;gap:1rem;margin-top:1.1rem;flex-wrap:wrap;}
.lg-aula__feedback{font-weight:700;color:var(--lg-ink);font-family:var(--lg-display);}

/* ---------- flashcards ---------- */
.lg-aula__flashgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.9rem;margin-top:.6rem;}
.lg-aula__flashcard{position:relative;perspective:900px;background:none;border:0;cursor:pointer;
  height:96px;padding:0;font-family:var(--lg-display);}
.lg-aula__flashface{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:.6rem;
  border-radius:var(--lg-r-sm);backface-visibility:hidden;font-weight:700;font-size:1.05rem;line-height:1.2;
  transition:transform .5s cubic-bezier(.2,.7,.2,1);box-shadow:var(--lg-sh-sm);}
.lg-aula__flashfront{background:var(--lg-blue);color:#fff;}
.lg-aula__flashback{background:var(--lg-coral);color:#fff;transform:rotateY(180deg);}
.lg-aula__flashcard.is-flipped .lg-aula__flashfront{transform:rotateY(180deg);}
.lg-aula__flashcard.is-flipped .lg-aula__flashback{transform:rotateY(360deg);}

/* ---------- word scramble ---------- */
.lg-aula__scramblerow{padding:1rem;border:1px solid var(--lg-line);border-radius:var(--lg-r-sm);margin-bottom:.9rem;background:var(--lg-mist);}
.lg-aula__scrambled{font-family:var(--lg-display);font-weight:800;font-size:1.6rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--lg-blue);}
.lg-aula__scramblehint{color:var(--lg-muted);font-size:.9rem;margin:.3rem 0 .7rem;}
.lg-aula__scramblectrl{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;}
.lg-aula__scramblectrl .lg-aula__input{width:12ch;}

/* ---------- pronunciation ---------- */
.lg-aula__drills{display:flex;flex-direction:column;gap:.5rem;}
.lg-aula__drill{display:flex;align-items:center;gap:.7rem;justify-content:space-between;
  background:var(--lg-mist);border:1px solid var(--lg-line);border-radius:var(--lg-r-sm);padding:.6rem .9rem;}
.lg-aula__drilltext{font-family:var(--lg-display);font-weight:600;font-size:1.05rem;color:var(--lg-ink);}

/* ---------- speaking ---------- */
.lg-aula__promptcard .lg-aula__line{font-family:var(--lg-display);font-weight:600;}
.lg-aula__roles{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.9rem;}
.lg-aula__role{font-size:.82rem;font-weight:700;color:var(--lg-blue);background:var(--lg-blue-l);
  border-radius:99px;padding:.3rem .85rem;}

/* ---------- quiz ---------- */
.lg-aula__quizscore{float:right;font-family:var(--lg-display);font-weight:800;color:var(--lg-blue);
  background:var(--lg-blue-l);border-radius:99px;padding:.3rem .9rem;font-size:.95rem;}
.lg-aula__quizscore.is-done{background:var(--lg-blue);color:#fff;}
.lg-aula__q{margin-bottom:1.3rem;clear:both;}
.lg-aula__qprompt{font-family:var(--lg-display);font-weight:600;font-size:1.1rem;color:var(--lg-ink);margin:0 0 .7rem;}
.lg-aula__opts{display:grid;gap:.55rem;}
.lg-aula__opt{font-family:var(--lg-display);font-weight:600;font-size:1rem;text-align:left;cursor:pointer;
  padding:.8rem 1.1rem;border-radius:var(--lg-r-sm);border:2px solid var(--lg-line);background:var(--lg-mist);
  color:var(--lg-text);transition:transform .18s,border-color .18s,background .18s;}
.lg-aula__opt:hover:not(:disabled){transform:translateY(-2px);border-color:var(--lg-blue);background:#fff;}
.lg-aula__opt:disabled{cursor:default;}
.lg-aula__opt.is-ok{background:#e6f7ee;border-color:#16a34a;color:#14823c;}
.lg-aula__opt.is-no{background:#fdeaea;border-color:#dc2626;color:#b42121;}

/* ---------- wrapup ---------- */
.lg-aula__review{margin:0 0 1.1rem;padding-left:1.3rem;}
.lg-aula__review li{margin:.35rem 0;color:var(--lg-text);}
.lg-aula__ticket{background:var(--lg-blue-xl);border:1px solid var(--lg-blue-l);border-radius:var(--lg-r-sm);padding:1rem 1.2rem;}
.lg-aula__ticketlabel{display:inline-block;font-family:var(--lg-display);font-weight:700;font-size:.72rem;
  letter-spacing:.06em;text-transform:uppercase;color:var(--lg-blue);margin-bottom:.3rem;}
.lg-aula__ticket p{margin:0;font-weight:600;color:var(--lg-ink);}

/* ---------- footer controls ---------- */
.lg-aula__footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.1rem clamp(1.2rem,4vw,2.2rem) clamp(1.2rem,4vw,1.8rem);border-top:1px solid var(--lg-line);
  background:var(--lg-cream);}
.lg-aula__counter{font-family:var(--lg-display);font-weight:700;color:var(--lg-muted);font-size:.9rem;}
.lg-aula__prev,.lg-aula__next{padding:.7rem 1.3rem;font-size:.98rem;}
.lg-aula__prev:disabled{opacity:.4;pointer-events:none;}
.lg-aula__next:disabled{opacity:.5;pointer-events:none;}

/* ---------- completion ---------- */
.lg-aula__done{text-align:center;padding:1.5rem 1rem;animation:lg-aula-rise .5s ease;}
.lg-aula__doneicon{font-size:3rem;line-height:1;margin-bottom:.6rem;}
.lg-aula__donetitle{font-family:var(--lg-display);font-weight:800;color:var(--lg-ink);
  font-size:clamp(1.4rem,3.4vw,2rem);line-height:1.1;margin:0 0 .6rem;}
.lg-aula__donetext{color:var(--lg-muted);max-width:46ch;margin:0 auto 1.4rem;line-height:1.6;}
.lg-aula__donecta{text-decoration:none;}
@keyframes lg-aula-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ---------- responsive ---------- */
@media (max-width:560px){
  .lg-aula__vocab{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));}
  .lg-aula__footer{flex-wrap:wrap;}
  .lg-aula__counter{order:-1;width:100%;text-align:center;}
  .lg-aula__steptitle{display:none;}
  .lg-aula__stepbtn{padding:.35rem;}
  .lg-aula__quizscore{float:none;display:inline-block;margin-bottom:.8rem;}
}