.bqi-mb {
  --bqi-mb-ink: #172033;
  --bqi-mb-muted: #4b5568;
  --bqi-mb-border: #aab7c8;
  --bqi-mb-soft: #f4f7fa;
  --bqi-mb-accent: #175f8d;
  --bqi-mb-accent-dark: #104766;
  --bqi-mb-success: #2d6e45;
  width: 100%;
  max-width: none;
  margin: 0;
  color: var(--bqi-mb-ink);
  font-size: 18px;
  line-height: 1.5;
}

.bqi-mb.bqi-app-shell--viewport {
  min-height: 100%;
}

.bqi-mb.bqi-app-shell--viewport .bqi-mb__header,
.bqi-mb.bqi-app-shell--viewport .bqi-mb__chooser,
.bqi-mb.bqi-app-shell--viewport .bqi-mb__activity-card,
.bqi-mb.bqi-app-shell--viewport .bqi-mb__statusbar,
.bqi-mb.bqi-app-shell--viewport .bqi-mb__controls,
.bqi-mb.bqi-app-shell--viewport .bqi-mb__live,
.bqi-mb.bqi-app-shell--viewport .bqi-mb__stage,
.bqi-mb.bqi-app-shell--viewport .bqi-mb__safety {
  width: 100%;
}

.bqi-mb.bqi-app-shell--viewport .bqi-mb__stage {
  min-height: clamp(360px, 58vh, 780px);
}

.bqi-mb.bqi-app-shell--viewport .bqi-mb__grid,
.bqi-mb.bqi-app-shell--viewport .bqi-mb__sequence-grid {
  width: 100%;
}

.bqi-mb * { box-sizing: border-box; }
.bqi-mb h2, .bqi-mb h3, .bqi-mb p { margin-top: 0; }

.bqi-mb__header { margin-bottom: 18px; }
.bqi-mb__header h2 { font-size: clamp(2rem, 4vw, 2.7rem); margin-bottom: 6px; }
.bqi-mb__header p { color: var(--bqi-mb-muted); font-size: 1.05em; }

.bqi-mb__chooser {
  display: grid;
  grid-template-columns: minmax(180px, 280px);
  gap: 6px;
  margin-bottom: 14px;
}

.bqi-mb__chooser label {
  display: grid;
  gap: 6px;
  font-weight: 800;
}

.bqi-mb__chooser select {
  min-height: 48px;
  width: 100%;
  border: 2px solid var(--bqi-mb-border);
  border-radius: 10px;
  background: #fff;
  color: var(--bqi-mb-ink);
  padding: 8px 12px;
  font: inherit;
  font-weight: 700;
}

.bqi-mb__chooser select:focus-visible {
  outline: 4px solid #0b6aa2;
  outline-offset: 3px;
}

.bqi-mb__activity-card {
  border: 1px solid var(--bqi-mb-border);
  border-radius: 14px;
  padding: 18px;
  margin-bottom: 14px;
  background: #fff;
}

.bqi-mb__eyebrow {
  margin-bottom: 4px;
  color: var(--bqi-mb-muted);
  font-weight: 700;
  font-size: .9em;
}

.bqi-mb__activity-card h3 { margin-bottom: 6px; font-size: 1.45em; }
.bqi-mb__activity-card p:last-child { margin-bottom: 0; }

.bqi-mb__statusbar {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 10px 14px;
  margin-bottom: 12px;
  border-radius: 10px;
  background: var(--bqi-mb-soft);
  font-weight: 700;
}

