.theme-dock {
  width: auto;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  font-family: "Courier New", Courier, monospace;
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .06em;
}

.theme-dock > span:first-child { margin-right: .25rem; }
.theme-dock button {
  min-height: 32px;
  padding: .3rem .65rem;
  border: 2px solid currentColor;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}
.theme-dock button[aria-pressed="true"] {
  background: #b8ff5a;
  color: #080b0a;
  box-shadow: 3px 3px 0 currentColor;
}
.theme-dock button:focus-visible { outline: 3px dashed #ff4f00; outline-offset: 3px; }
.theme-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

html[data-theme="1996"] .theme-dock {
  padding: 0;
  border: 0;
  background: transparent;
  color: #11120f;
  box-shadow: none;
}
html[data-theme="1996"] .theme-dock button { border-style: outset; background: linear-gradient(#fff9cd, #c8c2a8); }
html[data-theme="1996"] .theme-dock button[aria-pressed="true"] { background: linear-gradient(#e7ffa7, #8fe400); }
html[data-theme="1996"] .theme-dock button:active { border-style: inset; transform: translate(2px, 2px); }

@media (max-width: 560px) {
  .site-header { display: grid; grid-template-columns: 1fr auto; gap: .55rem; }
  .site-header .brand { grid-column: 1; grid-row: 1; }
  .site-header nav { grid-column: 2; grid-row: 1; }
  .site-header .theme-dock { grid-column: 1 / -1; grid-row: 2; justify-self: stretch; }
  .theme-dock > span:first-child { display: none; }
  .theme-dock button { flex: 1; max-width: none; }
}