/* Settings control: visible in the standard site and transformed with the rest of 1999 Mode. */
.settings-mode-panel {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem 2rem;
  align-items: center;
}

.settings-mode-copy .settings-panel-head {
  margin-bottom: 0.55rem;
}

.settings-mode-copy > p {
  max-width: 46rem;
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.mode-1999-toggle {
  min-height: 3.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 0.65rem 1rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink);
  background: color-mix(in srgb, var(--surface) 92%, var(--accent) 8%);
  font: inherit;
  font-size: 0.8rem;
  font-weight: 900;
  cursor: pointer;
}

.mode-1999-toggle:hover,
.mode-1999-toggle:focus-visible,
.mode-1999-toggle.is-active {
  border-color: var(--accent);
}

.mode-1999-toggle:disabled {
  cursor: wait;
  opacity: 0.72;
}

.mode-1999-switch {
  width: 2.8rem;
  height: 1.5rem;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  padding: 0.15rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: color-mix(in srgb, var(--bg) 76%, #000 24%);
}

.mode-1999-switch span {
  width: 1.05rem;
  height: 1.05rem;
  display: block;
  border-radius: 50%;
  background: var(--muted);
  transform: translateX(0);
  transition: transform 180ms ease, background-color 180ms ease;
}

.mode-1999-toggle.is-active .mode-1999-switch span {
  background: var(--accent);
  transform: translateX(1.25rem);
}

.settings-1999-palettes {
  grid-column: 1 / -1;
  padding-top: 1rem;
  border-top: 1px solid var(--line);
}

.settings-1999-palette-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.35rem 1rem;
  margin-bottom: 0.75rem;
}

.settings-1999-palette-head > strong {
  color: var(--ink);
  font-size: 0.9rem;
}

.settings-1999-palette-head > span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
}

.settings-1999-palette-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.65rem;
}

.palette-swatch-1999 {
  min-height: 5.6rem;
}

.palette-swatch-1999.is-active {
  border-color: var(--accent);
  outline: 2px solid color-mix(in srgb, var(--accent) 34%, transparent);
  outline-offset: 2px;
}

.mode-1999-banner,
.mode-1999-signoff {
  display: none;
}

.mode-transition-curtain {
  position: fixed;
  inset: 0;
  z-index: 2147483646;
  pointer-events: none;
  opacity: 0;
  background-color: #050505;
  background-image: repeating-linear-gradient(
    0deg,
    rgba(255, 255, 255, 0.045) 0 1px,
    transparent 1px 4px
  );
  transition: opacity 140ms linear;
}

.mode-transition-curtain.is-active {
  opacity: 1;
}

.mode-transition-curtain.is-leaving {
  opacity: 0;
  transition-duration: 260ms;
}

