:root { color-scheme: dark; }
html, body {
  min-height: 100%;
  background: radial-gradient(circle at 80% 0, rgba(52,120,229,.18), transparent 30rem), #111318 !important;
  color: #f4f5f7 !important;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}
body { padding: 48px 24px 32px !important; }
.speedBrand { margin: 0 auto 40px; }
.speedLogo { margin-bottom: 14px; font-size: 25px; font-weight: 850; letter-spacing: -.05em; }
.speedLogo strong { color: #64b4ff; }
.speedLead { max-width: 620px; margin: auto; color: #a4a7b1; font-size: 16px; line-height: 1.5; }
body > h1 { margin: 0 0 24px; color: #f4f5f7 !important; font-size: clamp(34px, 6vw, 54px); letter-spacing: -.05em; }
#testWrapper { width: min(760px, 100%); margin: auto; }
#startStopBtn {
  width: 180px !important; height: 52px !important; line-height: 49px !important;
  border: 0 !important; border-radius: 16px !important;
  background: #3478e5 !important; color: #fff !important; font-weight: 750;
  box-shadow: none !important;
}
#startStopBtn:hover { background: #4387ef !important; transform: translateY(-2px); }
#startStopBtn.running { background: #d94d59 !important; }
#startStopBtn:before { content: "Начать тест" !important; }
#startStopBtn.running:before { content: "Остановить" !important; }
#test { margin: 32px 0 56px !important; padding: 24px 16px; border: 1px solid #343740; border-radius: 24px; background: rgba(27,29,35,.94); }
div.testArea, div.testArea2 { color: #f4f5f7; }
div.testArea div.testName, div.testArea2 div.testName { color: #a4a7b1; font-size: 1.1em !important; font-weight: 700; }
div.testArea div.meterText, div.testArea2 div.meterText { color: #f4f5f7 !important; font-weight: 780; }
div.unit, #ipArea { color: #a4a7b1; }
a.privacy, #privacyPolicy, #shareArea { display: none !important; }
#testWrapper > a { color: #a4a7b1; font-size: 13px; text-underline-offset: 3px; }
.speedBack { display: inline-block; margin-top: 24px; color: #64b4ff; text-decoration: none; font-weight: 700; }

@media (max-width: 520px) {
  body { padding: 28px 12px 24px !important; font-size: .9em !important; }
  .speedBrand { margin-bottom: 28px; }
  body > h1 { font-size: 38px; }
  #startStopBtn { width: 100% !important; }
  #test { padding: 20px 4px; border-radius: 20px; }
  div.testArea { width: 48% !important; height: 11.5em !important; }
  div.testArea2 { width: 48% !important; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
}