:root {
  --popup-blue-950: #04132d;
  --popup-blue-900: #071c3e;
  --popup-blue-850: #0a2857;
  --popup-blue-800: #10366f;
  --popup-blue-panel: rgba(12, 43, 91, 0.86);
  --popup-blue-panel-strong: rgba(8, 31, 68, 0.96);
  --popup-blue-line: rgba(116, 174, 255, 0.34);
  --popup-blue-line-strong: rgba(127, 191, 255, 0.56);
  --popup-blue-accent: #4b91ff;
  --popup-blue-accent-bright: #63c4ff;
  --popup-blue-text: #f6f9ff;
  --popup-blue-muted: #acc7eb;
  --popup-blue-dim: #7f9dc9;
}

/* Shared header utilities use one blue dialog language in every mode. Branded
   asset installers and match snapshots intentionally keep their own identity. */
html body :is(
  #settingsModal,
  #bugReportModal,
  #feedbackResponseModal,
  #feedbackAdminModal,
  #discordModal,
  #donateModal,
  #challengeAuthModal,
  #usernameReviewModal,
  #profileDeleteModal,
  .feature-announcement-modal,
  #retroAchievementsModal,
  #achievementUnlockModal
)[open] {
  color-scheme: dark;
  border: 1px solid var(--popup-blue-line) !important;
  color: var(--popup-blue-text) !important;
  background:
    radial-gradient(circle at 92% 4%, rgba(76, 163, 255, 0.2), transparent 36%),
    linear-gradient(145deg, var(--popup-blue-850), var(--popup-blue-950) 72%) !important;
  box-shadow:
    0 30px 90px rgba(0, 7, 24, 0.62),
    inset 0 1px rgba(255, 255, 255, 0.08) !important;
}

html body :is(
  #settingsModal,
  #bugReportModal,
  #feedbackResponseModal,
  #feedbackAdminModal,
  #discordModal,
  #donateModal,
  #challengeAuthModal,
  #usernameReviewModal,
  #profileDeleteModal,
  .feature-announcement-modal,
  #retroAchievementsModal,
  #achievementUnlockModal
)[open]::backdrop {
  background: rgba(1, 8, 24, 0.78) !important;
  backdrop-filter: blur(6px);
}

html body :is(
  #settingsModal,
  #bugReportModal,
  #feedbackResponseModal,
  #feedbackAdminModal,
  #discordModal,
  #donateModal,
  #challengeAuthModal,
  #usernameReviewModal,
  #profileDeleteModal
)[open] {
  max-height: calc(100dvh - 28px);
  overflow-x: hidden;
  overflow-y: auto;
  border-radius: 16px !important;
  scrollbar-color: var(--popup-blue-accent) var(--popup-blue-950);
}

html body :is(
  #settingsModal,
  #bugReportModal,
  #feedbackResponseModal,
  #feedbackAdminModal,
  #discordModal,
  #donateModal,
  #challengeAuthModal,
  #usernameReviewModal,
  #profileDeleteModal,
  .feature-announcement-modal,
  #retroAchievementsModal,
  #achievementUnlockModal
)[open] :is(h2, h3, strong) {
  color: var(--popup-blue-text) !important;
}

html body :is(
  #settingsModal,
  #bugReportModal,
  #feedbackResponseModal,
  #feedbackAdminModal,
  #discordModal,
  #donateModal,
  #challengeAuthModal,
  #usernameReviewModal,
  #profileDeleteModal,
  .feature-announcement-modal,
  #retroAchievementsModal,
  #achievementUnlockModal
)[open] :is(p, small, label > span) {
  color: var(--popup-blue-muted) !important;
}

html body :is(
  #settingsModal,
  #bugReportModal,
  #feedbackResponseModal,
  #feedbackAdminModal,
  #discordModal,
  #donateModal,
  #challengeAuthModal,
  #usernameReviewModal,
  #profileDeleteModal
)[open] :is(.icon-button, .close-modal),
html body #retroAchievementsModal[open] .retro-achievements-close,
html body #achievementUnlockModal[open] .achievement-unlock-close {
  border: 1px solid rgba(126, 185, 255, 0.3) !important;
  color: #d9eaff !important;
  background: rgba(5, 25, 57, 0.9) !important;
}

