.mtr-hero{border-bottom:1px solid var(--color-hairline);padding:120px 0 56px}
.mtr-hero__eyebrow{font-family:var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--color-ink-3);align-items:center;gap:10px;margin-bottom:24px;font-size:11px;display:flex}
.mtr-hero__eyebrow .dot{background:var(--color-primary);border-radius:50%;width:6px;height:6px;display:inline-block}
.mtr-hero__h1{font-family:var(--font-display);letter-spacing:-.02em;color:var(--color-ink);margin:0 0 18px;font-size:clamp(34px,5vw,52px);font-weight:600;line-height:1.05}
.mtr-hero__sub{color:var(--color-ink-2);max-width:60ch;margin:0;font-size:17px;line-height:1.55}

.mtr-form{margin-top:32px;max-width:720px}
.mtr-form__label{display:block;font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--color-ink-3);margin-bottom:8px}
.mtr-form__row{display:flex;gap:10px;flex-wrap:wrap}
.mtr-form__input{
  flex:1 1 280px;
  min-width:0;
  border:1px solid var(--color-hairline-2);
  background:var(--color-bg);
  border-radius:10px;
  padding:12px 14px;
  font-family:var(--font-mono);
  font-size:14px;
  color:var(--color-ink);
}
.mtr-form__input:focus{outline:2px solid color-mix(in srgb, var(--color-primary) 35%, transparent);outline-offset:1px}
.mtr-form__btn{
  border:0;
  border-radius:10px;
  background:var(--color-primary);
  color:#fff;
  font-family:var(--font-display);
  font-weight:600;
  font-size:14px;
  padding:12px 18px;
  cursor:pointer;
}
.mtr-form__btn:hover:not(:disabled){filter:brightness(.95)}
.mtr-form__btn:disabled{opacity:.65;cursor:default}
.mtr-form__hint{margin:10px 0 0;color:var(--color-ink-3);font-size:13px;line-height:1.45}

