/* =========================================
   Paleta: #A20800 #C00A00 #860700 #000000
   ========================================= */

/* ========== Reset básico ========== */

* {
  box-sizing: border-box;
}

html,
body {
  height: 100%;
}

body {
  margin: 0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: rgba(255, 255, 255, 0.92);
  background: #000000;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  display: block;
}


/* ========== Variáveis ========== */

:root {
  --black: #000000;
  --red: #C00A00;
  --red-dark: #A20800;
  --red-deep: #860700;
  --text: rgba(255, 255, 255, 0.92);
  --muted: rgba(255, 255, 255, 0.72);
  --card: rgba(255, 255, 255, 0.06);
  --border: rgba(255, 255, 255, 0.12);
  --shadow: 0 10px 30px rgba(0, 0, 0, 0.60);
  --radius: 16px;
}


/* ========== Utilitários ========== */

.container {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}


/* ========== Topbar ========== */

.topbar {
  background: linear-gradient(90deg,
      rgba(192, 10, 0, 0.35),
      rgba(162, 8, 0, 0.25));
  border-bottom: 1px solid var(--border);
}

.topbar__content {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
}

.topbar__badge {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .06em;
  color: var(--text);
  background: var(--red);
  padding: 6px 10px;
  border-radius: 999px;
}

.topbar__text {
  margin: 0;
  color: var(--text);
  font-size: 14px;
  flex: 1;
  opacity: 0.92;
}

.topbar__actions {
  display: flex;
  gap: 10px;
  align-items: center;
}

.topbar__link {
  color: var(--text);
  font-weight: 700;
  opacity: .88;
}

.topbar__link:hover {
  opacity: 1;
  text-decoration: underline;
}


/* ========== Header ========== */

.header {
  background: rgba(0, 0, 0, 0.75);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 10;
}

.header__content {
  display: grid;
  grid-template-columns: 220px 1fr 260px;
  align-items: center;
  gap: 14px;
  padding: 14px 0;
}


/* Logo */

.logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.logo__mark {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-weight: 900;
  color: var(--text);
  background: linear-gradient(135deg, var(--red), var(--red-dark));
  box-shadow: var(--shadow);
}

.logo__text {
  font-size: 18px;
  font-weight: 900;
  color: var(--text);
  letter-spacing: 0.2px;
}


/* Nav */

.nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

.nav__link {
  color: var(--muted);
  font-weight: 800;
  font-size: 14px;
  padding: 10px 12px;
  border-radius: 999px;
  transition: 150ms ease;
  border: 1px solid transparent;
}

.nav__link:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.10);
}

.nav__link--active {
  color: var(--text);
  background: linear-gradient(135deg, var(--red), var(--red-deep));
  border: 1px solid rgba(192, 10, 0, 0.35);
}


/* Search */

.search {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 8px 10px;
}

.search__input {
  width: 100%;
  border: none;
  outline: none;
  background: transparent;
  color: var(--text);
}

.search__input::placeholder {
  color: rgba(255, 255, 255, 0.55);
}

.search__button {
  border: none;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font-size: 16px;
}


/* ========== Layout ========== */

.layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 22px;
  padding: 22px 0 40px;
}

.content {
  min-width: 0;
}

.sidebar {
  display: flex;
  flex-direction: column;
  gap: 16px;
}


/* ========== Hero (destaque) ========== */

.hero {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 16px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
}

.hero__img {
  min-height: 320px;
  background:
    radial-gradient(800px 400px at 20% 10%,
      rgba(192, 10, 0, 0.35),
      transparent 55%),
    radial-gradient(700px 350px at 80% 20%,
      rgba(162, 8, 0, 0.30),
      transparent 55%),
    linear-gradient(135deg,
      rgba(255, 255, 255, 0.06),
      rgba(255, 255, 255, 0.02));
}

.hero__body {
  padding: 18px 18px 20px;
}

.hero__title {
  margin: 10px 0 10px;
  color: var(--text);
  font-size: 28px;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

.hero__excerpt {
  margin: 0 0 14px;
  color: var(--muted);
  line-height: 1.6;
}

.hero__actions {
  display: flex;
  gap: 10px;
  margin-top: 14px;
}


/* ========== Seções e meta ========== */

/* Espaçamento externo comum às páginas públicas e ao painel. */
main.container {
  padding-top: 24px;
  padding-bottom: 24px;
}

@media (max-width: 640px) {
  main.container {
    padding-top: 16px;
    padding-bottom: 16px;
  }
}

.section-head {
  margin: 18px 0 10px;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.section-head h2 {
  margin: 0;
  font-size: 18px;
  color: var(--text);
}

.section-head__link {
  color: rgba(192, 10, 0, 0.95);
  font-weight: 900;
  font-size: 14px;
}

.section-head__hint {
  color: rgba(255, 255, 255, 0.60);
  font-size: 13px;
}

.meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
}

.meta--sm {
  font-size: 12px;
}

.meta__dot {
  opacity: 0.6;
}


/* ========== Tags / Chips ========== */

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

.tag {
  font-size: 12px;
  font-weight: 900;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(192, 10, 0, 0.25);
  background: rgba(192, 10, 0, 0.10);
  color: var(--text);
}

.tag:hover {
  background: rgba(192, 10, 0, 0.16);
  border-color: rgba(192, 10, 0, 0.40);
}

.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.chip {
  color: var(--text);
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.05);
  padding: 10px 12px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 13px;
  transition: 150ms ease;
}

.chip:hover {
  background: rgba(192, 10, 0, 0.10);
  border-color: rgba(192, 10, 0, 0.30);
}


/* ========== Cards ========== */

.grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.card {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.35);

  transition:
    transform 150ms ease,
    border-color 150ms ease,
    background 150ms ease;
}

.card:hover {
  transform: translateY(-2px);
  border-color: rgba(192, 10, 0, 0.40);
  background: rgba(255, 255, 255, 0.06);
}


/* =========================================
   IMAGEM DAS MINIATURAS
   ========================================= */

.card__img {
  height: 180px;
  overflow: hidden;

  background:
    radial-gradient(420px 220px at 25% 30%,
      rgba(192, 10, 0, 0.30),
      transparent 60%),
    linear-gradient(135deg,
      rgba(255, 255, 255, 0.06),
      rgba(255, 255, 255, 0.02));
}

.card__img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}

.card__img--2 {
  background:
    radial-gradient(420px 220px at 70% 30%,
      rgba(162, 8, 0, 0.30),
      transparent 60%),
    linear-gradient(135deg,
      rgba(255, 255, 255, 0.06),
      rgba(255, 255, 255, 0.02));
}

.card__img--3 {
  background:
    radial-gradient(420px 220px at 35% 30%,
      rgba(134, 7, 0, 0.30),
      transparent 60%),
    linear-gradient(135deg,
      rgba(255, 255, 255, 0.06),
      rgba(255, 255, 255, 0.02));
}

.card__img--4 {
  background:
    radial-gradient(420px 220px at 55% 30%,
      rgba(192, 10, 0, 0.22),
      transparent 60%),
    linear-gradient(135deg,
      rgba(255, 255, 255, 0.06),
      rgba(255, 255, 255, 0.02));
}

.card__body {
  padding: 14px;
}

.card__title {
  margin: 10px 0 8px;
  font-size: 16px;
  line-height: 1.25;
  color: var(--text);
}

.card__excerpt {
  margin: 0 0 12px;
  color: var(--muted);
  line-height: 1.6;
}

.card__body .btn {
  margin-top: 16px;
}


/* ========== Sidebar panels ========== */

.panel {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px;
}

.panel__title {
  margin: 0 0 8px;
  color: var(--text);
  font-size: 16px;
}

.panel__text {
  margin: 0 0 12px;
  color: var(--muted);
  line-height: 1.6;
}

.panel__muted {
  color: rgba(255, 255, 255, 0.60);
}

.panel__actions {
  margin-top: 10px;
}

.newsletter input {
  width: 100%;
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.05);
  color: var(--text);
  outline: none;
  margin-bottom: 10px;
}

.newsletter input:focus {
  border-color: rgba(192, 10, 0, 0.45);
  box-shadow: 0 0 0 3px rgba(192, 10, 0, 0.18);
}

.newsletter input::placeholder {
  color: rgba(255, 255, 255, 0.55);
}


/* Trending list */

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

.list__item {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 10px;
  align-items: start;
}

.list__rank {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: rgba(192, 10, 0, 0.18);
  border: 1px solid rgba(192, 10, 0, 0.35);
  color: var(--text);
  font-weight: 900;
}

.list__link {
  color: var(--text);
  font-weight: 800;
  line-height: 1.35;
}

.list__link:hover {
  color: rgba(192, 10, 0, 0.95);
}


/* ========== Botões ========== */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 14px;
  border-radius: 12px;
  font-weight: 900;
  border: 1px solid rgba(192, 10, 0, 0.35);
  background: linear-gradient(135deg, var(--red), var(--red-dark));
  color: var(--text);
  cursor: pointer;
  transition:
    transform 150ms ease,
    filter 150ms ease;
}

.btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
}

.btn--ghost {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(192, 10, 0, 0.22);
  color: var(--text);
}

.btn--block {
  width: 100%;
}

.btn--sm {
  padding: 10px 12px;
  border-radius: 999px;
  font-size: 13px;
}


/* ========== Footer ========== */

.footer {
  border-top: 1px solid var(--border);
  background: rgba(0, 0, 0, 0.85);
}

.footer__content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: start;
  gap: 14px;
  padding: 20px 0;
  color: var(--text);
}

.footer__text {
  margin: 8px 0 0;
  color: var(--muted);
}

.footer__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

.footer__nav a {
  color: var(--muted);
  font-weight: 800;
}

.footer__nav a:hover {
  color: var(--text);
  text-decoration: underline;
}

.footer__copy {
  text-align: right;
  color: rgba(255, 255, 255, 0.60);
  margin: 0;
}


/* ========== Estados de foco ========== */

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 3px solid rgba(192, 10, 0, 0.45);
  outline-offset: 2px;
  border-radius: 10px;
}


/* ========== Responsividade ========== */

@media (max-width: 980px) {

  .header__content {
    grid-template-columns: 1fr;
  }

  .nav {
    justify-content: flex-start;
  }

  .layout {
    grid-template-columns: 1fr;
  }

  .footer__content {
    grid-template-columns: 1fr;
    text-align: left;
  }

  .footer__copy {
    text-align: left;
  }

  .footer__nav {
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {

  .topbar__text {
    display: none;
  }

  .hero {
    grid-template-columns: 1fr;
  }

  .hero__img {
    min-height: 220px;
  }

  .grid {
    grid-template-columns: 1fr;
  }

  .hero__title {
    font-size: 22px;
  }

  .card__img {
    height: 200px;
  }
}


/* =========================================
   Complemento do post
   ========================================= */

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 6px 0 14px;
  color: rgba(255, 255, 255, 0.70);
  font-weight: 800;
  font-size: 13px;
}

.breadcrumb a {
  color: rgba(255, 255, 255, 0.86);
}

.breadcrumb a:hover {
  color: rgba(192, 10, 0, 0.95);
}

.breadcrumb__current {
  color: rgba(255, 255, 255, 0.90);
}


/* =========================================
   NOTÍCIA
   ========================================= */

.post {
  margin-top: 0;
  margin-bottom: 20px;
}


/* =========================================
   CATEGORIA
   ========================================= */

.post>.tags {
  margin-bottom: 12px;
}


/* =========================================
   TÍTULO
   ========================================= */

.post__title {
  margin: 0 0 10px;

  color: var(--text);

  font-size: 34px;
  line-height: 1.15;
  letter-spacing: -0.02em;
}


/* =========================================
   SUBTÍTULO
   ========================================= */

.post__subtitle {
  margin: 0 0 14px;

  color: rgba(255, 255, 255, 0.76);

  font-size: 16px;
  line-height: 1.6;
}


/* =========================================
   AUTOR E DATA
   ========================================= */

.post>.meta {
  margin-bottom: 14px;

  color: rgba(255, 255, 255, 0.72);

  font-size: 13px;
}


/* =========================================
   IMAGEM PRINCIPAL DA NOTÍCIA

   A imagem mantém sua proporção.
   A moldura acompanha o tamanho da imagem
   e fica apenas alguns pixels maior.
   ========================================= */

.post__image {
  display: table;

  width: auto;
  max-width: 100%;

  padding: 7px;

  margin: 0 0 16px 0;

  background:
    linear-gradient(135deg,
      rgba(192, 10, 0, 0.12),
      rgba(255, 255, 255, 0.035));

  border: 1px solid rgba(255, 255, 255, 0.14);

  border-radius: 14px;

  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.45),
    0 0 12px rgba(192, 10, 0, 0.08);

  overflow: hidden;
}

.post__image img {
  display: block;

  width: auto;
  height: auto;

  max-width: min(620px, calc(100vw - 60px));
  max-height: 500px;

  object-fit: contain;
  object-position: center;

  border-radius: 9px;
}


/* =========================================
   TEXTO DA NOTÍCIA
   ========================================= */

.post__content {
  width: 100%;

  margin-top: 0;

  padding: 22px 24px;

  background: rgba(255, 255, 255, 0.04);

  border: 1px solid rgba(255, 255, 255, 0.12);

  border-radius: var(--radius);

  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.30);
}

.post__content p {
  margin: 0 0 16px;

  color: rgba(255, 255, 255, 0.84);

  font-size: 16px;
  line-height: 1.85;
}

.post__content p:last-child {
  margin-bottom: 0;
}


/* =========================================
   RESPONSIVIDADE DA NOTÍCIA
   ========================================= */

@media (max-width: 640px) {

  .post__title {
    font-size: 24px;
  }

  .post__subtitle {
    font-size: 15px;
  }

  .post__image {
    max-width: 100%;
    padding: 5px;
  }

  .post__image img {
    max-width: 100%;
    max-height: 400px;
  }

  .post__content {
    padding: 18px;
  }

  .post__content p {
    font-size: 15px;
    line-height: 1.75;
  }
}


/* =========================================
   COMENTÁRIOS
   ========================================= */

.comments {
  margin-top: 16px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--radius);
  padding: 16px;
}

.comment-form {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}

.comment-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.comment-form input,
.comment-form textarea {
  width: 100%;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.92);
  outline: none;
}

.comment-form input:focus,
.comment-form textarea:focus {
  border-color: rgba(192, 10, 0, 0.45);
  box-shadow: 0 0 0 3px rgba(192, 10, 0, 0.18);
}

.comment-form textarea {
  resize: vertical;
}

.comment {
  display: block;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.10);
}

.comment strong {
  display: inline-block;
  margin-right: 8px;
}

.comment .meta {
  display: inline-block;
  color: rgba(255, 255, 255, 0.80);
  font-weight: 800;
  font-size: 13px;
}

.comment p {
  margin: 6px 0 0;
}

.comment__avatar {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  font-weight: 900;
  background: linear-gradient(135deg, #C00A00, #A20800);
  color: rgba(255, 255, 255, 0.95);
}

.comment__meta {
  color: rgba(255, 255, 255, 0.80);
  font-weight: 800;
  font-size: 13px;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
}

.comment__text {
  margin: 6px 0 0;
  color: rgba(255, 255, 255, 0.78);
  line-height: 1.75;
  word-break: normal;
  overflow-wrap: break-word;
  white-space: normal;
}


/* =========================================
   RESPONSIVIDADE DO POST
   ========================================= */

@media (max-width: 640px) {

  .post__title,
  .post-title {
    font-size: 24px;
    padding: 17px 18px;
  }

  .post-head {
    padding: 16px;
  }

  .post__subtitle,
  .post-excerpt {
    padding: 14px 15px;
    font-size: 15px;
  }

  .post__image {
    width: 100%;
    padding: 6px;
  }

  .post__image img {
    width: 100%;
    height: 260px;
  }

  .post__content,
  .post-body {
    padding: 20px 18px;
  }

  .post__content p,
  .post-body p {
    font-size: 15px;
    line-height: 1.75;
  }

  .comment-form__row {
    grid-template-columns: 1fr;
  }
}


/* =========================================
   LOGIN / SIGNUP
   ========================================= */

.auth-card {
  max-width: 520px;
  margin: 40px auto;
}

.auth-title {
  font-size: 24px;
  font-weight: 900;
  margin-bottom: 6px;
  color: var(--text);
}

.auth-sub {
  color: var(--muted);
  margin-bottom: 16px;
  line-height: 1.6;
}

.auth-form {
  display: grid;
  gap: 14px;
}

.auth-form input {
  min-height: 52px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text);
  font-size: 16px;
  outline: none;
}

.auth-form input::placeholder {
  color: rgba(255, 255, 255, 0.55);
}

.auth-form input:focus {
  border-color: rgba(192, 10, 0, 0.45);
  box-shadow: 0 0 0 3px rgba(192, 10, 0, 0.18);
}

.auth-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.auth-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
  margin-top: 12px;
  font-size: 13px;
  color: var(--muted);
}

.auth-row a {
  color: var(--text);
  font-weight: 800;
}

.auth-row a:hover {
  color: rgba(192, 10, 0, 0.95);
}

.auth-check {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.auth-check input {
  accent-color: #C00A00;
}

.auth-foot {
  margin-top: 18px;
  text-align: center;
  font-weight: 800;
  color: var(--muted);
}

.auth-foot a {
  color: rgba(192, 10, 0, 0.95);
}

.auth-foot a:hover {
  text-decoration: underline;
}

.terms {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 13px;
  line-height: 1.5;
  color: var(--muted);
}

.terms input {
  margin-top: 2px;
  accent-color: #C00A00;
}

.terms a {
  color: var(--text);
}

.terms a:hover {
  color: rgba(192, 10, 0, 0.95);
}


/* Responsividade login/signup */

@media (max-width: 640px) {

  .auth-grid {
    grid-template-columns: 1fr;
  }

  .auth-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
}


/* =========================================
   PAGINAÇÃO
   ========================================= */

.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 28px 0 40px;
}