html body :is(
  #settingsModal,
  #bugReportModal,
  #feedbackResponseModal,
  #feedbackAdminModal,
  #discordModal,
  #donateModal,
  #challengeAuthModal,
  #usernameReviewModal,
  #profileDeleteModal,
  .feature-announcement-modal,
  #retroAchievementsModal,
  #achievementUnlockModal
)[open] :is(button, a, input, select, textarea):focus-visible {
  outline: 3px solid rgba(99, 196, 255, 0.48) !important;
  outline-offset: 2px;
}

/* Settings */
html body dialog#settingsModal[open] {
  width: min(560px, calc(100vw - 28px));
}

/* The theme picker is part of the shared Settings popup. Its layout must stay
   independent from the deferred tournament skins, which can expose legacy
   simulator views when they are applied to the homepage. */
html body dialog#settingsModal[open] .tournament-theme-setting {
  display: grid;
  gap: 12px;
  margin-top: 12px;
  padding: 16px;
}

html body dialog#settingsModal[open] .tournament-theme-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

html body dialog#settingsModal[open] .tournament-theme-heading > div {
  display: grid;
  gap: 4px;
}

html body dialog#settingsModal[open] .tournament-edition-options {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  max-height: none;
  gap: 8px !important;
  overflow-x: hidden;
  overflow-y: visible;
  padding: 0 !important;
}

html body dialog#settingsModal[open] .tournament-edition-options > button {
  position: relative;
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: 42px auto !important;
  gap: 5px !important;
  min-width: 0;
  min-height: 76px !important;
  padding: 8px 6px 7px !important;
  justify-items: center;
  text-align: center;
  overflow: hidden;
}

html body dialog#settingsModal[open] .tournament-edition-options > button > img {
  position: static !important;
  display: block !important;
  width: 42px !important;
  min-width: 42px !important;
  max-width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  transform: none !important;
  filter: drop-shadow(0 3px 5px rgba(0, 0, 0, 0.22));
}

html body dialog#settingsModal[open] .tournament-theme-off-icon {
  position: relative;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid #536176;
  border-radius: 50%;
}

html body dialog#settingsModal[open] .tournament-theme-off-icon::after {
  width: 24px;
  height: 2px;
  content: "";
  border-radius: 2px;
  background: currentColor;
  transform: rotate(-45deg);
}

html body dialog#settingsModal[open] .tournament-edition-options > button[data-tournament-theme-option="2016"] > img {
  object-fit: cover !important;
  object-position: center top !important;
}

html body dialog#settingsModal[open] .tournament-edition-options > button > strong {
  min-width: 0;
  font: 800 11px/1 "DM Mono", monospace !important;
  letter-spacing: 0.04em;
}

html body dialog#settingsModal[open] .tournament-edition-options > button .tournament-theme-check {
  position: absolute !important;
  top: 6px;
  right: 6px;
  display: grid;
  width: 18px !important;
  height: 18px !important;
  place-items: center;
  border: 1px solid #46536a;
  border-radius: 50%;
  color: transparent;
  font-size: 10px;
  font-style: normal;
}

html body dialog#settingsModal[open] .tournament-edition-options > button.is-selected .tournament-theme-check {
  border-color: #9fdff7;
  color: #07101d;
  background: #9fdff7;
}

html body dialog#settingsModal[open] .modal-head {
  margin-bottom: 18px;
}

html body dialog#settingsModal[open] .tournament-theme-setting,
html body dialog#settingsModal[open] .settings-keybind-list {
  border-color: var(--popup-blue-line) !important;
  background: var(--popup-blue-panel-strong) !important;
}

html body dialog#settingsModal[open] .settings-option,
html body dialog#settingsModal[open] .tournament-theme-options > button,
html body dialog#settingsModal[open] .settings-keybind-button {
  border: 1px solid rgba(111, 165, 238, 0.27) !important;
  color: var(--popup-blue-text) !important;
  background: var(--popup-blue-panel) !important;
}

