.theme-toolbar {
  display: flex;
  justify-content: flex-end;
  padding: 10px 20px;
  background: #f4f1fa;
  position: relative;
  z-index: 10;
}
#theme-toggle {
  font:
    600 12px/1.2 system-ui,
    sans-serif;
  border: 1px solid #cfc5df;
  border-radius: 999px;
  padding: 9px 13px;
  min-height: 36px;
  background: #fff;
  color: #514169;
  cursor: pointer;
}
#theme-toggle:focus-visible {
  outline: 3px solid #379acc;
  outline-offset: 3px;
}
html[data-theme="dark"] {
  color-scheme: dark;
}
html[data-theme="dark"] body,
html[data-theme="dark"] .theme-toolbar {
  background: #15141e;
  color: #f0edf8;
}
html[data-theme="dark"] #theme-toggle {
  background: #2b263c;
  border-color: #605275;
  color: #eee7ff;
}
html[data-theme="dark"] main article,
html[data-theme="dark"] .hud,
html[data-theme="dark"] .modal {
  background: #242131;
  border-color: #40384e;
  color: #f0edf8;
}
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] .modal h2 {
  color: #f5efff;
}
html[data-theme="dark"] p,
html[data-theme="dark"] .modal p,
html[data-theme="dark"] .stamp,
html[data-theme="dark"] footer,
html[data-theme="dark"] footer button,
html[data-theme="dark"] .instruction {
  color: #c1b7d0;
}
html[data-theme="dark"] small,
html[data-theme="dark"] .eyebrow,
html[data-theme="dark"] .number,
html[data-theme="dark"] .hud span,
html[data-theme="dark"] .feedback span {
  color: #bbaad0;
}
html[data-theme="dark"] h1 em {
  color: #bba1f0;
}
html[data-theme="dark"] a.alt,
html[data-theme="dark"] .feedback-icon {
  background: #373047;
  color: #ded0fa;
}
html[data-theme="dark"] .progress i {
  background: #3d354c;
}
html[data-theme="dark"] .progress i.done {
  background: #ad8fdf;
}
html[data-theme="dark"] .progress i.active {
  background: #91d5f0;
}
html[data-theme="dark"] #precision {
  color: #56dd92;
}
html[data-theme="dark"] .game header img {
  mix-blend-mode: normal;
  background: #f5f3fa;
  border-radius: 5px;
}
html[data-theme="dark"] header button {
  color: #d0b9ff;
  border-color: #625476;
}
html[data-theme="dark"] .ptk-iw-email-modal {
  color-scheme: light;
}

.theme-toolbar {
  padding: 0;
  background: transparent !important;
  flex-shrink: 0;
}
header .edition {
  display: none;
}
header img {
  margin-right: auto;
}
#theme-toggle {
  width: auto;
  height: auto;
  white-space: nowrap;
  font-size: 11px;
  padding: 9px 10px;
}
html[data-theme="dark"] .game {
  background: #15141e;
}
/* Keep the logo's native proportions to avoid a pale object-fit gutter. */
.game header img {
  height: auto;
  object-fit: fill;
  border: 0;
  outline: 0;
  box-shadow: none;
}
html[data-theme="dark"] .game header img {
  background: transparent;
  border-radius: 0;
}
/* Smaller inset radius complements the 24px outer game frame. */
.game header img,
html[data-theme="dark"] .game header img {
  border-radius: 8px;
}
/* Match the document canvas to the body, including the iframe's rounded edge. */
html[data-theme="dark"],
html[data-theme="dark"] body {
  background: #15141e;
}
.game {
  padding-top: 32px;
}
.game header {
  height: auto;
  min-height: 48px;
  gap: 12px;
}
.game .heading {
  margin-top: 28px;
}
@media (max-width: 540px) {
  .game {
    padding-top: 20px;
  }
  .game header {
    height: auto;
    min-height: 40px;
  }
  .game .heading {
    margin-top: 24px;
  }
}