/* =========================================================
   painel-geral.css — Painel Geral (porta de entrada)
   Tudo escopado em #sec-painel_geral e prefixado .pg-. Mesma
   fonte única do sistema (Inter); o contraste vem de peso,
   tamanho e da faixa escura do topo com as curvas de nível.
   A tela ocupa a largura toda do conteúdo (sem teto de largura),
   para monitor grande não sobrar faixa vazia.
   ========================================================= */
#sec-painel_geral {
  --pg-mata: #12321F;
  --pg-mata-2: #1B4A2E;
  --pg-verde: #2D6A3E;
  --pg-palha: #C9A44C;
  --pg-chuva: #2C6CA4;
  --pg-tinta: #17221B;
  --pg-tinta-2: #4A5A4F;
  --pg-tinta-3: #66726A;
  --pg-linha: #DCE3D8;
  --pg-fundo: #F3F5EF;
  --pg-card: #FFFFFF;
  --pg-bom: #2F7A3E;
  --pg-mau: #B3261E;
  --pg-aviso: #9A6B00;
  font-variant-numeric: tabular-nums;
  color: var(--pg-tinta);
}
#conteudo:has(> #sec-painel_geral:not(.hidden)) { background: var(--pg-fundo, #F3F5EF); }
/* No Painel Geral a barra do topo (migalha e sincronização) sai: a tela
   já abre com o nome da fazenda e a data (pedido do Rodrigo, 06/10/2026). */
