@font-face {
  font-family: "Montserrat";
  src: url("/assets/fonts/montserrat-latin-variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
}

:root {
  --ink: #eafcff;
  --muted: #92a8c7;
  --navy: #020716;
  --line: rgba(83, 221, 255, 0.22);
  --cyan: #58e8ff;
  --violet: #8b5cff;
  --pink: #ed3caa;
  --green: #47efb0;
  --font-display: "Montserrat", "Avenir Next", "Century Gothic", sans-serif;
  --font-mono: "Cascadia Mono", "SFMono-Regular", Consolas, monospace;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--navy); }

body {
  min-height: 100vh;
  margin: 0;
  color: var(--ink);
  background:
    linear-gradient(180deg, rgba(1, 5, 18, 0.2), rgba(1, 5, 18, 0.88)),
    url("/brand/togethia-background.png") center top / cover fixed,
    var(--navy);
  font-family: var(--font-display);
}

a { color: inherit; text-decoration: none; }
button { font: inherit; }
button:disabled { cursor: not-allowed; opacity: .55; }

.site-shell {
  position: relative;
  isolation: isolate;
  width: min(1180px, calc(100% - 32px));
  min-height: 100vh;
  margin: 0 auto;
  padding: 24px 0 28px;
}

.ambient-grid {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 15%, rgba(139, 92, 255, 0.16), transparent 27rem),
    radial-gradient(circle at 83% 22%, rgba(0, 188, 231, 0.14), transparent 29rem),
    linear-gradient(rgba(71, 203, 255, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(71, 203, 255, 0.025) 1px, transparent 1px);
  background-size: auto, auto, 48px 48px, 48px 48px;
}

.site-header {
  display: grid;
  grid-template-columns: 215px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px 14px;
  padding: 10px 12px;
  border: 1px solid rgba(74, 222, 255, 0.24);
  border-radius: 24px;
  background: rgba(1, 7, 24, 0.76);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.32), inset 0 1px rgba(255, 255, 255, 0.04);
  backdrop-filter: blur(18px);
}

.site-header::before {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  width: min(100%, 500px);
  min-width: 0;
  min-height: 56px;
  align-items: center;
  justify-content: center;
  justify-self: center;
  padding: 10px 22px;
  border-inline: 1px solid rgba(83, 221, 255, .15);
  color: rgba(141, 232, 247, .72);
  background:
    radial-gradient(circle at 8% 50%, rgba(82, 231, 255, .75) 0 2px, transparent 3px),
    radial-gradient(circle at 92% 50%, rgba(176, 82, 255, .72) 0 2px, transparent 3px),
    linear-gradient(90deg, transparent, rgba(69, 214, 255, .13) 25%, rgba(143, 83, 255, .13) 75%, transparent),
    repeating-linear-gradient(90deg, transparent 0 31px, rgba(75, 194, 239, .1) 32px, transparent 33px);
  font: 760 .58rem/1.4 var(--font-mono);
  letter-spacing: .16em;
  text-align: center;
  text-shadow: 0 0 18px rgba(82, 231, 255, .36);
  content: "MAIL  •  DNS  •  TLS  •  REPUTATION";
}

.brand-panel {
  display: block;
  grid-column: 1;
  grid-row: 1;
  flex: 0 0 215px;
  width: 215px;
  height: 74px;
  overflow: hidden;
  border-radius: 16px;
  background: #02091a;
}

.brand-panel img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.tool-nav {
  display: flex;
  grid-column: 1 / -1;
  grid-row: 2;
  min-width: 0;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 3px 5px;
  overflow: visible;
  padding: 7px 6px 2px;
  border-top: 1px solid rgba(83, 221, 255, .12);
  scrollbar-width: none;
}
.tool-nav::-webkit-scrollbar { display: none; }

