/* ============================================================
   TREINO DE VOCABULÁRIO — estilos próprios da página
   Usa só as variáveis do css/estilo.css (cores, fontes, raios),
   então segue automaticamente o tema claro/escuro do site.
   Todas as classes começam com "tv-" para não colidir com nada.
   ============================================================ */
#treino-vocab{--tv-ok:var(--verde,#4FB088);--tv-erro:var(--vermelho,#EE6A5C);--tv-r:var(--raio,18px);--tv-rp:var(--raio-p,12px)}
#treino-vocab .ru{font-family:var(--f-texto);font-feature-settings:normal}
#treino-vocab kbd{font-family:var(--f-texto);font-size:.72rem;font-weight:700;line-height:1;padding:3px 6px;border-radius:6px;border:1px solid var(--linha);background:var(--papel);color:var(--cinza)}

/* ---------- painel de escolha ---------- */
.tv-painel{background:var(--papel-2);border:1px solid var(--linha);border-radius:var(--tv-r);padding:22px 24px;display:flex;flex-direction:column;gap:20px;box-shadow:var(--sombra)}
.tv-bloco{display:flex;flex-direction:column;gap:10px;min-width:0}
.tv-rot-linha{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.tv-rot{display:block;font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--cinza)}
.tv-mudo{color:var(--cinza);font-weight:500;text-transform:none;letter-spacing:0}
.tv-acoes-mini{display:flex;gap:14px}
.tv-link{background:none;border:0;padding:0;font:inherit;font-size:.9rem;font-weight:600;color:var(--azul);cursor:pointer}
.tv-link:hover:not(:disabled){text-decoration:underline}
.tv-link:disabled{opacity:.45;cursor:default}
.tv-mais{align-self:flex-start}
.tv-busca{width:100%;max-width:420px;border:1px solid var(--linha);border-radius:var(--tv-rp);padding:10px 14px;background:var(--papel);color:var(--tinta);font:inherit;font-size:.95rem}
.tv-busca:focus{outline:none;border-color:var(--azul)}
.tv-chips{display:flex;flex-wrap:wrap;gap:8px}
.tv-chip{display:inline-flex;align-items:center;gap:7px;font:inherit;font-size:.9rem;font-weight:600;padding:7px 13px;border-radius:999px;border:1px solid var(--linha);background:var(--papel);color:var(--tinta);cursor:pointer;transition:border-color .15s,background .15s}
.tv-chip:hover:not(:disabled){border-color:var(--azul)}
.tv-chip[aria-pressed="true"]{background:var(--azul);border-color:var(--azul);color:#fff}
.tv-chip:disabled{opacity:.4;cursor:default}
.tv-n{font-size:.78rem;font-weight:700;opacity:.7;font-variant-numeric:tabular-nums}
.tv-seg{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:calc(var(--tv-rp) + 4px);background:var(--papel);border:1px solid var(--linha)}
.tv-seg-b{font:inherit;font-size:.9rem;font-weight:600;padding:7px 12px;border-radius:var(--tv-rp);border:0;background:none;color:var(--cinza);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.tv-seg-b:hover{color:var(--tinta)}
.tv-seg-b[aria-pressed="true"]{background:var(--azul-luz);color:var(--azul)}
.tv-linha-opcoes{flex-direction:row;flex-wrap:wrap;gap:18px 28px;align-items:flex-end}
.tv-linha-opcoes .tv-rot{margin-bottom:8px}
.tv-check{display:flex;gap:10px;align-items:flex-start;cursor:pointer;max-width:340px}
.tv-check input{accent-color:var(--azul);width:18px;height:18px;margin-top:2px;flex:none}
.tv-check b{display:block;font-size:.95rem}
.tv-check small{display:block;color:var(--cinza);font-size:.84rem;line-height:1.4}
.tv-check--mini{align-items:center;font-size:.9rem;color:var(--cinza);max-width:none}

/* ---------- números da seleção ---------- */
.tv-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:16px 0 0;position:relative}
.tv-stat{background:var(--papel-2);border:1px solid var(--linha);border-radius:var(--tv-rp);padding:12px 16px;display:flex;flex-direction:column;line-height:1.15}
.tv-stat b{font-family:var(--f-titulo);font-size:1.45rem;font-weight:800;color:var(--azul);font-variant-numeric:tabular-nums}
.tv-stat span{font-size:.8rem;color:var(--cinza);font-weight:600}
.tv-stat--ok b{color:var(--tv-ok)}
.tv-stat--rev b{color:var(--tv-erro)}
.tv-dom{grid-column:1/-1;height:6px;border-radius:999px;background:var(--linha);overflow:hidden}
.tv-dom i{display:block;height:100%;background:var(--tv-ok);border-radius:999px;transition:width .3s}

/* ---------- abas de modo ---------- */
.tv-modos{display:flex;gap:8px;overflow-x:auto;margin:22px 0 14px;padding-bottom:4px;scrollbar-width:thin}
.tv-modo{flex:none;display:inline-flex;align-items:center;gap:8px;font:inherit;font-weight:700;font-size:.95rem;padding:10px 16px;border-radius:var(--tv-rp);border:1px solid var(--linha);background:var(--papel-2);color:var(--tinta);cursor:pointer;transition:border-color .15s,transform .15s}
.tv-modo:hover{border-color:var(--azul)}
.tv-modo[aria-selected="true"]{background:var(--azul);border-color:var(--azul);color:#fff;box-shadow:var(--sombra-f)}
.tv-modo-ic{font-size:1.05rem;line-height:1}

/* ---------- palco do jogo ---------- */
.tv-palco{background:var(--papel-2);border:1px solid var(--linha);border-radius:var(--raio-g,26px);padding:28px;box-shadow:var(--sombra);min-height:320px;scroll-margin-top:90px}
.tv-inicio{text-align:center;max-width:560px;margin:26px auto;display:flex;flex-direction:column;align-items:center;gap:8px}
.tv-inicio p{margin:0 0 6px}
.tv-inicio .btn{margin-top:8px}
.tv-inicio-ic{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;background:var(--azul-luz);color:var(--azul);font-size:1.6rem;margin-bottom:6px}
.tv-atalhos{font-size:.85rem;color:var(--cinza);margin-top:10px!important}

.tv-hud{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-bottom:14px}
.tv-hud-esq{display:flex;gap:22px}
.tv-hud-item{display:flex;flex-direction:column;line-height:1.1}
.tv-hud-item b{font-family:var(--f-titulo);font-size:1.45rem;font-weight:800;color:var(--azul);font-variant-numeric:tabular-nums}
.tv-hud-item span{font-size:.76rem;color:var(--cinza);font-weight:600}
.tv-hud-seq b{color:var(--vermelho)}
.tv-hud-dir{display:flex;gap:16px;align-items:center;font-size:.9rem;color:var(--cinza);font-weight:600;font-variant-numeric:tabular-nums}
.tv-prog{height:8px;background:var(--linha);border-radius:999px;overflow:hidden;margin-bottom:22px}
.tv-prog i{display:block;height:100%;background:var(--azul);border-radius:999px;transition:width .25s}

.tv-perg{text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:22px}
.tv-centro{text-align:center;margin-bottom:12px}
.tv-prompt{font-family:var(--f-titulo);font-size:clamp(1.9rem,5vw,2.7rem);font-weight:800;line-height:1.15;letter-spacing:-.01em;color:var(--tinta);overflow-wrap:anywhere;max-width:100%;padding-top:4px}
.tv-prompt.ru{font-family:var(--f-texto);font-weight:700;letter-spacing:0}
.tv-prompt--pt{font-size:clamp(1.5rem,4vw,2.1rem)}
.tv-sub{color:var(--cinza);font-size:.95rem}
.tv-tema{font-size:.82rem;font-weight:600}

.tv-opts{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:760px;margin:0 auto}
.tv-opts--gen{grid-template-columns:repeat(4,1fr)}
.tv-opt{position:relative;font:inherit;font-size:1.05rem;font-weight:600;padding:16px 16px 16px 44px;border-radius:var(--tv-rp);border:1px solid var(--linha);background:var(--papel);color:var(--tinta);cursor:pointer;text-align:left;min-width:0;overflow-wrap:anywhere;transition:border-color .15s,transform .15s,background .15s}
.tv-opt.ru{font-size:1.15rem}
.tv-opt kbd{position:absolute;left:12px;top:50%;transform:translateY(-50%)}
.tv-opt small{display:block;font-size:.85rem;color:var(--cinza);font-weight:500}
.tv-opt:hover:not(:disabled){border-color:var(--azul);transform:translateY(-1px)}
.tv-opt:disabled{cursor:default}
.tv-opt.tv-ok{border-color:var(--tv-ok);background:color-mix(in srgb,var(--tv-ok) 14%,var(--papel));color:var(--tinta)}
.tv-opt.tv-erro{border-color:var(--tv-erro);background:color-mix(in srgb,var(--tv-erro) 14%,var(--papel))}
.tv-opts--gen .tv-opt{text-align:center;padding:16px 10px}
.tv-opts--gen .tv-opt kbd{position:static;transform:none;display:inline-block;margin-bottom:6px}

.tv-fb{max-width:760px;margin:18px auto 0;border-radius:var(--tv-rp);padding:16px 18px;border:1px solid;display:flex;flex-direction:column;gap:8px;animation:tv-entra .2s ease-out}
.tv-fb--ok{border-color:var(--tv-ok);background:color-mix(in srgb,var(--tv-ok) 10%,var(--papel))}
.tv-fb--erro{border-color:var(--tv-erro);background:color-mix(in srgb,var(--tv-erro) 10%,var(--papel))}
.tv-fb-v{font-family:var(--f-titulo);font-weight:800;font-size:1.1rem}
.tv-fb--ok .tv-fb-v{color:var(--tv-ok)}
.tv-fb--erro .tv-fb-v{color:var(--tv-erro)}
.tv-fb-c{font-size:1.08rem}
.tv-fb-x{display:flex;flex-direction:column;gap:6px;font-size:.93rem;color:var(--tinta)}
.tv-fb-x p{margin:0}
.tv-pron{color:var(--cinza)}
.tv-obs{color:var(--cinza);font-style:normal}
.tv-ex{border-left:3px solid var(--linha);padding-left:10px;color:var(--cinza)}
.tv-ex b{color:var(--tinta);font-weight:600}
.tv-prox{display:flex;justify-content:center;margin-top:16px}
@keyframes tv-entra{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* digitar */
.tv-dig{display:flex;gap:10px;max-width:620px;margin:0 auto;flex-wrap:wrap}
.tv-in{flex:1;min-width:200px;border:2px solid var(--linha);border-radius:var(--tv-rp);padding:13px 16px;background:var(--papel);color:var(--tinta);font:inherit;font-size:1.2rem;font-weight:600}
.tv-in:focus{outline:none;border-color:var(--azul)}
.tv-in.tv-ok{border-color:var(--tv-ok)}
.tv-in.tv-erro{border-color:var(--tv-erro)}
.tv-in.tv-quase{border-color:var(--ouro,#DDAC52)}
.tv-dig-acoes{display:flex;gap:18px;flex-wrap:wrap;justify-content:center;align-items:center;margin:12px auto 0;max-width:620px}
.tv-teclado{max-width:620px;margin:16px auto 0;display:flex;flex-direction:column;gap:6px;user-select:none}
.tv-tecl-l{display:flex;gap:5px;justify-content:center}
.tv-tecla{flex:1;max-width:46px;min-width:0;height:42px;border-radius:9px;border:1px solid var(--linha);background:var(--papel);color:var(--tinta);font:inherit;font-size:1.05rem;font-weight:600;cursor:pointer;padding:0}
.tv-tecla:hover:not(:disabled){border-color:var(--azul)}
.tv-tecla:active:not(:disabled){background:var(--azul-luz)}
.tv-tecla--larga{max-width:140px;flex:3;font-size:.85rem}
.tv-tecla:disabled{opacity:.45;cursor:default}

/* cartões */
.tv-carta{max-width:560px;margin:0 auto;min-height:230px;border:1px dashed var(--linha);border-radius:var(--tv-r);padding:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;cursor:pointer;background:var(--papel);transition:border-color .15s}
.tv-carta:hover{border-color:var(--azul)}
.tv-carta--virada{border-style:solid;cursor:default}
.tv-carta-verso{display:flex;flex-direction:column;gap:6px;align-items:center;border-top:1px solid var(--linha);padding-top:12px;margin-top:4px;width:100%;font-size:.93rem;animation:tv-entra .2s ease-out}
.tv-carta-verso .tv-ex{text-align:left;align-self:stretch}
.tv-carta-resp{font-family:var(--f-titulo);font-size:1.5rem;font-weight:800;color:var(--azul)}
.tv-carta-resp.ru{font-family:var(--f-texto);font-weight:700}
.tv-carta-acoes{display:flex;gap:12px;justify-content:center;margin-top:18px;flex-wrap:wrap}
.tv-carta-acoes .btn{min-width:150px}
.tv-carta-acoes kbd{margin-right:6px;background:transparent;color:inherit;border-color:currentColor;opacity:.7}

/* completar */
.tv-frase{font-size:clamp(1.25rem,3.2vw,1.6rem);font-weight:600;line-height:1.5;max-width:720px;overflow-wrap:anywhere}
.tv-lacuna{display:inline-block;min-width:4.5em;border-bottom:3px solid var(--azul);color:var(--azul);padding:0 4px}
.tv-lacuna.tv-ok{border-color:var(--tv-ok);color:var(--tv-ok)}
.tv-lacuna.tv-erro{border-color:var(--tv-erro);color:var(--tv-erro)}

/* fim de rodada */
.tv-fim{text-align:center;max-width:640px;margin:10px auto;display:flex;flex-direction:column;align-items:center;gap:6px}
.tv-fim p{margin:0}
.tv-fim-med{font-size:2.8rem;line-height:1}
.tv-fim-pct{font-family:var(--f-titulo);font-size:3.2rem;font-weight:800;color:var(--azul);line-height:1}
.tv-fim-erros{width:100%;text-align:left;margin-top:16px;border:1px solid var(--linha);border-radius:var(--tv-rp);padding:14px 18px;background:var(--papel)}
.tv-fim-erros h4{margin:0 0 8px;font-size:1rem}
.tv-fim-erros ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px 18px}
.tv-fim-erros li{display:flex;flex-direction:column;line-height:1.3;padding:4px 0;border-bottom:1px solid var(--linha)}
.tv-fim-erros li span{color:var(--cinza);font-size:.9rem}
.tv-fim-acoes{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:18px}

/* lista de estudo */
.tv-lista-topo{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.tv-lista-topo h3{margin:0 0 2px}
.tv-lista-topo p{margin:0}
.tv-tabela-w{overflow-x:auto;border:1px solid var(--linha);border-radius:var(--tv-rp)}
.tv-tabela{width:100%;border-collapse:collapse;font-size:.95rem}
.tv-tabela th{text-align:left;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--cinza);padding:10px 12px;border-bottom:1px solid var(--linha);background:var(--papel);position:sticky;top:0}
.tv-tabela td{padding:10px 12px;border-bottom:1px solid var(--linha);vertical-align:top}
.tv-tabela tr:last-child td{border-bottom:0}
.tv-tabela td small{display:block;color:var(--cinza);font-size:.8rem;margin-top:2px}
.tv-tabela b.ru{font-size:1.05rem}
.tv-col-obs{color:var(--cinza);font-size:.88rem;max-width:280px}
.tv-sit{display:inline-block;font-size:.78rem;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap;background:var(--azul-luz);color:var(--azul)}
.tv-sit--revisar{background:color-mix(in srgb,var(--tv-erro) 16%,transparent);color:var(--tv-erro)}
.tv-sit--dominada{background:color-mix(in srgb,var(--tv-ok) 16%,transparent);color:var(--tv-ok)}
.tv-sit--nova{background:var(--papel);color:var(--cinza);border:1px solid var(--linha)}
.tv-lista-pe{display:flex;justify-content:flex-end;margin-top:14px}
.tv-perigo{color:var(--vermelho)}
.tv-nota{color:var(--cinza);font-size:.88rem;margin:14px 0 0;max-width:none}

/* ---------- celular ---------- */
@media (max-width:720px){
  .tv-painel{padding:18px 16px;gap:16px}
  .tv-stats{grid-template-columns:1fr 1fr;gap:8px}
  .tv-palco{padding:18px 14px}
  .tv-opts{grid-template-columns:1fr}
  .tv-opts--gen{grid-template-columns:1fr 1fr}
  .tv-hud-esq{gap:16px}
  .tv-hud-item b{font-size:1.2rem}
  .tv-fim-erros ul{grid-template-columns:1fr}
  .tv-col-obs{display:none}
  .tv-tecl-l{gap:3px}
  .tv-tecla{height:40px;font-size:.95rem;border-radius:7px}
  .tv-seg{width:100%}
  .tv-seg-b{flex:1;justify-content:center;padding:7px 8px}
  .tv-dig .btn{width:100%}
  #treino-vocab kbd,.tv-atalhos{display:none}
  .tv-opt{padding-left:16px}
}
@media (prefers-reduced-motion:reduce){.tv-fb,.tv-carta-verso{animation:none}}