/* My Hero Academia Quiz Room - UA training course theme */

:root,
body[data-room="my-hero-academia"],
.qr-room-my-hero-academia {
  --qr-bg: #08111f;
  --qr-bg-elev: #111f35;
  --qr-fg: #f5f1df;
  --qr-fg-dim: #aeb7c4;
  --qr-accent: #2fa866;
  --qr-accent-dim: #1c5f48;
  --qr-warn: #edc94d;
  --qr-danger: #d94b43;
  --qr-ice: #6ac9e6;
  --qr-flame: #e88e25;
  --qr-hero-red: #b72f2d;
  --qr-pink: #da6893;
  --qr-panel: #162944;
  --qr-panel-2: #203b5c;
  --qr-line: rgba(245, 241, 223, 0.14);
  --qr-radius: 6px;
  --qr-shadow-hard: 0 8px 0 rgba(0, 0, 0, 0.28);
  --qr-shadow-soft: 0 14px 28px rgba(0, 0, 0, 0.28);
}

* { box-sizing: border-box; }

body[data-room="my-hero-academia"] {
  margin: 0;
  padding: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: var(--qr-fg);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  background:
    linear-gradient(180deg, rgba(47, 168, 102, 0.08), transparent 240px),
    linear-gradient(135deg, #08111f 0%, #111f35 52%, #1a2230 100%);
}

body[data-room="my-hero-academia"] #qr-root { width: 100%; max-width: 500px; padding: 24px 16px; }
body[data-room="my-hero-academia"] .qr-stage { display: flex; flex-direction: column; gap: 16px; animation: qr-mha-board-in 260ms ease-out both; }
body[data-room="my-hero-academia"] .qr-progress {
  color: var(--qr-warn);
  font-family: 'Press Start 2P', monospace;
  font-size: 11px;
  letter-spacing: 1px;
  text-align: right;
  text-shadow: 0 2px 0 rgba(0, 0, 0, 0.45);
}

body[data-room="my-hero-academia"] .qr-board {
  position: relative;
  min-height: 340px;
  padding: 18px 16px 20px;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(255,255,255,0.035), transparent 70px), var(--qr-bg-elev);
  border: 2px solid var(--qr-accent-dim);
  border-radius: var(--qr-radius);
  box-shadow: var(--qr-shadow-hard);
}

body[data-room="my-hero-academia"] .qr-board::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(rgba(245,241,223,0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(245,241,223,0.025) 1px, transparent 1px);
  background-size: 24px 24px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.55), transparent 70%);
}

body[data-room="my-hero-academia"] .qr-board h1,
body[data-room="my-hero-academia"] .qr-board h2,
body[data-room="my-hero-academia"] .qr-board h3 {
  color: var(--qr-warn);
  font-family: 'Press Start 2P', monospace;
  line-height: 1.45;
  letter-spacing: 1px;
}

body[data-room="my-hero-academia"] .qr-board p { color: var(--qr-fg-dim); line-height: 1.5; }

body[data-room="my-hero-academia"] .qr-scene {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 0 16px;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  background: var(--qr-bg);
  border: 2px solid var(--qr-panel-2);
  border-radius: var(--qr-radius);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06), 0 5px 0 rgba(0,0,0,0.22);
  animation: qr-mha-scene-in 360ms ease-out both;
}

body[data-room="my-hero-academia"] .qr-btn {
  appearance: none;
  min-height: 44px;
  width: 100%;
  margin-top: 16px;
  padding: 12px 18px;
  color: #06121c;
  background: var(--qr-warn);
  border: 0;
  border-radius: var(--qr-radius);
  box-shadow: 0 4px 0 #8a5a14;
  cursor: pointer;
  font-family: 'Press Start 2P', monospace;
  font-size: 11px;
  letter-spacing: 1px;
  transition: transform 90ms ease, filter 120ms ease, box-shadow 120ms ease;
}

