/* Componentes só da plataforma.
 *
 * O visual vem de css/<edição>.css — este arquivo não define cor nem fonte
 * próprias: usa os mesmos tokens do site (--papel, --tinta, --indigo-700,
 * --magenta-*). Se um valor cru aparecer aqui, é bug: significa que a
 * plataforma começou a ter identidade própria, que é justamente o que deixou
 * o painel da 11ª edição com cara de outro produto.
 */

/* ---------- navegação ---------- */
.plataforma-nav { align-items: center; }
.plataforma-nav-fim { margin-left: auto; display: flex; align-items: center; gap: 0.9rem; }
.plataforma-quem { display: inline-flex; align-items: center; gap: 0.5rem;
                   font-size: var(--fs-sm); color: var(--cinza); }
.plataforma-avatar { width: 24px; height: 24px; border-radius: 50%; display: inline-block; }
.plataforma-avatar--txt { background: var(--indigo-700); color: #fff; font-size: 0.68rem;
                          font-weight: 800; display: inline-flex; align-items: center;
                          justify-content: center; letter-spacing: 0.02em; }
.plataforma-sair { font: inherit; font-size: var(--fs-sm); font-weight: 700;
                   background: none; border: 0; padding: 0; cursor: pointer;
                   color: var(--magenta-700); text-decoration: underline; }
.plataforma-sair:hover { color: var(--tinta); }

/* ---------- avisos ---------- */
.aviso { font-size: var(--fs-sm); padding: 0.8rem 1rem; margin-block: 1rem 0;
         border-left: 4px solid var(--borda); background: var(--superficie); }
.aviso--ok   { border-left-color: var(--ok); }
.aviso--erro { border-left-color: var(--magenta-700); }

/* ---------- entrada ---------- */
.entrada { padding-block: clamp(2.5rem, 7vw, 5rem); }
.entrada-caixa { max-width: 34rem; border: 1px solid var(--borda);
                 background: var(--superficie); padding: clamp(1.5rem, 4vw, 2.5rem); }
.entrada-t { font-size: clamp(1.5rem, 3.5vw, 2rem); font-weight: 800;
             letter-spacing: -0.02em; margin: 0.35rem 0 0.6rem; }
.entrada-d { color: var(--cinza); line-height: 1.55; margin-bottom: 1.5rem; }
.entrada-google { gap: 0.6rem; }
.entrada-nota { font-size: var(--fs-xs); color: var(--cinza); margin-top: 1.1rem;
                line-height: 1.5; }

/* ---------- hub ---------- */
.hub-cabeca { padding-block: clamp(1.75rem, 4vw, 2.75rem) 0.5rem; }
.hub-t { font-size: clamp(1.6rem, 4vw, 2.4rem); font-weight: 800;
         letter-spacing: -0.025em; margin: 0.3rem 0 0.5rem; }
.hub-d { color: var(--cinza); line-height: 1.5; }

.prazos { padding-block: 1.5rem; }
.prazos-t { font-size: var(--fs-sm); text-transform: uppercase; letter-spacing: 0.14em;
            font-weight: 800; color: var(--cinza); margin-bottom: 0.85rem; }
.prazos-grade { display: grid; gap: 0.7rem; grid-template-columns: 1fr; }
@media (min-width: 620px) { .prazos-grade { grid-template-columns: 1fr 1fr; } }
@media (min-width: 980px) { .prazos-grade { grid-template-columns: repeat(3, 1fr); } }

.prazo { border: 1px solid var(--borda); background: var(--superficie);
         padding: 0.95rem 1.05rem 1.1rem; display: flex; flex-direction: column; gap: 0.3rem; }
.prazo-estado { font-size: var(--fs-xs); font-weight: 800; text-transform: uppercase;
                letter-spacing: 0.12em; color: var(--cinza); }
