/* Proposta inicial. Troque a paleta aqui sem alterar a estrutura da referência. */
:root {
  --brand-background: #79523e;
  --brand-cream: #fff9e9;
  --brand-paper: #fffdf6;
  --brand-outline: #573825;
  --brand-red: #b52e38;
  --brand-green: #387347;
  --brand-neutral: #937445;
  --brand-highlight: #e8d79d;
  --cream: var(--brand-cream);
  --paper: var(--brand-paper);
  --orange: var(--brand-red);
  --yellow: var(--brand-highlight);
  --ink: #36271f;
  --brown: var(--brand-outline);
  --terra: #8b5d47;
  --line: #dfd3bd;
  --muted: #746555;
  --soft-orange: #f4dfd4;
}
body, body[data-view="editorial"] { background: var(--brand-background); }
.brand-banner { background: var(--brand-background); }
.brand-stage { min-height: 376px; }
.brand-stage h1 { width: 100%; position: relative; z-index: 2; }
.brand-wordmark {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: var(--cream);
  font: 400 clamp(130px,15vw,179px)/.83 Mouse, sans-serif;
  letter-spacing: -.025em;
  text-align: center;
  padding-block: 6px 16px;
}
.brand-wordmark strong { font: inherit; color: #ff777b; }
.brand-stage .hero-mascot {
  width: 100%;
  max-width: 315px;
  height: auto;
  max-height: 320px;
  object-fit: contain;
  object-position: center;
  overflow: visible;
  animation: erf-float 5.4s ease-in-out infinite;
}
.brand-stage .mascot-think { animation-delay: -1.8s; }
@keyframes erf-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.hero-graphic { opacity: .15; }
.brand-backdrop { pointer-events: none; }
.club-footer { background: var(--brand-background); color: var(--cream); }
.club-footer-links button { color: var(--cream); }
.club-footer-bottom { border-color: #ffffff35; color: var(--cream); }
.club-footer-brand { width: 210px; }
.footer-wordmark { display: block; font: 400 66px/.82 Mouse,sans-serif; color: var(--cream); }
.footer-wordmark strong { color: #ff9698; font-weight: 400; }
.footer-socials button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 16px;
  min-height: 48px;
  border: 1.5px solid currentColor;
  border-radius: 14px;
  font-weight: 600;
}
.footer-socials button:hover { background: #ffffff12; }
.tile-orange { --tile-bg: #ae3639; --tile-rgb:174,54,57; --tile-ink:var(--cream); --tile-accent:#ffe5b9; }
.tile-yellow { --tile-bg: #e8d79d; --tile-rgb:232,215,157; --tile-ink:var(--brown); --tile-accent:var(--brown); }
.tile-terracotta { --tile-bg:#8b5d47; --tile-rgb:139,93,71; --tile-ink:var(--cream); --tile-accent:#f5d99c; }
.tile-ink { --tile-bg:#624536; --tile-rgb:98,69,54; --tile-ink:var(--cream); --tile-accent:#f5d99c; }
.tile-link { position: relative; }
.tile-link::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -4;
  background: url('assets/Grafismos-03.png') 95% 25% / 65% no-repeat;
  opacity: .16;
}
.tile-photo { object-position: 78% 35%; }
.is-featured .tile-photo { object-position: 75% 15%; }
.tile-title { max-width: 12ch; }
.is-featured .tile-title { max-width: 12ch; }
.local-voting { display: flex; flex-wrap: wrap; align-items: stretch; gap: 10px; }
.board-bottom { gap: 20px; align-items: center; flex-wrap: wrap; }
.vote-choice {
  --choice-color: var(--brand-outline);
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 14px;
  border: 1.5px solid var(--choice-color);
  border-radius: 13px;
  background: var(--cream);
  color: var(--choice-color);
  box-shadow: 3px 3px 0 var(--choice-color);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
}
.vote-choice-rf { --choice-color: var(--brand-red); }
.vote-choice-nrf { --choice-color: var(--brand-green); }
.vote-choice-normal { --choice-color: #765a32; }
.vote-choice[aria-pressed="true"] { background: var(--choice-color); color: #fffdf6; }
.vote-choice:hover { transform: translate(-1px,-1px); }
.vote-choice:active { transform: translate(2px,2px); box-shadow: 1px 1px 0 var(--choice-color); }
.vote-choice .icon { width: 16px; height: 16px; }
.vote-choice > span { font-size: 18px; line-height: 1; }
.code-rf { color: #8d2029; background: #f8d8d6; }
.code-nrf { color: #285534; background: #deebd3; }
.code-normal { color: #65502e; background: #eee1be; }
.result-rf, .legend-rf { background: var(--brand-red); }
.result-nrf, .legend-nrf { background: var(--brand-green); }
.result-normal, .legend-normal { background: var(--brand-neutral); }
.gauge-labels { justify-content: center; gap: 20px; }
.participant-tools { display: flex; gap: 7px; flex-wrap: wrap; }
.participant-tools .filter-chip { font-size: 12px; }
.participant-tools .filter-chip.active { color: var(--cream); background: var(--brown); }
.case-cover.instagram-story { transform: none; }
.case-cover .instagram-watch { min-height: 270px; }
.unified-art.poster-orange { --poster-rgb:174,54,57; }
.unified-art.poster-yellow { --poster-rgb:232,215,157; }
.unified-art.poster-terracotta { --poster-rgb:139,93,71; }
.case-cover .instagram-story-caption { background: var(--cream); }
.aside-mascot { max-height: 200px; width: 180px; object-fit: contain; }
.advertise-mascot { inset: 5% 0 auto; transform: none; object-fit: contain !important; height: 90% !important; width: 100% !important; max-width: 100%; object-position: center !important; }
.advertise-visual { inset: 0 2% 0 auto; width: 36%; }
.story-form { display: grid; gap: 10px; margin-top: 24px; }
.story-form label { margin-top: 6px; font-size: 13px; font-weight: 600; }
.story-form :is(input,select,textarea) {
  min-width: 0;
  width: 100%;
  border: 1.5px solid var(--brown);
  border-radius: 12px;
  background: var(--cream);
  color: var(--ink);
  padding: 12px;
  font: inherit;
  font-size: 16px;
}
.story-form textarea { resize: vertical; }
.story-form .btn { margin-top: 8px; }
.vote-options .vote-option { cursor: default; }
.vote-options .vote-option b { font-size: 26px; }
.dialog-note { color: #695b4d; }
@media(max-width:760px) {
  .brand-stage { min-height: 427px; gap: 8px 0; padding: 26px 18px 12px; grid-template-areas: "logo logo" "jump think"; grid-template-columns: repeat(2,minmax(0,1fr)); align-content: start; }
  .brand-stage h1 { grid-area: logo; }
  .brand-wordmark { font-size: clamp(105px,31vw,150px); padding-block: 7px; line-height: .83; }
  .brand-stage .hero-mascot { position: static; width: 100%; height: auto; max-height: 170px; object-fit: contain; }
  .tile-title { max-width: 11ch; }
  .is-featured .tile-title { max-width: 12ch; }
  .local-voting { width: 100%; gap: 8px; }
  .vote-choice { flex: 1 1 130px; padding: 10px; font-size: 12px; }
  .board-bottom > p { width: 100%; }
  .participant-tools { flex-wrap: wrap !important; overflow: visible !important; }
  .participant-tools .filter-chip { min-height: 40px; padding: 8px; font-size: 11px; }
  .footer-wordmark { font-size: 54px; }
  .footer-socials button { flex: 1; flex-direction: column; padding: 10px 6px; font-size: 11px; text-align: center; }
  .advertise-visual { right: 1%; width: 39%; }
  .advertise-mascot { max-width: 100%; }
}
@media(prefers-reduced-motion:reduce) {
  .brand-stage .hero-mascot { animation: none; transform: none; }
  .vote-choice { transition: none; }
  .vote-choice:hover { transform: none; }
}
