.account-page {
  min-height: 100vh;
  color: #080814;
  font-family: "Geist Pixel Square", "Pixelify Sans", monospace;
  font-size: 18px;
  letter-spacing: 0;
}

.account-page button {
  font-family: "Pixelify Sans", monospace;
  font-size: inherit;
  letter-spacing: 0;
}

.account-page input,
.account-page select,
.account-page textarea {
  font-family: "Geist Pixel Square", "Pixelify Sans", monospace;
  font-size: inherit;
  letter-spacing: 0;
}

[hidden] { display: none !important; }

.account-topbar,
.account-main {
  position: relative;
  z-index: 1;
  width: min(1180px, calc(100% - 32px));
  margin-inline: auto;
}

.account-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding-top: 24px;
}

.account-brand {
  display: flex;
  align-items: center;
  gap: 14px;
  color: #fff;
  text-decoration: none;
  text-shadow: 3px 3px 0 #080814;
}

.account-brand img {
  width: 76px;
  height: 76px;
  object-fit: contain;
  image-rendering: pixelated;
}

.account-brand span,
.account-brand strong,
.account-brand small { display: block; }

.account-brand strong {
  color: #fff5d8;
  font-family: "Press Start 2P", monospace;
  font-size: 1.65rem;
  text-shadow: 4px 4px 0 #ff4dd2;
}

.account-brand small {
  margin-top: 7px;
  font-family: "Press Start 2P", monospace;
  font-size: 0.55rem;
}

.account-home-link { text-decoration: none; }

.account-main { padding: 38px 0 78px; }

.account-loading {
  padding: 26px;
  font-family: "Press Start 2P", monospace;
  font-size: 0.72rem;
  line-height: 1.7;
}

.account-gateway {
  display: grid;
  grid-template-columns: minmax(0, 820px);
  justify-content: center;
}

.auth-console,
.player-header,
.profile-panel,
.preferences-panel,
.account-tools {
  border: 6px solid #080814;
  background: #fff5d8;
  box-shadow: 9px 9px 0 #080814;
  clip-path: none;
}

.auth-console { padding: clamp(22px, 5vw, 42px); }

.account-kicker {
  margin: 0 0 10px;
  color: #9b176d;
  font-family: "Press Start 2P", monospace;
  font-size: 0.62rem;
  line-height: 1.5;
  text-transform: uppercase;
}

.auth-console h1,
.player-header h1,
.quest-heading h2,
.account-form h2 {
  max-width: none;
  margin: 0;
  color: #080814;
  font-family: "Press Start 2P", monospace;
  text-shadow: 4px 4px 0 #ff55ca;
  letter-spacing: 0;
}

.auth-console h1 { font-size: clamp(1.45rem, 4vw, 2.5rem); line-height: 1.35; }
.auth-intro { margin: 16px 0 22px; font-size: 1.35rem; line-height: 1.25; }

.auth-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 22px;
  border: 4px solid #080814;
  box-shadow: 5px 5px 0 #080814;
}

.auth-tab {
  min-height: 48px;
  border: 0;
  border-right: 4px solid #080814;
  border-radius: 0;
  background: #fff;
  font-family: "Press Start 2P", monospace;
  font-size: 0.65rem;
  text-transform: uppercase;
}