body:has(#sec-painel_geral:not(.hidden)) #topbar { display: none; }
/* Sem a barra do topo, o quadro principal fica centrado na altura da tela. */
body:has(#sec-painel_geral:not(.hidden)) #conteudo { padding-top: 18px; }

#sec-painel_geral .pg { width: 100%; display: flex; flex-direction: column; gap: 26px; }
/* No computador o quadro principal ocupa a altura da tela (28 px de folga
   em cima, 24 embaixo), com o conteúdo centrado: a parte de baixo do
   painel começa logo abaixo da dobra, sem aparecer uma faixa dela. */
@media (min-width: 1024px) and (min-height: 700px) {
  #sec-painel_geral .pg-hero { min-height: calc(100dvh - 52px); display: flex; flex-direction: column; justify-content: center; }
  #sec-painel_geral .pg-hero-in { width: 100%; }
}

/* ── Entrada escalonada ─────────────────────────────────── */
@keyframes pgSobe { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes pgCresce { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes pgAnel { from { stroke-dashoffset: var(--c); } to { stroke-dashoffset: var(--o); } }
@keyframes pgDeriva { from { transform: translateX(0); } to { transform: translateX(-60px); } }
#sec-painel_geral .pg > * { animation: pgSobe .6s cubic-bezier(.2,.7,.2,1) both; }
#sec-painel_geral .pg > *:nth-child(2) { animation-delay: .08s; }
#sec-painel_geral .pg > *:nth-child(3) { animation-delay: .16s; }
#sec-painel_geral .pg > *:nth-child(4) { animation-delay: .24s; }
#sec-painel_geral .pg > *:nth-child(5) { animation-delay: .32s; }

#sec-painel_geral .pg-ic { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }

/* ── Topo ───────────────────────────────────────────────── */
#sec-painel_geral .pg-hero {
  position: relative; overflow: hidden; border-radius: 22px; color: #F3F1E7;
  background:
    radial-gradient(900px 420px at 88% -10%, rgba(201,164,76,.26), transparent 60%),
    radial-gradient(700px 380px at -5% 120%, rgba(95,179,161,.22), transparent 60%),
    linear-gradient(135deg, var(--pg-mata) 0%, var(--pg-mata-2) 55%, #24573A 100%);
  box-shadow: 0 1px 0 rgba(255,255,255,.06) inset, 0 24px 48px -28px rgba(18,50,31,.65);
}
#sec-painel_geral .pg-hero::after {
  content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .18; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
#sec-painel_geral .pg-hero-curvas { position: absolute; inset: -20px -80px; width: calc(100% + 160px); height: calc(100% + 40px); pointer-events: none; animation: pgDeriva 40s linear infinite alternate; }
#sec-painel_geral .pg-hero-curvas path { fill: none; stroke: rgba(243,241,231,.075); stroke-width: 1.2; }
#sec-painel_geral .pg-hero-in { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 20px 40px; padding: 26px 38px 26px; }
#sec-painel_geral .pg-hero-sauda { margin: 0; font-size: 14px; color: rgba(243,241,231,.78); }
#sec-painel_geral .pg-hero-faz { margin: 6px 0 0; font-size: clamp(28px, 2.6vw, 48px); line-height: 1.04; font-weight: 800; letter-spacing: -.025em; color: #FFFDF5; }
#sec-painel_geral .pg-hero-safra { margin: 12px 0 0; align-self: flex-start; display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; padding: 6px 12px 6px 10px; border-radius: 999px; background: rgba(201,164,76,.18); color: #F2D88E; border: 1px solid rgba(201,164,76,.35); }

/* Tempo */
#sec-painel_geral .pg-tempo { padding: 18px 22px; border-radius: 18px; background: rgba(8,24,14,.32); border: 1px solid rgba(255,255,255,.09); min-width: 0; }
#sec-painel_geral .pg-tempo-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
#sec-painel_geral .pg-tempo-rot { font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: #F2D88E; font-weight: 700; }
#sec-painel_geral .pg-tempo-espera { margin: 14px 0 4px; color: rgba(243,241,231,.72); font-size: 14px; }
#sec-painel_geral .pg-tempo-hoje { display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: center; gap: 14px; margin-top: 12px; }
#sec-painel_geral .pg-tempo-ic svg { width: 64px; height: 64px; display: block; filter: drop-shadow(0 6px 12px rgba(0,0,0,.25)); }
#sec-painel_geral .pg-tempo-temp b { display: block; font-size: 46px; font-weight: 800; letter-spacing: -.03em; line-height: 1; color: #FFFDF5; }
#sec-painel_geral .pg-tempo-temp span { font-size: 13px; color: rgba(243,241,231,.72); }
#sec-painel_geral .pg-tempo-cond { margin: 0; font-size: 14px; line-height: 1.45; color: rgba(243,241,231,.88); }
#sec-painel_geral .pg-tempo-dias { list-style: none; margin: 12px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
#sec-painel_geral .pg-tempo-dias li { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 10px 6px; border-radius: 12px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.06); }
#sec-painel_geral .pg-tempo-dias li.chuva { background: rgba(44,108,164,.28); border-color: rgba(120,180,240,.35); }
#sec-painel_geral .pg-tempo-dias span { font-size: 12px; color: rgba(243,241,231,.8); text-transform: capitalize; }
#sec-painel_geral .pg-tempo-dias i svg { width: 32px; height: 32px; display: block; }
#sec-painel_geral .pg-tempo-dias b { font-size: 15px; color: #FFFDF5; }
#sec-painel_geral .pg-tempo-dias em { font-style: normal; font-size: 12px; color: rgba(243,241,231,.6); }
#sec-painel_geral .pg-tempo-pe { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 10px; font-size: 13px; color: rgba(243,241,231,.78); }
#sec-painel_geral .pg-tempo-pe > span { display: inline-flex; align-items: center; gap: 6px; }
#sec-painel_geral .pg-tempo-pe b { color: #FFFDF5; }
#sec-painel_geral .pg-tempo-pe .pg-ic { width: 15px; height: 15px; color: #A9D6FF; }
#sec-painel_geral .pg-tempo-link { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; border: 0; background: none; padding: 0; font: inherit; font-weight: 700; color: #F2D88E; cursor: pointer; }
#sec-painel_geral .pg-tempo-link .pg-ic { width: 15px; height: 15px; color: inherit; transition: transform .2s; }
#sec-painel_geral .pg-tempo-link:hover .pg-ic { transform: translateX(3px); }

#sec-painel_geral .pg-tempo-sel { position: relative; }
#sec-painel_geral .pg-tempo-sel::after { content: ''; position: absolute; right: 14px; top: 50%; width: 7px; height: 7px; margin-top: -5px; border-right: 2px solid #F2D88E; border-bottom: 2px solid #F2D88E; transform: rotate(45deg); pointer-events: none; }
#sec-painel_geral .pg-tempo-sel select { appearance: none; -webkit-appearance: none; min-height: 40px; max-width: min(320px, 100%); padding: 0 38px 0 14px; border-radius: 999px; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.08); color: #FFFDF5; font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; text-overflow: ellipsis; }
#sec-painel_geral .pg-tempo-sel select:hover { background: rgba(255,255,255,.14); }
#sec-painel_geral .pg-tempo-sel select:focus-visible { outline: 2px solid #F2C566; outline-offset: 2px; }
#sec-painel_geral .pg-tempo-sel option { color: #17221B; background: #fff; }
#sec-painel_geral .pg-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }


/* ── Cabeçalho de bloco ─────────────────────────────────── */
#sec-painel_geral .pg-col-h { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 0 0 12px; }
#sec-painel_geral .pg-col-h h2 { margin: 0; font-size: 20px; font-weight: 800; letter-spacing: -.015em; color: var(--pg-tinta); }
#sec-painel_geral .pg-sub { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--pg-tinta-3); }
#sec-painel_geral .pg-sub .pg-ic { width: 15px; height: 15px; }
#sec-painel_geral .pg-link { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 4px; border: 0; background: none; font: inherit; font-size: 13px; font-weight: 600; color: var(--pg-verde); cursor: pointer; }
#sec-painel_geral .pg-link .pg-ic { width: 15px; height: 15px; transition: transform .2s; }
#sec-painel_geral .pg-link:hover .pg-ic { transform: translateX(3px); }
#sec-painel_geral .pg-contagem { min-width: 24px; height: 24px; padding: 0 7px; border-radius: 99px; background: var(--pg-tinta); color: #fff; font-size: 12px; font-weight: 700; display: inline-grid; place-items: center; }

/* ── Hoje na fazenda: O que pede você ──────────────────── */
#sec-painel_geral .pg-atencao { display: flex; flex-direction: column; }
#sec-painel_geral .pg-atencao-lista { display: flex; flex-direction: column; margin: 0 -10px; }
#sec-painel_geral .pg-at {
  position: relative; display: flex; align-items: center; gap: 14px; text-align: left; padding: 12px 12px 12px 14px; min-height: 64px;
  border: 0; border-radius: 12px; background: none; font: inherit; color: inherit; cursor: pointer;
  transition: background .18s;
  animation: pgSobe .5s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(.25s + var(--i) * .06s);
}
#sec-painel_geral .pg-at + .pg-at::after { content: ''; position: absolute; left: 66px; right: 12px; top: 0; height: 1px; background: #EEF2EB; }
#sec-painel_geral .pg-at:hover { background: #F5F8F2; }
#sec-painel_geral .pg-at:focus-visible { outline: 2px solid var(--pg-verde); outline-offset: -2px; }
#sec-painel_geral .pg-at-ic { position: relative; width: 40px; height: 40px; flex: none; border-radius: 12px; display: grid; place-items: center; background: #E7F0E4; color: var(--pg-verde); }
#sec-painel_geral .pg-at-ic .pg-ic { width: 19px; height: 19px; }
#sec-painel_geral .pg-at-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
#sec-painel_geral .pg-at-txt b { font-size: 14.5px; font-weight: 700; }
#sec-painel_geral .pg-at-txt span { font-size: 12.5px; color: var(--pg-tinta-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#sec-painel_geral .pg-at-cta { display: inline-flex; align-items: center; gap: 4px; padding: 6px 10px; border-radius: 99px; font-size: 12.5px; font-weight: 700; color: var(--pg-verde); background: #EEF3EA; white-space: nowrap; transition: transform .18s; }
#sec-painel_geral .pg-at:hover .pg-at-cta { transform: translateX(2px); }
#sec-painel_geral .pg-at-cta .pg-ic { width: 14px; height: 14px; }
#sec-painel_geral .pg-at-mau .pg-at-ic { background: #FBE7E4; color: var(--pg-mau); }
#sec-painel_geral .pg-at-mau .pg-at-ic::after { content: ''; position: absolute; top: -3px; right: -3px; width: 10px; height: 10px; border-radius: 50%; background: var(--pg-mau); border: 2px solid #fff; }
#sec-painel_geral .pg-at-mau .pg-at-cta { color: var(--pg-mau); background: #FBEDEA; }
#sec-painel_geral .pg-at-aviso .pg-at-ic { background: #FBF0D6; color: var(--pg-aviso); }
#sec-painel_geral .pg-at-aviso .pg-at-cta { color: var(--pg-aviso); background: #FBF4E1; }
#sec-painel_geral .pg-at-pe { margin-top: auto; padding-top: 14px; display: flex; gap: 10px; flex-wrap: wrap; }
#sec-painel_geral .pg-at-pe-b { flex: 1; min-width: 160px; min-height: 44px; display: inline-flex; align-items: center; gap: 8px; padding: 0 14px; border-radius: 12px; border: 1px dashed #C8D2C4; background: #FAFBF8; font: inherit; font-size: 13px; font-weight: 600; color: var(--pg-tinta-2); cursor: pointer; transition: border-color .18s, background .18s, color .18s; }
#sec-painel_geral .pg-at-pe-b .pg-ic { width: 16px; height: 16px; color: var(--pg-verde); }
#sec-painel_geral .pg-at-pe-b .pg-ic:last-child { margin-left: auto; width: 14px; height: 14px; transition: transform .18s; }
#sec-painel_geral .pg-at-pe-b:hover { border-style: solid; border-color: #B9C8B2; background: #F2F6EF; color: var(--pg-tinta); }
#sec-painel_geral .pg-at-pe-b:hover .pg-ic:last-child { transform: translateX(3px); }
#sec-painel_geral .pg-at-pe-b:focus-visible { outline: 2px solid var(--pg-verde); outline-offset: 2px; }
#sec-painel_geral .pg-tudo-ok { flex: 1; display: flex; align-items: center; gap: 14px; padding: 18px 20px; border-radius: 14px; background: linear-gradient(90deg, #E7F0E4, #F7FAF4); border: 1px solid #CFE0C8; }
#sec-painel_geral .pg-tudo-ok .pg-ic { width: 28px; height: 28px; color: var(--pg-verde); }
#sec-painel_geral .pg-tudo-ok b { display: block; font-size: 15px; }
#sec-painel_geral .pg-tudo-ok span { font-size: 13px; color: var(--pg-tinta-2); }

/* ── Produção e campo ───────────────────────────────────── */
#sec-painel_geral .pg-duas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; align-items: stretch; }
#sec-painel_geral .pg-col { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
#sec-painel_geral .pg-col .pg-col-h { margin-bottom: 0; min-height: 44px; }
#sec-painel_geral .pg-cartao { background: var(--pg-card); border: 1px solid var(--pg-linha); border-radius: 16px; padding: 18px 20px; box-shadow: 0 1px 2px rgba(23,34,27,.04); }
#sec-painel_geral .pg-cartao-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; padding-bottom: 12px; border-bottom: 1px solid #EEF2EB; }
#sec-painel_geral .pg-cartao-h h3 { margin: 0; display: inline-flex; align-items: center; gap: 10px; font-size: 15.5px; font-weight: 700; }
#sec-painel_geral .pg-h3-ic { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: var(--pg-mata); color: #F2D88E; }
#sec-painel_geral .pg-h3-ic .pg-ic { width: 16px; height: 16px; }
#sec-painel_geral .pg-cartao-h > span { font-size: 12.5px; color: var(--pg-tinta-3); }
#sec-painel_geral .pg-cartao-h .pg-link { min-height: 32px; }
#sec-painel_geral .pg-vazio { padding: 26px 20px; border-radius: 16px; border: 1px dashed #C8D2C4; color: var(--pg-tinta-3); font-size: 14px; background: #FAFBF8; }
#sec-painel_geral .pg-nota { margin: 0 0 6px; font-size: 12.5px; color: var(--pg-tinta-3); }
#sec-painel_geral .pg-bom { color: var(--pg-bom); }
#sec-painel_geral .pg-mau { color: var(--pg-mau); }

#sec-painel_geral .pg-faixa-area { display: flex; gap: 3px; height: 30px; margin-bottom: 8px; }
#sec-painel_geral .pg-faixa-area > span { position: relative; width: var(--w); border-radius: 8px; overflow: hidden; background: color-mix(in srgb, var(--c) 22%, #fff); transform-origin: left; animation: pgCresce .9s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(.3s + var(--i) * .08s); }
#sec-painel_geral .pg-faixa-area i { position: absolute; left: 0; top: 0; bottom: 0; width: var(--f); transform-origin: left; background: repeating-linear-gradient(135deg, var(--c) 0 6px, color-mix(in srgb, var(--c) 85%, #000) 6px 8px); animation: pgCresce 1.2s cubic-bezier(.2,.7,.2,1) .7s both; }

#sec-painel_geral .pg-culturas { display: flex; flex-direction: column; }
#sec-painel_geral .pg-cult { display: grid; grid-template-columns: 10px minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr); align-items: center; gap: 12px; padding: 11px 0; border-top: 1px solid #EEF2EB; }
#sec-painel_geral .pg-cult:first-child { border-top: 0; }
#sec-painel_geral .pg-cult-cor { width: 10px; height: 36px; border-radius: 4px; }
#sec-painel_geral .pg-cult-nome b, #sec-painel_geral .pg-cult-num b { display: block; font-size: 15px; font-weight: 700; }
#sec-painel_geral .pg-cult-num b small { font-size: 11.5px; font-weight: 600; color: var(--pg-tinta-3); }
#sec-painel_geral .pg-cult-nome span, #sec-painel_geral .pg-cult-num > span { font-size: 12px; color: var(--pg-tinta-3); display: inline-flex; align-items: center; gap: 4px; }
#sec-painel_geral .pg-var { display: inline-flex; align-items: center; gap: 2px; font-weight: 700; }
#sec-painel_geral .pg-var .pg-ic { width: 13px; height: 13px; }

#sec-painel_geral .pg-reb-lista { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 10px; }
#sec-painel_geral .pg-reb-l { padding: 12px 14px; border-radius: 12px; background: #F6F8F3; }
#sec-painel_geral .pg-reb-l b { display: block; font-size: 14px; }
#sec-painel_geral .pg-reb-l span { font-size: 12.5px; color: var(--pg-tinta-3); }

/* ── Hoje na fazenda: últimas operações em linha do tempo ── */
#sec-painel_geral .pg-feed { position: relative; list-style: none; margin: 0; padding: 0; }
#sec-painel_geral .pg-feed::before { content: ''; position: absolute; left: 17px; top: 22px; bottom: 22px; width: 2px; border-radius: 2px; background: linear-gradient(#D5E2CF, #EEF2EB); }
#sec-painel_geral .pg-feed li { position: relative; display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 9px 0; animation: pgSobe .45s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(.3s + var(--i) * .05s); }
#sec-painel_geral .pg-feed-ic { position: relative; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: #E7F0E4; color: var(--pg-verde); box-shadow: 0 0 0 4px var(--pg-card); }
#sec-painel_geral .pg-feed-ic .pg-ic { width: 17px; height: 17px; }
#sec-painel_geral .pg-feed li:first-child .pg-feed-ic { background: var(--pg-verde); color: #fff; }
#sec-painel_geral .pg-feed-rebanho { background: #F2EADC; color: #7A4B2A; }
#sec-painel_geral .pg-feed-carga { background: #FBF0D6; color: var(--pg-aviso); }
#sec-painel_geral .pg-feed b { display: block; font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#sec-painel_geral .pg-feed span { display: block; font-size: 12.5px; color: var(--pg-tinta-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#sec-painel_geral .pg-feed time { font-size: 12px; font-weight: 600; color: var(--pg-tinta-2); white-space: nowrap; padding: 4px 9px; border-radius: 99px; background: #F3F5EF; }

/* ── Gestão e simuladores (cartões de entrada, sem número) ── */
#sec-painel_geral .pg-bloco .pg-col-h { margin-bottom: 12px; }
/* Gestão: faixa escura, irmã do quadro do topo */
#sec-painel_geral .pg-ges-faixa { position: relative; overflow: hidden; padding: 22px 24px 24px; border-radius: 22px; background: radial-gradient(120% 140% at 100% 0%, var(--pg-mata-2) 0%, var(--pg-mata) 60%); color: #F3F1E7; }
#sec-painel_geral .pg-ges-faixa::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .14;
  background: repeating-radial-gradient(circle at 110% -20%, transparent 0 22px, rgba(242,216,142,.6) 22px 23px); }
#sec-painel_geral .pg-ges-cab { position: relative; display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
#sec-painel_geral .pg-ges-cab h2 { margin: 0 0 4px; font-size: 20px; font-weight: 800; letter-spacing: -.015em; color: #FFFDF5; }
#sec-painel_geral .pg-ges-faixa .pg-sub { color: rgba(243,241,231,.72); }
#sec-painel_geral .pg-ges-grade { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
#sec-painel_geral .pg-sim-grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
#sec-painel_geral .pg-ges, #sec-painel_geral .pg-sim {
  position: relative; display: flex; align-items: center; gap: 14px; text-align: left; min-height: 84px;
  padding: 14px 16px; border-radius: 16px; font: inherit; color: inherit; cursor: pointer; overflow: hidden;
  transition: transform .2s, box-shadow .2s, border-color .2s, background .2s;
  animation: pgSobe .5s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(.3s + var(--i) * .05s);
}
#sec-painel_geral .pg-ges { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); color: #F3F1E7; }
#sec-painel_geral .pg-ges:hover { background: rgba(255,255,255,.11); border-color: rgba(242,216,142,.5); transform: translateY(-2px); }
#sec-painel_geral .pg-ges:focus-visible { outline: 2px solid #F2C566; outline-offset: 2px; }
#sec-painel_geral .pg-sim { background: var(--pg-card); border: 1px solid var(--pg-linha); }
#sec-painel_geral .pg-sim:hover { transform: translateY(-2px); box-shadow: 0 14px 26px -18px rgba(23,34,27,.45); border-color: #C9B07A; }
#sec-painel_geral .pg-sim:focus-visible { outline: 2px solid var(--pg-verde); outline-offset: 2px; }
#sec-painel_geral .pg-card-ic { width: 44px; height: 44px; flex: none; border-radius: 12px; display: grid; place-items: center; }
#sec-painel_geral .pg-card-ic .pg-ic { width: 21px; height: 21px; }
#sec-painel_geral .pg-ges .pg-card-ic { background: rgba(242,216,142,.14); color: #F2D88E; }
#sec-painel_geral .pg-sim .pg-card-ic { background: #FBF3DD; color: #8A6A0D; transition: background .2s, color .2s; }
#sec-painel_geral .pg-sim:hover .pg-card-ic { background: #8A6A0D; color: #FFF8E4; }
#sec-painel_geral .pg-card-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
#sec-painel_geral .pg-card-txt b { font-size: 15px; font-weight: 700; }
#sec-painel_geral .pg-card-txt span { font-size: 12.5px; line-height: 1.4; color: var(--pg-tinta-3); }
#sec-painel_geral .pg-ges .pg-card-txt b { color: #FFFDF5; }
#sec-painel_geral .pg-ges .pg-card-txt span { color: rgba(243,241,231,.7); }
#sec-painel_geral .pg-card-seta { flex: none; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; color: var(--pg-verde); background: #EEF3EA; transition: transform .2s, background .2s, color .2s; }
#sec-painel_geral .pg-card-seta .pg-ic { width: 15px; height: 15px; }
#sec-painel_geral .pg-ges .pg-card-seta { background: rgba(255,255,255,.08); color: #F2D88E; }
#sec-painel_geral .pg-ges:hover .pg-card-seta { background: #F2D88E; color: var(--pg-mata); transform: translateX(2px); }
#sec-painel_geral .pg-sim:hover .pg-card-seta { background: var(--pg-verde); color: #fff; transform: translateX(2px); }

/* ── Telas menores ──────────────────────────────────────── */
/* Andamento das atividades (só percentual e datas). Cresce até o fim da
   coluna para terminar na mesma linha do quadro do Tempo ao lado. */
#sec-painel_geral .pg-hero-quem { display: flex; flex-direction: column; min-width: 0; }
#sec-painel_geral [data-pg-and-host] { flex: 1; display: flex; flex-direction: column; }
#sec-painel_geral [data-pg-and-host] > .pg-and { flex: 1; }
#sec-painel_geral .pg-and { margin-top: 16px; padding: 16px 18px 8px; border-radius: 18px; background: rgba(8,24,14,.32); border: 1px solid rgba(255,255,255,.09); }
#sec-painel_geral .pg-and-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 4px; }
#sec-painel_geral .pg-and-cab > span { font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: #F2D88E; font-weight: 700; }
#sec-painel_geral .pg-and-mais { min-height: 32px; padding: 0 12px; border-radius: 99px; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.06); color: #F3F1E7; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
#sec-painel_geral .pg-and-mais:hover { background: rgba(255,255,255,.12); }
#sec-painel_geral .pg-and-l { display: block; width: 100%; text-align: left; font: inherit; color: inherit; padding: 12px 10px; margin: 0 -10px; width: calc(100% + 20px); border: 0; border-radius: 12px; background: none; cursor: pointer; border-top: 1px solid rgba(255,255,255,.07); transition: background .2s; animation: pgSobe .5s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(.3s + var(--i) * .07s); }
#sec-painel_geral .pg-and-l:first-of-type { border-top-color: transparent; }
#sec-painel_geral .pg-and-l:hover { background: rgba(255,255,255,.06); }
#sec-painel_geral .pg-and-l:focus-visible { outline: 2px solid #F2C566; outline-offset: 0; }
#sec-painel_geral .pg-and-topo { display: flex; align-items: center; gap: 8px; min-width: 0; }
#sec-painel_geral .pg-and-cor { width: 9px; height: 9px; border-radius: 3px; flex: none; }
#sec-painel_geral .pg-and-topo b { font-size: 14px; color: #FFFDF5; white-space: nowrap; }
#sec-painel_geral .pg-and-sub { font-size: 12px; color: rgba(243,241,231,.6); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 1; }
#sec-painel_geral .pg-and-dest { margin-left: auto; font-size: 13px; font-weight: 700; color: #FFFDF5; white-space: nowrap; }
#sec-painel_geral .pg-and-barra { display: flex; gap: 4px; margin-top: 9px; }
#sec-painel_geral .pg-and-seg { position: relative; min-width: 0; padding-bottom: 16px; }
#sec-painel_geral .pg-and-seg::before { content: ''; display: block; height: 7px; border-radius: 99px; background: rgba(255,255,255,.12); }
#sec-painel_geral .pg-and-seg i { position: absolute; left: 0; top: 0; height: 7px; width: var(--w); border-radius: 99px; background: var(--c); opacity: .75; transform-origin: left; animation: pgCresce 1.1s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(.35s + var(--d)); }
#sec-painel_geral .pg-and-seg.atual i { opacity: 1; box-shadow: 0 0 10px color-mix(in srgb, var(--c) 60%, transparent); }
#sec-painel_geral .pg-and-seg em { position: absolute; left: 0; right: 0; bottom: 0; font-style: normal; font-size: 10.5px; letter-spacing: .03em; color: rgba(243,241,231,.5); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#sec-painel_geral .pg-and-seg.atual em { color: #FFFDF5; font-weight: 700; }
#sec-painel_geral .pg-and-seg.feita em { color: rgba(243,241,231,.75); }
#sec-painel_geral .pg-and-marco { display: flex; align-items: center; gap: 5px; margin-top: 2px; font-size: 12px; color: rgba(243,241,231,.75); }
#sec-painel_geral .pg-and-marco .pg-ic { width: 13px; height: 13px; color: #F2D88E; }
#sec-painel_geral .pg-and-marco small { font-size: 11px; color: rgba(243,241,231,.5); }
#sec-painel_geral .pg-and-l.alerta .pg-and-marco { color: #FFB3A3; }

#sec-painel_geral .pg-and-grupo { cursor: default; }
#sec-painel_geral .pg-and-grupo:hover { background: none; }
#sec-painel_geral .pg-and-av { display: grid; grid-template-columns: minmax(70px, 110px) minmax(60px, 1fr) auto auto; align-items: center; gap: 10px; width: 100%; margin-top: 8px; padding: 6px 8px; border: 0; border-radius: 10px; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; transition: background .2s; }
#sec-painel_geral .pg-and-av:hover { background: rgba(255,255,255,.06); }
#sec-painel_geral .pg-and-av:focus-visible { outline: 2px solid #F2C566; outline-offset: 0; }
#sec-painel_geral .pg-and-av-nome { font-size: 12.5px; color: rgba(243,241,231,.85); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#sec-painel_geral .pg-and-av-barra { display: flex; gap: 3px; }
#sec-painel_geral .pg-and-av-barra > span { position: relative; height: 5px; border-radius: 99px; background: rgba(255,255,255,.12); overflow: hidden; }
#sec-painel_geral .pg-and-av-barra i { position: absolute; left: 0; top: 0; bottom: 0; width: var(--w); border-radius: 99px; background: var(--c); opacity: .7; transform-origin: left; animation: pgCresce 1.1s cubic-bezier(.2,.7,.2,1) .4s both; }
#sec-painel_geral .pg-and-av-barra i.atual { opacity: 1; }
#sec-painel_geral .pg-and-av-dest { font-size: 12.5px; font-weight: 700; color: #FFFDF5; white-space: nowrap; }
#sec-painel_geral .pg-and-av-marco { font-size: 12px; color: rgba(243,241,231,.7); white-space: nowrap; }
#sec-painel_geral .pg-and-legenda { display: flex; gap: 14px; margin: 6px 8px 0; font-size: 11px; color: rgba(243,241,231,.55); }
#sec-painel_geral .pg-and-legenda span { display: inline-flex; align-items: center; gap: 5px; }
#sec-painel_geral .pg-and-legenda i { width: 8px; height: 8px; border-radius: 2px; }
@media (max-width: 640px) {
  #sec-painel_geral .pg-and-av { grid-template-columns: minmax(0, 1fr) auto; }
  #sec-painel_geral .pg-and-av-barra { grid-column: 1 / -1; order: 3; }
  #sec-painel_geral .pg-and-av-marco { grid-column: 1 / -1; order: 4; }
}

/* As quebras olham a largura que o painel tem (sem o menu lateral), não a
   da tela: num tablet ou num monitor pequeno o menu come boa parte dela. */
#sec-painel_geral { container: pgtela / inline-size; }
@container pgtela (max-width: 900px) {
  #sec-painel_geral .pg-hero-in { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  #sec-painel_geral .pg-duas { grid-template-columns: minmax(0, 1fr); }
  #sec-painel_geral .pg-sim-grade, #sec-painel_geral .pg-ges-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container pgtela (max-width: 560px) {
  #sec-painel_geral .pg-ges-grade, #sec-painel_geral .pg-sim-grade { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  #sec-painel_geral .pg-ges-faixa { padding: 18px 16px; }
  #sec-painel_geral .pg-at-cta { padding: 0; background: none; }
  #sec-painel_geral .pg-at-cta { font-size: 0; }
  #sec-painel_geral .pg-at-cta .pg-ic { width: 18px; height: 18px; }
}
@media (max-width: 640px) {
  #sec-painel_geral .pg-hero-in { padding: 22px 18px; }
  #sec-painel_geral .pg-tempo { padding: 16px; }
  #sec-painel_geral .pg-tempo-hoje { grid-template-columns: auto minmax(0, 1fr); }
  #sec-painel_geral .pg-tempo-cond { grid-column: 1 / -1; }
  #sec-painel_geral .pg-tempo-dias { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #sec-painel_geral .pg-tempo-link { margin-left: 0; }
  #sec-painel_geral .pg-cult { grid-template-columns: 8px minmax(0,1fr) minmax(0,1fr); }
  #sec-painel_geral .pg-cult > :last-child { grid-column: 2 / -1; }
  #sec-painel_geral .pg-cartao { padding: 16px; }
}
/* Fases da safra (só percentual) */
#sec-painel_geral .pg-fases { display: block; width: 100%; margin-top: 22px; padding: 18px 20px; text-align: left; font: inherit; color: inherit; border-radius: 18px; background: rgba(8,24,14,.32); border: 1px solid rgba(255,255,255,.09); cursor: pointer; transition: border-color .2s, background .2s; }
#sec-painel_geral button.pg-fases:hover { border-color: rgba(242,216,142,.45); background: rgba(8,24,14,.42); }
#sec-painel_geral button.pg-fases:focus-visible { outline: 2px solid #F2C566; outline-offset: 2px; }
#sec-painel_geral .pg-fases-vazio p { margin: 0; font-size: 14px; color: rgba(243,241,231,.8); }
#sec-painel_geral .pg-fases-passos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
#sec-painel_geral .pg-fase { opacity: .55; transition: opacity .3s; }
#sec-painel_geral .pg-fase-atual, #sec-painel_geral .pg-fase-feita { opacity: 1; }
#sec-painel_geral .pg-fase-cab { display: flex; align-items: baseline; gap: 6px; margin-bottom: 8px; }
#sec-painel_geral .pg-fase-cab span { font-size: 12px; text-transform: uppercase; letter-spacing: .09em; font-weight: 700; color: rgba(243,241,231,.85); }
#sec-painel_geral .pg-fase-cab em { font-style: normal; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; padding: 2px 7px; border-radius: 99px; background: #F2D88E; color: #12321F; }
#sec-painel_geral .pg-fase-cab b { margin-left: auto; font-size: 22px; font-weight: 800; letter-spacing: -.02em; color: #FFFDF5; }
#sec-painel_geral .pg-fase-trilho { height: 8px; border-radius: 99px; background: rgba(255,255,255,.12); overflow: hidden; }
#sec-painel_geral .pg-fase-trilho i { display: block; height: 100%; width: var(--w); border-radius: 99px; background: linear-gradient(90deg, #8FBF5A, #C9E58B); transform-origin: left; animation: pgCresce 1.1s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(.4s + var(--d) * .15s); }
#sec-painel_geral .pg-fase-atual .pg-fase-trilho i { background: linear-gradient(90deg, #E6B547, #F2D88E); box-shadow: 0 0 12px rgba(242,216,142,.5); }
#sec-painel_geral .pg-fases-cult { list-style: none; margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid rgba(255,255,255,.1); display: flex; flex-direction: column; gap: 9px; }
#sec-painel_geral .pg-fases-cult li { display: grid; grid-template-columns: 9px minmax(70px, auto) auto minmax(60px, 1fr) auto; align-items: center; gap: 10px; font-size: 13px; }
#sec-painel_geral .pg-fases-cult li > i { width: 9px; height: 9px; border-radius: 3px; }
#sec-painel_geral .pg-fases-cult b { color: #FFFDF5; }
#sec-painel_geral .pg-fase-chip { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 99px; background: rgba(255,255,255,.1); color: rgba(243,241,231,.85); }
#sec-painel_geral .pg-fase-mini { height: 5px; border-radius: 99px; background: rgba(255,255,255,.1); overflow: hidden; }
#sec-painel_geral .pg-fase-mini i { display: block; height: 100%; width: var(--w); border-radius: 99px; }
#sec-painel_geral .pg-fases-cult em { font-style: normal; font-size: 12px; color: rgba(243,241,231,.72); white-space: nowrap; }

/* Chuva da gleba dentro do quadro do tempo */
@keyframes pgEntra { from { opacity: 0; transform: translateY(-5px); filter: blur(5px); } to { opacity: 1; transform: none; filter: blur(0); } }
#sec-painel_geral .pg-tempo-corpo { transition: opacity 1.1s ease, transform 1.1s ease, filter 1.1s ease; }
#sec-painel_geral .pg-tempo-corpo.pg-sai { opacity: 0; transform: translateY(5px); filter: blur(5px); }
#sec-painel_geral .pg-tempo-corpo.pg-entra { animation: pgEntra 1.8s cubic-bezier(.22,.61,.36,1) both; }
#sec-painel_geral .pg-tempo-rot em { font-style: normal; font-weight: 500; letter-spacing: .04em; text-transform: none; color: rgba(243,241,231,.7); margin-left: 4px; }
#sec-painel_geral .pg-tempo-chuva { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
#sec-painel_geral .pg-tempo-chuva > div { padding: 10px 12px; border-radius: 12px; background: rgba(44,108,164,.2); border: 1px solid rgba(120,180,240,.22); min-width: 0; }
#sec-painel_geral .pg-tempo-chuva small { display: flex; align-items: center; gap: 5px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: rgba(243,241,231,.75); white-space: nowrap; }
#sec-painel_geral .pg-tempo-chuva small .pg-ic { width: 14px; height: 14px; color: #A9D6FF; }
#sec-painel_geral .pg-tempo-reg { display: flex; align-items: center; gap: 4px; margin-top: 4px; min-height: 28px; padding: 0; border: 0; background: none; font: inherit; font-size: 12.5px; font-weight: 700; color: #F2D88E; cursor: pointer; }
#sec-painel_geral .pg-tempo-reg .pg-ic { width: 13px; height: 13px; color: inherit; }
#sec-painel_geral .pg-tempo-chuva b { display: block; margin-top: 2px; font-size: 18px; font-weight: 800; color: #FFFDF5; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#sec-painel_geral .pg-tempo-chuva span { font-size: 11px; color: rgba(243,241,231,.6); }
@keyframes pgGiro { from { transform: scaleX(0); } to { transform: scaleX(1); } }
#sec-painel_geral .pg-giro { display: flex; align-items: center; gap: 5px; min-width: 0; flex: 1; }
#sec-painel_geral .pg-giro i { width: 6px; height: 6px; border-radius: 99px; background: rgba(255,255,255,.25); flex: none; transition: width .6s cubic-bezier(.22,.61,.36,1), background .6s ease; }
#sec-painel_geral .pg-giro i.on { background: #F2D88E; width: 16px; border-radius: 99px; }
#sec-painel_geral .pg-giro span { font-size: 12px; color: rgba(243,241,231,.75); }
#sec-painel_geral .pg-giro-barra { margin-left: 8px; width: 60px; height: 3px; border-radius: 99px; background: rgba(242,216,142,.8); transform-origin: left; animation: pgGiro 15s linear both; }
#sec-painel_geral .pg-giro-barra.pausa { animation: none; background: rgba(255,255,255,.2); }
#sec-painel_geral .pg-tempo:hover .pg-giro-barra { animation-play-state: paused; }

/* Chuva diária da gleba dentro do quadro do tempo */
#sec-painel_geral .pg-chuva-d { margin-top: 12px; padding: 12px 14px 8px; border-radius: 12px; background: rgba(8,24,14,.25); border: 1px solid rgba(255,255,255,.07); min-height: 150px; }
#sec-painel_geral .pg-chuva-d[data-ir] { cursor: pointer; transition: background .2s, border-color .2s; }
#sec-painel_geral .pg-chuva-d[data-ir]:hover, #sec-painel_geral .pg-chuva-d[data-ir]:focus-visible { background: rgba(8,24,14,.4); border-color: rgba(242,216,142,.45); outline: none; }
#sec-painel_geral .pg-chuva-espera { margin: 8px 0; font-size: 13px; color: rgba(243,241,231,.7); }
#sec-painel_geral .pg-cd-cab { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 13px; color: rgba(243,241,231,.85); }
#sec-painel_geral .pg-cd-cab small { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: rgba(243,241,231,.75); margin-right: 4px; }
#sec-painel_geral .pg-cd-cab small .pg-ic { width: 14px; height: 14px; color: #A9D6FF; }
#sec-painel_geral .pg-cd-cab b { color: #FFFDF5; }
#sec-painel_geral .pg-cd-cab em { font-style: normal; font-size: 11.5px; color: rgba(243,241,231,.6); }
#sec-painel_geral .pg-cd-svg { display: block; width: 100%; height: 110px; margin-top: 8px; overflow: visible; }
#sec-painel_geral .pg-cd-barra { fill: #F3F1E7; transform-box: fill-box; transform-origin: bottom; animation: pgSobeBarra .8s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(var(--i) * 18ms); }
@keyframes pgSobeBarra { from { transform: scaleY(0); } to { transform: scaleY(1); } }
#sec-painel_geral .pg-cd-sem { fill: none; stroke: rgba(255,255,255,.25); stroke-dasharray: 2 2; }
#sec-painel_geral .pg-cd-base { stroke: rgba(255,255,255,.18); stroke-width: 1; vector-effect: non-scaling-stroke; }
#sec-painel_geral .pg-cd-eixo { fill: rgba(243,241,231,.55); font-size: 10px; }

/* Bolsas internacionais */
#sec-painel_geral .pg-bolsas { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
#sec-painel_geral .pg-bolsas-espera { grid-column: 1 / -1; margin: 0; font-size: 14px; color: rgba(243,241,231,.72); }
#sec-painel_geral .pg-bolsa { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; padding: 14px 16px; min-height: 96px; border-radius: 14px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.10); color: inherit; font: inherit; cursor: pointer; transition: background .2s, transform .2s, border-color .2s; animation: pgSobe .5s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(.3s + var(--i) * .06s); }
#sec-painel_geral .pg-bolsa:hover { background: rgba(255,255,255,.11); border-color: rgba(255,255,255,.22); transform: translateY(-2px); }
#sec-painel_geral .pg-bolsa:focus-visible { outline: 2px solid #F2C566; outline-offset: 2px; }
#sec-painel_geral .pg-bolsa small { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: rgba(243,241,231,.72); }
#sec-painel_geral .pg-bolsa b { font-size: 22px; font-weight: 800; letter-spacing: -.02em; color: #FFFDF5; }
#sec-painel_geral .pg-bolsa-var { font-size: 13px; font-weight: 700; }
#sec-painel_geral .pg-bolsa-var.sobe { color: #9BE07A; }
#sec-painel_geral .pg-bolsa-var.desce { color: #FFB3A3; }
#sec-painel_geral .pg-bolsa-var.igual { color: rgba(243,241,231,.7); }
#sec-painel_geral .pg-bolsa-cepea { margin-top: 4px; font-size: 12px; color: rgba(243,241,231,.78); }
#sec-painel_geral .pg-bolsa-cepea strong { font-weight: 700; color: #FFFDF5; }
#sec-painel_geral .pg-bolsa-cepea i { font-style: normal; font-weight: 700; }
#sec-painel_geral .pg-bolsa-cepea i.sobe { color: #9BE07A; }
#sec-painel_geral .pg-bolsa-cepea i.desce { color: #FFB3A3; }
#sec-painel_geral .pg-bolsa-cepea i.igual { color: rgba(243,241,231,.7); }
#sec-painel_geral .pg-bolsa em { margin-top: auto; padding-top: 6px; display: inline-flex; align-items: center; gap: 4px; font-style: normal; font-size: 12px; font-weight: 600; color: #F2D88E; opacity: .85; }
#sec-painel_geral .pg-bolsa em .pg-ic { width: 13px; height: 13px; transition: transform .2s; }
#sec-painel_geral .pg-bolsa:hover em .pg-ic { transform: translateX(3px); }

@container pgtela (max-width: 900px) {
  #sec-painel_geral .pg-bolsas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@container pgtela (max-width: 560px) {
  #sec-painel_geral .pg-bolsas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  #sec-painel_geral .pg-fases-passos { gap: 8px; }
  #sec-painel_geral .pg-fase-cab { flex-wrap: wrap; }
  #sec-painel_geral .pg-fase-cab b { font-size: 18px; margin-left: 0; width: 100%; }
  #sec-painel_geral .pg-fases-cult li { grid-template-columns: 9px auto auto minmax(40px, 1fr); }
  #sec-painel_geral .pg-fases-cult em { grid-column: 2 / -1; white-space: normal; }
  #sec-painel_geral .pg-tempo-chuva { grid-template-columns: minmax(0, 1fr); }
}
/* O quadro do Tempo se ajusta à própria largura, não à da tela: com o
   menu lateral aberto num tablet ou num monitor pequeno, a coluna fica
   estreita mesmo com a tela larga. */
#sec-painel_geral .pg-tempo { container-type: inline-size; }
#sec-painel_geral .pg-tempo-sel { flex: 0 1 320px; min-width: 0; }
#sec-painel_geral .pg-tempo-sel select { width: 100%; max-width: 100%; }
#sec-painel_geral .pg-tempo-chuva small { white-space: normal; }
@container pgtela (max-width: 560px) {
  #sec-painel_geral .pg-and-topo { flex-wrap: wrap; row-gap: 2px; }
  #sec-painel_geral .pg-and-sub { flex-basis: 100%; order: 3; }
  #sec-painel_geral .pg-and-topo b { white-space: normal; }
}
@container (max-width: 440px) {
  #sec-painel_geral .pg-tempo-chuva { grid-template-columns: minmax(0, 1fr); }
  #sec-painel_geral .pg-tempo-dias { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #sec-painel_geral .pg-tempo-hoje { grid-template-columns: auto minmax(0, 1fr); }
  #sec-painel_geral .pg-tempo-cond { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  #sec-painel_geral .pg-giro-barra { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  #sec-painel_geral *, #sec-painel_geral *::before, #sec-painel_geral *::after { animation: none !important; transition: none !important; }
}

/* Andamento do ciclo dentro da Operação (js/sections/campo.js),
   mesma régua do Painel Geral em fundo claro. */
#sec-campo .and-linha { padding: 10px 0; border-top: 1px solid #EEF2EB; }
#sec-campo .and-linha:first-of-type { border-top: 0; }
#sec-campo .and-topo { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
#sec-campo .and-topo b { font-size: 14px; }
#sec-campo .and-chip { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 99px; background: #EEF3EA; color: #2D6A3E; }
#sec-campo .and-dest { margin-left: auto; font-size: 13px; font-weight: 700; }
#sec-campo .and-barra { display: flex; gap: 4px; margin-top: 8px; }
#sec-campo .and-seg { position: relative; min-width: 0; padding-bottom: 16px; }
#sec-campo .and-seg::before { content: ''; display: block; height: 7px; border-radius: 99px; background: #E6ECE2; }
#sec-campo .and-seg i { position: absolute; left: 0; top: 0; height: 7px; border-radius: 99px; opacity: .7; }
#sec-campo .and-seg.atual i { opacity: 1; }
#sec-campo .and-seg em { position: absolute; left: 0; right: 0; bottom: 0; font-style: normal; font-size: 11px; color: #8A938C; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#sec-campo .and-seg.atual em { color: #17221B; font-weight: 700; }
#sec-campo .and-seg.feita em { color: #4A5A4F; }