.bqi-mb__controls {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.bqi-mb__button {
  min-height: 48px;
  border: 2px solid var(--bqi-mb-border);
  border-radius: 10px;
  background: #fff;
  color: var(--bqi-mb-ink);
  padding: 10px 18px;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.bqi-mb__button--primary {
  color: #fff;
  background: var(--bqi-mb-accent);
  border-color: var(--bqi-mb-accent);
}

.bqi-mb__button:hover { border-color: var(--bqi-mb-accent); }
.bqi-mb__button--primary:hover { background: var(--bqi-mb-accent-dark); }

.bqi-mb__button:focus-visible,
.bqi-mb__card:focus-visible,
.bqi-mb__sequence-tile:focus-visible {
  outline: 4px solid #0b6aa2;
  outline-offset: 3px;
}

.bqi-mb__live {
  min-height: 1.5em;
  margin-bottom: 10px;
  font-weight: 700;
  color: var(--bqi-mb-muted);
}

.bqi-mb__stage {
  min-height: 240px;
  padding: 14px;
  border: 1px solid var(--bqi-mb-border);
  border-radius: 16px;
  background: #fbfcfe;
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.bqi-mb__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(76px, 1fr));
  gap: 12px;
  align-items: stretch;
}

.bqi-mb__card {
  min-height: 92px;
  aspect-ratio: 1 / .82;
  border: 2px solid #7d8da3;
  border-radius: 14px;
  background: #e8eef5;
  color: #223044;
  font: inherit;
  cursor: pointer;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}

.bqi-mb__card:hover { transform: translateY(-1px); border-color: var(--bqi-mb-accent); }

.bqi-mb__card.is-open,
.bqi-mb__card.is-matched {
  background: #fff;
  border-color: var(--bqi-mb-accent);
}

.bqi-mb__card.is-matched {
  background: #eaf7ef;
  border-color: var(--bqi-mb-success);
}

.bqi-mb__card-face {
  display: inline-block;
  font-size: clamp(2rem, 5vw, 3.2rem);
  font-weight: 900;
  line-height: 1;
}

.bqi-mb__sequence-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(92px, 1fr));
  gap: 14px;
  max-width: 760px;
  margin: 0 auto;
}

.bqi-mb__sequence-tile {
  min-height: 118px;
  border: 3px solid #687991;
  border-radius: 16px;
  background: #edf2f7;
  color: #172033;
  font: inherit;
  cursor: pointer;
  transition: transform .12s ease, background .12s ease, border-color .12s ease, color .12s ease;
}

.bqi-mb__sequence-tile:hover:not(:disabled) {
  border-color: var(--bqi-mb-accent);
}

.bqi-mb__sequence-tile:disabled {
  cursor: default;
  opacity: 1;
}

.bqi-mb__sequence-tile.is-sequence-active {
  background: #123d5b;
  border-color: #123d5b;
  color: #fff;
  transform: scale(1.04);
}

.bqi-mb__sequence-tile.is-sequence-choice {
  background: #dbeaf4;
  border-color: var(--bqi-mb-accent);
}

.bqi-mb__sequence-face {
  display: inline-block;
  font-size: clamp(2.6rem, 6vw, 4rem);
  font-weight: 900;
  line-height: 1;
}

.bqi-mb__complete {
  margin-top: 14px;
  padding: 18px;
  border-radius: 14px;
  background: #eef7f1;
  border: 1px solid #88ad94;
}

.bqi-mb__complete h3 { margin-bottom: 6px; }
.bqi-mb__complete p { margin-bottom: 12px; }
.bqi-mb__safety { margin: 14px 0 0; color: var(--bqi-mb-muted); font-size: .92em; }

@media (max-width: 680px) {
  .bqi-mb { font-size: 17px; }
  .bqi-mb__header h2 { font-size: 2rem; }
  .bqi-mb__chooser { grid-template-columns: 1fr; }
  .bqi-mb__activity-card { padding: 14px; }
  .bqi-mb__stage { padding: 10px; }
  .bqi-mb__grid { grid-template-columns: repeat(3, minmax(76px, 1fr)); gap: 9px; }
  .bqi-mb__card { min-height: 84px; border-radius: 12px; }
  .bqi-mb__card-face { font-size: clamp(2.2rem, 12vw, 3.35rem); }
  .bqi-mb__sequence-grid { grid-template-columns: repeat(2, minmax(110px, 1fr)); gap: 10px; }
  .bqi-mb__sequence-tile { min-height: 106px; }
  .bqi-mb__sequence-face { font-size: clamp(2.8rem, 14vw, 4rem); }
  .bqi-mb__controls .bqi-mb__button { flex: 1 1 150px; }
}