html body dialog#settingsModal[open] .settings-option.is-enabled .settings-switch,
html body dialog#settingsModal[open] .tournament-theme-options > button.is-selected {
  border-color: var(--popup-blue-line-strong) !important;
  background: linear-gradient(135deg, #235ec1, #267fcf) !important;
  box-shadow: inset 0 0 0 1px rgba(155, 209, 255, 0.18) !important;
}

html body dialog#settingsModal[open] .settings-switch {
  background: #28466e !important;
}

html body dialog#settingsModal[open] .settings-switch i {
  background: #bad4f5 !important;
}

html body dialog#settingsModal[open] .settings-option.is-enabled .settings-switch i {
  background: #ffffff !important;
}

html body dialog#settingsModal[open] .tournament-theme-check {
  border-color: rgba(168, 207, 255, 0.5) !important;
}

html body dialog#settingsModal[open] .tournament-theme-options > button.is-selected .tournament-theme-check {
  border-color: #b8e4ff !important;
  color: var(--popup-blue-950) !important;
  background: #b8e4ff !important;
}

/* Feedback and account forms */
:is(
  #bugReportModal,
  #feedbackAdminModal,
  #challengeAuthModal,
  #usernameReviewModal,
  #profileDeleteModal
) :is(input, select, textarea) {
  border-color: var(--popup-blue-line) !important;
  color: var(--popup-blue-text) !important;
  background: rgba(3, 18, 43, 0.9) !important;
}

:is(#bugReportModal, #feedbackAdminModal) :is(
  .bug-report-identity label,
  .bug-report-upload,
  .bug-report-capture,
  .bug-report-preview,
  .feedback-admin-report
) {
  border-color: var(--popup-blue-line) !important;
  color: var(--popup-blue-text) !important;
  background: var(--popup-blue-panel-strong) !important;
}

:is(#bugReportModal, #feedbackAdminModal) .bug-report-identity label:has(input:checked) {
  border-color: var(--popup-blue-accent-bright) !important;
  background: rgba(52, 126, 227, 0.3) !important;
  box-shadow: 0 0 0 2px rgba(99, 196, 255, 0.14) !important;
}

:is(#bugReportModal, #feedbackAdminModal) :is(.bug-report-submit, #feedbackAdminSubmit),
#feedbackResponseModal #feedbackResponseAcknowledge,
#discordModal .discord-join-button,
#donateModal .donate-modal-link {
  border: 1px solid rgba(171, 224, 255, 0.35) !important;
  color: #04152f !important;
  background: linear-gradient(135deg, var(--popup-blue-accent), var(--popup-blue-accent-bright)) !important;
  box-shadow: 0 12px 28px rgba(22, 102, 205, 0.3) !important;
}

#donateModal .donate-modal-icon {
  color: #eaf6ff !important;
  background: linear-gradient(145deg, #275eb7, #2a8ed1) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.16);
}

/* The News action opens the current feature announcement. Its artwork remains,
   while the reading surface and actions use the same shared blue palette. */
