/* Fontes servidas pelo próprio site (Fontsource, licença OFL), sem Google Fonts. */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('../vendor/fontes/inter-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url('../vendor/fontes/inter-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('../vendor/fontes/inter-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 400; font-display: swap; src: url('../vendor/fontes/cormorant-garamond-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 500; font-display: swap; src: url('../vendor/fontes/cormorant-garamond-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 600; font-display: swap; src: url('../vendor/fontes/cormorant-garamond-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 400; font-display: swap; src: url('../vendor/fontes/cormorant-garamond-latin-400-italic.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 500; font-display: swap; src: url('../vendor/fontes/cormorant-garamond-latin-500-italic.woff2') format('woff2'); }

/* Identidade visual de filipeferrara.com.br. Troque as cores aqui para mudar tudo. */
:root {
    --vinho: #7a1f2e;
    --vinho-claro: #8a2434;
    --vinho-escuro: #5e1422;
    --vinho-noite: #2a0f15;
    --preto-vinho: #0d0507;
    --dourado: #c9a27a;
    --dourado-claro: #e6c79f;
    --creme: #f6f1ea;
    --areia: #e8dccf;
    --borda: #d9cfc6;
    --borda-suave: rgba(122, 31, 46, .12);
    --texto: #4a4a4a;
    --texto-suave: #6d5f5a;
    --titulo: #2a0f15;
    --branco: #fff;
    --raio: 14px;
    --fonte-titulo: 'Cormorant Garamond', Georgia, serif;
    --fonte-texto: 'Inter', system-ui, sans-serif;
}

body {
    font-family: var(--fonte-texto);
    font-size: 15px;
    background: var(--creme);
    color: var(--texto);
}

h1, h2, h3 {
    font-family: var(--fonte-titulo);
    font-weight: 500;
    color: var(--titulo);
}

a { color: var(--vinho); }
a:hover { color: var(--vinho-escuro); }

/* Texto pequeno em caixa alta acima dos títulos, como "CURSOS E MENTORIAS" no site */
.sobretitulo {
    margin: 0 0 6px;
    font-size: .68rem;
    font-weight: 500;
    letter-spacing: .28em;
    text-transform: uppercase;
    color: var(--vinho);
}
.sobretitulo-dourado { color: var(--dourado); }

/* Logo em texto */
.marca { display: inline-flex; flex-direction: column; line-height: 1; text-decoration: none; }
.marca-nome {
    font-family: var(--fonte-titulo);
    font-size: 1.6rem;
    font-weight: 500;
    letter-spacing: .14em;
    color: var(--titulo);
}
.marca-slogan {
    margin-top: 4px;
    font-size: .56rem;
    letter-spacing: .26em;
    text-transform: uppercase;
    color: var(--vinho);
}

/* Botão principal: gradiente vinho com borda dourada, igual a "Agendar avaliação" */
.btn-primario {
    width: 100%;
    padding: 14px 26px;
    border: 1px solid rgba(201, 162, 122, .5);
    border-radius: 12px;
    background: linear-gradient(135deg, var(--vinho-claro), var(--vinho-escuro));
    color: var(--branco);
    font-weight: 600;
    font-size: .9rem;
    transition: filter .2s, transform .2s;
}
.btn-primario:hover,
.btn-primario:focus-visible {
    color: var(--branco);
    filter: brightness(1.12);
}
.btn-primario:active { transform: translateY(1px); }

/* Formulários */
.form-label {
    font-size: .8rem;
    font-weight: 500;
    color: var(--titulo);
}
.form-control,
.input-group-text,
.btn-olho {
    background: var(--branco);
    border-color: var(--borda);
    color: var(--texto);
    padding-top: .65rem;
    padding-bottom: .65rem;
}
.input-group-text,
.btn-olho { color: var(--texto-suave); }
.btn-olho:hover { background: var(--creme); color: var(--vinho); border-color: var(--borda); }
.form-control::placeholder { color: #a39791; }
.form-control:focus {
    border-color: var(--dourado);
    box-shadow: 0 0 0 .2rem rgba(201, 162, 122, .25);
}
.input-group:focus-within .input-group-text,
.input-group:focus-within .btn-olho { border-color: var(--dourado); }
.form-check-input { border-color: var(--borda); }
.form-check-input:focus { border-color: var(--dourado); box-shadow: 0 0 0 .2rem rgba(201, 162, 122, .25); }
.form-check-input:checked { background-color: var(--vinho); border-color: var(--vinho); }
.link-suave { color: var(--vinho); text-decoration: none; font-weight: 500; }
.link-suave:hover { text-decoration: underline; }

/* ---------- Telas de login ---------- */

.pagina-auth {
    min-height: 100vh;
    background:
        radial-gradient(ellipse at 20% 0%, rgba(122, 31, 46, .55) 0%, transparent 55%),
        radial-gradient(ellipse at 100% 100%, rgba(201, 162, 122, .18) 0%, transparent 50%),
        var(--preto-vinho);
}
.auth-wrapper {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: max(32px, env(safe-area-inset-top)) 16px max(32px, env(safe-area-inset-bottom));
}
.auth-card {
    width: 100%;
    max-width: 420px;
    padding: 40px 36px;
    background: var(--branco);
    border: 1px solid rgba(201, 162, 122, .35);
    border-radius: 18px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .45);
}
.auth-marca {
    display: flex;
    justify-content: center;
    margin-bottom: 28px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--borda-suave);
    text-decoration: none;
}
.auth-marca .marca { align-items: center; }
.auth-card .sobretitulo { text-align: center; }
.auth-titulo {
    margin: 0;
    text-align: center;
    font-size: 2.1rem;
}
.auth-subtitulo {
    margin: 6px 0 26px;
    text-align: center;
    font-size: .88rem;
    color: var(--texto-suave);
}
.auth-rodape {
    margin: 22px 0 0;
    text-align: center;
    font-size: .85rem;
}
.auth-rodape a { text-decoration: none; font-weight: 500; }

/* Entrar com Google: botão branco com o "G" colorido, como pede o Google */
.btn-google {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    padding: 12px 16px;
    border: 1px solid var(--borda);
    border-radius: 12px;
    background: var(--branco);
    color: #3c4043;
    font-weight: 600;
    font-size: .9rem;
    text-decoration: none;
    transition: background .2s, border-color .2s, box-shadow .2s;
}
.btn-google:hover {
    background: #f8f9fa;
    border-color: var(--dourado);
    color: #3c4043;
    box-shadow: 0 2px 10px rgba(42, 15, 21, .08);
}
.divisor {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 20px 0;
    font-size: .75rem;
    color: var(--texto-suave);
}
.divisor::before,
.divisor::after { content: ''; flex: 1; height: 1px; background: var(--borda); }

/* Política de privacidade e link no rodapé do login */
.texto-legal { font-size: .88rem; line-height: 1.65; }
.texto-legal h2 { margin: 20px 0 6px; font-size: 1.3rem; }
.texto-legal ul { padding-left: 18px; }
.link-privacidade { color: var(--areia); font-size: .78rem; text-decoration: none; opacity: .8; }
.link-privacidade:hover { color: var(--dourado-claro); opacity: 1; }
.pagina-auth .auth-card:has(.texto-legal) { max-width: 640px; }

/* MFA */
.campo-codigo { font-size: 1.4rem; letter-spacing: .3em; text-align: center; font-variant-numeric: tabular-nums; }
.passos-mfa { margin-top: 0; }
.mfa-qr { width: 200px; margin: 0 auto 14px; padding: 8px; border: 1px solid var(--borda); border-radius: 12px; background: var(--branco); }
.mfa-qr svg { display: block; width: 100%; height: auto; }
.mfa-chave { margin-bottom: 18px; font-size: .82rem; text-align: center; }
.mfa-chave summary { cursor: pointer; color: var(--vinho); font-weight: 500; }
.mfa-chave code { display: block; margin-top: 8px; padding: 8px; border-radius: 8px; background: var(--creme); color: var(--titulo); font-size: .95rem; letter-spacing: .08em; word-break: break-all; }
.codigos-recuperacao {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 0 0 16px;
    padding: 0;
    list-style: none;
}
.codigos-recuperacao code {
    display: block;
    padding: 8px;
    border: 1px dashed var(--dourado);
    border-radius: 8px;
    background: var(--creme);
    color: var(--titulo);
    font-size: .95rem;
    text-align: center;
}

@media (max-width: 420px) {
    .auth-card { padding: 32px 22px; }
    .marca-nome { font-size: 1.35rem; }
}

/* ---------- Área logada ---------- */

.pagina-app {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.cabecalho {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: calc(78px + env(safe-area-inset-top));
    /* No app instalado do iPhone, a faixa passa por baixo do relógio: o conteúdo desce. */
    padding: env(safe-area-inset-top) max(32px, env(safe-area-inset-right)) 0 max(32px, env(safe-area-inset-left));
    /* Faixa vinho, no mesmo gradiente dos botões, com textos em branco */
    background: linear-gradient(135deg, var(--vinho-claro), var(--vinho-escuro));
    border-bottom: 1px solid rgba(201, 162, 122, .45);
    box-shadow: 0 4px 22px rgba(42, 15, 21, .25);
}
.cabecalho-esquerda { display: flex; align-items: center; gap: 16px; min-width: 0; }
.cabecalho-marca { text-decoration: none; flex-shrink: 0; }
.cabecalho .marca-nome { color: var(--branco); }

/* Botão "Instalar app" */
.btn-instalar {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 13px;
    border: 1px solid rgba(230, 199, 159, .6);
    border-radius: 999px;
    background: rgba(255, 255, 255, .06);
    color: var(--branco);
    font-size: .76rem;
    font-weight: 600;
    white-space: nowrap;
    transition: background .2s, color .2s;
}
.btn-instalar i { color: var(--dourado-claro); }
.btn-instalar:hover { background: var(--branco); color: var(--vinho); }
.btn-instalar:hover i { color: var(--vinho); }
.btn-instalar[hidden] { display: none; }
.btn-instalar-auth { padding: 10px 18px; font-size: .82rem; }

/* Janela do passo a passo de instalação */
.dialogo {
    width: min(420px, calc(100vw - 32px));
    padding: 0;
    border: 1px solid rgba(201, 162, 122, .35);
    border-radius: 18px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .45);
}
.dialogo::backdrop { background: rgba(13, 5, 7, .7); }
.dialogo-corpo { position: relative; padding: 32px 26px 24px; text-align: center; }
.dialogo-corpo h2 { margin: 14px 0 6px; font-size: 1.7rem; }
.dialogo-icone { border-radius: 16px; box-shadow: 0 8px 24px rgba(42, 15, 21, .25); }
.dialogo-texto { color: var(--texto-suave); font-size: .88rem; }
.dialogo-fechar {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--texto-suave);
}
.dialogo-fechar:hover { background: var(--creme); color: var(--vinho); }
.passos {
    margin: 18px 0 22px;
    padding: 0;
    list-style: none;
    counter-reset: passo;
    text-align: left;
}
.passos li {
    position: relative;
    margin-bottom: 12px;
    padding-left: 40px;
    font-size: .9rem;
    line-height: 1.5;
    counter-increment: passo;
}
.passos li::before {
    content: counter(passo);
    position: absolute;
    left: 0;
    top: -1px;
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--vinho-claro), var(--vinho-escuro));
    color: var(--branco);
    font-size: .78rem;
    font-weight: 600;
}
.passos i { color: var(--vinho); }
.cabecalho .marca-slogan { color: var(--dourado-claro); }