.pagination__link {
  min-width: 42px;
  min-height: 42px;
  padding: 10px 14px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 12px;

  border: 1px solid rgba(255, 255, 255, 0.12);

  background: rgba(255, 255, 255, 0.05);

  color: rgba(255, 255, 255, 0.88);

  font-size: 14px;
  font-weight: 800;

  transition:
    background 150ms ease,
    border-color 150ms ease,
    transform 150ms ease;
}

.pagination__link:hover {
  transform: translateY(-1px);

  background: rgba(192, 10, 0, 0.12);

  border-color: rgba(192, 10, 0, 0.40);
}

.pagination__link--active {
  background: linear-gradient(135deg,
      var(--red),
      var(--red-dark));

  border-color: rgba(192, 10, 0, 0.55);

  color: #ffffff;
}


/* =========================================
   AJUSTE DO FORMULÁRIO DE COMENTÁRIOS
   ========================================= */

.panel form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.panel form .field {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  width: 100%;
}

.panel form .field__label {
  display: block;
  width: 100%;
  font-weight: 700;
  margin: 0;
}

.panel form .field__input,
.panel form .field__textarea {
  display: block;
  width: 100%;
  max-width: 520px;
  box-sizing: border-box;

  padding: 10px 12px;

  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.18);

  background: rgba(255, 255, 255, 0.05);
  color: #fff;
}

.panel form .field__textarea {
  min-height: 120px;
  resize: vertical;
}

.panel form .field__help {
  display: block;
  width: 100%;
  max-width: 520px;

  margin: 0;

  font-size: 12px;
  line-height: 1.4;

  color: rgba(255, 255, 255, 0.60);
}

.panel form .btn {
  align-self: flex-start;
  margin-top: 10px;
}

/* Imagens dos cards inteiras e centralizadas em todas as paginas. */
.card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  object-position: center;
}

/* Mesmo fundo da pagina inicial em todas as miniaturas. */
.card__img,
.card>a>div:has(> img) {
  background:
    radial-gradient(420px 220px at 25% 30%,
      rgba(192, 10, 0, 0.30),
      transparent 60%),
    linear-gradient(135deg,
      rgba(255, 255, 255, 0.06),
      rgba(255, 255, 255, 0.02));
}

/* Destaque com imagem de altura padronizada. */
.hero__img {
  height: 260px;
  min-height: 0;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.hero__img img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}

@media (max-width: 640px) {
  .hero__img {
    height: 200px;
  }
}

/* Titulos longos nao podem reduzir a coluna da foto a zero. */
.hero {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
}

.hero__body {
  min-width: 0;
  overflow-wrap: anywhere;
}

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

/* Foto acompanha a altura do destaque sem definir a altura do texto. */
.hero__img {
  position: relative;
  height: auto;
  min-height: 260px;
  align-self: stretch;
}

.hero__img img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}

@media (max-width: 640px) {
  .hero__img {
    height: 200px;
    min-height: 200px;
  }
}

/* Textos completos, inclusive sequencias sem espacos, cabem nas colunas. */
main.container {
  min-width: 0;
  overflow-wrap: anywhere;
}

main.container *,
.header__content>*,
.footer__content>* {
  min-width: 0;
}

.grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.post,
.post-head,
.post-body,
.post__content,
.card,
.card__body,
.panel {
  max-width: 100%;
  box-sizing: border-box;
  overflow-wrap: anywhere;
}

.post-title,
.post-excerpt,
.post-body,
.post__title,
.post__subtitle,
.post__content,
.card__title,
.card__excerpt {
  white-space: normal;
  overflow-wrap: anywhere;
}

main.container img {
  max-width: 100%;
}

.search__input {
  min-width: 0;
}

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

/* Molduras da noticia: titulo e texto com o mesmo acabamento da foto. */
.post>.post-head,
.post>.post-body {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 20px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 16px;
  overflow-wrap: anywhere;
}