html body dialog.feature-announcement-modal[open] {
  width: min(520px, calc(100vw - 28px));
  max-width: calc(100vw - 28px) !important;
  max-height: calc(100vh - 24px) !important;
  max-height: calc(100dvh - 24px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scrollbar-color: var(--popup-blue-accent) var(--popup-blue-950);
}

html body dialog.feature-announcement-modal .feature-announcement-accent {
  min-height: clamp(124px, 24dvh, 190px);
}

html body dialog.feature-announcement-modal .feature-announcement-accent img {
  display: block;
  width: auto;
  height: auto;
  max-width: min(190px, 58vw);
  max-height: min(190px, 25dvh);
  object-fit: contain;
}

/* AFCON's announcement used to inherit these dimensions from its deferred
   tournament skin. Keep the identity here so the homepage popup is safe even
   when no mode stylesheet has been activated. */
html body dialog.feature-announcement-afcon-2025 .feature-announcement-accent {
  background:
    radial-gradient(circle at 105% -5%, transparent 0 54px, rgba(0, 210, 119, 0.52) 55px 72px, transparent 73px),
    radial-gradient(circle at -4% 108%, transparent 0 46px, rgba(0, 210, 119, 0.42) 47px 62px, transparent 63px),
    repeating-linear-gradient(45deg, transparent 0 35px, rgba(255, 255, 255, 0.05) 36px 37px, transparent 38px 70px),
    linear-gradient(145deg, #123c76, #071c3e 70%) !important;
}

html body dialog.feature-announcement-afcon-2025 .feature-announcement-afcon-2025-visual {
  position: relative;
  z-index: 1;
  display: grid;
  padding: 14px;
  place-items: center;
}

html body dialog.feature-announcement-afcon-2025 .feature-announcement-afcon-2025-visual img {
  width: min(170px, 46vw) !important;
  height: min(170px, 22dvh) !important;
  filter: drop-shadow(0 12px 20px rgba(0, 8, 28, 0.5));
}

.feature-announcement-modal .feature-announcement-content {
  background:
    radial-gradient(circle at 92% 0, rgba(65, 151, 255, 0.2), transparent 34%),
    linear-gradient(155deg, var(--popup-blue-850), var(--popup-blue-950) 74%) !important;
}

.feature-announcement-modal .feature-announcement-button {
  border: 1px solid rgba(174, 224, 255, 0.36) !important;
  color: #04152f !important;
  background: linear-gradient(135deg, var(--popup-blue-accent), var(--popup-blue-accent-bright)) !important;
}

html body dialog.feature-announcement-player-career .feature-announcement-accent {
  background:
    radial-gradient(circle at 50% 48%, rgba(255, 171, 232, .34), transparent 34%),
    radial-gradient(circle at 8% 105%, rgba(93, 218, 255, .24), transparent 40%),
    linear-gradient(145deg, #8a39d5 0%, #6330bd 54%, #3d278e 100%);
}

.feature-announcement-player-career-awards {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 14px;
}

.feature-announcement-player-career-awards span {
  display: grid;
  width: 76px;
  height: 88px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .26);
  border-radius: 18px;
  background: rgba(23, 8, 61, .3);
  box-shadow: 0 14px 28px rgba(25, 7, 62, .28), inset 0 1px rgba(255, 255, 255, .12);
  transform: translateY(6px) rotate(-5deg);
}

.feature-announcement-player-career-awards span:nth-child(2) {
  width: 88px;
  height: 102px;
  transform: translateY(0);
}

.feature-announcement-player-career-awards span:nth-child(3) {
  transform: translateY(6px) rotate(5deg);
}

html body dialog.feature-announcement-player-career .feature-announcement-player-career-awards img {
  width: 54px;
  max-width: 70%;
  max-height: 70%;
  object-fit: contain;
  filter: brightness(0) invert(1) drop-shadow(0 8px 12px rgba(22, 5, 58, .38));
}

html body dialog.feature-announcement-player-career .feature-announcement-button {
  border-color: rgba(229, 211, 255, .55) !important;
  color: #fff !important;
  background: linear-gradient(135deg, #9d4edd, #6734c2) !important;
}

.feature-announcement-retro-ucl .feature-announcement-retro-ucl-actions .feature-announcement-button {
  border-color: rgba(190, 211, 255, .46) !important;
  color: #fff !important;
  background: linear-gradient(135deg, #3568ed, #734de7) !important;
}

.feature-announcement-latest-leagues .feature-announcement-latest-league-actions .is-saudi {
  border-color: rgba(201, 246, 220, .5) !important;
  color: #002b19 !important;
  background: linear-gradient(135deg, #e8fff2, #94e9b9) !important;
}

.feature-announcement-latest-leagues .feature-announcement-latest-league-actions .is-mls {
  border-color: rgba(255, 220, 222, .5) !important;
  color: #fff !important;
  background: linear-gradient(135deg, #ff7479, #e2232a 58%, #b3141d) !important;
}

.feature-announcement-modal .feature-announcement-dismiss {
  color: var(--popup-blue-muted) !important;
}

.feature-announcement-modal .feature-announcement-pitch-preview {
  border-color: var(--popup-blue-line) !important;
  background: rgba(5, 25, 57, 0.62) !important;
}

/* Achievement browsing keeps each competition's identity. This stylesheet is
   loaded after the deferred mode bundle, so these token-based guards must
   override the generic blue dialog language without hard-coding one edition. */
html body #retroAchievementsModal[data-achievement-theme][open] {
  border: 1px solid color-mix(in srgb, var(--achievement-accent) 44%, transparent) !important;
  border-top: 5px solid var(--achievement-accent) !important;
  color: var(--achievement-copy) !important;
  background:
    radial-gradient(circle at 92% 4%, color-mix(in srgb, var(--achievement-accent) 22%, transparent), transparent 36%),
    linear-gradient(145deg, var(--achievement-surface), var(--achievement-surface-deep) 72%) !important;
  box-shadow: 0 30px 90px var(--achievement-shadow) !important;
}

html body #retroAchievementsModal[data-achievement-theme][open]::backdrop {
  background: color-mix(in srgb, var(--achievement-surface-deep) 82%, transparent) !important;
}

html body #retroAchievementsModal[data-achievement-theme][open] :is(h2, h3, strong) {
  color: var(--achievement-copy) !important;
}

html body #retroAchievementsModal[data-achievement-theme][open] :is(p, small) {
  color: var(--achievement-muted) !important;
}

html body #retroAchievementsModal[data-achievement-theme][open] :is(.achievement-category-tabs, .achievement-year-tabs) {
  border: 1px solid color-mix(in srgb, var(--achievement-accent) 34%, transparent) !important;
  background: var(--achievement-tab-surface) !important;
}

html body #retroAchievementsModal[data-achievement-theme][open] :is(.achievement-category-tabs, .achievement-year-tabs) button {
  color: var(--achievement-muted) !important;
  background: transparent !important;
}

