.arcade-settings-button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  margin-left: auto;
  padding: 7px 10px;
  border: 1px solid color-mix(in srgb, currentColor 28%, transparent);
  border-radius: 999px;
  color: var(--copper, #9c4e20);
  background: color-mix(in srgb, var(--cream-light, #faf3df) 86%, transparent);
  box-shadow: 0 5px 14px rgba(42, 31, 23, 0.06);
  font: 600 8px/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  cursor: pointer;
}

.site-header > .arcade-settings-button { margin-right: 14px; }
.header-status > .arcade-settings-button { margin-right: 2px; }

.arcade-settings-button i,
.arcade-settings-button i::before,
.arcade-settings-button i::after {
  display: block;
  width: 12px;
  height: 1px;
  background: currentColor;
  content: "";
}

.arcade-settings-button i { position: relative; }
.arcade-settings-button i::before { position: absolute; top: -4px; left: 0; }
.arcade-settings-button i::after { position: absolute; top: 4px; left: 0; }

.arcade-settings-button:hover { border-color: currentColor; transform: translateY(-1px); }
.arcade-settings-button:focus-visible { outline: 2px solid var(--gold, #d39a3d); outline-offset: 3px; }

.arcade-settings-dialog {
  width: min(92vw, 390px);
  padding: 0;
  border: 1px solid var(--rule, #d3c3a2);
  border-radius: 12px;
  color: var(--oak, #2a1f17);
  background: var(--cream-light, #faf3df);
  box-shadow: 0 28px 80px rgba(31, 21, 14, 0.34);
}

.arcade-settings-dialog::backdrop {
  background: rgba(29, 20, 14, 0.55);
  backdrop-filter: blur(5px);
}

.arcade-settings-panel { padding: 24px; }
.arcade-settings-head { display: flex; align-items: start; justify-content: space-between; gap: 18px; }
.arcade-settings-kicker {
  margin: 0 0 4px;
  color: var(--copper, #9c4e20);
  font: 600 8px/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: 1.6px;
  text-transform: uppercase;
}
.arcade-settings-head h2 { margin: 0; font: 400 34px/.95 "Newsreader", Georgia, serif; }
.arcade-settings-close {
  width: 34px;
  height: 34px;
  border: 1px solid var(--rule, #d3c3a2);
  border-radius: 50%;
  color: inherit;
  background: transparent;
  font-size: 20px;
  cursor: pointer;
}

.arcade-setting-list { display: grid; gap: 8px; margin: 22px 0 0; }
.arcade-setting {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: center;
  min-height: 58px;
  padding: 11px 12px;
  border: 1px solid var(--rule, #d3c3a2);
  border-radius: 8px;
  background: color-mix(in srgb, var(--paper, #f1e6d0) 66%, transparent);
}
.arcade-setting strong { display: block; font-size: 14px; }
.arcade-setting small { display: block; margin-top: 3px; color: var(--stone, #7f7262); font-size: 11px; line-height: 1.2; }
.arcade-setting button,
.arcade-install-button {
  min-width: 78px;
  padding: 8px 10px;
  border: 1px solid var(--copper, #9c4e20);
  border-radius: 999px;
  color: var(--copper, #9c4e20);
  background: transparent;
  font: 600 9px/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: 1px;
  text-transform: uppercase;
  cursor: pointer;
}
.arcade-setting button[aria-pressed="true"] { color: #fff8ea; background: var(--copper, #9c4e20); }
.arcade-install-button { width: 100%; margin-top: 12px; border-radius: 7px; padding: 12px; }
.arcade-settings-note { margin: 16px 0 0; color: var(--stone, #7f7262); font: italic 12px/1.35 "Newsreader", Georgia, serif; }

.arcade-toast {
  position: fixed;
  z-index: 80;
  right: max(14px, env(safe-area-inset-right));
  bottom: max(14px, env(safe-area-inset-bottom));
  max-width: min(86vw, 320px);
  padding: 10px 13px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 7px;
  color: #fff8ea;
  background: rgba(42, 31, 23, .94);
  box-shadow: 0 12px 30px rgba(25, 16, 10, .28);
  font: 600 9px/1.25 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .8px;
  text-transform: uppercase;
  transition: opacity 180ms ease, transform 180ms ease;
}
.arcade-toast[hidden] { display: block; opacity: 0; transform: translateY(8px); pointer-events: none; }

html[data-arcade-motion="reduce"] *,
html[data-arcade-motion="reduce"] *::before,
html[data-arcade-motion="reduce"] *::after {
  scroll-behavior: auto !important;
  animation-duration: .001ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: .001ms !important;
}

@media (max-width: 520px) {
  .arcade-settings-button span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
  .arcade-settings-button { width: 34px; justify-content: center; padding: 0; }
  .site-header > .arcade-settings-button { margin-right: 10px; }
  .header-status > .arcade-settings-button { margin-right: 0; }
}