.market {padding:clamp(43px,5vw,72px) 0;border-bottom:1px solid #35412d35}
.market-heading,.plot-heading,.market-foot,.chart-foot {display:flex;justify-content:space-between;align-items:center;gap:18px}
.market-heading {margin:18px 0 25px}
.market-heading h2 {font-size:clamp(43px,5.2vw,76px)}
#market-refresh,.interval-select button {font:500 11px/1.4 var(--mono);border:1px solid #495342;padding:9px 13px}
#market-refresh {display:inline-flex;align-items:center;gap:8px;background:transparent;color:var(--ink)}
#market-refresh span {font:500 18px/1 Arial,sans-serif}
#market-refresh:hover {background:#dddcca}
#market-refresh:disabled {opacity:.65;cursor:wait}
.market-metrics {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid #777b65;background:#e7e6d4}
.market-metric {min-width:0;padding:clamp(15px,1.5vw,26px);border-right:1px solid #8d947d}
.market-metric:last-child {border:0}
.market-metric h3 {margin:0 0 6px;font:500 11px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.market-metric strong {font:700 clamp(29px,3.4vw,50px)/1.1 var(--condensed);display:block;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.market-metric strong.unit-value {font-size:clamp(24px,2.8vw,42px)}
.market-metric strong.unavailable {font-size:clamp(20px,1.9vw,28px)}
.market-metric p,.market-metric small,.market-foot,.chart-foot {font:400 10px/1.55 var(--mono)}
.market-metric p {margin-top:6px;color:#454c3d}
.market-metric small {display:block;color:#535b4b;font-size:9px;min-height:1.55em;margin-top:3px}
.reward-metric {background:#f0dbbd}
.market-plot {margin-top:17px;padding:clamp(14px,2vw,30px);background:#20271d;color:var(--cream);border:1px solid #384231;color-scheme:dark}
.plot-heading h3 {margin:0 0 3px;font:500 13px/1.5 var(--mono);letter-spacing:.03em}
.plot-heading h3 span {color:#bac4ad}
#market-price {font:700 clamp(25px,2.4vw,38px)/1.13 var(--condensed);font-variant-numeric:tabular-nums}
.interval-select {display:flex}
.interval-select button {background:transparent;color:#d9dfd0;border-color:#68735d;min-width:40px;border-right:0}
.interval-select button:last-child {border-right:1px solid #68735d}
.interval-select button[aria-pressed="true"] {background:var(--orange);color:var(--ink)}
.interval-select button:hover {box-shadow:inset 0 0 0 1px var(--cream)}
#market-chart {margin-top:14px;min-width:0}
.chart-empty {display:grid;min-height:200px;place-content:center;text-align:center;color:#c1c8b8;font:400 13px/1.55 var(--mono)}
.chart-foot {border-top:1px solid #59604e;margin-top:12px;padding-top:10px;color:#cbd1bf;flex-wrap:wrap}
.market-foot {margin-top:12px;flex-wrap:wrap;color:#38432f}
.market-foot span:last-child {display:inline-flex;gap:16px}
.market-foot a,.chart-foot a {font-weight:500;text-decoration:underline;text-underline-offset:3px}
.market-foot a:hover {color:#843c20}.chart-foot a:hover {color:var(--orange)}
.reward-proof {color:#414c37;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
.rewards-market-link {color:var(--cream);text-decoration:underline;text-underline-offset:3px}
@media(max-width:800px){
  .market-metrics {grid-template-columns:repeat(2,minmax(0,1fr))}
  .market-metric:nth-child(2) {border-right:0}
  .market-metric:nth-child(-n+2) {border-bottom:1px solid #8d947d}
}
@media(max-width:430px){
  .market-metric {padding:12px}.market-metric h3 {font-size:10px}
  .market-heading,.plot-heading,.market-foot {gap:9px}
  .market-heading {margin:14px 0 20px}
  .market-heading h2 {font-size:clamp(29px,8.9vw,38px)}
  #market-refresh {padding:7px 9px;font-size:10px}
  .interval-select button {min-width:32px;padding:6px 7px;font-size:10px}
  .market-metric p,.chart-foot,.market-foot {font-size:9px}
}