:root {
  --twitter-blue: #0877bd;
  --twitter-blue-hover: #065b91;
  --twitter-blue-tint: #eef8ff;
  --twitter-blue-border: #add9f5;
}

.social-twitter .top-title h1,
.social-twitter .focused-faq .faq-question:hover,
.social-twitter .focused-faq .faq-item.active .faq-question,
.social-twitter .focused-faq .faq-question::after {
  color: var(--twitter-blue);
}

.social-twitter .input-form form .url-field button[type="submit"]:enabled,
.social-twitter .twitter-mp4-actions .download-btn:enabled,
.social-twitter .local-step-title > span {
  background-color: var(--twitter-blue);
}

.social-twitter .input-form form .url-field button[type="submit"]:enabled:hover,
.social-twitter .twitter-mp4-actions .download-btn:enabled:hover {
  background-color: var(--twitter-blue-hover);
}

.social-twitter .input-form form .url-field input:focus,
header .tool-link.active {
  border-color: var(--twitter-blue);
}

.social-twitter .input-form form .url-field .clear-btn {
  border-color: var(--twitter-blue-border);
}

.social-twitter .input-form form .url-field .clear-btn:hover {
  background-color: var(--twitter-blue-tint);
}

.social-twitter .input-form form .url-field .clear-btn::before,
.social-twitter .input-form form .url-field .clear-btn::after {
  background-color: var(--twitter-blue);
}

.social-twitter button:focus-visible,
header .tool-nav-checkbox:focus-visible + .tool-nav-toggle,
footer .footer-language-checkbox:focus-visible + .footer-language-toggle {
  outline: 2px solid var(--twitter-blue);
  outline-offset: 2px;
}

.social-twitter .form-trust-item img {
  filter: hue-rotate(205deg);
}

.social-twitter .loading-progress .progress-bar {
  background: linear-gradient(90deg, var(--twitter-blue), #1d9bf0);
}

.social-twitter .social-media-item button[data-format="mp4"].loading:disabled {
  background-color: var(--twitter-blue);
}

.social-twitter .twitter-mp4-actions .download-btn.loading::after {
  background-color: var(--twitter-blue-hover);
}

.social-twitter .mp3-download-btn:enabled,
.social-twitter .social-media-item button.mp3-download-btn.loading:disabled {
  border-color: var(--twitter-blue-border);
  background-color: var(--twitter-blue-tint);
  color: var(--twitter-blue-hover);
}

.social-twitter .mp3-download-btn:enabled:hover,
.social-twitter button.mp3-download-btn.loading::after {
  background-color: #dff1ff;
}

.social-twitter button.mp3-download-btn.loading::before {
  border-color: var(--twitter-blue-border);
  border-top-color: var(--twitter-blue);
}

.social-twitter #social-error {
  background-color: var(--twitter-blue-tint);
  color: var(--twitter-blue-hover);
}

.twitter-video-placeholder {
  display: grid;
  place-items: center;
  aspect-ratio: 16 / 9;
  border-radius: 18px;
  background: #f0f0f0;
  color: #666;
}

.twitter-video-placeholder[hidden] {
  display: none;
}

.twitter-mp4-actions {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}

.social-media-item .twitter-mp4-actions .download-btn {
  margin-top: 0;
}

.twitter-file-status {
  margin-top: 12px;
}

.twitter-guide {
  max-width: 900px;
}

.twitter-guide > h2,
.twitter-guide > p {
  text-align: left;
}

.twitter-guide > p {
  max-width: 72ch;
  margin-inline: 0;
}