@media (max-width: 390px) {
  .bqi-mb__grid { grid-template-columns: repeat(3, minmax(68px, 1fr)); gap: 7px; }
  .bqi-mb__card { min-height: 78px; }
  .bqi-mb__sequence-grid { grid-template-columns: repeat(2, minmax(96px, 1fr)); gap: 8px; }
  .bqi-mb__sequence-tile { min-height: 98px; }
}

@media (max-height: 460px) and (orientation: landscape) {
  .bqi-mb__header { margin-bottom: 10px; }
  .bqi-mb__activity-card { padding: 12px; margin-bottom: 10px; }
  .bqi-mb__stage { min-height: 230px; }
  .bqi-mb__sequence-grid { grid-template-columns: repeat(4, minmax(90px, 1fr)); }
  .bqi-mb__sequence-tile { min-height: 88px; }
}

@media (prefers-reduced-motion: reduce) {
  .bqi-mb__card,
  .bqi-mb__sequence-tile {
    transition: none;
  }
}

/* BQIM.1.2.2 — Pause State Visibility Recovery
 * The component styles use explicit display values (for example display:grid).
 * Force the HTML hidden contract to win so stale UI cannot survive a state change. */
.bqi-mb [hidden] {
  display: none !important;
}

/* BQIM.1.2.1 — Shared Session Flow Recovery */
.bqi-mb.is-active .bqi-mb__chooser {
  display: none;
}

.bqi-mb__button--danger {
  border-color: #9b3c3c;
  color: #7d2929;
  background: #fff;
}

.bqi-mb__button--danger:hover,
.bqi-mb__button--danger.is-confirming {
  border-color: #7d2929;
  background: #fff2f2;
  color: #681f1f;
}

.bqi-mb__pause-card {
  min-height: 220px;
  display: grid;
  place-content: center;
  gap: 10px;
  text-align: center;
  padding: 24px;
  border: 2px solid var(--bqi-mb-border);
  border-radius: 16px;
  background: #fff;
  color: var(--bqi-mb-ink);
}

.bqi-mb__pause-card strong {
  font-size: clamp(1.45rem, 4vw, 2rem);
}

.bqi-mb__pause-card span {
  color: var(--bqi-mb-muted);
}

.bqi-mb.is-paused .bqi-mb__stage {
  min-height: clamp(300px, 50vh, 620px);
}

@media (max-width: 680px) {
  .bqi-mb.is-active .bqi-mb__header,
  .bqi-mb.is-active .bqi-mb__activity-card {
    margin-bottom: 10px;
  }

  .bqi-mb.is-active .bqi-mb__controls {
    position: sticky;
    bottom: 0;
    z-index: 20;
    padding: 8px 0 max(8px, env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, .96);
  }

  .bqi-mb.is-active .bqi-mb__controls .bqi-mb__button {
    flex: 1 1 110px;
  }

  .bqi-mb__pause-card {
    min-height: 200px;
  }
}


/* BQIM.1.2.3 — Stage Lifecycle + Centered Activity Content
 * Idle activities without useful content do not reserve a large empty canvas.
 * Sequence content and paused state stay centered in the available stage. */
.bqi-mb.is-sequence-mode .bqi-mb__stage:not([hidden]) {
  display: grid;
  align-items: center;
}

.bqi-mb.is-sequence-mode [data-bqi-mb-sequence-stage]:not([hidden]) {
  width: 100%;
}

.bqi-mb.is-paused .bqi-mb__stage:not([hidden]) {
  display: grid;
  place-items: center;
}

.bqi-mb.is-paused .bqi-mb__pause-card:not([hidden]) {
  width: 100%;
}