body[data-room="my-hero-academia"] .qr-btn:hover:not(:disabled) { filter: brightness(1.08); transform: translateY(-1px); }
body[data-room="my-hero-academia"] .qr-btn:active:not(:disabled) { transform: translateY(2px); box-shadow: 0 2px 0 #8a5a14; }
body[data-room="my-hero-academia"] .qr-btn:disabled { opacity: 0.52; cursor: not-allowed; filter: grayscale(0.35); }
body[data-room="my-hero-academia"] .qr-btn-sm { width: auto; min-height: 44px; margin-top: 0; padding: 9px 12px; font-size: 10px; }
body[data-room="my-hero-academia"] .qr-btn-secondary { color: var(--qr-fg); background: transparent; border: 2px solid var(--qr-panel-2); box-shadow: none; }

body[data-room="my-hero-academia"] .qr-hint,
body[data-room="my-hero-academia"] .qr-resume-banner {
  border-radius: var(--qr-radius);
  background: rgba(237, 201, 77, 0.08);
}

body[data-room="my-hero-academia"] .qr-hint { padding: 10px 12px; color: var(--qr-warn); border-left: 3px solid var(--qr-warn); font-size: 12px; font-style: normal; }
body[data-room="my-hero-academia"] .qr-resume-banner { background: var(--qr-bg-elev); border: 2px solid var(--qr-warn); box-shadow: var(--qr-shadow-soft); }

/* Shared choice and status primitives */
body[data-room="my-hero-academia"] .qr-choice-list,
body[data-room="my-hero-academia"] .qr-choice-grid { gap: 10px; }

body[data-room="my-hero-academia"] .qr-choice {
  min-height: 56px;
  padding: 12px;
  color: var(--qr-fg);
  background: linear-gradient(180deg, rgba(255,255,255,0.04), rgba(0,0,0,0.08)), var(--qr-bg);
  border: 2px solid var(--qr-panel-2);
  border-radius: var(--qr-radius);
  box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  line-height: 1.4;
  transition: transform 100ms ease, border-color 120ms ease, background 120ms ease;
}

body[data-room="my-hero-academia"] .qr-choice:hover,
body[data-room="my-hero-academia"] .qr-choice:focus-visible { border-color: var(--qr-warn); outline: none; animation: qr-mha-choice-lift 180ms ease-out both; }
body[data-room="my-hero-academia"] .qr-choice.picked { color: var(--qr-fg); background: rgba(47, 168, 102, 0.18); border-color: var(--qr-accent); }
body[data-room="my-hero-academia"] .qr-choice-name,
body[data-room="my-hero-academia"] .qr-counter { color: var(--qr-warn); font-family: 'Press Start 2P', monospace; letter-spacing: 1px; }
body[data-room="my-hero-academia"] .qr-counter span { color: var(--qr-ice); }
body[data-room="my-hero-academia"] .qr-counter.complete span { color: var(--qr-accent); }
body[data-room="my-hero-academia"] .qr-status { min-height: 18px; color: var(--qr-fg-dim); font-size: 12px; }
body[data-room="my-hero-academia"] .qr-status.warn { color: var(--qr-warn); }
body[data-room="my-hero-academia"] .qr-status.win { color: var(--qr-accent); }
body[data-room="my-hero-academia"] .qr-status.bad { color: var(--qr-danger); }
body[data-room="my-hero-academia"] .qr-outcome { color: var(--qr-fg); background: rgba(47,168,102,0.10); border: 2px solid var(--qr-accent-dim); border-radius: var(--qr-radius); }

/* Puzzle 1: Entrance exam */
body[data-room="my-hero-academia"] .qr-mha-entrance { display: flex; flex-direction: column; gap: 14px; }
body[data-room="my-hero-academia"] .qr-mha-entrance-prompt h2 { margin: 0 0 6px; color: var(--qr-warn); font-size: 15px; }
body[data-room="my-hero-academia"] .qr-mha-entrance-prompt p { margin: 0; font-size: 14px; }

body[data-room="my-hero-academia"] .qr-mha-entrance-gate {
  position: relative;
  min-height: 96px;
  overflow: hidden;
  background: linear-gradient(180deg, var(--qr-panel-2), var(--qr-bg));
  border: 2px solid var(--qr-panel-2);
  border-radius: var(--qr-radius);
}

body[data-room="my-hero-academia"] .qr-mha-entrance-gate::after {
  content: '';
  position: absolute;
  left: 12%;
  right: 12%;
  bottom: 14px;
  height: 26px;
  background: repeating-linear-gradient(90deg, var(--qr-warn) 0 10px, var(--qr-ink) 10px 18px);
  border: 2px solid var(--qr-ink);
}

body[data-room="my-hero-academia"] .qr-mha-entrance-scoreboard { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; color: var(--qr-fg-dim); font-family: 'Press Start 2P', monospace; font-size: 9px; text-align: center; }
body[data-room="my-hero-academia"] .qr-mha-entrance-target { min-height: 52px; color: var(--qr-fg); background: rgba(232,142,37,0.12); border: 2px solid var(--qr-flame); border-radius: var(--qr-radius); }
body[data-room="my-hero-academia"] .qr-mha-entrance-target.hit { border-color: var(--qr-accent); background: rgba(47,168,102,0.18); animation: qr-mha-impact 260ms ease-out; }
body[data-room="my-hero-academia"] .qr-mha-entrance-actions { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }

/* Puzzle 2: Quirk pairing drill */
body[data-room="my-hero-academia"] .qr-mha-quirk { position: relative; display: flex; flex-direction: column; gap: 14px; }
body[data-room="my-hero-academia"] .qr-mha-quirk-prompt h2 { margin: 0 0 6px; color: var(--qr-warn); font-size: 15px; }
body[data-room="my-hero-academia"] .qr-mha-quirk-prompt p { margin: 0; color: var(--qr-fg-dim); font-size: 14px; line-height: 1.5; }

body[data-room="my-hero-academia"] .qr-mha-quirk-status {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  color: var(--qr-fg-dim);
  font-family: 'Press Start 2P', monospace;
  font-size: 9px;
  letter-spacing: 1px;
  text-align: center;
}

body[data-room="my-hero-academia"] .qr-mha-quirk-status span { padding: 8px 6px; background: rgba(8,17,31,0.72); border: 1px solid var(--qr-panel-2); border-radius: var(--qr-radius); }
body[data-room="my-hero-academia"] .qr-mha-quirk-status strong { display: block; margin-top: 4px; color: var(--qr-warn); font-size: 12px; }

body[data-room="my-hero-academia"] .qr-mha-quirk-villain {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px;
  background: linear-gradient(90deg, rgba(217,75,67,0.18), rgba(17,31,53,0.9));
  border: 2px solid var(--qr-danger);
  border-radius: var(--qr-radius);
  animation: qr-mha-board-in 240ms ease-out both;
}

body[data-room="my-hero-academia"] .qr-mha-quirk-villain[hidden] { display: none; }
body[data-room="my-hero-academia"] .qr-mha-quirk-villain-label { color: var(--qr-flame); font-family: 'Press Start 2P', monospace; font-size: 12px; letter-spacing: 2px; }
body[data-room="my-hero-academia"] .qr-mha-quirk-villain-detail { color: var(--qr-fg); font-size: 13px; line-height: 1.45; }
body[data-room="my-hero-academia"] .qr-mha-quirk-build { display: flex; align-items: stretch; justify-content: center; gap: 10px; }

body[data-room="my-hero-academia"] .qr-mha-quirk-slot {
  flex: 1;
  min-height: 58px;
  padding: 8px;
  color: var(--qr-fg-dim);
  background: rgba(8,17,31,0.76);
  border: 2px dashed var(--qr-panel-2);
  border-radius: var(--qr-radius);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Press Start 2P', monospace;
  font-size: 10px;
  letter-spacing: 1px;
  text-align: center;
}

body[data-room="my-hero-academia"] .qr-mha-quirk-slot:hover:not(.filled),
body[data-room="my-hero-academia"] .qr-mha-quirk-slot:focus-visible { color: var(--qr-fg); border-color: var(--qr-warn); outline: none; }
body[data-room="my-hero-academia"] .qr-mha-quirk-slot.filled { color: var(--qr-fg); background: rgba(47,168,102,0.18); border-color: var(--qr-accent); border-style: solid; font-family: inherit; font-size: 13px; letter-spacing: 0; }
body[data-room="my-hero-academia"] .qr-mha-quirk-plus { align-self: center; color: var(--qr-warn); font-family: 'Press Start 2P', monospace; font-size: 13px; }
body[data-room="my-hero-academia"] .qr-mha-quirk-palette { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }

body[data-room="my-hero-academia"] .qr-mha-quirk-card {
  appearance: none;
  min-height: 60px;
  padding: 10px 8px;
  color: var(--qr-fg);
  background: linear-gradient(180deg, rgba(255,255,255,0.045), rgba(0,0,0,0.08)), var(--qr-bg);
  border: 2px solid var(--qr-panel-2);
  border-radius: var(--qr-radius);
  box-shadow: 0 3px 0 rgba(0,0,0,0.25);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  font-size: 12px;
  line-height: 1.18;
  text-align: center;
  transition: transform 90ms ease, border-color 120ms ease, background 120ms ease;
}

body[data-room="my-hero-academia"] .qr-mha-quirk-card:hover:not(:disabled),
body[data-room="my-hero-academia"] .qr-mha-quirk-card:focus-visible { border-color: var(--qr-warn); outline: none; transform: translateY(-2px); }
body[data-room="my-hero-academia"] .qr-mha-quirk-card.selected { background: rgba(47,168,102,0.18); border-color: var(--qr-accent); }
body[data-room="my-hero-academia"] .qr-mha-quirk-card:disabled { opacity: 0.42; cursor: not-allowed; transform: none; }
body[data-room="my-hero-academia"] .qr-mha-quirk-icon { color: var(--qr-warn); font-size: 19px; line-height: 1; }
body[data-room="my-hero-academia"] .qr-mha-quirk-actions { display: flex; gap: 8px; }
body[data-room="my-hero-academia"] .qr-mha-quirk-actions[hidden] { display: none; }
body[data-room="my-hero-academia"] .qr-mha-quirk-actions .qr-btn { flex: 1; width: auto; margin-top: 0; }
body[data-room="my-hero-academia"] .qr-mha-quirk-clear { color: var(--qr-fg); background: transparent; border: 2px solid var(--qr-panel-2); box-shadow: none; }
body[data-room="my-hero-academia"] .qr-mha-quirk-confirm { background: var(--qr-accent); box-shadow: 0 4px 0 #164532; }

body[data-room="my-hero-academia"] .qr-mha-quirk-reveal {
  padding: 14px;
  color: var(--qr-fg);
  background: rgba(8,17,31,0.82);
  border: 2px solid var(--qr-warn);
  border-radius: var(--qr-radius);
  font-family: 'Press Start 2P', monospace;
  letter-spacing: 1px;
  line-height: 1.6;
  text-align: center;
  animation: qr-mha-impact 320ms ease-out both;
}

body[data-room="my-hero-academia"] .qr-mha-quirk-reveal[hidden] { display: none; }
body[data-room="my-hero-academia"] .qr-mha-quirk-reveal .move-name { display: block; margin-bottom: 6px; color: var(--qr-warn); font-size: 14px; }
body[data-room="my-hero-academia"] .qr-mha-quirk-reveal .effect { display: block; margin-top: 6px; padding: 6px 8px; border-radius: var(--qr-radius); font-size: 11px; }
body[data-room="my-hero-academia"] .qr-mha-quirk-reveal .effect.high { color: var(--qr-accent); background: rgba(47,168,102,0.16); }
body[data-room="my-hero-academia"] .qr-mha-quirk-reveal .effect.mid { color: var(--qr-warn); background: rgba(237,201,77,0.16); }
body[data-room="my-hero-academia"] .qr-mha-quirk-reveal .effect.low { color: var(--qr-danger); background: rgba(217,75,67,0.16); }

body[data-room="my-hero-academia"] .qr-mha-quirk-dict { padding: 10px; background: rgba(8,17,31,0.72); border: 2px solid var(--qr-panel-2); border-radius: var(--qr-radius); }
body[data-room="my-hero-academia"] .qr-mha-quirk-dict-title { margin-bottom: 8px; color: var(--qr-warn); font-family: 'Press Start 2P', monospace; font-size: 10px; letter-spacing: 1px; }
body[data-room="my-hero-academia"] .qr-mha-quirk-dict-list { display: flex; flex-wrap: wrap; gap: 6px; }
body[data-room="my-hero-academia"] .qr-mha-quirk-dict-tag { padding: 5px 8px; color: var(--qr-fg); background: rgba(106,201,230,0.10); border: 1px solid var(--qr-ice); border-radius: 14px; font-size: 11px; }
body[data-room="my-hero-academia"] .qr-mha-quirk-dict-empty { color: var(--qr-fg-dim); font-size: 11px; font-style: italic; }

body[data-room="my-hero-academia"] .qr-mha-quirk-result {
  margin-top: 8px;
  padding: 13px;
  color: var(--qr-warn);
  background: rgba(237,201,77,0.08);
  border: 2px solid var(--qr-warn);
  border-radius: var(--qr-radius);
  font-family: 'Press Start 2P', monospace;
  font-size: 11px;
  letter-spacing: 1px;
  line-height: 1.6;
  text-align: center;
}

body[data-room="my-hero-academia"] .qr-mha-quirk-result[hidden],
body[data-room="my-hero-academia"] .qr-mha-quirk-done[hidden] { display: none; }

/* Puzzle 3: Rescue exercise */
body[data-room="my-hero-academia"] .qr-mha-rescue { display: grid; gap: 14px; }
body[data-room="my-hero-academia"] .qr-mha-rescue-map { position: relative; min-height: 116px; overflow: hidden; background: linear-gradient(180deg, var(--qr-ice), var(--qr-panel) 44%, var(--qr-ink)); border: 2px solid var(--qr-panel-2); border-radius: var(--qr-radius); }
body[data-room="my-hero-academia"] .qr-mha-rescue-map::before { content: ''; position: absolute; inset: 52px 0 auto; height: 28px; background: repeating-linear-gradient(135deg, var(--qr-danger) 0 8px, var(--qr-flame) 8px 16px); opacity: 0.82; }
body[data-room="my-hero-academia"] .qr-mha-rescue-civilians { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
body[data-room="my-hero-academia"] .qr-mha-rescue-civilian { min-height: 58px; padding: 8px; color: var(--qr-fg); background: rgba(106,201,230,0.10); border: 2px solid var(--qr-ice); border-radius: var(--qr-radius); }
body[data-room="my-hero-academia"] .qr-mha-rescue-civilian.safe { border-color: var(--qr-accent); background: rgba(47,168,102,0.16); }
body[data-room="my-hero-academia"] .qr-mha-rescue-beacon { animation: qr-mha-prop-bob 1450ms ease-in-out infinite; }

/* Puzzle 4: Class bond */
body[data-room="my-hero-academia"] .qr-mha-bond { display: flex; flex-direction: column; gap: 14px; }
body[data-room="my-hero-academia"] .qr-mha-bond-table { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; padding: 10px; background: rgba(8,17,31,0.62); border: 2px solid var(--qr-panel-2); border-radius: var(--qr-radius); }
body[data-room="my-hero-academia"] .qr-mha-bond-card { min-height: 64px; padding: 10px; color: var(--qr-fg); background: var(--qr-panel); border: 2px solid var(--qr-panel-2); border-radius: var(--qr-radius); }
body[data-room="my-hero-academia"] .qr-mha-bond-card.trusted { border-color: var(--qr-pink); background: rgba(218,104,147,0.14); }
body[data-room="my-hero-academia"] .qr-mha-bond-link { color: var(--qr-warn); font-family: 'Press Start 2P', monospace; font-size: 10px; }
body[data-room="my-hero-academia"] .qr-mha-bond-meter { height: 12px; overflow: hidden; background: var(--qr-bg); border: 1px solid var(--qr-panel-2); border-radius: 999px; }
body[data-room="my-hero-academia"] .qr-mha-bond-meter span { display: block; height: 100%; background: linear-gradient(90deg, var(--qr-pink), var(--qr-warn)); }

/* Puzzle 5: Final practical */
body[data-room="my-hero-academia"] .qr-mha-final { display: grid; gap: 14px; }
body[data-room="my-hero-academia"] .qr-mha-final-arena { position: relative; min-height: 126px; overflow: hidden; background: radial-gradient(circle at 50% 35%, rgba(237,201,77,0.20), transparent 36%), var(--qr-bg); border: 2px solid var(--qr-warn); border-radius: var(--qr-radius); }
body[data-room="my-hero-academia"] .qr-mha-final-arena::after { content: ''; position: absolute; left: 10%; right: 10%; bottom: 18px; height: 24px; background: linear-gradient(90deg, var(--qr-accent), var(--qr-warn), var(--qr-danger)); border: 2px solid var(--qr-ink); }
body[data-room="my-hero-academia"] .qr-mha-final-choice { min-height: 60px; padding: 10px 12px; color: var(--qr-fg); background: rgba(183,47,45,0.12); border: 2px solid var(--qr-hero-red); border-radius: var(--qr-radius); }
body[data-room="my-hero-academia"] .qr-mha-final-choice.locked { border-color: var(--qr-warn); background: rgba(237,201,77,0.14); }
body[data-room="my-hero-academia"] .qr-mha-final-score { color: var(--qr-warn); font-family: 'Press Start 2P', monospace; font-size: 11px; text-align: center; }

/* Shared room object hooks and placeholders */
body[data-room="my-hero-academia"] .qr-mha-prop,
body[data-room="my-hero-academia"] .qr-mha-object { image-rendering: pixelated; image-rendering: crisp-edges; filter: drop-shadow(0 5px 0 rgba(0,0,0,0.28)); animation: qr-mha-prop-bob 1800ms ease-in-out infinite; }
body[data-room="my-hero-academia"] .qr-stub { padding: 16px; color: var(--qr-fg); background: rgba(8,17,31,0.74); border: 2px dashed var(--qr-panel-2); border-radius: var(--qr-radius); }
body[data-room="my-hero-academia"] .qr-stub em { color: var(--qr-warn); font-style: normal; }

/* Result screen */
body[data-room="my-hero-academia"] .qr-result { width: 100%; max-width: 500px; padding: 24px 16px 32px; text-align: center; }
body[data-room="my-hero-academia"] .qr-result-sprite { width: 224px; height: 224px; object-fit: contain; image-rendering: pixelated; background: var(--qr-bg-elev); border: 4px solid var(--qr-warn); border-radius: var(--qr-radius); box-shadow: var(--qr-shadow-hard); animation: qr-mha-sprite-enter 420ms cubic-bezier(.2,.8,.2,1) both; }
body[data-room="my-hero-academia"] .qr-result-eyebrow,
body[data-room="my-hero-academia"] .qr-result-dossier-eyebrow,
body[data-room="my-hero-academia"] .qr-result-cta-eyebrow { color: var(--qr-warn); }
body[data-room="my-hero-academia"] .qr-result-name { color: var(--qr-fg); text-shadow: 0 3px 0 rgba(0,0,0,0.38); }
body[data-room="my-hero-academia"] .qr-result-tagline { color: var(--qr-ice); }
body[data-room="my-hero-academia"] .qr-result-receipts.qr-result-dossier,
body[data-room="my-hero-academia"] .qr-result-cta { background: var(--qr-bg-elev); border: 2px solid var(--qr-panel-2); border-radius: var(--qr-radius); }
body[data-room="my-hero-academia"] .qr-result-dossier-lines li { color: var(--qr-fg); border-bottom-color: rgba(237,201,77,0.22); }

@keyframes qr-mha-board-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes qr-mha-scene-in {
  from { opacity: 0; filter: saturate(0.5) brightness(0.7); }
  to { opacity: 1; filter: saturate(1) brightness(1); }
}

@keyframes qr-mha-prop-bob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}

@keyframes qr-mha-choice-lift {
  from { transform: translateY(0); }
  to { transform: translateY(-2px); }
}

@keyframes qr-mha-impact {
  0% { transform: scale(0.96); box-shadow: 0 0 0 rgba(237,201,77,0); }
  55% { transform: scale(1.02); box-shadow: 0 0 0 5px rgba(237,201,77,0.18); }
  100% { transform: scale(1); box-shadow: 0 0 0 rgba(237,201,77,0); }
}

@keyframes qr-mha-sprite-enter {
  from { opacity: 0; transform: translateY(12px) scale(0.92); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 540px) {
  body[data-room="my-hero-academia"] #qr-root { max-width: 100%; padding: 16px 12px; }
  body[data-room="my-hero-academia"] .qr-board { min-height: 320px; padding: 14px 12px 16px; }
  body[data-room="my-hero-academia"] .qr-scene { margin-bottom: 12px; }
  body[data-room="my-hero-academia"] .qr-board h2,
  body[data-room="my-hero-academia"] .qr-mha-quirk-prompt h2 { font-size: 13px; }
  body[data-room="my-hero-academia"] .qr-btn,
  body[data-room="my-hero-academia"] .qr-choice,
  body[data-room="my-hero-academia"] .qr-mha-quirk-card,
  body[data-room="my-hero-academia"] .qr-mha-quirk-slot { min-height: 44px; }
  body[data-room="my-hero-academia"] .qr-choice-grid,
  body[data-room="my-hero-academia"] .qr-mha-quirk-palette,
  body[data-room="my-hero-academia"] .qr-mha-entrance-actions,
  body[data-room="my-hero-academia"] .qr-mha-bond-table { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-room="my-hero-academia"] .qr-mha-quirk-status { grid-template-columns: 1fr; font-size: 8px; }
  body[data-room="my-hero-academia"] .qr-mha-rescue-civilians { grid-template-columns: 1fr; }
  body[data-room="my-hero-academia"] .qr-result-sprite { width: 192px; height: 192px; }
}

@media (max-width: 380px) {
  body[data-room="my-hero-academia"] .qr-mha-quirk-palette,
  body[data-room="my-hero-academia"] .qr-choice-grid { grid-template-columns: 1fr; }
  body[data-room="my-hero-academia"] .qr-mha-quirk-card { flex-direction: row; justify-content: flex-start; text-align: left; }
  body[data-room="my-hero-academia"] .qr-mha-quirk-actions { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  body[data-room="my-hero-academia"] *,
  body[data-room="my-hero-academia"] *::before,
  body[data-room="my-hero-academia"] *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}