.post>.post-head .post-title {
  margin: 12px 0 10px;
  padding: 0;
  font-size: 28px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.post>.post-head .post-excerpt {
  margin: 0 0 16px;
  padding: 0;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.post>.post-body p {
  margin: 0 0 16px;
  font-size: 16px;
  line-height: 1.8;
  overflow-wrap: anywhere;
}

.post>.post-body p:last-child {
  margin-bottom: 0;
}

@media (max-width: 640px) {

  .post>.post-head,
  .post>.post-body {
    padding: 16px;
  }

  .post>.post-head .post-title {
    font-size: 24px;
  }
}

/* A tabela rola dentro do painel, inclusive em telas estreitas. */
main.container>.panel {
  min-width: 0;
  max-width: 100%;
}

.table-wrap {
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
}


/* Sem imagem: nao reserva espaco para a midia. */
.card__img:not(:has(img)),
.hero__img:not(:has(img)) {
  display: none !important;
}

.hero:not(:has(.hero__img img)) {
  grid-template-columns: minmax(0, 1fr);
}

/* Cards sem foto: conteudo centralizado no espaco disponivel. */
.card:not(:has(img)) {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.card:not(:has(img))>a {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  width: 100%;
}

.card:not(:has(img)) .card__body {
  width: 100%;
}

.card:not(:has(img)) .tags,
.card:not(:has(img)) .meta,
.hero:not(:has(img)) .tags,
.hero:not(:has(img)) .meta,
.hero:not(:has(img)) .hero__actions {
  justify-content: center;
}

.hero:not(:has(img)) .hero__body {
  text-align: center;
}

/* Correções 2.8: cards sem foto não ficam centralizados verticalmente. */
.card:not(:has(img)) {
  justify-content: flex-start;
  align-self: start;
}

.card:not(:has(img))>a {
  flex: 0 1 auto;
  justify-content: flex-start;
}

.auth-form textarea,
.auth-form select,
.admin-spaced-table select {
  background: #1b1b1b;
  color: #f5f5f5;
  border: 1px solid #454545;
  color-scheme: dark;
  font: inherit;
  max-width: 100%;
  box-sizing: border-box;
}

.auth-form textarea {
  width: 100%;
  resize: vertical;
  min-height: 160px;
}

.auth-form select {
  padding: 12px;
  border-radius: 12px;
}

.auth-form :is(input, textarea, select):focus-visible,
.nav__link:focus-visible {
  outline: 2px solid #ff645a;
  outline-offset: 3px;
}

@media(max-width:800px) {
  .header__content {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    padding: 10px 0;
  }

  .header__content>.logo {
    grid-column: 1;
    grid-row: 1;
  }

  .header__content>.btn {
    grid-column: 2;
    grid-row: 1;
    width: auto;
  }

  .header__content>.nav {
    grid-column: 1 / -1;
    grid-row: 2;
    min-width: 0;
    width: 100%;
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow-x: auto;
    gap: 4px;
    padding-bottom: 4px;
  }

  .header__content>.nav>a {
    flex-shrink: 0;
    white-space: nowrap;
    padding: 8px 10px;
  }

  .header__content>.search {
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    margin: 0;
  }

  .header__content:has(> .search) {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .topbar__content {
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .topbar__text {
    display: none;
  }

  .topbar__actions {
    margin-left: auto;
    flex-wrap: wrap;
    gap: 6px;
  }

  .topbar .btn {
    padding: 8px 12px;
  }
}
/* Menu progressivo: sem JavaScript os links continuam visíveis. */
.menu-responsivo { display:contents; }
.menu-toggle { display:none; }
.menu-responsivo > .nav { grid-column:2; grid-row:1; min-width:0; }
@media(max-width:800px) {
  .header .header__content,
  .header .header__content:has(> .search) { grid-template-columns:minmax(0,1fr) auto; }
  .header .header__content:has(> .btn) { grid-template-columns:minmax(0,1fr) auto auto; }
  .header .header__content > .logo { grid-column:1; grid-row:1; }
  .header .header__content > .btn { grid-column:3; grid-row:1; }
  .header .header__content > .search { grid-column:1 / -1; grid-row:2; }
  .menu-responsivo > .menu-toggle:not([hidden]) {
    display:inline-flex; grid-column:2; grid-row:1; align-items:center; justify-content:center;
    min-height:40px; padding:8px 14px; border-radius:12px; border:1px solid #555;
    background:#1b1b1b; color:#fff; font:inherit; font-weight:700; cursor:pointer;
  }
  .menu-toggle:focus-visible { outline:2px solid #ff645a; outline-offset:3px; }
  .menu-responsivo > .nav {
    display:grid; grid-template-columns:minmax(0,1fr); grid-column:1 / -1; grid-row:3;
    width:100%; gap:4px; padding:8px 0; overflow:visible; justify-content:stretch;
    max-height:min(60vh,480px); overflow-y:auto;
  }
  .header__content:has(> .btn) .menu-responsivo > .nav { grid-row:2; }
  .menu-responsivo > .nav > a { display:block; white-space:normal; overflow-wrap:anywhere; padding:10px 14px; }
  .menu-responsivo.is-enhanced:not(.is-open) > .nav { display:none; }
}

/* Tema claro */
html[data-theme="light"] * {
  box-sizing: border-box;
}html[data-theme="light"],
html[data-theme="light"] body {
  height: 100%;
}html[data-theme="light"] body {
  margin: 0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: rgba(15, 35, 65, 0.92);
  background: #0f2341;
}html[data-theme="light"] a {
  color: inherit;
  text-decoration: none;
}html[data-theme="light"] img {
  max-width: 100%;
  display: block;
}html[data-theme="light"] {
  --black: #0f2341;
  --red: #1d4ed8;
  --red-dark: #1e40af;
  --red-deep: #1e3a8a;
  --text: rgba(15, 35, 65, 0.92);
  --muted: rgba(15, 35, 65, 0.72);
  --card: rgba(15, 35, 65, 0.06);
  --border: rgba(15, 35, 65, 0.12);
  --shadow: 0 10px 30px rgba(235, 243, 255, 0.60);
  --radius: 16px;
}html[data-theme="light"] .container {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
}html[data-theme="light"] .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}html[data-theme="light"] .topbar {
  background: linear-gradient(90deg,
      rgba(29, 78, 216, 0.35),
      rgba(29, 78, 216, 0.25));
  border-bottom: 1px solid var(--border);
}html[data-theme="light"] .topbar__content {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
}html[data-theme="light"] .topbar__badge {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .06em;
  color: var(--text);
  background: var(--red);
  padding: 6px 10px;
  border-radius: 999px;
}html[data-theme="light"] .topbar__text {
  margin: 0;
  color: var(--text);
  font-size: 14px;
  flex: 1;
  opacity: 0.92;
}html[data-theme="light"] .topbar__actions {
  display: flex;
  gap: 10px;
  align-items: center;
}html[data-theme="light"] .topbar__link {
  color: var(--text);
  font-weight: 700;
  opacity: .88;
}html[data-theme="light"] .topbar__link:hover {
  opacity: 1;
  text-decoration: underline;
}html[data-theme="light"] .header {
  background: rgba(235, 243, 255, 0.75);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 10;
}html[data-theme="light"] .header__content {
  display: grid;
  grid-template-columns: 220px 1fr 260px;
  align-items: center;
  gap: 14px;
  padding: 14px 0;
}html[data-theme="light"] .logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}html[data-theme="light"] .logo__mark {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-weight: 900;
  color: var(--text);
  background: linear-gradient(135deg, var(--red), var(--red-dark));
  box-shadow: var(--shadow);
}html[data-theme="light"] .logo__text {
  font-size: 18px;
  font-weight: 900;
  color: var(--text);
  letter-spacing: 0.2px;
}html[data-theme="light"] .nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}html[data-theme="light"] .nav__link {
  color: var(--muted);
  font-weight: 800;
  font-size: 14px;
  padding: 10px 12px;
  border-radius: 999px;
  transition: 150ms ease;
  border: 1px solid transparent;
}html[data-theme="light"] .nav__link:hover {
  color: var(--text);
  background: rgba(15, 35, 65, 0.06);
  border-color: rgba(15, 35, 65, 0.10);
}html[data-theme="light"] .nav__link--active {
  color: var(--text);
  background: linear-gradient(135deg, var(--red), var(--red-deep));
  border: 1px solid rgba(29, 78, 216, 0.35);
}html[data-theme="light"] .search {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(15, 35, 65, 0.06);
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 8px 10px;
}html[data-theme="light"] .search__input {
  width: 100%;
  border: none;
  outline: none;
  background: transparent;
  color: var(--text);
}html[data-theme="light"] .search__input::placeholder {
  color: rgba(15, 35, 65, 0.55);
}html[data-theme="light"] .search__button {
  border: none;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font-size: 16px;
}html[data-theme="light"] .layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 22px;
  padding: 22px 0 40px;
}html[data-theme="light"] .content {
  min-width: 0;
}html[data-theme="light"] .sidebar {
  display: flex;
  flex-direction: column;
  gap: 16px;
}html[data-theme="light"] .hero {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 16px;
  background: rgba(15, 35, 65, 0.05);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
}html[data-theme="light"] .hero__img {
  min-height: 320px;
  background:
    radial-gradient(800px 400px at 20% 10%,
      rgba(29, 78, 216, 0.35),
      transparent 55%),
    radial-gradient(700px 350px at 80% 20%,
      rgba(29, 78, 216, 0.30),
      transparent 55%),
    linear-gradient(135deg,
      rgba(15, 35, 65, 0.06),
      rgba(15, 35, 65, 0.02));
}html[data-theme="light"] .hero__body {
  padding: 18px 18px 20px;
}html[data-theme="light"] .hero__title {
  margin: 10px 0 10px;
  color: var(--text);
  font-size: 28px;
  line-height: 1.15;
  letter-spacing: -0.02em;
}html[data-theme="light"] .hero__excerpt {
  margin: 0 0 14px;
  color: var(--muted);
  line-height: 1.6;
}html[data-theme="light"] .hero__actions {
  display: flex;
  gap: 10px;
  margin-top: 14px;
}html[data-theme="light"] main.container {
  padding-top: 24px;
  padding-bottom: 24px;
}

@media (max-width: 640px) {html[data-theme="light"] main.container {
    padding-top: 16px;
    padding-bottom: 16px;
  }
}html[data-theme="light"] .section-head {
  margin: 18px 0 10px;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}html[data-theme="light"] .section-head h2 {
  margin: 0;
  font-size: 18px;
  color: var(--text);
}html[data-theme="light"] .section-head__link {
  color: rgba(29, 78, 216, 0.95);
  font-weight: 900;
  font-size: 14px;
}html[data-theme="light"] .section-head__hint {
  color: rgba(15, 35, 65, 0.60);
  font-size: 13px;
}html[data-theme="light"] .meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  color: rgba(15, 35, 65, 0.72);
  font-size: 13px;
}html[data-theme="light"] .meta--sm {
  font-size: 12px;
}html[data-theme="light"] .meta__dot {
  opacity: 0.6;
}html[data-theme="light"] .tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}html[data-theme="light"] .tag {
  font-size: 12px;
  font-weight: 900;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(29, 78, 216, 0.25);
  background: rgba(29, 78, 216, 0.10);
  color: var(--text);
}html[data-theme="light"] .tag:hover {
  background: rgba(29, 78, 216, 0.16);
  border-color: rgba(29, 78, 216, 0.40);
}html[data-theme="light"] .chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}html[data-theme="light"] .chip {
  color: var(--text);
  border: 1px solid rgba(15, 35, 65, 0.12);
  background: rgba(15, 35, 65, 0.05);
  padding: 10px 12px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 13px;
  transition: 150ms ease;
}html[data-theme="light"] .chip:hover {
  background: rgba(29, 78, 216, 0.10);
  border-color: rgba(29, 78, 216, 0.30);
}html[data-theme="light"] .grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}html[data-theme="light"] .card {
  background: rgba(15, 35, 65, 0.05);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: 0 8px 22px rgba(235, 243, 255, 0.35);

  transition:
    transform 150ms ease,
    border-color 150ms ease,
    background 150ms ease;
}html[data-theme="light"] .card:hover {
  transform: translateY(-2px);
  border-color: rgba(29, 78, 216, 0.40);
  background: rgba(15, 35, 65, 0.06);
}html[data-theme="light"] .card__img {
  height: 180px;
  overflow: hidden;

  background:
    radial-gradient(420px 220px at 25% 30%,
      rgba(29, 78, 216, 0.30),
      transparent 60%),
    linear-gradient(135deg,
      rgba(15, 35, 65, 0.06),
      rgba(15, 35, 65, 0.02));
}html[data-theme="light"] .card__img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}html[data-theme="light"] .card__img--2 {
  background:
    radial-gradient(420px 220px at 70% 30%,
      rgba(29, 78, 216, 0.30),
      transparent 60%),
    linear-gradient(135deg,
      rgba(15, 35, 65, 0.06),
      rgba(15, 35, 65, 0.02));
}html[data-theme="light"] .card__img--3 {
  background:
    radial-gradient(420px 220px at 35% 30%,
      rgba(29, 78, 216, 0.30),
      transparent 60%),
    linear-gradient(135deg,
      rgba(15, 35, 65, 0.06),
      rgba(15, 35, 65, 0.02));
}html[data-theme="light"] .card__img--4 {
  background:
    radial-gradient(420px 220px at 55% 30%,
      rgba(29, 78, 216, 0.22),
      transparent 60%),
    linear-gradient(135deg,
      rgba(15, 35, 65, 0.06),
      rgba(15, 35, 65, 0.02));
}html[data-theme="light"] .card__body {
  padding: 14px;
}html[data-theme="light"] .card__title {
  margin: 10px 0 8px;
  font-size: 16px;
  line-height: 1.25;
  color: var(--text);
}html[data-theme="light"] .card__excerpt {
  margin: 0 0 12px;
  color: var(--muted);
  line-height: 1.6;
}html[data-theme="light"] .card__body .btn {
  margin-top: 16px;
}html[data-theme="light"] .panel {
  background: rgba(15, 35, 65, 0.05);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px;
}html[data-theme="light"] .panel__title {
  margin: 0 0 8px;
  color: var(--text);
  font-size: 16px;
}html[data-theme="light"] .panel__text {
  margin: 0 0 12px;
  color: var(--muted);
  line-height: 1.6;
}html[data-theme="light"] .panel__muted {
  color: rgba(15, 35, 65, 0.60);
}html[data-theme="light"] .panel__actions {
  margin-top: 10px;
}html[data-theme="light"] .newsletter input {
  width: 100%;
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px solid rgba(15, 35, 65, 0.12);
  background: rgba(15, 35, 65, 0.05);
  color: var(--text);
  outline: none;
  margin-bottom: 10px;
}html[data-theme="light"] .newsletter input:focus {
  border-color: rgba(29, 78, 216, 0.45);
  box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.18);
}html[data-theme="light"] .newsletter input::placeholder {
  color: rgba(15, 35, 65, 0.55);
}html[data-theme="light"] .list {
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
  display: grid;
  gap: 10px;
}html[data-theme="light"] .list__item {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 10px;
  align-items: start;
}html[data-theme="light"] .list__rank {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: rgba(29, 78, 216, 0.18);
  border: 1px solid rgba(29, 78, 216, 0.35);
  color: var(--text);
  font-weight: 900;
}html[data-theme="light"] .list__link {
  color: var(--text);
  font-weight: 800;
  line-height: 1.35;
}html[data-theme="light"] .list__link:hover {
  color: rgba(29, 78, 216, 0.95);
}html[data-theme="light"] .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 14px;
  border-radius: 12px;
  font-weight: 900;
  border: 1px solid rgba(29, 78, 216, 0.35);
  background: linear-gradient(135deg, var(--red), var(--red-dark));
  color: var(--text);
  cursor: pointer;
  transition:
    transform 150ms ease,
    filter 150ms ease;
}html[data-theme="light"] .btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
}html[data-theme="light"] .btn--ghost {
  background: rgba(15, 35, 65, 0.06);
  border-color: rgba(29, 78, 216, 0.22);
  color: var(--text);
}html[data-theme="light"] .btn--block {
  width: 100%;
}html[data-theme="light"] .btn--sm {
  padding: 10px 12px;
  border-radius: 999px;
  font-size: 13px;
}html[data-theme="light"] .footer {
  border-top: 1px solid var(--border);
  background: rgba(235, 243, 255, 0.85);
}html[data-theme="light"] .footer__content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: start;
  gap: 14px;
  padding: 20px 0;
  color: var(--text);
}html[data-theme="light"] .footer__text {
  margin: 8px 0 0;
  color: var(--muted);
}html[data-theme="light"] .footer__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}html[data-theme="light"] .footer__nav a {
  color: var(--muted);
  font-weight: 800;
}html[data-theme="light"] .footer__nav a:hover {
  color: var(--text);
  text-decoration: underline;
}html[data-theme="light"] .footer__copy {
  text-align: right;
  color: rgba(15, 35, 65, 0.60);
  margin: 0;
}html[data-theme="light"] a:focus-visible,
html[data-theme="light"] button:focus-visible,
html[data-theme="light"] input:focus-visible,
html[data-theme="light"] textarea:focus-visible {
  outline: 3px solid rgba(29, 78, 216, 0.45);
  outline-offset: 2px;
  border-radius: 10px;
}




