/*
 * Estilos compartilhados do fluxo de Apresentação Oral (alocar, avaliar, visualizar).
 * Paleta derivada do banner do evento: vinho, violeta e rosa.
 * Escopo: documentos próprios (as páginas rodam em iframe), então o reset é local.
 */

:root {
    --brand: #8e2a56;
    --brand-dark: #6f1f43;
    --brand-soft: #f8ebf0;
    --accent: #5b3a9a;
    --accent-soft: #efeaf8;
    --rose: #e79a9f;

    --ink: #26202a;
    --muted: #675e6c;
    --line: #e3dce0;
    --line-strong: #c9bec5;
    --surface: #ffffff;
    --surface-alt: #faf7f8;

    --ok: #1c6b45;
    --ok-soft: #e6f4ec;
    --warn: #7a4e00;
    --warn-soft: #fff3d6;
    --danger: #b3261e;
    --danger-soft: #fdecea;
    --info: #3d3a8a;
    --info-soft: #ecebfa;

    --slot-h: 210px; /* altura fixa das células da grade de alocação */

    --radius: 12px;
    --radius-sm: 8px;
    --shadow: 0 1px 2px rgba(38, 32, 42, .06), 0 4px 14px rgba(38, 32, 42, .06);
    --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html { color-scheme: light; }

body.eu {
    margin: 0;
    background: var(--surface);
    color: var(--ink);
    font: 15px/1.5 var(--font);
    text-align: left;
}

.page {
    max-width: 960px;
    margin: 0 auto;
    padding: 20px 16px 40px;
}

a { color: var(--brand); text-decoration: none; }
a:hover { color: var(--brand-dark); text-decoration: underline; }

form { margin: 0; }

:focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: 2px;
    border-radius: 4px;
}

/* ---------- Cabeçalho da página ---------- */

.page-head { margin-bottom: 20px; }

.eyebrow {
    margin: 0 0 4px;
    color: var(--brand);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.page-head h1 {
    margin: 0;
    font-size: 24px;
    line-height: 1.25;
    font-weight: 700;
}

.lead { margin: 6px 0 0; color: var(--muted); }

/* ---------- Etapas ---------- */

.steps {
    display: flex;
    gap: 8px;
    list-style: none;
    margin: 0 0 20px;
    padding: 0;
    font-size: 13px;
}

.steps li {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    color: var(--muted);
    background: var(--surface-alt);
}

.steps .n {
    display: inline-grid;
    place-items: center;
    flex: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--line);
    color: var(--ink);
    font-weight: 700;
    font-size: 12px;
}

.steps .is-done { color: var(--ok); }
.steps .is-done .n { background: var(--ok); color: #fff; }
.steps .is-current {
    color: var(--brand-dark);
    border-color: var(--brand);
    background: var(--brand-soft);
    font-weight: 600;
}
.steps .is-current .n { background: var(--brand); color: #fff; }

/* ---------- Contexto (encontro, dia, sala, horário) ---------- */

.chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 20px;
}

.chip {
    display: inline-flex;
    flex-direction: column;
    min-width: 88px;
    padding: 6px 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface-alt);
}

.chip dt {
    color: var(--muted);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.chip dd { margin: 0; font-weight: 600; }
.chip.wide { flex: 1 1 100%; }

/* ---------- Cartão ---------- */

.card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 20px;
}

.card.narrow { max-width: 520px; }
.card h2 { margin: 0 0 12px; font-size: 17px; }

/* ---------- Botões ---------- */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 18px;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    font: 600 14px/1 var(--font);
    cursor: pointer;
    text-decoration: none;
    transition: background-color .15s, border-color .15s, color .15s;
}

