.st { padding-bottom: 64px; min-height: calc(100vh - 64px - 120px); }
.top-nav a[aria-current="page"] { color: var(--brand); }
.st-card {
  background: var(--raised); border: 1px solid rgba(0,155,255,.2); border-radius: var(--r);
  padding: 28px; max-width: 860px;
}
.st-main { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.st-sub { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 28px; padding-top: 22px; border-top: 1px solid rgba(143,180,212,.18); }
.st-metric p { margin: 0; }
.st-label { display: flex; align-items: center; gap: 8px; font: 600 13px Montserrat, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: #8fb4d4; }
.st-ico { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: rgba(0,155,255,.18); color: var(--cyan); font-size: 14px; letter-spacing: 0; }
.st-val { font: 700 clamp(40px, 7vw, 64px)/1.1 Montserrat, sans-serif; color: #fff; margin-top: 8px !important; font-variant-numeric: tabular-nums; }
.st-val small { font: 500 16px Poppins, sans-serif; color: #8fa9c1; }
.small .st-val { font-size: 26px; }
.small .st-val small { font-size: 13px; }
.st-ip { font-size: 15px !important; overflow-wrap: anywhere; }
.st-ip code { color: #fff; }
.st-bar { height: 4px; border-radius: 4px; background: rgba(143,180,212,.18); margin-top: 14px; overflow: hidden; }
.st-bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--brand-hi), var(--cyan)); transition: width .2s; }
.st-metric.active .st-val span { color: var(--cyan); }
.st-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 26px; flex-wrap: wrap; }
.st-status { margin: 0; color: #b8cde0; font-size: 14px; }
.st-btn { min-width: 150px; }
.st-btn.stop { background: transparent; color: var(--cyan) !important; box-shadow: inset 0 0 0 1.5px var(--cyan); }
.st-note { margin: 22px 0 0; color: #8fa9c1; font-size: 14px; max-width: 860px; }
.st-note code { color: #cfe6ff; overflow-wrap: anywhere; }
.st-note a { color: var(--cyan); }
@media (max-width: 600px) {
  .st-card { padding: 20px 16px; }
  .st-main { grid-template-columns: 1fr; gap: 20px; }
  .st-sub { grid-template-columns: 1fr 1fr; }
  .st-sub .st-metric:last-child { grid-column: 1 / -1; }
  .st-btn { width: 100%; }
}