.auth-tab:last-child { border-right: 0; }
.auth-tab.is-active { background: #49e8dc; }

.account-form { display: grid; gap: 15px; }
.account-form h2 { font-size: 1rem; }
.account-form p { margin: 0; line-height: 1.4; }
.account-form label { display: grid; gap: 7px; font-weight: 700; }

.account-form input,
.profile-form input,
.quest-card select,
.quest-card textarea {
  width: 100%;
  min-width: 0;
  border: 4px solid #080814;
  border-radius: 0;
  background: #fff;
  color: #080814;
  padding: 10px 12px;
  outline: 0;
  box-shadow: 4px 4px 0 #a832c5;
}

.account-form input:focus,
.profile-form input:focus,
.quest-card select:focus,
.quest-card textarea:focus {
  border-color: #126de5;
  box-shadow: 4px 4px 0 #17d5c0;
}

.field-hint { margin-top: -9px; color: #5d5265; font-size: 0.88rem; }
.account-honeypot { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

.auth-text-button {
  justify-self: start;
  border: 0;
  padding: 3px 0;
  background: transparent;
  color: #7f145a;
  font-weight: 700;
  text-decoration: underline;
}

.account-status {
  min-height: 25px;
  margin-top: 18px;
  font-family: "Press Start 2P", monospace;
  font-size: 0.62rem;
  line-height: 1.65;
}

.account-status[data-state="success"] { color: #096f62; }
.account-status[data-state="error"] { color: #b00045; }
.account-status a { color: inherit; }

.player-dashboard { display: grid; gap: 24px; }
.player-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 22px; }
.player-identity { display: flex; align-items: center; gap: 18px; min-width: 0; }
.player-identity img { width: 92px; height: 92px; object-fit: contain; image-rendering: pixelated; }
.player-header h1 { font-size: clamp(1.2rem, 3vw, 2rem); line-height: 1.4; overflow-wrap: anywhere; }
.player-header [data-player-email] { display: block; margin-top: 9px; color: #67596b; overflow-wrap: anywhere; }
.player-actions { display: flex; flex-wrap: wrap; gap: 10px; }

.verification-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border: 6px solid #080814;
  background: #ff9aaa;
  box-shadow: 8px 8px 0 #080814;
  padding: 17px 20px;
}

.verification-panel div { display: grid; gap: 5px; }
.verification-panel strong { font-family: "Press Start 2P", monospace; font-size: 0.72rem; }

.profile-panel { padding: 18px; }
.profile-form { display: grid; grid-template-columns: minmax(220px, 1fr) auto auto; align-items: end; gap: 12px; }
.profile-form label { display: grid; gap: 6px; font-weight: 700; }

.preferences-panel,
.account-tools { padding: 20px; }
.preferences-heading,
.account-tools { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.preferences-heading h2,
.account-tools h2 { margin: 0; font-family: "Press Start 2P", monospace; font-size: 1rem; }
.preferences-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }
.preferences-form fieldset { min-width: 0; margin: 0; border: 4px solid #080814; padding: 12px; }
.preferences-form legend { padding: 0 7px; font-family: "Press Start 2P", monospace; font-size: 0.58rem; }
.preferences-form label { display: grid; gap: 6px; font-weight: 700; }
.preferences-form select { border: 4px solid #080814; border-radius: 0; background: #fff; padding: 9px; box-shadow: 4px 4px 0 #a832c5; }
.preference-checks { display: flex; flex-wrap: wrap; gap: 7px; }
.preference-check { position: relative; }
.preference-check input { position: absolute; opacity: 0; }
.preference-check span { display: block; border: 3px solid #080814; background: #fff; box-shadow: 3px 3px 0 #080814; padding: 7px; font-size: 0.82rem; }
.preference-check input:checked + span { background: #49e8dc; transform: translate(2px, 2px); box-shadow: 1px 1px 0 #080814; }
.account-tool-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.account-delete-toggle { background: #ff9aaa; }
.delete-account-form { flex-basis: 100%; display: grid; grid-template-columns: minmax(180px, 1fr) minmax(150px, 0.7fr) auto auto; align-items: end; gap: 10px; padding-top: 17px; border-top: 4px solid #080814; }
.delete-account-form p { grid-column: 1 / -1; margin: 0; }
.delete-account-form label { display: grid; gap: 5px; font-weight: 700; }

.dashboard-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 220px));
  justify-content: center;
  gap: 10px;
}

.dashboard-tab {
  min-height: 56px;
  border: 4px solid #080814;
  border-radius: 0;
  background: #fff5d8;
  box-shadow: 5px 5px 0 #080814;
  font-family: "Press Start 2P", monospace;
  font-size: 0.62rem;
  line-height: 1.45;
  text-transform: uppercase;
}

.dashboard-tab.is-active {
  background: #49e8dc;
  transform: translate(2px, 2px);
  box-shadow: 3px 3px 0 #080814;
}

.dashboard-view { display: grid; gap: 24px; }

.quest-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; color: #fff; text-shadow: 3px 3px 0 #080814; }
.quest-heading .account-kicker { color: #ff55ca; }
.quest-heading h2 { color: #fff5d8; font-size: clamp(1.45rem, 4vw, 2.5rem); text-shadow: 5px 5px 0 #080814; }
.quest-total { border: 4px solid #080814; background: #a7ff73; box-shadow: 5px 5px 0 #080814; color: #080814; padding: 10px; font-family: "Press Start 2P", monospace; font-size: 0.62rem; text-shadow: none; }

.quest-filters { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 9px; }
.quest-filter { min-height: 58px; border: 4px solid #080814; border-radius: 0; background: #fff5d8; box-shadow: 5px 5px 0 #080814; font-family: "Press Start 2P", monospace; font-size: 0.56rem; line-height: 1.45; text-transform: uppercase; }
.quest-filter span { display: inline-grid; place-items: center; min-width: 22px; min-height: 22px; margin-left: 3px; background: #ff55ca; }
.quest-filter.is-active { background: #49e8dc; transform: translate(2px, 2px); box-shadow: 3px 3px 0 #080814; }
.account-status-dashboard { margin: 0; color: #fff; text-shadow: 2px 2px 0 #080814; }

.quest-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.quest-card { display: grid; grid-template-columns: 150px minmax(0, 1fr); border: 6px solid #080814; background: #fff5d8; box-shadow: 8px 8px 0 #080814; }
.quest-cover { min-height: 220px; border-right: 6px solid #080814; background: #080814; overflow: hidden; }
.quest-cover img { width: 100%; height: 100%; display: block; object-fit: cover; image-rendering: auto; }
.quest-card-body { display: grid; align-content: start; gap: 11px; min-width: 0; padding: 15px; }
.quest-card h3 { margin: 0; font-family: "Press Start 2P", monospace; font-size: 0.82rem; line-height: 1.5; overflow-wrap: anywhere; }
.quest-card-fields { display: grid; grid-template-columns: minmax(0, 1fr); gap: 9px; }
.quest-card label { display: grid; gap: 5px; font-size: 0.88rem; font-weight: 700; }
.quest-card select { padding: 7px; box-shadow: 3px 3px 0 #a832c5; }
.quest-card textarea { min-height: 68px; padding: 8px; resize: vertical; box-shadow: 3px 3px 0 #a832c5; }
.quest-card-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.quest-card-actions .tiny-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 10px 12px;
  font-size: 0.7rem;
  line-height: 1.45;
  text-align: center;
}
.quest-source { color: #721455; font-weight: 700; }
.quest-empty { grid-column: 1 / -1; padding: 30px; border: 6px solid #080814; background: #fff5d8; box-shadow: 8px 8px 0 #080814; text-align: center; }
.quest-empty strong { display: block; font-family: "Press Start 2P", monospace; font-size: 0.85rem; }
.quest-empty p { margin: 13px 0 0; }

.score-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  color: #fff;
  text-shadow: 3px 3px 0 #080814;
}

.score-heading .account-kicker { color: #ff55ca; }
.score-heading h2 {
  margin: 0;
  color: #fff5d8;
  font-family: "Press Start 2P", monospace;
  font-size: clamp(1.45rem, 4vw, 2.5rem);
  line-height: 1.25;
  text-shadow: 5px 5px 0 #080814;
}

.score-cloud-label {
  border: 4px solid #080814;
  background: #a7ff73;
  box-shadow: 5px 5px 0 #080814;
  color: #080814;
  padding: 10px;
  font-family: "Press Start 2P", monospace;
  font-size: 0.62rem;
  text-shadow: none;
}

.score-games { display: grid; gap: 22px; }
.score-game-card,
.score-empty {
  border: 6px solid #080814;
  background: #fff5d8;
  box-shadow: 8px 8px 0 #080814;
}

.score-game-card { padding: clamp(18px, 3vw, 28px); }
.score-game-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.score-game-header p { margin: 0 0 8px; color: #9b176d; font-weight: 700; text-transform: uppercase; }
.score-game-header h3,
.score-history h4 {
  margin: 0;
  font-family: "Press Start 2P", monospace;
  line-height: 1.45;
}
.score-game-header h3 { font-size: clamp(1rem, 3vw, 1.55rem); text-shadow: 3px 3px 0 #ff55ca; }
.score-play-button { color: #080814; text-decoration: none; white-space: nowrap; }

.score-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 22px;
}

.score-stat {
  min-width: 0;
  border: 4px solid #080814;
  background: #fff;
  box-shadow: 4px 4px 0 #a832c5;
  padding: 13px 10px;
  text-align: center;
}
.score-stat:nth-child(4n + 1),
.score-stat:nth-child(4n + 4) { background: #b8fff8; }
.score-stat strong { display: block; font-family: "Press Start 2P", monospace; font-size: 1rem; line-height: 1.35; }
.score-stat span { display: block; margin-top: 7px; font-size: 0.78rem; font-weight: 700; text-transform: uppercase; }

.score-history { margin-top: 26px; }
.score-history h4 { font-size: 0.72rem; }
.score-history ol { display: grid; gap: 7px; margin: 13px 0 0; padding: 0; list-style: none; }
.score-run {
  display: grid;
  grid-template-columns: minmax(145px, 1.3fr) minmax(80px, 0.8fr) minmax(120px, 1fr) minmax(70px, 0.6fr);
  align-items: center;
  gap: 10px;
  border: 3px solid #080814;
  background: #fff;
  padding: 9px 11px;
  font-size: 0.82rem;
}
.score-run strong { font-family: "Press Start 2P", monospace; font-size: 0.55rem; }
.score-run.is-solved strong { color: #08786b; }
.score-run.is-missed strong { color: #b00045; }
.score-history-empty { border: 3px solid #080814; background: #fff; padding: 16px; }
.score-empty { padding: 30px; text-align: center; }
.score-empty strong { font-family: "Press Start 2P", monospace; font-size: 0.85rem; }
.score-empty p { margin: 13px 0 0; }

@media (max-width: 900px) {
  .quest-grid { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  .account-topbar,
  .account-main { width: min(100% - 20px, 1180px); }
  .account-topbar { align-items: flex-start; }
  .account-brand img { width: 58px; height: 58px; }
  .account-brand strong { font-size: 1.1rem; }
  .account-brand small { font-size: 0.45rem; }
  .account-home-link { padding: 8px; font-size: 0.52rem; }
  .account-main { padding-top: 24px; }
  .account-gateway { grid-template-columns: minmax(0, 1fr); }
  .auth-console { padding: 22px 16px; }
  .player-header,
  .verification-panel,
  .quest-heading,
  .score-heading { align-items: stretch; flex-direction: column; }
  .player-identity { align-items: flex-start; }
  .player-identity img { width: 68px; height: 68px; }
  .player-actions > *,
  .verification-panel button { flex: 1; }
  .profile-form { grid-template-columns: 1fr; }
  .preferences-heading,
  .account-tools { align-items: stretch; flex-direction: column; }
  .preferences-form,
  .delete-account-form { grid-template-columns: 1fr; }
  .delete-account-form > * { grid-column: 1; }
  .quest-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quest-filter:first-child { grid-column: 1 / -1; }
  .quest-card { grid-template-columns: 104px minmax(0, 1fr); }
  .quest-cover { min-height: 190px; }
  .quest-card-fields { grid-template-columns: 1fr; }
  .dashboard-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .score-game-header { align-items: stretch; flex-direction: column; }
  .score-play-button { text-align: center; }
  .score-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .score-run { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 430px) {
  .quest-card { grid-template-columns: 1fr; }
  .quest-cover { min-height: 0; aspect-ratio: 16 / 8; border-right: 0; border-bottom: 6px solid #080814; }
  .quest-cover img { object-position: center 20%; }
}