/* BQIM.1.3 / BQIM.1.3.1 — Attention Engine
 * G03 progressive automatic search + G15 progressive safe reaction.
 * Large targets, non-color rules, comfortable pacing, no competitive timer. */
.bqi-mb__search-target {
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 18px;
  padding: 12px 22px;
  border: 2px solid var(--bqi-mb-accent);
  border-radius: 14px;
  background: #fff;
  color: var(--bqi-mb-ink);
  font-size: clamp(1.25rem, 3vw, 1.65rem);
  font-weight: 900;
  text-align: center;
}

.bqi-mb__search-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(72px, 1fr));
  gap: 12px;
  width: 100%;
  max-width: 920px;
  margin: 0 auto;
}

.bqi-mb__search-tile {
  min-height: 88px;
  border: 3px solid #687991;
  border-radius: 14px;
  background: #edf2f7;
  color: #172033;
  font: inherit;
  cursor: pointer;
}

.bqi-mb__search-tile:hover:not(:disabled) {
  border-color: var(--bqi-mb-accent);
  background: #e2edf5;
}

.bqi-mb__search-tile.is-found {
  border-color: var(--bqi-mb-success);
  background: #eaf7ef;
}

.bqi-mb__search-tile.is-miss {
  border-color: #8a5b24;
  background: #fff7e8;
}

.bqi-mb__search-tile:disabled {
  cursor: default;
  opacity: 1;
}

.bqi-mb__search-face {
  display: inline-block;
  font-size: clamp(2.35rem, 5vw, 3.65rem);
  font-weight: 900;
  line-height: 1;
}


