/* CBN Família (13/11/2026). Paleta do manual da marca: Azul CBN #1E3970, Amarelo CBN #FBB900, Azul profundo #000040,
   Azul das dobras #212C52. Regra: sobre azul, letra branca ou amarela; sobre amarelo, azul profundo. Nunca cinza sobre azul. */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Montserrat:wght@700;800&display=swap");
:root{--azul:#1E3970;--azul2:#212C52;--fundo:#000040;--claro:#DCE4F5;--clarinho:#EEF2FA;--amarelo:#FBB900;--amareloc:#FFF1C7;--verde:#147A4B;--vermelho:#C0392B;--raio:16px}
*{box-sizing:border-box}
html,body{margin:0}
body{font:16px/1.5 "Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--fundo);background:linear-gradient(180deg,#E3E9F6 0%,#EEF2FA 100%);min-height:100vh;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
h1,h2,h3{font-family:"Montserrat","Inter",system-ui,sans-serif;margin:0 0 8px;line-height:1.2}
h1{font-size:24px}h2{font-size:18px}h3{font-size:15px;margin-top:14px}
a{color:var(--azul);font-weight:600}
.topo{position:sticky;top:0;z-index:20;background:var(--azul);border-bottom:4px solid var(--amarelo);padding:calc(10px + env(safe-area-inset-top)) 18px 10px}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff}
.marca img{height:34px}
.marca span{font-family:"Montserrat",sans-serif;font-weight:800;font-size:18px;color:var(--amarelo)}
.faixa-teste{background:var(--amarelo);color:var(--fundo);font-size:13px;font-weight:700;padding:7px 18px}
.faixa-teste a{color:var(--fundo)}
main{max-width:560px;margin:0 auto;padding:16px}
.cartao{background:#fff;border-radius:var(--raio);padding:18px;margin:0 0 14px;box-shadow:0 4px 14px rgba(0,0,64,.10);border-top:5px solid var(--azul)}
.cartao:nth-of-type(even){border-top-color:var(--amarelo)}
.boas-vindas{background:linear-gradient(150deg,var(--azul) 0%,var(--azul2) 100%);color:#fff;border-radius:var(--raio);padding:22px 18px;margin:0 0 14px}
.boas-vindas p{color:#FFE7A3;margin:6px 0 0}
.cab{background:linear-gradient(150deg,var(--azul) 0%,#2B4F95 100%);color:#fff;border-radius:var(--raio);padding:20px 18px;margin:0 0 14px;box-shadow:0 6px 18px rgba(30,57,112,.35)}
.cab p{color:#FFE7A3;margin:0 0 12px}
.filhos{display:grid;gap:8px}
.filho{display:flex;gap:12px;align-items:center;background:rgba(255,255,255,.14);border:2px solid rgba(251,185,0,.55);border-radius:14px;padding:10px 12px}
.filho b{display:block;color:#fff}.filho small{color:#FFE7A3;font-weight:600}
.av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-weight:800;flex-shrink:0;background:var(--amarelo);color:var(--fundo)}
.filho.c1 .av{background:#fff;color:var(--azul)}.filho.c2 .av{background:#7FA7F5;color:var(--fundo)}
.campo{display:block;margin:0 0 12px}
.campo span{display:block;font-size:13px;font-weight:700;color:var(--azul);margin-bottom:5px}
.campo input,.busca input{width:100%;border:2px solid var(--claro);border-radius:12px;padding:13px;font:inherit;color:var(--fundo);background:#fff}
.campo input:focus,.busca input:focus{outline:3px solid var(--amarelo);border-color:var(--azul)}
.codigo{font-size:28px!important;letter-spacing:10px;text-align:center;font-weight:700}
.check{display:flex;gap:8px;align-items:flex-start;font-size:14px;margin:4px 0 12px}
.check input{width:20px;height:20px;margin-top:2px;accent-color:var(--azul)}
.bt{display:inline-block;border:0;border-radius:12px;padding:12px 16px;font:700 15px "Inter",sans-serif;cursor:pointer;text-decoration:none;text-align:center}
.bt.amarelo{background:var(--amarelo);color:var(--fundo)}
.bt.azul{background:var(--azul);color:#fff}
.bt.claro{background:var(--claro);color:var(--azul)}
.bt.cheio{width:100%;padding:15px;font-size:16px}
.linha{margin-top:10px}
.ou{text-align:center;color:var(--azul);font-weight:700;margin:12px 0}
.nota{font-size:13px;color:#3B4670}
.nota.claro{color:#FFE7A3}
.aviso{border-radius:12px;padding:11px 14px;font-weight:600;font-size:14px;margin:0 0 14px;background:#DFF3E8;color:var(--verde)}
.aviso.erro{background:#FDE3E1;color:var(--vermelho)}
.termo h2{color:var(--azul)}.termo p{font-size:14px}
.busca{display:flex;gap:8px;margin:12px 0}
.alunos{list-style:none;margin:0;padding:0}
.alunos form{margin:0}
.linha-aluno{width:100%;text-align:left;background:var(--clarinho);border:0;border-left:5px solid var(--azul);border-radius:10px;padding:10px 12px;margin:0 0 6px;font:inherit;cursor:pointer;color:var(--fundo)}
.linha-aluno small{display:block;color:var(--azul);font-weight:600}
.grade{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.tile{border-radius:14px;padding:12px;color:#fff}
.tile b{display:block}.tile small{font-weight:600;opacity:.95}
.t1{background:var(--verde)}.t2{background:var(--azul)}.t3{background:#2B4F95}.t4{background:var(--amarelo);color:var(--fundo)}.t5{background:var(--azul2)}.t6{background:#C77700}
.faceid{background:linear-gradient(150deg,#FFF6DA 0%,#fff 70%)}
.instalar-dica{background:linear-gradient(150deg,#E3EBFF 0%,#fff 70%)}
.dado{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid var(--claro);padding:8px 0;margin:0;font-size:14px;flex-wrap:wrap}
.dado span{color:var(--azul);font-weight:600}
.aparelhos{list-style:none;padding:0;margin:0 0 12px}
.aparelhos li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--claro)}
.aparelhos small{display:block;color:#3B4670}
.aparelhos form{margin:0}
.passo ol{padding-left:20px;margin:0}.passo li{margin-bottom:6px}
.passo.p1{border-top-color:var(--amarelo)}.passo.p2{border-top-color:var(--verde)}
details summary{cursor:pointer;font-weight:700;color:var(--azul)}
.nav{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;background:#fff;border-top:4px solid var(--amarelo);padding:6px 6px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -6px 18px rgba(0,0,64,.12)}
.nav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px;font-weight:700;color:var(--azul);text-decoration:none;padding:4px 0}
.nav a i{font-style:normal;font-size:19px;width:44px;height:30px;display:grid;place-items:center;border-radius:10px}
.nav a[aria-current] i{background:var(--amarelo);color:var(--fundo)}
@media (min-width:900px){main{padding-top:28px}.nav{max-width:560px;margin:0 auto;border-radius:18px 18px 0 0}}
