/* conversa (cv-) e escrita (wr-): telas da aba Praticar e painéis sobrepostos. Cores só por variáveis (tema claro e escuro). */

/* ===== conversa: escolha da situação ===== */
.cv-h,.wr-h{font-size:17px;font-weight:700}
.cv-big{font-size:20px;font-weight:700;line-height:1.25}
.cv-sc .d,.wr-row .d{color:var(--ink-2)}
@media (max-width:520px){
  .cv-sc,.wr-row{grid-template-columns:minmax(0,1fr)}
  .cv-sc>.btn,.wr-row>.btn{justify-self:start}
}

/* ===== conversa: painel ===== */
.pb.cv-pb,.pb.wr-pb{max-width:780px;width:100%;margin-inline:auto}
.pb.cv-pb{padding-bottom:0;gap:14px}
.cv-brief{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:12px 14px}
.cv-brief>summary{cursor:pointer;font-weight:700;font-size:14px;color:var(--accent-strong);list-style:none}
.cv-brief>summary::-webkit-details-marker{display:none}
.cv-brief>summary::before{content:"+ ";font-family:var(--f-mono)}
.cv-brief[open]>summary::before{content:"− "}
.cv-brief p{color:var(--ink-2);font-size:14px;margin-top:8px}
.cv-useful{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.cv-say{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface-2);border-radius:999px;padding:5px 11px;font-size:13.5px;font-weight:600;color:var(--ink);text-align:left;line-height:1.3}
.cv-say svg{width:14px;height:14px;flex:none;color:var(--accent-strong)}
.cv-say:hover{border-color:var(--accent)}
.cv-say.on{background:var(--accent-soft);border-color:var(--accent)}

/* mensagens: aluno à direita, IA à esquerda */
.cv-log{display:grid;gap:12px;align-content:start;min-height:120px;padding-top:4px}
.cv-empty{text-align:center;padding:18px 0}
.cv-row{display:grid;gap:6px;max-width:88%;min-width:0}
.cv-row.u{justify-self:end;justify-items:end}
.cv-row.a{justify-self:start;justify-items:start}
@media (max-width:520px){.cv-row{max-width:94%}}
.cv-msg{padding:10px 14px;border-radius:16px;font-size:15.5px;line-height:1.45;overflow-wrap:anywhere;min-width:0}
.cv-msg.u{background:var(--accent);color:var(--accent-ink);border-bottom-right-radius:4px}
.cv-msg.a{background:var(--surface);border:1px solid var(--line);color:var(--ink);border-bottom-left-radius:4px}
.cv-txt{display:grid;gap:6px}
.cv-txt code{font-family:var(--f-mono);font-size:13px;background:var(--surface-2);padding:1px 4px;border-radius:4px}
.cv-txt ul,.cv-txt ol{margin:0;padding-left:20px}
.cv-tools{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:8px}
.cv-tools .btn.sm{padding:5px 10px}
.cv-tr{margin-top:8px;padding-top:8px;border-top:1px dashed var(--line);color:var(--ink-2);font-size:14px}

/* correção embaixo da fala do aluno (nota amarela) */
.cv-fix{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:start;max-width:100%;text-align:left;background:color-mix(in srgb,var(--warn) 12%,var(--surface));border:1px solid color-mix(in srgb,var(--warn) 40%,var(--line));border-radius:var(--r);padding:8px 10px;font-size:13.5px;line-height:1.4;color:var(--ink-2)}
.cv-fix .en{color:var(--ink)}
.cv-fix p{display:inline;margin:0}
.cv-fix strong{color:var(--ink)}
.cv-pen{color:var(--warn);font-weight:700;line-height:1.4}

/* "digitando" */
.cv-dots,.wr-dots{display:inline-flex;gap:4px;padding:4px 0;align-items:center}
.cv-dots i,.wr-dots i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:cvdot 1s ease-in-out infinite}
.cv-dots i:nth-child(2),.wr-dots i:nth-child(2){animation-delay:.15s}
.cv-dots i:nth-child(3),.wr-dots i:nth-child(3){animation-delay:.3s}
@keyframes cvdot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}