.menu { display: flex; gap: 4px; }
.menu-link {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    color: var(--branco);
    font-size: .88rem;
    font-weight: 500;
    text-decoration: none;
}
.menu-link i { display: none; }
.menu-link:hover,
.menu-link.ativo { color: var(--branco); }
.menu-link.ativo::after {
    content: '';
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 2px;
    height: 2px;
    background: var(--dourado-claro);
}

.cabecalho-acoes { display: flex; align-items: center; gap: 10px; }
.chip-usuario {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 14px 4px 4px;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 500;
    color: var(--branco);
}
.avatar {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--dourado-claro);
    color: var(--vinho-noite);
    font-size: .72rem;
    font-weight: 600;
}
.botao-redondo {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 50%;
    background: transparent;
    color: var(--branco);
    transition: background .2s, color .2s;
}
.botao-redondo:hover { background: var(--branco); border-color: var(--branco); color: var(--vinho); }

.app-main {
    flex: 1;
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: 36px 32px 56px;
}

/* Faixa escura no topo do dashboard, no estilo do banner principal do site */
.destaque {
    position: relative;
    overflow: hidden;
    padding: 48px 44px;
    border-radius: 18px;
    background:
        radial-gradient(ellipse at 90% 10%, rgba(201, 162, 122, .18) 0%, transparent 45%),
        linear-gradient(135deg, var(--vinho-noite) 0%, var(--preto-vinho) 70%);
    color: var(--areia);
}
.destaque h1 {
    margin: 0 0 10px;
    font-size: clamp(2.2rem, 5vw, 3.4rem);
    font-weight: 400;
    color: var(--branco);
}
.destaque h1 em { font-style: italic; color: var(--dourado-claro); }
.destaque p { max-width: 560px; margin-bottom: 18px; color: var(--areia); }

.selo-admin {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    border: 1px solid rgba(201, 162, 122, .5);
    border-radius: 999px;
    color: var(--dourado-claro);
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .06em;
}

.rodape {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 28px 32px;
    background: var(--preto-vinho);
    color: var(--borda);
    font-size: .8rem;
}
.rodape p { margin: 0; }
.rodape a { color: var(--dourado); text-decoration: none; }
.rodape .marca-nome { color: var(--branco); font-size: 1.25rem; }
.rodape .marca-slogan { color: var(--dourado); }