.bqi-mb__complete--auto {
  text-align: center;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

.bqi-mb__reaction-rule {
  width: min(100%, 680px);
  margin: 0 auto 16px;
  padding: 14px 18px;
  border: 2px solid var(--bqi-mb-accent);
  border-radius: 14px;
  background: #fff;
  color: var(--bqi-mb-ink);
  font-size: clamp(1.1rem, 3vw, 1.4rem);
  font-weight: 900;
  text-align: center;
}

.bqi-mb__reaction-cue {
  width: min(100%, 560px);
  min-height: 260px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 18px;
  margin: 0 auto;
  padding: 28px;
  border: 4px solid #687991;
  border-radius: 22px;
  background: #edf2f7;
  color: #172033;
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

.bqi-mb__reaction-cue.is-target {
  border-color: var(--bqi-mb-success);
  background: #e5f6eb;
  color: #173d28;
}

.bqi-mb__reaction-cue.is-waiting {
  border-color: #687991;
  background: #edf2f7;
}

.bqi-mb__reaction-cue:disabled {
  cursor: default;
  opacity: 1;
}

.bqi-mb__reaction-symbol {
  font-size: clamp(4rem, 10vw, 7rem);
  line-height: .85;
}

.bqi-mb__reaction-label {
  font-size: clamp(1.7rem, 5vw, 2.6rem);
  letter-spacing: .04em;
}

.bqi-mb__search-tile:focus-visible,
.bqi-mb__reaction-cue:focus-visible {
  outline: 4px solid #0b6aa2;
  outline-offset: 3px;
}

.bqi-mb.is-search-mode .bqi-mb__stage:not([hidden]) {
  display: grid;
  align-items: center;
}

.bqi-mb.is-search-mode [data-bqi-mb-search-stage]:not([hidden]),
.bqi-mb.is-reaction-mode [data-bqi-mb-reaction-stage]:not([hidden]) {
  width: 100%;
}

.bqi-mb.is-reaction-mode .bqi-mb__stage:not([hidden]) {
  display: grid;
  place-items: center;
}

@media (max-width: 760px) {
  .bqi-mb__search-grid {
    grid-template-columns: repeat(4, minmax(64px, 1fr));
    gap: 9px;
  }

  .bqi-mb__search-tile {
    min-height: 78px;
  }

  .bqi-mb__search-face {
    font-size: clamp(2.35rem, 11vw, 3.4rem);
  }

  .bqi-mb__reaction-cue {
    min-height: 230px;
    padding: 22px;
  }
}

@media (max-width: 390px) {
  .bqi-mb__search-grid {
    grid-template-columns: repeat(3, minmax(68px, 1fr));
    gap: 8px;
  }

  .bqi-mb__search-tile {
    min-height: 74px;
  }
}

@media (max-height: 460px) and (orientation: landscape) {
  .bqi-mb__search-grid {
    grid-template-columns: repeat(7, minmax(68px, 1fr));
    gap: 8px;
  }

  .bqi-mb__search-tile {
    min-height: 68px;
  }

  .bqi-mb__reaction-cue {
    min-height: 190px;
  }
}

/* BQIM.1.4 — Reasoning Engine
 * G05 logical patterns, G12 puzzle, G13 spatial rotation and G14 classification.
 * Progressive difficulty, large touch targets, automatic advance after success,
 * no competitive timer and no penalty on incorrect attempts. */
.bqi-mb__reasoning-prompt {
  width: min(100%, 760px);
  margin: 0 auto 18px;
  padding: 14px 18px;
  border: 2px solid var(--bqi-mb-accent);
  border-radius: 14px;
  background: #fff;
  color: var(--bqi-mb-ink);
  font-size: clamp(1.15rem, 3vw, 1.45rem);
  font-weight: 900;
  text-align: center;
}

.bqi-mb__reasoning-board {
  width: min(100%, 920px);
  margin: 0 auto 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.bqi-mb__reasoning-board.is-matrix {
  display: grid;
  grid-template-columns: repeat(var(--bqi-reasoning-columns, 3), minmax(82px, 118px));
  justify-content: center;
}

.bqi-mb__reasoning-board.is-single .bqi-mb__reasoning-token {
  min-width: min(190px, 70vw);
  min-height: 150px;
  font-size: clamp(4rem, 12vw, 7rem);
}

.bqi-mb__reasoning-token {
  min-width: 86px;
  min-height: 86px;
  display: grid;
  place-items: center;
  padding: 10px;
  border: 2px solid #7d8da3;
  border-radius: 14px;
  background: #edf2f7;
  color: var(--bqi-mb-ink);
  font-size: clamp(1.9rem, 5vw, 3rem);
  font-weight: 900;
  line-height: 1.1;
  text-align: center;
}

.bqi-mb__reasoning-token.is-missing {
  border-style: dashed;
  border-color: var(--bqi-mb-accent);
  background: #fff;
}

.bqi-mb__reasoning-options {
  width: min(100%, 760px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  gap: 12px;
}

.bqi-mb__reasoning-option {
  min-height: 92px;
  padding: 12px;
  border: 3px solid #687991;
  border-radius: 14px;
  background: #fff;
  color: var(--bqi-mb-ink);
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

.bqi-mb__reasoning-option:hover:not(:disabled) {
  border-color: var(--bqi-mb-accent);
  background: #eef6fb;
}

.bqi-mb__reasoning-option.is-miss {
  border-color: #8a5b24;
  background: #fff7e8;
}

.bqi-mb__reasoning-option.is-correct {
  border-color: var(--bqi-mb-success);
  background: #eaf7ef;
}

.bqi-mb__reasoning-option:disabled {
  cursor: default;
  opacity: 1;
}

.bqi-mb__reasoning-option-face {
  display: inline-block;
  font-size: clamp(2rem, 6vw, 3.5rem);
  line-height: 1.1;
}

/* BQIM.1.4.1 — keep count-based dot puzzles legible inside every tile. */
.bqi-mb__reasoning-token.is-dot-cluster,
.bqi-mb__reasoning-option-face.is-dot-cluster {
  --bqi-reasoning-dot-size: clamp(10px, 1.25vw, 14px);
  --bqi-reasoning-dot-gap: clamp(4px, 0.5vw, 6px);
  width: min(64px, 100%);
  max-width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  gap: var(--bqi-reasoning-dot-gap);
  margin-inline: auto;
}

.bqi-mb__reasoning-dot {
  width: var(--bqi-reasoning-dot-size);
  height: var(--bqi-reasoning-dot-size);
  flex: 0 0 var(--bqi-reasoning-dot-size);
  border-radius: 50%;
  background: currentColor;
}

.bqi-mb__reasoning-option:focus-visible {
  outline: 4px solid #0b6aa2;
  outline-offset: 3px;
}

.bqi-mb.is-reasoning-mode .bqi-mb__stage:not([hidden]) {
  display: grid;
  align-items: center;
}

.bqi-mb.is-reasoning-mode [data-bqi-mb-reasoning-stage]:not([hidden]) {
  width: 100%;
}

@media (max-width: 680px) {
  .bqi-mb__reasoning-board {
    gap: 9px;
  }

  .bqi-mb__reasoning-board.is-matrix {
    grid-template-columns: repeat(var(--bqi-reasoning-columns, 3), minmax(70px, 1fr));
    max-width: 420px;
  }

  .bqi-mb__reasoning-token {
    min-width: 70px;
    min-height: 74px;
    padding: 8px;
    font-size: clamp(1.7rem, 9vw, 2.7rem);
  }

  .bqi-mb__reasoning-options {
    grid-template-columns: repeat(2, minmax(110px, 1fr));
    gap: 9px;
  }

  .bqi-mb__reasoning-option {
    min-height: 82px;
  }
}

@media (max-width: 390px) {
  .bqi-mb__reasoning-token {
    min-width: 64px;
    min-height: 68px;
  }

  .bqi-mb__reasoning-options {
    grid-template-columns: repeat(2, minmax(96px, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  .bqi-mb__reasoning-option {
    transition: none;
  }
}


/* BQIM.1.5 — Knowledge + Language Cognitive Engine */
.bqi-mb__language-prompt {
  width: min(100%, 840px);
  margin: 0 auto 18px;
  padding: 14px 18px;
  border: 2px solid var(--bqi-mb-accent);
  border-radius: 14px;
  background: #fff;
  color: var(--bqi-mb-ink);
  font-size: clamp(1.15rem, 3vw, 1.45rem);
  font-weight: 900;
  line-height: 1.35;
  text-align: center;
}

.bqi-mb__language-board {
  width: min(100%, 860px);
  margin: 0 auto 18px;
}

.bqi-mb__language-options {
  width: min(100%, 820px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(140px, 1fr));
  gap: 12px;
}

.bqi-mb__language-option {
  min-height: 76px;
  padding: 14px 16px;
  border: 3px solid #687991;
  border-radius: 14px;
  background: #fff;
  color: var(--bqi-mb-ink);
  font: inherit;
  font-size: clamp(1rem, 2.5vw, 1.2rem);
  font-weight: 850;
  line-height: 1.25;
  cursor: pointer;
}

.bqi-mb__language-option:hover:not(:disabled) {
  border-color: var(--bqi-mb-accent);
  background: #eef6fb;
}

.bqi-mb__language-option.is-miss,
.bqi-mb__language-board.is-miss .bqi-mb__crossword-cell {
  border-color: #8a5b24;
  background: #fff7e8;
}

.bqi-mb__language-option.is-correct {
  border-color: var(--bqi-mb-success);
  background: #eaf7ef;
}

.bqi-mb__language-option:focus-visible,
.bqi-mb__word-cell:focus-visible {
  outline: 4px solid #0b6aa2;
  outline-offset: 3px;
}

.bqi-mb__language-board.is-word-search {
  display: grid;
  grid-template-columns: repeat(var(--bqi-word-search-size, 6), minmax(38px, 62px));
  justify-content: center;
  gap: 7px;
}

.bqi-mb__word-cell {
  aspect-ratio: 1;
  min-width: 0;
  border: 2px solid #7d8da3;
  border-radius: 10px;
  background: #fff;
  color: var(--bqi-mb-ink);
  font: inherit;
  font-size: clamp(1.05rem, 4vw, 1.45rem);
  font-weight: 900;
  cursor: pointer;
}

.bqi-mb__word-cell.is-current {
  border-color: var(--bqi-mb-accent);
  background: #e9f5fb;
}

.bqi-mb__word-cell.is-found {
  border-color: var(--bqi-mb-success);
  background: #eaf7ef;
}

.bqi-mb__language-clues {
  width: min(100%, 820px);
  margin: 0 auto 16px;
  display: grid;
  gap: 7px;
}

.bqi-mb__crossword-clue {
  padding: 9px 12px;
  border-left: 4px solid #b7c2d0;
  background: #f6f8fb;
  line-height: 1.35;
}

.bqi-mb__crossword-clue.is-active {
  border-left-color: var(--bqi-mb-accent);
  font-weight: 800;
}

.bqi-mb__crossword-clue.is-solved {
  border-left-color: var(--bqi-mb-success);
  opacity: .72;
}

.bqi-mb__language-board.is-crossword {
  display: flex;
  justify-content: center;
  gap: 7px;
  flex-wrap: wrap;
}

.bqi-mb__crossword-cell {
  width: clamp(44px, 8vw, 64px);
  height: clamp(52px, 9vw, 72px);
  display: grid;
  place-items: center;
  border: 2px solid #687991;
  border-radius: 9px;
  background: #fff;
  color: var(--bqi-mb-ink);
  font-size: clamp(1.35rem, 5vw, 2rem);
  font-weight: 900;
}

.bqi-mb__letter-option {
  min-height: 60px;
  font-size: 1.25rem;
}

.bqi-mb.is-language-mode .bqi-mb__stage:not([hidden]) {
  display: grid;
  align-items: center;
}

.bqi-mb.is-language-mode [data-bqi-mb-language-stage]:not([hidden]) {
  width: 100%;
}


/* BQIM.1.5.1 — one language challenge at a time, with deeper banks. */
.bqi-mb__language-options.is-letter-bank {
  width: min(100%, 860px);
  grid-template-columns: repeat(auto-fit, minmax(58px, 1fr));
  gap: 9px;
}

.bqi-mb__language-options.is-letter-bank .bqi-mb__letter-option {
  min-height: 58px;
  padding: 9px;
  font-size: clamp(1.05rem, 3vw, 1.3rem);
}

.bqi-mb__language-options.is-letter-bank .bqi-mb__letter-option.is-erase {
  min-width: 116px;
}

@media (max-width: 680px) {
  .bqi-mb__language-options {
    grid-template-columns: 1fr 1fr;
    gap: 9px;
  }

  .bqi-mb__language-option {
    min-height: 68px;
    padding: 11px 10px;
  }

  .bqi-mb__language-board.is-word-search {
    gap: 5px;
    grid-template-columns: repeat(var(--bqi-word-search-size, 6), minmax(28px, 1fr));
  }

  .bqi-mb__word-cell {
    border-radius: 8px;
    padding: 0;
  }
}

@media (max-width: 390px) {
  .bqi-mb__language-options {
    grid-template-columns: 1fr;
  }

  .bqi-mb__language-board.is-word-search {
    gap: 4px;
  }
}


/* BQIM.1.5.2 — large rotating content banks. Word-search may grow to 16x16;
 * cells remain square and the board scales inside the available width. */
.bqi-mb__language-board.is-word-search {
  width: min(100%, 960px);
  grid-template-columns: repeat(var(--bqi-word-search-size, 8), minmax(0, 1fr));
}
.bqi-mb__word-cell {
  min-height: 0;
  font-size: clamp(.78rem, 2.2vw, 1.35rem);
}
@media (max-width: 680px) {
  .bqi-mb__language-board.is-word-search { gap: 3px; }
  .bqi-mb__word-cell { border-width: 1px; border-radius: 5px; font-size: clamp(.66rem, 3.3vw, 1rem); }
}

/* BQIM.1.6 — Guided Session Orchestration */
.bqi-mb.bqi-app-shell--viewport .bqi-mb__session-summary,
.bqi-mb.bqi-app-shell--viewport .bqi-mb__session-complete {
  width: 100%;
}

.bqi-mb__chooser {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.bqi-mb__session-summary {
  margin: 0 0 14px;
  padding: 12px 14px;
  border: 1px solid #c4cfda;
  border-radius: 12px;
  background: #f7fafc;
  color: var(--bqi-mb-muted);
  font-weight: 650;
}

.bqi-mb__session-complete {
  display: grid;
  gap: 6px;
  max-width: 760px;
  margin: 12px auto 16px;
  padding: 18px 20px;
  border: 1px solid #88ad94;
  border-radius: 14px;
  background: #eef7f1;
  text-align: center;
}

.bqi-mb__session-complete strong {
  font-size: clamp(1.3rem, 3vw, 1.7rem);
}

.bqi-mb__session-complete span {
  color: var(--bqi-mb-muted);
}

.bqi-mb.is-active .bqi-mb__session-summary {
  padding-block: 9px;
  margin-bottom: 10px;
}

@media (max-width: 680px) {
  .bqi-mb__chooser {
    grid-template-columns: 1fr;
  }

  .bqi-mb__session-summary {
    font-size: .94em;
    padding: 10px 12px;
  }

  .bqi-mb__session-complete {
    margin-top: 8px;
    padding: 16px;
  }
}


/* BQIM.1.7–1.11 consolidated candidate — accessibility, resume and mobile polish */
.bqi-mb__accessibility {
  margin: 0 0 14px;
  border: 1px solid var(--bqi-mb-border);
  border-radius: 12px;
  background: #fff;
}
.bqi-mb__accessibility summary {
  min-height: 48px;
  display: flex;
  align-items: center;
  padding: 8px 14px;
  font-weight: 800;
  cursor: pointer;
}
.bqi-mb__accessibility-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  gap: 10px;
  padding: 0 14px 14px;
}
.bqi-mb__accessibility-options label {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 10px;
  border: 1px solid var(--bqi-mb-border);
  border-radius: 10px;
  font-weight: 700;
}
.bqi-mb__accessibility-options input { width: 22px; height: 22px; flex: 0 0 auto; }
.bqi-mb__resume-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px;
  margin-bottom: 14px;
  border: 1px solid #88ad94;
  border-radius: 14px;
  background: #eef7f1;
}
.bqi-mb__resume-card > div:first-child { display: grid; gap: 3px; }
.bqi-mb__resume-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.bqi-mb.is-large-text { font-size: 21px; }
.bqi-mb.is-large-text .bqi-mb__button,
.bqi-mb.is-large-text select { min-height: 54px; }
.bqi-mb.is-high-contrast {
  --bqi-mb-ink: #05080d;
  --bqi-mb-muted: #1d2836;
  --bqi-mb-border: #526276;
  --bqi-mb-soft: #eef2f6;
  --bqi-mb-accent: #064f7b;
  --bqi-mb-accent-dark: #033a5c;
}
.bqi-mb.is-high-contrast .bqi-mb__stage,
.bqi-mb.is-high-contrast .bqi-mb__activity-card,
.bqi-mb.is-high-contrast .bqi-mb__accessibility { border-width: 2px; }
.bqi-mb__session-complete [data-bqi-mb-session-complete-detail] { color: var(--bqi-mb-muted); }
@media (max-width: 680px) {
  .bqi-mb__accessibility-options { grid-template-columns: 1fr; }
  .bqi-mb__resume-card { align-items: stretch; flex-direction: column; }
  .bqi-mb__resume-actions .bqi-mb__button { flex: 1 1 140px; }
  .bqi-mb.is-large-text { font-size: 19px; }
}