html body #retroAchievementsModal[data-achievement-theme][open] :is(.achievement-category-tabs, .achievement-year-tabs) button[aria-selected="true"] {
  color: var(--achievement-accent-text) !important;
  background: var(--achievement-accent) !important;
  box-shadow: 0 6px 18px var(--achievement-shadow) !important;
}

html body #retroAchievementsModal[data-achievement-theme][open] .retro-achievements-close {
  border-color: color-mix(in srgb, var(--achievement-accent) 38%, transparent) !important;
  color: var(--achievement-copy) !important;
  background: var(--achievement-tab-surface) !important;
}

html body #retroAchievementsModal[data-achievement-theme][open] .retro-achievements-progress span {
  color: var(--achievement-accent) !important;
}

html body #retroAchievementsModal[data-achievement-theme][open] .achievement-progress-track {
  background: var(--achievement-tab-surface) !important;
}

html body #retroAchievementsModal[data-achievement-theme][open] .achievement-progress-track span {
  background: var(--achievement-accent) !important;
}

html body #retroAchievementsModal[data-achievement-theme][open] .achievement-country {
  border-color: color-mix(in srgb, var(--achievement-accent) 24%, transparent) !important;
  color: var(--achievement-copy) !important;
  background: var(--achievement-card) !important;
}

html body #retroAchievementsModal[data-achievement-theme][open] .achievement-country.is-complete {
  background: var(--achievement-card-complete) !important;
  box-shadow: inset 4px 0 var(--achievement-accent) !important;
}

#achievementUnlockModal .achievement-unlock-action {
  color: #04152f !important;
  background: linear-gradient(135deg, var(--popup-blue-accent), var(--popup-blue-accent-bright)) !important;
}