/* Celular: menu vira barra fixa embaixo */
@media (max-width: 768px) {
    .cabecalho {
        gap: 10px;
        min-height: calc(64px + env(safe-area-inset-top));
        padding-left: max(16px, env(safe-area-inset-left));
        padding-right: max(16px, env(safe-area-inset-right));
    }
    .cabecalho-esquerda { gap: 10px; }
    .marca-nome { font-size: 1.25rem; }
    .chip-nome { display: none; }
    .chip-usuario { padding: 0; border: 0; }

    .menu {
        position: fixed;
        inset: auto 0 0 0;
        z-index: 20;
        justify-content: space-around;
        height: calc(64px + env(safe-area-inset-bottom));
        padding: 0 8px env(safe-area-inset-bottom);
        background: linear-gradient(135deg, var(--vinho-claro), var(--vinho-escuro));
        border-top: 1px solid rgba(201, 162, 122, .45);
        box-shadow: 0 -4px 22px rgba(42, 15, 21, .25);
    }
    .menu-link {
        flex-direction: column;
        gap: 3px;
        padding: 8px 12px;
        font-size: .68rem;
        color: var(--branco);
    }
    .menu-link i { display: block; font-size: 1.05rem; }
    .menu-link.ativo i { color: var(--dourado-claro); }
    .menu-link.ativo span { border-bottom: 2px solid var(--dourado-claro); }
    .menu-link.ativo::after { display: none; }

    .menu-link { min-width: 64px; }

    .app-main { padding: 20px 16px 40px; }
    .destaque { padding: 32px 24px; }
    .rodape { padding: 24px 16px calc(88px + env(safe-area-inset-bottom)); }

    /* Campos com 16px: o iPhone não dá zoom sozinho ao tocar */
    .form-control,
    .form-select { font-size: 16px; }
    /* Alvos de toque de pelo menos 40px */
    .btn-icone { width: 40px; height: 40px; }
    .alca { padding: 10px 6px; }
}

/* Celular estreito: só o ícone do "Instalar app", logo um pouco menor */
@media (max-width: 480px) {
    .btn-instalar:not(.btn-instalar-auth) { width: 36px; height: 36px; padding: 0; justify-content: center; }
    .btn-instalar:not(.btn-instalar-auth) span { display: none; }
}
@media (max-width: 380px) {
    .cabecalho .marca-nome { font-size: 1.05rem; letter-spacing: .1em; }
    .cabecalho .marca-slogan { font-size: .5rem; letter-spacing: .18em; }
}

/* ---------- Painel administrativo ---------- */

.btn-primario.btn-auto { width: auto; }
.btn-contorno {
    padding: 10px 18px;
    border: 1px solid var(--borda);
    border-radius: 12px;
    background: var(--branco);
    color: var(--titulo);
    font-size: .88rem;
    font-weight: 500;
}
.btn-contorno:hover,
.btn-check:checked + .btn-contorno {
    border-color: var(--vinho);
    background: var(--vinho);
    color: var(--branco);
}
.btn-check:focus-visible + .btn-contorno { box-shadow: 0 0 0 .2rem rgba(201, 162, 122, .35); }
.form-select { border-color: var(--borda); padding-top: .65rem; padding-bottom: .65rem; }
.form-select:focus { border-color: var(--dourado); box-shadow: 0 0 0 .2rem rgba(201, 162, 122, .25); }
.form-switch { padding-left: 3.1em; }
.form-switch .form-check-input { width: 2.4em; margin-left: -3.1em; }

.migalhas {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    font-size: .8rem;
    color: var(--texto-suave);
}
.migalhas a { color: var(--texto-suave); text-decoration: none; }
.migalhas a:hover { color: var(--vinho); }
.migalhas i { font-size: .55rem; opacity: .6; }
.migalhas span { color: var(--titulo); font-weight: 500; }

.admin-topo {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
}
.admin-topo h1 { margin: 0; font-size: clamp(2rem, 4vw, 2.6rem); }
.admin-ajuda { margin: 6px 0 0; max-width: 640px; font-size: .85rem; color: var(--texto-suave); }

.admin-grade {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: 24px;
    align-items: start;
}

.painel {
    padding: 26px;
    background: var(--branco);
    border: 1px solid var(--borda-suave);
    border-radius: var(--raio);
}
.painel-estreito { max-width: 720px; }
.painel-cabecalho { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.painel-titulo { margin: 0 0 16px; font-size: 1.5rem; }
.painel-cabecalho .painel-titulo { margin: 0; }

.vazio { text-align: center; padding: 48px 24px; }
.vazio > i { font-size: 2rem; color: var(--dourado); margin-bottom: 12px; }
.vazio h2 { font-size: 1.6rem; }
.vazio p { color: var(--texto-suave); }
.vazio-pequeno { padding: 28px 12px; }

.pill {
    flex-shrink: 0;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: .7rem;
    font-weight: 600;
}
.pill-ok { background: rgba(46, 125, 50, .1); color: #2e7d32; }
.pill-off { background: var(--creme); color: var(--texto-suave); }

/* Linhas arrastáveis */
.lista-admin,
.estrutura,
.estrutura-aulas,
.lista-materiais { list-style: none; margin: 0; padding: 0; }
.lista-admin { display: grid; gap: 10px; }

.item-admin {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
    background: var(--branco);
    border: 1px solid var(--borda-suave);
    border-radius: 12px;
}
.lista-admin > .item-admin:hover { border-color: rgba(201, 162, 122, .6); }
.item-admin.oculto,
.item-aula.oculto,
.estrutura-modulo.oculto > .item-admin { opacity: .6; }
.alca {
    flex-shrink: 0;
    padding: 6px 4px;
    color: #b7aaa3;
    cursor: grab;
    touch-action: none;
}
.alca:hover { color: var(--vinho); }
.arrastando { opacity: .4; background: var(--creme) !important; }

.miniatura {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--vinho-noite), var(--preto-vinho));
    color: var(--dourado);
}
.miniatura-vertical { width: 42px; height: 56px; }
.miniatura img { width: 100%; height: 100%; object-fit: cover; }

.item-texto {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    color: var(--titulo);
    text-decoration: none;
}
.item-texto:hover strong,
.item-texto:hover > span:first-child { color: var(--vinho); }
.item-texto .sobretitulo { margin: 0 0 2px; font-size: .6rem; }
.item-texto strong { font-weight: 600; font-size: .95rem; }
.item-meta { font-size: .75rem; color: var(--texto-suave); }
.item-meta i { font-size: .7rem; }

