:root{
  --navy:#0B1E3D;--navy2:#12305E;--blue:#0B4A8C;--amber:#F5B800;--green:#1FA463;--red:#E5484D;
  --bg:#F3F6FA;--card:#fff;--line:#E3E9F1;--txt:#14213D;--mut:#6B7A90;
  --topo:env(safe-area-inset-top,0px);--base:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%}
body{background:var(--bg);font-family:Inter,system-ui,-apple-system,sans-serif;color:var(--txt);font-size:15px;-webkit-font-smoothing:antialiased;overscroll-behavior-y:none}
a{color:inherit;text-decoration:none}
button{font:inherit;border:0;background:none;color:inherit;cursor:pointer}
.tela{min-height:100%;display:flex;flex-direction:column}
.conteudo{flex:1;padding:16px 16px calc(84px + var(--base));max-width:640px;width:100%;margin:0 auto}
.sem-abas .conteudo{padding-bottom:calc(24px + var(--base))}

/* topo */
.topo{background:var(--navy);color:#fff;padding:calc(var(--topo) + 14px) 18px 18px;position:sticky;top:0;z-index:10}
.topo-in{max-width:640px;margin:0 auto}
.topo .voltar{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:7px 14px 7px 11px;margin:0 0 10px -2px;border-radius:20px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.22);color:#fff;font:700 14px Sora,sans-serif}
.topo .voltar:active{background:rgba(255,255,255,.26)}
.topo .oi{font-size:13px;color:rgba(255,255,255,.65)}
.topo h1{font:800 21px/1.25 Sora,sans-serif;margin-top:2px;text-wrap:balance}
.topo .linha{display:flex;justify-content:space-between;align-items:center;gap:12px}
.pilula{background:rgba(255,255,255,.12);border-radius:20px;padding:6px 11px;font-size:12px;font-weight:600;white-space:nowrap}
.pilula b{color:var(--amber)}

/* abas */
.abas{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);display:flex;justify-content:space-around;padding:6px 4px calc(6px + var(--base));z-index:20}
.aba{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10.5px;font-weight:600;color:#9AA6B8;padding:4px 0}
.aba svg{width:22px;height:22px}
.aba.on{color:var(--blue)}

.sec{font:700 11px Inter;letter-spacing:1.2px;text-transform:uppercase;color:var(--mut);margin:6px 2px 10px}
.sec + .sec,.bloco + .sec{margin-top:20px}

/* cartões de curso */
.curso{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:13px;display:flex;gap:12px;align-items:center;margin-bottom:10px}
.curso:active{transform:scale(.99)}
.sigla{width:46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;font:800 12px Sora,sans-serif;color:#fff;flex-shrink:0;letter-spacing:.3px}
.curso h3{font:700 14.5px/1.3 Sora,sans-serif}
.curso .sub{font-size:12.5px;color:var(--mut);margin-top:2px}
.chip{margin-left:auto;font-size:11px;font-weight:700;padding:5px 9px;border-radius:12px;white-space:nowrap;flex-shrink:0}
.chip.ok{background:#E3F6EC;color:#157a47}
.chip.lock{background:#FFF4D1;color:#8a6500}
.curso.bloq .sigla{background:#9AAABF !important}
.vazio{background:var(--card);border:1px dashed #C9D3E0;border-radius:16px;padding:22px;text-align:center;color:var(--mut);font-size:14px;line-height:1.5}
.vazio a{color:var(--blue);font-weight:700}

/* matérias */
.materia{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;margin-bottom:10px;display:block}
.materia .l1{display:flex;justify-content:space-between;align-items:center;gap:10px}
.materia h3{font:700 15px Sora,sans-serif}
.pct{font:700 13px Inter;font-variant-numeric:tabular-nums}
.pct.bom{color:var(--green)}.pct.ruim{color:var(--red)}.pct.nada{color:var(--mut)}
.barra{height:6px;background:#EDF1F6;border-radius:6px;margin-top:9px;overflow:hidden}
.barra i{display:block;height:100%;border-radius:6px}
.materia .meta{font-size:12px;color:var(--mut);margin-top:7px;display:flex;justify-content:space-between}
.materia .ir{color:var(--blue);font-weight:700}

/* botões */
.btn{display:block;width:100%;text-align:center;padding:15px;border-radius:14px;font:800 15px Sora,sans-serif}
.btn-ambar{background:var(--amber);color:var(--navy)}
.btn-azul{background:var(--blue);color:#fff}
.btn-claro{background:#E9F0F8;color:var(--blue)}
.btns{display:flex;gap:10px}
.btns .btn{flex:1}

/* formulário */
.campo{display:block;margin-bottom:14px}
.campo span{display:block;font-size:13px;font-weight:600;color:rgba(255,255,255,.8);margin-bottom:6px}
.campo input{width:100%;padding:15px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff;font:500 16px Inter;outline:none}
.campo input:focus{border-color:var(--amber)}
.erro{background:rgba(229,72,77,.15);border:1px solid rgba(229,72,77,.5);color:#ffd9da;border-radius:12px;padding:12px;font-size:13.5px;margin-bottom:14px}

/* telas escuras (abertura, entrar, instalar) */
.escura{background:linear-gradient(170deg,var(--navy2),var(--navy) 62%);color:#fff;min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:calc(var(--topo) + 28px) 24px calc(28px + var(--base))}
.escura .marca{width:112px;height:112px;border-radius:28px;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 14px 34px rgba(0,0,0,.35);margin-bottom:22px}
.escura .marca img{width:84px}
.escura h1{font:800 24px/1.25 Sora,sans-serif;text-wrap:balance}
.escura h1 em{font-style:normal;color:var(--amber)}
.escura p{font-size:14px;color:rgba(255,255,255,.7);margin-top:8px;line-height:1.55;max-width:34ch}
.escura .caixa{width:100%;max-width:380px;margin-top:26px;text-align:left}
.escura .rodape{margin-top:22px;font-size:12px;color:rgba(255,255,255,.45)}
.escura .rodape a{color:rgba(255,255,255,.75);text-decoration:underline}
.carregando{width:150px;height:4px;border-radius:4px;background:rgba(255,255,255,.15);margin-top:34px;overflow:hidden}
.carregando i{display:block;height:100%;width:0;background:var(--amber);border-radius:4px;animation:carregar 1.1s ease-out forwards}
@keyframes carregar{to{width:100%}}

/* simulado */
.sim-topo{background:var(--navy);color:#fff;padding:calc(var(--topo) + 12px) 16px 12px;position:sticky;top:0;z-index:10}
.sim-topo .l1{display:flex;justify-content:space-between;align-items:center;gap:10px;max-width:640px;margin:0 auto}
.sim-topo .t{font:700 14px Sora,sans-serif}
.sim-topo .s{font-size:12px;color:rgba(255,255,255,.6);margin-top:1px}
.relogio{background:rgba(245,184,0,.16);color:var(--amber);font:700 13px Inter;padding:6px 10px;border-radius:14px;font-variant-numeric:tabular-nums;white-space:nowrap}
.relogio.fim{background:rgba(229,72,77,.2);color:#ff9ea1}
.progresso{height:4px;background:rgba(255,255,255,.15);border-radius:4px;margin:10px auto 0;overflow:hidden;max-width:640px}
.progresso i{display:block;height:100%;background:var(--amber);transition:width .25s}
.sim-corpo{flex:1;padding:18px 16px 16px;max-width:640px;width:100%;margin:0 auto}
.qnum{font-size:12px;font-weight:700;color:var(--blue);letter-spacing:.5px;margin-bottom:8px}
.enunciado{font:600 17px/1.5 Inter;margin-bottom:18px;white-space:pre-line}
.alt{width:100%;text-align:left;background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:14px;display:flex;gap:12px;align-items:center;font-size:15px;line-height:1.4;margin-bottom:10px;transition:border-color .12s,background .12s}
.alt .l{width:30px;height:30px;border-radius:9px;background:#EEF3F9;color:var(--blue);font:800 13px Sora,sans-serif;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.alt.sel{border-color:var(--blue);background:#EEF5FD}
.alt.sel .l{background:var(--blue);color:#fff}
.sim-base{background:#fff;border-top:1px solid var(--line);padding:10px 14px calc(12px + var(--base));position:sticky;bottom:0}
.sim-base-in{max-width:640px;margin:0 auto}
.grade{display:grid;grid-template-columns:repeat(10,1fr);gap:5px;margin-bottom:10px}
.grade button{height:28px;border-radius:7px;background:#EDF1F6;font:600 11px Inter;color:var(--mut)}
.grade button.resp{background:#CFE0F4;color:var(--blue)}
.grade button.atual{background:var(--blue);color:#fff}
.navega{display:flex;gap:8px}
.navega button{flex:1;padding:13px;border-radius:12px;font:700 14px Sora,sans-serif}
.navega .ant{background:#EEF3F9;color:var(--blue)}
.navega .prox{background:var(--blue);color:#fff}
.navega .fim{background:var(--amber);color:var(--navy)}
.link-prova{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--blue);background:#E9F0F8;border-radius:10px;padding:8px 12px;margin-bottom:14px}

/* folha inferior (modal) */
.folha-fundo{position:fixed;inset:0;background:rgba(8,18,38,.55);z-index:50;display:none;align-items:flex-end;justify-content:center}
.folha-fundo.aberta{display:flex}
.folha{background:#fff;width:100%;max-width:640px;max-height:88%;border-radius:22px 22px 0 0;display:flex;flex-direction:column;animation:subir .22s ease-out}
@keyframes subir{from{transform:translateY(40px);opacity:.6}to{transform:none;opacity:1}}
.folha-topo{display:flex;justify-content:space-between;align-items:center;padding:16px 18px 12px;border-bottom:1px solid var(--line)}
.folha-topo h2{font:800 16px Sora,sans-serif}
.folha-topo button{font-size:22px;color:var(--mut);width:36px;height:36px;line-height:1}
.folha-corpo{overflow-y:auto;padding:16px 18px;-webkit-overflow-scrolling:touch}
.folha-base{padding:12px 18px calc(12px + var(--base));border-top:1px solid var(--line)}
.dialogo p{font-size:15px;line-height:1.55;color:var(--txt);margin-bottom:16px}

/* resultado */
.selo{display:inline-block;font:800 13px Sora,sans-serif;letter-spacing:2px;padding:7px 16px;border-radius:20px}
.selo.ok{color:var(--green);background:#E3F6EC}
.selo.no{color:var(--red);background:#FDEBEC}
.res-num{font:800 30px Sora,sans-serif;margin-top:12px}
.res-sub{font-size:13px;color:var(--mut);margin-top:3px}
.rosca{margin:18px auto 14px;display:block}
.nums{display:flex;gap:10px;margin-bottom:16px}
.nums div{flex:1;background:#fff;border:1px solid var(--line);border-radius:14px;padding:11px 4px;text-align:center}
.nums b{display:block;font:800 22px Sora,sans-serif;font-variant-numeric:tabular-nums}
.nums span{font-size:12px;color:var(--mut)}

/* gabarito */
.gq{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;margin-bottom:12px}
.gq .cab{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:8px}
.gq .txt{font:600 14.5px/1.5 Inter;white-space:pre-line}
.ga{font-size:14px;padding:9px 11px;border-radius:10px;margin-top:6px;display:flex;justify-content:space-between;gap:10px;line-height:1.4}
.ga.certa{background:#E3F6EC;color:#136c3f;font-weight:700}
.ga.errada{background:#FDEBEC;color:#a8242a;font-weight:700}
.ga.neutra{color:var(--mut)}
.ga small{font-weight:600;white-space:nowrap;opacity:.85}
.sem-resposta{margin-top:10px;font-size:13px;font-weight:600;color:var(--mut);background:#F3F6FA;border-radius:10px;padding:9px 11px}
.status-q{font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase}
.status-q.certa{color:var(--green)}.status-q.errada{color:var(--red)}.status-q.branco{color:var(--mut)}
.comodore-btn{margin-top:12px;width:100%;display:flex;align-items:center;gap:10px;background:linear-gradient(135deg,var(--navy),var(--blue));color:#fff;border-radius:12px;padding:12px 14px;font:700 14px Sora,sans-serif;text-align:left}
.comodore-btn .bot{width:28px;height:28px;border-radius:8px;background:rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;font-size:15px}
.comodore-btn small{margin-left:auto;font:700 10px Inter;background:var(--amber);color:var(--navy);padding:3px 7px;border-radius:6px}

/* comodore */
.msg{font-size:14.5px;line-height:1.6;margin-bottom:14px}
.msg.bot{background:#F3F7FC;border-radius:14px;padding:12px 14px}
.msg.eu{background:var(--blue);color:#fff;border-radius:14px;padding:10px 14px;margin-left:36px}
.msg .aviso{border-radius:10px;padding:10px 12px;margin-bottom:10px;font-size:13.5px}
.msg .aviso.ok{background:#E3F6EC;color:#136c3f}
.msg .aviso.no{background:#FFF1DE;color:#9a4b00}
.digitando{display:inline-flex;gap:4px}
.digitando i{width:7px;height:7px;border-radius:50%;background:var(--blue);opacity:.35;animation:pulo 1s infinite}
.digitando i:nth-child(2){animation-delay:.15s}.digitando i:nth-child(3){animation-delay:.3s}
@keyframes pulo{50%{opacity:1;transform:translateY(-3px)}}
.sugestoes{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.sugestoes button{font-size:12.5px;font-weight:600;color:var(--blue);background:#E9F0F8;border-radius:16px;padding:7px 11px}
.pergunta{display:flex;gap:8px}
.pergunta input{flex:1;padding:13px;border-radius:12px;border:1px solid var(--line);font:500 15px Inter;outline:none}
.pergunta input:focus{border-color:var(--blue)}
.pergunta button{background:var(--blue);color:#fff;border-radius:12px;padding:0 16px;font:700 14px Sora,sans-serif}
.pergunta{align-items:center}
.pergunta input{border-radius:24px;padding:13px 16px}
.pergunta .enviar,.pergunta .cv-mic{width:46px;min-width:46px;height:46px;padding:0;margin:0;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.pergunta .enviar:active,.pergunta .cv-mic:active{transform:scale(.94)}
.saldo{font-size:12px;color:var(--mut);margin-top:8px;text-align:center}

/* instalar */
.inst-barra{width:100%;height:10px;border-radius:10px;background:rgba(255,255,255,.14);overflow:hidden}
.inst-barra i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--amber),#ffd966);border-radius:10px;transition:width .2s linear}
.inst-pct{font:700 13px Inter;color:var(--amber);margin-top:9px;text-align:center;font-variant-numeric:tabular-nums}
.passos{background:rgba(255,255,255,.07);border-radius:16px;padding:6px 16px;margin-top:22px}
.passo{display:flex;gap:12px;align-items:center;font-size:14px;padding:11px 0;line-height:1.4}
.passo + .passo{border-top:1px solid rgba(255,255,255,.08)}
.passo b{width:26px;height:26px;border-radius:50%;background:var(--amber);color:var(--navy);display:flex;align-items:center;justify-content:center;font:800 12px Sora,sans-serif;flex-shrink:0}
.passo svg{width:18px;height:18px;vertical-align:-3px}
.dica{font-size:13px !important;text-align:center;margin:12px auto 0 !important;color:rgba(255,255,255,.7)}
.btn-contorno{display:block;width:100%;text-align:center;margin-top:12px;padding:13px;border-radius:14px;border:1.5px solid rgba(255,255,255,.28);color:#fff;font:700 14px Sora,sans-serif}
.seta{position:fixed;z-index:60;color:var(--amber);width:54px;height:54px;filter:drop-shadow(0 4px 10px rgba(0,0,0,.45));pointer-events:none}
.seta svg{width:100%;height:100%}
.seta.baixo-centro{left:50%;bottom:calc(8px + var(--base));margin-left:-27px;animation:quica 1s ease-in-out infinite}
.seta.baixo-direita{right:14px;bottom:calc(8px + var(--base));animation:quica 1s ease-in-out infinite}
.seta.cima-direita{right:10px;top:calc(4px + var(--topo));transform:rotate(180deg);animation:quica-cima 1s ease-in-out infinite}
@keyframes quica{50%{transform:translateY(10px)}}
@keyframes quica-cima{0%,100%{transform:rotate(180deg)}50%{transform:rotate(180deg) translateY(10px)}}
.oculto{display:none !important}

:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}}

/* Simulado grátis e tela de liberar curso */
.chip.teste{background:#E3F6EC;color:#157a47}
.aviso-teste{background:#E9F6EF;border:1px solid #BFE6CF;border-radius:14px;padding:13px 15px;font-size:13.5px;line-height:1.5;color:#1d4d35;margin-bottom:16px}
.aviso-teste b{display:block;font-size:14px;margin-bottom:2px}
.fim-teste{margin-top:16px;background:var(--card);border:1px solid #F5D46B;border-radius:16px;padding:18px 16px;text-align:left}
.fim-teste>b{display:block;font:800 16px Sora,sans-serif;color:var(--txt);margin-bottom:6px}
.fim-teste p{font-size:14px;line-height:1.5;color:var(--mut);margin:0 0 14px}
.cartao-liberar{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px 18px;text-align:center}
.lib-icone{font-size:34px;margin-bottom:6px}
.cartao-liberar h2{font:800 19px Sora,sans-serif;color:var(--txt);margin:0 0 8px}
.cartao-liberar>p{font-size:14px;line-height:1.55;color:var(--mut);margin:0 0 14px}
.lib-lista{list-style:none;padding:0;margin:0 0 18px;text-align:left;font-size:14px;line-height:2;color:var(--txt)}
.lib-obs{font-size:12px!important;color:var(--mut);margin:10px 0 0!important;text-align:center}
.lib-link{display:inline-block;margin-top:14px;color:var(--blue);font-weight:700;font-size:14px}

/* Foto/avatar do aluno (início e perfil); sem foto, as iniciais */
.eu{display:flex;align-items:center;gap:12px;min-width:0;color:inherit;text-decoration:none}
.avatar{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:50%;overflow:hidden;background:var(--amber);color:var(--navy);border:2px solid rgba(255,255,255,.85);box-shadow:0 2px 8px rgba(0,0,0,.25)}
.avatar b{font-family:Sora,sans-serif;font-weight:800;line-height:1}
.avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#fff}
