/* EduAjuda Gestão · só do ambiente com login: a porta (entrar, primeiro acesso, convite), a pílula de gravação e a tela de acessos. */
.porta { position: fixed; inset: 0; z-index: 60; overflow-y: auto; background: var(--papel); display: flex; align-items: flex-start; justify-content: center; padding: 6vh 16px 40px; }
.porta-cartao { width: 100%; max-width: 440px; background: var(--card); border: 1px solid var(--linha); border-radius: 18px; box-shadow: var(--sombra); padding: 26px 26px 22px; }
.porta-cartao.largo { max-width: 860px; }
.porta-marca { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.porta-marca img { height: 38px; width: auto; }
.porta-marca b { font: 600 22px/1 var(--fd); color: var(--turq-esc); display: block; }
.porta-marca small { display: block; font: 800 10.5px/1 var(--fb); letter-spacing: .09em; text-transform: uppercase; color: var(--fraco); margin-top: 4px; }
.porta-cartao h1 { font-size: 22px; margin-bottom: 14px; }
.porta-cartao h2 { font-size: 17px; margin: 18px 0 8px; }
.porta-msg { margin: 6px 0; font-weight: 800; color: var(--suave); }
.porta-nota { font-size: 13.5px; font-weight: 700; color: var(--suave); margin: 12px 0 0; }
.porta-cartao form .porta-nota { margin-top: 14px; }
.porta-cartao > .porta-nota:first-of-type { margin: 0 0 14px; }
.porta-bt { width: 100%; min-height: 44px; margin-top: 4px; font-size: 15px; }
.porta-erro { padding: 10px 14px; border-radius: 12px; background: var(--verm-cl); color: #8F2E10; font-weight: 800; font-size: 13.5px; margin-bottom: 12px; }
.porta-pre { white-space: pre-wrap; font-size: 12px; background: var(--cinza-cl); border-radius: 10px; padding: 10px; max-height: 240px; overflow: auto; }
.porta-opcoes { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); margin-top: 6px; }
.porta-opcao { border: 1px solid var(--linha2); border-radius: 14px; padding: 16px; display: flex; flex-direction: column; gap: 8px; }
.porta-opcao h2 { margin: 0; }
.porta-opcao p { margin: 0; font-size: 13.5px; font-weight: 700; color: var(--suave); flex: 1; }
.porta-barra { height: 10px; border-radius: 999px; background: var(--cinza-cl); overflow: hidden; margin: 12px 0 6px; }
.porta-barra i { display: block; height: 100%; width: 0; background: var(--turq); border-radius: 999px; transition: width .25s; }

/* quem está usando, no alto do menu */
.quem b { display: block; font: 800 14.5px/1.25 var(--fb); color: var(--tinta); overflow-wrap: anywhere; }
.quem small { display: block; font-size: 12.5px; font-weight: 700; color: var(--suave); margin-top: 2px; }
.quem select { margin-top: 8px; }
.quem .acoes { display: flex; gap: 14px; margin-top: 9px; font-size: 13px; font-weight: 800; }
.quem .acoes button { border: 0; background: none; padding: 0; color: var(--turq); font: inherit; cursor: pointer; }
.quem .acoes button:hover, .quem .acoes a:hover { text-decoration: underline; }
body.classico .quem { color: #fff; } body.classico .quem b { display: inline; color: #fff; } body.classico .quem small { display: none; }
body.classico .quem .acoes { margin: 0; } body.classico .quem .acoes a, body.classico .quem .acoes button { color: #fff; }

/* pílula de gravação no topo */
.sinc { border: 0; min-height: 30px; padding: 0 12px; border-radius: 999px; font: 800 12.5px/1 var(--fb); white-space: nowrap; background: var(--verde-cl); color: #1F6B3B; cursor: pointer; }
.sinc::before { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: currentColor; margin-right: 7px; vertical-align: 0; }
.sinc.gravando { background: var(--azul-cl); color: #174F80; } .sinc.gravando::before { animation: sinc-pisca 1s infinite; }
.sinc.offline, .sinc.atencao { background: var(--ouro-cl); color: #7A4F00; }
.sinc.sessao { background: var(--verm-cl); color: #8F2E10; }
@keyframes sinc-pisca { 50% { opacity: .25; } }
.sinc-lista { margin: 0; padding-left: 18px; font-size: 13.5px; font-weight: 600; line-height: 1.5; }
.teste-faixa { background: #07525C; color: #E1F2F4; font: 700 12.5px/1.35 var(--fb); padding: 6px 22px; }
.teste-faixa b { color: #fff; }
.teste-faixa button { border: 0; background: none; padding: 0; font: inherit; color: #BFE9EE; text-decoration: underline; cursor: pointer; }

/* tela de acessos */
.pilha { display: grid; gap: 16px; } .pilha > * { margin: 0; min-width: 0; }
.link-convite { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 12px; border-radius: 12px; background: var(--turq-cl); margin: 10px 0 4px; }
.link-convite input { flex: 1; min-width: 220px; min-height: 38px; border-radius: 10px; border: 1px solid var(--linha2); background: #fff; padding: 0 10px; font: 700 13px/1 ui-monospace, Consolas, monospace; }
.papeis-lista { display: flex; flex-wrap: wrap; gap: 6px; }
.papeis-lista .selo button { border: 0; background: none; padding: 0 0 0 4px; font: 900 13px/1 var(--fb); color: inherit; cursor: pointer; opacity: .7; } .papeis-lista .selo button:hover { opacity: 1; }
.conf-tab td.r, .conf-tab th.r { text-align: right; }
.conf-prob { margin: 0; padding-left: 18px; font-size: 13.5px; font-weight: 600; line-height: 1.5; }
@media (max-width: 900px) { .teste-faixa { padding: 6px 14px; } .sinc { max-width: 46vw; overflow: hidden; text-overflow: ellipsis; } }
@media print { .porta, .sinc, .teste-faixa { display: none !important; } }