.pv-cemaden-wrap{
  --pv-primary:#01733a;
  --pv-primary-weak: color-mix(in srgb, var(--pv-primary) 12%, white);
  --pv-border: color-mix(in srgb, var(--pv-primary) 18%, rgba(0,0,0,.12));
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  width:100%;
  border-radius:12px;
  background:#fff;
  box-shadow:0 8px 22px rgba(0,0,0,.08);
  overflow:hidden;
  border:1px solid var(--pv-border);
}

.pv-cemaden-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  border-bottom:1px solid rgba(0,0,0,.06);
  background:linear-gradient(90deg, color-mix(in srgb, var(--pv-primary) 18%, white), #fff);
}
.pv-cemaden-title{
  font-weight:1000;
  font-size:14px;
  letter-spacing:.2px;
  color: color-mix(in srgb, var(--pv-primary) 92%, black);
}

.pv-cemaden-meta{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:12px;
  color: rgba(0,0,0,.65);
  white-space:nowrap;
}

/* Mobile: empilha "Atualizar" em cima e "Atualizado às ..." embaixo */
@media(max-width:640px){
  .pv-cemaden-header{
    align-items:center;
    text-align:center;
  }

  .pv-cemaden-meta{
    flex-direction:column;
    align-items:center;      /* CENTRALIZA */
    gap:6px;
    white-space:normal;
    width:100%;
  }

  .pv-cemaden-refresh{
    margin:0 auto;           /* garante centralização visual */
  }

  .pv-cemaden-updated{
    text-align:center;
    width:100%;
  }
}

.pv-cemaden-refresh{
  border:1px solid color-mix(in srgb, var(--pv-primary) 38%, rgba(0,0,0,.15));
  background:#fff;
  color: color-mix(in srgb, var(--pv-primary) 92%, black);
  border-radius:999px;
  padding:6px 12px;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
  transition: transform .06s ease, background .2s ease, border-color .2s ease, opacity .2s ease;
}
.pv-cemaden-refresh:hover{ background: var(--pv-primary-weak); }
.pv-cemaden-refresh:active{ transform: translateY(1px); }
.pv-cemaden-refresh[disabled]{ opacity:.65; cursor:not-allowed; }

.pv-cemaden-updated{ color: rgba(0,0,0,.62); font-weight:900; }

.pv-cemaden-body{ padding:12px 14px 14px; }
.pv-cemaden-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
@media(max-width:980px){ .pv-cemaden-grid{ grid-template-columns:1fr; } }

.pv-card{
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  padding:12px;
  background: linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,0));
  position:relative;
  overflow:hidden;
}
.pv-card:before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(800px 140px at -10% -20%, var(--pv-primary-weak), transparent 55%);
  pointer-events:none;
}

.pv-cardhead{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
  position:relative;
}
.pv-station{
  font-weight:1000;
  font-size:13px;
  color: rgba(0,0,0,.85);
}

.pv-stack{
  display:flex;
  flex-direction:column;
  gap:10px;
  position:relative;
}

.pv-badge{
  padding:10px 10px;
  border-radius:12px;
  font-size:12px;
  font-weight:1000;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  border: 1px solid rgba(0,0,0,.06);
  background: rgba(0,0,0,.03);
}
.pv-badge .pv-left{
  display:flex;
  align-items:center;
  gap:8px;
}

.pv-dot{
  width:10px;height:10px;border-radius:999px;flex:0 0 auto;
  background: var(--pv-primary);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--pv-primary) 16%, transparent);
}

/* 4 níveis + neutro */
.pv-i-none{ background: rgba(0,0,0,.03); }
.pv-i-none .pv-dot{
  background: rgba(0,0,0,.35);
  box-shadow: 0 0 0 4px rgba(0,0,0,.08);
}
.pv-i-light{ background: color-mix(in srgb, #2ecc71 16%, white); }
.pv-i-light .pv-dot{ background:#2ecc71; box-shadow: 0 0 0 4px rgba(46,204,113,.20); }
.pv-i-mod{ background: color-mix(in srgb, #f1c40f 18%, white); }
.pv-i-mod .pv-dot{ background:#f1c40f; box-shadow: 0 0 0 4px rgba(241,196,15,.22); }
.pv-i-heavy{ background: color-mix(in srgb, #e67e22 18%, white); }
.pv-i-heavy .pv-dot{ background:#e67e22; box-shadow: 0 0 0 4px rgba(230,126,34,.22); }
.pv-i-extreme{ background: color-mix(in srgb, #e74c3c 16%, white); }
.pv-i-extreme .pv-dot{ background:#e74c3c; box-shadow: 0 0 0 4px rgba(231,76,60,.20); }

.pv-err{
  margin-top:10px;
  padding:12px;
  border-radius:14px;
  background: rgba(220,0,0,.08);
  border: 1px solid rgba(220,0,0,.18);
  font-size:12px;
  font-weight:1000;
  color: rgba(120,0,0,.85);
}