/* Global late-1990s visual system. Geometry stays responsive; presentation changes everywhere. */
html[data-mode="1999"] {
  --1999-bg: #000066;
  --1999-surface: #000099;
  --1999-ink: #ffff66;
  --1999-muted: #ffffff;
  --1999-accent: #ff00ff;
  --1999-link: #00ffff;
  --1999-visited: #ff99ff;
  --1999-border: #ffff00;
  --1999-tileA: #000066;
  --1999-tileB: #000033;
  --1999-headingBg: #ff00ff;
  --1999-headingInk: #ffff00;
  --1999-good: #00ff00;
  --1999-danger: #ff3300;
  color-scheme: dark;
  scrollbar-color: var(--1999-accent, #ff00ff) var(--1999-bg, #000066);
}

html[data-mode="1999"][data-1999-palette="cyberspace_night"] {
  --1999-bg: #000000;
  --1999-surface: #001a33;
  --1999-ink: #f5f5f5;
  --1999-muted: #99ccff;
  --1999-accent: #00ff66;
  --1999-link: #00ffff;
  --1999-visited: #ff00ff;
  --1999-border: #00ff66;
  --1999-tileA: #000000;
  --1999-tileB: #001133;
  --1999-headingBg: #0011aa;
  --1999-headingInk: #00ffff;
  --1999-good: #39ff14;
  --1999-danger: #ff3366;
}

html[data-mode="1999"][data-1999-palette="purple_planet"] {
  --1999-bg: #21003d;
  --1999-surface: #3d0066;
  --1999-ink: #ffffff;
  --1999-muted: #ffccff;
  --1999-accent: #ffcc00;
  --1999-link: #66ffff;
  --1999-visited: #ff99ff;
  --1999-border: #ff66cc;
  --1999-tileA: #21003d;
  --1999-tileB: #3d0066;
  --1999-headingBg: #72008f;
  --1999-headingInk: #ffff00;
  --1999-good: #66ff99;
  --1999-danger: #ff6633;
}

html[data-mode="1999"][data-1999-palette="under_construction"] {
  --1999-bg: #111111;
  --1999-surface: #292929;
  --1999-ink: #fff700;
  --1999-muted: #ffffff;
  --1999-accent: #ff7a00;
  --1999-link: #39ff14;
  --1999-visited: #ff00aa;
  --1999-border: #fff700;
  --1999-tileA: #111111;
  --1999-tileB: #333333;
  --1999-headingBg: #ff7a00;
  --1999-headingInk: #000000;
  --1999-good: #39ff14;
  --1999-danger: #ff2a2a;
}

html[data-mode="1999"],
html[data-mode="1999"] body {
  min-width: 0;
  background-color: var(--1999-bg, #000066) !important;
}

html[data-mode="1999"] body {
  overflow-x: hidden;
  color: var(--1999-ink, #ffff66) !important;
  background-image: repeating-linear-gradient(
    135deg,
    var(--1999-tileA, #000066) 0 14px,
    var(--1999-tileB, #000033) 14px 28px
  ) !important;
  background-attachment: fixed !important;
}

html[data-mode="1999"] body,
html[data-mode="1999"] body * {
  font-family: "Comic Sans MS", "Comic Sans", cursive !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-mode="1999"] body::before,
html[data-mode="1999"] body::after,
html[data-mode="1999"] .site-main::before,
html[data-mode="1999"] .site-main::after,
html[data-mode="1999"] [class*="orb"],
html[data-mode="1999"] [class*="glow"] {
  display: none !important;
}

html[data-mode="1999"] ::selection {
  color: #000;
  background: var(--1999-accent, #ff00ff);
}

html[data-mode="1999"] a {
  color: var(--1999-link, #00ffff) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
}

html[data-mode="1999"] a:visited {
  color: var(--1999-visited, #ff99ff) !important;
}

html[data-mode="1999"] a:hover,
html[data-mode="1999"] a:focus-visible {
  color: var(--1999-headingInk, #ffff00) !important;
  background-color: transparent !important;
  outline: 2px dotted var(--1999-border, #ffff00) !important;
  outline-offset: 2px;
}

html[data-mode="1999"] :where(h1, h2, h3, h4, h5, h6) {
  width: fit-content;
  max-width: 100%;
  padding: 0 0 0.12em;
  border: 0 !important;
  border-bottom: 2px dotted var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  color: var(--1999-headingInk, #ffff00) !important;
  background: transparent !important;
  box-shadow: none !important;
  text-shadow: 2px 2px 0 #000 !important;
  letter-spacing: 0 !important;
}

html[data-mode="1999"] :where(p, li, dd, dt, label, small, time, blockquote, figcaption) {
  color: var(--1999-ink, #ffff66) !important;
}

html[data-mode="1999"] :where(.eyebrow, .lede, [class*="-meta"], [class*="-subtitle"], [class*="-kicker"]) {
  color: var(--1999-muted, #fff) !important;
  letter-spacing: 0.04em !important;
}

html[data-mode="1999"] :where(.site-main, .page-shell, .section-band) {
  background-color: transparent !important;
  background-image: none !important;
}

html[data-mode="1999"] :where(.page-hero, .home-hero, .article-header) {
  border-top: 4px ridge var(--1999-border, #ffff00) !important;
  border-bottom: 4px ridge var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  background-color: var(--1999-tileA, #000066) !important;
  background-image: repeating-linear-gradient(
    90deg,
    var(--1999-tileA, #000066) 0 18px,
    var(--1999-tileB, #000033) 18px 36px
  ) !important;
  box-shadow: none !important;
}

html[data-mode="1999"] .article-header::before,
html[data-mode="1999"] .article-header::after {
  display: none !important;
}

html[data-mode="1999"] .section-inner {
  width: min(calc(100% - 1rem), 72rem) !important;
}

html[data-mode="1999"] :is(
  [class$="-card"],
  [class*="-card "],
  [class$="-panel"],
  [class*="-panel "],
  [class$="-tile"],
  [class*="-tile "],
  [class$="-box"],
  [class*="-box "],
  .card,
  .panel,
  .tile,
  .box,
  details,
  fieldset
) {
  border: 3px outset var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  color: var(--1999-ink, #ffff66) !important;
  background-color: var(--1999-surface, #000099) !important;
  background-image: none !important;
  box-shadow: 4px 4px 0 #000 !important;
}

html[data-mode="1999"] :is(
  [class$="-card"],
  [class*="-card "],
  [class$="-panel"],
  [class*="-panel "],
  [class$="-tile"],
  [class*="-tile "],
  [class$="-box"],
  [class*="-box "],
  .card,
  .panel,
  .tile,
  .box
)::before,
html[data-mode="1999"] :is(
  [class$="-card"],
  [class*="-card "],
  [class$="-panel"],
  [class*="-panel "],
  [class$="-tile"],
  [class*="-tile "],
  [class$="-box"],
  [class*="-box "],
  .card,
  .panel,
  .tile,
  .box
)::after {
  background-image: none !important;
  filter: none !important;
}

html[data-mode="1999"] :where(button:not(.rotary-hole), .button, input[type="button"], input[type="submit"]) {
  min-height: 2.75rem;
  border: 3px outset var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  color: var(--1999-link, #00ffff) !important;
  background: var(--1999-tileB, #000033) !important;
  box-shadow: 3px 3px 0 #000 !important;
  text-decoration: none !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

html[data-mode="1999"] :where(button:not(.rotary-hole), .button, input[type="button"], input[type="submit"]):active {
  border-style: inset !important;
  box-shadow: 1px 1px 0 #000 !important;
  transform: translate(2px, 2px);
}

html[data-mode="1999"] :where(input:not([type="button"]):not([type="submit"]), select, textarea) {
  min-height: 2.75rem;
  border: 3px inset var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  color: #000 !important;
  background: #fff !important;
  box-shadow: none !important;
}

html[data-mode="1999"] :where(input, textarea)::placeholder {
  color: #555 !important;
  opacity: 1;
}

html[data-mode="1999"] :where(hr, .footer-line, .header-line) {
  height: 4px !important;
  border: 0 !important;
  background: var(--1999-border, #ffff00) !important;
}

html[data-mode="1999"] :where(table, th, td) {
  border: 2px ridge var(--1999-border, #ffff00) !important;
  border-collapse: collapse !important;
  color: var(--1999-ink, #ffff66) !important;
  background: var(--1999-surface, #000099) !important;
}

html[data-mode="1999"] :where(pre, code, kbd, samp) {
  border-radius: 0 !important;
  color: #00ff00 !important;
  background: #000 !important;
  font-family: "Courier New", monospace !important;
}

html[data-mode="1999"] main img {
  border: 3px ridge var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  box-shadow: 4px 4px 0 #000 !important;
}

html[data-mode="1999"] svg {
  color: currentColor;
  filter: none !important;
}

html[data-mode="1999"] .mode-1999-banner {
  height: 2rem;
  display: flex;
  align-items: center;
  overflow: hidden;
  border-top: 3px ridge var(--1999-border, #ffff00);
  border-bottom: 3px ridge var(--1999-border, #ffff00);
  color: var(--1999-headingInk, #ffff00);
  background: var(--1999-headingBg, #ff00ff);
}

html[data-mode="1999"] .mode-1999-banner-track {
  width: max-content;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 4rem;
  padding-left: 100vw;
  white-space: nowrap;
  font-size: 0.8rem;
  font-weight: 900;
  text-shadow: 2px 2px 0 #000;
  animation: mode-1999-marquee 20s linear infinite;
}

html[data-mode="1999"] .mode-1999-banner-track span::before {
  content: "\2605";
  margin-right: 0.75rem;
  color: var(--1999-accent, #ff00ff);
}

@keyframes mode-1999-marquee {
  to {
    transform: translateX(-100%);
  }
}

html[data-mode="1999"] .site-header {
  position: relative !important;
  inset: auto !important;
  z-index: 50;
  border-bottom: 5px ridge var(--1999-border, #ffff00) !important;
  background: var(--1999-surface, #000099) !important;
  box-shadow: none !important;
}

html[data-mode="1999"] .top-header {
  background: var(--1999-surface, #000099) !important;
  box-shadow: none !important;
}

html[data-mode="1999"] .header-inner {
  width: min(calc(100% - 1rem), 72rem) !important;
}

html[data-mode="1999"] .logo-img {
  border: 3px outset var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  image-rendering: pixelated;
  box-shadow: 3px 3px 0 #000 !important;
}

html[data-mode="1999"] :where(.logo-text, .footer-brand-title, .drawer-title-link) {
  color: var(--1999-headingInk, #ffff00) !important;
  text-shadow: 2px 2px 0 #000 !important;
}

html[data-mode="1999"] :where(.logo-sub, .drawer-subtitle) {
  color: var(--1999-muted, #fff) !important;
}

html[data-mode="1999"] :where(.main-nav .nav-link, .header-social a) {
  border: 2px outset var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  color: var(--1999-link, #00ffff) !important;
  background: var(--1999-tileB, #000033) !important;
  box-shadow: 2px 2px 0 #000 !important;
  text-decoration: underline !important;
}

html[data-mode="1999"] .dropdown-menu {
  border: 3px outset var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  background: var(--1999-surface, #000099) !important;
  box-shadow: 5px 5px 0 #000 !important;
}

html[data-mode="1999"] .dropdown-menu a {
  border-bottom: 1px dotted var(--1999-border, #ffff00) !important;
  color: var(--1999-link, #00ffff) !important;
  background: transparent !important;
}

html[data-mode="1999"] :where(.drawer, .drawer-keypad) {
  border: 5px outset var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  color: var(--1999-ink, #ffff66) !important;
  background: var(--1999-bg, #000066) !important;
  box-shadow: 8px 0 0 #000 !important;
}

html[data-mode="1999"] .drawer-overlay {
  background: rgba(0, 0, 0, 0.72) !important;
  backdrop-filter: none !important;
}

html[data-mode="1999"] :where(.keycap, .keypad-status, .drawer-header) {
  border-color: var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  color: var(--1999-ink, #ffff66) !important;
  background: var(--1999-surface, #000099) !important;
  box-shadow: 3px 3px 0 #000 !important;
}

html[data-mode="1999"] .site-footer {
  border-top: 6px ridge var(--1999-border, #ffff00) !important;
  border-bottom: 6px ridge var(--1999-border, #ffff00) !important;
  color: var(--1999-ink, #ffff66) !important;
  background: var(--1999-surface, #000099) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-mode="1999"] .site-footer :where(h2, h3) {
  font-size: 1rem !important;
}

html[data-mode="1999"] .footer-social img,
html[data-mode="1999"] .footer-art img {
  border: 2px outset var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  image-rendering: pixelated;
}

html[data-mode="1999"] .mode-1999-signoff {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.4rem 2rem;
  padding: 0.5rem;
  border-bottom: 4px ridge var(--1999-border, #ffff00);
  color: var(--1999-ink, #ffff66);
  background: #000;
  text-align: center;
  font-size: 0.72rem;
}

html[data-mode="1999"] :where(
  .cookie-banner,
  .welcome-bubble,
  .first-viewer-offer__dialog,
  .modal-dialog,
  #site-memory .sm-card
) {
  border: 4px outset var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  color: var(--1999-ink, #ffff66) !important;
  background: var(--1999-surface, #000099) !important;
  background-image: none !important;
  box-shadow: 8px 8px 0 #000 !important;
}

html[data-mode="1999"] :where(.bottom-console, .pane, .entry, #hud) {
  border: 3px outset var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  color: var(--1999-ink, #ffff66) !important;
  background: var(--1999-surface, #000099) !important;
  box-shadow: 4px 4px 0 #000 !important;
}

html[data-mode="1999"] #loading {
  color: var(--1999-ink, #ffff66) !important;
  background: #000 !important;
}

html[data-mode="1999"] .header-block h1 {
  margin-inline: auto !important;
}

html[data-mode="1999"] .mode-1999-switch,
html[data-mode="1999"] .mode-1999-switch span {
  border-radius: 0 !important;
}

html[data-mode="1999"] .article-progress,
html[data-mode="1999"] .signal-post .article-progress {
  top: 0 !important;
  height: 4px !important;
  background: #000 !important;
  box-shadow: none !important;
}

html[data-mode="1999"] .article-progress span {
  background: var(--1999-accent, #ff00ff) !important;
  box-shadow: none !important;
}

html[data-mode="1999"] #site-memory {
  padding: 0.5rem !important;
}

html[data-mode="1999"] #site-memory .sm-card {
  width: min(44rem, 100%) !important;
  gap: 0.75rem !important;
  box-shadow: 4px 4px 0 #000 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-mode="1999"] #site-memory .sm-actions {
  flex-wrap: wrap !important;
}

html[data-mode="1999"] #smWelcomeBubble {
  right: 0.5rem !important;
  bottom: 0.5rem !important;
  max-width: min(22rem, calc(100vw - 1rem)) !important;
  border: 3px outset var(--1999-border, #ffff00) !important;
  border-radius: 0 !important;
  color: var(--1999-ink, #ffff66) !important;
  background: var(--1999-surface, #000099) !important;
  box-shadow: 4px 4px 0 #000 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-mode="1999"] #firstViewerOffer {
  border: 0 !important;
  padding: 0.5rem !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-mode="1999"] #firstViewerOffer .first-viewer-offer__backdrop {
  background: rgba(0, 0, 0, 0.86) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-mode="1999"] #firstViewerOffer .first-viewer-offer__dialog {
  width: min(42rem, 100%) !important;
  min-height: 0 !important;
  max-height: calc(100svh - 1rem) !important;
  grid-template-columns: 1fr !important;
  overflow: auto !important;
}

html[data-mode="1999"] #firstViewerOffer .first-viewer-offer__art {
  min-height: 10rem !important;
  max-height: 12rem !important;
  border-radius: 0 !important;
}

html[data-mode="1999"] #firstViewerOffer .first-viewer-offer__mockup {
  width: min(36%, 10rem) !important;
}

html[data-mode="1999"] #firstViewerOffer .first-viewer-offer__copy {
  padding: 1rem !important;
}

html[data-mode="1999"] :where(.modal-overlay, .reader-modal) {
  border: 0 !important;
  padding: 0.5rem !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(0, 0, 0, 0.86) !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-mode="1999"] .modal-dialog {
  width: min(42rem, calc(100vw - 1rem)) !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100svh - 1rem) !important;
  overflow: hidden !important;
}

html[data-mode="1999"] :where(table, pre) {
  max-width: 100%;
  overflow-x: auto;
}

html[data-mode="1999"] .settings-1999-palettes {
  border-top: 3px ridge var(--1999-border, #ffff00) !important;
}

html[data-mode="1999"] .palette-swatch-1999.is-active {
  border-style: inset !important;
  outline: 3px dotted var(--1999-accent, #ff00ff) !important;
}

html[data-mode="1999"] .astral-reader-page :where(
  .reader-main,
  .operator-phonebook,
  .operator-contact-row,
  .poem-card,
  .operator-card
) {
  border-color: var(--1999-border, #ffff00) !important;
  color: var(--1999-ink, #ffff66) !important;
  background: var(--1999-tileB, #000033) !important;
  box-shadow: none !important;
}

html[data-mode="1999"] .astral-reader-page :where(
  .operator-contact-row,
  .poem-card,
  .operator-card
):hover,
html[data-mode="1999"] .astral-reader-page :where(
  .operator-contact-row,
  .poem-card,
  .operator-card
):focus-visible,
html[data-mode="1999"] .astral-reader-page :where(
  .operator-contact-row,
  .poem-card,
  .operator-card
):focus-within {
  border-color: var(--1999-accent, #ff00ff) !important;
  background: var(--1999-surface, #000099) !important;
  outline: 2px dotted var(--1999-accent, #ff00ff) !important;
  outline-offset: -3px;
}

@media (min-width: 761px) {
  html[data-mode="1999"] body:has(> .site-header) {
    width: min(calc(100% - 1rem), 59rem);
    min-height: 100%;
    display: grid;
    grid-template-columns: 13rem minmax(0, 1fr);
    grid-template-areas:
      "banner banner"
      "sidebar content"
      "footer footer"
      "signoff signoff";
    align-items: start;
    gap: 0.75rem;
    margin-inline: auto !important;
    border-inline: 4px ridge var(--1999-border, #ffff00);
    box-shadow: 0 0 0 4px #000;
  }

  html[data-mode="1999"] body:has(> .site-header) > .mode-1999-banner {
    grid-area: banner;
    min-width: 0;
  }

  html[data-mode="1999"] body:has(> .site-header) > .site-header {
    grid-area: sidebar;
    align-self: start;
    position: sticky !important;
    top: 0.5rem !important;
    inset-inline: auto !important;
    width: 100%;
    max-height: calc(100svh - 1rem);
    min-width: 0;
    overflow-x: hidden;
    overflow-y: auto;
    border: 4px ridge var(--1999-border, #ffff00) !important;
    box-shadow: 4px 4px 0 #000 !important;
  }

  html[data-mode="1999"] body:has(> .site-header) > .site-main {
    grid-area: content;
    min-width: 0;
    overflow: hidden;
    border: 4px ridge var(--1999-border, #ffff00) !important;
    background-color: var(--1999-tileA, #000066) !important;
    box-shadow: 4px 4px 0 #000 !important;
  }

  html[data-mode="1999"] body:has(> .site-header) > .site-footer {
    grid-area: footer;
    min-width: 0;
  }

  html[data-mode="1999"] body:has(> .site-header) > .mode-1999-signoff {
    grid-area: signoff;
    min-width: 0;
  }

  html[data-mode="1999"] .site-header .top-header,
  html[data-mode="1999"] .site-header .header-inner {
    min-height: 0 !important;
  }

  html[data-mode="1999"] .site-header .header-inner {
    width: 100% !important;
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: 0.8rem;
    margin: 0 !important;
    padding: 0.75rem;
  }

  html[data-mode="1999"] .site-header .brand {
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: 0.55rem;
    text-align: center;
  }

  html[data-mode="1999"] .site-header .brand-text {
    align-items: center;
    white-space: normal;
  }

  html[data-mode="1999"] .site-header .logo-btn,
  html[data-mode="1999"] .site-header .logo-img {
    width: 4.35rem !important;
    height: 4.35rem !important;
  }

  html[data-mode="1999"] .site-header .logo-text {
    font-size: 0.92rem !important;
    white-space: normal;
  }

  html[data-mode="1999"] .site-header .logo-sub {
    font-size: 0.66rem !important;
    line-height: 1.35;
    white-space: normal;
  }

  html[data-mode="1999"] .site-header .main-nav {
    width: 100%;
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: 0.38rem;
  }

  html[data-mode="1999"] .site-header .nav-item {
    width: 100%;
    display: block;
  }

  html[data-mode="1999"] .site-header .nav-item.has-dropdown::before,
  html[data-mode="1999"] .site-header .nav-item.has-dropdown::after,
  html[data-mode="1999"] .site-header .nav-link::after,
  html[data-mode="1999"] .site-header .nav-link-direct::after {
    display: none !important;
  }

  html[data-mode="1999"] .site-header :where(.nav-link, .nav-link-direct) {
    width: 100%;
    min-height: 2.55rem;
    justify-content: space-between;
    padding: 0.48rem 0.58rem !important;
    font-size: 0.75rem !important;
    text-align: left;
  }

  html[data-mode="1999"] .site-header .dropdown-menu {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-height: 0;
    margin: 0 !important;
    padding-block: 0 !important;
    overflow: hidden;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    border-width: 0 !important;
    transform: none !important;
    transition: max-height 160ms ease, opacity 120ms ease, margin 120ms ease, padding 120ms ease !important;
  }

  html[data-mode="1999"] .site-header .nav-item.has-dropdown:hover .dropdown-menu,
  html[data-mode="1999"] .site-header .nav-item.has-dropdown:focus-within .dropdown-menu,
  html[data-mode="1999"] .site-header .nav-item.has-dropdown.is-open .dropdown-menu {
    max-height: 32rem;
    margin-top: 0.35rem !important;
    padding: 0.4rem !important;
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    border-width: 3px !important;
    transform: none !important;
  }

  html[data-mode="1999"] .site-header .header-social {
    width: 100%;
    justify-content: center;
    padding-top: 0.7rem;
    border-top: 2px dotted var(--1999-border, #ffff00);
  }

  html[data-mode="1999"] .site-header .header-line {
    display: none !important;
  }

  html[data-mode="1999"] .site-main .section-inner {
    width: min(calc(100% - 1rem), 45rem) !important;
  }

  html[data-mode="1999"] body:has(> .site-header) .article-progress {
    right: auto !important;
    left: 50% !important;
    width: min(calc(100vw - 1rem), 59rem) !important;
    transform: translateX(-50%);
  }

  html[data-mode="1999"] .site-main > *,
  html[data-mode="1999"] .site-main :where(
    section,
    article,
    nav,
    aside,
    header,
    footer,
    form,
    fieldset,
    figure
  ) {
    min-width: 0;
  }

  html[data-mode="1999"] .home .home-hero-grid {
    width: 100% !important;
    min-height: 0 !important;
    grid-template-columns: 1fr !important;
    gap: 1.35rem !important;
    padding: 1.25rem !important;
  }

  html[data-mode="1999"] .home .home-hero-copy {
    padding-top: 0 !important;
  }

  html[data-mode="1999"] .home .home-hero-copy h1 {
    max-width: none !important;
    font-size: clamp(2.4rem, 5vw, 3.8rem) !important;
    line-height: 1 !important;
  }

  html[data-mode="1999"] .home-hero-library,
  html[data-mode="1999"] .home-hero-shelf,
  html[data-mode="1999"] .home-hero-release {
    width: min(100%, 32rem) !important;
    margin-inline: auto !important;
  }

  html[data-mode="1999"] .home-hero-shelf {
    min-height: 24rem !important;
  }

  html[data-mode="1999"] .home-hero-release {
    min-height: 0 !important;
    grid-template-columns: 1fr !important;
  }

  html[data-mode="1999"] :where(
    .home-featured-layout,
    .home-cover-gallery,
    .home-dispatch-layout,
    .home .signal-home .home-dispatch-layout,
    .home .signal-home .signal-home-header,
    .home-shop-layout,
    .books-hero-layout,
    .catalog-head,
    .catalog-band .catalog-tools,
    .book-detail-grid,
    .detail-layout-primary,
    .books-release-card,
    .book-dossier-head,
    .book-dossier-grid,
    .book-profile-lead,
    .book-profile-grid,
    .book-record-grid,
    .book-profile-feature,
    .book-profile-feature .book-profile-desk,
    .book-about-layout,
    .book-overview-shell,
    .book-overview-head,
    .book-overview-support,
    .astral-reader-gateway,
    .reader-landing-inner,
    .reader-directory-layout,
    .reader-tools,
    .author-profile-grid,
    .author-biography,
    .author-statement,
    .events-desk-grid,
    .events-request-grid,
    .press-room-grid,
    .press-bio-list article,
    .newsletter-receiver-grid,
    .signal-console,
    .signals-index .signal-console,
    .signal-archive-head,
    .signal-status-board,
    .reader-router-head,
    .signal-focus,
    .settings-layout,
    .subscribe-layout,
    .subscribe-intro,
    .article-record,
    .signal-post .article-record,
    .signal-post .article-utilities,
    .footer-layout
  ) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html[data-mode="1999"] :where(
    .journal-index-grid,
    .newsletter-signal-list,
    .reader-router-grid,
    .reader-list,
    .events-confirmed-list,
    .book-note-grid,
    .book-showcase-facts,
    .book-profile-actions
  ) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html[data-mode="1999"] :where(
    .settings-palette-board,
    .press-asset-grid,
    .subscribe-choice-grid,
    .author-shelf
  ) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html[data-mode="1999"] .book-spec-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  html[data-mode="1999"] .book-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html[data-mode="1999"] .signals-index .journal-card {
    grid-template-columns: 3rem minmax(0, 1fr) !important;
  }

  html[data-mode="1999"] .signals-index .signal-lanes > div:not(.signal-lanes-head) {
    grid-template-columns: 4.5rem minmax(0, 1fr) !important;
  }

  html[data-mode="1999"] :where(h1, h2, h3, h4, h5, h6) {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  html[data-mode="1999"] h1 {
    font-size: clamp(2.2rem, 4.2vw, 3.7rem) !important;
  }

  html[data-mode="1999"] h2 {
    font-size: clamp(1.4rem, 3vw, 2.4rem) !important;
  }
}

@media (max-width: 760px) {
  .settings-mode-panel {
    grid-template-columns: 1fr;
    gap: 0.85rem;
  }

  .mode-1999-toggle {
    width: 100%;
  }

  .settings-1999-palette-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-mode="1999"] .mode-1999-banner {
    height: 1.8rem;
  }

  html[data-mode="1999"] .mode-1999-banner-track {
    gap: 2.5rem;
    font-size: 0.7rem;
    animation-duration: 16s;
  }

  html[data-mode="1999"] .section-inner,
  html[data-mode="1999"] .header-inner {
    width: min(calc(100% - 0.75rem), 72rem) !important;
  }

  html[data-mode="1999"] :where(h1, h2, h3, h4, h5, h6) {
    overflow-wrap: anywhere;
  }

  html[data-mode="1999"] h1 {
    font-size: clamp(2rem, 12vw, 3.35rem) !important;
  }

  html[data-mode="1999"] :where(button:not(.rotary-hole), .button, input, select, textarea) {
    min-height: 2.75rem;
  }

  html[data-mode="1999"] :where(input, select, textarea) {
    font-size: 1rem !important;
  }

  html[data-mode="1999"] :where(.footer-layout, .footer-nav) {
    gap: 1rem !important;
  }

  html[data-mode="1999"] .gate {
    width: 100%;
    min-height: 0;
    gap: 2rem !important;
    padding: 1rem !important;
  }

  html[data-mode="1999"] .gate .row {
    gap: min(24vw, 6rem) !important;
  }

  html[data-mode="1999"] .gate .tight-row {
    gap: min(14vw, 3rem) !important;
  }

  html[data-mode="1999"] .bottom-console {
    width: min(calc(100% - 1rem), 32rem);
    margin-top: 1rem !important;
    padding: 1rem !important;
  }

  html[data-mode="1999"] .bottom-console .bar {
    width: min(58vw, 15rem) !important;
  }

  html[data-mode="1999"] .wrap {
    min-width: 0;
  }

  html[data-mode="1999"] .wrap > .card {
    padding: 1rem !important;
  }

  html[data-mode="1999"] :where(table, pre) {
    max-width: 100%;
    overflow-x: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mode-transition-curtain {
    transition: none;
  }

  html[data-mode="1999"] .mode-1999-banner-track {
    padding-left: 0.75rem;
    animation: none;
  }

  .mode-1999-switch span {
    transition: none;
  }
}