html:has(body[data-theme="whatdas"]),
body[data-theme="whatdas"] { overflow-x: clip; }
.whatdas-backdrop { position: fixed; z-index: 0; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.whatdas-cog-companion { position: absolute; z-index: 2; top: 10%; left: 50%; width: clamp(48px, 10vw, 76px); aspect-ratio: 320 / 250; transform: translateX(-50%); transition: top 550ms cubic-bezier(.22, 1, .36, 1), left 550ms cubic-bezier(.22, 1, .36, 1); pointer-events: none; }
.whatdas-cog-companion > :is(img, svg) { display: block; width: 100%; height: 100%; background: transparent; pointer-events: none; }
body[data-theme="whatdas"] > .page-shell,
body[data-theme="whatdas"] > .site-footer { position: relative; z-index: 1; }
body[data-game-session][data-theme="whatdas"] .game-workspace { padding: 0; }
body[data-game-session][data-theme="whatdas"] .game-primary {
  width: min(620px, max(520px, calc(100svh - 150px)), 100%);
}
body[data-game-session][data-theme="whatdas"] .game-play-panel {
  position: relative;
  aspect-ratio: 1;
  min-height: 0;
  padding: 36px;
  border: 1px solid #7bdced;
  border-radius: 50%;
  background: var(--paper);
  box-shadow: 0 0 50px rgb(123 220 237 / 10%), inset 0 0 55px rgb(123 220 237 / 8%);
}
html[data-color-mode="dark"] body[data-game-session][data-theme="whatdas"] .game-play-panel {
  background: radial-gradient(circle at 50% 40%, #183953, #08192e 70%);
}
body[data-game-session][data-theme="whatdas"] .game-play-panel::before {
  display: block;
  position: absolute;
  inset: -7px;
  border: 1px dashed rgb(123 220 237 / 32%);
  border-radius: inherit;
  content: "";
  pointer-events: none;
}
body[data-game-session][data-theme="whatdas"] #game-session-intro,
body[data-game-session][data-theme="whatdas"] #game-session-content {
  width: min(420px, 90%);
  max-height: 100%;
  margin-inline: auto;
  overflow-y: auto;
  scrollbar-width: thin;
}
body[data-game-session][data-theme="whatdas"] .game-play-panel > [data-session-status] {
  position: absolute;
  bottom: 26px;
  left: 15%;
  width: 70%;
  margin: 0;
}
body[data-game-session][data-theme="whatdas"] .game-play-panel > .account-actions[data-session-status] { bottom: 8px; }
body[data-game-session][data-theme="whatdas"] .app-heading { flex-flow: column nowrap; width: 100%; }
body[data-game-session][data-theme="whatdas"] .app-heading > :not(.game-engagement):not(.game-controls) { flex: none; max-width: 100%; }
body[data-game-session][data-theme="whatdas"] .app-heading .app-eyebrow { font-size: 10px; letter-spacing: .16em; }
body[data-game-session][data-theme="whatdas"] .app-heading img { width: 44px; height: 44px; }
body[data-game-session][data-theme="whatdas"] .game-controls { gap: 8px; }
body[data-game-session][data-theme="whatdas"] .difficulty-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(280px, 100%);
}
body[data-game-session][data-theme="whatdas"] .difficulty-tabs .mode-tab { min-width: 0; padding: 6px 4px; font-size: 11px; }
body[data-game-session][data-theme="whatdas"] #game-session-intro .game-session-start {
  border-color: #d7eeff;
  background: linear-gradient(135deg, #b2deff, #bfb0f4);
  color: #17243e;
  box-shadow: 0 0 24px rgb(123 220 237 / 25%);
}
body[data-game-session][data-theme="whatdas"] #game-session-intro .game-session-start:hover:not(:disabled) { filter: brightness(1.1); }
body[data-game-session][data-theme="whatdas"] .operator { min-height: 44px; }
body[data-game-session][data-theme="whatdas"] .operation-slot { min-height: 44px; }
body[data-game-session][data-theme="whatdas"] #puzzle-play .game-actions .button { min-height: 44px; }
@media (max-width: 600px) {
  body[data-game-session][data-theme="whatdas"] .game-primary { width: 100%; }
  body[data-game-session][data-theme="whatdas"] .game-play-panel {
    width: min(620px, max(520px, calc(100svh - 132px)));
    margin-left: 50%;
    translate: -50% 0;
    padding: 48px 24px;
  }
  body[data-game-session][data-theme="whatdas"] #game-session-intro,
  body[data-game-session][data-theme="whatdas"] #game-session-content {
    width: min(420px, calc(100vw - 48px));
    flex-shrink: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .whatdas-backdrop { display: none; }
  .whatdas-cog-companion { transition: none; }
}
html:not([data-color-mode="dark"]) .whatdas-backdrop { display: none; }