.prazo--aberto { border-color: var(--indigo-700); background: var(--papel); }
.prazo--aberto .prazo-estado { color: var(--ok); }
.prazo--fechado { opacity: 0.62; }
.prazo-t { font-size: 0.98rem; font-weight: 800; letter-spacing: -0.01em; line-height: 1.25; }
.prazo-d { font-size: var(--fs-xs); color: var(--cinza); line-height: 1.45; }
.prazo-quando { margin-top: auto; padding-top: 0.5rem; font-size: var(--fs-xs);
                color: var(--cinza); }

/* ---------- perfil ---------- */
.perfil { padding-block: clamp(1.75rem, 4vw, 2.75rem) 3rem; max-width: 42rem; }
.perfil-form { display: grid; gap: 0.35rem; margin-top: 1.25rem; }
.perfil-form label { font-size: var(--fs-sm); font-weight: 700; margin-top: 0.75rem; }
.perfil-form input { font: inherit; padding: 0.65rem 0.8rem; border: 1px solid var(--borda);
                     background: var(--papel); color: var(--tinta); }
.perfil-form input:disabled { background: var(--superficie); color: var(--cinza); }
.perfil-form button { margin-top: 1.25rem; justify-self: start; }
.campo-erro { font-size: var(--fs-xs); color: var(--magenta-700); font-weight: 700; }
.campo-nota { font-size: var(--fs-xs); color: var(--cinza); line-height: 1.45; }

.perfil-sub { font-size: var(--fs-sm); text-transform: uppercase; letter-spacing: 0.14em;
              font-weight: 800; color: var(--cinza); margin-top: 2.5rem; }
.perfil-contas { list-style: none; padding: 0; margin-top: 0.75rem;
                 display: grid; gap: 0.5rem; }
.perfil-contas li { border: 1px solid var(--borda); padding: 0.75rem 0.9rem;
                    display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: baseline;
                    font-size: var(--fs-sm); }
.perfil-contas span { color: var(--cinza); font-size: var(--fs-xs); }

.plataforma-marca { font-size: var(--fs-sm); font-weight: 800; letter-spacing: -0.01em; }

/* ---------- formulário de resumo ---------- */
.form-resumo { max-width: 52rem; padding-bottom: 4rem; display: grid; gap: 1.75rem; }

.bloco { border: 1px solid var(--borda); background: var(--superficie); padding: 1.25rem 1.35rem 1.5rem; }
.bloco-t { font-size: 1.05rem; font-weight: 800; letter-spacing: -0.015em;
           display: flex; align-items: center; gap: 0.6rem; margin: 0 0 1rem; }
.bloco-n { font-family: var(--mono); font-size: 0.72rem; font-weight: 800; color: #fff;
           background: var(--indigo-700); width: 1.5rem; height: 1.5rem;
           display: inline-flex; align-items: center; justify-content: center; }

.form-resumo label { display: block; font-size: var(--fs-sm); font-weight: 700; margin-top: 1rem; }
.form-resumo select, .form-resumo input[type="text"], .form-resumo input[type="email"],
.form-resumo input[type="search"], .form-resumo textarea {
  font: inherit; width: 100%; padding: 0.6rem 0.75rem; margin-top: 0.3rem;
  border: 1px solid var(--borda); background: var(--papel); color: var(--tinta);
}
.form-resumo textarea { line-height: 1.5; resize: vertical; }
.form-resumo select[size] { padding: 0.3rem; }

.opcoes { border: 0; padding: 0; margin: 1rem 0 0; display: grid; gap: 0.4rem; }
.opcoes--linha { grid-template-columns: 1fr 1fr; }
.opcoes legend { font-size: var(--fs-sm); font-weight: 700; padding: 0; margin-bottom: 0.4rem; }
.opcao { display: flex; gap: 0.6rem; align-items: flex-start; margin: 0 !important;
         border: 1px solid var(--borda); background: var(--papel); padding: 0.65rem 0.8rem;
         font-weight: 400; cursor: pointer; }
.opcao:has(input:checked) { border-color: var(--indigo-700); background: var(--indigo-luz, var(--superficie)); }
.opcao input { margin-top: 0.2rem; }
.opcao small { display: block; font-size: var(--fs-xs); color: var(--cinza); font-weight: 400; }

