.market-price-monitor {
  border-top: 1px solid var(--line);
}

.market-country-focus { margin-top: 1.1rem; }
.market-country-focus h3 { margin: 0 0 0.25rem; font-size: 1.15rem; }
.market-country-focus > p { margin: 0.25rem 0 0.7rem; color: var(--muted); font-size: 0.78rem; }
.market-focus-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.65rem; }
.market-focus-card { min-width: 0; padding: 0.75rem; border: 1px solid var(--line); border-top: 0.25rem solid #4d7958; border-radius: 0.55rem; background: var(--surface); }
.market-focus-card[data-flow="export"] { border-top-color: #b47b29; }
.market-focus-head { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 0.7rem; font-weight: 750; }
.market-focus-card h4 { min-height: 2.4em; margin: 0.4rem 0 0.25rem; font-size: 0.88rem; line-height: 1.2; }
.market-focus-value { margin: 0; font-size: 1.25rem; font-weight: 800; line-height: 1.2; }
.market-focus-value small { color: var(--muted); font-size: 0.62rem; font-weight: 600; }
.market-focus-monthly { margin: 0.2rem 0 0.3rem; font-size: 0.72rem; }
.market-price-chart { display: block; width: 100%; height: 3.9rem; margin-top: 0.35rem; color: #176d58; }
.market-focus-card[data-direction="up"] .market-price-chart { color: #a23e2b; }
.market-focus-card[data-direction="flat"] .market-price-chart { color: #5f6872; }
.market-price-chart-dates { display: flex; justify-content: space-between; color: var(--muted); font-size: 0.62rem; }
.market-focus-horizons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.25rem; margin: 0.45rem 0; }
.market-focus-horizons > div { display: flex; flex-direction: column; min-width: 0; padding: 0.3rem; background: var(--soft, #f4f3ef); font-size: 0.6rem; }
.market-focus-horizons strong { font-size: 0.7rem; }
.market-focus-meta, .market-focus-proxy { margin: 0.25rem 0 0; color: var(--muted); font-size: 0.63rem; line-height: 1.35; }
.market-focus-trade-source { margin: 0.5rem 0; }
.market-other-prices { margin-top: 1rem; border-top: 1px solid var(--line); }
.market-other-prices > summary { padding: 0.6rem 0; font-weight: 700; cursor: pointer; }

.market-price-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.65rem;
  margin-top: 1rem;
}

.market-price-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 0.75rem;
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  background: var(--surface);
}

.market-price-card[data-market-category="energy"] { border-top: 0.3rem solid #a04431; }
.market-price-card[data-market-category="metals"] { border-top: 0.3rem solid #61788d; }
.market-price-card[data-market-category="food"] { border-top: 0.3rem solid #4d7958; }
.market-price-card[data-market-category="fertilizer"] { border-top: 0.3rem solid #8b6b31; }
.market-price-card[data-market-category="rare-earth"] { border-top: 0.3rem solid #75618b; }
.market-price-card--unavailable { border-style: dashed; }

.market-price-card-head {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  color: var(--muted);
  font-size: 0.67rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.market-direction {
  display: inline-flex;
  align-items: center;
  gap: 0.22rem;
  flex: 0 0 auto;
  padding: 0.12rem 0.35rem;
  border: 1px solid currentColor;
  border-radius: 999px;
  letter-spacing: 0;
  text-transform: none;
}

.market-direction b { font-size: 0.9rem; line-height: 1; }
.market-direction--up { color: #9b432e; background: #fff0e9; }
.market-direction--down { color: #176d58; background: #e8f5f0; }
.market-direction--flat { color: #5f6872; background: #eef1f4; }

.market-price-card h3 {
  min-height: 2.45em;
  margin: 0.45rem 0 0.2rem;
  font-size: 0.9rem;
  line-height: 1.22;
}
.market-price-card .market-price-chart { margin: 0.6rem 0 0.15rem; }
.market-price-card[data-direction="up"] .market-price-chart { color: #a23e2b; }
.market-price-card[data-direction="flat"] .market-price-chart { color: #5f6872; }
.market-price-card .market-price-chart-dates { margin-bottom: 0.35rem; }

.market-price-value-row {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.2rem 0.5rem;
  margin-bottom: 0;
}

.market-price-value {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.market-price-value small {
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 650;
  letter-spacing: 0;
}

.market-price-source {
  margin-top: auto;
  padding-top: 0.35rem;
  font-size: 0.65rem;
  line-height: 1.35;
  color: var(--muted);
}

.market-price-method {
  margin-top: 1rem;
  font-size: 0.82rem;
  color: var(--muted);
}

.market-price-update-warning {
  padding: 0.65rem 0.8rem;
  border-left: 0.3rem solid #b45f06;
  background: #fff0d4;
}

html[data-theme="cyber"] .market-price-card { background: #0c2420; }
html[data-theme="cyber"] .market-focus-card { background: #0c2420; }
html[data-theme="cyber"] .market-focus-horizons > div { background: #0a1d1a; }
html[data-theme="cyber"] .market-price-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
html[data-theme="cyber"] .market-horizons > div { background: #0a1d1a; }
html[data-theme="cyber"] .market-delta--up { color: #ff9b87; }
html[data-theme="cyber"] .market-delta--down { color: #65e0bd; }
html[data-theme="cyber"] .market-delta--flat { color: #b0ccc5; }
html[data-theme="cyber"] .market-direction--up { color: #ffd0c4; background: #4b241d; }
html[data-theme="cyber"] .market-direction--down { color: #b8ffe9; background: #12362f; }
html[data-theme="cyber"] .market-direction--flat { color: #e4eef0; background: #263038; }
html[data-theme="cyber"] .market-price-update-warning { background: #4a300a; color: #ffe0a0; }

@media (max-width: 1180px) {
  .market-focus-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .market-price-grid,
  html[data-theme="cyber"] .market-price-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .market-price-grid,
  html[data-theme="cyber"] .market-price-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .market-focus-grid { grid-template-columns: 1fr; }
  .market-focus-card h4 { min-height: 0; }
  .market-price-grid { grid-template-columns: 1fr; }
  html[data-theme="cyber"] .market-price-grid { grid-template-columns: 1fr; }
  .market-price-card h3 { min-height: 0; }
}