.mtr-status{
  margin-top:20px;
  border:1px solid var(--color-hairline-2);
  background:var(--color-bg);
  border-radius:12px;
  padding:16px 18px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:14px;
}
.mtr-status__body{flex:1;min-width:0}
.mtr-status strong{display:block;font-family:var(--font-display);font-size:15px;color:var(--color-ink);margin-bottom:4px}
.mtr-status p{margin:0;color:var(--color-ink-2);font-size:13px;line-height:1.45}
.mtr-status--live{align-items:flex-start}
.mtr-status--ended,
.mtr-status--error{justify-content:space-between;align-items:center}
.mtr-status__pulse{
  width:10px;height:10px;border-radius:50%;
  background:#146720;
  box-shadow:0 0 0 0 #14672066;
  animation:mtr-pulse 1.6s infinite;
  margin-top:5px;flex-shrink:0;
}
@keyframes mtr-pulse{
  0%{box-shadow:0 0 0 0 #14672066}
  70%{box-shadow:0 0 0 10px #14672000}
  100%{box-shadow:0 0 0 0 #14672000}
}
.mtr-status--ended{border-color:#b4231833;background:#fff6f5}
.mtr-status--error{border-color:#b4231833;background:#fff6f5}

.mtr-health{
  margin-top:20px;
  border-radius:12px;
  padding:18px 20px;
  display:flex;
  gap:14px;
  align-items:flex-start;
  border:1px solid transparent;
}
.mtr-health--good{background:#f3fbf5;border-color:#14672033}
.mtr-health--warn{background:#fff8f3;border-color:#c2410c33}
.mtr-health--bad{background:#fff6f5;border-color:#b4231833}
.mtr-health__icon{
  width:36px;height:36px;border-radius:10px;
  display:grid;place-items:center;
  font-weight:700;flex-shrink:0;
}
.mtr-health--good .mtr-health__icon{background:#1467201a;color:#146720}
.mtr-health--warn .mtr-health__icon{background:#c2410c1a;color:#c2410c}
.mtr-health--bad .mtr-health__icon{background:#b423181a;color:#b42318}
.mtr-health__title{margin:0 0 4px;font-family:var(--font-display);font-size:18px;font-weight:600;color:var(--color-ink)}
.mtr-health__desc{margin:0;color:var(--color-ink-2);font-size:14px;line-height:1.5}

.mtr-metrics{
  margin-top:18px;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
@media(max-width:900px){.mtr-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.mtr-metrics{grid-template-columns:1fr}}
.mtr-metric{
  border:1px solid var(--color-hairline-2);
  background:var(--color-bg);
  border-radius:12px;
  padding:16px;
}
.mtr-metric__label{margin:0;font-size:12px;color:var(--color-ink-3);font-family:var(--font-mono);letter-spacing:.03em;text-transform:uppercase}
.mtr-metric__value{margin:10px 0 6px;font-family:var(--font-display);font-size:28px;font-weight:600;color:var(--color-ink);letter-spacing:-.02em}
.mtr-metric__sub{margin:0;font-size:13px;color:var(--color-ink-2);line-height:1.4}

.mtr-sec{border-bottom:1px solid var(--color-hairline);padding:56px 0}
.mtr-sec--alt{background:var(--color-bg-2)}
.mtr-table-wrap{overflow:auto;border:1px solid var(--color-hairline-2);border-radius:12px;background:var(--color-bg)}
.mtr-table{width:100%;border-collapse:collapse;min-width:860px;font-family:var(--font-mono);font-size:13px}
.mtr-table th{
  text-align:left;
  padding:12px 14px;
  border-bottom:1px solid var(--color-hairline);
  color:var(--color-ink-3);
  font-weight:500;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size:10px;
  white-space:nowrap;
}
.mtr-table td{padding:12px 14px;border-bottom:1px solid var(--color-hairline);color:var(--color-ink-2);vertical-align:middle}
.mtr-table tr:last-child td{border-bottom:0}
.mtr-table__num{color:var(--color-ink-3);width:48px}
.mtr-table__host{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.mtr-table__host > span:first-child{color:var(--color-ink);font-weight:500}
.mtr-edge{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:3px 8px;
  background:color-mix(in srgb, var(--color-primary) 12%, transparent);
  color:var(--color-primary);
  font-size:10px;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-weight:600;
}
.mtr-edge--dest{
  background:color-mix(in srgb, #146720 12%, transparent);
  color:#146720;
}
.mtr-table__note{margin:12px 0 0;color:var(--color-ink-3);font-size:12px}

.mtr-loss{display:inline-flex;align-items:center;gap:8px;min-width:110px}
.mtr-loss__bar{width:56px;height:6px;border-radius:999px;background:#0a0a0b12;overflow:hidden;display:inline-block}
.mtr-loss__bar > span{display:block;height:100%;border-radius:inherit}
.mtr-loss--good .mtr-loss__bar > span{background:#146720}
.mtr-loss--warn .mtr-loss__bar > span{background:#c2410c}
.mtr-loss--bad .mtr-loss__bar > span{background:#b42318}
.mtr-loss__value{font-variant-numeric:tabular-nums}

.mtr-guide__head{max-width:720px;margin-bottom:28px}
.mtr-guide__title{font-family:var(--font-display);letter-spacing:-.02em;color:var(--color-ink);margin:0;font-size:clamp(24px,3vw,34px);font-weight:600;line-height:1.1}
.mtr-guide__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media(max-width:720px){.mtr-guide__grid{grid-template-columns:1fr}}
.mtr-guide__item{
  border:1px solid var(--color-hairline-2);
  background:var(--color-bg);
  border-radius:12px;
  padding:20px;
}
.mtr-guide__item h3{margin:0 0 8px;font-family:var(--font-display);font-size:16px;font-weight:600;color:var(--color-ink)}
.mtr-guide__item p{margin:0;color:var(--color-ink-2);font-size:14px;line-height:1.55}
