.beta-banner { border-style: solid; border-color: var(--green); }
.beta-banner b { color: var(--green); }
.endpoint-card { padding: 28px; background: var(--surface); border: 1px solid var(--green); box-shadow: var(--shadow); }
.endpoint-card h3 { font: clamp(20px, 3vw, 34px) var(--display); overflow-wrap: anywhere; }
.endpoint-card code { font: 12px var(--mono); color: var(--cyan); overflow-wrap: anywhere; }
.address-lookup { padding: 25px; background: var(--surface); border: 1px solid var(--line); margin-bottom: 22px; }
.address-lookup > div { display: grid; grid-template-columns: 1fr auto; gap: 10px; }
.address-lookup .button { white-space: nowrap; }
.miner-metrics { grid-template-columns: repeat(3, 1fr); }
.worker-list { display: grid; gap: 12px; margin-top: 22px; }
.worker-row { display: grid; grid-template-columns: 1.1fr repeat(5, 1fr); gap: 16px; align-items: center; padding: 20px; background: var(--surface); border: 1px solid var(--line); }
.worker-row > div { display: grid; gap: 6px; }
.worker-row > div:first-child { display: flex; align-items: center; gap: 10px; }
.worker-row small { font: 9px var(--mono); color: var(--muted); text-transform: uppercase; }
.worker-row strong { font-size: 12px; overflow-wrap: anywhere; }

@media (max-width: 980px) {
  .worker-row { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 600px) {
  .address-lookup > div, .miner-metrics, .worker-row { grid-template-columns: 1fr; }
}