@media (hover: hover) and (pointer: fine) {
  #settingsModal :is(.settings-option, .tournament-theme-options > button, .settings-keybind-button):hover,
  :is(
    #settingsModal,
    #bugReportModal,
    #feedbackResponseModal,
    #feedbackAdminModal,
    #discordModal,
    #donateModal,
    #challengeAuthModal,
    #usernameReviewModal,
    #profileDeleteModal
  ) :is(.icon-button, .close-modal):hover {
    border-color: var(--popup-blue-line-strong) !important;
    background: rgba(18, 63, 129, 0.94) !important;
  }

  .feature-announcement-modal .feature-announcement-button:hover,
  :is(#bugReportModal, #feedbackAdminModal) :is(.bug-report-submit, #feedbackAdminSubmit):hover,
  #feedbackResponseModal #feedbackResponseAcknowledge:hover,
  #discordModal .discord-join-button:hover,
  #donateModal .donate-modal-link:hover {
    background: linear-gradient(135deg, #65a8ff, #82d3ff) !important;
  }

  .feature-announcement-latest-leagues .feature-announcement-latest-league-actions .is-saudi:hover {
    background: linear-gradient(135deg, #f4fff8, #b7f2d0) !important;
  }

  .feature-announcement-latest-leagues .feature-announcement-latest-league-actions .is-mls:hover {
    background: linear-gradient(135deg, #ff8e92, #e2232a) !important;
  }
}

@media (max-width: 560px) {
  :is(
    #settingsModal,
    #bugReportModal,
    #feedbackResponseModal,
    #feedbackAdminModal,
    #discordModal,
    #donateModal,
    #challengeAuthModal,
    #usernameReviewModal,
    #profileDeleteModal,
    .feature-announcement-modal,
    #retroAchievementsModal,
    #achievementUnlockModal
  ) {
    max-width: calc(100vw - 20px) !important;
    max-height: calc(100dvh - 20px) !important;
    border-radius: 14px !important;
  }

  #settingsModal form {
    padding: 18px 14px;
  }

  #settingsModal .settings-option {
    margin-top: 9px;
    padding: 14px;
  }

  #settingsModal .tournament-theme-setting,
  #settingsModal .settings-keybind-list {
    padding: 12px;
  }

  #settingsModal .tournament-edition-options {
    gap: 6px !important;
  }

  #settingsModal .tournament-edition-options > button {
    min-height: 70px !important;
  }

  #settingsModal .tournament-edition-options > button > img {
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
  }

  #discordModal,
  #donateModal {
    width: calc(100vw - 20px);
  }

  html body dialog.feature-announcement-modal .feature-announcement-accent {
    min-height: clamp(110px, 21dvh, 150px);
  }

  html body dialog.feature-announcement-modal .feature-announcement-accent img,
  html body dialog.feature-announcement-afcon-2025 .feature-announcement-afcon-2025-visual img {
    max-width: min(150px, 48vw) !important;
    max-height: min(150px, 20dvh) !important;
  }

  #retroAchievementsModal {
    padding: 16px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  :is(
    #settingsModal,
    #bugReportModal,
    #feedbackResponseModal,
    #feedbackAdminModal,
    #discordModal,
    #donateModal,
    #challengeAuthModal,
    #usernameReviewModal,
    #profileDeleteModal,
    .feature-announcement-modal,
    #retroAchievementsModal,
    #achievementUnlockModal
  )[open] {
    animation: none !important;
  }
}
/* AFC Asian Cup Saudi Arabia 2027 keeps its Saudi green identity in the
   shared achievements popup, which loads after deferred tournament skins. */
.retro-achievements-modal[data-achievement-theme="asian-cup-2027"],
.achievements-screen[data-achievement-theme="asian-cup-2027"] {
  --achievement-accent: #94e9b9 !important;
  --achievement-accent-text: #002b19 !important;
  --achievement-surface: #005430 !important;
  --achievement-surface-deep: #001d12 !important;
  --achievement-tab-surface: #002b19 !important;
  --achievement-card: rgba(0, 84, 48, .9) !important;
  --achievement-card-complete: #086842 !important;
  --achievement-copy: #f6fff9 !important;
  --achievement-muted: #b8ddca !important;
  --achievement-points: #94e9b9 !important;
  --achievement-shadow: rgba(0, 16, 10, .5) !important;
  border-color: rgba(148, 233, 185, .38) !important;
  color: #f6fff9 !important;
  background: linear-gradient(145deg, #005430, #001d12) !important;
}

[data-achievement-theme="asian-cup-2027"] :is(
  .achievement-category-tabs button[aria-selected="true"],
  .achievement-year-tabs button[aria-selected="true"],
  .achievement-year-tabs button.is-selected,
  .achievement-progress-fill,
  .achievement-login-button
) {
  border-color: #94e9b9 !important;
  color: #002b19 !important;
  background: #94e9b9 !important;
  box-shadow: none !important;
}