@media (max-width: 980px) {html[data-theme="light"] .header__content {
    grid-template-columns: 1fr;
  }html[data-theme="light"] .nav {
    justify-content: flex-start;
  }html[data-theme="light"] .layout {
    grid-template-columns: 1fr;
  }html[data-theme="light"] .footer__content {
    grid-template-columns: 1fr;
    text-align: left;
  }html[data-theme="light"] .footer__copy {
    text-align: left;
  }html[data-theme="light"] .footer__nav {
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {html[data-theme="light"] .topbar__text {
    display: none;
  }html[data-theme="light"] .hero {
    grid-template-columns: 1fr;
  }html[data-theme="light"] .hero__img {
    min-height: 220px;
  }html[data-theme="light"] .grid {
    grid-template-columns: 1fr;
  }html[data-theme="light"] .hero__title {
    font-size: 22px;
  }html[data-theme="light"] .card__img {
    height: 200px;
  }
}html[data-theme="light"] .breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 6px 0 14px;
  color: rgba(15, 35, 65, 0.70);
  font-weight: 800;
  font-size: 13px;
}html[data-theme="light"] .breadcrumb a {
  color: rgba(15, 35, 65, 0.86);
}html[data-theme="light"] .breadcrumb a:hover {
  color: rgba(29, 78, 216, 0.95);
}html[data-theme="light"] .breadcrumb__current {
  color: rgba(15, 35, 65, 0.90);
}html[data-theme="light"] .post {
  margin-top: 0;
  margin-bottom: 20px;
}html[data-theme="light"] .post>.tags {
  margin-bottom: 12px;
}html[data-theme="light"] .post__title {
  margin: 0 0 10px;

  color: var(--text);

  font-size: 34px;
  line-height: 1.15;
  letter-spacing: -0.02em;
}html[data-theme="light"] .post__subtitle {
  margin: 0 0 14px;

  color: rgba(15, 35, 65, 0.76);

  font-size: 16px;
  line-height: 1.6;
}html[data-theme="light"] .post>.meta {
  margin-bottom: 14px;

  color: rgba(15, 35, 65, 0.72);

  font-size: 13px;
}html[data-theme="light"] .post__image {
  display: table;

  width: auto;
  max-width: 100%;

  padding: 7px;

  margin: 0 0 16px 0;

  background:
    linear-gradient(135deg,
      rgba(29, 78, 216, 0.12),
      rgba(15, 35, 65, 0.035));

  border: 1px solid rgba(15, 35, 65, 0.14);

  border-radius: 14px;

  box-shadow:
    0 8px 22px rgba(235, 243, 255, 0.45),
    0 0 12px rgba(29, 78, 216, 0.08);

  overflow: hidden;
}html[data-theme="light"] .post__image img {
  display: block;

  width: auto;
  height: auto;

  max-width: min(620px, calc(100vw - 60px));
  max-height: 500px;

  object-fit: contain;
  object-position: center;

  border-radius: 9px;
}html[data-theme="light"] .post__content {
  width: 100%;

  margin-top: 0;

  padding: 22px 24px;

  background: rgba(15, 35, 65, 0.04);

  border: 1px solid rgba(15, 35, 65, 0.12);

  border-radius: var(--radius);

  box-shadow: 0 8px 22px rgba(235, 243, 255, 0.30);
}html[data-theme="light"] .post__content p {
  margin: 0 0 16px;

  color: rgba(15, 35, 65, 0.84);

  font-size: 16px;
  line-height: 1.85;
}html[data-theme="light"] .post__content p:last-child {
  margin-bottom: 0;
}




@media (max-width: 640px) {html[data-theme="light"] .post__title {
    font-size: 24px;
  }html[data-theme="light"] .post__subtitle {
    font-size: 15px;
  }html[data-theme="light"] .post__image {
    max-width: 100%;
    padding: 5px;
  }html[data-theme="light"] .post__image img {
    max-width: 100%;
    max-height: 400px;
  }html[data-theme="light"] .post__content {
    padding: 18px;
  }html[data-theme="light"] .post__content p {
    font-size: 15px;
    line-height: 1.75;
  }
}html[data-theme="light"] .comments {
  margin-top: 16px;
  background: rgba(15, 35, 65, 0.04);
  border: 1px solid rgba(15, 35, 65, 0.12);
  border-radius: var(--radius);
  padding: 16px;
}html[data-theme="light"] .comment-form {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}html[data-theme="light"] .comment-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}html[data-theme="light"] .comment-form input,
html[data-theme="light"] .comment-form textarea {
  width: 100%;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid rgba(15, 35, 65, 0.12);
  background: rgba(15, 35, 65, 0.05);
  color: rgba(15, 35, 65, 0.92);
  outline: none;
}html[data-theme="light"] .comment-form input:focus,
html[data-theme="light"] .comment-form textarea:focus {
  border-color: rgba(29, 78, 216, 0.45);
  box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.18);
}html[data-theme="light"] .comment-form textarea {
  resize: vertical;
}html[data-theme="light"] .comment {
  display: block;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(15, 35, 65, 0.10);
}html[data-theme="light"] .comment strong {
  display: inline-block;
  margin-right: 8px;
}html[data-theme="light"] .comment .meta {
  display: inline-block;
  color: rgba(15, 35, 65, 0.80);
  font-weight: 800;
  font-size: 13px;
}html[data-theme="light"] .comment p {
  margin: 6px 0 0;
}html[data-theme="light"] .comment__avatar {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  font-weight: 900;
  background: linear-gradient(135deg, #1d4ed8, #1e40af);
  color: rgba(15, 35, 65, 0.95);
}html[data-theme="light"] .comment__meta {
  color: rgba(15, 35, 65, 0.80);
  font-weight: 800;
  font-size: 13px;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
}html[data-theme="light"] .comment__text {
  margin: 6px 0 0;
  color: rgba(15, 35, 65, 0.78);
  line-height: 1.75;
  word-break: normal;
  overflow-wrap: break-word;
  white-space: normal;
}




@media (max-width: 640px) {html[data-theme="light"] .post__title,
html[data-theme="light"] .post-title {
    font-size: 24px;
    padding: 17px 18px;
  }html[data-theme="light"] .post-head {
    padding: 16px;
  }html[data-theme="light"] .post__subtitle,
html[data-theme="light"] .post-excerpt {
    padding: 14px 15px;
    font-size: 15px;
  }html[data-theme="light"] .post__image {
    width: 100%;
    padding: 6px;
  }html[data-theme="light"] .post__image img {
    width: 100%;
    height: 260px;
  }html[data-theme="light"] .post__content,
html[data-theme="light"] .post-body {
    padding: 20px 18px;
  }html[data-theme="light"] .post__content p,
html[data-theme="light"] .post-body p {
    font-size: 15px;
    line-height: 1.75;
  }html[data-theme="light"] .comment-form__row {
    grid-template-columns: 1fr;
  }
}html[data-theme="light"] .auth-card {
  max-width: 520px;
  margin: 40px auto;
}html[data-theme="light"] .auth-title {
  font-size: 24px;
  font-weight: 900;
  margin-bottom: 6px;
  color: var(--text);
}html[data-theme="light"] .auth-sub {
  color: var(--muted);
  margin-bottom: 16px;
  line-height: 1.6;
}html[data-theme="light"] .auth-form {
  display: grid;
  gap: 14px;
}html[data-theme="light"] .auth-form input {
  min-height: 52px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: rgba(15, 35, 65, 0.06);
  color: var(--text);
  font-size: 16px;
  outline: none;
}html[data-theme="light"] .auth-form input::placeholder {
  color: rgba(15, 35, 65, 0.55);
}html[data-theme="light"] .auth-form input:focus {
  border-color: rgba(29, 78, 216, 0.45);
  box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.18);
}html[data-theme="light"] .auth-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}html[data-theme="light"] .auth-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
  margin-top: 12px;
  font-size: 13px;
  color: var(--muted);
}html[data-theme="light"] .auth-row a {
  color: var(--text);
  font-weight: 800;
}html[data-theme="light"] .auth-row a:hover {
  color: rgba(29, 78, 216, 0.95);
}html[data-theme="light"] .auth-check {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}html[data-theme="light"] .auth-check input {
  accent-color: #1d4ed8;
}html[data-theme="light"] .auth-foot {
  margin-top: 18px;
  text-align: center;
  font-weight: 800;
  color: var(--muted);
}html[data-theme="light"] .auth-foot a {
  color: rgba(29, 78, 216, 0.95);
}html[data-theme="light"] .auth-foot a:hover {
  text-decoration: underline;
}html[data-theme="light"] .terms {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 13px;
  line-height: 1.5;
  color: var(--muted);
}html[data-theme="light"] .terms input {
  margin-top: 2px;
  accent-color: #1d4ed8;
}html[data-theme="light"] .terms a {
  color: var(--text);
}html[data-theme="light"] .terms a:hover {
  color: rgba(29, 78, 216, 0.95);
}