.item-acoes { display: flex; gap: 4px; flex-shrink: 0; }
.btn-icone {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border: 1px solid transparent;
    border-radius: 50%;
    background: transparent;
    color: var(--texto-suave);
    font-size: .85rem;
    text-decoration: none;
}
.btn-icone:hover { background: var(--creme); color: var(--vinho); border-color: var(--borda); }
.btn-icone.perigo:hover { background: #fdecec; color: #b42318; border-color: #f5c2c0; }

/* Estrutura: módulo com as aulas dentro */
.estrutura { display: grid; gap: 14px; margin-top: 16px; }
.estrutura-modulo {
    border: 1px solid var(--borda-suave);
    border-radius: 14px;
    background: var(--creme);
    overflow: hidden;
}
.estrutura-modulo > .item-admin { border: 0; border-radius: 0; border-bottom: 1px solid var(--borda-suave); }
.estrutura-aulas { min-height: 12px; padding: 8px 10px 0; }
.item-aula {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
    padding: 8px 10px;
    background: var(--branco);
    border: 1px solid var(--borda-suave);
    border-radius: 10px;
    font-size: .88rem;
}
.item-aula .item-texto > span:first-child { font-weight: 500; }
.item-aula-icone { color: var(--vinho); width: 16px; text-align: center; }
.adicionar-aula {
    display: block;
    padding: 10px 16px 14px;
    color: var(--vinho);
    font-size: .82rem;
    font-weight: 500;
    text-decoration: none;
}
.adicionar-aula:hover { text-decoration: underline; }

/* Formulários do painel */
.caixa-opcoes {
    padding: 16px;
    border: 1px solid var(--borda-suave);
    border-radius: 12px;
    background: var(--creme);
}
.caixa-opcoes legend {
    float: none;
    width: auto;
    margin: 0 0 8px;
    padding: 0;
    font-family: var(--fonte-texto);
    font-size: .8rem;
    font-weight: 600;
    color: var(--titulo);
}
.lista-materiais { margin-bottom: 16px; }

.form-capa { display: flex; gap: 18px; align-items: flex-start; margin-bottom: 18px; }
.capa-previa {
    flex-shrink: 0;
    width: 120px;
    aspect-ratio: 3 / 4;
    overflow: hidden;
    border-radius: 12px;
    background: linear-gradient(160deg, var(--vinho-noite), var(--preto-vinho));
}
.capa-previa img { width: 100%; height: 100%; object-fit: cover; }
.capa-previa span {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: var(--dourado);
    font-size: .75rem;
}
.capa-previa span i { font-size: 1.4rem; }

.video-previa {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 10px;
    padding: 8px;
    border: 1px solid var(--borda-suave);
    border-radius: 10px;
    background: var(--creme);
    font-size: .8rem;
    color: #2e7d32;
}
.video-previa img { width: 120px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 6px; }

.aviso-flutuante {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 50;
    max-width: 320px;
    padding: 12px 18px;
    border-radius: 12px;
    background: var(--vinho-noite);
    color: var(--branco);
    font-size: .85rem;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .2);
    opacity: 0;
    transform: translateY(10px);
    pointer-events: none;
    transition: opacity .2s, transform .2s;
}
.aviso-flutuante.visivel { opacity: 1; transform: none; }
.aviso-flutuante.erro { background: #b42318; }

@media (max-width: 992px) {
    .admin-grade { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
    .painel { padding: 18px; }
    .admin-topo { align-items: stretch; }
    .admin-topo > .btn { width: 100%; }
    .item-admin { gap: 10px; padding: 10px; flex-wrap: wrap; }
    .item-admin .item-texto { flex-basis: calc(100% - 130px); }
    .item-admin .item-acoes { width: 100%; justify-content: flex-end; border-top: 1px solid var(--borda-suave); padding-top: 6px; }
    .item-aula { flex-wrap: wrap; }
    .item-aula .item-texto { flex-basis: calc(100% - 70px); }
    .item-aula .item-acoes { width: 100%; justify-content: flex-end; }
    .item-texto strong,
    .item-texto > span:first-child { overflow-wrap: anywhere; }
    .form-capa { flex-direction: column; }
    .aviso-flutuante { bottom: calc(76px + env(safe-area-inset-bottom)); left: 16px; right: 16px; max-width: none; }
}

/* ---------- Início: carrosséis estilo Netflix ---------- */

a.selo-admin { text-decoration: none; }
a.selo-admin:hover { background: rgba(230, 199, 159, .12); color: var(--dourado-claro); }

.btn-continuar {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    max-width: 100%;
    padding: 10px 22px 10px 10px;
    border: 1px solid rgba(201, 162, 122, .5);
    border-radius: 14px;
    background: linear-gradient(135deg, var(--vinho-claro), var(--vinho-escuro));
    color: var(--branco);
    text-decoration: none;
    transition: filter .2s;
}
.btn-continuar:hover { color: var(--branco); filter: brightness(1.12); }
.btn-continuar-icone {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--dourado-claro);
    color: var(--vinho-noite);
}
.btn-continuar small { display: block; font-size: .7rem; color: var(--dourado-claro); }
.btn-continuar strong { display: block; font-weight: 600; overflow-wrap: anywhere; }

.carrossel { margin-top: 40px; }
.carrossel-topo {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}
.carrossel-topo h2 { margin: 0; font-size: clamp(1.7rem, 3.4vw, 2.3rem); }
.carrossel-resumo { margin: 4px 0 0; font-size: .82rem; color: var(--texto-suave); }
.carrossel-resumo strong { color: var(--vinho); font-weight: 600; }
.carrossel-setas { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.botao-seta {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border: 1px solid var(--borda);
    border-radius: 50%;
    background: var(--branco);
    color: var(--titulo);
    transition: background .2s, color .2s;
}
.botao-seta:hover:not(:disabled) { background: var(--vinho); border-color: var(--vinho); color: var(--branco); }
.botao-seta:disabled { opacity: .35; }
.botao-seta[hidden] { display: none; }

.carrossel-trilho {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 210px;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 2px;
    padding: 6px 2px 18px;
    scrollbar-width: none;
}
.carrossel-trilho::-webkit-scrollbar { display: none; }

/* Card do módulo: vertical, como as capas da Netflix */
.card-modulo {
    position: relative;
    display: block;
    aspect-ratio: 3 / 4;
    overflow: hidden;
    border: 1px solid rgba(201, 162, 122, .25);
    border-radius: var(--raio);
    background: linear-gradient(160deg, var(--vinho-noite), var(--preto-vinho));
    color: var(--branco);
    text-decoration: none;
    scroll-snap-align: start;
    box-shadow: 0 8px 22px rgba(42, 15, 21, .14);
    transition: transform .25s, box-shadow .25s, border-color .25s;
}
a.card-modulo:hover,
a.card-modulo:focus-visible {
    transform: translateY(-4px) scale(1.02);
    border-color: var(--dourado);
    box-shadow: 0 16px 34px rgba(42, 15, 21, .28);
    color: var(--branco);
}
.card-capa { position: absolute; inset: 0; }
.card-capa img { width: 100%; height: 100%; object-fit: cover; }
.card-numero {
    position: absolute;
    top: 18px;
    left: 18px;
    font-family: var(--fonte-titulo);
    font-size: 3.4rem;
    line-height: 1;
    color: var(--dourado);
    opacity: .9;
}
.card-info {
    position: absolute;
    inset: auto 0 0 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 48px 16px 16px;
    background: linear-gradient(to top, rgba(13, 5, 7, .95) 0%, rgba(13, 5, 7, .75) 55%, transparent 100%);
}
.card-categoria { font-size: .6rem; letter-spacing: .24em; text-transform: uppercase; color: var(--dourado); }
.card-titulo { font-family: var(--fonte-titulo); font-size: 1.3rem; font-weight: 500; line-height: 1.15; overflow-wrap: anywhere; }
.card-meta { font-size: .72rem; color: var(--areia); }
.card-meta-dourado { color: var(--dourado-claro); font-weight: 600; }

.card-modulo.bloqueado { cursor: default; }
.card-modulo.bloqueado .card-capa { filter: grayscale(.6) brightness(.55); }
.card-cadeado {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -70%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 80%;
    text-align: center;
    font-size: .75rem;
    font-weight: 600;
    color: var(--dourado-claro);
}
.card-cadeado i {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(230, 199, 159, .5);
    border-radius: 50%;
    background: rgba(13, 5, 7, .6);
    font-size: 1rem;
}

/* Anel de progresso */
.anel { position: relative; display: inline-grid; place-items: center; width: 44px; height: 44px; }
.anel svg { position: absolute; inset: 0; transform: rotate(-90deg); }
.anel circle { fill: none; stroke-width: 3.5; }
.anel-fundo { stroke: rgba(255, 255, 255, .22); }
.anel-valor { stroke: var(--dourado-claro); stroke-linecap: round; transition: stroke-dashoffset .4s; }
.anel b { position: relative; font-size: .62rem; font-weight: 600; color: var(--branco); }
.card-anel {
    position: absolute;
    top: 10px;
    right: 10px;
    border-radius: 50%;
    background: rgba(13, 5, 7, .55);
    backdrop-filter: blur(4px);
}

/* ---------- Página da aula ---------- */

.voltar {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    font-size: .85rem;
    font-weight: 500;
    color: var(--texto-suave);
    text-decoration: none;
}
.voltar:hover { color: var(--vinho); }

.aula-grade {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 28px;
    align-items: start;
}
.aula-principal { display: grid; gap: 20px; min-width: 0; }

/* Player: o YouTube fica esticado e cortado (título e logo ficam fora da área visível),
   e não recebe nenhum clique: tudo vai para os controles do player. */
.player-caixa {
    position: relative;
    overflow: hidden;
    border-radius: var(--raio);
    background: #000;
    box-shadow: 0 18px 40px rgba(42, 15, 21, .25);
    -webkit-user-select: none;
    user-select: none;
    --plyr-color-main: #8a2434;
    --plyr-range-fill-background: var(--dourado-claro);
    --plyr-video-control-background-hover: #8a2434;
    --plyr-font-family: var(--fonte-texto);
}
.player-caixa .plyr { border-radius: var(--raio); }
.player-caixa .plyr__video-embed { overflow: hidden !important; }
.player-caixa .plyr__video-embed iframe {
    position: absolute !important;
    top: -60px !important;
    left: 0 !important;
    width: calc(100% * var(--qk, 1)) !important;
    height: calc((100% + 120px) * var(--qk, 1)) !important;
    max-width: none !important;
    transform: scale(calc(1 / var(--qk, 1)));
    transform-origin: 0 0;
    border: 0 !important;
    pointer-events: none !important;
}
.player-caixa .plyr__poster { background-size: cover; }
.player-caixa .plyr__control--overlaid {
    padding: 22px;
    background: rgba(138, 36, 52, .92);
    border: 1px solid rgba(230, 199, 159, .6);
}
.player-caixa .plyr__control--overlaid svg { width: 22px; height: 22px; }

.player-capa {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background-size: cover;
    background-position: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s, visibility .2s;
}
.player-capa::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(13, 5, 7, .92) 0%, rgba(13, 5, 7, .55) 50%, rgba(13, 5, 7, .35) 100%);
}
.player-capa.visivel { opacity: 1; visibility: visible; }
.player-fim {
    position: relative;
    z-index: 1;
    margin-bottom: 64px;
    text-align: center;
    color: var(--branco);
}
.player-fim[hidden] { display: none; }
.player-fim p { font-family: var(--fonte-titulo); font-size: 1.5rem; margin-bottom: 12px; }
.player-fim p i { color: var(--dourado-claro); }
.player-fim-botoes { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.player-capa.terminou ~ .plyr__control--overlaid,
.plyr--stopped.plyr__poster-enabled .player-capa { display: none; }

.player-erro, .aula-bloqueada {
    aspect-ratio: 16 / 9;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 24px;
    text-align: center;
    color: var(--areia);
    background: linear-gradient(160deg, var(--vinho-noite), var(--preto-vinho));
}
.aula-bloqueada { border-radius: var(--raio); }
.player-erro i, .aula-bloqueada > i { font-size: 1.8rem; color: var(--dourado-claro); }
.aula-bloqueada h2 { color: var(--branco); font-size: 1.8rem; margin: 0; }
.aula-bloqueada p { margin: 0; }

.aula-cabecalho h1 { margin: 0; font-size: clamp(1.9rem, 4vw, 2.6rem); overflow-wrap: anywhere; }
.aula-meta { margin: 6px 0 0; font-size: .82rem; color: var(--texto-suave); }

.aula-navegacao { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.aula-navegacao .btn { display: inline-flex; align-items: center; }
.aula-navegacao .btn.disabled { opacity: .45; }
.btn-concluir {
    padding: 10px 18px;
    border: 1px solid #2e7d32;
    border-radius: 12px;
    background: var(--branco);
    color: #2e7d32;
    font-size: .88rem;
    font-weight: 500;
}
.btn-concluir:hover { background: rgba(46, 125, 50, .08); color: #2e7d32; border-color: #2e7d32; }
.btn-concluir.feita { background: #2e7d32; color: var(--branco); }
.btn-concluir.feita:hover { background: #276b2b; color: var(--branco); }
.aula-navegacao .btn-primario { margin-left: auto; }

.aula-descricao { line-height: 1.7; overflow-wrap: anywhere; }
.item-material { color: var(--titulo); text-decoration: none; }
.item-material:hover { border-color: var(--dourado); color: var(--vinho); }

/* Lateral: progresso e módulos */
.aula-lateral { position: sticky; top: 100px; display: grid; gap: 16px; }
.progresso-curso h2 { margin: 0 0 14px; font-size: 1.45rem; }
.progresso-linha { display: flex; justify-content: space-between; font-size: .85rem; margin-bottom: 6px; }
.progresso-linha strong { color: var(--vinho); }
.progresso-barra { height: 8px; border-radius: 999px; background: var(--creme); overflow: hidden; }
.progresso-barra span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--vinho-claro), var(--dourado));
    transition: width .4s;
}
.progresso-numeros { margin: 8px 0 0; font-size: .78rem; color: var(--texto-suave); }

.lista-modulos { padding: 8px; max-height: calc(100vh - 340px); overflow-y: auto; }
.modulo-lateral + .modulo-lateral { border-top: 1px solid var(--borda-suave); }
.modulo-lateral summary {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 12px 36px 12px 12px;
    position: relative;
    cursor: pointer;
    list-style: none;
    border-radius: 10px;
}
.modulo-lateral summary::-webkit-details-marker { display: none; }
.modulo-lateral summary::after {
    content: '\f078';
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: .7rem;
    color: var(--texto-suave);
    transition: transform .2s;
}
.modulo-lateral[open] summary::after { transform: translateY(-50%) rotate(180deg); }
.modulo-lateral summary:hover { background: var(--creme); }
.modulo-lateral-titulo { font-weight: 600; font-size: .9rem; color: var(--titulo); }
.modulo-lateral-meta { font-size: .72rem; color: var(--texto-suave); }

.aulas-lateral { list-style: none; margin: 0 0 8px; padding: 0; }
.aula-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border-radius: 10px;
    color: var(--texto);
    font-size: .85rem;
    text-decoration: none;
}
.aula-item:hover { background: var(--creme); color: var(--vinho); }
.aula-item.atual { background: rgba(122, 31, 46, .08); color: var(--vinho); font-weight: 600; }
.aula-item-icone { flex-shrink: 0; width: 18px; text-align: center; color: var(--borda); }
.aula-item.atual .aula-item-icone { color: var(--vinho); }
.aula-item.feita .aula-item-icone { color: #2e7d32; }
.aula-item.trancada { color: var(--texto-suave); }
.aula-item.trancada .aula-item-icone { color: var(--dourado); font-size: .75rem; }
.aula-item-titulo { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.aula-item-tempo { flex-shrink: 0; font-size: .72rem; color: var(--texto-suave); }
.aulas-lateral-vazio { padding: 6px 12px 10px; font-size: .8rem; color: var(--texto-suave); }

@media (max-width: 992px) {
    .aula-grade { grid-template-columns: 1fr; }
    .aula-lateral { position: static; }
    .lista-modulos { max-height: none; }
}
@media (max-width: 768px) {
    .carrossel { margin-top: 30px; }
    .carrossel-trilho { grid-auto-columns: 46%; gap: 12px; }
    .carrossel-setas .botao-seta { display: none; } /* no celular, arrasta com o dedo */
    .card-titulo { font-size: 1.1rem; }
    .card-info { padding: 40px 12px 12px; }
    .card-numero { font-size: 2.6rem; top: 14px; left: 14px; }

    /* Player de ponta a ponta no celular, como num app de vídeo */
    .player-caixa { margin: -20px -16px 0; border-radius: 0; }
    .player-caixa .plyr { border-radius: 0; }
    .aula-navegacao .btn { flex: 1 1 auto; justify-content: center; }
    .aula-navegacao .btn-primario { margin-left: 0; }
    .btn-concluir { order: -1; width: 100%; }
    .player-fim { margin-bottom: 52px; }
    .player-fim p { font-size: 1.2rem; }
}

/* ---------- Alunos, turmas, importação, suporte e perfil ---------- */

.pill-espera { background: rgba(201, 162, 122, .22); color: var(--vinho-escuro); }
.pill-aberto { background: rgba(122, 31, 46, .1); color: var(--vinho); }
.pill-andamento { background: rgba(201, 162, 122, .25); color: #7a5a2b; }

.admin-abas {
    display: flex;
    gap: 6px;
    margin: 0 0 22px;
    padding-bottom: 12px;
    overflow-x: auto;
    border-bottom: 1px solid var(--borda-suave);
    scrollbar-width: none;
}
.admin-abas::-webkit-scrollbar { display: none; }
.admin-abas a {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 16px;
    border-radius: 999px;
    color: var(--texto-suave);
    font-size: .86rem;
    font-weight: 500;
    text-decoration: none;
}
.admin-abas a:hover { background: var(--areia); color: var(--vinho); }
.admin-abas a.ativa { background: var(--vinho); color: var(--branco); }
.contador {
    min-width: 20px;
    padding: 1px 6px;
    border-radius: 999px;
    background: var(--dourado-claro);
    color: var(--vinho-noite);
    font-size: .7rem;
    font-weight: 600;
    text-align: center;
}

.coluna { display: grid; gap: 24px; min-width: 0; }
.admin-topo-acoes { display: flex; flex-wrap: wrap; gap: 10px; }
.admin-topo-acoes .btn { display: inline-flex; align-items: center; }

.lista-simples { list-style: none; margin: 0; padding: 0; display: grid; }
.lista-simples > li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 0;
    border-bottom: 1px solid var(--borda-suave);
}
.lista-simples > li:last-child { border-bottom: 0; }

.arvore-turmas { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.arvore-turmas > li { margin-left: calc(var(--nivel, 0) * 22px); }
.arvore-turmas .item-admin { color: inherit; text-decoration: none; }
.arvore-turmas .item-admin:hover { border-color: rgba(201, 162, 122, .6); }

.zona-perigo { border-color: #f1cfcc; background: #fffafa; }
.btn-perigo {
    padding: 10px 18px;
    border: 1px solid #e0a8a4;
    border-radius: 12px;
    background: var(--branco);
    color: #b42318;
    font-size: .88rem;
    font-weight: 500;
}
.btn-perigo:hover { background: #b42318; border-color: #b42318; color: var(--branco); }

/* Filtros da lista de alunos */
.filtros { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; margin-bottom: 18px; padding: 18px 20px; }
.filtro { flex: 1 1 150px; min-width: 0; }
.filtro-largo { flex: 2 1 240px; }
.filtro-botoes { flex: 0 0 auto; display: flex; gap: 8px; }
.filtro .form-label { margin-bottom: 4px; font-size: .75rem; font-weight: 600; color: var(--texto-suave); }

/* Tabela que vira cartões no celular */
.tabela-caixa { padding: 0; overflow-x: auto; }
.tabela-admin { width: 100%; border-collapse: collapse; font-size: .86rem; }
.tabela-admin th {
    padding: 12px 16px;
    background: var(--creme);
    border-bottom: 1px solid var(--borda-suave);
    color: var(--texto-suave);
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}
.tabela-admin td { padding: 13px 16px; border-bottom: 1px solid var(--borda-suave); vertical-align: middle; }
.tabela-admin tbody tr:last-child td { border-bottom: 0; }
.tabela-admin tbody tr:hover { background: #fcfaf6; }
.aluno-link { display: flex; flex-direction: column; color: var(--titulo); text-decoration: none; }
.aluno-link strong { font-weight: 600; }
.aluno-link small { color: var(--texto-suave); overflow-wrap: anywhere; }
.aluno-link:hover strong { color: var(--vinho); }

.paginacao { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 22px 0 8px; }
.pagina-link {
    min-width: 38px;
    padding: 8px 12px;
    border: 1px solid var(--borda);
    border-radius: 10px;
    background: var(--branco);
    color: var(--titulo);
    font-size: .85rem;
    text-align: center;
    text-decoration: none;
}
.pagina-link:hover { border-color: var(--vinho); color: var(--vinho); }
.pagina-link.ativa { background: var(--vinho); border-color: var(--vinho); color: var(--branco); }

/* Progresso na ficha do aluno */
.progresso-item { padding: 12px 0; border-bottom: 1px solid var(--borda-suave); }
.progresso-item:last-child { border-bottom: 0; }
.progresso-linha { display: flex; justify-content: space-between; gap: 12px; font-size: .9rem; }
.progresso-barra { height: 6px; margin: 8px 0 4px; overflow: hidden; border-radius: 999px; background: var(--areia); }
.progresso-barra > span { display: block; height: 100%; border-radius: inherit; background: var(--vinho); }
.progresso-numeros { margin: 0; font-size: .75rem; color: var(--texto-suave); }

@media (max-width: 992px) {
    .admin-grade { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 768px) {
    .painel { padding: 20px 16px; }
    .filtros { padding: 16px; }
    .filtro-botoes { flex: 1 1 100%; }
    .filtro-botoes .btn { flex: 1; }
    .admin-topo-acoes { width: 100%; }
    .admin-topo-acoes .btn { flex: 1 1 auto; justify-content: center; }

    .tabela-caixa { background: transparent; border: 0; overflow: visible; }
    .tabela-admin thead { display: none; }
    .tabela-admin, .tabela-admin tbody, .tabela-admin tr, .tabela-admin td { display: block; width: 100%; }
    .tabela-admin tr {
        margin-bottom: 12px;
        padding: 6px 4px;
        background: var(--branco);
        border: 1px solid var(--borda-suave);
        border-radius: var(--raio);
    }
    .tabela-admin td {
        display: flex;
        justify-content: space-between;
        gap: 14px;
        padding: 8px 12px;
        border: 0;
        text-align: right;
    }
    .tabela-admin td::before {
        content: attr(data-rotulo);
        flex-shrink: 0;
        color: var(--texto-suave);
        font-size: .7rem;
        font-weight: 600;
        letter-spacing: .06em;
        text-transform: uppercase;
    }
    .tabela-admin td:first-child { padding-bottom: 10px; border-bottom: 1px solid var(--borda-suave); text-align: left; }
    .tabela-admin td:first-child::before { display: none; }
    .tabela-admin tbody tr:hover { background: var(--branco); }
}

.resumo-importacao { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 4px 0 12px; }
.resumo-importacao > div { padding: 14px 16px; border: 1px solid var(--borda-suave); border-radius: 12px; background: var(--creme); }
.resumo-importacao strong { display: block; font-family: var(--fonte-titulo); font-size: 2rem; line-height: 1.1; color: var(--vinho); }
.resumo-importacao span { font-size: .78rem; color: var(--texto-suave); }
.importacao-progresso { margin-top: 16px; }
.importacao-progresso[hidden], [data-acoes-importacao][hidden] { display: none !important; }
.texto-erro { color: #b42318; font-weight: 500; }
@media (max-width: 576px) { .resumo-importacao { grid-template-columns: 1fr; } }

/* Perfil */
.perfil-foto { display: flex; gap: 18px; align-items: flex-start; }
.perfil-foto > div { flex: 1; min-width: 0; }
.perfil-foto-imagem {
    flex-shrink: 0;
    width: 96px;
    height: 96px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 50%;
    background: var(--dourado-claro);
    color: var(--vinho-noite);
    font-size: 1.6rem;
    font-weight: 600;
}
.perfil-foto-imagem img { width: 100%; height: 100%; object-fit: cover; }
.avatar { overflow: hidden; }
.avatar img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 576px) {
    .perfil-foto { flex-direction: column; align-items: center; }
    .perfil-foto > div { width: 100%; }
}

/* Suporte */
.contadores-chamados { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 20px; }
.contador-chamado {
    padding: 16px 18px;
    background: var(--branco);
    border: 1px solid var(--borda-suave);
    border-radius: var(--raio);
    color: var(--texto-suave);
    text-decoration: none;
}
.contador-chamado strong { display: block; font-family: var(--fonte-titulo); font-size: 2rem; line-height: 1.1; color: var(--vinho); }
.contador-chamado span { font-size: .78rem; }
.contador-chamado:hover, .contador-chamado.ativo { border-color: var(--vinho); }

.novo-chamado summary { cursor: pointer; font-weight: 600; color: var(--vinho); list-style: none; }
.novo-chamado summary::-webkit-details-marker { display: none; }

.conversa { display: grid; gap: 14px; }
.msg {
    max-width: 760px;
    padding: 14px 18px;
    background: var(--branco);
    border: 1px solid var(--borda-suave);
    border-radius: var(--raio);
}
.msg header { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 6px; font-size: .78rem; }
.msg header time { color: var(--texto-suave); }
.msg p { margin: 0; overflow-wrap: anywhere; }
.msg-equipe { margin-left: auto; background: #fbf4ee; border-color: rgba(201, 162, 122, .5); }
.msg-anexo { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; padding: 6px 12px; border: 1px solid var(--borda); border-radius: 999px; font-size: .8rem; text-decoration: none; }
.msg-anexo:hover { border-color: var(--vinho); }

.prioridade { font-size: .78rem; font-weight: 600; }
.prioridade-urgente { color: #b42318; }
.prioridade-alta { color: #c2570c; }
.prioridade-media { color: var(--texto-suave); }
.prioridade-baixa { color: #8a8079; }

.admin-grade-invertida { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); }
.perfil-foto-pequena { width: 56px; height: 56px; font-size: 1rem; }
@media (max-width: 992px) { .admin-grade-invertida { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 576px) {
    .contadores-chamados { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .msg-equipe { margin-left: 0; }
}

.contador-chamado strong, .resumo-importacao strong { font-variant-numeric: lining-nums; }

/* Certificados */
.curso-titulo-linha { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.curso-titulo-linha h2 { margin: 0 0 12px; }
.btn-certificado {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 36px;
    height: 36px;
    padding: 0 9px;
    border: 1px solid var(--borda);
    border-radius: 999px;
    background: var(--branco);
    color: #a89b94;
    font-size: .9rem;
    text-decoration: none;
    transition: background .15s, color .15s, border-color .15s;
}
.btn-certificado.bloqueado { cursor: not-allowed; pointer-events: none; }
.btn-certificado.pronto { background: #2e7d32; border-color: #2e7d32; color: var(--branco); }
.btn-certificado.pronto:hover { background: #276b2b; color: var(--branco); }
.modulo-lateral-titulo .btn-certificado { min-width: 28px; height: 28px; margin-left: 6px; padding: 0 6px; font-size: .75rem; vertical-align: middle; }
.card-certificado {
    position: absolute;
    top: 56px;
    right: 10px;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, .18);
    color: rgba(255, 255, 255, .7);
    font-size: .8rem;
}
.card-certificado.pronto { background: #2e7d32; color: var(--branco); }
.card-curso-bloqueado { cursor: pointer; }
div.card-curso-bloqueado { cursor: default; }
.card-curso-bloqueado .card-capa { filter: grayscale(.55) brightness(.75); }

/* Dúvidas nas aulas */
.duvida-acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.btn-anexo { cursor: pointer; }
.lista-duvidas { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 14px; }
.lista-duvidas > li { padding: 14px 16px; border: 1px solid var(--borda-suave); border-radius: 12px; background: var(--creme); }
.duvida-texto { margin: 0 0 6px; overflow-wrap: anywhere; }
.duvida-resposta { margin-top: 10px; padding: 12px 14px; border-left: 3px solid var(--vinho); border-radius: 0 10px 10px 0; background: var(--branco); overflow-wrap: anywhere; }
.duvida-aguardando { margin: 10px 0 0; font-size: .82rem; color: var(--texto-suave); }

/* WhatsApp e simulação */
.botao-whatsapp {
    position: fixed;
    right: 18px;
    bottom: 86px;
    z-index: 1040;
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #25d366;
    color: var(--branco);
    font-size: 1.8rem;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .25);
    text-decoration: none;
}
.botao-whatsapp:hover { color: var(--branco); filter: brightness(1.08); }
@media (min-width: 769px) { .botao-whatsapp { bottom: 24px; } }
.faixa-simulacao {
    position: sticky;
    top: 0;
    z-index: 1050;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 16px;
    background: #fff3cd;
    border-bottom: 1px solid #e6cf85;
    color: #5c4a00;
    font-size: .85rem;
}
.faixa-simulacao form { margin: 0; }
.btn-pequeno { padding: 5px 12px; font-size: .8rem; }

/* Botão grande do certificado (entre o curso e os módulos) */
.btn-certificado.grande {
    display: flex;
    width: 100%;
    height: auto;
    margin-bottom: 18px;
    padding: 14px 18px;
    border-radius: 14px;
    justify-content: flex-start;
    gap: 14px;
    text-align: left;
}
.btn-certificado.grande > i { font-size: 1.6rem; }
.btn-certificado.grande .cert-texto { display: flex; flex-direction: column; line-height: 1.25; }
.btn-certificado.grande .cert-texto b { font-size: 1rem; font-weight: 600; }
.btn-certificado.grande .cert-dica { display: none; font-size: .74rem; font-weight: 400; }
.btn-certificado.grande.bloqueado { background: var(--creme); border: 1px dashed var(--borda); color: var(--texto-suave); cursor: not-allowed; }
.btn-certificado.grande.bloqueado .cert-dica { display: block; }
.btn-certificado.grande.pronto { background: linear-gradient(135deg, #2e7d32, #1f6a2a); box-shadow: 0 6px 16px rgba(46, 125, 50, .28); }

/* Editor do certificado */
.editor-cert { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 24px; align-items: start; }
.palco {
    position: relative;
    width: 100%;
    aspect-ratio: 2339 / 1654;
    overflow: hidden;
    background: var(--creme);
    border: 1px solid var(--borda);
    border-radius: 6px;
    font-family: var(--fonte-titulo);
    touch-action: none;
}
.palco-fundo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; user-select: none; }
.palco-moldura { position: absolute; inset: 2.6%; border: .55% solid var(--vinho); pointer-events: none; text-align: center; color: var(--texto-suave); }
.palco-moldura::after { content: ""; position: absolute; inset: 1.4%; border: 1px solid var(--dourado); }
.palco-marca { position: absolute; top: 11%; left: 0; right: 0; font-size: 1.1vw; letter-spacing: .3em; }
.palco-titulo { position: absolute; top: 20%; left: 0; right: 0; font-size: 5.2vw; line-height: 1; letter-spacing: .22em; color: var(--vinho); font-weight: 600; }
.palco-sub { position: absolute; top: 31%; left: 0; right: 0; font-size: 1.4vw; letter-spacing: .3em; }
.campo-cert {
    position: absolute;
    padding: 0 .2em;
    line-height: 1.15;
    cursor: move;
    outline: 1px dashed rgba(122, 31, 46, .35);
    user-select: none;
    touch-action: none;
}
.campo-cert:hover { outline-color: var(--vinho); }
.campo-cert.campo-sel { outline: 2px solid var(--vinho); background: rgba(201, 162, 122, .18); }
.campo-cert.campo-off { opacity: .28; text-decoration: line-through; }

/* Links de convite */
.convite { padding: 14px 0; border-bottom: 1px solid var(--borda-suave); }
.convite:last-child { border-bottom: 0; }
.convite-off { opacity: .65; }
.convite-link { display: flex; gap: 8px; }
.convite-link .form-control { font-size: .8rem; }
.convite-qr { width: 220px; max-width: 100%; margin: 10px 0; padding: 8px; background: var(--branco); border: 1px solid var(--borda-suave); border-radius: 10px; }
.convite-qr svg { display: block; width: 100%; height: auto; }

@media (max-width: 992px) { .editor-cert { grid-template-columns: minmax(0, 1fr); } }

/* Qualidade do vídeo (HD) */
.qualidade-wrap { position: relative; display: inline-flex; }
.qualidade-botao { display: inline-flex; align-items: center; gap: 4px; font-size: .72rem; font-weight: 600; }
.qualidade-botao span { line-height: 1; }
.qualidade-lista {
    position: absolute;
    right: 0;
    bottom: calc(100% + 8px);
    z-index: 30;
    min-width: 190px;
    padding: 8px;
    border-radius: 12px;
    background: rgba(13, 5, 7, .94);
    color: var(--branco);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .4);
    text-align: left;
}
.qualidade-lista[hidden] { display: none; }
.qualidade-titulo { margin: 4px 8px 6px; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--dourado-claro); }
.qualidade-lista button {
    display: block;
    width: 100%;
    padding: 9px 12px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--branco);
    font-size: .85rem;
    text-align: left;
}
.qualidade-lista button:hover { background: rgba(255, 255, 255, .1); }
.qualidade-lista button.ativo { background: var(--vinho); font-weight: 600; }
.qualidade-lista button.ativo::after { content: " ✓"; }
.qualidade-real { margin: 6px 8px 2px; font-size: .72rem; color: rgba(255, 255, 255, .6); }
.qualidade-real:empty { display: none; }