.metal-market {
  --chart-bg: #10110f;
  --chart-text: #f3f1ea;
  --chart-muted: #b2b5ac;
  --chart-line: #373a32;
  --chart-accent: #d5a62e;
  color: var(--chart-text);
  background: var(--chart-bg);
  scroll-margin-top: 24px;
  min-width: 0;
}
.metal-market[data-chart-skin="editorial"] { padding-top: 56px; }
.metal-market[data-chart-skin="institutional"] {
  --chart-bg: #070807;
  --chart-accent: #d8ad3d;
  padding: 64px 4vw 0;
}
.metal-market[data-chart-skin="dubai"] {
  --chart-bg: #fff;
  --chart-text: #10202a;
  --chart-muted: #53636b;
  --chart-line: #ccd6d9;
  --chart-accent: #947019;
  padding: 72px 5vw 0;
}
.metal-market .chart-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 28px;
}
.metal-market .chart-kicker {
  margin: 0 0 12px;
  color: var(--chart-accent);
  font-size: .8125rem;
  letter-spacing: .14em;
  line-height: 1.5;
  text-transform: uppercase;
}
.metal-market .chart-heading h2 {
  font: 500 clamp(2rem, 3.6vw, 3.4rem)/1.1 "Playfair Display", Georgia, serif;
  letter-spacing: -.025em;
  margin: 0;
}
.metal-market[data-chart-skin="institutional"] .chart-heading h2 {
  font-family: "Space Grotesk", sans-serif;
  letter-spacing: -.045em;
}
.metal-market[data-chart-skin="dubai"] .chart-heading h2 { font-family: Marcellus, Georgia, serif; }
.metal-market .chart-description {
  max-width: 370px;
  margin: 0;
  color: var(--chart-muted);
  font-size: 1rem;
  line-height: 1.65;
}
.metal-market .chart-frame {
  min-width: 0;
  border: 1px solid var(--chart-line);
  padding: 20px 16px 12px;
}
.metal-market .chart-viewport { height: 480px; min-width: 0; }
.metal-market .tradingview-widget-container,
.metal-market .tradingview-widget-container__widget { width: 100%; height: 100%; }
.metal-market iframe { max-width: 100%; border: 0; }
.metal-market .chart-status {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0 0 16px;
  color: var(--chart-muted);
  font-size: .875rem;
  line-height: 1.6;
}
.metal-market .chart-status[hidden], .metal-market button[hidden] { display: none; }
.metal-market button {
  font: inherit;
  color: var(--chart-text);
  background: transparent;
  border: 1px solid var(--chart-line);
  padding: 8px 14px;
  min-height: 44px;
  cursor: pointer;
}
.metal-market a { text-decoration: underline; text-underline-offset: 3px; }
.metal-market :is(a, button):focus-visible { outline: 2px solid var(--chart-accent); outline-offset: 4px; }
.metal-market .chart-source {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px 20px;
  margin: 14px 0 0;
  color: var(--chart-muted);
  font-size: .8125rem;
  line-height: 1.7;
}
.metal-market .chart-note { margin: 12px 0 0; color: var(--chart-muted); font-size: .8125rem; line-height: 1.65; }
@media (max-width: 700px) {
  .metal-market .chart-heading { flex-direction: column; align-items: start; gap: 18px; }
  .metal-market .chart-description { max-width: none; }
  .metal-market .chart-frame { padding: 12px 6px; }
  .metal-market .chart-viewport { height: 420px; }
  .metal-market[data-chart-skin="institutional"], .metal-market[data-chart-skin="dubai"] { padding: 48px 20px 0; }
}