@media (max-width: 640px) {html[data-theme="light"] .auth-grid {
    grid-template-columns: 1fr;
  }html[data-theme="light"] .auth-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
}html[data-theme="light"] .pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 28px 0 40px;
}html[data-theme="light"] .pagination__link {
  min-width: 42px;
  min-height: 42px;
  padding: 10px 14px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 12px;

  border: 1px solid rgba(15, 35, 65, 0.12);

  background: rgba(15, 35, 65, 0.05);

  color: rgba(15, 35, 65, 0.88);

  font-size: 14px;
  font-weight: 800;

  transition:
    background 150ms ease,
    border-color 150ms ease,
    transform 150ms ease;
}html[data-theme="light"] .pagination__link:hover {
  transform: translateY(-1px);

  background: rgba(29, 78, 216, 0.12);

  border-color: rgba(29, 78, 216, 0.40);
}html[data-theme="light"] .pagination__link--active {
  background: linear-gradient(135deg,
      var(--red),
      var(--red-dark));

  border-color: rgba(29, 78, 216, 0.55);

  color: #0f2341;
}html[data-theme="light"] .panel form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}html[data-theme="light"] .panel form .field {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  width: 100%;
}html[data-theme="light"] .panel form .field__label {
  display: block;
  width: 100%;
  font-weight: 700;
  margin: 0;
}html[data-theme="light"] .panel form .field__input,
html[data-theme="light"] .panel form .field__textarea {
  display: block;
  width: 100%;
  max-width: 520px;
  box-sizing: border-box;

  padding: 10px 12px;

  border-radius: 8px;
  border: 1px solid rgba(15, 35, 65, 0.18);

  background: rgba(15, 35, 65, 0.05);
  color: #0f2341;
}html[data-theme="light"] .panel form .field__textarea {
  min-height: 120px;
  resize: vertical;
}html[data-theme="light"] .panel form .field__help {
  display: block;
  width: 100%;
  max-width: 520px;

  margin: 0;

  font-size: 12px;
  line-height: 1.4;

  color: rgba(15, 35, 65, 0.60);
}html[data-theme="light"] .panel form .btn {
  align-self: flex-start;
  margin-top: 10px;
}html[data-theme="light"] .card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  object-position: center;
}html[data-theme="light"] .card__img,
html[data-theme="light"] .card>a>div:has(> img) {
  background:
    radial-gradient(420px 220px at 25% 30%,
      rgba(29, 78, 216, 0.30),
      transparent 60%),
    linear-gradient(135deg,
      rgba(15, 35, 65, 0.06),
      rgba(15, 35, 65, 0.02));
}html[data-theme="light"] .hero__img {
  height: 260px;
  min-height: 0;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}html[data-theme="light"] .hero__img img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}

@media (max-width: 640px) {html[data-theme="light"] .hero__img {
    height: 200px;
  }
}html[data-theme="light"] .hero {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
}html[data-theme="light"] .hero__body {
  min-width: 0;
  overflow-wrap: anywhere;
}

@media (max-width: 640px) {html[data-theme="light"] .hero {
    grid-template-columns: minmax(0, 1fr);
  }
}html[data-theme="light"] .hero__img {
  position: relative;
  height: auto;
  min-height: 260px;
  align-self: stretch;
}html[data-theme="light"] .hero__img img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}

@media (max-width: 640px) {html[data-theme="light"] .hero__img {
    height: 200px;
    min-height: 200px;
  }
}html[data-theme="light"] main.container {
  min-width: 0;
  overflow-wrap: anywhere;
/* As tabelas mantêm a largura mínima definida por cada página. */
}html[data-theme="light"] main.container :where(:not(table)),
html[data-theme="light"] .header__content>*,
html[data-theme="light"] .footer__content>* {
  min-width: 0;
}html[data-theme="light"] .grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}html[data-theme="light"] .post,
html[data-theme="light"] .post-head,
html[data-theme="light"] .post-body,
html[data-theme="light"] .post__content,
html[data-theme="light"] .card,
html[data-theme="light"] .card__body,
html[data-theme="light"] .panel {
  max-width: 100%;
  box-sizing: border-box;
  overflow-wrap: anywhere;
}html[data-theme="light"] .post-title,
html[data-theme="light"] .post-excerpt,
html[data-theme="light"] .post-body,
html[data-theme="light"] .post__title,
html[data-theme="light"] .post__subtitle,
html[data-theme="light"] .post__content,
html[data-theme="light"] .card__title,
html[data-theme="light"] .card__excerpt {
  white-space: normal;
  overflow-wrap: anywhere;
}html[data-theme="light"] main.container img {
  max-width: 100%;
}html[data-theme="light"] .search__input {
  min-width: 0;
}

@media (max-width: 640px) {html[data-theme="light"] .grid {
    grid-template-columns: minmax(0, 1fr);
  }
}html[data-theme="light"] .post>.post-head,
html[data-theme="light"] .post>.post-body {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 20px;
  background: rgba(15, 35, 65, 0.04);
  border: 1px solid rgba(15, 35, 65, 0.16);
  border-radius: 16px;
  overflow-wrap: anywhere;
}html[data-theme="light"] .post>.post-head .post-title {
  margin: 12px 0 10px;
  padding: 0;
  font-size: 28px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}html[data-theme="light"] .post>.post-head .post-excerpt {
  margin: 0 0 16px;
  padding: 0;
  line-height: 1.6;
  overflow-wrap: anywhere;
}html[data-theme="light"] .post>.post-body p {
  margin: 0 0 16px;
  font-size: 16px;
  line-height: 1.8;
  overflow-wrap: anywhere;
}html[data-theme="light"] .post>.post-body p:last-child {
  margin-bottom: 0;
}