.ligacao { font: inherit; font-size: var(--fs-xs); background: none; border: 0; padding: 0;
           color: var(--magenta-700); text-decoration: underline; cursor: pointer; }
.ligacao:hover { color: var(--tinta); }

.titulo-herdado { margin-top: 0.8rem; padding: 0.7rem 0.85rem; border-left: 3px solid var(--indigo-700);
                  background: var(--papel); font-size: var(--fs-sm); line-height: 1.45; }
.titulo-herdado span { display: block; font-size: var(--fs-xs); text-transform: uppercase;
                       letter-spacing: 0.12em; color: var(--cinza); font-weight: 800; }

.aviso--alerta { border-left-color: var(--alerta); }
.aviso--alerta .aviso-t { color: var(--alerta); }
.aviso--erro ul { margin: 0.4rem 0 0; padding-left: 1.1rem; font-size: var(--fs-sm); }

/* autores */
.autores { display: grid; gap: 0.6rem; margin-top: 0.8rem; }
.autor { border: 1px solid var(--borda); background: var(--papel); padding: 0.7rem 0.85rem;
         display: grid; gap: 0.5rem; grid-template-columns: auto 1fr; align-items: start; }
.autor-n { font-family: var(--mono); font-size: 0.72rem; font-weight: 800; color: var(--cinza);
           padding-top: 0.55rem; }
.autor-campos { display: grid; gap: 0.4rem; grid-template-columns: 1fr; }
@media (min-width: 700px) { .autor-campos { grid-template-columns: 1.4fr 1.2fr 1fr; } }
.autor-campos input { margin-top: 0 !important; }
.autor-orientador { grid-column: 2; display: inline-flex !important; align-items: center; gap: 0.4rem;
                    font-size: var(--fs-xs) !important; font-weight: 700 !important; margin: 0 !important; }
.autor-selo { grid-column: 2; font-size: var(--fs-xs); color: var(--cinza); }
.autor .ligacao { grid-column: 2; justify-self: start; }

/* contador de palavras */
.contador { display: flex; gap: 0.8rem; align-items: baseline; padding: 0.8rem 1rem;
            border: 1px solid var(--borda); background: var(--papel); margin-bottom: 1rem; }
.contador-v { font-size: 1.6rem; font-weight: 800; letter-spacing: -0.03em; }
.contador-r { font-size: var(--fs-xs); color: var(--cinza); line-height: 1.4; }
.contador--ok { border-color: var(--ok); }
.contador--ok .contador-v { color: var(--ok); }
.contador--fora { border-color: var(--alerta); }
.contador--fora .contador-v { color: var(--alerta); }

.campo-resumo { margin-top: 1.25rem; }
.campo-resumo .campo-nota { margin-top: 0.15rem; }
.campo-tamanho { font-size: var(--fs-xs); color: var(--cinza-fraco); font-weight: 400; }

.palavras-chave { display: grid; gap: 0.4rem; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
                  margin-top: 0.3rem; }
.palavra { display: flex; gap: 0.3rem; align-items: center; }
.palavra input { margin-top: 0 !important; }

/* ODS */
.ods-escolhidas { list-style: none; padding: 0; margin: 0.9rem 0 1rem; display: grid; gap: 0.4rem; counter-reset: none; }
.ods-escolhidas li { display: flex; align-items: center; gap: 0.6rem; padding: 0.55rem 0.7rem;
                     border: 1px solid var(--borda); background: var(--papel);
                     border-left: 5px solid var(--cor); font-size: var(--fs-sm); }
.ods-pos { font-size: var(--fs-xs); color: var(--cinza); font-weight: 700; min-width: 1.6rem; }
.ods-n { background: var(--cor); color: #fff; font-weight: 800; font-size: var(--fs-xs);
         padding: 0.15rem 0.4rem; min-width: 1.5rem; text-align: center; }
.ods-nome { flex: 1; }
.ods-principal { font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.1em;
                 font-weight: 800; color: var(--indigo-700); }