.tool-nav a,
.tool-nav span {
  flex: none;
  padding: 10px 8px;
  border: 1px solid transparent;
  border-radius: 999px;
  color: #8fa7c8;
  font-size: 0.8rem;
  font-weight: 650;
}
.tool-nav a:hover { color: var(--ink); border-color: var(--line); }
.tool-nav a.active {
  color: #06101c;
  background: linear-gradient(135deg, #9cf4ff, #41d9f6);
  box-shadow: 0 0 24px rgba(69, 226, 255, 0.25);
}
.tool-nav span { opacity: 0.52; }

.togethia-visit-pill {
  display: flex;
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  align-items: center;
  gap: 9px;
  min-height: 48px;
  padding: 5px 13px 5px 7px;
  border: 1px solid rgba(255, 95, 166, .5);
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, rgba(28, 20, 83, .96), rgba(4, 28, 63, .96));
  box-shadow: 0 0 24px rgba(226, 61, 180, .13), inset 0 1px rgba(255, 255, 255, .08);
  font-size: .7rem;
  font-weight: 800;
  white-space: nowrap;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.togethia-visit-pill:hover { transform: translateY(-2px); border-color: #ff70bc; box-shadow: 0 9px 28px rgba(226, 61, 180, .2); }
.togethia-visit-pill img { width: 70px; height: 38px; border-radius: 999px; object-fit: cover; }

.captcha-panel {
  display: grid;
  grid-template-columns: minmax(190px, 1fr) auto;
  align-items: center;
  gap: 14px 24px;
  margin: 18px 0;
  padding: 16px 18px;
  border: 1px solid rgba(82, 231, 255, .55);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(16, 46, 81, .94), rgba(18, 28, 65, .94));
  box-shadow: 0 0 26px rgba(82, 231, 255, .09), inset 0 1px rgba(255, 255, 255, .06);
}
.captcha-copy { display: grid; gap: 3px; }
.captcha-copy strong { color: #f2f8ff; font-size: .96rem; }
.captcha-copy small { color: #9ab3d2; font-size: .78rem; }
.captcha-kicker { color: #52e7ff; font-size: .64rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.captcha-equation { display: flex; align-items: center; gap: 9px; }
.captcha-equation > span { min-width: 78px; color: #effaff; font-family: "Courier New", monospace; font-size: 1.12rem; font-weight: 800; white-space: nowrap; }
.captcha-equation input {
  width: 82px;
  height: 44px;
  border: 1px solid rgba(82, 231, 255, .62);
  border-radius: 12px;
  color: #fff;
  background: rgba(4, 14, 35, .86);
  font: 800 1.08rem/1 "Courier New", monospace;
  text-align: center;
  outline: none;
}
.captcha-equation input:focus { border-color: #52e7ff; box-shadow: 0 0 0 3px rgba(82, 231, 255, .15); }
.captcha-equation button { width: 42px; height: 42px; padding: 0; border: 1px solid rgba(178, 103, 255, .55); border-radius: 999px; color: #dcbaff; background: rgba(86, 42, 132, .28); font-size: 1.2rem; }
.captcha-difficulty-options { display: grid; grid-column: 1 / -1; gap: 8px; }
.captcha-professional, .captcha-god { display: flex; align-items: center; gap: 9px; width: fit-content; color: #a8bdd6; cursor: pointer; font: 500 .72rem/1.35 var(--font-display); }
.captcha-professional input, .captcha-god input { flex: 0 0 17px; width: 17px; min-width: 17px; height: 17px; margin: 0; accent-color: #b267ff; cursor: pointer; }
.captcha-professional > span, .captcha-god > span { color: #a8bdd6; font: inherit; }
.captcha-professional strong, .captcha-god strong { color: #dcc7ff; font: inherit; font-weight: 800; }
.captcha-professional.is-revoked { position: relative; z-index: 2; user-select: none; transition: transform .16s ease-out; }
.captcha-professional.is-revoked input { pointer-events: none; filter: grayscale(1); opacity: .55; }
.captcha-professional.is-revoked span { color: #ffb0c4; }
.captcha-professional.is-revoked strong { color: #ff8baa; text-decoration: line-through; }
.captcha-god.is-revoked { cursor: not-allowed; opacity: .7; }
.captcha-god.is-revoked strong { color: #ff8baa; text-decoration: line-through; }
.captcha-panel.is-professional { border-color: rgba(178, 103, 255, .7); background: linear-gradient(135deg, rgba(38, 32, 91, .96), rgba(18, 28, 65, .94)); box-shadow: 0 0 30px rgba(178, 103, 255, .13), inset 0 1px rgba(255, 255, 255, .06); }
.captcha-panel.is-professional .captcha-kicker, .captcha-panel.is-professional .captcha-equation > span { color: #dcc7ff; }
.captcha-panel.is-professional .captcha-equation > span { min-width: 245px; }
.captcha-panel.is-god { grid-template-columns: minmax(205px, .75fr) minmax(0, 1.25fr); border-color: rgba(255, 204, 82, .78); background: linear-gradient(135deg, rgba(73, 42, 13, .97), rgba(44, 22, 73, .96)); box-shadow: 0 0 34px rgba(255, 199, 74, .15), inset 0 1px rgba(255, 255, 255, .08); }
.captcha-panel.is-god .captcha-kicker, .captcha-panel.is-god .captcha-equation > span { color: #ffe18a; }
.captcha-panel.is-god .captcha-equation { min-width: 0; justify-content: flex-end; }
.captcha-panel.is-god .captcha-equation > span { min-width: 0; max-width: 470px; white-space: normal; overflow-wrap: anywhere; text-align: right; line-height: 1.35; }
.captcha-panel.is-god .captcha-equation input { width: 164px; border-color: rgba(255, 213, 104, .72); font-size: 1rem; letter-spacing: .025em; }
.captcha-panel.is-god .captcha-equation input:focus { border-color: #ffe18a; box-shadow: 0 0 0 3px rgba(255, 213, 104, .16); }
.captcha-panel.god-revoked { border-color: rgba(255, 112, 152, .62); box-shadow: 0 0 26px rgba(255, 93, 139, .1), inset 0 1px rgba(255, 255, 255, .06); }
.captcha-panel.professional-revoked { border-color: rgba(255, 112, 152, .62); box-shadow: 0 0 26px rgba(255, 93, 139, .1), inset 0 1px rgba(255, 255, 255, .06); }
.captcha-panel.professional-revoked .captcha-kicker { color: #ff8baa; }
.captcha-status { grid-column: 1 / -1; min-height: 1em; margin: -6px 0 0; color: #9ab3d2; font-size: .76rem; }
.captcha-status:empty { display: none; }
.captcha-status[data-state="error"] { color: #ff8baa; }
.captcha-status[data-state="revoked"] { color: #ffb0c4; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

main { padding: 52px 6px 68px; }

.section-kicker {
  margin: 0 0 12px;
  color: var(--cyan);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.home-hero {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 14px;
  margin-bottom: 14px;
}
.home-hero-copy {
  grid-column: span 2;
  align-self: center;
  padding: 12px 34px 12px 0;
}
.home-hero .anti-spam-challenge-tile { grid-column: 3; }
.home-hero h1,
.mailcheck-heading h1 {
  margin: 0;
  font-size: clamp(2rem, 3.8vw, 3.75rem);
  font-weight: 740;
  letter-spacing: -0.045em;
  line-height: 1.02;
  text-wrap: balance;
}
.hero-copy,
.mailcheck-heading p:not(.section-kicker) {
  max-width: 710px;
  margin: 18px 0 0;
  color: #a9bdd9;
  font-size: clamp(.96rem, 1.6vw, 1.12rem);
  line-height: 1.6;
}

.tool-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.tool-card {
  position: relative;
  display: flex;
  min-height: 260px;
  flex-direction: column;
  overflow: hidden;
  padding: 24px;
  border: 1px solid rgba(104, 175, 255, 0.15);
  border-radius: 24px;
  background: linear-gradient(150deg, rgba(9, 22, 54, 0.92), rgba(2, 9, 28, 0.88));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.035);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.tool-card.is-ready { border-color: rgba(78, 228, 255, 0.38); }
.tool-card.is-ready:hover {
  transform: translateY(-4px);
  border-color: rgba(111, 239, 255, 0.7);
  box-shadow: 0 24px 70px rgba(0, 184, 230, 0.15), inset 0 1px rgba(255, 255, 255, 0.06);
}
.tool-card[class*="accent-"] { border-color: rgba(var(--tile-accent), .72); box-shadow: 0 0 24px rgba(var(--tile-accent), .12), inset 0 1px rgba(255, 255, 255, .04); }
.tool-card[class*="accent-"]:hover { border-color: rgb(var(--tile-accent)); box-shadow: 0 22px 62px rgba(var(--tile-accent), .2), inset 0 1px rgba(255, 255, 255, .07); }
.tool-card[class*="accent-"] .tool-eyebrow { color: rgb(var(--tile-accent)); }
.tool-card[class*="accent-"] .mailcheck-tile-visual { border-bottom-color: rgba(var(--tile-accent), .45); }
.accent-mailcheck { --tile-accent: 82, 231, 255; }
.accent-dns { --tile-accent: 158, 103, 255; }
.accent-tls { --tile-accent: 52, 135, 255; }
.accent-blacklist { --tile-accent: 255, 79, 132; }
.accent-whois { --tile-accent: 72, 238, 176; }
.accent-diagnostics { --tile-accent: 255, 208, 106; }
.accent-network { --tile-accent: 255, 178, 75; }
.tool-orb {
  position: absolute;
  top: -46px;
  right: -42px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  filter: blur(34px);
  opacity: 0.24;
}
.tool-orb.cyan { background: var(--cyan); }
.tool-orb.violet { background: var(--violet); }
.tool-orb.blue { background: #2885ff; }
.tool-orb.pink { background: var(--pink); }
.tool-eyebrow { color: var(--cyan); font-size: .76rem; font-weight: 780; text-transform: uppercase; letter-spacing: .12em; }
.tool-card strong { margin-top: 24px; font-size: 1.55rem; }
.tool-description { margin-top: 11px; color: var(--muted); line-height: 1.55; }
.tool-state { display: flex; justify-content: space-between; margin-top: auto; padding-top: 28px; color: #d6f9ff; font-size: .87rem; font-weight: 700; }
.tool-card:not(.is-ready) .tool-state { color: #697c9b; }

.mailcheck-tile {
  grid-column: auto;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 140px minmax(150px, 1fr);
  min-height: 290px;
  padding: 0;
}
.mailcheck-tile-visual {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border-bottom: 1px solid rgba(83, 226, 255, .2);
  background: #02071a;
}
.mailcheck-tile-visual::after {
  position: absolute;
  inset: 0;
  border: 1px solid rgba(120, 232, 255, .08);
  content: "";
  pointer-events: none;
}
.mailcheck-tile-visual img,
.mailcheck-hover-video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  transition: opacity .22s ease;
}
.mailcheck-hover-video { opacity: 0; background: #02071a; }
.mailcheck-tile:not(.header-analyser-tile):not(.password-tile) .mailcheck-hover-video {
  transform: scaleX(1.08);
}
.mailcheck-tile.is-animating .mailcheck-hover-video { opacity: 1; }
.mailcheck-tile.is-animating .mailcheck-tile-visual img { opacity: 0; }
.mailcheck-tile-copy {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 17px 20px;
  background: linear-gradient(155deg, rgba(8, 24, 58, .96), rgba(3, 8, 26, .96));
}
.mailcheck-tile-copy .tool-eyebrow { font-size: .66rem; }
.mailcheck-tile-copy > strong { margin-top: 8px; font-size: 1.28rem; }
.mailcheck-tile-copy .tool-description { margin-top: 6px; font-size: .78rem; line-height: 1.4; }
.mailcheck-tile-copy .tool-state { padding-top: 11px; font-size: .74rem; }

.mailcheck-visual-hero {
  position: relative;
  overflow: hidden;
  max-width: 880px;
  margin: -10px auto 32px;
  border: 1px solid rgba(94, 226, 255, .38);
  border-radius: 25px;
  background: #02071a;
  box-shadow: 0 35px 110px rgba(0, 0, 0, .42), 0 0 75px rgba(88, 63, 255, .13), inset 0 1px rgba(255, 255, 255, .08);
}
.mailcheck-visual-hero::after {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 55px rgba(30, 109, 255, .08);
  content: "";
  pointer-events: none;
}
.mailcheck-visual-hero > img,
.tool-hero-video {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1731 / 900;
  object-fit: contain;
  transition: opacity .24s ease;
}
.tool-hero-video { position: absolute; inset: 0; height: 100%; opacity: 0; background: #02071a; }
.mailcheck-visual-hero.is-playing > img { opacity: 0; }
.mailcheck-visual-hero.is-playing > .tool-hero-video { opacity: 1; }
.tls-visual-hero img { aspect-ratio: 1730 / 909; }

.tool-intro-row {
  display: grid;
  grid-template-columns: minmax(260px, .4fr) minmax(0, .6fr);
  align-items: stretch;
  gap: 22px;
  margin: -10px 0 28px;
}
.tool-intro-row > .mailcheck-visual-hero { width: 100%; max-width: none; min-height: 0; margin: 0; }
.tool-intro-row > .mailcheck-visual-hero img,
.tool-intro-row > .mailcheck-visual-hero .tool-hero-video { width: 100%; height: 100%; aspect-ratio: auto; object-fit: contain; }
.tool-intro-row > section { min-width: 0; height: 100%; margin: 0; }
.tool-intro-row .mailcheck-heading {
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  padding: 28px 30px;
  border: 1px solid rgba(83, 226, 255, .42);
  border-radius: 25px;
  background: linear-gradient(145deg, rgba(19, 49, 88, .97), rgba(8, 22, 50, .97));
  box-shadow: 0 22px 65px rgba(0, 0, 0, .28);
}
.tool-intro-row .dns-mx-hero,
.tool-intro-row .tls-inspector-hero { grid-template-columns: 1fr; align-content: center; align-items: start; gap: 16px; }
.tool-intro-row .tls-inspector-hero h1 { font-size: clamp(1.7rem, 2.8vw, 2.55rem); }

.mailcheck-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 22px;
  margin-bottom: 30px;
}
.mailcheck-heading > div:first-child { max-width: 860px; }
.mailcheck-heading h1 { font-size: clamp(1.95rem, 3.3vw, 3.05rem); }
.privacy-badge,
.queued-count {
  flex: none;
  padding: 11px 15px;
  border: 1px solid rgba(71, 239, 176, 0.28);
  border-radius: 999px;
  color: #b9ffe0;
  background: rgba(4, 49, 43, 0.42);
  font-size: .82rem;
  font-weight: 700;
}
.privacy-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 8px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 12px var(--green);
}

.test-console {
  overflow: hidden;
  border: 1px solid rgba(91, 232, 255, 0.62);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(18, 42, 79, 0.98), rgba(9, 24, 54, 0.97));
  box-shadow: 0 34px 100px rgba(0, 0, 0, 0.36), 0 0 70px rgba(26, 187, 226, 0.14), inset 0 1px 0 rgba(180, 247, 255, .06);
}
.console-topline {
  display: flex;
  justify-content: space-between;
  padding: 16px 24px;
  border-bottom: 1px solid rgba(83, 226, 255, .28);
  color: #b9d0ed;
  background: rgba(18, 44, 82, .72);
  font-size: .79rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.live-indicator {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 9px;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 14px var(--cyan);
}
.address-block { padding: 29px 30px 24px; background: linear-gradient(135deg, rgba(23, 50, 91, .74), rgba(13, 33, 68, .74)); }
.address-block > p:first-child { margin: 0 0 13px; color: #d0e3fa; font-size: .9rem; font-weight: 650; }
.address-row { display: flex; gap: 12px; }
.address-row code {
  min-width: 0;
  flex: 1;
  overflow-x: auto;
  padding: 16px 18px;
  border: 1px solid rgba(83, 226, 255, 0.56);
  border-radius: 15px;
  color: #d0faff;
  background: rgba(11, 31, 61, 0.94);
  box-shadow: inset 0 0 28px rgba(67, 207, 240, .045), 0 0 24px rgba(49, 199, 232, .055);
  font-family: var(--font-mono);
  font-size: clamp(.86rem, 1.8vw, 1.1rem);
  white-space: nowrap;
}
.copy-button,
.primary-button {
  border: 0;
  border-radius: 14px;
  cursor: pointer;
  font-weight: 800;
}
.copy-button { padding: 0 22px; color: #06121b; background: linear-gradient(135deg, #a3f4ff, #38d9f3); }
.copy-button:hover,
.primary-button:hover { filter: brightness(1.08); }
.address-help { margin: 14px 0 0; color: #9eb5d2; font-size: .85rem; }
.delivery-option { position: relative; display: inline-flex; align-items: center; gap: 12px; margin-top: 19px; padding: 12px 14px; border: 1px solid rgba(83, 226, 255, .32); border-radius: 14px; background: rgba(18, 42, 76, .82); box-shadow: inset 0 1px 0 rgba(190, 245, 255, .035); cursor: pointer; }
.delivery-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.delivery-switch { position: relative; flex: 0 0 auto; width: 40px; height: 22px; border: 1px solid rgba(143, 184, 226, .58); border-radius: 999px; background: #183052; transition: .2s ease; }
.delivery-switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: #8faaca; transition: .2s ease; }
.delivery-option input:checked + .delivery-switch { border-color: var(--cyan); background: rgba(35, 168, 205, .28); box-shadow: 0 0 18px rgba(83, 226, 255, .14); }
.delivery-option input:checked + .delivery-switch::after { transform: translateX(18px); background: var(--cyan); }
.delivery-option input:focus-visible + .delivery-switch { outline: 2px solid white; outline-offset: 3px; }
.delivery-option > span:last-child { display: grid; gap: 3px; }
.delivery-option strong { color: #e0edfb; font-size: .76rem; }
.delivery-option small { color: #8fa8c7; font-size: .66rem; }

.progress-rail {
  display: grid;
  grid-template-columns: auto 1fr auto 1fr auto;
  align-items: center;
  gap: 16px;
  padding: 20px 30px;
  border-block: 1px solid rgba(83, 226, 255, 0.34);
  background: linear-gradient(90deg, rgba(14, 35, 68, .94), rgba(20, 47, 84, .9), rgba(14, 35, 68, .94));
  box-shadow: inset 0 1px 0 rgba(185, 241, 255, .035), inset 0 -1px 0 rgba(9, 17, 37, .38);
}
.progress-step { display: flex; align-items: center; gap: 11px; color: #91a9c7; }
.progress-step > span {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid #6382aa;
  border-radius: 50%;
  color: #bed2e8;
  background: #163253;
  box-shadow: inset 0 0 14px rgba(91, 184, 228, .09);
  font: 700 .76rem var(--font-mono);
}
.progress-step strong,
.progress-step small { display: block; white-space: nowrap; }
.progress-step strong { color: #a9bfd9; font-size: .82rem; }
.progress-step small { margin-top: 3px; color: #7f98b8; font-size: .71rem; }
.progress-step.complete > span { color: #041811; border-color: var(--green); background: var(--green); }
.progress-step.active > span { color: #04141b; border-color: var(--cyan); background: var(--cyan); box-shadow: 0 0 20px rgba(83, 232, 255, .28); }
.progress-step.complete strong,
.progress-step.active strong { color: #e2fbff; }
.progress-step.active small { color: var(--cyan); }
.progress-line { height: 2px; border-radius: 999px; background: linear-gradient(90deg, #385475, #54759a); box-shadow: 0 0 8px rgba(74, 145, 190, .11); }
.progress-line.active { background: linear-gradient(90deg, var(--green), var(--cyan)); box-shadow: 0 0 12px rgba(83, 232, 255, .22); }

.console-actions { display: flex; align-items: center; gap: 18px; padding: 20px 30px; background: rgba(10, 27, 58, .64); }
.primary-button { padding: 14px 19px; color: #eefcff; background: linear-gradient(135deg, #5745e9, #ab3cdb); box-shadow: 0 12px 32px rgba(102, 52, 222, .22); }
.console-actions p { margin: 0; color: #9bb2cf; font-size: .8rem; }

.delivery-outlook { margin-top: 32px; padding: 25px 27px; border: 1px solid rgba(255, 208, 106, .42); border-radius: 22px; background: linear-gradient(145deg, rgba(10, 27, 57, .98), rgba(8, 20, 45, .98)); box-shadow: 0 18px 48px rgba(0, 0, 0, .2); }
.delivery-outlook[hidden] { display: none; }
.delivery-outlook[data-state="high"] { border-color: rgba(72, 238, 176, .6); box-shadow: 0 18px 48px rgba(0, 0, 0, .2), inset 0 0 36px rgba(72, 238, 176, .035); }
.delivery-outlook[data-state="low"] { border-color: rgba(255, 102, 141, .66); box-shadow: 0 18px 48px rgba(0, 0, 0, .2), inset 0 0 36px rgba(255, 102, 141, .045); }
.delivery-outlook-header { display: flex; align-items: center; justify-content: space-between; gap: 26px; }
.delivery-outlook-header h2 { margin: 0; font-size: clamp(1.35rem, 2.4vw, 1.9rem); }
.delivery-outlook-header p:not(.section-kicker) { max-width: 720px; margin: 7px 0 0; color: #91a9c7; font-size: .82rem; }
.outlook-likelihood { flex: 0 0 auto; min-width: 142px; padding: 13px 16px; border: 1px solid rgba(255, 208, 106, .46); border-radius: 16px; background: rgba(84, 59, 12, .28); text-align: right; }
.outlook-likelihood span { display: block; color: #8ca1bc; font-size: .58rem; font-weight: 780; letter-spacing: .07em; text-transform: uppercase; }
.outlook-likelihood strong { display: block; margin-top: 5px; color: #ffe08b; font-size: 1.16rem; }
.outlook-likelihood[data-state="high"] { border-color: rgba(72, 238, 176, .52); background: rgba(20, 111, 79, .2); }
.outlook-likelihood[data-state="high"] strong { color: #79ffc8; }
.outlook-likelihood[data-state="low"] { border-color: rgba(255, 102, 141, .58); background: rgba(113, 20, 50, .24); }
.outlook-likelihood[data-state="low"] strong { color: #ff9db6; }
.outlook-signals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-top: 20px; }
.outlook-signal { min-width: 0; padding: 12px 14px; border: 1px solid rgba(105, 167, 210, .22); border-radius: 13px; background: rgba(3, 12, 31, .58); }
.outlook-signal span { display: block; color: #65819f; font-size: .58rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.outlook-signal strong { display: block; margin-top: 6px; color: #bcd2e8; font-size: .78rem; overflow-wrap: anywhere; }
.outlook-signal.state-pass { border-color: rgba(72, 238, 176, .46); background: rgba(18, 86, 65, .2); }
.outlook-signal.state-pass strong { color: #7dffc6; }
.outlook-signal.state-warn, .outlook-signal.state-missing { border-color: rgba(255, 208, 106, .4); background: rgba(90, 63, 12, .19); }
.outlook-signal.state-warn strong, .outlook-signal.state-missing strong { color: #ffe08b; }
.outlook-signal.state-fail { border-color: rgba(255, 102, 141, .48); background: rgba(104, 16, 45, .22); }
.outlook-signal.state-fail strong { color: #ff9db6; }
.outlook-provider-table { margin-top: 12px; overflow: hidden; border: 1px solid rgba(103, 169, 214, .18); border-radius: 15px; }
.outlook-provider-head, .outlook-provider-row { display: grid; grid-template-columns: minmax(180px, .9fr) 128px minmax(260px, 1.8fr); align-items: center; gap: 15px; }
.outlook-provider-head { padding: 9px 14px; color: #6f8dab; background: rgba(10, 38, 70, .78); font-size: .57rem; font-weight: 800; letter-spacing: .075em; text-transform: uppercase; }
.outlook-provider-row { min-width: 0; padding: 13px 14px; border-top: 1px solid rgba(103, 169, 214, .13); background: rgba(2, 10, 27, .52); }
.outlook-provider-row:first-of-type { border-top: 0; }
.outlook-provider-row.state-accept { box-shadow: inset 3px 0 #48eeb0; }
.outlook-provider-row.state-risk { box-shadow: inset 3px 0 #ffd06a; }
.outlook-provider-row.state-reject { box-shadow: inset 3px 0 #ff668d; }
.outlook-provider-identity { min-width: 0; }
.outlook-provider-identity strong, .outlook-provider-identity a { display: block; color: #dcecfb; font-size: .76rem; font-weight: 780; text-decoration: none; }
.outlook-provider-identity a:hover { color: var(--cyan); }
.outlook-provider-identity small { display: block; margin-top: 3px; color: #5f7897; font: .59rem/1.4 var(--font-mono); overflow-wrap: anywhere; }
.outlook-provider-state { width: max-content; padding: 6px 8px; border-radius: 999px; color: #ffe18f; background: rgba(214, 157, 38, .17); font-size: .59rem; font-weight: 800; text-transform: uppercase; }
.state-accept .outlook-provider-state { color: #7dffc6; background: rgba(30, 168, 115, .17); }
.state-reject .outlook-provider-state { color: #ffabc0; background: rgba(224, 55, 100, .2); }
.outlook-provider-row > p { min-width: 0; margin: 0; color: #8199b6; font-size: .67rem; line-height: 1.48; }
.outlook-caveat { margin: 12px 2px 0; color: #617b99; font-size: .62rem; line-height: 1.5; }

.queued-section { margin-top: 46px; }
.report-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 32px;
  padding: 24px 28px;
  border: 1px solid rgba(71, 239, 176, .3);
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(4, 49, 43, .72), rgba(4, 22, 49, .82));
}
.report-summary[hidden] { display: none; }
.report-summary h2 { margin: 0; font-size: clamp(1.35rem, 2.4vw, 1.85rem); }
.report-summary p:not(.section-kicker) { margin: 7px 0 0; color: #89a4c4; font-size: .86rem; }
.summary-scores { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.summary-scores span { padding: 8px 11px; border-radius: 999px; font-size: .75rem; font-weight: 800; }
.score-pass { color: #b9ffe0; background: rgba(30, 168, 115, .2); }
.score-warn { color: #ffe9a7; background: rgba(214, 157, 38, .18); }
.score-fail { color: #ffc3d3; background: rgba(224, 55, 100, .18); }
.report-summary-actions { display: grid; justify-items: end; gap: 10px; }
.report-summary-actions > small { max-width: 360px; color: #7d98b8; font-size: .69rem; text-align: right; }
.download-button { display: inline-flex; min-height: 42px; align-items: center; justify-content: center; padding: 0 16px; border: 1px solid rgba(83, 226, 255, .45); border-radius: 12px; color: #eefcff; background: linear-gradient(135deg, rgba(40, 123, 255, .82), rgba(169, 65, 239, .82)); box-shadow: 0 10px 30px rgba(70, 69, 220, .2); font-size: .76rem; font-weight: 780; text-decoration: none; }
.download-button[hidden] { display: none; }
.download-button:hover { border-color: #bff8ff; transform: translateY(-1px); }
.section-heading-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.section-heading-row h2 { margin: 0; font-size: clamp(1.45rem, 2.5vw, 2rem); letter-spacing: -.03em; }
.queued-count { color: #b8eaff; border-color: rgba(83, 226, 255, .22); background: rgba(4, 37, 59, .45); }
.check-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.check-card {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 13px;
  min-height: 96px;
  padding: 16px;
  border: 1px solid rgba(105, 205, 255, .34);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(15, 36, 75, .96), rgba(7, 23, 54, .96));
  box-shadow: inset 0 1px rgba(255, 255, 255, .055), 0 12px 32px rgba(0, 0, 0, .18);
}
.check-card > div > strong { color: #f1fbff; }
.check-card > div > p { color: #9bb2cf; }
.check-card .queued-label { color: #91a9c8; }
.check-icon { display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid rgba(83, 232, 255, .32); border-radius: 12px; color: var(--cyan); background: rgba(0, 172, 215, .08); font: 800 .9rem var(--font-mono); }
.check-card strong { font-size: .93rem; }
.check-card p { margin: 4px 0 0; color: #7186a5; font-size: .75rem; line-height: 1.35; }
.queued-label { color: #6d82a1; font-size: .7rem; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; }
.check-card.result-pass { border-color: rgba(71, 239, 176, .54); background: linear-gradient(145deg, rgba(15, 65, 70, .92), rgba(7, 28, 58, .96)); }
.check-card.result-pass .queued-label { color: var(--green); }
.check-card.result-warn { border-color: rgba(255, 201, 84, .52); background: linear-gradient(145deg, rgba(70, 54, 24, .9), rgba(10, 28, 58, .96)); }
.check-card.result-warn .queued-label { color: #ffd77c; }
.check-card.result-none { border-color: rgba(105, 205, 255, .28); background: linear-gradient(145deg, rgba(13, 41, 72, .9), rgba(7, 23, 54, .96)); }
.check-card.result-none .queued-label { color: #9fcce7; }
.check-card.result-fail,
.check-card.result-error { border-color: rgba(255, 85, 132, .56); background: linear-gradient(145deg, rgba(72, 24, 54, .92), rgba(11, 25, 55, .96)); }
.check-card.result-fail .queued-label,
.check-card.result-error .queued-label { color: #ff8eae; }
.check-details { display: none; grid-column: 1 / -1; padding-top: 11px; border-top: 1px solid rgba(83, 226, 255, .24); }
.check-card.result-pass .check-details,
.check-card.result-warn .check-details,
.check-card.result-none .check-details,
.check-card.result-fail .check-details,
.check-card.result-error .check-details { display: block; }
.check-details summary { width: max-content; cursor: pointer; color: #a7effa; font-size: .74rem; font-weight: 700; }
.evidence-view { display: grid; gap: 13px; margin-top: 13px; }
.evidence-intro { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid rgba(111, 164, 207, .18); border-radius: 13px; background: rgba(2, 10, 28, .62); }
.evidence-intro p { margin: 0; color: #91a9c7; font-size: .72rem; }
.evidence-signal { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 9px; color: #9fb3cd; background: rgba(119, 148, 185, .13); font: 800 .72rem var(--font-mono); }
.evidence-pass { border-color: rgba(71, 239, 176, .22); }
.evidence-pass .evidence-signal { color: #7dffc6; background: rgba(30, 168, 115, .16); }
.evidence-fail, .evidence-error { border-color: rgba(255, 85, 132, .26); }
.evidence-fail .evidence-signal, .evidence-error .evidence-signal { color: #ff9cb6; background: rgba(224, 55, 100, .18); }
.evidence-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.evidence-fact { min-width: 0; padding: 11px 12px; border: 1px solid rgba(101, 167, 210, .12); border-radius: 11px; background: rgba(3, 12, 31, .55); }
.evidence-fact small { display: block; color: #587493; font-size: .58rem; font-weight: 780; letter-spacing: .06em; text-transform: uppercase; }
.evidence-fact strong, .evidence-fact code { display: block; margin-top: 6px; color: #c8dcf2; font-size: .71rem; line-height: 1.45; overflow-wrap: anywhere; }
.evidence-fact code { color: #82e8f4; font-family: var(--font-mono); }
.evidence-wide { grid-column: 1 / -1; }
.check-card[data-check="tls"],
.check-card[data-check="ptr"] { grid-column: 1 / -1; }
.signature-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.certificate-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 12px; }
.signature-card, .certificate-card { min-width: 0; padding: 14px; border: 1px solid rgba(96, 162, 207, .16); border-radius: 14px; background: rgba(2, 10, 28, .68); }
.signature-card.valid, .certificate-card.verified { border-color: #48eeb0; background: rgba(7, 50, 43, .58); box-shadow: inset 0 0 0 1px rgba(72, 238, 176, .18), 0 0 18px rgba(72, 238, 176, .16); }
.signature-card.invalid { border-color: rgba(255, 201, 84, .2); }
.certificate-card.private { border-color: #ffd06a; background: rgba(61, 45, 12, .48); box-shadow: inset 0 0 0 1px rgba(255, 208, 106, .15), 0 0 18px rgba(255, 208, 106, .13); }
.certificate-card.failed, .certificate-card.unverified { border-color: #ff668d; background: rgba(69, 12, 34, .5); box-shadow: inset 0 0 0 1px rgba(255, 102, 141, .16), 0 0 18px rgba(255, 102, 141, .14); }
.signature-heading, .certificate-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.signature-heading strong, .certificate-heading strong { min-width: 0; color: #dfedfb; font-size: .77rem; overflow-wrap: anywhere; }
.signature-heading span, .certificate-heading span { flex: 0 0 auto; padding: 5px 7px; border-radius: 999px; color: #7dffc6; background: rgba(30, 168, 115, .14); font-size: .57rem; font-weight: 780; text-transform: uppercase; }
.invalid .signature-heading span, .certificate-card.private .certificate-heading span { color: #ffe18f; background: rgba(214, 157, 38, .2); }
.certificate-card.failed .certificate-heading span, .certificate-card.unverified .certificate-heading span { color: #ffabc0; background: rgba(224, 55, 100, .22); }
.evidence-subheading { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding-top: 3px; }
.evidence-subheading span { color: #dcecfb; font-size: .82rem; font-weight: 760; }
.evidence-subheading small { color: #56708f; font-size: .61rem; }
.route-timeline { display: grid; gap: 8px; }
.route-hop { display: grid; grid-template-columns: auto 1fr; gap: 11px; padding: 11px 12px; border: 1px solid rgba(83, 226, 255, .13); border-radius: 12px; background: linear-gradient(100deg, rgba(8, 45, 75, .45), rgba(3, 12, 31, .55)); }
.route-hop-number { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid rgba(83, 226, 255, .28); border-radius: 50%; color: var(--cyan); font: 750 .65rem var(--font-mono); }
.route-hop-body strong { color: #c9e6f1; font-size: .7rem; }
.route-hop-body p { margin: 4px 0 0; color: #617d9b; font: .62rem/1.45 var(--font-mono); }
.evidence-note, .evidence-empty { margin: 0; padding: 11px 13px; border-radius: 10px; color: #6d87a7; background: rgba(2, 9, 24, .55); font-size: .66rem; line-height: 1.5; }

.rbl-card { grid-column: 1 / -1; }
.rbl-dashboard { grid-column: 1 / -1; padding-top: 14px; border-top: 1px solid rgba(83, 226, 255, .13); }
.rbl-dashboard[hidden] { display: none; }
.rbl-overview { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.rbl-overview > div { min-height: 88px; padding: 16px 18px; border: 1px solid rgba(111, 177, 222, .15); border-radius: 15px; background: rgba(2, 10, 29, .62); }
.rbl-overview span { display: block; color: #dff8ff; font: 760 1.65rem/1 var(--font-mono); }
.rbl-overview small { display: block; margin-top: 8px; color: #7188a8; font-size: .69rem; font-weight: 720; letter-spacing: .035em; text-transform: uppercase; }
.rbl-overview .clean { border-color: rgba(71, 239, 176, .23); background: rgba(15, 86, 66, .17); }
.rbl-overview .clean span { color: var(--green); }
.rbl-overview .listed { border-color: rgba(255, 85, 132, .22); background: rgba(105, 17, 44, .17); }
.rbl-overview .listed span { color: #ff96b3; }
.rbl-overview .attention { border-color: rgba(255, 201, 84, .2); background: rgba(102, 70, 13, .14); }
.rbl-overview .attention span { color: #ffd77c; }
.rbl-snapshot-note { display: flex; align-items: flex-start; gap: 12px; margin-top: 14px; padding: 14px 16px; border: 1px solid rgba(255, 208, 106, .34); border-radius: 14px; background: linear-gradient(135deg, rgba(103, 68, 10, .2), rgba(21, 37, 65, .72)); box-shadow: inset 3px 0 #ffd06a; }
.rbl-snapshot-note > span { display: grid; flex: 0 0 auto; width: 25px; height: 25px; place-items: center; border-radius: 8px; color: #071326; background: #ffd06a; font: 850 .75rem var(--font-mono); box-shadow: 0 0 16px rgba(255, 208, 106, .16); }
.rbl-snapshot-note strong { display: block; color: #ffe09a; font-size: .74rem; }
.rbl-snapshot-note p { max-width: 1050px; margin: 5px 0 0; color: #a5b8d1; font-size: .67rem; line-height: 1.55; }
.rbl-toolbar { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 14px; }
.rbl-toolbar button { min-height: 36px; padding: 0 13px; border: 1px solid rgba(93, 185, 236, .18); border-radius: 999px; color: #7f99ba; background: rgba(3, 17, 42, .72); font: 700 .7rem var(--font-display); cursor: pointer; }
.rbl-toolbar button:hover { color: #c6f5ff; border-color: rgba(83, 226, 255, .42); }
.rbl-toolbar button.active { color: #031525; border-color: var(--cyan); background: var(--cyan); box-shadow: 0 0 18px rgba(83, 226, 255, .17); }
.rbl-results { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.rbl-result { min-width: 0; padding: 14px 15px; border: 1px solid rgba(101, 167, 210, .14); border-radius: 14px; background: rgba(2, 10, 28, .62); }
.rbl-result[hidden] { display: none; }
.rbl-result-top { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.rbl-result-icon { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 9px; color: #91a8c4; background: rgba(115, 149, 191, .12); font: 800 .77rem var(--font-mono); }
.rbl-result-identity { min-width: 0; }
.rbl-result-identity strong { display: block; overflow: hidden; color: #d6e8fa; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.rbl-result-identity small { display: block; overflow: hidden; margin-top: 3px; color: #58708f; font: .62rem var(--font-mono); text-overflow: ellipsis; white-space: nowrap; }
.rbl-state-label { padding: 5px 7px; border-radius: 999px; color: #8ca1bb; background: rgba(112, 137, 172, .11); font-size: .6rem; font-weight: 780; text-transform: uppercase; letter-spacing: .045em; }
.rbl-result-meta { display: flex; align-items: flex-start; gap: 8px; margin: 11px 0 0 38px; }
.rbl-result-meta p { flex: 1; margin: 0; color: #7087a7; font-size: .67rem; }
.rbl-category { flex: 0 0 auto; color: #7fd7e7; font-size: .6rem; font-weight: 750; text-transform: uppercase; letter-spacing: .045em; }
.rbl-state-clean { border-color: rgba(71, 239, 176, .18); }
.rbl-state-clean .rbl-result-icon, .rbl-state-clean .rbl-state-label { color: #7dffc6; background: rgba(30, 168, 115, .15); }
.rbl-state-listed { border-color: rgba(255, 85, 132, .38); background: rgba(73, 11, 35, .34); box-shadow: inset 3px 0 #ff557f; }
.rbl-state-listed .rbl-result-icon, .rbl-state-listed .rbl-state-label { color: #ff9cb6; background: rgba(224, 55, 100, .18); }
.rbl-state-timeout, .rbl-state-unavailable { border-color: rgba(255, 201, 84, .18); }
.rbl-state-timeout .rbl-result-icon, .rbl-state-unavailable .rbl-result-icon { color: #ffd77c; background: rgba(214, 157, 38, .14); }
.rbl-query-details { margin: 11px 0 0 38px; padding-top: 9px; border-top: 1px solid rgba(83, 226, 255, .09); }
.rbl-query-details summary { width: max-content; cursor: pointer; color: #6bb8ca; font-size: .65rem; font-weight: 700; }
.rbl-query-trail { display: grid; gap: 6px; margin-top: 9px; }
.rbl-query-item { display: grid; gap: 4px; padding: 9px 10px; border-radius: 9px; background: rgba(0, 4, 15, .7); }
.rbl-query-item code { color: #77dbea; font: .61rem/1.4 var(--font-mono); overflow-wrap: anywhere; }
.rbl-query-item span { color: #6e88a7; font-size: .61rem; }
.rbl-empty { margin: 20px 0 4px; color: #7186a5; text-align: center; }

.rfc8058-guide { position: relative; overflow: hidden; margin-top: 46px; padding: 28px; border: 1px solid rgba(83, 226, 255, .42); border-radius: 24px; background: radial-gradient(circle at 88% 8%, rgba(151, 82, 255, .18), transparent 30%), linear-gradient(145deg, rgba(13, 38, 77, .97), rgba(5, 17, 42, .98)); box-shadow: 0 24px 70px rgba(0, 0, 0, .3), inset 0 1px rgba(255, 255, 255, .05); }
.rfc8058-guide::before { position: absolute; top: 0; right: 11%; left: 11%; height: 1px; background: linear-gradient(90deg, transparent, var(--cyan), #a75cff, transparent); content: ""; }
.rfc8058-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 24px; }
.rfc8058-heading h2 { max-width: 760px; margin: 0; font-size: clamp(1.55rem, 3vw, 2.35rem); letter-spacing: -.035em; line-height: 1.08; }
.rfc8058-heading p:not(.section-kicker) { max-width: 790px; margin: 12px 0 0; color: #9cb3ce; font-size: .82rem; line-height: 1.65; }
.rfc8058-status { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; align-items: center; gap: 3px 9px; min-width: 220px; padding: 12px 14px; border: 1px solid rgba(71, 239, 176, .3); border-radius: 14px; color: inherit; background: rgba(8, 57, 48, .3); text-decoration: none; transition: border-color .18s ease, transform .18s ease; }
.rfc8058-status:hover { transform: translateY(-2px); border-color: rgba(71, 239, 176, .68); }
.rfc8058-status > span { grid-row: 1 / 3; width: 9px; height: 9px; border-radius: 50%; background: var(--green); box-shadow: 0 0 14px rgba(71, 239, 176, .75); }
.rfc8058-status strong { color: #dffdf1; font: 750 .72rem var(--font-mono); }
.rfc8058-status small { color: #7fb9a8; font-size: .58rem; }
.rfc8058-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 24px; }
.rfc8058-flow article { display: grid; grid-template-columns: auto 1fr; align-content: start; gap: 4px 11px; min-width: 0; padding: 15px; border: 1px solid rgba(83, 226, 255, .16); border-radius: 14px; background: rgba(2, 11, 31, .58); }
.rfc8058-flow article > span { display: grid; grid-row: 1 / 3; width: 29px; height: 29px; place-items: center; border: 1px solid rgba(83, 226, 255, .42); border-radius: 9px; color: var(--cyan); background: rgba(19, 90, 119, .18); font: 750 .66rem var(--font-mono); }
.rfc8058-flow strong { color: #d9edf9; font-size: .75rem; }
.rfc8058-flow p { margin: 0; color: #718ba9; font-size: .65rem; line-height: 1.48; }
.rfc8058-details { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 12px; margin-top: 12px; }
.rfc8058-code-card, .rfc8058-check-card { min-width: 0; padding: 18px; border: 1px solid rgba(105, 167, 210, .18); border-radius: 16px; background: rgba(2, 9, 26, .7); }
.rfc8058-code-card > div span, .rfc8058-check-card > span { display: block; color: #5fcfe0; font: 720 .57rem var(--font-mono); letter-spacing: .075em; text-transform: uppercase; }
.rfc8058-code-card > div strong { display: block; margin-top: 5px; color: #dcecfb; font-size: .78rem; }
.rfc8058-code-card pre { margin: 14px 0 0; padding: 15px 16px; overflow-x: auto; border: 1px solid rgba(83, 226, 255, .17); border-radius: 12px; background: #010817; }
.rfc8058-code-card code { color: #8ae8f5; font: .66rem/1.75 var(--font-mono); white-space: pre; }
.rfc8058-code-card > small { display: block; margin-top: 11px; color: #687f9e; font-size: .61rem; line-height: 1.5; }
.rfc8058-check-card h3 { margin: 5px 0 14px; color: #e4f3ff; font-size: .93rem; }
.rfc8058-check-card ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.rfc8058-check-card li { display: grid; grid-template-columns: auto 1fr; gap: 3px 9px; color: #c6d8e9; font-size: .7rem; }
.rfc8058-check-card li::before { grid-row: 1 / 3; color: var(--green); content: "\2713"; font: 800 .72rem var(--font-mono); }
.rfc8058-check-card li small { display: block; color: #657e9c; font-size: .6rem; line-height: 1.4; }
.rfc8058-result-key { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 15px; }
.rfc8058-result-key span { padding: 5px 8px; border-radius: 999px; font-size: .57rem; font-weight: 760; }
.rfc8058-result-key .pass { color: #8fffd0; background: rgba(30, 168, 115, .17); }
.rfc8058-result-key .warn { color: #ffe18f; background: rgba(214, 157, 38, .18); }
.rfc8058-result-key .fail { color: #ffabc0; background: rgba(224, 55, 100, .2); }
.rfc8058-result-key .none { color: #a9c4e4; background: rgba(95, 126, 170, .18); }
.rfc8058-safety { display: flex; align-items: flex-start; gap: 11px; margin-top: 12px; padding: 14px 16px; border: 1px solid rgba(71, 239, 176, .28); border-radius: 14px; background: rgba(8, 65, 52, .2); }
.rfc8058-safety > span { display: grid; flex: 0 0 auto; width: 25px; height: 25px; place-items: center; border-radius: 8px; color: #072217; background: var(--green); font: 850 .7rem var(--font-mono); }
.rfc8058-safety strong { display: block; color: #c9fae5; font-size: .72rem; }
.rfc8058-safety p { margin: 4px 0 0; color: #85a9a2; font-size: .64rem; line-height: 1.5; }
.rfc8058-lifecycle { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 12px; padding: 15px 17px; border: 1px solid rgba(151, 82, 255, .25); border-radius: 14px; background: linear-gradient(110deg, rgba(57, 28, 102, .23), rgba(5, 33, 60, .44)); }
.rfc8058-lifecycle > div:first-child { min-width: 0; }
.rfc8058-lifecycle span { color: #cbb0ff; font-size: .65rem; font-weight: 760; }
.rfc8058-lifecycle p { margin: 4px 0 0; color: #728aa8; font-size: .62rem; line-height: 1.45; }
.rfc8058-lifecycle > div:last-child { display: flex; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.rfc8058-lifecycle a { padding: 7px 9px; border: 1px solid rgba(83, 226, 255, .25); border-radius: 999px; color: #9beef8; background: rgba(4, 25, 52, .52); font-size: .59rem; font-weight: 700; text-decoration: none; }
.rfc8058-lifecycle a:hover { border-color: rgba(83, 226, 255, .62); color: #dffcff; }

.tls-inspector-main { padding-top: 38px; }
.tls-inspector-hero { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(260px, .55fr); align-items: center; gap: 32px; margin-bottom: 22px; padding: 34px 38px; border: 1px solid rgba(83, 226, 255, .42); border-radius: 26px; background: linear-gradient(135deg, rgba(14, 40, 79, .96), rgba(19, 16, 62, .94)); box-shadow: 0 30px 90px rgba(0, 0, 0, .34), inset 0 1px rgba(255, 255, 255, .06); }
.tls-inspector-hero h1 { margin: 0; font-size: clamp(2rem, 4vw, 3.5rem); letter-spacing: -.045em; line-height: 1.02; }
.tls-inspector-hero p:not(.section-kicker) { max-width: 740px; margin: 15px 0 0; color: #a9bdd8; font-size: .98rem; line-height: 1.65; }
.tls-hero-badges { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 21px; }
.tls-hero-badges span { padding: 7px 10px; border: 1px solid rgba(83, 226, 255, .3); border-radius: 999px; color: #a8f5ff; background: rgba(4, 25, 52, .62); font: 700 .65rem var(--font-mono); }
.tls-hero-mark { position: relative; display: grid; min-height: 190px; place-items: center; overflow: hidden; border: 1px solid rgba(83, 226, 255, .32); border-radius: 22px; background: radial-gradient(circle at 50% 38%, rgba(83, 226, 255, .2), transparent 43%), rgba(2, 10, 29, .68); }
.tls-hero-mark::before, .tls-hero-mark::after { position: absolute; width: 145px; height: 145px; border: 1px solid rgba(83, 226, 255, .24); border-radius: 50%; content: ""; }
.tls-hero-mark::after { width: 108px; height: 108px; border-color: rgba(151, 82, 255, .33); }
.tls-hero-mark > span { position: absolute; z-index: 1; width: 54px; height: 48px; margin-top: 25px; border: 3px solid var(--cyan); border-radius: 10px 10px 16px 16px; box-shadow: 0 0 28px rgba(83, 226, 255, .25); }
.tls-hero-mark > span::before { position: absolute; top: -32px; left: 9px; width: 30px; height: 32px; border: 3px solid var(--cyan); border-bottom: 0; border-radius: 24px 24px 0 0; content: ""; }
.tls-hero-mark strong { position: relative; z-index: 2; margin-top: 20px; color: #eefcff; font-size: 1.05rem; letter-spacing: .12em; }
.tls-hero-mark small { position: absolute; bottom: 18px; z-index: 2; color: #68dff2; font: 650 .56rem var(--font-mono); letter-spacing: .13em; }

.credential-warning { display: flex; align-items: flex-start; gap: 14px; margin: 0 0 22px; padding: 17px 19px; border: 1px solid rgba(255, 208, 106, .44); border-radius: 17px; background: linear-gradient(135deg, rgba(98, 63, 8, .26), rgba(16, 32, 61, .86)); box-shadow: inset 3px 0 #ffd06a; }
.credential-warning.compact { margin: 15px 0 0; padding: 14px 16px; }
.credential-warning-icon { display: grid; flex: 0 0 auto; width: 29px; height: 29px; place-items: center; border-radius: 9px; color: #061425; background: #ffd06a; font: 850 .82rem var(--font-mono); box-shadow: 0 0 18px rgba(255, 208, 106, .18); }
.credential-warning strong { display: block; color: #ffe2a0; font-size: .83rem; }
.credential-warning p { margin: 5px 0 0; color: #a8bad1; font-size: .72rem; line-height: 1.58; }

.tls-inspector-form { overflow: hidden; border: 1px solid rgba(83, 226, 255, .47); border-radius: 24px; background: linear-gradient(145deg, rgba(14, 35, 70, .98), rgba(5, 17, 42, .98)); box-shadow: 0 28px 85px rgba(0, 0, 0, .32), inset 0 1px rgba(255, 255, 255, .045); }
.tls-form-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 22px 26px; border-bottom: 1px solid rgba(83, 226, 255, .24); background: rgba(17, 43, 79, .78); }
.tls-form-heading h2 { margin: 0; font-size: 1.35rem; }
.tls-form-heading .section-kicker { margin-bottom: 6px; }
.tls-form-heading > span { padding: 8px 11px; border: 1px solid rgba(71, 239, 176, .3); border-radius: 999px; color: #aef6d7; background: rgba(12, 74, 57, .26); font-size: .66rem; font-weight: 700; }
.tls-form-section { margin: 0; padding: 24px 26px; border: 0; border-bottom: 1px solid rgba(83, 226, 255, .17); }
.tls-form-section-title { display: flex; align-items: center; gap: 13px; margin: 0 0 18px; padding: 0; color: inherit; }
.tls-form-section-title > span:first-child { display: grid; flex: 0 0 auto; width: 32px; height: 32px; place-items: center; border: 1px solid rgba(83, 226, 255, .52); border-radius: 10px; color: var(--cyan); background: rgba(20, 91, 121, .18); font: 750 .74rem var(--font-mono); }
.tls-form-section-title h3, .tls-form-section-title strong { display: block; margin: 0; color: #eaf6ff; font-size: .93rem; }
.tls-form-section-title p, .tls-form-section-title small { display: block; margin: 3px 0 0; color: #8199b8; font-size: .69rem; font-weight: 500; line-height: 1.45; }
.tls-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.tls-field-grid-target { grid-template-columns: minmax(0, 2fr) minmax(145px, .55fr) minmax(145px, .55fr); }
.tls-field { display: grid; align-content: start; gap: 7px; min-width: 0; }
.tls-field > span:first-child { color: #a8bfd9; font-size: .69rem; font-weight: 720; }
.tls-field input, .tls-field select { width: 100%; min-height: 47px; padding: 0 13px; border: 1px solid rgba(83, 226, 255, .3); border-radius: 12px; outline: 0; color: #e8f9ff; background: rgba(7, 23, 50, .9); font-family: var(--font-display); }
.tls-field input::placeholder { color: #536c8d; }
.tls-field input:focus, .tls-field select:focus { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(83, 226, 255, .11); }
.tls-field input[type="number"] { font-family: var(--font-mono); }
.tls-field small { color: #627b9b; font-size: .6rem; line-height: 1.42; }
.tls-mode-fieldset > legend { width: 100%; }
.tls-mode-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.tls-mode-grid label { position: relative; cursor: pointer; }
.tls-mode-grid input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.tls-mode-grid label > span { display: grid; min-height: 83px; align-content: center; gap: 5px; padding: 14px 15px; border: 1px solid rgba(105, 167, 210, .22); border-radius: 14px; background: rgba(4, 16, 39, .7); transition: .18s ease; }
.tls-mode-grid b { color: #c7d9ec; font-size: .75rem; }
.tls-mode-grid small { color: #667f9e; font-size: .62rem; line-height: 1.4; }
.tls-mode-grid input:checked + span { border-color: var(--cyan); background: linear-gradient(145deg, rgba(14, 84, 113, .34), rgba(21, 37, 78, .9)); box-shadow: inset 3px 0 var(--cyan), 0 0 22px rgba(83, 226, 255, .07); }
.tls-mode-grid input:checked + span b { color: #e8fcff; }
.tls-mode-grid input:focus-visible + span { outline: 2px solid white; outline-offset: 2px; }
.tls-custom-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; margin-top: 13px; padding: 15px; border: 1px solid rgba(152, 91, 255, .28); border-radius: 15px; background: rgba(40, 20, 76, .22); }
.tls-custom-fields[hidden], .tls-auth-panel[hidden], .tls-job[hidden], .tls-results[hidden], [data-tls-auth-results-section][hidden] { display: none; }
.tls-auth-title { margin-bottom: 0; }
.tls-auth-title > div { min-width: 0; flex: 1; }
.tls-toggle { position: relative; display: flex; align-items: center; gap: 9px; margin-left: auto; cursor: pointer; }
.tls-toggle input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.tls-toggle > span { position: relative; width: 42px; height: 24px; border: 1px solid rgba(132, 170, 214, .54); border-radius: 999px; background: #173254; transition: .2s ease; }
.tls-toggle > span::after { position: absolute; top: 4px; left: 4px; width: 14px; height: 14px; border-radius: 50%; background: #91a9c6; content: ""; transition: .2s ease; }
.tls-toggle input:checked + span { border-color: var(--green); background: rgba(24, 134, 96, .35); box-shadow: 0 0 18px rgba(71, 239, 176, .12); }
.tls-toggle input:checked + span::after { transform: translateX(18px); background: var(--green); }
.tls-toggle b { color: #b3c8de; font-size: .69rem; }
.tls-toggle input:focus-visible + span { outline: 2px solid white; outline-offset: 3px; }
.tls-auth-panel { margin-top: 18px; padding: 17px; border: 1px solid rgba(255, 208, 106, .25); border-radius: 16px; background: rgba(22, 31, 57, .76); }
.tls-inline-warning { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 15px; padding: 11px 13px; border-radius: 11px; color: #ffe09a; background: rgba(111, 74, 12, .24); }
.tls-inline-warning strong { font-size: .7rem; }
.tls-inline-warning span { color: #a9b9cc; font-size: .62rem; text-align: right; }
.tls-password-wrap { display: flex; overflow: hidden; border: 1px solid rgba(83, 226, 255, .3); border-radius: 12px; background: rgba(7, 23, 50, .9); }
.tls-password-wrap:focus-within { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(83, 226, 255, .11); }
.tls-password-wrap input { min-width: 0; border: 0; background: transparent; box-shadow: none !important; }
.tls-password-wrap button { flex: 0 0 auto; border: 0; padding: 0 13px; color: #7fe5f3; background: rgba(18, 55, 87, .62); cursor: pointer; font-size: .64rem; font-weight: 750; }
.credential-ack { display: flex; align-items: flex-start; gap: 10px; margin-top: 15px; padding: 12px 13px; border: 1px solid rgba(255, 208, 106, .24); border-radius: 12px; color: #b8c7d8; background: rgba(75, 51, 10, .14); font-size: .67rem; line-height: 1.5; cursor: pointer; }
.credential-ack input { flex: 0 0 auto; width: 17px; height: 17px; margin: 1px 0 0; accent-color: #ffd06a; }
.tls-delivery-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); align-items: stretch; gap: 13px; }
.tls-report-option { position: relative; display: flex; align-items: center; gap: 12px; min-height: 75px; padding: 13px 15px; border: 1px solid rgba(83, 226, 255, .24); border-radius: 13px; background: rgba(8, 27, 55, .78); cursor: pointer; }
.tls-report-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.tls-report-option > span:first-of-type { position: relative; flex: 0 0 auto; width: 38px; height: 22px; border: 1px solid rgba(132, 170, 214, .5); border-radius: 999px; background: #173254; }
.tls-report-option > span:first-of-type::after { position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: #91a9c6; content: ""; transition: .2s ease; }
.tls-report-option input:checked + span { border-color: var(--cyan); background: rgba(22, 125, 153, .34); }
.tls-report-option input:checked + span::after { transform: translateX(16px); background: var(--cyan); }
.tls-report-option input:focus-visible + span { outline: 2px solid white; outline-offset: 3px; }
.tls-report-option b, .tls-report-option small { display: block; }
.tls-report-option b { color: #d6e8f8; font-size: .7rem; }
.tls-report-option small { margin-top: 4px; color: #738ba9; font-size: .61rem; line-height: 1.42; }
.tls-form-actions { display: flex; align-items: center; gap: 18px; padding: 20px 26px; background: rgba(8, 24, 53, .72); }
.tls-run-button { min-height: 49px; padding: 0 20px; border: 0; border-radius: 13px; color: #05101c; background: linear-gradient(135deg, #a3f4ff, #3ddcf4); box-shadow: 0 12px 30px rgba(47, 206, 234, .17); cursor: pointer; font-weight: 800; }
.tls-run-button span { margin-right: 6px; font-size: 1.2rem; }
.tls-form-actions p { margin: 0; color: #8299b8; font-size: .69rem; }
.tls-form-actions p[data-state="error"] { color: #ff9bb5; }

.tls-job { margin-top: 26px; padding: 24px 27px; border: 1px solid rgba(83, 226, 255, .5); border-radius: 21px; background: linear-gradient(145deg, rgba(14, 38, 76, .98), rgba(7, 21, 49, .98)); box-shadow: 0 24px 65px rgba(0, 0, 0, .25); }
.tls-job-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.tls-job-header h2 { margin: 0; font-size: 1.3rem; }
.tls-job-header p:not(.section-kicker) { margin: 6px 0 0; color: #8fa8c7; font-size: .72rem; }
.tls-job-header > span { color: var(--cyan); font: 750 .72rem var(--font-mono); }
.tls-job-track { height: 8px; margin-top: 20px; overflow: hidden; border-radius: 999px; background: #172e4e; }
.tls-job-track span { display: block; width: 4%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #875cff, #58e8ff, #47efb0); box-shadow: 0 0 14px rgba(83, 226, 255, .32); transition: width .35s ease; }
.tls-job-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 13px; color: #607999; font-size: .61rem; font-weight: 700; text-align: center; }
.tls-job-steps span.active { color: var(--cyan); }
.tls-job-steps span.complete { color: var(--green); }

.tls-results { margin-top: 32px; }
.tls-results-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 24px 27px; border: 1px solid rgba(83, 226, 255, .45); border-radius: 21px; background: linear-gradient(145deg, rgba(15, 40, 78, .97), rgba(8, 22, 50, .97)); }
.tls-results-heading h2 { margin: 0; font-size: 1.55rem; }
.tls-results-heading p:not(.section-kicker) { margin: 7px 0 0; color: #8ca5c5; font-size: .75rem; }
.tls-result-actions { display: flex; align-items: center; gap: 9px; }
.tls-result-actions button { min-height: 42px; padding: 0 14px; border: 1px solid rgba(102, 169, 214, .3); border-radius: 11px; color: #a8c2de; background: rgba(7, 25, 52, .78); cursor: pointer; font-size: .68rem; font-weight: 720; }
.tls-summary-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 12px; }
.tls-summary-card { min-height: 88px; padding: 16px 18px; border: 1px solid rgba(101, 167, 210, .24); border-radius: 15px; background: rgba(6, 19, 44, .88); }
.tls-summary-card strong { display: block; color: #dff8ff; font: 760 1.65rem/1 var(--font-mono); }
.tls-summary-card span { display: block; margin-top: 8px; color: #7189a8; font-size: .65rem; font-weight: 720; text-transform: uppercase; }
.tls-summary-card.state-pass { border-color: rgba(71, 239, 176, .35); background: rgba(15, 86, 66, .2); }
.tls-summary-card.state-pass strong { color: var(--green); }
.tls-summary-card.state-warn { border-color: rgba(255, 208, 106, .32); background: rgba(102, 70, 13, .18); }
.tls-summary-card.state-warn strong { color: #ffd77c; }
.tls-summary-card.state-fail { border-color: rgba(255, 85, 132, .38); background: rgba(105, 17, 44, .2); }
.tls-summary-card.state-fail strong { color: #ff96b3; }
.tls-summary-card.state-info strong { color: var(--cyan); }
.tls-result-notice { margin-top: 12px; padding: 12px 15px; border: 1px solid rgba(83, 226, 255, .2); border-radius: 12px; color: #8fa7c4; background: rgba(6, 20, 46, .72); font-size: .67rem; }
.tls-result-notice[data-state="pass"] { border-color: rgba(71, 239, 176, .3); color: #9ce7c4; }
.tls-result-notice[data-state="error"] { border-color: rgba(255, 85, 132, .32); color: #ff9db8; }
.tls-result-section { margin-top: 35px; }
.tls-probe-grid, .tls-auth-results { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.tls-probe-card, .tls-auth-result { min-width: 0; overflow: hidden; border: 1px solid rgba(101, 167, 210, .25); border-radius: 17px; background: linear-gradient(145deg, rgba(15, 37, 70, .96), rgba(6, 18, 42, .96)); }
.tls-probe-card.state-pass, .tls-auth-result.state-pass { border-color: rgba(71, 239, 176, .48); box-shadow: inset 3px 0 var(--green); }
.tls-probe-card.state-warn { border-color: rgba(255, 208, 106, .48); box-shadow: inset 3px 0 #ffd06a; }
.tls-probe-card.state-fail, .tls-auth-result.state-fail { border-color: rgba(255, 85, 132, .5); box-shadow: inset 3px 0 #ff668d; }
.tls-probe-card.state-not_offered { border-color: rgba(111, 173, 211, .4); box-shadow: inset 3px 0 #6fadd3; }
.tls-auth-result.state-not_offered { border-color: rgba(111, 173, 211, .4); box-shadow: inset 3px 0 #6fadd3; }
.tls-probe-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 17px; border-bottom: 1px solid rgba(83, 226, 255, .13); background: rgba(13, 34, 66, .65); }
.tls-probe-identity { display: flex; align-items: center; gap: 11px; min-width: 0; }
.tls-probe-icon { display: grid; flex: 0 0 auto; width: 31px; height: 31px; place-items: center; border-radius: 9px; color: #041811; background: var(--green); font: 850 .82rem var(--font-mono); }
.state-warn .tls-probe-icon { color: #1c1405; background: #ffd06a; }
.state-fail .tls-probe-icon { color: #250711; background: #ff668d; }
.state-not_offered .tls-probe-icon { color: #071827; background: #79b9dd; }
.tls-probe-identity strong, .tls-probe-identity small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tls-probe-identity strong { color: #dfedf9; font-size: .76rem; }
.tls-probe-identity small { max-width: 340px; margin-top: 3px; color: #6883a2; font: .59rem var(--font-mono); }
.tls-state-pill { flex: 0 0 auto; padding: 6px 8px; border-radius: 999px; color: #a9bed4; background: rgba(112, 137, 172, .13); font-size: .57rem; font-weight: 800; text-transform: uppercase; }
.tls-state-pill.state-pass { color: #80ffc8; background: rgba(30, 168, 115, .17); }
.tls-state-pill.state-warn { color: #ffe08b; background: rgba(214, 157, 38, .18); }
.tls-state-pill.state-fail { color: #ffabc0; background: rgba(224, 55, 100, .2); }
.tls-state-pill.state-info { color: #a9e8ff; background: rgba(66, 157, 204, .18); }
.tls-probe-detail { margin: 0; padding: 13px 17px; color: #91a8c4; font-size: .68rem; line-height: 1.48; }
.tls-probe-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; padding: 0 17px 16px; }
.tls-probe-fact { min-width: 0; padding: 10px 11px; border: 1px solid rgba(101, 167, 210, .14); border-radius: 10px; background: rgba(3, 12, 30, .5); }
.tls-probe-fact span, .tls-probe-fact strong { display: block; }
.tls-probe-fact span { color: #64809f; font-size: .55rem; font-weight: 760; letter-spacing: .05em; text-transform: uppercase; }
.tls-probe-fact strong { margin-top: 5px; color: #b4c9df; font: 600 .61rem/1.4 var(--font-mono); overflow-wrap: anywhere; }
.tls-certificate-details { border-top: 1px solid rgba(83, 226, 255, .13); }
.tls-certificate-details summary { padding: 12px 17px; color: #71d9e9; font-size: .64rem; font-weight: 720; cursor: pointer; }
.tls-certificate-evidence { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; padding: 0 17px 16px; }
.tls-trust-overview { margin: 0 17px 10px; padding: 13px 14px; border: 1px solid rgba(83, 226, 255, .25); border-radius: 12px; background: rgba(5, 20, 43, .78); }
.tls-trust-overview.state-pass { border-color: rgba(71, 239, 176, .4); background: rgba(11, 66, 54, .28); }
.tls-trust-overview.state-fail { border-color: rgba(255, 85, 132, .42); background: rgba(84, 15, 37, .26); }
.tls-trust-overview strong { color: #e3f6ff; font-size: .72rem; }
.tls-trust-overview p { margin: 6px 0 0; color: #91a8c4; font-size: .63rem; line-height: 1.5; }
.tls-chain-stack { display: grid; gap: 17px; padding: 1px 17px 18px; }
.tls-chain-certificate { position: relative; min-width: 0; border: 1px solid rgba(101, 167, 210, .24); border-radius: 13px; background: rgba(3, 13, 31, .72); }
.tls-chain-certificate.state-pass { border-color: rgba(71, 239, 176, .34); }
.tls-chain-certificate.state-warn { border-color: rgba(255, 208, 106, .56); box-shadow: inset 3px 0 #ffd06a; }
.tls-chain-certificate.state-fail { border-color: rgba(255, 85, 132, .56); box-shadow: inset 3px 0 #ff668d; }
.tls-chain-certificate-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 12px; border-bottom: 1px solid rgba(83, 226, 255, .11); }
.tls-chain-certificate-head > div { display: flex; align-items: center; gap: 9px; min-width: 0; }
.tls-chain-certificate-head strong { color: #dceefa; font-size: .68rem; }
.tls-chain-position { display: grid; flex: 0 0 auto; width: 25px; height: 25px; place-items: center; border: 1px solid rgba(83, 226, 255, .34); border-radius: 50%; color: var(--cyan); font: 750 .6rem var(--font-mono); }
.tls-chain-certificate-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; padding: 11px 12px; }
.tls-chain-link { margin: 0 12px 11px; padding: 9px 10px; border: 1px solid rgba(101, 167, 210, .17); border-radius: 9px; color: #8199b7; background: rgba(7, 23, 48, .72); font-size: .6rem; line-height: 1.45; }
.tls-chain-link.state-match, .tls-chain-link.state-self_signed { border-color: rgba(71, 239, 176, .28); color: #9de6c6; }
.tls-chain-link.state-trust_store { border-color: rgba(83, 226, 255, .28); color: #9bddea; }
.tls-chain-link.state-mismatch, .tls-chain-link.state-not_presented { border-color: rgba(255, 85, 132, .3); color: #ffabc0; }
.tls-chain-fingerprint { border-top: 1px solid rgba(83, 226, 255, .1); }
.tls-chain-fingerprint summary { padding: 9px 12px; color: #688eae; font-size: .58rem; }
.tls-chain-fingerprint code { display: block; padding: 0 12px 11px; color: #9ebbd2; font-size: .56rem; overflow-wrap: anywhere; }
.tls-chain-connector { position: absolute; bottom: -17px; left: 18px; z-index: 2; color: #6addec; background: #06142d; font: 650 .52rem var(--font-mono); }
.tls-auth-result { padding: 16px 17px; }
.tls-auth-result > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.tls-auth-result strong { color: #dfedf9; font-size: .76rem; }
.tls-auth-result > small { display: block; margin-top: 5px; color: #6883a2; font: .58rem var(--font-mono); }
.tls-auth-result p { margin: 11px 0 0; color: #91a8c4; font-size: .68rem; line-height: 1.48; }
.tls-empty-result { grid-column: 1 / -1; margin: 0; padding: 18px; border: 1px solid rgba(101, 167, 210, .2); border-radius: 14px; color: #8199b7; background: rgba(6, 20, 46, .72); font-size: .7rem; }

.site-footer { display: grid; grid-template-columns: minmax(360px, 560px) minmax(180px, 1fr); align-items: center; gap: 26px; padding: 28px 12px 0; border-top: 1px solid rgba(92, 178, 229, .2); color: #667b9a; font-size: .77rem; }
.footer-brand { display: grid; grid-template-columns: 190px minmax(0, 1fr); align-items: center; gap: 16px; padding: 10px; border: 1px solid rgba(83, 226, 255, .32); border-radius: 18px; background: rgba(3, 13, 35, .78); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.footer-brand:hover { transform: translateY(-3px); border-color: rgba(255, 91, 181, .72); box-shadow: 0 18px 50px rgba(114, 54, 255, .18); }
.footer-brand-visual { position: relative; display: block; overflow: hidden; aspect-ratio: 1360 / 768; border-radius: 12px; background: #02091a; }
.footer-brand-visual img,
.footer-brand-visual video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; transition: opacity .22s ease; }
.footer-brand-visual video { opacity: 0; }
.footer-brand.is-animating .footer-brand-visual video { opacity: 1; }
.footer-brand.is-animating .footer-brand-visual img { opacity: 0; }
.footer-brand-copy { display: grid; gap: 6px; min-width: 0; }
.footer-brand-copy strong { color: #dff8ff; font-size: .78rem; line-height: 1.35; }
.footer-brand-copy span { color: #758eae; font-size: .6rem; line-height: 1.45; }
.footer-tools { justify-self: end; color: #7890ae; text-align: right; }

@media (max-width: 940px) {
  .tool-grid, .check-grid { grid-template-columns: repeat(2, 1fr); }
  .rbl-results { grid-template-columns: 1fr; }
  .mailcheck-heading { align-items: flex-start; flex-direction: column; }
  .delivery-outlook-header { align-items: flex-start; flex-direction: column; }
  .outlook-likelihood { min-width: 0; text-align: left; }
  .outlook-provider-head, .outlook-provider-row { grid-template-columns: minmax(160px, .8fr) 120px minmax(220px, 1.6fr); }
  .report-summary { align-items: flex-start; flex-direction: column; }
  .summary-scores { justify-content: flex-start; }
  .report-summary-actions { justify-items: start; }
  .report-summary-actions > small { text-align: left; }
  .progress-rail { grid-template-columns: 1fr; gap: 12px; }
  .progress-line { width: 1px; height: 20px; margin-left: 16px; }
  .rfc8058-heading, .rfc8058-details { grid-template-columns: 1fr; }
  .rfc8058-flow { grid-template-columns: 1fr; }
  .rfc8058-status { width: fit-content; }
  .tls-inspector-hero { grid-template-columns: 1fr; }
  .tls-hero-mark { min-height: 165px; }
  .tls-field-grid-target { grid-template-columns: 1fr 1fr; }
  .tls-field-grid-target .tls-field-wide { grid-column: 1 / -1; }
  .tls-mode-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tls-probe-grid, .tls-auth-results { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .site-shell { width: min(100% - 18px, 1180px); padding-top: 9px; }
  .site-header { grid-template-columns: 1fr; border-radius: 18px; }
  .site-header::before { display: none; }
  .brand-panel { grid-column: 1; grid-row: 1; width: 100%; height: 92px; }
  .togethia-visit-pill { grid-column: 1; grid-row: 2; justify-self: center; }
  .tool-nav { grid-column: 1; grid-row: 3; justify-content: center; }
  main { padding: 40px 4px 54px; }
  .home-hero { grid-template-columns: 1fr; }
  .home-hero-copy { grid-column: auto; padding: 0 4px 18px; }
  .home-hero .anti-spam-challenge-tile { grid-column: auto; }
  .tool-grid, .check-grid { grid-template-columns: 1fr; }
  .signature-list, .certificate-grid { grid-template-columns: 1fr; }
  .evidence-facts { grid-template-columns: 1fr; }
  .evidence-wide { grid-column: auto; }
  .rbl-overview { grid-template-columns: repeat(2, 1fr); }
  .delivery-outlook { padding: 20px 18px; }
  .outlook-signals { grid-template-columns: 1fr; }
  .outlook-provider-head { display: none; }
  .outlook-provider-row { grid-template-columns: 1fr; gap: 8px; padding: 14px 16px; }
  .tool-card { min-height: 220px; }
  .mailcheck-tile { grid-template-columns: 1fr; grid-template-rows: 132px minmax(145px, 1fr); min-height: 277px; }
  .mailcheck-tile-visual { border-right: 0; border-bottom: 1px solid rgba(83, 226, 255, .2); }
  .mailcheck-tile-copy { min-height: 145px; padding: 16px 18px; }
  .mailcheck-visual-hero { margin-top: -4px; border-radius: 18px; }
  .address-block, .progress-rail, .console-actions { padding-inline: 18px; }
  .address-row { flex-direction: column; }
  .copy-button { min-height: 48px; }
  .console-actions { align-items: stretch; flex-direction: column; }
  .console-actions p { line-height: 1.5; }
  .console-topline { padding-inline: 18px; }
  .rfc8058-guide { padding: 21px 18px; border-radius: 20px; }
  .rfc8058-status { width: 100%; min-width: 0; }
  .rfc8058-lifecycle { align-items: flex-start; flex-direction: column; }
  .rfc8058-lifecycle > div:last-child { justify-content: flex-start; }
  .tls-inspector-hero { padding: 25px 21px; border-radius: 20px; }
  .tls-form-heading, .tls-results-heading { align-items: flex-start; flex-direction: column; padding-inline: 19px; }
  .tls-form-section { padding-inline: 19px; }
  .tls-field-grid, .tls-field-grid-target, .tls-custom-fields, .tls-delivery-grid { grid-template-columns: 1fr; }
  .tls-field-grid-target .tls-field-wide { grid-column: auto; }
  .tls-mode-grid { grid-template-columns: 1fr; }
  .tls-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tls-auth-title { align-items: flex-start; flex-wrap: wrap; }
  .tls-toggle { margin-left: 45px; }
  .tls-inline-warning { align-items: flex-start; flex-direction: column; }
  .tls-inline-warning span { text-align: left; }
  .tls-form-actions { align-items: stretch; flex-direction: column; padding-inline: 19px; }
  .tls-job-header, .tls-results-heading { align-items: flex-start; flex-direction: column; }
  .tls-job-steps { grid-template-columns: repeat(2, 1fr); row-gap: 10px; }
  .tls-result-actions { width: 100%; align-items: stretch; flex-direction: column; }
  .tls-result-actions .download-button { text-align: center; }
  .tls-summary-grid { grid-template-columns: repeat(2, 1fr); }
  .tls-probe-facts, .tls-certificate-evidence, .tls-chain-certificate-fields { grid-template-columns: 1fr; }
  .credential-warning { padding-inline: 15px; }
  .site-footer { grid-template-columns: 1fr; padding-inline: 0; }
  .footer-brand { grid-template-columns: 130px minmax(0, 1fr); }
  .footer-tools { justify-self: start; text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  .mailcheck-hover-video, .footer-brand-visual video, .tool-hero-video { display: none; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .captcha-professional.is-revoked { transform: none !important; }
}

@media (max-width: 780px) {
  .tool-intro-row { grid-template-columns: 1fr; margin-top: -4px; }
  .tool-intro-row > .mailcheck-visual-hero { width: min(100%, 540px); margin: 0 auto; }
  .tool-intro-row > .mailcheck-visual-hero img { height: auto; aspect-ratio: 1731 / 909; }
  .captcha-panel { grid-template-columns: 1fr; }
  .captcha-equation { flex-wrap: wrap; justify-content: flex-start; }
  .captcha-panel.is-god { grid-template-columns: 1fr; }
  .captcha-panel.is-professional .captcha-equation > span, .captcha-panel.is-god .captcha-equation > span { min-width: 0; max-width: none; flex-basis: 100%; text-align: left; }
  .captcha-panel.is-god .captcha-equation { justify-content: flex-start; }
  .captcha-panel.is-god .captcha-equation input { width: min(164px, calc(100vw - 126px)); min-width: 132px; }
  .captcha-professional.is-revoked { transform: none !important; }
  .captcha-status { margin-top: 0; line-height: 1.45; }
}

/* DNS & MX Inspector */
.dns-mx-main { max-width: 1110px; margin: 0 auto; padding-top: 24px; }
.dns-mx-visual-hero { max-height: none; }
.dns-mx-visual-hero img, .dns-mx-visual-hero .tool-hero-video { object-fit: cover; object-position: center; }
.dns-mx-hero { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 28px; margin-top: 14px; padding: 28px 30px; border: 1px solid rgba(83, 226, 255, .42); border-radius: 22px; background: linear-gradient(145deg, rgba(19, 49, 88, .97), rgba(8, 22, 50, .97)); box-shadow: 0 22px 65px rgba(0, 0, 0, .28); }
.dns-mx-hero h1 { max-width: 720px; margin: 0; color: #effaff; font-size: clamp(1.55rem, 2.6vw, 2.1rem); line-height: 1.1; }
.dns-mx-hero p:not(.section-kicker) { max-width: 800px; margin: 12px 0 0; color: #9cb3ce; font-size: .82rem; line-height: 1.62; }
.dns-mx-badges { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 17px; }
.dns-mx-badges span { padding: 6px 9px; border: 1px solid rgba(83, 226, 255, .26); border-radius: 999px; color: #9cecf8; background: rgba(5, 30, 58, .66); font-size: .58rem; font-weight: 800; letter-spacing: .06em; }
.dns-mx-form { margin-top: 19px; overflow: hidden; border: 1px solid rgba(83, 226, 255, .45); border-radius: 22px; background: linear-gradient(145deg, rgba(19, 46, 83, .98), rgba(8, 23, 51, .98)); box-shadow: 0 24px 70px rgba(0, 0, 0, .26); }
.dns-mx-form-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 21px 27px; border-bottom: 1px solid rgba(83, 226, 255, .2); background: rgba(18, 46, 83, .66); }
.dns-mx-form-heading h2 { margin: 0; color: #eaf8ff; font-size: 1.18rem; }
.dns-mx-form-heading > span { padding: 7px 10px; border-radius: 999px; color: #89f8ca; background: rgba(42, 189, 131, .13); font-size: .6rem; font-weight: 780; }
.dns-mx-primary-fields { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 14px; padding: 22px 27px; }
.dns-mx-field { display: grid; gap: 7px; min-width: 0; }
.dns-mx-field > span { color: #bed4e9; font-size: .68rem; font-weight: 760; }
.dns-mx-field input { width: 100%; min-height: 51px; border: 1px solid rgba(100, 184, 229, .38); border-radius: 13px; outline: 0; padding: 0 15px; color: #c9f8ff; background: rgba(4, 17, 39, .78); font: 650 .79rem var(--font-mono); }
.dns-mx-field input:focus { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(83, 226, 255, .1); }
.dns-mx-field small { color: #7790ae; font-size: .61rem; line-height: 1.45; }
.dns-mx-run { min-height: 51px; border: 0; border-radius: 13px; padding: 0 20px; color: #04141d; background: linear-gradient(135deg, #a5f5ff, #46dbf4); box-shadow: 0 13px 30px rgba(57, 213, 239, .18); cursor: pointer; font-size: .72rem; font-weight: 850; white-space: nowrap; }
.dns-mx-run span { margin-right: 6px; font-size: 1.1rem; }
.dns-mx-run:disabled { opacity: .58; cursor: wait; }
.dns-mx-inspect-action { display: grid; align-self: start; gap: 7px; }
.dns-mx-inspect-action > span { visibility: hidden; color: #bed4e9; font-size: .68rem; font-weight: 760; }
.dns-mx-advanced { margin: 0 27px 21px; border: 1px solid rgba(145, 99, 255, .3); border-radius: 15px; background: rgba(35, 21, 72, .26); }
.dns-mx-advanced summary { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 14px 16px; cursor: pointer; list-style: none; }
.dns-mx-advanced summary::-webkit-details-marker { display: none; }
.dns-mx-advanced summary b, .dns-mx-advanced summary small { display: block; }
.dns-mx-advanced summary b { color: #d9d0ff; font-size: .7rem; }
.dns-mx-advanced summary small { margin-top: 4px; color: #877da8; font-size: .59rem; line-height: 1.4; }
.dns-mx-advanced summary > span:last-child { color: #bd9cff; font-size: 1rem; transition: transform .2s ease; }
.dns-mx-advanced[open] summary > span:last-child { transform: rotate(45deg); }
.dns-mx-advanced-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; padding: 0 16px 16px; }
.dns-mx-form-foot { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 13px 27px; border-top: 1px solid rgba(83, 226, 255, .15); background: rgba(5, 19, 43, .66); }
.dns-mx-form-foot p { margin: 0; color: #718aa9; font-size: .61rem; line-height: 1.45; }
.dns-mx-form-foot p[data-state="error"] { color: #ff9db8; }
.dns-mx-job[hidden], .dns-mx-results[hidden], .dns-mx-recipient[hidden] { display: none; }
.dns-mx-job { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 20px; margin-top: 22px; padding: 22px 27px; border: 1px solid rgba(83, 226, 255, .52); border-radius: 20px; background: linear-gradient(145deg, rgba(18, 48, 86, .98), rgba(7, 22, 50, .98)); }
.dns-mx-job h2 { margin: 0; color: #eafbff; font-size: 1.2rem; }
.dns-mx-job p:not(.section-kicker) { margin: 6px 0 0; color: #8ba4c3; font-size: .69rem; }
.dns-mx-job > span { color: var(--cyan); font: 750 .7rem var(--font-mono); }
.dns-mx-job-track { grid-column: 1 / -1; height: 8px; margin-top: 8px; overflow: hidden; border-radius: 999px; background: #173252; }
.dns-mx-job-track span { display: block; width: 4%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #8c5cff, #54e9ff, #43efac); box-shadow: 0 0 16px rgba(83, 226, 255, .34); transition: width .35s ease; }
.dns-mx-job-steps { display: grid; grid-column: 1 / -1; grid-template-columns: repeat(7, 1fr); gap: 7px; margin-top: 5px; color: #617c9c; font-size: .56rem; font-weight: 750; text-align: center; }
.dns-mx-job-steps span.active { color: var(--cyan); }
.dns-mx-job-steps span.complete { color: var(--green); }
.dns-mx-recipient { display: grid; grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr) minmax(280px, .85fr) auto; align-items: end; gap: 15px; margin-top: 14px; padding: 18px; border: 1px solid rgba(171, 110, 255, .62); border-radius: 16px; background: linear-gradient(135deg, rgba(48, 28, 91, .72), rgba(7, 35, 65, .88)); box-shadow: inset 4px 0 #a36bff, 0 14px 40px rgba(4, 7, 26, .28); }
.dns-mx-recipient-copy h3 { margin: 2px 0 0; color: #f1ecff; font-size: .86rem; }
.dns-mx-recipient-copy p:not(.section-kicker) { max-width: 560px; margin: 7px 0 0; color: #9e98bc; font-size: .61rem; line-height: 1.5; }
.dns-mx-recipient .dns-mx-field b { color: #a8f3ff; font-family: var(--font-mono); }
.dns-mx-recipient .dns-mx-run { min-width: 170px; }
.dns-mx-recipient-status { grid-column: 1 / -1; margin: 0 !important; padding-top: 2px; color: #8d85ad !important; font-size: .57rem !important; }
.dns-mx-recipient-status[data-state="error"] { color: #ff9db8 !important; }
.dns-mx-results { margin-top: 28px; }
.dns-mx-results-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 23px 27px; border: 1px solid rgba(83, 226, 255, .46); border-radius: 20px; background: linear-gradient(145deg, rgba(20, 50, 88, .98), rgba(8, 23, 51, .98)); }
.dns-mx-results-heading h2 { margin: 0; color: #edfaff; font-size: 1.45rem; }
.dns-mx-results-heading p:not(.section-kicker) { margin: 6px 0 0; color: #88a3c2; font-size: .7rem; }
.dns-mx-result-actions { display: flex; align-items: center; gap: 9px; }
.dns-mx-result-actions button { min-height: 42px; border: 1px solid rgba(101, 173, 216, .34); border-radius: 11px; padding: 0 14px; color: #abc4df; background: rgba(5, 21, 46, .75); cursor: pointer; font-size: .65rem; font-weight: 750; }
.dns-mx-assessment { display: flex; align-items: center; gap: 15px; margin-top: 12px; padding: 18px 20px; border: 1px solid rgba(99, 174, 216, .3); border-radius: 16px; background: rgba(8, 29, 57, .91); }
.dns-mx-assessment.state-pass { border-color: rgba(67, 239, 172, .55); box-shadow: inset 4px 0 var(--green); }
.dns-mx-assessment.state-warn { border-color: rgba(255, 208, 106, .56); box-shadow: inset 4px 0 #ffd06a; }
.dns-mx-assessment.state-fail { border-color: rgba(255, 90, 136, .58); box-shadow: inset 4px 0 #ff668d; }
.dns-mx-assessment-icon { display: grid; flex: 0 0 auto; width: 40px; height: 40px; place-items: center; border-radius: 12px; color: #041713; background: var(--green); font: 850 1rem var(--font-mono); }
.state-warn .dns-mx-assessment-icon { color: #211705; background: #ffd06a; }
.state-fail .dns-mx-assessment-icon { color: #260711; background: #ff668d; }
.dns-mx-assessment strong { color: #e8f6ff; font-size: .88rem; }
.dns-mx-assessment p { margin: 5px 0 0; color: #91aac6; font-size: .68rem; line-height: 1.5; }
.dns-mx-summary-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 9px; margin-top: 10px; }
.dns-mx-summary-card { display: flex; align-items: center; gap: 10px; min-width: 0; min-height: 86px; padding: 13px; border: 1px solid rgba(101, 167, 210, .28); border-radius: 14px; background: rgba(8, 28, 56, .88); }
.dns-mx-summary-card.state-pass { border-color: rgba(67, 239, 172, .38); background: rgba(14, 82, 64, .22); }
.dns-mx-summary-card.state-warn, .dns-mx-summary-card.state-not_signed { border-color: rgba(255, 208, 106, .38); background: rgba(98, 66, 12, .2); }
.dns-mx-summary-card.state-fail { border-color: rgba(255, 90, 136, .42); background: rgba(98, 15, 41, .22); }
.dns-mx-summary-icon { display: grid; flex: 0 0 auto; width: 28px; height: 28px; place-items: center; border-radius: 9px; color: #061a14; background: var(--green); font: 850 .72rem var(--font-mono); }
.state-warn .dns-mx-summary-icon, .state-not_signed .dns-mx-summary-icon { color: #211705; background: #ffd06a; }
.state-fail .dns-mx-summary-icon { color: #280813; background: #ff668d; }
.dns-mx-summary-card strong, .dns-mx-summary-card small { display: block; min-width: 0; }
.dns-mx-summary-card strong { color: #daecfa; font-size: .68rem; }
.dns-mx-summary-card small { display: -webkit-box; margin-top: 4px; overflow: hidden; color: #6f89a8; font-size: .56rem; line-height: 1.38; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.dns-mx-accordion { display: grid; gap: 10px; margin-top: 17px; }
.dns-mx-result-section { overflow: hidden; border: 1px solid rgba(101, 174, 216, .32); border-radius: 17px; background: linear-gradient(145deg, rgba(18, 43, 77, .96), rgba(7, 22, 47, .96)); }
.dns-mx-result-section[open] { border-color: rgba(83, 226, 255, .48); }
.dns-mx-result-section > summary { display: flex; align-items: center; justify-content: space-between; gap: 17px; min-height: 66px; padding: 14px 18px; cursor: pointer; list-style: none; }
.dns-mx-result-section > summary::-webkit-details-marker { display: none; }
.dns-mx-result-section > summary b, .dns-mx-result-section > summary small { display: block; }
.dns-mx-result-section > summary b { color: #dceef9; font-size: .76rem; }
.dns-mx-result-section > summary small { max-width: 720px; margin-top: 4px; color: #738dab; font-size: .59rem; line-height: 1.4; }
.dns-mx-result-state { flex: 0 0 auto; padding: 6px 9px; border-radius: 999px; color: #a8bfd5; background: rgba(106, 143, 174, .15); font-size: .55rem; font-weight: 830; text-transform: uppercase; }
.dns-mx-result-state.state-pass { color: #85f7c3; background: rgba(39, 181, 124, .17); }
.dns-mx-result-state.state-warn, .dns-mx-result-state.state-not_signed { color: #ffdb82; background: rgba(208, 145, 22, .18); }
.dns-mx-result-state.state-fail { color: #ff9db8; background: rgba(220, 49, 94, .2); }
.dns-mx-section-body { padding: 3px 18px 18px; border-top: 1px solid rgba(83, 226, 255, .13); }
.dns-mx-notice { margin-top: 15px; padding: 13px 15px; border: 1px solid rgba(101, 174, 216, .3); border-radius: 12px; background: rgba(5, 20, 43, .72); }
.dns-mx-notice.state-pass { border-color: rgba(67, 239, 172, .4); background: rgba(14, 76, 61, .22); }
.dns-mx-notice.state-warn, .dns-mx-notice.state-not_signed { border-color: rgba(255, 208, 106, .4); background: rgba(89, 60, 11, .2); }
.dns-mx-notice.state-fail { border-color: rgba(255, 90, 136, .44); background: rgba(91, 13, 37, .22); }
.dns-mx-notice strong { color: #e4f3fc; font-size: .7rem; }
.dns-mx-notice p { margin: 5px 0 0; color: #8fa8c5; font-size: .64rem; line-height: 1.5; }
.dns-mx-mx-grid, .dns-mx-auth-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 11px; }
.dns-mx-auth-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dns-mx-mx-card, .dns-mx-auth-card, .dns-mx-soa-table article { min-width: 0; overflow: hidden; border: 1px solid rgba(101, 170, 211, .28); border-radius: 14px; background: rgba(10, 31, 59, .88); }
.dns-mx-mx-card.state-pass, .dns-mx-auth-card.state-pass, .dns-mx-soa-table article.state-pass { border-color: rgba(67, 239, 172, .46); box-shadow: inset 3px 0 var(--green); }
.dns-mx-mx-card.state-warn, .dns-mx-auth-card.state-warn, .dns-mx-soa-table article.state-warn { border-color: rgba(255, 208, 106, .48); box-shadow: inset 3px 0 #ffd06a; }
.dns-mx-mx-card.state-fail, .dns-mx-auth-card.state-fail, .dns-mx-soa-table article.state-fail { border-color: rgba(255, 90, 136, .5); box-shadow: inset 3px 0 #ff668d; }
.dns-mx-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 14px; border-bottom: 1px solid rgba(83, 226, 255, .12); background: rgba(17, 43, 76, .58); }
.dns-mx-card-head > div { min-width: 0; }
.dns-mx-card-head strong, .dns-mx-card-head small { display: block; overflow: hidden; text-overflow: ellipsis; }
.dns-mx-card-head strong { color: #e0effa; font-size: .71rem; }
.dns-mx-card-head small { margin-top: 4px; color: #6e89a8; font: .55rem var(--font-mono); white-space: nowrap; }
.dns-mx-card-summary { margin: 0; padding: 11px 14px 0; color: #8fa7c2; font-size: .62rem; line-height: 1.5; }
.dns-mx-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; padding: 12px 14px 14px; }
.dns-mx-facts.compact { padding-top: 11px; }
.dns-mx-fact { min-width: 0; padding: 9px 10px; border: 1px solid rgba(101, 167, 210, .17); border-radius: 9px; background: rgba(3, 15, 34, .54); }
.dns-mx-fact.wide { grid-column: 1 / -1; }
.dns-mx-fact.state-pass { border-color: rgba(67, 239, 172, .42); background: rgba(18, 92, 75, .22); box-shadow: inset 3px 0 var(--green); }
.dns-mx-fact.state-warn { border-color: rgba(255, 208, 106, .44); background: rgba(112, 78, 17, .21); box-shadow: inset 3px 0 #ffd06a; }
.dns-mx-fact.state-fail { border-color: rgba(255, 90, 136, .46); background: rgba(107, 25, 56, .22); box-shadow: inset 3px 0 #ff668d; }
.dns-mx-fact span, .dns-mx-fact strong { display: block; }
.dns-mx-fact span { color: #6985a5; font-size: .5rem; font-weight: 780; letter-spacing: .04em; text-transform: uppercase; }
.dns-mx-fact strong { margin-top: 4px; color: #b8cee1; font: 620 .58rem/1.42 var(--font-mono); overflow-wrap: anywhere; }
.dns-mx-fact.state-pass strong { color: #80f5c1; }
.dns-mx-fact.state-warn strong { color: #ffe08f; }
.dns-mx-fact.state-fail strong { color: #ff91ae; }
.dns-mx-evidence-details { border-top: 1px solid rgba(83, 226, 255, .11); }
.dns-mx-evidence-details > summary { padding: 10px 14px; color: #72dbe9; cursor: pointer; font-size: .58rem; font-weight: 720; }
.dns-mx-evidence-body { display: grid; gap: 7px; padding: 0 14px 13px; }
.dns-mx-code-evidence { min-width: 0; padding: 9px 10px; border: 1px solid rgba(98, 162, 203, .16); border-radius: 9px; background: rgba(2, 11, 27, .65); }
.dns-mx-code-evidence span, .dns-mx-code-evidence code { display: block; }
.dns-mx-code-evidence span { color: #64819f; font-size: .49rem; font-weight: 760; letter-spacing: .04em; text-transform: uppercase; }
.dns-mx-code-evidence code { margin-top: 5px; color: #9fc6d9; font-size: .55rem; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.dns-mx-auth-card { padding-bottom: 13px; }
.dns-mx-auth-card .dns-mx-code-evidence { margin: 0 14px; }
.dns-mx-selector-list { display: grid; gap: 5px; margin: 11px 14px; }
.dns-mx-selector-list > div { display: flex; justify-content: space-between; gap: 10px; padding: 7px 9px; border: 1px solid rgba(103, 167, 207, .15); border-radius: 8px; background: rgba(3, 14, 32, .5); }
.dns-mx-selector-list strong { color: #b7d6e5; font: .56rem var(--font-mono); }
.dns-mx-selector-list span { color: #6f89a7; font-size: .52rem; text-align: right; }
.dns-mx-selector-list .state-pass { border-color: rgba(67, 239, 172, .32); }
.dns-mx-selector-list .state-pass span { color: #7be9b7; }
.dns-mx-method-note { margin: 11px 2px 0; color: #7189a5; font-size: .57rem; line-height: 1.5; }
.dns-mx-auth-card .dns-mx-method-note { margin-inline: 14px; }
.dns-mx-soa-table { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-top: 11px; }
.dns-mx-soa-analysis, .dns-mx-ttl-analysis { margin-top: 12px; padding: 0 14px 14px; border: 1px solid rgba(83, 226, 255, .17); border-radius: 14px; background: rgba(2, 12, 31, .48); }
.dns-mx-soa-analysis > .dns-mx-notice, .dns-mx-ttl-analysis > .dns-mx-notice { margin-inline: -3px; }
.dns-mx-soa-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin-top: 10px; }
.dns-mx-soa-checks article { min-width: 0; padding: 11px 12px; border: 1px solid rgba(101, 167, 210, .18); border-radius: 10px; background: rgba(5, 20, 43, .68); }
.dns-mx-soa-checks article.state-pass { border-color: rgba(67, 239, 172, .32); box-shadow: inset 3px 0 var(--green); }
.dns-mx-soa-checks article.state-warn { border-color: rgba(255, 208, 106, .4); box-shadow: inset 3px 0 #ffd06a; }
.dns-mx-soa-checks article.state-fail { border-color: rgba(255, 90, 136, .42); box-shadow: inset 3px 0 #ff668d; }
.dns-mx-soa-checks article > div { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.dns-mx-soa-checks strong { color: #d8ebf8; font-size: .64rem; }
.dns-mx-soa-checks span { flex: 0 0 auto; color: #6fddeb; font: .49rem var(--font-mono); text-align: right; }
.dns-mx-soa-checks p { margin: 6px 0 0; color: #7f98b5; font-size: .57rem; line-height: 1.5; }
.dns-mx-rfc-links { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; }
.dns-mx-rfc-links > span { margin-right: 3px; color: #6d87a6; font-size: .52rem; font-weight: 740; text-transform: uppercase; }
.dns-mx-rfc-links a { padding: 5px 7px; border: 1px solid rgba(83, 226, 255, .23); border-radius: 999px; color: #91e9f4; background: rgba(8, 42, 67, .55); font: 670 .5rem var(--font-mono); text-decoration: none; }
.dns-mx-rfc-links a:hover { border-color: rgba(83, 226, 255, .6); color: #e2fcff; }
.dns-mx-ttl-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; margin-top: 10px; }
.dns-mx-ttl-grid article { min-width: 0; padding: 11px 12px; border: 1px solid rgba(101, 167, 210, .2); border-radius: 10px; background: linear-gradient(145deg, rgba(10, 34, 61, .82), rgba(3, 16, 36, .82)); }
.dns-mx-ttl-grid article.state-pass { border-color: rgba(67, 239, 172, .28); }
.dns-mx-ttl-grid article.state-warn { border-color: rgba(255, 208, 106, .4); box-shadow: inset 3px 0 #ffd06a; }
.dns-mx-ttl-grid article > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.dns-mx-ttl-grid span { color: var(--cyan); font: 760 .54rem var(--font-mono); }
.dns-mx-ttl-grid b { padding: 4px 6px; border-radius: 999px; color: #9bb4cf; background: rgba(105, 137, 174, .13); font-size: .46rem; text-transform: uppercase; }
.dns-mx-ttl-grid strong { display: block; margin-top: 10px; color: #e3f4ff; font-size: .79rem; }
.dns-mx-ttl-grid small { display: block; margin-top: 3px; color: #64809e; font: .5rem var(--font-mono); }
.dns-mx-ttl-grid p { margin: 8px 0 0; color: #7991ae; font-size: .54rem; line-height: 1.46; }
.dns-mx-ttl-analysis > .dns-mx-code-evidence { margin-top: 10px; }
.dns-mx-record-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 11px; }
.dns-mx-record-grid article { min-width: 0; padding: 12px 13px; border: 1px solid rgba(101, 169, 210, .22); border-radius: 11px; background: rgba(5, 20, 43, .7); }
.dns-mx-record-grid strong { display: block; margin-bottom: 8px; color: var(--cyan); font-size: .58rem; }
.dns-mx-record-grid code, .dns-mx-record-grid span { display: block; margin-top: 5px; color: #99b5ce; font-size: .56rem; line-height: 1.47; overflow-wrap: anywhere; }

@media (max-width: 940px) {
  .dns-mx-hero { grid-template-columns: 1fr; }
  .dns-mx-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dns-mx-auth-grid { grid-template-columns: 1fr; }
  .dns-mx-ttl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .dns-mx-main { padding-top: 0; }
  .dns-mx-visual-hero { max-height: none; }
  .dns-mx-hero { padding: 23px 20px; }
  .dns-mx-form-heading, .dns-mx-primary-fields, .dns-mx-results-heading { align-items: stretch; grid-template-columns: 1fr; flex-direction: column; padding-inline: 18px; }
  .dns-mx-primary-fields { display: grid; }
  .dns-mx-inspect-action { gap: 0; }
  .dns-mx-inspect-action > span { display: none; }
  .dns-mx-advanced { margin-inline: 18px; }
  .dns-mx-advanced-grid, .dns-mx-mx-grid, .dns-mx-soa-table, .dns-mx-soa-checks, .dns-mx-ttl-grid, .dns-mx-record-grid { grid-template-columns: 1fr; }
  .dns-mx-form-foot { align-items: flex-start; flex-direction: column; padding-inline: 18px; }
  .dns-mx-job { grid-template-columns: 1fr; padding-inline: 19px; }
  .dns-mx-job > span { grid-row: 2; }
  .dns-mx-job-track, .dns-mx-job-steps { grid-column: 1; }
  .dns-mx-job-steps { grid-template-columns: repeat(3, 1fr); row-gap: 9px; }
  .dns-mx-recipient { grid-column: 1; grid-template-columns: 1fr; padding: 16px; }
  .dns-mx-recipient-status { grid-column: 1; }
  .dns-mx-result-actions { width: 100%; align-items: stretch; flex-direction: column; }
  .dns-mx-result-actions .download-button { text-align: center; }
  .dns-mx-summary-grid { grid-template-columns: 1fr; }
  .dns-mx-result-section > summary { align-items: flex-start; }
  .dns-mx-facts { grid-template-columns: 1fr; }
  .dns-mx-fact.wide { grid-column: auto; }
}

/* Blacklist Scanner */
.blacklist-visual-hero img, .blacklist-visual-hero .tool-hero-video { object-position: center; }
.blacklist-hero { border-color: rgba(174, 88, 255, .44); background: linear-gradient(145deg, rgba(31, 37, 86, .98), rgba(9, 21, 50, .98)); }
.blacklist-form { border-color: rgba(118, 204, 255, .48); }
.blacklist-mode-fieldset { margin: 0; padding: 0 27px 18px; border: 0; }
.blacklist-mode-fieldset > legend { width: 100%; margin-bottom: 8px; color: #7792b2; font-size: .55rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.blacklist-mode-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.blacklist-mode-grid label { position: relative; cursor: pointer; }
.blacklist-mode-grid input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.blacklist-mode-grid label > span { display: grid; min-height: 76px; align-content: center; gap: 5px; padding: 13px 15px; border: 1px solid rgba(105, 167, 210, .22); border-radius: 13px; background: rgba(4, 16, 39, .7); transition: .18s ease; }
.blacklist-mode-grid b { color: #c7d9ec; font-size: .68rem; }
.blacklist-mode-grid small { color: #6d86a5; font-size: .56rem; line-height: 1.45; }
.blacklist-mode-grid input:checked + span { border-color: var(--cyan); background: linear-gradient(145deg, rgba(14, 84, 113, .34), rgba(21, 37, 78, .9)); box-shadow: inset 3px 0 var(--cyan), 0 0 22px rgba(83, 226, 255, .07); }
.blacklist-mode-grid input:checked + span b { color: #e8fcff; }
.blacklist-mode-grid input:focus-visible + span { outline: 2px solid white; outline-offset: 2px; }
.blacklist-primary-fields { padding-bottom: 17px; }
.blacklist-advanced-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .72fr); align-items: stretch; gap: 14px; padding: 0 27px 18px; }
.blacklist-advanced-fields[hidden], [data-blacklist-spf-section][hidden] { display: none; }
.blacklist-advanced-fields .dns-mx-field { padding: 0; }
.blacklist-advanced-fields em { color: #728aa7; font-size: .52rem; font-style: normal; font-weight: 550; }
.blacklist-advanced-fields aside { display: grid; align-content: center; gap: 5px; min-height: 64px; padding: 12px 14px; border: 1px solid rgba(255, 205, 91, .3); border-radius: 13px; background: rgba(74, 53, 11, .2); }
.blacklist-advanced-fields aside b { color: #f3d684; font-size: .62rem; }
.blacklist-advanced-fields aside small { color: #a79363; font-size: .54rem; line-height: 1.48; }
.blacklist-delivery-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr); align-items: center; gap: 14px; padding: 0 27px 22px; }
.blacklist-toggle { display: flex; align-items: center; gap: 11px; min-height: 64px; padding: 11px 14px; border: 1px solid rgba(121, 172, 219, .27); border-radius: 13px; background: rgba(5, 20, 45, .7); cursor: pointer; }
.blacklist-toggle input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
.blacklist-toggle-control { position: relative; flex: 0 0 auto; width: 38px; height: 22px; border: 1px solid rgba(115, 159, 210, .5); border-radius: 999px; background: rgba(54, 77, 118, .68); transition: .2s ease; }
.blacklist-toggle-control::after { position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: #91aac6; content: ""; transition: .2s ease; }
.blacklist-toggle input:checked + .blacklist-toggle-control { border-color: rgba(67, 239, 172, .58); background: rgba(31, 147, 104, .45); }
.blacklist-toggle input:checked + .blacklist-toggle-control::after { left: 19px; background: var(--green); box-shadow: 0 0 12px rgba(67, 239, 172, .45); }
.blacklist-toggle input:focus-visible + .blacklist-toggle-control { outline: 3px solid rgba(83, 226, 255, .2); outline-offset: 2px; }
.blacklist-toggle b, .blacklist-toggle small { display: block; }
.blacklist-toggle b { color: #c8dced; font-size: .65rem; }
.blacklist-toggle small { margin-top: 4px; color: #708aa9; font-size: .56rem; line-height: 1.4; }
.blacklist-job-steps { grid-template-columns: repeat(6, 1fr); }
.blacklist-summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.blacklist-ptr-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 11px; }
.blacklist-range-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.blacklist-range-card { min-width: 0; padding: 13px; border: 1px solid rgba(94, 163, 210, .25); border-radius: 12px; background: rgba(4, 18, 41, .7); }
.blacklist-range-card.state-pass { border-color: rgba(67, 239, 172, .28); }
.blacklist-range-card.state-warn { border-color: rgba(255, 201, 84, .38); }
.blacklist-range-card .dns-mx-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 10px 0 0; }
.blacklist-spf-records { margin-top: 13px; }
.blacklist-spf-record { display: grid; grid-template-columns: minmax(130px, .45fr) minmax(120px, .45fr) minmax(0, 1.5fr); gap: 9px; align-items: start; padding: 9px 10px; border-bottom: 1px solid rgba(89, 145, 191, .13); }
.blacklist-spf-record strong { color: #b9e8ef; font: 650 .56rem/1.4 var(--font-mono); overflow-wrap: anywhere; }
.blacklist-spf-record small { color: #6f8aa7; font-size: .52rem; }
.blacklist-spf-record code { color: #94acc6; font: .52rem/1.45 var(--font-mono); overflow-wrap: anywhere; }
.blacklist-listing-evidence { display: grid; gap: 8px; margin-top: 14px; }
.blacklist-listing-evidence h3 { margin: 0; color: #dcecff; font-size: .69rem; }
.blacklist-listing-evidence > p { margin: 0; color: #7f96b2; font-size: .58rem; line-height: 1.55; }
.blacklist-listing-card { display: grid; grid-template-columns: minmax(150px, .7fr) minmax(200px, 1.2fr); gap: 5px 12px; padding: 11px 12px; border: 1px solid rgba(255, 93, 137, .43); border-radius: 10px; background: rgba(78, 17, 42, .28); }
.blacklist-listing-card strong { color: #ff9ab6; font: 700 .58rem/1.4 var(--font-mono); }
.blacklist-listing-card code { color: #8ec3db; font: .52rem/1.4 var(--font-mono); overflow-wrap: anywhere; }
.blacklist-listing-card span, .blacklist-listing-card small { grid-column: 1 / -1; color: #c4a6b4; font-size: .53rem; overflow-wrap: anywhere; }
.blacklist-resolution-facts { margin-top: 11px; padding-inline: 0; }
.blacklist-query-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px 10px; padding: 9px 10px; border: 1px solid rgba(98, 162, 203, .16); border-radius: 9px; background: rgba(2, 11, 27, .65); }
.blacklist-query-row code { color: #9fc6d9; font: .55rem/1.4 var(--font-mono); overflow-wrap: anywhere; }
.blacklist-query-row span { align-self: start; padding: 4px 6px; border-radius: 999px; font-size: .49rem; font-weight: 800; text-transform: uppercase; }
.blacklist-query-row span.state-pass { color: #83f6c2; background: rgba(39, 181, 124, .17); }
.blacklist-query-row span.state-warn { color: #ffda81; background: rgba(208, 145, 22, .18); }
.blacklist-query-row small { grid-column: 1 / -1; color: #6f89a7; font-size: .52rem; overflow-wrap: anywhere; }
.blacklist-rbl-results { margin-top: 0; }
.blacklist-results .rbl-state-listed { border-color: rgba(255, 85, 132, .5); }
.blacklist-results .rbl-state-clean { border-color: rgba(71, 239, 176, .25); background: rgba(7, 42, 43, .42); }
.blacklist-results .rbl-state-partial, .blacklist-results .rbl-state-unavailable, .blacklist-results .rbl-state-timeout { border-color: rgba(255, 201, 84, .3); background: rgba(71, 53, 15, .24); }

@media (max-width: 940px) {
  .blacklist-advanced-fields, .blacklist-delivery-grid { grid-template-columns: 1fr; }
  .blacklist-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .blacklist-mode-fieldset, .blacklist-advanced-fields, .blacklist-delivery-grid { padding-inline: 18px; }
  .blacklist-mode-grid, .blacklist-summary-grid, .blacklist-ptr-grid, .blacklist-range-grid { grid-template-columns: 1fr; }
  .blacklist-spf-record, .blacklist-listing-card { grid-template-columns: 1fr; }
  .blacklist-job-steps { grid-template-columns: repeat(3, 1fr); }
}

/* WHOIS and RDAP registration lookup */
.whois-visual-hero img, .whois-visual-hero .tool-hero-video { object-position: center; }
.whois-hero { border-color: rgba(181, 91, 255, .48); background: linear-gradient(145deg, rgba(39, 34, 91, .98), rgba(8, 23, 52, .98)); }
.whois-form { border-color: rgba(139, 116, 255, .5); }
.whois-primary-fields { padding-bottom: 17px; }
.whois-job-steps { grid-template-columns: repeat(5, 1fr); }
.whois-summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.whois-facts { margin-top: 11px; padding-inline: 0; }
.whois-nameserver-panel { margin-top: 12px; padding: 14px 16px 16px; border: 1px solid rgba(67, 239, 172, .42); border-radius: 13px; background: linear-gradient(135deg, rgba(18, 92, 75, .25), rgba(3, 20, 41, .68)); box-shadow: inset 3px 0 var(--green); }
.whois-nameserver-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.whois-nameserver-heading h3 { margin: 0; color: #dff9ee; font-size: .71rem; }
.whois-nameserver-heading p { margin: 4px 0 0; color: #83a99d; font-size: .57rem; line-height: 1.45; }
.whois-nameserver-count { display: grid; flex: 0 0 32px; width: 32px; height: 32px; place-items: center; border: 1px solid rgba(67, 239, 172, .55); border-radius: 50%; background: rgba(16, 105, 82, .38); color: #75f2bb; font: 740 .64rem var(--font-mono); }
.whois-nameserver-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px; margin: 13px 0 0; padding: 0; list-style: none; }
.whois-nameserver-list li { display: flex; min-width: 0; align-items: center; gap: 9px; padding: 10px 11px; border: 1px solid rgba(83, 226, 255, .23); border-radius: 9px; background: rgba(2, 15, 34, .56); }
.whois-nameserver-list strong { color: #bcebf0; font: 650 .59rem/1.4 var(--font-mono); overflow-wrap: anywhere; }
.whois-nameserver-dot { display: grid; flex: 0 0 21px; width: 21px; height: 21px; place-items: center; border-radius: 50%; background: rgba(67, 239, 172, .16); color: #60edb0; font-size: .52rem; }
.whois-nameserver-empty { margin: 13px 0 0; padding: 10px 11px; border: 1px solid rgba(255, 208, 106, .31); border-radius: 9px; background: rgba(91, 63, 13, .18); color: #d4bd81; font-size: .58rem; }
.whois-contact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.whois-contact-card .dns-mx-card-head { min-height: 70px; }
.whois-contact-card .dns-mx-facts { padding-top: 13px; }
.whois-redaction-note { margin-top: 12px; padding: 14px 16px; border: 1px solid rgba(255, 208, 106, .46); border-radius: 13px; background: rgba(91, 63, 13, .24); }
.whois-redaction-note strong { color: #ffe092; font-size: .69rem; }
.whois-redaction-note ul { display: grid; gap: 6px; margin: 9px 0 0; padding-left: 18px; color: #a99266; font-size: .6rem; line-height: 1.5; }
.dns-mx-assessment.state-info { border-color: rgba(83, 226, 255, .5); box-shadow: inset 4px 0 var(--cyan); }
.state-info .dns-mx-assessment-icon { color: #04171d; background: var(--cyan); }
.dns-mx-summary-card.state-info { border-color: rgba(83, 226, 255, .38); background: rgba(12, 67, 91, .22); }
.state-info .dns-mx-summary-icon { color: #04171d; background: var(--cyan); }
.dns-mx-result-state.state-info, .dns-mx-result-state.state-not_configured { color: #9aeeff; background: rgba(53, 170, 199, .17); }
.dns-mx-notice.state-info, .dns-mx-notice.state-not_configured { border-color: rgba(83, 226, 255, .4); background: rgba(9, 63, 81, .22); }
.dns-mx-auth-card.state-not_configured { border-color: rgba(83, 226, 255, .32); box-shadow: inset 3px 0 rgba(83, 226, 255, .7); }

@media (max-width: 940px) {
  .whois-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .whois-summary-grid, .whois-contact-grid { grid-template-columns: 1fr; }
  .whois-job-steps { grid-template-columns: repeat(3, 1fr); }
}

/* Network Diagnostics */
.network-visual-hero { border-color: rgba(255, 178, 75, .48); }
.network-visual-hero img, .network-visual-hero .tool-hero-video { object-position: center; }
.network-hero { border-color: rgba(255, 178, 75, .48); background: linear-gradient(145deg, rgba(39, 38, 91, .98), rgba(8, 25, 52, .98)); }
.network-form { border-color: rgba(255, 178, 75, .46); }
.network-run { background: linear-gradient(135deg, #a5f5ff, #ffd06a); box-shadow: 0 13px 30px rgba(255, 178, 75, .17); }
.network-scope-note { display: flex; align-items: center; gap: 13px; margin: 0 27px 21px; padding: 13px 15px; border: 1px solid rgba(255, 208, 106, .38); border-radius: 13px; background: rgba(82, 58, 13, .2); }
.network-scope-note > span { display: grid; flex: 0 0 34px; width: 34px; height: 34px; place-items: center; border-radius: 11px; color: #1b1304; background: #ffd06a; font: 850 1rem var(--font-mono); }
.network-scope-note p { margin: 0; color: #ac9b77; font-size: .6rem; line-height: 1.5; }
.network-scope-note strong { display: block; margin-bottom: 3px; color: #ffe5a6; font-size: .66rem; }
.network-job-steps { grid-template-columns: repeat(8, 1fr); }
.network-job-hop { grid-column: 1 / -1; color: var(--cyan); font: 750 .62rem var(--font-mono); letter-spacing: .04em; text-align: center; }
.network-job-hop[hidden] { display: none; }
.network-summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.network-summary-grid .dns-mx-summary-card { display: grid; grid-template-columns: minmax(66px, max-content) minmax(0, 1fr); }
.network-summary-grid .dns-mx-summary-card > div { min-width: 0; }
.network-summary-grid .dns-mx-summary-icon { width: auto; min-width: 66px; max-width: 118px; height: 38px; padding: 0 10px; white-space: nowrap; font-size: .58rem; line-height: 1; }
.network-facts { margin-top: 11px; padding-inline: 0; }
.network-tester-card { display: flex; align-items: center; gap: 13px; margin-top: 11px; padding: 14px 15px; border: 1px solid rgba(83, 226, 255, .36); border-radius: 13px; background: rgba(7, 49, 70, .25); }
.network-tester-icon { display: grid; flex: 0 0 40px; width: 40px; height: 40px; place-items: center; border-radius: 12px; color: #04171d; background: var(--cyan); font: 850 .54rem var(--font-mono); }
.network-tester-card strong { color: #d8f6fb; font-size: .68rem; }
.network-tester-card p { margin: 5px 0 0; color: #7797b2; font-size: .59rem; line-height: 1.45; }
.network-service-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 11px; }
.network-service-card { min-width: 0; overflow: hidden; border: 1px solid rgba(101, 170, 211, .28); border-radius: 14px; background: rgba(10, 31, 59, .88); }
.network-service-card.state-pass { border-color: rgba(67, 239, 172, .5); box-shadow: inset 3px 0 var(--green); }
.network-service-card.state-warn { border-color: rgba(255, 208, 106, .5); box-shadow: inset 3px 0 #ffd06a; }
.network-service-card.state-info { border-color: rgba(95, 156, 202, .3); box-shadow: inset 3px 0 #4f7fa8; }
.network-service-card.state-fail { border-color: rgba(255, 90, 136, .5); box-shadow: inset 3px 0 #ff668d; }
.network-service-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 58px; padding: 12px 14px; border-bottom: 1px solid rgba(83, 226, 255, .12); background: rgba(17, 43, 76, .58); }
.network-service-head strong, .network-service-head small { display: block; }
.network-service-head strong { color: #e0effa; font-size: .71rem; }
.network-service-head small { margin-top: 4px; color: #6e89a8; font: .55rem var(--font-mono); }
.network-service-pill { flex: 0 0 auto; padding: 6px 8px; border-radius: 999px; color: #a8bfd5; background: rgba(106, 143, 174, .15); font-size: .5rem; font-weight: 830; text-transform: uppercase; }
.network-service-pill.state-pass { color: #85f7c3; background: rgba(39, 181, 124, .18); }
.network-service-pill.state-warn { color: #ffdb82; background: rgba(208, 145, 22, .2); }
.network-service-pill.state-fail { color: #ff9db8; background: rgba(220, 49, 94, .2); }
.network-service-detail { margin: 0; padding: 11px 14px 0; color: #8fa7c2; font-size: .61rem; line-height: 1.5; }
.network-preview { margin: 13px 0 0; overflow: hidden; border: 1px solid rgba(83, 226, 255, .35); border-radius: 15px; background: #02071a; }
.network-preview img { display: block; width: 100%; height: auto; aspect-ratio: 8 / 5; object-fit: contain; }
.network-preview figcaption { padding: 9px 12px; border-top: 1px solid rgba(83, 226, 255, .15); color: #718ba9; background: rgba(7, 24, 50, .92); font-size: .54rem; line-height: 1.45; }
.network-route-list { display: grid; gap: 7px; margin-top: 11px; }
.network-route-hop { display: grid; grid-template-columns: 35px minmax(0, 1fr) 96px; align-items: center; gap: 10px; min-height: 44px; padding: 7px 11px; border: 1px solid rgba(101, 170, 211, .2); border-radius: 10px; background: rgba(3, 16, 36, .62); }
.network-hop-number { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid rgba(83, 226, 255, .42); border-radius: 50%; color: var(--cyan); background: rgba(21, 91, 115, .24); font: 750 .57rem var(--font-mono); }
.network-route-hop code { color: #b7d8e4; font: .59rem var(--font-mono); overflow-wrap: anywhere; }
.network-hop-identity { min-width: 0; }
.network-hop-identity code, .network-hop-identity small { display: block; }
.network-hop-identity small { margin-top: 3px; overflow: hidden; color: #708ba7; font-size: .49rem; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.network-hop-rtt { color: #82efc0; font: .56rem var(--font-mono); text-align: right; }
.network-route-empty { margin: 11px 0 0; padding: 11px 13px; border: 1px solid rgba(255, 208, 106, .3); border-radius: 10px; color: #c5ab70; background: rgba(85, 58, 10, .18); font-size: .59rem; }
.network-route-map-mount { margin-top: 12px; }
.network-route-map-panel { overflow: hidden; border: 1px solid rgba(82, 231, 255, .23); border-radius: 15px; background: rgba(2, 13, 31, .72); }
.network-route-map-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 13px 15px; border-bottom: 1px solid rgba(87, 172, 218, .17); background: rgba(11, 35, 67, .72); }
.network-route-map-heading span, .network-route-map-heading strong { display: block; }
.network-route-map-heading span { color: #59e9ff; font: 760 .52rem var(--font-mono); letter-spacing: .08em; text-transform: uppercase; }
.network-route-map-heading strong { max-width: 690px; margin-top: 5px; color: #dcecf8; font-size: .65rem; line-height: 1.4; }
.network-route-map-heading > small { max-width: 330px; color: #718ba7; font-size: .52rem; line-height: 1.45; text-align: right; }
.network-world-map { margin: 14px; }
.network-world-map .header-map-empty { z-index: 2; }
.network-world-map > svg { cursor: grab; user-select: none; touch-action: none; }
.network-world-map > svg.is-dragging { cursor: grabbing; }
.network-map-hop circle { fill: var(--route-colour, #045f89); filter: drop-shadow(0 0 10px var(--route-colour, #52e7ff)); }
.network-map-hop.is-cluster circle { fill: #123d67; stroke-width: 3.5; }
.network-map-hop.is-cluster > text:not(.network-map-hop-time) { font-size: 10.5px; }
.header-map-marker text.network-map-hop-time { fill: var(--route-colour, #a785ff); stroke-width: 2.2px; font: 850 10.5px var(--font-mono); letter-spacing: 0; }
.network-route-timeline { border-top: 1px solid rgba(82, 231, 255, .2); background: linear-gradient(180deg, rgba(5, 22, 45, .98), rgba(3, 14, 32, .98)); }
.network-route-timeline-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 12px 15px 9px; }
.network-route-timeline-heading span, .network-route-timeline-heading strong { display: block; }
.network-route-timeline-heading span { color: #59e9ff; font: 760 .45rem var(--font-mono); letter-spacing: .08em; text-transform: uppercase; }
.network-route-timeline-heading strong { margin-top: 4px; color: #e8f7ff; font-size: .62rem; }
.network-route-timeline-heading small { max-width: 480px; color: #7893ad; font-size: .48rem; line-height: 1.45; text-align: right; }
.network-route-timeline-scroll { overflow-x: auto; overflow-y: hidden; padding: 0 0 4px; scrollbar-color: rgba(82, 231, 255, .5) rgba(3, 14, 32, .8); scrollbar-width: thin; }
.network-route-timeline-scroll:focus-visible { outline: 2px solid rgba(82, 231, 255, .8); outline-offset: -2px; }
.header-world-map .network-route-timeline-scroll > svg { display: block; width: auto; min-width: 100%; max-width: none; height: 178px; aspect-ratio: auto; }
.network-route-timeline-line { stroke: var(--route-colour, #a785ff); stroke-width: 4; stroke-linecap: round; filter: drop-shadow(0 0 5px var(--route-colour, #a785ff)); opacity: .86; }
.network-route-timeline-arrowhead { fill: #eefdff; }
.network-route-timeline-moving-arrow { fill: var(--route-colour, #a785ff); stroke: #fff; stroke-width: 1.4; filter: drop-shadow(0 0 7px var(--route-colour, #a785ff)); pointer-events: none; }
.network-route-timeline-node circle { fill: #073451; stroke: var(--route-colour, #52e7ff); stroke-width: 3; filter: drop-shadow(0 0 8px var(--route-colour, #52e7ff)); }
.network-route-timeline-node.is-origin circle { fill: #07577b; }
.network-route-timeline-node.is-destination circle { fill: #3b1b71; stroke-width: 4; }
.network-route-timeline-node text { paint-order: stroke fill; pointer-events: none; }
.network-route-timeline-eyebrow { fill: #7d98b2; stroke: #031024; stroke-width: 2px; font: 800 8.5px var(--font-mono); letter-spacing: .05em; }
.network-route-timeline-number { fill: #fff; stroke: #031024; stroke-width: 2.4px; font: 900 13px var(--font-mono); }
.network-route-timeline-rtt { fill: var(--route-colour, #a785ff); stroke: #031024; stroke-width: 2.4px; font: 850 10.5px var(--font-mono); }
.network-route-timeline-label { fill: #d9ebf6; stroke: #031024; stroke-width: 2px; font: 750 9px var(--font-mono); }
.network-route-timeline-secondary { fill: #718da8; stroke: #031024; stroke-width: 1.8px; font: 650 8px var(--font-mono); }
.network-map-controls { position: absolute; z-index: 4; top: 10px; right: 10px; display: flex; gap: 5px; padding: 5px; border: 1px solid rgba(82, 231, 255, .3); border-radius: 10px; background: rgba(3, 13, 34, .9); box-shadow: 0 8px 22px rgba(0, 0, 0, .3); backdrop-filter: blur(10px); }
.network-map-controls button { display: grid; min-width: 30px; height: 30px; padding: 0 8px; place-items: center; border: 1px solid rgba(100, 211, 238, .34); border-radius: 7px; color: #dffbff; background: rgba(15, 56, 91, .88); cursor: pointer; font: 800 .68rem var(--font-mono); }
.network-map-controls button:hover, .network-map-controls button:focus-visible { border-color: #fff; outline: 0; color: #fff; background: #12678b; }
.network-map-controls .network-map-reset { font-size: .46rem; letter-spacing: .03em; }
@media (max-width: 620px) {
  .network-route-map-heading { align-items: flex-start; flex-direction: column; }
  .network-route-map-heading > small { max-width: none; text-align: left; }
  .network-world-map { margin: 10px; }
  .network-route-timeline-heading { flex-direction: column; }
  .network-route-timeline-heading small { max-width: none; text-align: left; }
}
.network-geo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 11px; }
.network-geo-card { min-width: 0; overflow: hidden; border: 1px solid rgba(101, 170, 211, .3); border-radius: 14px; background: rgba(10, 31, 59, .88); }
.network-geo-card.target { border-color: rgba(67, 239, 172, .4); box-shadow: inset 3px 0 var(--green); }
.network-geo-card.tester { border-color: rgba(83, 226, 255, .4); box-shadow: inset 3px 0 var(--cyan); }
.network-geo-card > .section-kicker { margin: 0; padding: 13px 14px 0; }
.network-geo-card h3 { margin: 5px 14px 0; color: #e2f2fb; font-size: .78rem; }
.network-contact-heading { margin-top: 15px; }
.network-contact-heading h3 { margin: 3px 0 0; color: #dff3fc; font-size: .78rem; }
.network-contact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-top: 10px; }
.network-contact-card { display: grid; gap: 6px; min-width: 0; padding: 12px 13px; border: 1px solid rgba(101, 170, 211, .25); border-radius: 11px; background: rgba(4, 19, 41, .68); }
.network-contact-card strong { color: #d7edf6; font-size: .67rem; }
.network-contact-card small { color: #7a94b1; font-size: .54rem; text-transform: uppercase; }
.network-contact-card code, .network-contact-card span { color: #8eeed0; font: .57rem/1.4 var(--font-mono); overflow-wrap: anywhere; }

@media (max-width: 940px) {
  .network-summary-grid, .network-geo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .network-job-steps { grid-template-columns: repeat(4, 1fr); row-gap: 9px; }
}

@media (max-width: 620px) {
  .network-summary-grid .dns-mx-summary-icon { min-width: 74px; max-width: 124px; }
}

@media (max-width: 620px) {
  .network-scope-note { margin-inline: 18px; }
  .network-summary-grid, .network-service-grid, .network-geo-grid, .network-contact-grid { grid-template-columns: 1fr; }
  .network-job-steps { grid-template-columns: repeat(2, 1fr); }
  .network-route-hop { grid-template-columns: 32px minmax(0, 1fr); }
  .network-hop-rtt { grid-column: 2; text-align: left; }
}

/* Anti-Spam Challenge */
.accent-challenge { --tile-accent: 224, 79, 255; }
.anti-spam-challenge-tile .mailcheck-tile-copy { background: linear-gradient(155deg, rgba(37, 15, 75, .98), rgba(5, 14, 38, .98)); }
.quiz-page [hidden] { display: none !important; }
.quiz-page { padding-top: 38px; }
.quiz-intro-row { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(300px, .82fr); gap: 18px; align-items: stretch; }
.quiz-visual-hero { position: relative; min-width: 0; margin: 0; overflow: hidden; border: 1px solid rgba(92, 211, 255, .48); border-radius: 25px; background: #02071a; box-shadow: 0 28px 90px rgba(0, 0, 0, .4), 0 0 50px rgba(137, 68, 255, .13); }
.quiz-visual-hero::after { position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 45px rgba(41, 103, 255, .08); content: ""; pointer-events: none; }
.quiz-visual-hero img, .quiz-live-video { display: block; width: 100%; height: 100%; min-height: 315px; object-fit: contain; }
.quiz-live-video { position: absolute; inset: 0; opacity: 0; background: #02071a; transition: opacity .24s ease; }
.quiz-visual-hero.is-playing .quiz-live-video { opacity: 1; }
.quiz-hero-copy { display: flex; min-width: 0; justify-content: center; flex-direction: column; padding: 32px; border: 1px solid rgba(218, 86, 255, .48); border-radius: 25px; background: linear-gradient(145deg, rgba(31, 38, 94, .98), rgba(39, 10, 67, .96)); box-shadow: 0 24px 75px rgba(0, 0, 0, .28), inset 0 1px rgba(255, 255, 255, .06); }
.quiz-hero-copy .section-kicker { margin-bottom: 10px; color: #f06cff; }
.quiz-hero-copy h1 { max-width: 560px; margin: 0; color: #f7fbff; font-size: clamp(1.85rem, 3.15vw, 3rem); letter-spacing: -.04em; line-height: 1.03; }
.quiz-hero-copy > p:not(.section-kicker) { margin: 18px 0 0; color: #a6bbd7; font-size: .88rem; line-height: 1.6; }
.quiz-hero-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 25px; }
.quiz-hero-facts span { padding: 11px 10px; border: 1px solid rgba(111, 169, 221, .21); border-radius: 11px; color: #7690af; background: rgba(4, 16, 43, .48); font-size: .57rem; line-height: 1.35; text-align: center; text-transform: uppercase; }
.quiz-hero-facts strong { display: block; margin-bottom: 4px; color: #e8f8ff; font: 800 1.08rem var(--font-mono); }
.quiz-console { position: relative; overflow: hidden; margin-top: 18px; padding: 28px; border: 1px solid rgba(104, 171, 232, .36); border-radius: 25px; background: linear-gradient(145deg, rgba(8, 29, 62, .98), rgba(4, 10, 30, .98)); box-shadow: 0 28px 90px rgba(0, 0, 0, .32), inset 0 1px rgba(255, 255, 255, .045); }
.quiz-console-glow { position: absolute; top: -180px; right: -100px; width: 420px; height: 420px; border-radius: 50%; background: radial-gradient(circle, rgba(190, 62, 255, .16), transparent 68%); pointer-events: none; }
.quiz-mode-view, .quiz-question-view, .quiz-result-view { position: relative; z-index: 1; }
.quiz-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 28px; }
.quiz-section-heading .section-kicker { margin-bottom: 8px; }
.quiz-section-heading h2 { margin: 0; color: #eef9ff; font-size: clamp(1.35rem, 2.2vw, 2rem); }
.quiz-section-heading p:not(.section-kicker) { max-width: 700px; margin: 9px 0 0; color: #819bb9; font-size: .75rem; line-height: 1.55; }
.quiz-just-for-fun { flex: 0 0 auto; padding: 8px 11px; border: 1px solid rgba(255, 213, 104, .38); border-radius: 999px; color: #e5c879; background: rgba(87, 62, 10, .19); font-size: .54rem; font-weight: 760; text-transform: uppercase; }
.quiz-mode-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 24px; }
.quiz-mode-card { position: relative; display: flex; min-width: 0; min-height: 238px; align-items: flex-start; flex-direction: column; padding: 19px; overflow: hidden; border: 1px solid rgba(91, 169, 222, .37); border-radius: 18px; color: #f3fbff; background: linear-gradient(145deg, rgba(9, 41, 75, .9), rgba(3, 17, 43, .92)); cursor: pointer; text-align: left; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.quiz-mode-card:hover, .quiz-mode-card:focus-visible { transform: translateY(-3px); border-color: rgb(var(--mode-accent)); box-shadow: 0 18px 48px rgba(var(--mode-accent), .14); outline: none; }
.quiz-mode-card:disabled { cursor: wait; }
.quiz-mode-card::after { position: absolute; top: -65px; right: -55px; width: 180px; height: 180px; border-radius: 50%; background: rgb(var(--mode-accent)); filter: blur(48px); opacity: .13; content: ""; }
.quiz-mode-card.mode-simple { --mode-accent: 69, 222, 255; }
.quiz-mode-card.mode-maths { --mode-accent: 218, 75, 255; }
.quiz-mode-card.mode-god { --mode-accent: 255, 197, 69; border-color: rgba(255, 197, 69, .38); }
.quiz-mode-number { position: absolute; top: 17px; right: 18px; color: rgba(var(--mode-accent), .7); font: 700 .58rem var(--font-mono); }
.quiz-mode-icon { display: grid; width: 54px; height: 54px; place-items: center; border: 1px solid rgba(var(--mode-accent), .62); border-radius: 15px; color: rgb(var(--mode-accent)); background: rgba(var(--mode-accent), .08); box-shadow: 0 0 24px rgba(var(--mode-accent), .11); font: 800 .92rem var(--font-mono); }
.quiz-mode-card strong { margin-top: 20px; color: #f5fbff; font-size: 1.14rem; }
.quiz-mode-card > span:not(.quiz-mode-number):not(.quiz-mode-icon) { margin-top: 7px; color: #859fbc; font-size: .67rem; line-height: 1.5; }
.quiz-mode-card em { margin-top: auto; padding-top: 22px; color: rgb(var(--mode-accent)); font-size: .62rem; font-style: normal; font-weight: 760; }
.quiz-global-status { min-height: 1.1em; margin: 15px 0 0; color: #88a5c2; font-size: .67rem; }
.quiz-global-status[data-state="loading"] { color: #d7b6ff; }
.quiz-global-status[data-state="error"] { color: #ff93b1; }
.quiz-question-view { width: min(800px, 100%); margin: 0 auto; }
.quiz-progress-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; }
.quiz-progress-head > div:first-child span { display: block; margin-bottom: 5px; color: #58e8ff; font-size: .58rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.quiz-progress-head > div:first-child strong { color: #eaf7ff; font-size: 1.12rem; }
.quiz-progress-head > div:first-child b { color: #e46fff; }
.quiz-live-stats { display: flex; gap: 8px; }
.quiz-live-stats > span { min-width: 82px; padding: 8px 10px; border: 1px solid rgba(92, 165, 218, .22); border-radius: 10px; color: #718caa; background: rgba(4, 18, 42, .68); font-size: .54rem; text-transform: uppercase; }
.quiz-live-stats strong { display: block; margin-top: 3px; color: #ddecf7; font: 750 .74rem var(--font-mono); }
.quiz-live-stats > span.is-urgent { border-color: rgba(255, 93, 139, .58); color: #ff9cb7; background: rgba(98, 16, 44, .3); box-shadow: 0 0 18px rgba(255, 69, 124, .1); }
.quiz-live-stats > span.is-urgent strong { color: #ffb3c7; }
.quiz-live-stats button { min-width: 78px; padding: 8px 10px; border: 1px solid rgba(218, 101, 255, .33); border-radius: 10px; color: #dcbaff; background: rgba(72, 29, 105, .26); cursor: pointer; font-size: .54rem; font-weight: 730; }
.quiz-live-stats button[aria-pressed="true"] { color: #7890aa; border-color: rgba(106, 139, 174, .25); background: rgba(25, 43, 68, .4); }
.quiz-progress-track { height: 7px; margin-top: 14px; overflow: hidden; border-radius: 999px; background: #07142b; box-shadow: inset 0 0 0 1px rgba(95, 167, 223, .18); }
.quiz-progress-track span { display: block; width: 10%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #38d8ff, #c44fff, #ffc345); box-shadow: 0 0 18px rgba(166, 75, 255, .35); transition: width .25s ease; }
.quiz-question-card { display: grid; justify-items: center; margin-top: 17px; padding: 30px; border: 1px solid rgba(103, 183, 234, .32); border-radius: 20px; background: radial-gradient(circle at 50% 0, rgba(92, 42, 163, .18), transparent 48%), rgba(5, 22, 49, .86); text-align: center; }
.quiz-question-kicker { margin: 0; color: #829dbc; font-size: .56rem; font-weight: 790; letter-spacing: .1em; text-transform: uppercase; }
.quiz-expression { max-width: 100%; margin-top: 22px; color: #f3fbff; font: 850 clamp(1.6rem, 4vw, 3.15rem)/1.25 var(--font-mono); overflow-wrap: anywhere; text-shadow: 0 0 24px rgba(85, 222, 255, .18); }
.quiz-readable { max-width: 650px; margin: 11px 0 0; color: #718da9; font-size: .61rem; line-height: 1.5; }
.quiz-answer-label { display: grid; gap: 7px; width: min(300px, 100%); margin-top: 25px; color: #9bb4ce; font-size: .61rem; font-weight: 720; text-align: left; }
.quiz-answer-label input { width: 100%; height: 56px; padding: 0 14px; border: 1px solid rgba(82, 231, 255, .62); border-radius: 14px; color: #fff; background: rgba(2, 10, 28, .9); font: 800 1.2rem var(--font-mono); text-align: center; outline: none; }
.quiz-answer-label input:focus { border-color: #5cecff; box-shadow: 0 0 0 3px rgba(82, 231, 255, .14), 0 0 24px rgba(82, 231, 255, .11); }
.quiz-question-card > small { margin-top: 7px; color: #58738f; font-size: .54rem; }
.quiz-submit { min-width: 220px; margin-top: 19px; padding: 13px 18px; border: 0; border-radius: 12px; color: #fff; background: linear-gradient(135deg, #167dff, #b63dea); box-shadow: 0 13px 34px rgba(97, 56, 225, .23); cursor: pointer; font-size: .69rem; font-weight: 800; }
.quiz-submit:hover:not(:disabled) { filter: brightness(1.1); }
.quiz-answer-status { min-height: 1em; margin: 11px 0 0; color: #7fa0bd; font-size: .62rem; }
.quiz-answer-status[data-state="error"] { color: #ff91af; }
.quiz-feedback { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; align-items: center; gap: 13px; margin-top: 13px; padding: 13px 15px; border: 1px solid rgba(71, 239, 176, .42); border-radius: 15px; background: rgba(13, 84, 63, .22); }
.quiz-feedback[data-state="wrong"] { border-color: rgba(255, 93, 139, .45); background: rgba(91, 18, 45, .24); }
.quiz-feedback-icon { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 50%; color: #052015; background: #47efb0; font: 900 1.18rem var(--font-mono); }
.quiz-feedback[data-state="wrong"] .quiz-feedback-icon { color: #2a0611; background: #ff668d; }
.quiz-feedback strong { color: #dffbed; font-size: .75rem; }
.quiz-feedback[data-state="wrong"] strong { color: #ffd9e4; }
.quiz-feedback p { margin: 4px 0 0; color: #83aa9d; font-size: .61rem; line-height: 1.45; }
.quiz-feedback[data-state="wrong"] p { color: #ba8897; }
.quiz-feedback button { padding: 10px 13px; border: 1px solid rgba(94, 232, 255, .36); border-radius: 10px; color: #dffaff; background: rgba(23, 83, 119, .34); cursor: pointer; font-size: .62rem; font-weight: 760; }
.quiz-result-view { width: min(920px, 100%); margin: 0 auto; }
.quiz-result-view > .section-kicker { text-align: center; }
.quiz-result-grid { display: grid; grid-template-columns: 190px minmax(0, 1fr); align-items: center; gap: 26px; margin-top: 18px; }
.quiz-score-orb { display: grid; width: 176px; height: 176px; place-content: center; border: 2px solid #5ce8ff; border-radius: 50%; background: radial-gradient(circle, rgba(38, 139, 198, .3), rgba(3, 18, 43, .9) 66%); box-shadow: 0 0 40px rgba(82, 231, 255, .2), inset 0 0 30px rgba(82, 231, 255, .09); text-align: center; }
.quiz-score-orb[data-grade="perfect"] { border-color: #ffd35f; background: radial-gradient(circle, rgba(157, 102, 17, .31), rgba(44, 20, 57, .91) 66%); box-shadow: 0 0 52px rgba(255, 195, 69, .24), inset 0 0 34px rgba(255, 207, 78, .11); }
.quiz-score-orb[data-grade="low"] { border-color: #ff668d; box-shadow: 0 0 38px rgba(255, 74, 124, .16); }
.quiz-score-orb strong { color: #fff; font: 900 3.2rem/1 var(--font-mono); }
.quiz-score-orb span { margin-top: 6px; color: #7d9bb9; font-size: .57rem; text-transform: uppercase; }
.quiz-result-copy > span { color: #5ce8ff; font-size: .59rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.quiz-result-copy h2 { margin: 8px 0 0; color: #f7fbff; font-size: clamp(1.7rem, 3.4vw, 2.8rem); letter-spacing: -.035em; }
.quiz-result-copy > p { margin: 10px 0 0; color: #8ca5c1; font-size: .76rem; line-height: 1.55; }
.quiz-result-facts { display: flex; gap: 8px; margin-top: 18px; }
.quiz-result-facts span { min-width: 112px; padding: 10px 12px; border: 1px solid rgba(102, 169, 221, .22); border-radius: 10px; color: #6f89a8; background: rgba(4, 18, 42, .63); font-size: .54rem; text-transform: uppercase; }
.quiz-result-facts strong { display: block; margin-top: 4px; color: #ddebfa; font: 760 .72rem var(--font-mono); }
.quiz-unsavoury-callout { display: grid; grid-template-columns: auto minmax(260px, 400px) auto; align-items: center; justify-content: center; gap: 10px 14px; margin-top: 24px; padding: 18px 20px; border: 1px solid rgba(255, 98, 144, .25); border-radius: 18px; background: radial-gradient(circle at 50% 0, rgba(220, 38, 133, .14), transparent 72%), rgba(21, 7, 29, .56); }
.quiz-unsavoury-callout p { margin: 0; color: #dfabc2; font-size: .68rem; font-weight: 720; line-height: 1.45; }
.quiz-unsavoury-link { display: block; min-width: 0; padding: 5px; border: 1px solid rgba(255, 96, 166, .78); border-radius: 999px; background: rgba(80, 4, 38, .72); box-shadow: 0 0 0 4px rgba(255, 64, 139, .08), 0 12px 38px rgba(243, 37, 124, .26); transition: filter .2s ease, opacity .2s ease, transform .2s ease, box-shadow .2s ease; }
.quiz-unsavoury-link img { display: block; width: 100%; height: auto; }
.quiz-unsavoury-callout[data-state="fail"] .quiz-unsavoury-link { animation: quiz-unsavoury-pulse 1.9s ease-in-out infinite; }
.quiz-unsavoury-callout[data-state="fail"] .quiz-unsavoury-link:hover { transform: translateY(-2px) scale(1.015); box-shadow: 0 0 0 5px rgba(255, 64, 139, .12), 0 16px 48px rgba(243, 37, 124, .42); }
.quiz-unsavoury-callout[data-state="fail"] .quiz-unsavoury-link:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
.quiz-unsavoury-locked { display: none; }
.quiz-unsavoury-callout[data-state="pass"] { grid-template-columns: minmax(260px, 400px) auto; border-color: rgba(134, 151, 172, .18); background: rgba(9, 17, 34, .48); }
.quiz-unsavoury-callout[data-state="pass"] .quiz-unsavoury-lead,
.quiz-unsavoury-callout[data-state="pass"] .quiz-unsavoury-trail { display: none; }
.quiz-unsavoury-callout[data-state="pass"] .quiz-unsavoury-link { border-color: rgba(136, 148, 166, .24); background: rgba(45, 51, 62, .5); box-shadow: none; cursor: not-allowed; filter: grayscale(1); opacity: .28; pointer-events: none; }
.quiz-unsavoury-callout[data-state="pass"] .quiz-unsavoury-locked { display: block; color: #76879b; }
@keyframes quiz-unsavoury-pulse {
  0%, 100% { box-shadow: 0 0 0 4px rgba(255, 64, 139, .08), 0 12px 38px rgba(243, 37, 124, .24); }
  50% { box-shadow: 0 0 0 7px rgba(255, 64, 139, .14), 0 14px 48px rgba(243, 37, 124, .42); }
}
.quiz-email-perfect { display: grid; grid-template-columns: minmax(230px, 1fr) minmax(210px, .72fr) auto; align-items: end; gap: 13px; margin-top: 24px; padding: 17px; border: 1px solid rgba(255, 204, 82, .46); border-radius: 16px; background: linear-gradient(135deg, rgba(91, 62, 13, .25), rgba(50, 20, 74, .27)); }
.quiz-email-perfect > div strong, .quiz-email-perfect > div span { display: block; }
.quiz-email-perfect > div strong { color: #ffe293; font-size: .76rem; }
.quiz-email-perfect > div span { margin-top: 5px; color: #a99469; font-size: .58rem; line-height: 1.45; }
.quiz-email-perfect label { display: grid; gap: 6px; color: #9eb2c8; font-size: .56rem; }
.quiz-email-perfect input { width: 100%; height: 42px; padding: 0 12px; border: 1px solid rgba(255, 209, 94, .42); border-radius: 10px; color: #fff; background: rgba(4, 13, 33, .86); outline: none; }
.quiz-email-perfect input:focus { border-color: #ffd35f; box-shadow: 0 0 0 3px rgba(255, 208, 82, .12); }
.quiz-email-perfect button { height: 42px; padding: 0 14px; border: 0; border-radius: 10px; color: #1a1102; background: linear-gradient(135deg, #ffe48a, #ffb937); cursor: pointer; font-size: .61rem; font-weight: 820; }
.quiz-email-perfect > p { grid-column: 1 / -1; min-height: 1em; margin: 0; color: #8fa889; font-size: .58rem; }
.quiz-email-perfect > p[data-state="success"] { color: #77f1bd; }
.quiz-email-perfect > p[data-state="error"] { color: #ff93af; }
.quiz-result-actions { display: flex; gap: 9px; margin-top: 24px; }
.quiz-result-actions button { min-height: 44px; border-radius: 11px; cursor: pointer; font-size: .65rem; font-weight: 780; }
.quiz-result-actions .primary-button { border: 0; }
.quiz-result-actions .secondary-button { padding: 0 17px; border: 1px solid rgba(98, 192, 235, .38); color: #b8eaf7; background: rgba(12, 60, 91, .32); }
.quiz-share-status { min-height: 1em; margin: 9px 0 0; color: #7da5b4; font-size: .58rem; }
.quiz-share-status[data-state="error"] { color: #ff93af; }
.quiz-real-tools { display: grid; grid-template-columns: minmax(230px, .62fr) minmax(0, 1.38fr); align-items: center; gap: 20px; margin-top: 24px; padding-top: 20px; border-top: 1px solid rgba(94, 163, 213, .2); }
.quiz-real-tools .section-kicker { margin: 0; font-size: .56rem; }
.quiz-real-tools h3 { margin: 5px 0 0; color: #ddecf8; font-size: .87rem; }
.quiz-real-tool-links { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.quiz-real-tools a { display: flex; min-height: 42px; align-items: center; justify-content: center; gap: 4px; padding: 9px 10px; border: 1px solid rgba(83, 226, 255, .25); border-radius: 9px; color: #9fdce8; background: rgba(7, 48, 72, .26); font-size: .58rem; font-weight: 720; line-height: 1.3; text-align: center; }
.quiz-real-tools .quiz-home-link { border-color: rgba(218, 93, 255, .36); color: #e6b9ff; background: rgba(77, 26, 105, .28); }
.quiz-real-tools a:hover { border-color: rgba(83, 226, 255, .62); color: #effeff; }
.quiz-disclaimer { max-width: 850px; margin: 16px auto 0; color: #5e7895; font-size: .56rem; line-height: 1.55; text-align: center; }

@media (max-width: 940px) {
  .quiz-intro-row { grid-template-columns: 1fr; }
  .quiz-visual-hero img { min-height: 0; height: auto; }
  .quiz-live-video { min-height: 0; }
  .quiz-mode-grid { grid-template-columns: 1fr; }
  .quiz-mode-card { min-height: 190px; }
  .quiz-email-perfect { grid-template-columns: 1fr 1fr; }
  .quiz-email-perfect > div { grid-column: 1 / -1; }
  .quiz-real-tools { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .quiz-page { padding-top: 28px; }
  .quiz-hero-copy, .quiz-console { padding: 20px; }
  .quiz-hero-facts { grid-template-columns: 1fr; }
  .quiz-section-heading { flex-direction: column; gap: 12px; }
  .quiz-progress-head { align-items: flex-start; flex-direction: column; gap: 12px; }
  .quiz-live-stats { width: 100%; }
  .quiz-live-stats > span { flex: 1 1 0; }
  .quiz-live-stats button { flex: 0 0 auto; }
  .quiz-question-card { padding: 24px 15px; }
  .quiz-expression { font-size: clamp(1.25rem, 8vw, 2rem); }
  .quiz-answer-label { width: min(100%, 280px); }
  .quiz-feedback { grid-template-columns: 42px minmax(0, 1fr); }
  .quiz-feedback button { grid-column: 1 / -1; width: 100%; }
  .quiz-result-grid { grid-template-columns: 1fr; text-align: center; }
  .quiz-score-orb { margin: 0 auto; }
  .quiz-result-facts, .quiz-result-actions { justify-content: center; flex-wrap: wrap; }
  .quiz-unsavoury-callout,
  .quiz-unsavoury-callout[data-state="pass"] { grid-template-columns: 1fr; justify-items: center; padding-inline: 14px; text-align: center; }
  .quiz-unsavoury-link { width: min(100%, 400px); }
  .quiz-email-perfect { grid-template-columns: 1fr; }
  .quiz-email-perfect > div, .quiz-email-perfect > p { grid-column: 1; }
  .quiz-real-tools { grid-template-columns: 1fr; }
  .quiz-real-tool-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quiz-real-tool-links .quiz-home-link { grid-column: 1 / -1; }
  .quiz-result-actions button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .quiz-mode-card, .quiz-progress-track span, .quiz-unsavoury-link { transition: none; }
  .quiz-unsavoury-callout[data-state="fail"] .quiz-unsavoury-link { animation: none; }
}

/* Sensible password generator */
.accent-password { --tile-accent: 63, 231, 193; }
.password-tile-visual { padding: 0; background: #02071a; }
.password-tile-visual img, .password-tile-visual .mailcheck-hover-video { object-fit: cover; }

@media (min-width: 941px) {
  .tool-grid .password-tile { grid-column: 1 / -1; grid-template-columns: minmax(270px, .8fr) minmax(0, 1.2fr); grid-template-rows: 220px; min-height: 220px; }
  .tool-grid .password-tile .mailcheck-tile-visual { border-right: 1px solid rgba(63, 231, 193, .45); border-bottom: 0; }
  .tool-grid .password-tile .mailcheck-tile-copy { padding: 25px 28px; }
  .tool-grid .password-tile .mailcheck-tile-copy > strong { font-size: 1.55rem; }
  .tool-grid .password-tile .mailcheck-tile-copy .tool-description { max-width: 650px; font-size: .86rem; }
}

@media (min-width: 621px) and (max-width: 940px) {
  .tool-grid .password-tile { grid-column: 1 / -1; }
}

.password-main { max-width: 1110px; margin: 0 auto; padding-top: 34px; }
.password-intro-row { margin-bottom: 18px; }
.password-intro-row .password-hero { align-items: flex-start; justify-content: center; flex-direction: column; }
.password-visual-hero { border-color: rgba(63, 231, 193, .5); }
.password-visual-hero img { object-fit: cover !important; }
.password-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  padding: 30px;
  border: 1px solid rgba(63, 231, 193, .5);
  border-radius: 24px;
  background:
    radial-gradient(circle at 82% 18%, rgba(63, 231, 193, .13), transparent 23rem),
    linear-gradient(145deg, rgba(19, 49, 88, .97), rgba(8, 22, 50, .97));
  box-shadow: 0 26px 80px rgba(0, 0, 0, .3), inset 0 1px rgba(255, 255, 255, .05);
}
.password-hero > div:first-child { max-width: 790px; }
.password-hero h1 { margin: 0; color: #effaff; font-size: clamp(1.85rem, 3.5vw, 3.05rem); letter-spacing: -.045em; line-height: 1.04; text-wrap: balance; }
.password-hero p:not(.section-kicker) { max-width: 760px; margin: 15px 0 0; color: #a5bdd7; font-size: .88rem; line-height: 1.65; }

.password-console {
  margin-top: 0;
  overflow: hidden;
  border: 1px solid rgba(63, 231, 193, .5);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(18, 46, 82, .98), rgba(7, 22, 49, .98));
  box-shadow: 0 28px 85px rgba(0, 0, 0, .3), 0 0 55px rgba(63, 231, 193, .07);
}
.password-console-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 22px 27px;
  border-bottom: 1px solid rgba(63, 231, 193, .2);
  background: rgba(18, 51, 82, .66);
}
.password-console-heading h2 { margin: 0; color: #eafaff; font-size: 1.22rem; }
.password-console-heading > span { flex: none; padding: 8px 11px; border-radius: 999px; color: #8ff5d5; background: rgba(31, 177, 133, .13); font: 760 .61rem var(--font-mono); }
.password-controls { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(190px, .55fr) auto; align-items: end; gap: 17px; padding: 23px 27px; }
.password-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; min-width: 0; margin: 0; padding: 0; border: 0; }
.password-options legend, .password-word-count > span { display: block; margin-bottom: 8px; color: #bed4e9; font-size: .68rem; font-weight: 760; }
.password-options legend { grid-column: 1 / -1; padding: 0; }
.password-option {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 68px;
  padding: 11px 12px;
  border: 1px solid rgba(105, 183, 222, .25);
  border-radius: 13px;
  background: rgba(5, 21, 46, .62);
  cursor: pointer;
}
.password-option:hover { border-color: rgba(63, 231, 193, .5); }
.password-option input { position: absolute; opacity: 0; pointer-events: none; }
.password-option-control { display: grid; width: 25px; height: 25px; place-items: center; border: 1px solid rgba(107, 167, 204, .58); border-radius: 8px; background: rgba(3, 15, 35, .82); }
.password-option input:checked + .password-option-control { border-color: #3fe7c1; color: #031812; background: #3fe7c1; box-shadow: 0 0 18px rgba(63, 231, 193, .2); }
.password-option input:checked + .password-option-control::after { content: "✓"; font: 900 .72rem var(--font-mono); }
.password-option:has(input:focus-visible) { border-color: #72f3d7; box-shadow: 0 0 0 3px rgba(63, 231, 193, .12); }
.password-option b, .password-option small { display: block; }
.password-option b { color: #dcebf7; font-size: .66rem; }
.password-option small { margin-top: 4px; color: #718ba8; font-size: .53rem; line-height: 1.4; }
.password-word-count { display: grid; min-width: 0; }
.password-word-count select { width: 100%; min-height: 47px; padding: 0 12px; border: 1px solid rgba(100, 184, 229, .38); border-radius: 12px; outline: 0; color: #c9f8ff; background: #0a2343; font: 680 .7rem var(--font-display); }
.password-word-count select:focus { border-color: #3fe7c1; box-shadow: 0 0 0 3px rgba(63, 231, 193, .1); }
.password-word-count small { margin-top: 7px; color: #7189a7; font-size: .53rem; line-height: 1.4; }
.password-generate { min-height: 47px; border: 0; border-radius: 12px; padding: 0 17px; color: #041712; background: linear-gradient(135deg, #9bffe6, #3fe7c1); box-shadow: 0 13px 30px rgba(63, 231, 193, .18); cursor: pointer; font-size: .68rem; font-weight: 850; white-space: nowrap; }
.password-generate:hover:not(:disabled) { filter: brightness(1.08); transform: translateY(-1px); }
.password-generate span { margin-right: 6px; font-size: 1rem; }
.password-status { padding: 11px 27px; border-block: 1px solid rgba(63, 231, 193, .12); color: #7e9ab8; background: rgba(5, 20, 43, .65); font-size: .61rem; line-height: 1.45; }
.password-status[data-state="ready"] { color: #91cabd; }
.password-status[data-state="error"] { color: #ff9db8; }
.password-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; padding: 22px 27px 27px; }
.password-result {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-width: 0;
  min-height: 56px;
  padding: 10px 10px 10px 15px;
  border: 1px solid rgba(91, 188, 206, .27);
  border-radius: 13px;
  color: #d9fbf5;
  background: linear-gradient(145deg, rgba(6, 27, 52, .9), rgba(4, 18, 39, .9));
  cursor: pointer;
  text-align: left;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}
.password-result:hover, .password-result:focus-visible { border-color: rgba(63, 231, 193, .7); outline: 0; background: rgba(12, 50, 70, .9); transform: translateY(-1px); }
.password-result.is-copied { border-color: #3fe7c1; box-shadow: inset 3px 0 #3fe7c1; }
.password-result code { min-width: 0; color: #d8fff5; font: 690 .68rem/1.45 var(--font-mono); overflow-wrap: anywhere; }
.password-copy-label { min-width: 55px; padding: 7px 9px; border-radius: 9px; color: #8cf1d7; background: rgba(36, 172, 133, .14); font-size: .55rem; font-weight: 800; text-align: center; }
.password-result.is-copied .password-copy-label { color: #031811; background: #3fe7c1; }
.password-noscript { margin: 0 27px 27px; color: #ffb3c8; }
.password-guidance { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; margin-top: 16px; }
.password-guidance article { display: grid; grid-template-columns: auto 1fr; gap: 13px; min-width: 0; padding: 17px; border: 1px solid rgba(100, 177, 216, .24); border-radius: 16px; background: rgba(7, 24, 51, .78); }
.password-guidance article > span { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid rgba(63, 231, 193, .4); border-radius: 10px; color: #74efd1; background: rgba(21, 120, 96, .13); font: 760 .58rem var(--font-mono); }
.password-guidance h2 { margin: 1px 0 0; color: #e0f3fa; font-size: .73rem; }
.password-guidance p { margin: 7px 0 0; color: #7892af; font-size: .6rem; line-height: 1.53; }
.password-guidance a { color: #86ead6; text-decoration: underline; text-decoration-color: rgba(134, 234, 214, .35); text-underline-offset: 2px; }

@media (max-width: 940px) {
  .password-controls { grid-template-columns: 1fr 220px; }
  .password-generate { grid-column: 1 / -1; }
  .password-guidance { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .password-hero { align-items: flex-start; flex-direction: column; padding: 24px 21px; }
  .password-console-heading { align-items: flex-start; flex-direction: column; padding-inline: 20px; }
  .password-controls { grid-template-columns: 1fr; padding-inline: 20px; }
  .password-options { grid-template-columns: 1fr; }
  .password-word-count, .password-generate { grid-column: auto; }
  .password-list { grid-template-columns: 1fr; padding: 18px 20px 22px; }
  .password-status { padding-inline: 20px; }
}

@media (max-width: 420px) {
  .password-result { grid-template-columns: 1fr; }
  .password-copy-label { justify-self: start; }
}

/* Email header analyser */
.accent-headers { --tile-accent: 78, 205, 255; }
.header-analyser-main { max-width: 1110px; margin: 0 auto; padding-top: 24px; }
.header-analyser-visual-hero { position: relative; overflow: hidden; border-color: rgba(78, 205, 255, .52); }
.header-analyser-visual-hero img { object-fit: cover !important; }
.header-analyser-scan {
  position: absolute;
  inset: -28% -70%;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 43%, rgba(92, 232, 255, .03) 47%, rgba(92, 232, 255, .24) 50%, rgba(184, 105, 255, .09) 53%, transparent 57%);
  animation: header-analyser-scan 5.8s linear infinite;
}
@keyframes header-analyser-scan { from { transform: translateX(-38%); } to { transform: translateX(38%); } }
.header-analyser-hero { border-color: rgba(78, 205, 255, .5); background: radial-gradient(circle at 86% 15%, rgba(170, 75, 255, .16), transparent 23rem), linear-gradient(145deg, rgba(22, 50, 91, .98), rgba(8, 22, 52, .98)); }
.header-analyser-form { overflow: hidden; }
.header-analyser-input { display: grid; gap: 8px; padding: 0 27px 21px; color: #bed4e9; font-size: .68rem; font-weight: 760; }
.header-analyser-input textarea {
  width: 100%;
  min-height: 250px;
  resize: vertical;
  padding: 16px 17px;
  border: 1px solid rgba(91, 187, 225, .35);
  border-radius: 15px;
  outline: 0;
  color: #d9efff;
  background: linear-gradient(145deg, rgba(2, 13, 31, .96), rgba(5, 22, 46, .94));
  box-shadow: inset 0 1px 18px rgba(0, 0, 0, .28);
  font: 500 .68rem/1.55 var(--font-mono);
  tab-size: 2;
}
.header-analyser-input textarea:focus { border-color: #52e7ff; box-shadow: 0 0 0 3px rgba(82, 231, 255, .1), inset 0 1px 18px rgba(0, 0, 0, .28); }
.header-analyser-input small { color: #718baa; font-size: .57rem; font-weight: 500; line-height: 1.45; }
.header-analyser-delivery { display: grid; grid-template-columns: minmax(290px, .72fr) minmax(0, 1.28fr); align-items: center; gap: 14px; padding: 0 27px 21px; }
.header-email-toggle { min-height: 84px; }
.header-analyser-form:not(.email-enabled) .header-analyser-delivery .dns-mx-field { opacity: .72; }
.header-analyser-form.email-enabled .header-analyser-delivery .dns-mx-field input { border-color: rgba(67, 239, 172, .5); box-shadow: 0 0 0 3px rgba(67, 239, 172, .07); }
.header-analyser-privacy { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 13px; margin: 0 27px 21px; padding: 14px 16px; border: 1px solid rgba(67, 239, 172, .28); border-radius: 14px; background: rgba(14, 76, 68, .18); }
.header-analyser-privacy > span { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid rgba(67, 239, 172, .38); border-radius: 50%; color: #78f2c4; font: 800 .82rem var(--font-mono); }
.header-analyser-privacy strong { color: #c9f9e7; font-size: .66rem; }
.header-analyser-privacy p { margin: 5px 0 0; color: #799d99; font-size: .57rem; line-height: 1.48; }
.header-analyser-form .captcha-panel { margin: 21px 27px; }
.header-analyser-form-foot { padding-block: 14px; }
.header-analyser-form-foot .dns-mx-run { flex: none; }
.header-analyser-job-steps { grid-template-columns: repeat(4, 1fr); }
.header-analyser-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.header-message-facts .dns-mx-fact strong, .header-method-facts .dns-mx-fact strong { overflow-wrap: anywhere; }
.header-hop-timeline { position: relative; display: grid; gap: 10px; padding: 2px 0 2px 11px; }
.header-hop-timeline::before { position: absolute; top: 20px; bottom: 20px; left: 28px; width: 1px; background: linear-gradient(#52e7ff, #9b62ff, #f153bd); box-shadow: 0 0 12px rgba(82, 231, 255, .45); content: ""; }
.header-hop-card { position: relative; display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 11px; padding: 13px 14px 13px 10px; border: 1px solid rgba(86, 173, 219, .22); border-radius: 14px; background: linear-gradient(145deg, rgba(7, 28, 56, .92), rgba(4, 17, 39, .92)); }
.header-hop-card.state-warn { border-color: rgba(255, 208, 106, .42); }
.header-hop-marker { position: relative; z-index: 2; display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid #52e7ff; border-radius: 50%; color: #dffcff; background: #092748; box-shadow: 0 0 15px rgba(82, 231, 255, .25); font: 800 .65rem var(--font-mono); }
.header-hop-head { display: flex; min-width: 0; align-items: flex-start; justify-content: space-between; gap: 12px; }
.header-hop-head > div { min-width: 0; }
.header-hop-head strong, .header-hop-head small { display: block; overflow-wrap: anywhere; }
.header-hop-head strong { color: #e3f2fd; font-size: .68rem; }
.header-hop-head small { margin-top: 5px; color: #718daa; font: .54rem/1.4 var(--font-mono); }
.header-hop-facts { grid-column: 2; padding: 8px 0 0; }
.header-hop-card > .dns-mx-notice { grid-column: 2; margin-top: 1px; }
.header-hop-agents { grid-column: 2; padding-top: 3px; }
.header-hop-agents-label { display: block; margin-bottom: 7px; color: #5fe8fa; font: 750 .49rem/1.4 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; }
.header-hop-agent-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 7px; }
.header-hop-agent { padding: 9px 10px; border: 1px solid rgba(158, 104, 255, .32); border-radius: 10px; background: linear-gradient(135deg, rgba(28, 20, 72, .78), rgba(5, 25, 49, .78)); box-shadow: inset 2px 0 rgba(242, 87, 196, .72); }
.header-hop-agent-head { display: flex; align-items: baseline; justify-content: space-between; gap: 9px; }
.header-hop-agent-head strong { color: #f1eaff; font-size: .61rem; }
.header-hop-agent-head span { color: #ab91e2; font: 650 .46rem/1.35 var(--font-mono); text-align: right; }
.header-hop-agent small { display: block; margin-top: 5px; color: #9aadd0; font-size: .52rem; line-height: 1.45; }
.header-auth-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-bottom: 12px; }
.header-auth-card { padding: 13px 14px; border: 1px solid rgba(92, 161, 207, .25); border-radius: 12px; background: rgba(4, 18, 39, .68); box-shadow: inset 3px 0 rgba(111, 151, 186, .55); }
.header-auth-card.state-pass { border-color: rgba(67, 239, 172, .3); box-shadow: inset 3px 0 #43efac; }
.header-auth-card.state-warn { border-color: rgba(255, 208, 106, .35); box-shadow: inset 3px 0 #ffd06a; }
.header-auth-card.state-fail { border-color: rgba(255, 102, 141, .4); box-shadow: inset 3px 0 #ff668d; }
.header-auth-card span, .header-auth-card strong, .header-auth-card small { display: block; }
.header-auth-card span { color: #78dff0; font: 780 .56rem var(--font-mono); letter-spacing: .08em; }
.header-auth-card strong { margin-top: 7px; color: #eaf5fc; font-size: .72rem; text-transform: uppercase; }
.header-auth-card small { margin-top: 4px; color: #728da9; font-size: .54rem; line-height: 1.4; overflow-wrap: anywhere; }
.header-auth-evidence { margin-top: 7px; border: 1px solid rgba(83, 226, 255, .12); border-radius: 10px; }
.header-auth-checks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.header-header-value { margin: 0; color: #7792af; font: .57rem/1.55 var(--font-mono); overflow-wrap: anywhere; }
.header-server-grid { display: grid; gap: 12px; }
.header-server-card { overflow: hidden; border: 1px solid rgba(89, 174, 218, .25); border-radius: 15px; background: rgba(4, 18, 40, .76); }
.header-server-card.state-pass { border-color: rgba(67, 239, 172, .32); box-shadow: inset 3px 0 #43efac; }
.header-server-card.state-warn { border-color: rgba(255, 208, 106, .4); box-shadow: inset 3px 0 #ffd06a; }
.header-server-card.state-fail { border-color: rgba(255, 102, 141, .48); box-shadow: inset 3px 0 #ff668d; }
.header-server-signals { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; padding: 12px 14px 14px; }
.header-server-signal { padding: 9px 10px; border: 1px solid rgba(100, 163, 204, .17); border-radius: 9px; background: rgba(2, 13, 30, .62); }
.header-server-signal span, .header-server-signal strong { display: block; }
.header-server-signal span { color: #718daa; font-size: .52rem; }
.header-server-signal strong { margin-top: 5px; color: #dceaf4; font-size: .62rem; text-transform: capitalize; }
.header-server-signal.state-pass strong { color: #7af0bf; }
.header-server-signal.state-warn strong { color: #ffe18d; }
.header-server-signal.state-fail strong { color: #ff93ae; }
.header-server-evidence { border-top-color: rgba(83, 226, 255, .16); }
.header-ptr-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.header-evidence-card { padding: 11px; border: 1px solid rgba(93, 162, 206, .2); border-radius: 10px; background: rgba(4, 17, 37, .65); }
.header-evidence-card > strong, .header-evidence-card > small { display: block; }
.header-evidence-card > strong { color: #d7eafb; font: 700 .62rem var(--font-mono); }
.header-evidence-card > small { margin-top: 5px; color: #758ca8; font-size: .54rem; line-height: 1.45; }
.header-evidence-card .dns-mx-facts { padding: 9px 0 0; }
.header-reputation-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); padding-inline: 0; }
.header-rbl-trail { display: grid; gap: 6px; padding: 0 12px 12px; }
.header-rbl-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; padding: 9px 10px; border: 1px solid rgba(92, 161, 205, .17); border-radius: 9px; background: rgba(3, 14, 32, .58); }
.header-rbl-row strong { min-width: 0; color: #c9dceb; font: 650 .55rem var(--font-mono); overflow-wrap: anywhere; }
.header-rbl-row span { color: #8ba4bd; font-size: .52rem; font-weight: 800; text-transform: uppercase; }
.header-rbl-row.state-pass span { color: #6ce8b7; }
.header-rbl-row.state-warn span { color: #ffe08f; }
.header-rbl-row.state-fail span { color: #ff91ae; }
.header-rbl-row small { grid-column: 1 / -1; color: #6f87a2; font-size: .52rem; line-height: 1.4; }
.header-spam-list { display: grid; gap: 8px; }
.header-spam-row { padding: 11px 12px; border: 1px solid rgba(99, 164, 207, .18); border-radius: 10px; background: rgba(4, 17, 37, .6); }
.header-spam-row strong { display: block; margin-bottom: 6px; color: #73dcea; font-size: .58rem; }
.header-journey-visuals { display: grid; gap: 14px; margin-top: 18px; padding: 22px; border: 1px solid rgba(82, 231, 255, .25); border-radius: 20px; background: radial-gradient(circle at 85% 8%, rgba(153, 72, 255, .14), transparent 26rem), linear-gradient(145deg, rgba(7, 27, 57, .96), rgba(3, 14, 34, .98)); box-shadow: 0 22px 50px rgba(0, 0, 0, .18); }
.header-journey-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.header-journey-heading h3 { margin: 5px 0 0; color: #edf8ff; font-size: clamp(1.08rem, 2.2vw, 1.5rem); line-height: 1.18; }
.header-journey-heading p:last-child { max-width: 760px; margin: 8px 0 0; color: #829bb7; font-size: .63rem; line-height: 1.55; }
.header-journey-panel { overflow: hidden; border: 1px solid rgba(93, 177, 220, .22); border-radius: 16px; background: rgba(2, 13, 31, .72); }
.header-journey-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 16px; border-bottom: 1px solid rgba(87, 172, 218, .17); background: rgba(11, 35, 67, .72); }
.header-journey-panel-head span, .header-journey-panel-head strong { display: block; }
.header-journey-panel-head span { color: #59e9ff; font: 760 .54rem var(--font-mono); letter-spacing: .08em; text-transform: uppercase; }
.header-journey-panel-head strong { max-width: 690px; margin-top: 5px; color: #dcecf8; font-size: .68rem; line-height: 1.4; }
.header-journey-panel-head > small { max-width: 340px; color: #718ba7; font-size: .54rem; line-height: 1.45; text-align: right; }
.header-duration-scroll { overflow-x: auto; padding: 23px 18px 17px; scrollbar-color: rgba(82, 231, 255, .48) rgba(4, 21, 43, .8); }
.header-duration-track { display: flex; min-height: 116px; align-items: flex-start; }
.header-duration-node { position: relative; z-index: 2; flex: 0 0 112px; min-width: 0; text-align: center; }
.header-duration-pin { display: grid; width: 38px; height: 38px; margin: 13px auto 10px; place-items: center; border: 2px solid #57e9ff; border-radius: 50%; color: #f0fbff; background: radial-gradient(circle at 32% 28%, #175c8d, #081b3a 65%); box-shadow: 0 0 0 5px rgba(82, 231, 255, .08), 0 0 22px rgba(82, 231, 255, .35); font: 820 .64rem var(--font-mono); }
.header-duration-node strong, .header-duration-node small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.header-duration-node strong { color: #ccdeec; font-size: .55rem; }
.header-duration-node small { margin-top: 4px; color: #708ba7; font-size: .49rem; }
.header-duration-segment { position: relative; flex: 1 1 58px; min-width: 58px; height: 93px; text-align: center; }
.header-duration-line { position: absolute; top: 31px; right: -7px; left: -7px; height: 4px; border-radius: 99px; background: linear-gradient(90deg, #57e9ff, #7e8dff 55%, #d957ed); box-shadow: 0 0 14px rgba(96, 199, 255, .45); }
.header-duration-line::after { position: absolute; top: -4px; right: -1px; border-width: 6px 0 6px 9px; border-style: solid; border-color: transparent transparent transparent #d957ed; content: ""; }
.header-duration-value { position: relative; z-index: 2; display: inline-block; max-width: calc(100% - 6px); overflow: hidden; padding: 4px 7px; border: 1px solid rgba(82, 231, 255, .34); border-radius: 99px; color: #c9f8ff; background: #071d3a; font: 760 .52rem var(--font-mono); text-overflow: ellipsis; white-space: nowrap; }
.header-duration-segment > small { position: absolute; top: 47px; right: 0; left: 0; color: #6d86a3; font-size: .48rem; }
.header-duration-segment.state-warn .header-duration-line { background: linear-gradient(90deg, #ffd46f, #ff668a); }
.header-duration-segment.state-warn .header-duration-value { border-color: rgba(255, 212, 111, .5); color: #ffe39a; }
.header-duration-footer { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 14px; padding: 11px 16px 13px; border-top: 1px solid rgba(84, 166, 211, .14); color: #6f88a5; background: rgba(4, 20, 42, .55); font-size: .5rem; line-height: 1.4; }
.header-duration-footer strong { color: #87e8f5; text-align: center; }
.header-duration-footer span:last-child { text-align: right; }
.header-world-map { position: relative; margin: 16px; overflow: hidden; border: 1px solid rgba(74, 185, 230, .28); border-radius: 14px; background: radial-gradient(circle at 50% 48%, rgba(34, 103, 169, .25), transparent 53%), #030d22; box-shadow: inset 0 0 35px rgba(0, 0, 0, .3); }
.header-world-map svg { display: block; width: 100%; height: auto; aspect-ratio: 1000 / 480; }
.header-map-grid line { stroke: rgba(72, 152, 204, .14); stroke-width: 1; stroke-dasharray: 4 8; }
.header-map-land path { fill: rgba(24, 76, 113, .78); stroke: rgba(82, 218, 244, .3); stroke-width: 1.4; }
.header-map-route-line { stroke: var(--route-colour, #a785ff); stroke-width: 4.5; stroke-linecap: round; stroke-dasharray: 8 7; filter: drop-shadow(0 0 6px var(--route-colour, #a785ff)); opacity: .92; }
.header-map-route-arrow path { fill: #f5fdff; filter: drop-shadow(0 0 2px #06162d); }
.header-map-route-pulse { fill: #fff; stroke: var(--route-colour, #a785ff); stroke-width: 4; filter: drop-shadow(0 0 9px var(--route-colour, #a785ff)); pointer-events: none; }
.header-map-marker circle { stroke: #effcff; stroke-width: 2; fill: #7a35e7; filter: drop-shadow(0 0 7px rgba(90, 225, 255, .9)); }
.header-map-marker.primary circle { fill: #045f89; stroke: #b8fbff; stroke-width: 3; filter: drop-shadow(0 0 10px rgba(98, 240, 255, .95)); }
.header-map-marker.primary { cursor: pointer; outline: none; }
.header-map-marker.primary:hover circle, .header-map-marker.primary:focus-visible circle, .header-map-marker.primary.is-selected circle { fill: #792ab1; stroke: #fff; stroke-width: 4; filter: drop-shadow(0 0 14px rgba(239, 100, 255, 1)); }
.header-map-marker.primary:focus-visible circle { stroke-dasharray: 4 3; }
.header-map-marker.secondary circle { fill: #bd4eda; stroke-width: 1.5; }
.header-map-marker text { fill: #fff; stroke: #021328; stroke-width: 2.6px; paint-order: stroke fill; font: 900 14px var(--font-mono); letter-spacing: -.03em; pointer-events: none; }
.header-map-legend { display: grid; grid-template-columns: minmax(150px, .42fr) minmax(0, 1.58fr); align-items: center; gap: 14px; padding: 11px 14px 13px; border-top: 1px solid rgba(82, 231, 255, .16); background: linear-gradient(90deg, rgba(7, 25, 50, .96), rgba(4, 16, 35, .96)); }
.header-map-legend-copy strong, .header-map-legend-copy small { display: block; }
.header-map-legend-copy strong { color: #e9f9ff; font-size: .55rem; }
.header-map-legend-copy small { margin-top: 3px; color: #7692ad; font-size: .47rem; line-height: 1.35; }
.header-map-legend-scale { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 7px; }
.header-map-legend-item { display: grid; grid-template-columns: 10px minmax(0, 1fr); column-gap: 5px; align-items: center; min-width: 0; }
.header-map-legend-swatch { grid-row: 1 / span 2; width: 9px; height: 24px; border: 1px solid rgba(255, 255, 255, .68); border-radius: 99px; background: var(--route-colour); box-shadow: 0 0 8px var(--route-colour); }
.header-map-legend-item b, .header-map-legend-item small { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.header-map-legend-item b { color: #dcebf5; font-size: .46rem; }
.header-map-legend-item small { color: #718ba5; font-size: .42rem; }
.header-map-inspector { display: grid; grid-template-columns: minmax(185px, .38fr) minmax(0, 1.62fr); gap: 14px; padding: 13px 14px 15px; border-top: 1px solid rgba(167, 133, 255, .35); background: radial-gradient(circle at 8% 10%, rgba(174, 66, 229, .17), transparent 18rem), rgba(4, 16, 35, .98); }
.header-map-inspector[hidden] { display: none; }
.header-map-inspector-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; min-width: 0; }
.header-map-inspector-heading span, .header-map-inspector-heading strong { display: block; }
.header-map-inspector-heading span { color: #b58cff; font: 760 .43rem var(--font-mono); letter-spacing: .08em; text-transform: uppercase; }
.header-map-inspector-heading strong { margin-top: 5px; overflow-wrap: anywhere; color: #f4f9ff; font-size: .59rem; line-height: 1.35; }
.header-map-inspector-close { display: grid; flex: 0 0 auto; width: 27px; height: 27px; padding: 0; place-items: center; border: 1px solid rgba(176, 142, 255, .45); border-radius: 50%; color: #e9dcff; background: rgba(44, 24, 82, .82); cursor: pointer; font: 700 .8rem/1 var(--font-display); }
.header-map-inspector-close:hover, .header-map-inspector-close:focus-visible { border-color: #fff; outline: 0; color: #fff; background: #792ab1; }
.header-map-inspector-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.header-map-inspector-fact { min-width: 0; padding: 8px 9px; border: 1px solid rgba(98, 175, 218, .18); border-radius: 9px; background: rgba(4, 22, 45, .72); }
.header-map-inspector-fact span, .header-map-inspector-fact strong { display: block; }
.header-map-inspector-fact span { color: #728ba6; font-size: .41rem; letter-spacing: .04em; text-transform: uppercase; }
.header-map-inspector-fact strong { margin-top: 4px; overflow-wrap: anywhere; color: #d6e9f5; font-size: .49rem; line-height: 1.4; }
.header-map-empty { position: absolute; right: 18px; bottom: 15px; left: 18px; margin: 0; padding: 9px 12px; border: 1px solid rgba(255, 208, 106, .3); border-radius: 9px; color: #ecd798; background: rgba(24, 22, 28, .9); font-size: .55rem; text-align: center; }
.header-location-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; padding: 0 16px 16px; }
.header-location-card { overflow: hidden; border: 1px solid rgba(90, 168, 211, .2); border-radius: 12px; background: rgba(5, 20, 42, .72); }
.header-location-head { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: center; gap: 8px; padding: 9px 10px; border-bottom: 1px solid rgba(82, 231, 255, .12); }
.header-location-marker { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid rgba(82, 231, 255, .65); border-radius: 50%; color: #dffcff; background: #092744; font: 800 .53rem var(--font-mono); }
.header-location-head strong { min-width: 0; overflow: hidden; color: #c9dfed; font-size: .56rem; text-overflow: ellipsis; white-space: nowrap; }
.header-location-rows { display: grid; gap: 1px; }
.header-location-row { display: grid; grid-template-columns: minmax(95px, .6fr) minmax(0, 1.4fr); gap: 9px; padding: 9px 10px; border-left: 2px solid #718ba5; background: rgba(2, 13, 30, .35); }
.header-location-row.state-pass { border-left-color: #43efac; }
.header-location-row.state-warn { border-left-color: #ffd06a; }
.header-location-row code { align-self: center; color: #83dce9; font: .52rem var(--font-mono); overflow-wrap: anywhere; }
.header-location-row strong, .header-location-row small { display: block; }
.header-location-row strong { color: #d6e8f4; font-size: .56rem; line-height: 1.35; }
.header-location-row small { margin-top: 3px; color: #718ba6; font-size: .49rem; line-height: 1.4; }
.header-location-missing { margin: 0; padding: 11px; color: #728ba5; font-size: .53rem; }
.header-location-missing.is-local { color: #7ee7bc; background: rgba(23, 111, 82, .13); }
.header-location-row.header-current-dns { border-color: rgba(255, 208, 106, .24); background: rgba(89, 61, 11, .13); }
.header-location-row.header-current-dns code { color: #ffdc82; }
.header-map-caveat { margin: 0; padding: 11px 16px 14px; border-top: 1px solid rgba(82, 231, 255, .12); color: #718ca8; background: rgba(4, 18, 39, .62); font-size: .52rem; line-height: 1.5; }

@media (max-width: 940px) {
  .header-analyser-delivery { grid-template-columns: 1fr; }
  .header-analyser-summary, .header-server-signals { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .header-location-list { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .header-analyser-input, .header-analyser-delivery { padding-inline: 18px; }
  .header-analyser-privacy, .header-analyser-form .captcha-panel { margin-inline: 18px; }
  .header-analyser-input textarea { min-height: 300px; font-size: .62rem; }
  .header-analyser-summary, .header-auth-grid, .header-server-signals, .header-ptr-grid, .header-reputation-facts, .header-auth-checks { grid-template-columns: 1fr; }
  .header-hop-card { grid-template-columns: 32px minmax(0, 1fr); padding-inline: 8px 10px; }
  .header-hop-marker { width: 32px; height: 32px; }
  .header-hop-head { flex-direction: column; }
  .header-hop-facts { grid-column: 1 / -1; }
  .header-hop-card > .dns-mx-notice, .header-hop-agents { grid-column: 1 / -1; }
  .header-hop-timeline::before { left: 25px; }
  .header-analyser-form-foot .dns-mx-run { width: 100%; }
  .header-journey-visuals { padding: 15px; border-radius: 16px; }
  .header-journey-heading, .header-journey-panel-head { align-items: flex-start; flex-direction: column; }
  .header-journey-panel-head > small { max-width: none; text-align: left; }
  .header-duration-footer { grid-template-columns: 1fr; }
  .header-duration-footer strong, .header-duration-footer span:last-child { text-align: left; }
  .header-world-map { margin: 12px; }
  .header-map-legend { grid-template-columns: 1fr; }
  .header-map-legend-scale { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 10px; }
  .header-map-inspector { grid-template-columns: 1fr; }
  .header-map-inspector-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .header-location-list { padding-inline: 12px; }
  .header-location-row { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
  .header-map-inspector-facts { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .header-map-route-pulse, .network-route-timeline-moving-arrow { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .header-analyser-scan { display: none; }
}

html.ask-baxter-modal-open { overflow: hidden; }

.mailcheck-heading-actions {
  display: grid;
  flex: none;
  width: min(100%, 500px);
  justify-items: end;
  gap: 12px;
}

.tool-intro-row .mailcheck-heading-actions { width: 100%; margin-top: 7px; justify-items: start; }

.ask-baxter-trigger {
  position: relative;
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr) 42px;
  width: 100%;
  min-height: 72px;
  align-items: center;
  gap: 14px;
  overflow: hidden;
  padding: 8px 11px 8px 8px;
  border: 2px solid rgba(255, 83, 215, .82);
  border-radius: 19px;
  color: #fff;
  background: radial-gradient(circle at 12% 50%, rgba(255, 44, 202, .19), transparent 34%), linear-gradient(135deg, rgba(52, 15, 95, .98), rgba(7, 38, 86, .98));
  box-shadow: 0 16px 42px rgba(144, 35, 212, .3), 0 0 27px rgba(255, 69, 211, .18), inset 0 1px rgba(255, 255, 255, .12);
  cursor: pointer;
  text-align: left;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.ask-baxter-trigger:hover { transform: translateY(-3px); border-color: #ffb0ec; box-shadow: 0 20px 48px rgba(143, 42, 211, .4), 0 0 34px rgba(69, 226, 255, .18); }
.ask-baxter-trigger:focus-visible { outline: 3px solid rgba(88, 232, 255, .72); outline-offset: 3px; }
.ask-baxter-trigger img { display: block; width: 96px; height: 54px; border: 1px solid rgba(109, 231, 255, .42); border-radius: 12px; object-fit: cover; box-shadow: 0 0 18px rgba(85, 207, 255, .18); }
.ask-baxter-trigger > span { display: grid; min-width: 0; gap: 3px; }
.ask-baxter-trigger small { color: #8eefff; font-size: .66rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.ask-baxter-trigger strong { color: #fff; font-size: .93rem; line-height: 1.25; text-shadow: 0 0 15px rgba(255, 95, 220, .28); }
.ask-baxter-trigger b { display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid rgba(82, 231, 255, .72); border-radius: 50%; color: #d9fcff; background: rgba(28, 138, 190, .28); box-shadow: 0 0 18px rgba(68, 224, 255, .18); font-size: .9rem; }

.ask-baxter-dialog {
  width: min(920px, calc(100% - 28px));
  max-width: none;
  max-height: calc(100dvh - 28px);
  overflow: auto;
  padding: 0;
  border: 1px solid rgba(94, 226, 255, .55);
  border-radius: 24px;
  color: var(--ink);
  background: #03091a;
  box-shadow: 0 36px 120px rgba(0, 0, 0, .72), 0 0 70px rgba(155, 63, 255, .22);
}
.ask-baxter-dialog::backdrop { background: rgba(0, 3, 14, .82); backdrop-filter: blur(9px); }
.ask-baxter-player { position: relative; overflow: hidden; border-radius: inherit; background: radial-gradient(circle at 82% 100%, rgba(158, 50, 225, .16), transparent 34rem), #03091a; }
.ask-baxter-player video { display: block; width: 100%; max-height: 64dvh; aspect-ratio: 16 / 9; object-fit: contain; background: #000; }
.ask-baxter-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  display: grid;
  width: 42px;
  height: 42px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .58);
  border-radius: 50%;
  color: #fff;
  background: rgba(1, 7, 24, .82);
  box-shadow: 0 8px 22px rgba(0, 0, 0, .38);
  cursor: pointer;
  font-size: 1.35rem;
}
.ask-baxter-player-copy { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px 22px 22px; border-top: 1px solid rgba(82, 231, 255, .18); }
.ask-baxter-player-copy h2 { margin: 0; font-size: clamp(1.25rem, 3vw, 1.8rem); letter-spacing: -.025em; }
.ask-baxter-player-copy p:last-child { max-width: 590px; margin: 8px 0 0; color: #91a9c8; font-size: .82rem; line-height: 1.5; }
.ask-baxter-player-copy .section-kicker { margin-bottom: 7px; color: #ff70d7; }
.ask-baxter-player-actions { display: flex; flex: none; gap: 9px; }
.ask-baxter-replay,
.ask-baxter-sound,
.ask-baxter-done { min-height: 45px; padding: 0 15px; border-radius: 12px; cursor: pointer; font-weight: 800; }
.ask-baxter-replay { border: 1px solid rgba(255, 112, 215, .5); color: #ffe8fa; background: linear-gradient(135deg, rgba(116, 31, 128, .76), rgba(55, 28, 104, .9)); }
.ask-baxter-sound { border: 1px solid rgba(82, 231, 255, .55); color: #e7fcff; background: linear-gradient(135deg, rgba(27, 79, 117, .96), rgba(46, 38, 116, .96)); }
.ask-baxter-sound span { margin-right: 7px; }
.ask-baxter-done { border: 1px solid rgba(157, 177, 204, .34); color: #c5d6eb; background: rgba(13, 28, 54, .86); }
.ask-baxter-close:hover,
.ask-baxter-replay:hover,
.ask-baxter-sound:hover,
.ask-baxter-done:hover { filter: brightness(1.16); }
.ask-baxter-close:focus-visible,
.ask-baxter-replay:focus-visible,
.ask-baxter-sound:focus-visible,
.ask-baxter-done:focus-visible { outline: 3px solid rgba(88, 232, 255, .72); outline-offset: 2px; }

@media (max-width: 940px) {
  .mailcheck-heading-actions { width: 100%; justify-items: start; }
}

@media (max-width: 620px) {
  .ask-baxter-trigger { grid-template-columns: 82px minmax(0, 1fr) 38px; width: 100%; min-height: 66px; gap: 10px; }
  .ask-baxter-trigger img { width: 82px; height: 46px; }
  .ask-baxter-trigger small { font-size: .58rem; }
  .ask-baxter-trigger strong { font-size: .82rem; }
  .ask-baxter-trigger b { width: 38px; height: 38px; }
  .ask-baxter-player-copy { align-items: stretch; flex-direction: column; padding: 17px 16px 18px; }
  .ask-baxter-player-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .ask-baxter-replay, .ask-baxter-sound, .ask-baxter-done { width: 100%; }
  .ask-baxter-done { grid-column: 1 / -1; }
}