@media (max-width: 640px) {html[data-theme="light"] .post>.post-head,
html[data-theme="light"] .post>.post-body {
    padding: 16px;
  }html[data-theme="light"] .post>.post-head .post-title {
    font-size: 24px;
  }
}html[data-theme="light"] main.container>.panel {
  min-width: 0;
  max-width: 100%;
}html[data-theme="light"] .table-wrap {
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
}html[data-theme="light"] .card__img:not(:has(img)),
html[data-theme="light"] .hero__img:not(:has(img)) {
  display: none !important;
}html[data-theme="light"] .hero:not(:has(.hero__img img)) {
  grid-template-columns: minmax(0, 1fr);
}html[data-theme="light"] .card:not(:has(img)) {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}html[data-theme="light"] .card:not(:has(img))>a {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  width: 100%;
}html[data-theme="light"] .card:not(:has(img)) .card__body {
  width: 100%;
}html[data-theme="light"] .card:not(:has(img)) .tags,
html[data-theme="light"] .card:not(:has(img)) .meta,
html[data-theme="light"] .hero:not(:has(img)) .tags,
html[data-theme="light"] .hero:not(:has(img)) .meta,
html[data-theme="light"] .hero:not(:has(img)) .hero__actions {
  justify-content: center;
}html[data-theme="light"] .hero:not(:has(img)) .hero__body {
  text-align: center;
}html[data-theme="light"] .card:not(:has(img)) {
  justify-content: flex-start;
  align-self: start;
}html[data-theme="light"] .card:not(:has(img))>a {
  flex: 0 1 auto;
  justify-content: flex-start;
}html[data-theme="light"] .auth-form textarea,
html[data-theme="light"] .auth-form select,
html[data-theme="light"] .admin-spaced-table select {
  background: #f1f5fb;
  color: #0f2341;
  border: 1px solid #aebed4;
  color-scheme: light;
  font: inherit;
  max-width: 100%;
  box-sizing: border-box;
}html[data-theme="light"] .auth-form textarea {
  width: 100%;
  resize: vertical;
  min-height: 160px;
}html[data-theme="light"] .auth-form select {
  padding: 12px;
  border-radius: 12px;
}html[data-theme="light"] .auth-form :is(input, textarea, select):focus-visible,
html[data-theme="light"] .nav__link:focus-visible {
  outline: 2px solid #ff645a;
  outline-offset: 3px;
}

@media(max-width:800px) {html[data-theme="light"] .header__content {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    padding: 10px 0;
  }html[data-theme="light"] .header__content>.logo {
    grid-column: 1;
    grid-row: 1;
  }html[data-theme="light"] .header__content>.btn {
    grid-column: 2;
    grid-row: 1;
    width: auto;
  }html[data-theme="light"] .header__content>.nav {
    grid-column: 1 / -1;
    grid-row: 2;
    min-width: 0;
    width: 100%;
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow-x: auto;
    gap: 4px;
    padding-bottom: 4px;
  }html[data-theme="light"] .header__content>.nav>a {
    flex-shrink: 0;
    white-space: nowrap;
    padding: 8px 10px;
  }html[data-theme="light"] .header__content>.search {
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    margin: 0;
  }html[data-theme="light"] .header__content:has(> .search) {
    grid-template-columns: auto minmax(0, 1fr);
  }html[data-theme="light"] .topbar__content {
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 8px;
    padding-bottom: 8px;
  }html[data-theme="light"] .topbar__text {
    display: none;
  }html[data-theme="light"] .topbar__actions {
    margin-left: auto;
    flex-wrap: wrap;
    gap: 6px;
  }html[data-theme="light"] .topbar .btn {
    padding: 8px 12px;
  }
}html[data-theme="light"] .menu-responsivo { display:contents; }html[data-theme="light"] .menu-toggle { display:none; }html[data-theme="light"] .menu-responsivo > .nav { grid-column:2; grid-row:1; min-width:0; }
@media(max-width:800px) {html[data-theme="light"] .header .header__content,
html[data-theme="light"] .header .header__content:has(> .search) { grid-template-columns:minmax(0,1fr) auto; }html[data-theme="light"] .header .header__content:has(> .btn) { grid-template-columns:minmax(0,1fr) auto auto; }html[data-theme="light"] .header .header__content > .logo { grid-column:1; grid-row:1; }html[data-theme="light"] .header .header__content > .btn { grid-column:3; grid-row:1; }html[data-theme="light"] .header .header__content > .search { grid-column:1 / -1; grid-row:2; }html[data-theme="light"] .menu-responsivo > .menu-toggle:not([hidden]) {
    display:inline-flex; grid-column:2; grid-row:1; align-items:center; justify-content:center;
    min-height:40px; padding:8px 14px; border-radius:12px; border:1px solid #555;
    background:#f1f5fb; color:#0f2341; font:inherit; font-weight:700; cursor:pointer;
  }html[data-theme="light"] .menu-toggle:focus-visible { outline:2px solid #ff645a; outline-offset:3px; }html[data-theme="light"] .menu-responsivo > .nav {
    display:grid; grid-template-columns:minmax(0,1fr); grid-column:1 / -1; grid-row:3;
    width:100%; gap:4px; padding:8px 0; overflow:visible; justify-content:stretch;
    max-height:min(60vh,480px); overflow-y:auto;
  }html[data-theme="light"] .header__content:has(> .btn) .menu-responsivo > .nav { grid-row:2; }html[data-theme="light"] .menu-responsivo > .nav > a { display:block; white-space:normal; overflow-wrap:anywhere; padding:10px 14px; }html[data-theme="light"] .menu-responsivo.is-enhanced:not(.is-open) > .nav { display:none; }
}