/* barra de envio fixa no pé do painel */
.cv-bar{position:sticky;bottom:0;z-index:1;background:var(--bg);border-top:1px solid var(--line);padding:10px 0 12px;display:grid;gap:8px;margin-top:4px}
.cv-inrow{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:end}
.cv-inrow.nomic{grid-template-columns:minmax(0,1fr) auto}
.cv-inrow textarea{min-height:44px;max-height:160px;resize:none;border-radius:22px;padding:10px 16px;font-size:16px;line-height:1.4;overflow-y:auto}
.cv-inrow textarea:focus{border-color:var(--accent);outline:none}
.micbtn.cv-mic{width:44px;height:44px;box-shadow:none}
.micbtn.cv-mic svg{width:20px;height:20px}
.micbtn.cv-mic.on::after{inset:-4px;border-width:2px}
.cv-send{width:44px;height:44px;border-radius:50%;border:0;background:var(--ink);color:var(--bg);display:grid;place-items:center;padding:0;flex:none}
.cv-send svg{width:20px;height:20px}
.cv-send.stop{background:var(--live);color:#fff}
.cv-send:hover{opacity:.9}
.cv-opts{display:flex;justify-content:space-between;align-items:center;gap:8px 12px;flex-wrap:wrap}
.cv-opts .switch{font-size:13px}
.cv-hint{margin-left:auto}
@media (hover:none),(max-width:520px){.cv-hint{display:none}}
.cv-opts>.btn.sm:last-child{margin-left:auto}

/* feedback final */
.cv-final{display:grid;gap:14px;scroll-margin-top:70px}
.cv-final .answer h4,.wr-fb .answer h4{font-size:15px;margin-top:4px;color:var(--accent-strong)}

/* frases "EN :: PT" com botão Salvar (conversa e escrita) */
.cv-phr,.wr-phr{display:grid;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);overflow:hidden}
.cv-ph,.wr-ph{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border-top:1px solid var(--line)}
.cv-ph:first-child,.wr-ph:first-child{border-top:0}
.cv-ph .en,.wr-ph .en{font-size:15px;overflow-wrap:anywhere}
.cv-saved,.wr-saved{color:var(--good)!important;border-color:color-mix(in srgb,var(--good) 40%,var(--line))!important}
.btn.cv-saved[disabled],.btn.wr-saved[disabled]{opacity:1}

/* ===== escrita ===== */
.wr-task p{color:var(--ink)}
.wr-ta{min-height:220px;font-size:16px;line-height:1.6;padding:12px 14px;border-radius:var(--r)}
.wr-ta:focus{border-color:var(--accent);outline:none}
.wr-count{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;font-size:13px;color:var(--muted)}
.wr-count b{color:var(--ink);font-variant-numeric:tabular-nums}
.wr-count .wr-st{font-weight:600}
.wr-count.ok .wr-st{color:var(--good)}
.wr-count.low .wr-st,.wr-count.high .wr-st{color:var(--warn)}
.wr-meter{flex-basis:100%;position:relative;height:6px;border-radius:999px;background:var(--surface-2);margin-top:2px}
.wr-meter i{display:block;height:100%;border-radius:999px;background:var(--warn);transition:width .15s}
.wr-count.ok .wr-meter i{background:var(--good)}
.wr-meter span{position:absolute;top:-3px;bottom:-3px;width:2px;margin-left:-1px;border-radius:1px;background:var(--ink-2)}
.wr-acts .btn{flex:0 1 auto}
.wr-model{white-space:pre-line;font-size:15px;line-height:1.6;color:var(--ink);background:var(--surface-2);border-left:3px solid var(--good);border-radius:0 var(--r) var(--r) 0;padding:12px 14px;overflow-wrap:anywhere}
.wr-fb details.th>summary{margin-bottom:0}
.wr-fb details.th[open]>summary{margin-bottom:10px}
.wr-score{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.wr-score .scorebig{width:84px;height:84px}
.wr-score .scorebig b{font-size:30px}
.wr-check{display:grid;gap:8px}
.wr-check label{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink-2);cursor:pointer;line-height:1.4}
.wr-check input{width:18px;height:18px;margin:1px 0 0;flex:none;accent-color:var(--accent)}
.wr-check input:checked+span{color:var(--ink)}