[hidden] { display:none !important; }

.rb-oil { color:#111827; }
.rb-oil .rbo-card { width:100%; }
.rb-oil .rbo-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.rb-oil .rbo-title-wrap { display:flex; align-items:center; gap:8px; }
.rb-oil .rbo-title { font-weight:700; font-size:20px; }
.rb-oil .rbo-meta { color:#6b7280; font-size:12px; text-align:right; }
.rb-oil .rbo-ico-btn { background:transparent; border:0; padding:2px; cursor:pointer; color:#6b7280; line-height:0; }
.rb-oil .rbo-ico-btn:hover { color:#111; }
.rb-oil .rbo-ico-btn[disabled] { opacity:.6; cursor:default; }
.rb-oil .rbo-ico-btn .size-6 { width:20px; height:20px; }

.rb-oil .rbo-body { margin-top:10px; }
.rb-oil .rbo-main {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:14px 0 12px;
}
.rb-oil .rbo-main-card {
  border-radius:14px;
  padding:14px 14px 12px;
  background:#f9fafb;
}
.rb-oil .rbo-main-label {
  color:#6b7280;
  font-size:12px;
  margin-bottom:6px;
}
.rb-oil .rbo-main-price {
  font-size:30px;
  font-weight:800;
  letter-spacing:-0.5px;
  line-height:1.1;
}
.rb-oil .rbo-main-sub {
  margin-top:6px;
  color:#6b7280;
  font-size:13px;
}
.rb-oil .rbo-main-sub .up { color:#dc2626; }
.rb-oil .rbo-main-sub .down { color:#2563eb; }

.rb-oil .rbo-grid {
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:10px;
  width:100%;
}
.rb-oil .rbo-grid > div {
  padding:11px 9px;
  border-radius:10px;
  background:#f9fafb;
  text-align:center;
}
.rb-oil .rbo-grid dt {
  color:#6b7280;
  font-size:12px;
  margin-bottom:6px;
}
.rb-oil .rbo-grid dd {
  margin:0;
}
.rb-oil .rbo-grid .rbo-price {
  font-weight:700;
  font-size:15px;
}
.rb-oil .rbo-grid .rbo-local {
  margin-top:4px;
  font-size:12px;
  color:#6b7280;
}
.rb-oil .rbo-grid .up { color:#dc2626; }
.rb-oil .rbo-grid .down { color:#2563eb; }

.rb-oil .rbo-footnote {
  margin-top:10px;
  color:#6b7280;
  font-size:12px;
}

.rb-oil .rbo-status {
  display:flex;
  align-items:center;
  gap:8px;
  color:#6b7280;
}
.rb-oil .rbo-spinner {
  width:14px;
  height:14px;
  border-radius:50%;
  border:2px solid #e5e7eb;
  border-top-color:#111;
  display:inline-block;
  animation:rbo-spin .8s linear infinite;
}
@keyframes rbo-spin { to { transform:rotate(360deg); } }

@keyframes rbo-rotate { to { transform:rotate(360deg); } }
.rb-oil.is-loading .rbo-ico-btn .size-6 {
  animation:rbo-rotate .9s linear infinite;
  transform-origin:50% 50%;
}

@keyframes rbo-shimmer {
  0% { transform:translateX(-100%); }
  100% { transform:translateX(100%); }
}
.rb-oil.is-loading [data-rbo="nationwide-main"],
.rb-oil.is-loading [data-rbo="local-main"],
.rb-oil.is-loading [data-rbo="gasoline"],
.rb-oil.is-loading [data-rbo="diesel"],
.rb-oil.is-loading [data-rbo="premium"],
.rb-oil.is-loading [data-rbo="lpg"],
.rb-oil.is-loading [data-rbo="meta"] {
  color:transparent !important;
  background:#f3f4f6;
  border-radius:8px;
  position:relative;
  overflow:hidden;
}
.rb-oil.is-loading [data-rbo="nationwide-main"],
.rb-oil.is-loading [data-rbo="local-main"] { min-height:34px; }
.rb-oil.is-loading [data-rbo="gasoline"],
.rb-oil.is-loading [data-rbo="diesel"],
.rb-oil.is-loading [data-rbo="premium"],
.rb-oil.is-loading [data-rbo="lpg"] { min-height:34px; }
.rb-oil.is-loading [data-rbo="nationwide-main"]::after,
.rb-oil.is-loading [data-rbo="local-main"]::after,
.rb-oil.is-loading [data-rbo="gasoline"]::after,
.rb-oil.is-loading [data-rbo="diesel"]::after,
.rb-oil.is-loading [data-rbo="premium"]::after,
.rb-oil.is-loading [data-rbo="lpg"]::after,
.rb-oil.is-loading [data-rbo="meta"]::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.7), rgba(255,255,255,0));
  animation:rbo-shimmer 1.2s infinite;
}

@media (max-width: 768px) {
  .rb-oil .rbo-main {
    grid-template-columns:1fr;
  }
  .rb-oil .rbo-grid {
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}