/* Alternância de tema. O escuro conserva as cores originais. */
.theme-toggle { position:fixed; right:20px; bottom:20px; bottom:max(20px,env(safe-area-inset-bottom)); z-index:1000; display:flex; align-items:center; gap:8px; min-height:48px; padding:12px 16px; border:1px solid #666; border-radius:999px; background:#191919; color:#fff; font:700 14px system-ui,sans-serif; cursor:pointer; box-shadow:0 4px 18px #0005; }
.theme-toggle:focus-visible { outline:3px solid #60a5fa; outline-offset:4px; }
body:has(.theme-toggle) { padding-bottom:84px; }
html[data-theme="light"] { color-scheme:light; --black:#fff; --red:#1d4ed8; --red-dark:#1e40af; --red-deep:#1e3a8a; --text:#0f2341; --muted:#475569; --card:#f1f5fb; --border:#ccd9ea; --shadow:0 8px 24px #16376312; }
html[data-theme="light"] body { background:#fff !important; color:#0f2341 !important; }
html[data-theme="light"] :is(.panel,.card,.hero,.post-head,.post-body,.recuperacao-panel,.confirmation-panel) { background:#f8faff !important; color:#0f2341; border-color:#ccd9ea !important; }
html[data-theme="light"] .topbar { background:linear-gradient(90deg,#e0ecff,#f1f7ff); }
html[data-theme="light"] :is(.header,.footer) { background:#fff; }
html[data-theme="light"] :is(.btn:not(.btn--ghost),.logo__mark,.topbar__badge,.nav__link--active,.pagination__link--active,.comment__avatar) { background:linear-gradient(135deg,#1d4ed8,#1e40af); color:#fff; }
html[data-theme="light"] :is(.hero__img,.card__img,.post__image) { background:linear-gradient(135deg,#dbeafe,#f1f5fb); }
html[data-theme="light"] :is(.tag,.btn--ghost,.search) { background:#eaf2ff; color:#173c78; border-color:#b6cdee; }
html[data-theme="light"] :is(input,textarea,select) { color-scheme:light; accent-color:#1d4ed8; }
html[data-theme="light"] :is(.meta,.section-head__hint,.footer__copy,.recuperacao-panel small) { color:#475569; }
html[data-theme="light"] [style*="color:rgba(255"], html[data-theme="light"] [style*="color: rgba(255"] { color:#475569 !important; }
html[data-theme="light"] .theme-toggle { color:#fff; background:#1d4ed8; border-color:#1e40af; }
@media(max-width:640px) { .theme-toggle { right:12px; bottom:12px; bottom:max(12px,env(safe-area-inset-bottom)); } }
@media print { .theme-toggle { display:none; } body:has(.theme-toggle) { padding-bottom:0; } }

.auth-form .news-categories {
    min-width: 0;
    margin: 0;
    padding: 18px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 14px;
}
.news-categories legend { padding: 0 8px; font-weight: 700; }
.news-categories p { margin: 0 0 14px; line-height: 1.5; }
.news-categories__options { display: flex; flex-wrap: wrap; gap: 12px; }
.auth-form .news-categories__option {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 14px 18px;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 10px;
    background: #191919;
    cursor: pointer;
}
.news-categories__option span { overflow-wrap: anywhere; min-width: 0; }
.auth-form .news-categories__option input[type="checkbox"] {
    appearance: auto;
    width: 20px;
    height: 20px;
    min-height: 0;
    flex: 0 0 20px;
    margin: 0;
    padding: 0;
    accent-color: #c00a00;
}
.news-categories__option:has(input:checked) { border-color: #e5392c; background: #34100d; }
.news-categories__option:has(input:disabled) { opacity: .5; cursor: not-allowed; }
.news-categories__option:focus-within { outline: 2px solid #fff; outline-offset: 3px; }
.news-categories .news-categories__count { margin: 14px 0 0; color: #ccc; }
html[data-theme="light"] .auth-form .news-categories {
    border-color: #b6cdee;
    color: #0f2341;
}
html[data-theme="light"] .auth-form .news-categories__option {
    background: #fff;
    border-color: #aebed4;
    color: #173c78;
}
html[data-theme="light"] .auth-form .news-categories__option:has(input:checked) {
    background: #dbeafe;
    border-color: #1d4ed8;
    color: #173c78;
}
html[data-theme="light"] .auth-form .news-categories__option input[type="checkbox"] {
    accent-color: #1d4ed8;
    color-scheme: light;
}
html[data-theme="light"] .news-categories__option:focus-within {
    outline-color: #1d4ed8;
}
html[data-theme="light"] .news-categories__option:has(input:disabled) {
    opacity: 1;
    background: #f1f5f9;
    color: #526175;
    border-style: dashed;
}
html[data-theme="light"] .news-categories .news-categories__count {
    color: #475569;
}
@media (max-width: 480px) {
    .auth-form .news-categories__option { width: 100%; }
}

/* Mesmas larguras do painel escuro, sem comprimir as colunas no tema claro. */
@media (max-width: 800px) {
  html[data-theme="light"] main.container .post-table.admin-spaced-table { min-width: 900px !important; }
  html[data-theme="light"] main.container .post-table.comments-table { min-width: 1000px !important; }
  html[data-theme="light"] main.container .post-table.categories-table { min-width: 600px !important; }
  html[data-theme="light"] main.container .table-wrap { width:100%; max-width:100%; overflow-x:auto; }
}

/* Fundo suave no tema claro, preservando o contraste dos cartões. */
html[data-theme="light"] { background:#f1f3f5; }
html[data-theme="light"] body { background:#f1f3f5 !important; }
html[data-theme="light"] :is(.header,.footer) { background:#f1f3f5; }

/* Melhorias compartilhadas V3.3 */
html[data-theme="light"] body { background:#f1f3f5; }
.skip-link{position:fixed;top:8px;left:8px;z-index:99999;transform:translateY(-200%);padding:12px 20px;background:#fff;color:#102644;border:3px solid #2452db;border-radius:8px}
.skip-link:focus{transform:none}
html :focus-visible{outline:3px solid #6498ff!important;outline-offset:4px!important}
html main.container .post-body{max-width:740px!important;width:100%;margin:24px auto!important;box-sizing:border-box}
.card__title a{color:inherit;text-decoration:none}.card__title a:hover{text-decoration:underline}
.card .card-content{height:100%}
.server-filters{margin:0 0 16px;white-space:normal}.server-filters summary{cursor:pointer;font-weight:700;padding:12px;width:fit-content;border:1px solid #777;border-radius:12px}
.server-filter-form{display:flex;gap:12px;flex-wrap:wrap;align-items:end;padding:16px 0}
.server-filter-form label{display:grid;gap:6px;flex:1 1 160px}
.server-filter-form input,.server-filter-form select{width:100%;padding:12px;border:1px solid #777;border-radius:10px;background:var(--bg,#171717);color:inherit;font:inherit}
html[data-theme="light"] .server-filter-form input,html[data-theme="light"] .server-filter-form select{background:#fff;color:#142846;border-color:#b2c4df}
.filter-status{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px 0 20px;font-size:14px}
.pagination{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:24px 0}.pagination [aria-current="page"]{outline:2px solid currentColor}
.dashboard-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:16px;margin:24px 0}.dashboard-stat{padding:20px;border:1px solid #777;border-radius:16px;color:inherit;text-decoration:none}.dashboard-stat strong{display:block;font-size:30px;margin-bottom:4px}
.article-tools{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:24px auto;max-width:740px}.related-news{margin:32px 0}.related-news .grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
@media(max-width:900px){html .hero{grid-template-columns:1fr!important}html .hero__img{height:280px!important;min-height:0!important}html .hero__img img{object-fit:contain!important}.server-filter-form label{flex-basis:100%}}
html body main .panel form.server-filter-form { display:flex; flex-direction:row; gap:12px; align-items:flex-end; width:100%; } html body main .panel form.server-filter-form label { flex:1 1 160px; min-width:0; } html body main .panel form.server-filter-form .btn { margin:0; align-self:flex-end; } @media(max-width:600px){html body main .panel form.server-filter-form label{flex-basis:100%;}}
/* A área do link principal cobre o cartão; as categorias ficam acima dela. */
html body main :is(.card:has(.card__title a[href^="post.php"]), .hero:has(.hero__actions a[href^="post.php"]), .related-news article.panel:has(h3 a[href^="post.php"])) {
  position: relative; isolation: isolate;
}
html body main :is(.card .card-content, .card .card__body, .card .card__title, .card .card__title a, .hero .hero__body, .hero .hero__actions, .hero .hero__actions a, .related-news article.panel h3, .related-news article.panel h3 a) {
  position: static;
}
html body main :is(.card .card__title a[href^="post.php"], .hero .hero__actions a[href^="post.php"], .related-news article.panel h3 a[href^="post.php"])::after {
  content: ""; position: absolute; inset: 0; z-index: 1; cursor: pointer; border-radius: inherit;
}
/* Filtros e transformações criam outra referência para o link expandido.
   Mantenha o botão estável para a área clicável não encolher ao passar o mouse. */
html body main .hero .hero__actions a[href^="post.php"],
html body main .hero .hero__actions a[href^="post.php"]:hover,
html body main .hero .hero__actions a[href^="post.php"]:focus {
  transform: none;
  filter: none;
  transition: background-color 150ms ease, color 150ms ease;
}
html body main :is(.card, .hero) .tags a {
  position: relative; z-index: 2;
}
html body main :is(.card, .hero, .related-news article.panel):has(a[href^="post.php"]:focus-visible) {
  outline: 3px solid #6498ff; outline-offset: 4px;
}

html body main :is(.card,.hero) a.author-link {position:relative;z-index:2;}

/* Cores explícitas para o menu nativo de TODOS os seletores. */
html:root body select {
  color-scheme: dark !important;
  color: #f4f4f5 !important;
  background-color: #191919 !important;
}
html:root body select option,
html:root body select optgroup {
  color: #f4f4f5 !important;
  background-color: #191919 !important;
}
html:root[data-theme="light"] body select {
  color-scheme: light !important;
  color: #132b4a !important;
  background-color: #f1f4f9 !important;
}
html:root[data-theme="light"] body select option,
html:root[data-theme="light"] body select optgroup {
  color: #132b4a !important;
  background-color: #f1f4f9 !important;
}
html:root body select option:disabled { color: #a3a3a3 !important; }
html:root[data-theme="light"] body select option:disabled { color: #64748b !important; }

/* Barras de filtros: uma única regra para páginas públicas e administrativas. */
html:root body main form:is(.server-filter-form,.fn-bar):not(#bulk-search) {
 display:flex!important; flex-direction:row!important; flex-wrap:wrap!important;
 justify-content:flex-start!important; align-items:flex-end!important; gap:12px!important;
 width:100%!important; height:auto!important; min-height:0!important; box-sizing:border-box;
}
html:root body main form:is(.server-filter-form,.fn-bar):not(#bulk-search) > label {
 display:flex!important; flex-direction:column!important; gap:8px!important;
 flex:1 1 180px!important; min-width:0!important; max-width:none!important;
 margin:0!important; align-self:auto!important; height:auto!important;
}
html:root body main form.fn-bar:not(#bulk-search) > label { flex:0 1 300px!important; }
html:root body main form:is(.server-filter-form,.fn-bar):not(#bulk-search) > label > :is(input,select) {
 width:100%!important; max-width:100%!important; height:48px!important; min-height:48px!important;
 margin:0!important; padding:10px 12px!important; box-sizing:border-box!important;
}
html:root body main form:is(.server-filter-form,.fn-bar):not(#bulk-search) > :is(button,a) {
 display:inline-flex!important; align-items:center!important; justify-content:center!important;
 flex:0 0 auto!important; align-self:flex-end!important; min-height:48px!important;
 margin:0!important; padding:10px 16px!important; box-sizing:border-box; white-space:nowrap;
}
html:root body form:is(.server-filter-form,.fn-bar,.search) .fn-character-count,
html:root body form[method="get" i] .fn-character-count { display:none!important; }
html:root body main form:is(.server-filter-form,.fn-bar) > input[type=hidden] { display:none!important; }
@media(max-width:600px){
 html:root body main form:is(.server-filter-form,.fn-bar):not(#bulk-search) > label { flex:1 1 100%!important; }
}