.article-warning {
  margin: 38px 0 18px;
  padding: 15px 17px;
  border: 1px solid rgba(229, 72, 74, 0.42);
  border-radius: 7px;
  background: rgba(229, 72, 74, 0.08);
  color: #5c2627;
  font-size: 15px;
  line-height: 1.5;
}

.article-warning strong {
  color: #b52f31;
}

.domain-reference {
  color: #2d3035;
  font-family: var(
    --mono,
    "SF Mono",
    ui-monospace,
    Menlo,
    Consolas,
    monospace
  );
  font-size: 0.9em;
  font-weight: 500;
  text-decoration: none;
}

.redirect-tree {
  margin: 30px 0 38px;
  padding: 20px 22px 22px;
  border: 1px solid #2c3139;
  border-radius: 8px;
  background: #12151a;
  color: #d8dee9;
  font-family: var(
    --mono,
    "SF Mono",
    ui-monospace,
    Menlo,
    Consolas,
    monospace
  );
  font-size: 13px;
  line-height: 1.5;
}

.redirect-tree__title {
  margin-bottom: 13px;
  color: #9199a6;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.redirect-hop {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 9px;
  align-items: baseline;
  min-width: 0;
  padding: 5px 0;
}

.redirect-depth-1 {
  padding-left: 24px;
}

.redirect-depth-2 {
  padding-left: 48px;
}

.redirect-depth-3 {
  padding-left: 72px;
}

.redirect-depth-4 {
  padding-left: 96px;
}

.redirect-depth-5 {
  padding-left: 120px;
}

.redirect-branch {
  color: #626a76;
  user-select: none;
}

.redirect-domain {
  min-width: 0;
  color: #8ecae6;
  overflow-wrap: anywhere;
}

.redirect-hop--handoff .redirect-domain {
  color: #f4c56a;
}

.redirect-hop--danger .redirect-domain {
  color: #ff8587;
}

.redirect-redacted,
.redirect-hop__note {
  color: #858d99;
}

.redirect-hop__note {
  font-size: 11px;
  text-align: right;
  white-space: nowrap;
}

@media (max-width: 680px) {
  .redirect-tree {
    padding: 17px 16px 19px;
    font-size: 12px;
  }

  .redirect-hop {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .redirect-hop__note {
    display: none;
  }

  .redirect-depth-1 {
    padding-left: 12px;
  }

  .redirect-depth-2 {
    padding-left: 24px;
  }

  .redirect-depth-3 {
    padding-left: 36px;
  }

  .redirect-depth-4 {
    padding-left: 48px;
  }

  .redirect-depth-5 {
    padding-left: 60px;
  }
}