.ods-acoes { display: flex; gap: 0.15rem; }
.ods-acoes button { font: inherit; font-size: var(--fs-sm); background: none; cursor: pointer;
                    border: 1px solid var(--borda); width: 1.7rem; height: 1.7rem; color: var(--tinta); }
.ods-acoes button:hover:not(:disabled) { border-color: var(--indigo-700); }
.ods-acoes button:disabled { opacity: 0.3; cursor: default; }
.ods-vazio { font-size: var(--fs-sm); color: var(--cinza); font-style: italic; margin: 0.9rem 0; }

.ods-disponiveis { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.5rem; }
.ods-botao { font: inherit; font-size: var(--fs-xs); font-weight: 700; cursor: pointer;
             background: var(--papel); color: var(--tinta); border: 1px solid var(--borda);
             border-left: 4px solid var(--cor); padding: 0.35rem 0.6rem; text-align: left; }
.ods-botao:hover { border-color: var(--indigo-700); border-left-color: var(--cor); }
.ods-botao .num { color: var(--cor); font-weight: 800; }

.acoes-form { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; }
.acoes-nota { font-size: var(--fs-xs); color: var(--cinza); }

.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- lista e leitura de submissões ---------- */
.lista-submissoes { list-style: none; padding: 0; margin: 1.25rem 0; display: grid; gap: 0.5rem; }
.lista-submissoes li { border: 1px solid var(--borda); padding: 0.8rem 0.95rem;
                       display: flex; flex-wrap: wrap; gap: 0.5rem 0.9rem; align-items: baseline; }
.sub-titulo { flex: 1 1 16rem; font-weight: 700; color: var(--tinta); text-decoration: none; }
.sub-titulo:hover { color: var(--indigo-700); }
.sub-area { font-size: var(--fs-xs); color: var(--cinza); }
.sub-estado { font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.1em;
              font-weight: 800; padding: 0.2rem 0.45rem; border: 1px solid currentColor; }
.sub-estado--draft { color: var(--cinza); }
.sub-estado--submitted, .sub-estado--resubmitted { color: var(--indigo-700); }
.sub-estado--changes_requested { color: var(--alerta); }
.sub-estado--approved { color: var(--ok); }
.sub-estado--rejected { color: var(--magenta-700); }

.resumo-lido { margin-top: 0.75rem; max-width: 60ch; }
.resumo-lido h3 { font-size: var(--fs-sm); font-weight: 800; margin: 1.1rem 0 0.2rem; }
.resumo-lido p { line-height: 1.6; margin: 0; }

/* autores vindos do projeto: leem-se, não se editam */
.autor--travado { background: var(--superficie); }
.autor-fixo { display: flex; flex-wrap: wrap; gap: 0.15rem 0.8rem; align-items: baseline; }
.autor-fixo strong { font-size: var(--fs-sm); }
.autor-fixo span { font-size: var(--fs-xs); color: var(--cinza); }
.autor-papeis { grid-column: 2; display: flex; flex-wrap: wrap; gap: 0.5rem 0.8rem; align-items: center; }
.autor-selo--orientador { color: var(--indigo-700); font-weight: 700; }
.autor-nota { font-size: var(--fs-xs); color: var(--cinza-fraco); font-style: italic; }

/* o código do trabalho: é por ele que se distinguem dois resumos do mesmo projeto */
.sub-codigo { font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.02em;
              color: var(--indigo-700); background: var(--indigo-luz, var(--superficie));
              border: 1px solid var(--borda); padding: 0.2rem 0.45rem; white-space: nowrap; }
.eyebrow .sub-codigo { margin-left: 0.5rem; }

/* prazo com ação: o card leva ao lugar onde a coisa acontece */
.prazo--acionavel { border-color: var(--indigo-700); }
.prazo-t a { color: inherit; text-decoration: none; }
.prazo-t a:hover { color: var(--indigo-700); }
.prazo-acao { margin-top: 0.6rem; font-size: var(--fs-xs); font-weight: 800;
              color: var(--indigo-700); text-decoration: none;
              text-transform: uppercase; letter-spacing: 0.08em; }
.prazo-acao:hover { text-decoration: underline; }