.btn-primary { background: var(--brand); color: #fff; }
.btn-primary:hover { background: var(--brand-dark); color: #fff; }

.btn-secondary { background: var(--surface); color: var(--ink); border-color: var(--line-strong); }
.btn-secondary:hover { background: var(--surface-alt); border-color: var(--muted); }

.btn-danger { background: var(--surface); color: var(--danger); border-color: var(--danger); }
.btn-danger:hover { background: var(--danger); color: #fff; }

.btn-link {
    min-height: 32px;
    padding: 0 10px;
    background: transparent;
    color: var(--brand);
    border-color: transparent;
}
.btn-link:hover { background: var(--brand-soft); }

.btn-sm { min-height: 34px; padding: 0 14px; font-size: 13px; }

.actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
}

.actions .spacer { flex: 1; }
.actions.nav-top { margin: 0 0 16px; }

/* ---------- Mensagens ---------- */

.alert {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 14px 16px;
    border: 1px solid;
    border-radius: var(--radius);
    margin: 0 0 16px;
}

.alert::before {
    flex: none;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
}

/* Alerta logo depois de um card: o mesmo respiro de cima que ele já tem embaixo */
.card + .alert { margin-top: 16px; }

.alert-body { flex: 1; min-width: 0; }
.alert-title { margin: 0 0 2px; font-weight: 700; }
.alert-text { margin: 0; }

.alert-success { background: var(--ok-soft); border-color: #a9d6bd; color: #144f33; }
.alert-success::before { content: "\2713"; background: var(--ok); }

.alert-error { background: var(--danger-soft); border-color: #f0b8b3; color: #7f1913; }
.alert-error::before { content: "!"; background: var(--danger); }

.alert-info { background: var(--info-soft); border-color: #c7c4ee; color: #2c2a66; }
.alert-info::before { content: "i"; background: var(--info); font-style: italic; font-family: Georgia, serif; }

.alert-warn { background: var(--warn-soft); border-color: #ecd391; color: var(--warn); }
.alert-warn::before { content: "!"; background: #b27300; }

/* ---------- Formulários ---------- */

.field { margin-bottom: 18px; }

.field label,
.field .label {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
}

.field .hint { margin: 6px 0 0; color: var(--muted); font-size: 13px; }

.input, .select {
    width: 100%;
    min-height: 44px;
    padding: 0 12px;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    background: var(--surface);
    color: var(--ink);
    font: 16px var(--font);
}

.input.cpf { max-width: 240px; letter-spacing: .06em; font-variant-numeric: tabular-nums; }

.input:hover, .select:hover { border-color: var(--muted); }
.input:focus, .select:focus { outline: 3px solid var(--accent-soft); border-color: var(--accent); }
/* "X" de limpar do type="search" (WebKit): troca o azul nativo por um X nas cores do site */
.input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    margin-left: 8px;
    cursor: pointer;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 3l10 10M13 3L3 13' stroke='%23675e6c' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.input[type="search"]::-webkit-search-cancel-button:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 3l10 10M13 3L3 13' stroke='%238e2a56' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.field-row { display: grid; grid-template-columns: 1fr 160px; gap: 16px; }

/* ---------- Grade de alocação ---------- */

.legend {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
    margin: 0 0 14px;
    color: var(--muted);
    font-size: 13px;
}

.badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.badge::before { font-size: 11px; line-height: 1; }
.badge-ok { background: var(--ok-soft); color: var(--ok); }
.badge-ok::before { content: "\2713"; }
.badge-empty { background: var(--warn-soft); color: var(--warn); }
.badge-empty::before { content: "\25CB"; }

.slots {
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
}

.slots thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 10px 12px;
    background: var(--brand);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
}

.slots thead th:first-child { width: 72px; border-top-left-radius: calc(var(--radius) - 1px); }
.slots thead th:last-child { border-top-right-radius: calc(var(--radius) - 1px); }

.slots td {
    vertical-align: top;
    padding: 12px;
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line);
}

.slots td:first-child { border-left: 0; }
/* a última linha acompanha o canto arredondado da tabela (como o cabeçalho), senão as células pintam por cima da borda */
.slots tbody tr:last-child td:first-child { border-bottom-left-radius: calc(var(--radius) - 1px); }
.slots tbody tr:last-child td:last-child { border-bottom-right-radius: calc(var(--radius) - 1px); }
.slots tbody tr:hover td { background: #fffafb; }

.slots .sala-cell {
    width: 72px;
    text-align: center;
    background: var(--brand-soft);
}

.slots tbody tr:hover .sala-cell { background: var(--brand-soft); }

.sala-cell[data-label]::before { content: attr(data-label); }

.sala-num {
    display: block;
    color: var(--brand-dark);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.1;
}

.sala-cell::before {
    content: "Sala";
    display: block;
    /* o rótulo pode ser trocado por página (ex.: "Painel" no Pôster) via data-label */
    color: var(--muted);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

/* Célula de tamanho fixo: colunas iguais (table-layout) e linhas com a mesma altura.
   O miolo (áreas + avaliadores) rola se não couber; o rodapé fica sempre na base. */
.slots td.slot-cell { height: var(--slot-h); }

.slot {
    display: flex;
    flex-direction: column;
    gap: 10px;
    height: calc(var(--slot-h) - 25px); /* altura da célula - padding (24px) - borda (1px) */
}

.slot-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow-wrap: anywhere;
}

.slot-label {
    margin: 0 0 4px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.tags, .people { list-style: none; margin: 0; padding: 0; }

.tags { display: flex; flex-wrap: wrap; gap: 4px; }

.tags li {
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--accent-soft);
    color: var(--accent);
    font-size: 12px;
    line-height: 1.4;
}

a.badge-link { text-decoration: none; cursor: pointer; }
a.badge-link::after { content: "\203A"; font-size: 14px; line-height: 1; }
a.badge-link:hover { background: #cfe9da; color: var(--ok); text-decoration: none; }

/* Tooltip com os avaliadores (hover ou foco do teclado) */
.tip-wrap { position: relative; display: inline-block; }

.tip {
    position: absolute;
    left: 0;
    bottom: calc(100% + 8px);
    z-index: 20;
    width: max-content;
    max-width: 260px;
    padding: 10px 12px;
    border-radius: var(--radius-sm);
    background: var(--ink);
    color: #fff;
    font-size: 12px;
    line-height: 1.4;
    box-shadow: 0 6px 18px rgba(38, 32, 42, .25);
    opacity: 0;
    visibility: hidden;
    transform: translateY(4px);
    transition: opacity .15s, transform .15s, visibility .15s;
    pointer-events: none;
}

.tip::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 16px;
    border: 6px solid transparent;
    border-top-color: var(--ink);
}

.tip-wrap:hover .tip,
.tip-wrap:focus-within .tip {
    opacity: 1;
    visibility: visible;
    transform: none;
}

.tip-title { display: block; margin-bottom: 4px; font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: #d9cfe0; }
.tip-list { margin: 0 0 8px; padding: 0 0 0 16px; }
.tip-list li { overflow-wrap: anywhere; }
.tip-hint { display: block; padding-top: 6px; border-top: 1px solid rgba(255, 255, 255, .25); color: #f1d6e1; }

/* Última coluna: abre para a esquerda para não estourar a largura da página */
.slots td:last-child .tip { left: auto; right: 0; }
.slots td:last-child .tip::after { left: auto; right: 16px; }

/* ---------- Lista de avaliadores da sessão ---------- */

.person-list { list-style: none; margin: 0 0 4px; padding: 0; }

.person-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 0;
    border-top: 1px solid var(--line);
}

.person-row:first-child { border-top: 0; }
.person-name { font-weight: 600; min-width: 0; overflow-wrap: anywhere; }

.slot-foot {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    margin-top: auto;
    padding-top: 4px;
}

.slot-foot form { width: 100%; }
.slot-foot .btn { width: 100%; }

.slots td.is-empty {
    background: repeating-linear-gradient(135deg, var(--surface-alt), var(--surface-alt) 8px, #f4eff1 8px, #f4eff1 16px);
    color: var(--muted);
    font-size: 13px;
    text-align: center;
    vertical-align: middle;
}

.slots tbody tr:hover td.is-empty { background: repeating-linear-gradient(135deg, var(--surface-alt), var(--surface-alt) 8px, #f4eff1 8px, #f4eff1 16px); }

/* ---------- Lista de resumos (confirmar / editar) ---------- */

.list-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
}

.count {
    margin-left: auto;
    color: var(--muted);
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

.count strong { color: var(--ink); }

.picks { display: grid; gap: 10px; }

.pick {
    position: relative;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    transition: border-color .15s, background-color .15s;
}

.pick:hover { border-color: var(--line-strong); }
.pick:has(input:checked) { border-color: var(--brand); background: #fffafb; box-shadow: inset 3px 0 0 var(--brand); }

.pick input[type="checkbox"],
.pick input[type="radio"] {
    position: absolute;
    top: 16px;
    left: 16px;
    width: 20px;
    height: 20px;
    margin: 0;
    accent-color: var(--brand);
    cursor: pointer;
}

.pick label {
    display: block;
    padding: 14px 16px 14px 52px;
    cursor: pointer;
}

.pick-title { display: block; font-weight: 600; line-height: 1.35; }

.pick-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px 20px;
    margin-top: 6px;
    color: var(--muted);
    font-size: 13px;
}

.pick-meta span { display: block; min-width: 0; overflow-wrap: anywhere; }
.pick-meta b { color: var(--ink); font-weight: 600; }

.action-bar {
    position: sticky;
    bottom: 0;
    z-index: 3;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin: 16px -16px -40px;
    padding: 12px 16px;
    background: rgba(255, 255, 255, .96);
    border-top: 1px solid var(--line);
}

/* ---------- Perfil do avaliador ---------- */

.profile { display: grid; grid-template-columns: 110px 1fr; gap: 10px 16px; margin: 0; }
.profile dt { color: var(--muted); font-weight: 600; }
.profile dd { margin: 0; font-weight: 600; }

.danger-zone {
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px dashed var(--line-strong);
}

.danger-zone p { margin: 0 0 10px; color: var(--muted); font-size: 13px; }

/* ---------- Telas estreitas ---------- */

@media (max-width: 700px) {
    .page { padding: 16px 12px 32px; }
    .page-head h1 { font-size: 20px; }
    .steps { flex-direction: column; }
    .field-row { grid-template-columns: 1fr; }
    .card { padding: 16px; }
    .pick-meta { grid-template-columns: 1fr; }
    .profile { grid-template-columns: 1fr; gap: 2px; }
    .profile dd { margin-bottom: 10px; }
    .action-bar { margin: 16px -12px -32px; }

    .slots, .slots tbody, .slots tr, .slots td { display: block; }
    .slots { border: 0; background: transparent; }
    .slots thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
    }
    .slots tr {
        margin-bottom: 16px;
        border: 1px solid var(--line);
        border-radius: var(--radius);
        overflow: hidden;
        background: var(--surface);
    }
    .slots td { border-left: 0; }
    .slots tbody tr:hover td { background: transparent; }
    .slots td:first-child { border-top: 0; }
    .slots tbody tr:last-child td:first-child, .slots tbody tr:last-child td:last-child { border-radius: 0; }
    /* Em telas estreitas as células empilham e voltam a ter altura livre */
    .slots td.slot-cell { height: auto; }
    .tip { display: none; } /* sem hover em telas de toque; a lista fica na tela do selo */
    .slot { height: auto; }
    .slot-body { overflow: visible; }
    .slots .sala-cell, .slots tbody tr:hover .sala-cell {
        width: auto;
        padding: 10px 12px;
        text-align: left;
        background: var(--brand-soft);
    }
    .sala-cell::before { display: inline; margin-right: 6px; font-size: 13px; }
    .sala-num { display: inline; font-size: 18px; }
    .slot-cell::before {
        content: attr(data-label);
        display: block;
        margin-bottom: 8px;
        color: var(--brand);
        font-size: 13px;
        font-weight: 700;
    }
    .slots td.is-empty { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; }
}

/* ---------- Avaliar / visualizar: sessões do avaliador ---------- */

.sessions { margin-bottom: 20px; }
.sessions h2 { margin-bottom: 4px; }

.day-block { padding-top: 14px; }
.day-block + .day-block { margin-top: 6px; border-top: 1px solid var(--line); }

.day-title {
    margin: 0 0 6px;
    color: var(--brand);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.room-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 16px;
    padding: 10px 0;
    border-top: 1px solid var(--line);
}

.day-title + .room-row { border-top: 0; }

.room-info { display: flex; flex-direction: column; min-width: 0; }
.room-info span { color: var(--muted); font-size: 13px; }
.room-slots { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------- Consulta geral: modalidades do avaliador ---------- */

.mod-list {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.mod-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 48px;
    padding: 0 16px;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    background: var(--surface);
    color: var(--ink);
    font-weight: 600;
    text-decoration: none;
}

.mod-link::after { content: "\203A"; color: var(--brand); font-size: 22px; line-height: 1; }
.mod-link:hover { background: var(--brand-soft); border-color: var(--brand); }

/* ---------- Avaliar: trabalhos da sessão ---------- */

.area-group + .area-group { margin-top: 12px; }

.works { width: 100%; border-collapse: collapse; }

.works th {
    padding: 8px 12px;
    border-bottom: 2px solid var(--line);
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-align: left;
    text-transform: uppercase;
}

.works td { padding: 12px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.works tbody tr:last-child td { border-bottom: 0; }
.works tbody tr:hover td { background: #fffafb; }
.works .work-title { font-weight: 600; }
.works .col-action { width: 120px; text-align: center; }
.works .col-action form { display: inline-block; }

/* ---------- Avaliar: formulário de avaliação ---------- */

.profile.wide { grid-template-columns: 190px 1fr; }

.criteria { list-style: none; margin: 0; padding: 0; }

.criterion {
    display: grid;
    grid-template-columns: 32px 1fr minmax(180px, 220px);
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-top: 1px solid var(--line);
}

.criterion:first-child { border-top: 0; }

.criterion-n {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--brand-soft);
    color: var(--brand-dark);
    font-size: 13px;
    font-weight: 700;
}

.criterion-text { font-weight: 500; cursor: pointer; }
.criterion-select { min-height: 40px; font-size: 14px; }

.score {
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 12px;
    padding: 14px 16px;
    border-radius: var(--radius-sm);
    background: var(--brand-soft);
}

.score-label { color: var(--brand-dark); font-weight: 700; }
.score-value { color: var(--brand-dark); font-size: 28px; font-variant-numeric: tabular-nums; line-height: 1; }

#ods { margin-top: 16px; }
#ods .field { margin-bottom: 0; }

@media (max-width: 700px) {
    .profile.wide { grid-template-columns: 1fr; }

    .criterion { grid-template-columns: 32px 1fr; }
    .criterion-select { grid-column: 1 / -1; }

    .works thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
    }
    .works, .works tbody, .works tr, .works td { display: block; }
    .works tr { padding: 10px 0; border-bottom: 1px solid var(--line); }
    .works tbody tr:last-child { border-bottom: 0; }
    .works td { padding: 4px 0; border: 0; }
    .works tbody tr:hover td { background: transparent; }
    .works td[data-label]::before {
        content: attr(data-label);
        display: block;
        color: var(--muted);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .05em;
        text-transform: uppercase;
    }
    .works .col-action { width: auto; text-align: left; padding-top: 8px; }
}

/* ---------- Grade somente leitura (mapa por área) ---------- */

.slots.readonly td.slot-cell { height: auto; }
.slots.readonly .slot { height: auto; }
.slots.readonly .slot-body { overflow: visible; }

.tags .qty {
    margin-left: 4px;
    padding: 0 6px;
    border-radius: 999px;
    background: var(--accent);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
}

.tags.tags-major li { background: var(--brand-soft); color: var(--brand-dark); }
.tags.tags-major .qty { background: var(--brand); }

/* ---------- Paginação ---------- */

.pager {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 16px 0;
}

.pager a, .pager span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    background: var(--surface);
    color: var(--ink);
    font-size: 14px;
    text-decoration: none;
}

.pager a:hover { background: var(--brand-soft); border-color: var(--brand); }
.pager .is-current { background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 700; }
.pager .is-disabled { background: var(--surface-alt); color: var(--muted); }
.pager .is-gap { min-width: 0; padding: 0 2px; border: 0; background: transparent; color: var(--muted); }

/* ---------- Lista de resumos (consultas) ---------- */

.res-list { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }

.res-card h3 { margin: 0 0 4px; font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }
.res-meta { margin: 0 0 4px; color: var(--muted); font-size: 13px; }

.res-group { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }

.res-group > h4 {
    margin: 0 0 8px;
    color: var(--brand);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.res-dl {
    display: grid;
    grid-template-columns: minmax(130px, 210px) 1fr;
    gap: 6px 16px;
    margin: 0;
}

.res-dl dt { color: var(--muted); font-size: 13px; font-weight: 600; }
.res-dl dd { margin: 0; overflow-wrap: anywhere; }

.res-group.is-access { padding: 12px; border: 1px solid #c7c4ee; border-radius: var(--radius-sm); background: var(--info-soft); }

.empty-state {
    padding: 28px 16px;
    text-align: center;
    color: var(--muted);
}

@media (max-width: 600px) {
    .res-dl { grid-template-columns: 1fr; gap: 2px; }
    .res-dl dt { margin-top: 8px; }
}

/* Chip que ocupa o espaço que sobrar na linha (rótulo iniciado por "+" em ui_chips) */
.chip.grow { flex: 1 1 auto; min-width: 0; }

/* ---------- Busca por CPF ou por nome ---------- */

.or-sep {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 4px 0 16px;
    color: var(--muted);
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.or-sep::before, .or-sep::after { content: ""; flex: 1; height: 1px; background: var(--line); }

.person-name .muted { margin-left: 8px; color: var(--muted); font-size: 12px; font-weight: 400; white-space: nowrap; }
.card > .hint { margin: 0 0 8px; color: var(--muted); font-size: 13px; }

/* ---------- Filtros em forma de pílulas (consultas públicas) ---------- */

.filters { display: flex; flex-wrap: wrap; gap: 12px 28px; margin: 0 0 16px; }
.filter-group { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }

.filter-group > .filter-label {
    margin-right: 4px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.pill {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 12px;
    border: 1px solid var(--line-strong);
    border-radius: 999px;
    background: var(--surface);
    color: var(--ink);
    font-size: 13px;
    text-decoration: none;
}

.pill:hover { background: var(--brand-soft); border-color: var(--brand); }
.pill.is-active { background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 600; }

.legend-blocks { margin: 0 0 14px; padding: 10px 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-alt); color: var(--muted); font-size: 13px; }
.legend-blocks b { color: var(--ink); }
.legend-blocks span + span::before { content: "\00b7"; margin: 0 8px; color: var(--line-strong); }
.legend-blocks .legend-title { margin-right: 10px; color: var(--ink); font-weight: 600; }
.local-abbr { text-decoration: underline dotted; text-underline-offset: 3px; cursor: help; }

.works a.link { color: var(--brand); font-weight: 600; text-decoration: none; }
.works a.link:hover { text-decoration: underline; }

/* ---------- Busca e contagem nas listagens públicas ---------- */

.searchbar { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
.searchbar .input { flex: 1 1 260px; min-width: 0; }

.result-count { margin: 0 0 4px; color: var(--muted); font-size: 13px; }

.work-sub { display: block; margin-top: 2px; color: var(--muted); font-size: 13px; font-weight: 400; overflow-wrap: anywhere; }

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

/* ---------- Resumo (página de detalhe) ---------- */

.card.stacked + .card.stacked { margin-top: 16px; }
.keywords { margin: 0 0 14px; }
.abstract-text { line-height: 1.65; overflow-wrap: anywhere; }

body.eu a.link { color: var(--brand); font-weight: 600; text-decoration: none; }
body.eu a.link:hover { text-decoration: underline; }

/* ---------- Consulta por área: totais e resumo completo ---------- */

.hint-inline { color: var(--muted); font-weight: 400; font-size: 13px; }
.totals-card { margin-top: 24px; max-width: 760px; }
.works .num { text-align: right; font-variant-numeric: tabular-nums; }
.works th.num { text-align: right; }
.works tfoot th, .works tfoot td { padding: 12px; border-top: 2px solid var(--line-strong); font-weight: 700; text-align: left; }
.works tfoot td.num { text-align: right; }
.res-text { margin: 0; line-height: 1.65; white-space: pre-line; overflow-wrap: anywhere; }
@media (max-width: 700px) {
    .works td.num { text-align: left; }
    .works tfoot th { display: block; padding: 8px 0 2px; border-top: 2px solid var(--line-strong); }
    .works tfoot td { display: block; padding: 2px 0; border: 0; }
}

/* ---------- Conferência: resumos sem avaliador ---------- */

.field-row3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.section-title { margin: 28px 0 12px; font-size: 20px; }
@media (max-width: 700px) {
    .field-row3 { grid-template-columns: 1fr; gap: 0; }
}
.chips-topo { margin-top: 20px; }
.works th.sortable a { color: inherit; text-decoration: none; white-space: nowrap; }
.works th.sortable a:hover { text-decoration: underline; }
.works th.sortable .sort-mark { margin-left: 6px; font-size: 11px; opacity: .45; }
.works th.sortable[aria-sort] .sort-mark { opacity: 1; color: var(--accent); }
/* quadro por encontro, modalidade e dia: colunas mais justas, cabeçalhos que quebram linha e rolagem lateral se ainda faltar espaço */
.table-scroll { overflow-x: auto; }
.works.compact th, .works.compact td { padding: 10px 8px; }
.works.compact th.sortable a { white-space: normal; }
.works.compact th.num { width: 78px; }
.works.compact td:first-child { min-width: 190px; }

/* ---------- Aviso de processamento (formulários com data-loading, ver ui.js) ---------- */

.loading-note {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 14px;
    color: var(--muted);
    font-size: 14px;
}

.spinner {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    border: 3px solid var(--line);
    border-top-color: var(--brand);
    border-radius: 50%;
    animation: spinner-gira .8s linear infinite;
}

@keyframes spinner-gira { to { transform: rotate(360deg); } }

form.is-loading .btn { cursor: progress; opacity: .7; }

@media (prefers-reduced-motion: reduce) {
    .spinner { animation: none; border-color: var(--brand); border-right-color: var(--line); }
}

/* Linha DDD + celular dos cadastros de participantes */
.field-row.fone { grid-template-columns: 90px 1fr; }

/* ---------- Páginas da administração (abrem fora do site): barra de topo e menu de atalhos ---------- */

.site-bar { max-width: 960px; margin: 0 auto; padding: 16px 16px 0; }
.site-banner { display: block; overflow: hidden; border-radius: var(--radius); background: #f2f2f0; line-height: 0; }
.site-banner img { display: block; width: 100%; height: auto; }

.menu-section { margin: 0 0 28px; }
.menu-section h2 { margin: 0 0 10px; font-size: 13px; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.menu-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.menu-item { display: block; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); color: var(--ink); }
.menu-item:hover { border-color: var(--brand); text-decoration: none; color: var(--ink); }
.menu-item strong { display: block; color: var(--brand); }
.menu-item span { display: block; margin-top: 4px; color: var(--muted); font-size: 13px; }

/* Páginas de cadastro da administração: título, formulário, avisos e botões centralizados */
.page.centro .page-head { text-align: center; }
.page.centro .page-head .lead { margin-left: auto; margin-right: auto; max-width: 520px; }
.page.centro .card.narrow, .page.centro .alert { max-width: 520px; margin-left: auto; margin-right: auto; }
.page.centro .alert { margin-bottom: 16px; }
.page.centro .actions { justify-content: center; }

/* Campos discursivos dos formulários de avaliação */
textarea.input { padding: 10px 12px; min-height: 96px; line-height: 1.4; resize: vertical; }

/* Aviso "flash" (ui_sucesso_voltar): aparece no topo da tela anterior e some sozinho depois de 5 s */
.flash { position: fixed; top: 16px; left: 50%; transform: translateX(-50%); z-index: 60; width: max-content; max-width: min(560px, calc(100% - 24px)); padding: 12px 16px; border: 1px solid #a9d6bd; border-radius: var(--radius); background: var(--ok-soft); color: #144f33; box-shadow: var(--shadow); font-weight: 600; pointer-events: none; animation: flash-sai .4s ease 4.6s forwards; }
@keyframes flash-sai { to { opacity: 0; visibility: hidden; } }

/* Primeira coluna sem o rótulo "Sala" (grades da Feira e da Apresentação Artística, onde só vale o número do bloco) */
.sala-cell.sem-rotulo::before { content: none; }

/* Fluxos do participante (inscricao.php / homologacao.php) */
.card .form-foot { margin: 18px 0 0; padding-top: 14px; border-top: 1px solid var(--line); text-align: center; }
.page.fluxo .card .profile { margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.site-credit { margin: 36px 0 0; text-align: center; font-size: 12px; line-height: 1.6; }
.site-credit a { color: var(--muted); }
.page.fluxo .eyebrow { margin-bottom: 14px; }
.user-bar { display: flex; justify-content: flex-end; margin: -4px 0 8px; }
.page.fluxo .card.stacked { margin-bottom: 16px; }
.page.fluxo .section-title { margin-top: 28px; }
.works .col-actions { white-space: nowrap; text-align: right; }
.works .col-actions .btn + .btn { margin-left: 6px; }
.page.fluxo .toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 12px; }
.page.fluxo .toolbar h2 { margin: 0; font-size: 18px; }
.pick-links { margin: 0; padding: 0 16px 12px 52px; font-size: 13px; }
.pick-links a + a { margin-left: 14px; }
.check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px 16px; margin: 6px 0 10px; }
.check { display: flex; align-items: flex-start; gap: 8px; font-weight: 400; line-height: 1.35; cursor: pointer; }
.check input { margin-top: 3px; accent-color: var(--brand); }
.radios { display: flex; gap: 20px; margin: 4px 0 8px; }
.radios label { display: inline-flex; align-items: center; gap: 6px; font-weight: 400; cursor: pointer; }
.req { color: var(--danger); }
.page.fluxo .field .label { display: block; margin: 0 0 6px; font-weight: 600; }
.field-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.busca h3 { margin: 0 0 10px; font-size: 15px; }
.busca-nome { font-weight: 600; color: var(--ink); }
.pne-detalhe { margin-top: 8px; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-alt); }
.contador.is-full { color: var(--danger); font-weight: 600; }
.form-section + .form-section { margin-top: 16px; }
.res-resumo-aviso { margin: 0 0 14px; }
@media (max-width: 600px) { .field-row2 { grid-template-columns: 1fr; } }
.grande-area { display: flex; align-items: center; min-height: 44px; margin: 0; font-size: 18px; font-weight: 600; line-height: 1.3; color: var(--ink); }

/* ODS (componente chosen) no tema do formulário */
body.eu .chosen-container { font: 15px var(--font); }
body.eu .chosen-container-multi .chosen-choices {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
    min-height: 44px; margin: 0; padding: 6px 8px;
    border: 1px solid var(--line-strong); border-radius: var(--radius-sm);
    background: var(--surface); background-image: none; box-shadow: none;
    cursor: text; transition: border-color .15s;
}
body.eu .chosen-container-multi .chosen-choices:hover { border-color: var(--muted); }
body.eu .chosen-container-multi.chosen-container-active .chosen-choices,
body.eu .chosen-container-multi.chosen-with-drop .chosen-choices { border-color: var(--accent); outline: 3px solid var(--accent-soft); box-shadow: none; }
body.eu .chosen-container-multi .chosen-choices li { float: none; margin: 0; }
body.eu .chosen-container-multi .chosen-choices li.search-choice {
    position: relative; display: inline-flex; align-items: center;
    max-width: 100%; padding: 5px 30px 5px 10px;
    border: 1px solid #e3c3d1; border-radius: 999px;
    background: var(--brand-soft); background-image: none; box-shadow: none;
    color: var(--brand-dark); font-size: 13px; font-weight: 600; line-height: 1.3;
}
body.eu .chosen-container-multi .chosen-choices li.search-choice span { overflow-wrap: anywhere; }
body.eu .chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
    position: absolute; top: 50%; right: 6px; transform: translateY(-50%);
    display: flex; align-items: center; justify-content: center;
    width: 18px; height: 18px; border-radius: 50%;
    background: none !important; background-image: none !important; /* o chosen põe o sprite com !important em telas de alta densidade */
    font-size: 0; line-height: 0; text-decoration: none;
}
body.eu .chosen-container-multi .chosen-choices li.search-choice .search-choice-close::before { content: "\00d7"; color: var(--brand); font-size: 16px; line-height: 1; transform: translateY(-1px); }
body.eu .chosen-container-multi .chosen-choices li.search-choice .search-choice-close:hover { background: var(--brand) !important; }
body.eu .chosen-container-multi .chosen-choices li.search-choice .search-choice-close:hover::before { color: #fff; }
body.eu .chosen-container-multi .chosen-choices li.search-field { flex: 1 1 140px; }
body.eu .chosen-container-multi .chosen-choices li.search-field input[type="text"] {
    width: 100% !important; height: 28px; margin: 0; padding: 0 4px;
    color: var(--ink); font: 15px var(--font);
}
body.eu .chosen-container .chosen-drop {
    margin-top: 4px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm);
    box-shadow: var(--shadow); background: var(--surface);
}
body.eu .chosen-container .chosen-results { margin: 0; padding: 4px; max-height: 260px; color: var(--ink); }
body.eu .chosen-container .chosen-results li { padding: 8px 10px; border-radius: 6px; line-height: 1.35; }
body.eu .chosen-container .chosen-results li.highlighted { background: var(--brand); background-image: none; color: #fff; }
body.eu .chosen-container .chosen-results li.result-selected { color: var(--muted); }
body.eu .chosen-container .chosen-results li.no-results { background: transparent; color: var(--muted); }
.pne-detalhe .chosen-container { margin-bottom: 14px; }
.pne-detalhe .label + .chosen-container, .pne-detalhe .label + select { margin-top: 0; }
.page.fluxo form > .action-bar { margin: 20px -16px 0; }
.lgpd .check { gap: 16px; margin-top: 14px; line-height: 1.5; }
.lgpd .check input { flex: 0 0 auto; }
.input.cpf, .select.perfil { max-width: 240px; }
.entrada .field { max-width: 240px; margin-left: auto; margin-right: auto; }

/* Ação de extensão (chosen de escolha única) no tema do formulário */
body.eu .chosen-container-single .chosen-single {
    display: flex; align-items: center; height: auto; min-height: 44px;
    padding: 8px 40px 8px 12px;
    border: 1px solid var(--line-strong); border-radius: var(--radius-sm);
    background: var(--surface); background-image: none; box-shadow: none;
    color: var(--ink); line-height: 1.35;
}
body.eu .chosen-container-single .chosen-single:hover { border-color: var(--muted); }
body.eu .chosen-container-single.chosen-container-active .chosen-single,
body.eu .chosen-container-single.chosen-with-drop .chosen-single { border-color: var(--accent); outline: 3px solid var(--accent-soft); background-image: none; box-shadow: none; }
body.eu .chosen-container-single.chosen-with-drop .chosen-single { border-bottom-left-radius: var(--radius-sm); border-bottom-right-radius: var(--radius-sm); }
body.eu .chosen-container-single .chosen-single span { display: block; margin: 0; white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
body.eu .chosen-container-single .chosen-single div { top: 0; right: 0; width: 40px; height: 100%; }
body.eu .chosen-container-single .chosen-single div b { position: relative; display: block; width: 100%; height: 100%; background: none !important; background-image: none !important; }
body.eu .chosen-container-single .chosen-single div b::after {
    content: ""; position: absolute; top: 50%; left: 50%;
    width: 7px; height: 7px; margin: -6px 0 0 -4px;
    border: solid var(--muted); border-width: 0 2px 2px 0; transform: rotate(45deg);
}
body.eu .chosen-container-single.chosen-with-drop .chosen-single div b::after { margin-top: -2px; transform: rotate(225deg); }
body.eu .chosen-container-single .chosen-search { padding: 8px 8px 4px; }
body.eu .chosen-container-single .chosen-search input[type="text"] {
    width: 100% !important; height: 38px; margin: 0; padding: 0 10px;
    border: 1px solid var(--line-strong); border-radius: 6px;
    background: var(--surface) !important; background-image: none !important;
    color: var(--ink); font: 15px var(--font);
}
body.eu .chosen-container-single .chosen-search input[type="text"]:focus { outline: 3px solid var(--accent-soft); border-color: var(--accent); }

/* Co-autores: campos sob demanda e validação no campo */
.coautores .coautor { margin-bottom: 12px; }
.coautor-linha { display: flex; gap: 8px; align-items: stretch; }
.coautor-linha .input { flex: 1 1 auto; min-width: 0; }
.coautor-linha .coautor-remover { min-height: 44px; padding: 0 14px; font-size: 20px; line-height: 1; }
.coautor-erro { margin: 6px 0 0; color: var(--danger); font-size: 13px; font-weight: 600; }
.input.is-invalid { border-color: var(--danger); }
.input.is-invalid:focus { outline-color: var(--danger-soft); border-color: var(--danger); }
.coautores-rodape { display: flex; align-items: center; gap: 12px; margin-top: 4px; }

/* Lista de resumos: estado vazio em um cartão só e cabeçalho ordenável */
.empty-card { padding: 40px 20px; border: 1px dashed var(--line-strong); border-radius: var(--radius); background: var(--surface-alt); text-align: center; }
.empty-card h3 { margin: 0 0 6px; font-size: 18px; }
.empty-card p { margin: 0 auto 18px; max-width: 460px; color: var(--muted); }
.empty-card h3:last-child { margin-bottom: 0; }
.works th.col-actions.sortable { text-align: right; }
.btn:hover { text-decoration: none; }
.works .col-actions form { display: inline-block; margin: 0; vertical-align: middle; }
.works .col-actions form + form { margin-left: 6px; }
.action-bar .loading-note { margin: 0 auto 0 0; }

/* Tela de remoção de avaliador: respiro entre os motivos e o campo Observação */
.picks-motivos { margin-bottom: 28px; }

/* ---------- Situação do resumo (administração) ---------- */
.badge-info { background: var(--info-soft); color: var(--info); }
.badge-info::before { content: "\25CF"; }
.badge-danger { background: var(--danger-soft); color: var(--danger); }
.badge-danger::before { content: "\2715"; }
.badge-muted { background: var(--surface-alt); color: var(--muted); box-shadow: inset 0 0 0 1px var(--line); }
.badge-muted::before { content: "\25CB"; }
.badge-off { background: #eee9ec; color: var(--muted); text-decoration: line-through; }
.badge-off::before { content: none; }
.works .col-actions { white-space: nowrap; }
.filters.is-spaced { margin-top: 16px; }
.btn-icon { width: 34px; padding: 0; justify-content: center; }
.btn-icon svg { display: block; }
.list-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin: 0 0 8px; }
.list-head .result-count { margin: 0; }
.per-page { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; color: var(--muted); }
.per-page .select { width: auto; min-height: 34px; padding-top: 0; padding-bottom: 0; }

/* ---------- Lista de resumos da administração: cabe sem rolagem horizontal ---------- */
.works.lista-resumos { table-layout: fixed; }
.works.lista-resumos td:first-child { min-width: 0; }
.works.lista-resumos th:nth-child(1) { width: auto; }
.works.lista-resumos th:nth-child(2) { width: 21%; }
.works.lista-resumos th:nth-child(3) { width: 19%; }
.works.lista-resumos th:nth-child(4) { width: 140px; }
.works.lista-resumos th.col-actions { width: 176px; }
.works.lista-resumos td { overflow-wrap: anywhere; }
.works.lista-resumos .cell-title { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.works.lista-resumos th .sort-sep { margin: 0 4px; color: var(--line-strong); }
.works.lista-resumos td .badge { white-space: normal; }

@media (max-width: 1100px) {
    .works.lista-resumos { table-layout: auto; }
    .works.lista-resumos thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .works.lista-resumos, .works.lista-resumos tbody, .works.lista-resumos tr, .works.lista-resumos td { display: block; }
    .works.lista-resumos tr { padding: 10px 0; border-bottom: 1px solid var(--line); }
    .works.lista-resumos tbody tr:last-child { border-bottom: 0; }
    .works.lista-resumos td { padding: 4px 0; border: 0; }
    .works.lista-resumos tbody tr:hover td { background: transparent; }
    .works.lista-resumos td[data-label]::before { content: attr(data-label); display: block; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
    .works.lista-resumos .cell-title { display: block; }
}

/* ---------- Lista de resumos da administração: cartões (visualização padrão) ---------- */
.list-tools-right { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; }
.view-switch { display: flex; gap: 6px; }
.res-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; margin: 14px 0 0; padding: 0; list-style: none; }
.res-tile { display: flex; flex-direction: column; gap: 10px; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.res-tile:hover { border-color: var(--line-strong); box-shadow: var(--shadow); }
.res-tile.is-off { background: var(--surface-alt); }
.res-tile-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.res-tile-date { color: var(--muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.res-tile h3 { margin: 0; font-size: 15px; line-height: 1.35; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.res-tile h3 a { color: var(--brand); text-decoration: none; }
.res-tile h3 a:hover { text-decoration: underline; }
.res-tile-dl { display: grid; grid-template-columns: 82px 1fr; gap: 4px 10px; margin: 0; font-size: 13px; }
.res-tile-dl dt { color: var(--muted); font-weight: 600; }
.res-tile-dl dd { margin: 0; overflow-wrap: anywhere; }
.res-tile-actions { display: flex; gap: 6px; margin-top: auto; padding-top: 4px; }
/* Ações da administração (Sair) abaixo do banner, à direita */
.site-bar-acoes { display: flex; justify-content: flex-end; margin-top: 8px; }
/* chip de ação (ui_chips com prefixo "="): botão ao lado de uma nota curta */
.chip.acao { flex: 1 1 auto; min-width: 0; justify-content: center; }
.chip.acao dd { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; }
.chip-nota { color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.35; }
/* edição de formulários de avaliação (administracao/avaliacaoFormularios/editar.php) */
.campo-edit { margin: 0 0 14px; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-alt); }
.campo-edit legend { padding: 0 6px; font-weight: 600; color: var(--brand-dark); }
.campo-edit .actions { margin-top: 8px; }