/* ============================================================
   Inteligência+ — tema + componentes da plataforma unificada
   (carregado depois de app.css)
   ============================================================ */
:root{ --primary:#6d5cff; --primary-2:#5a45f0; }
.xp-fill{ background:linear-gradient(90deg,#6d5cff,#38bdf8); }
.logo,.auth-logo,.boot-logo{ background:linear-gradient(90deg,#8b9bff,#38bdf8); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }

/* ---------- HOME: grupos → áreas ---------- */
.grupo-sec{ margin:26px 0; }
.grupo-titulo{ font-size:18px; margin-bottom:14px; color:var(--text); border-bottom:1px solid var(--border); padding-bottom:8px; }
.areas-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:14px; }
.area-card{ display:flex; flex-direction:column; gap:8px; padding:16px; border-radius:var(--radius); border:1px solid var(--border); background:var(--panel); color:var(--text); transition:transform .12s,box-shadow .12s,border-color .12s; position:relative; overflow:hidden; }
.area-card::before{ content:""; position:absolute; inset:0 0 auto 0; height:3px; background:var(--ac,#5b8cff); }
.area-card:hover{ transform:translateY(-3px); box-shadow:0 12px 30px rgba(0,0,0,.35); border-color:var(--ac,#5b8cff); }
.area-ico{ font-size:30px; }
.area-nome{ font-weight:700; font-size:15px; line-height:1.25; }
.area-prog{ display:flex; align-items:center; gap:8px; font-size:12px; color:var(--muted); margin-top:auto; }
.area-bar{ flex:1; height:6px; background:var(--bg); border-radius:4px; overflow:hidden; }
.area-bar>div{ height:100%; background:var(--ac,#5b8cff); }

/* ---------- trilhas / módulos ---------- */
.trilhas-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; }
.trilha-card{ position:relative; display:block; padding:18px; border-radius:var(--radius); border:1px solid var(--border); background:var(--panel); color:var(--text); transition:transform .12s,box-shadow .12s; }
.trilha-card:hover{ transform:translateY(-2px); box-shadow:0 10px 26px rgba(0,0,0,.3); }
.trilha-card h2{ font-size:17px; margin-bottom:6px; }
.trilha-card p{ color:var(--muted); font-size:13px; margin-bottom:10px; }
.trilha-ordem{ position:absolute; top:12px; right:12px; width:24px; height:24px; background:var(--panel-2); color:var(--muted); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; }
.trilha-stats{ display:flex; justify-content:space-between; font-size:12px; color:var(--muted); margin-bottom:8px; }
.trilha-mini-bar{ height:6px; background:var(--bg); border-radius:4px; overflow:hidden; }
.trilha-mini-bar>div{ height:100%; background:linear-gradient(90deg,var(--primary),#38bdf8); }
.trilha-pct{ text-align:right; font-size:12px; color:var(--muted); margin-top:4px; }
.pagina-titulo{ font-size:24px; margin:6px 0; }
.pagina-sub{ color:var(--muted); margin-bottom:18px; }
.bread{ margin-bottom:10px; } .bread a{ font-size:13px; color:var(--muted); }
.modulos-lista{ display:flex; flex-direction:column; gap:10px; }
.modulo-card{ display:flex; align-items:center; gap:14px; padding:14px 16px; border-radius:var(--radius); border:1px solid var(--border); background:var(--panel); color:var(--text); }
.modulo-card:hover{ border-color:var(--primary); }
.modulo-card.completo{ border-color:var(--success); }
.modulo-card.bloqueado{ opacity:.6; filter:grayscale(.3); cursor:not-allowed; }
.modulo-num{ flex:none; width:34px; height:34px; border-radius:50%; background:var(--panel-2); display:flex; align-items:center; justify-content:center; font-weight:700; }
.modulo-corpo{ flex:1; } .modulo-head{ display:flex; align-items:center; gap:10px; }
.modulo-corpo p{ color:var(--muted); font-size:13px; margin:4px 0 8px; }
.modulo-prog{ font-size:13px; color:var(--muted); }
.nivel-tag{ font-size:11px; padding:1px 9px; border-radius:10px; background:var(--panel-2); color:var(--muted); }
.nivel-tag.nivel-intermediario{ color:#ffcf8f; } .nivel-tag.nivel-avancado{ color:#ff9fb0; }
.lock-tag{ font-size:11px; padding:1px 9px; border-radius:10px; background:rgba(255,107,129,.16); color:#ff9fb0; font-weight:700; }
.lock-aviso{ font-size:12.5px; color:var(--warning); margin-top:6px; }
.lock-card{ border-color:var(--warning); background:rgba(255,180,84,.08); margin:14px 0; }
.secao-titulo{ font-size:17px; margin:18px 0 10px; }
.ex-lista{ display:flex; flex-direction:column; gap:8px; }
.ex-card{ display:flex; align-items:center; gap:12px; padding:11px 14px; border-radius:10px; border:1px solid var(--border); background:var(--panel); color:var(--text); }
.ex-card:hover{ border-color:var(--primary); } .ex-card.resolvido{ opacity:.75; } .ex-card.boss{ border-color:var(--gold); }
.ex-codigo{ font-family:Consolas,monospace; font-size:12px; color:var(--muted); } .ex-titulo{ flex:1; font-size:14px; }
.ex-modo{ font-size:11px; color:var(--muted); white-space:nowrap; } .ex-dif{ color:var(--gold); font-size:12px; }

/* ---------- exercício ---------- */
.ex-head h1{ font-size:20px; } .ex-meta{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:6px; }
.skill-tag{ font-size:10.5px; font-weight:700; padding:2px 8px; border-radius:10px; background:var(--panel-2); color:#c4b5fd; }
.tag-resolvido{ font-size:11px; color:var(--success); } .tag-review{ font-size:11px; color:#9ad8ff; } .tag-dinamico{ font-size:11px; padding:2px 8px; border-radius:10px; background:rgba(167,139,250,.18); color:#c4b5fd; }
.enunciado{ font-size:16px; line-height:1.7; margin:14px 0; }
.enunciado pre,.exemplo pre,.passo-txt pre{ background:var(--code-bg); border:1px solid var(--border); border-radius:10px; padding:12px 14px; overflow-x:auto; font-size:13.5px; }
.enunciado code,.exemplo code{ background:var(--code-bg); border:1px solid var(--border); border-radius:5px; padding:1px 6px; font-size:13px; color:#ffd9b0; }
.dyn-pergunta{ font-size:19px; font-weight:700; color:#fff; }
.exemplo{ margin:10px 0; } .ex-visual{ display:flex; justify-content:center; margin:14px 0; } .ex-visual:empty{ display:none; }
.dinamico-bar{ display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin:6px 0 14px; } .dinamico-hint{ font-size:12.5px; color:var(--muted); }
.confianca-box{ background:var(--panel); border:1px solid var(--border); border-radius:var(--radius); padding:12px 16px; margin:12px 0; }
.confianca-label{ font-size:13px; } .confianca-botoes{ display:flex; gap:6px; margin-top:8px; }
.conf-btn{ width:36px; height:36px; border-radius:8px; border:1px solid var(--border); background:var(--panel-2); color:var(--text); cursor:pointer; } .conf-btn.sel{ background:var(--primary); color:#fff; border-color:var(--primary); }
.quiz-area{ margin:14px 0; } .quiz-tools{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:10px; } .timer{ margin-left:auto; font-family:Consolas,monospace; color:var(--muted); }
.resposta-input{ display:flex; gap:8px; align-items:center; } .resposta-input input{ flex:1; background:var(--bg-2); border:1px solid var(--border); color:var(--text); padding:11px 14px; border-radius:8px; font-size:15px; outline:none; } .resposta-input input:focus{ border-color:var(--primary); } .unidade{ color:var(--muted); font-weight:600; }

/* opções múltipla */
.opcoes{ display:flex; flex-direction:column; gap:8px; } .opcao{ display:flex; gap:12px; align-items:center; text-align:left; background:var(--panel); border:1px solid var(--border); color:var(--text); padding:12px 14px; border-radius:10px; cursor:pointer; }
.opcao:hover{ border-color:var(--primary); } .opcao.certa{ border-color:var(--success); background:rgba(45,212,167,.1); } .opcao.errada{ border-color:var(--error); } .opcao.travada{ pointer-events:none; opacity:.85; }
.opcao-letra{ flex:none; width:26px; height:26px; border-radius:50%; background:var(--panel-2); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; } .opcao-texto code{ color:#ffd9b0; }

/* código + runner */
.code-area{ width:100%; background:var(--code-bg); border:1px solid var(--border); border-radius:10px; color:#e8eef7; padding:12px 14px; font-family:Consolas,"Cascadia Code",monospace; font-size:14px; line-height:1.5; outline:none; resize:vertical; tab-size:4; }
.code-area:focus{ border-color:var(--primary); } .codigo-input{ display:flex; flex-direction:column; gap:10px; } .codigo-input .btn,.runner-tools .btn{ align-self:flex-start; }
.runner-area{ display:flex; flex-direction:column; gap:10px; } .runner-tools{ display:flex; gap:10px; align-items:center; } .runner-status{ font-size:13px; color:var(--muted); } .prever-in{ flex:1; background:var(--bg-2); border:1px solid var(--border); color:var(--text); padding:8px 12px; border-radius:8px; }
.runner-out{ background:var(--code-bg); border:1px solid var(--border); border-radius:10px; padding:12px 14px; min-height:40px; max-height:340px; overflow:auto; font-family:Consolas,monospace; font-size:13px; color:#cfe; white-space:pre-wrap; } .runner-out:empty{ display:none; }
/* tabela de resultado SQL (modo as-table: solta o texto monoespaçado e renderiza <table>) */
.runner-out.as-table{ white-space:normal; padding:0; }
.sql-wrap{ width:100%; }
table.sql-result{ border-collapse:collapse; width:100%; font-family:Consolas,"Cascadia Code",monospace; font-size:12.5px; color:#dfe7f3; }
.sql-result thead th{ position:sticky; top:0; background:var(--panel-2); color:#c4b5fd; font-weight:700; text-align:left; padding:7px 12px; border-bottom:2px solid var(--primary); white-space:nowrap; }
.sql-result td{ padding:6px 12px; border-top:1px solid var(--border); white-space:nowrap; }
.sql-result tbody tr:nth-child(even){ background:rgba(255,255,255,.03); }
.sql-result tbody tr:hover{ background:rgba(109,92,255,.14); }
.sql-result tbody tr:last-child td{ border-bottom:1px solid var(--border); }
.sql-result .nul{ color:var(--muted); font-style:italic; }
.sql-meta{ margin:7px 12px 6px; color:var(--muted); font-size:11.5px; }
.sql-empty{ color:var(--success); font-size:13px; padding:10px 12px; }

/* áudio */
.audio-area{ display:flex; flex-direction:column; gap:12px; } .btn-audio{ align-self:flex-start; } .speak-alvo{ font-size:20px; font-weight:600; padding:14px; background:var(--panel); border:1px solid var(--border); border-radius:10px; text-align:center; } .speak-rec{ color:var(--muted); font-size:14px; min-height:20px; }

/* ordenar */
.ordenar{ display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; } .ordenar-label{ font-size:12px; color:var(--muted); margin-bottom:8px; text-transform:uppercase; }
.ordenar-pool,.ordenar-seq{ display:flex; flex-direction:column; gap:8px; min-height:60px; padding:10px; background:var(--bg-2); border:1px dashed var(--border); border-radius:10px; } .ordenar-seq{ list-style:none; counter-reset:ord; } .ordenar-seq li{ display:flex; align-items:center; gap:10px; counter-increment:ord; } .ordenar-seq li::before{ content:counter(ord); flex:none; width:22px; height:22px; background:var(--primary); color:#fff; border-radius:50%; font-size:12px; display:flex; align-items:center; justify-content:center; }
.ord-chip{ flex:1; text-align:left; background:var(--panel-2); border:1px solid var(--border); color:var(--text); padding:9px 12px; border-radius:8px; cursor:pointer; } .ord-chip:hover{ border-color:var(--primary); } .ord-vazio{ color:var(--muted); font-size:13px; font-style:italic; } .ordenar-acoes{ grid-column:1/-1; display:flex; gap:10px; }
@media(max-width:640px){ .ordenar{ grid-template-columns:1fr; } }

/* passos / dica / resultado */
.passos-area:empty,.dica-area:empty{ display:none; } .passos-box{ background:var(--panel); border:1px solid var(--primary); border-radius:var(--radius); padding:16px; margin:14px 0; } .passos-titulo{ font-weight:700; margin-bottom:10px; color:#c4b5fd; } .passo{ display:flex; gap:12px; padding:8px 0; border-top:1px dashed var(--border); } .passo:first-of-type{ border-top:none; } .passo-num{ flex:none; width:24px; height:24px; border-radius:50%; background:var(--primary); color:#fff; font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; } .passo-txt{ flex:1; line-height:1.55; } .passos-fim{ margin-top:10px; color:var(--success); font-weight:600; font-size:13.5px; }
.dica-box{ background:var(--panel); border:1px solid var(--border); border-radius:10px; padding:12px 14px; margin:12px 0; } .dica-box.reveal{ border-color:var(--gold); } .reveal-expl{ margin-top:8px; color:var(--muted); }
.reveal-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; }
.reveal-code{ background:var(--code-bg); border:1px solid var(--border); border-radius:8px; padding:10px 12px; margin:0; overflow-x:auto; font-family:Consolas,"Cascadia Code",monospace; font-size:13px; line-height:1.5; color:#cfe; white-space:pre; }
/* 🎯 Resultado esperado (passo intermediário antes de revelar o SQL) */
.alvo-view{ border-color:#9ad8ff; }
.alvo-titulo{ font-size:13px; color:var(--text); margin-bottom:8px; } .alvo-hint{ color:var(--muted); font-weight:400; }
.alvo-view .runner-out{ margin:0; }
.alvo-nota{ color:var(--muted); font-size:13px; } .alvo-erro{ color:var(--error); font-size:13px; } .alvo-load{ color:var(--muted); font-size:13px; }

/* 🧠 treino cognitivo */
.cognitivo-area{ display:flex; flex-direction:column; gap:10px; }
.cog-host{ min-height:260px; }
.cog-card{ background:var(--panel); border:1px solid var(--border); border-radius:var(--radius); padding:22px; display:flex; flex-direction:column; align-items:center; gap:16px; text-align:center; }
.cog-titulo{ font-size:18px; font-weight:800; color:#c4b5fd; }
.cog-instr{ color:var(--text); font-size:14px; line-height:1.6; max-width:460px; } .cog-instr small{ color:var(--muted); }
.cog-status{ font-size:13px; color:var(--muted); font-weight:600; }
.cog-acao{ min-width:200px; } .cog-acao.press{ background:var(--success); border-color:var(--success); transform:scale(.97); }
.cog-contagem{ font-size:54px; font-weight:800; color:var(--primary); padding:30px; }
/* N-Back */
.nback-grid{ display:grid; grid-template-columns:repeat(3,72px); grid-template-rows:repeat(3,72px); gap:10px; }
.nb-cell{ background:var(--panel-2); border:1px solid var(--border); border-radius:12px; transition:background .08s, box-shadow .08s; }
.nb-cell.on{ background:var(--primary); box-shadow:0 0 22px rgba(109,92,255,.7); }
/* Stroop */
.stroop-palavra{ font-size:46px; font-weight:800; padding:24px 0; min-height:64px; letter-spacing:1px; transition:transform .1s; }
.stroop-palavra.flash-ok{ transform:scale(1.12); } .stroop-palavra.flash-nok{ transform:translateX(6px); }
.stroop-botoes{ display:grid; grid-template-columns:1fr 1fr; gap:10px; width:100%; max-width:360px; }
.stroop-btn{ border:none; border-radius:10px; padding:14px; font-size:15px; font-weight:700; color:#fff; cursor:pointer; text-shadow:0 1px 2px rgba(0,0,0,.35); }
.stroop-btn:active{ transform:scale(.97); }
/* Digit span */
.ds-num{ font-size:64px; font-weight:800; color:#e8eef7; min-height:80px; font-family:Consolas,monospace; }
.ds-input{ font-size:24px; text-align:center; letter-spacing:8px; width:220px; background:var(--bg-2); border:1px solid var(--border); color:var(--text); padding:10px; border-radius:10px; font-family:Consolas,monospace; outline:none; }
.ds-input:focus{ border-color:var(--primary); }
/* fim */
.cog-fim.ok{ border-color:var(--success); } .cog-fim.nok{ border-color:var(--warning); }
.cog-fim-icone{ font-size:40px; } .cog-fim-score{ font-size:18px; font-weight:800; }
.cog-metricas{ display:grid; grid-template-columns:1fr 1fr; gap:6px 18px; width:100%; max-width:380px; }
.cog-metricas div{ display:flex; justify-content:space-between; border-bottom:1px solid var(--border); padding:4px 0; font-size:13px; }
.cog-metricas span{ color:var(--muted); } .cog-metricas b{ color:#c4b5fd; }
.cog-fim-nota{ font-size:12.5px; color:var(--muted); }
/* 📚 Schema — painel das tabelas do banco TechBR (toggle no exercício SQL) */
.schema-view{ background:var(--code-bg); border-color:var(--primary); }
.schema-titulo{ font-size:13px; color:var(--text); margin-bottom:8px; }
.schema-tbl{ font-family:Consolas,"Cascadia Code",monospace; font-size:12.5px; padding:5px 0; border-top:1px solid var(--border); }
.schema-tbl:first-of-type{ border-top:none; }
.schema-tname{ color:#c4b5fd; font-weight:700; }
.schema-cols{ color:#9fb0d0; }
.schema-nota{ color:var(--muted); font-size:11px; margin:3px 0 0 14px; }
.schema-rodape{ margin-top:9px; color:var(--muted); font-size:11px; }
.resultado{ border-radius:var(--radius); padding:16px; margin:14px 0; } .resultado.sucesso{ background:rgba(45,212,167,.08); border:1px solid var(--success); } .resultado.erro{ background:rgba(255,107,129,.07); border:1px solid var(--error); } .resultado.executando{ color:var(--muted); }
.resultado-titulo{ font-size:18px; font-weight:700; } .erro-feedback{ background:rgba(255,180,84,.12); border-left:3px solid var(--warning); padding:8px 12px; border-radius:8px; margin:8px 0; } .resultado-incentivo{ color:var(--muted); font-size:14px; margin-top:8px; } .resposta-conf strong{ color:var(--success); }
.xp-ganho{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:10px 0; } .xp-num{ font-size:20px; font-weight:800; color:var(--gold); } .xp-bonus{ font-size:11px; background:var(--panel-2); padding:2px 8px; border-radius:10px; color:var(--muted); } .xp-ganho.critico .xp-num{ color:#ff6b81; } .critico-banner{ width:100%; font-weight:800; color:#ff6b81; } .levelup{ width:100%; color:var(--gold); font-weight:700; } .badge-nova{ margin:6px 0; color:var(--gold); } .srs-info{ color:var(--muted); font-size:13px; margin-top:8px; } .explicacao{ margin:10px 0; color:var(--muted); }
.insight-box{ margin-top:14px; padding-top:12px; border-top:1px solid var(--border); } .insight-box label{ font-size:13px; color:var(--muted); display:block; margin-bottom:6px; } .insight-form{ display:flex; gap:8px; } .insight-form input{ flex:1; background:var(--bg-2); border:1px solid var(--border); color:var(--text); padding:9px 12px; border-radius:8px; }
.ex-nav{ display:flex; justify-content:space-between; margin-top:20px; }

/* fracos / stats / metodo */
.dash-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px; } .card{ background:var(--panel); border:1px solid var(--border); border-radius:var(--radius); padding:18px; } .card-head{ margin-bottom:12px; } .card-head h2{ font-size:16px; }
.tab{ width:100%; border-collapse:collapse; } .tab th,.tab td{ padding:8px 10px; text-align:left; border-bottom:1px solid var(--border); font-size:14px; } .tab th{ color:var(--muted); font-size:12px; text-transform:uppercase; } .taxa-baixa{ color:var(--error); } .taxa-media{ color:var(--warning); } .taxa-alta{ color:var(--success); }
.dominados{ display:flex; flex-wrap:wrap; gap:8px; } .dominado-chip{ background:rgba(45,212,167,.14); color:#6ee7c4; padding:5px 12px; border-radius:16px; font-size:13px; } .drill-box{ border-color:var(--primary); margin-top:18px; } .sem-dados{ color:var(--muted); font-size:14px; }
.stats-cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:12px; margin-bottom:18px; } .stat{ background:var(--panel-2); border-radius:10px; padding:14px; text-align:center; } .stat-num{ font-size:24px; font-weight:800; } .stat-lbl{ font-size:12px; color:var(--muted); }
.badges-grid{ display:grid; grid-template-columns:1fr; gap:10px; } .badge-item{ display:flex; gap:10px; align-items:center; } .badge-icone{ font-size:24px; }
.metodo-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px; } .metodo-card h2{ font-size:16px; margin-bottom:8px; } .metodo-card p{ color:var(--muted); font-size:14px; line-height:1.6; }
.teoria-box{ background:var(--panel); border:1px solid var(--border); border-radius:var(--radius); padding:14px 16px; margin:14px 0; } .teoria-box summary{ cursor:pointer; font-weight:600; } .teoria{ margin-top:12px; line-height:1.7; }
.dash-saudacao h1{ font-size:26px; } .dash-saudacao .sub{ color:var(--muted); margin-top:6px; }
.btn-block{ display:block; width:100%; text-align:center; margin-top:12px; } .btn-primary{ background:var(--primary); color:#fff; border-color:var(--primary); } .btn-pequeno{ font-size:13px; padding:7px 12px; }