/*
 * BSHQ English v10.7.2 — Product UI System
 * Final visual layer loaded after legacy style.css.
 * Scope: presentation only. No audio, REST, database or learning logic changes.
 */

:root {
  --bq-bg: #07111f;
  --bq-bg-soft: #0a1626;
  --bq-panel: #0e1b2d;
  --bq-panel-2: #122238;
  --bq-panel-3: #172a43;
  --bq-text: #f7fafc;
  --bq-text-soft: #dce6f1;
  --bq-muted: #98a9bc;
  --bq-muted-2: #71859b;
  --bq-line: rgba(155, 177, 202, .16);
  --bq-line-strong: rgba(155, 177, 202, .28);
  --bq-accent: #63e6be;
  --bq-accent-2: #34d3aa;
  --bq-accent-deep: #0d8b72;
  --bq-blue: #79a9ff;
  --bq-yellow: #f4c75f;
  --bq-red: #fb7185;
  --bq-radius-sm: 12px;
  --bq-radius: 18px;
  --bq-radius-lg: 26px;
  --bq-shadow: 0 20px 55px rgba(0, 7, 20, .24);
  --bq-shadow-soft: 0 10px 30px rgba(0, 7, 20, .16);
}

/* ---------- Global product frame ---------- */
body.bshq-vocab-fullscreen-page .bshq-vocab-root {
  color: var(--bq-text) !important;
  background:
    radial-gradient(900px 560px at 83% -16%, rgba(52, 211, 170, .11), transparent 62%),
    radial-gradient(780px 580px at -8% 112%, rgba(79, 129, 255, .08), transparent 64%),
    var(--bq-bg) !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body.bshq-vocab-fullscreen-page .bshq-vocab-root h1,
body.bshq-vocab-fullscreen-page .bshq-vocab-root h2,
body.bshq-vocab-fullscreen-page .bshq-vocab-root h3,
body.bshq-vocab-fullscreen-page .bshq-vocab-root h4,
body.bshq-vocab-fullscreen-page .bshq-vocab-root strong {
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-vocab-root button,
body.bshq-vocab-fullscreen-page .bshq-vocab-root [role="button"],
body.bshq-vocab-fullscreen-page .bshq-vocab-root input,
body.bshq-vocab-fullscreen-page .bshq-vocab-root textarea,
body.bshq-vocab-fullscreen-page .bshq-vocab-root select {
  font: inherit;
}

body.bshq-vocab-fullscreen-page .bshq-vocab-root button:focus-visible,
body.bshq-vocab-fullscreen-page .bshq-vocab-root [role="button"]:focus-visible,
body.bshq-vocab-fullscreen-page .bshq-vocab-root input:focus-visible,
body.bshq-vocab-fullscreen-page .bshq-vocab-root textarea:focus-visible,
body.bshq-vocab-fullscreen-page .bshq-vocab-root select:focus-visible {
  outline: 0 !important;
  box-shadow: 0 0 0 3px rgba(99, 230, 190, .20) !important;
}

body.bshq-vocab-fullscreen-page .bshq-app-shell {
  grid-template-columns: 96px minmax(0, 1fr) !important;
  background: transparent !important;
}

body.bshq-vocab-fullscreen-page .bshq-side {
  padding: 16px 10px !important;
  background: rgba(5, 14, 27, .90) !important;
  border-right: 1px solid rgba(155,177,202,.13) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

body.bshq-vocab-fullscreen-page .bshq-brand {
  flex-direction: column;
  justify-content: center;
  gap: 7px !important;
  padding: 0 0 20px !important;
}

body.bshq-vocab-fullscreen-page .bshq-brand-mark {
  width: 46px !important;
  height: 46px !important;
  border-radius: 15px !important;
  background: linear-gradient(145deg, #77efc8, #45d9ad) !important;
  color: #04251b !important;
  box-shadow: 0 12px 28px rgba(52, 211, 170, .20) !important;
}

body.bshq-vocab-fullscreen-page .bshq-brand-name {
  display: block !important;
  max-width: 76px;
  color: #d7e4ef !important;
  font-size: 9px !important;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
}

body.bshq-vocab-fullscreen-page .bshq-nav {
  gap: 9px !important;
}

body.bshq-vocab-fullscreen-page .bshq-nav-item {
  position: relative;
  min-height: 61px !important;
  padding: 8px 5px !important;
  flex-direction: column;
  justify-content: center;
  gap: 6px !important;
  border: 1px solid transparent !important;
  border-radius: 17px !important;
  color: #8295aa !important;
  font-size: 9px !important;
  font-weight: 750;
  line-height: 1.12;
  text-align: center;
  transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease !important;
}

body.bshq-vocab-fullscreen-page .bshq-nav-item svg {
  width: 23px !important;
  height: 23px !important;
}

body.bshq-vocab-fullscreen-page .bshq-nav-item:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,.04) !important;
  color: #dbe7f2 !important;
}

body.bshq-vocab-fullscreen-page .bshq-nav-item.active {
  border-color: rgba(99,230,190,.22) !important;
  background: linear-gradient(180deg, rgba(99,230,190,.15), rgba(99,230,190,.07)) !important;
  color: #d9fff2 !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

body.bshq-vocab-fullscreen-page .bshq-nav-item.active svg {
  color: var(--bq-accent) !important;
}

body.bshq-vocab-fullscreen-page .bshq-main {
  padding: 18px clamp(18px, 2.5vw, 38px) 34px !important;
  scrollbar-color: rgba(155,177,202,.28) transparent;
}

body.bshq-vocab-fullscreen-page .bshq-main > .bshq-top,
body.bshq-vocab-fullscreen-page .bshq-main > .bshq-view {
  width: min(100%, 1480px) !important;
  margin-inline: auto !important;
}

body.bshq-vocab-fullscreen-page .bshq-top {
  min-height: 60px;
  margin-bottom: 18px !important;
}

body.bshq-vocab-fullscreen-page .bshq-top h1 {
  margin: 0 !important;
  color: var(--bq-text) !important;
  font-size: clamp(25px, 2.4vw, 35px) !important;
  font-weight: 860 !important;
  line-height: 1.04 !important;
  letter-spacing: -.048em !important;
}

body.bshq-vocab-fullscreen-page .bshq-eyebrow {
  margin: 0 0 5px !important;
  color: var(--bq-accent) !important;
  font-size: 9px !important;
  font-weight: 900 !important;
  letter-spacing: .17em !important;
}

/* ---------- Buttons, fields, reusable surfaces ---------- */
body.bshq-vocab-fullscreen-page .bshq-btn {
  min-height: 44px;
  padding: 10px 16px;
  border-radius: 13px !important;
  font-weight: 820 !important;
  letter-spacing: -.012em;
}

body.bshq-vocab-fullscreen-page .bshq-btn-primary {
  border-color: transparent !important;
  background: linear-gradient(135deg, #72edc7, #37d0a6) !important;
  color: #04261c !important;
  box-shadow: 0 13px 28px rgba(52, 211, 170, .18), inset 0 1px 0 rgba(255,255,255,.42) !important;
}

body.bshq-vocab-fullscreen-page .bshq-btn-primary:hover:not(:disabled) {
  transform: translateY(-2px) !important;
  box-shadow: 0 17px 36px rgba(52, 211, 170, .25), inset 0 1px 0 rgba(255,255,255,.48) !important;
}

body.bshq-vocab-fullscreen-page .bshq-btn-soft,
body.bshq-vocab-fullscreen-page .bshq-icon-btn {
  border-color: var(--bq-line) !important;
  background: rgba(255,255,255,.035) !important;
  color: var(--bq-text-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-btn-soft:hover:not(:disabled),
body.bshq-vocab-fullscreen-page .bshq-icon-btn:hover:not(:disabled) {
  border-color: rgba(99,230,190,.36) !important;
  background: rgba(99,230,190,.07) !important;
}

body.bshq-vocab-fullscreen-page .bshq-text-btn {
  color: var(--bq-accent) !important;
  font-weight: 800 !important;
}

body.bshq-vocab-fullscreen-page .bshq-text-btn svg {
  width: 15px !important;
  height: 15px !important;
}

body.bshq-vocab-fullscreen-page .bshq-panel,
body.bshq-vocab-fullscreen-page .bshq-growth-card,
body.bshq-vocab-fullscreen-page .bshq-rank-row,
body.bshq-vocab-fullscreen-page .bshq-achievement-item,
body.bshq-vocab-fullscreen-page .bshq-review-card,
body.bshq-vocab-fullscreen-page .bshq-deep-card,
body.bshq-vocab-fullscreen-page .bshq-sentence-card,
body.bshq-vocab-fullscreen-page .bshq-dd-workspace,
body.bshq-vocab-fullscreen-page .bshq-dd-reference {
  border-color: var(--bq-line) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.018), transparent 55%), var(--bq-panel) !important;
  box-shadow: var(--bq-shadow-soft) !important;
}

/* ---------- Dashboard ---------- */
body.bshq-vocab-fullscreen-page .bshq-growth-dashboard,
body.bshq-vocab-fullscreen-page .bshq-leaderboard-screen,
body.bshq-vocab-fullscreen-page .bshq-achievements-screen {
  max-width: 1320px !important;
  padding-bottom: 44px !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero {
  position: relative;
  min-height: 212px;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center !important;
  gap: 28px !important;
  overflow: hidden;
  padding: clamp(28px, 3.4vw, 44px) !important;
  border: 1px solid rgba(99,230,190,.27) !important;
  border-radius: 28px !important;
  background:
    radial-gradient(520px 260px at 92% 5%, rgba(255,255,255,.14), transparent 64%),
    radial-gradient(420px 240px at 6% 112%, rgba(121,169,255,.16), transparent 68%),
    linear-gradient(120deg, #10243a 0%, #0e4350 56%, #117567 100%) !important;
  box-shadow: 0 28px 78px rgba(0, 8, 22, .34) !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero::before,
body.bshq-vocab-fullscreen-page .bshq-growth-hero::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border-radius: 999px;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero::before {
  width: 310px;
  height: 310px;
  right: -130px;
  bottom: -220px;
  border: 46px solid rgba(255,255,255,.055);
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero::after {
  width: 110px;
  height: 110px;
  right: 25%;
  top: -72px;
  background: rgba(99,230,190,.08);
  filter: blur(2px);
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero > * {
  position: relative;
  z-index: 1;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero-kicker {
  display: block;
  color: #b9fff0 !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: .16em !important;
  opacity: .9 !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero h2 {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px;
  margin: 14px 0 14px !important;
  color: #fff !important;
  font-size: clamp(29px, 4.1vw, 54px) !important;
  font-weight: 830 !important;
  line-height: 1.02 !important;
  letter-spacing: -.055em !important;
  text-shadow: 0 2px 20px rgba(0,0,0,.14);
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero h2 strong {
  color: #fff !important;
  font-size: 1.2em;
  font-variant-numeric: tabular-nums;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero h2 span {
  color: #effffc !important;
  font-weight: 760;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero-meta > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 999px;
  background: rgba(2, 20, 30, .16);
  color: #d7f8f1 !important;
  font-size: 12px !important;
  letter-spacing: 0 !important;
  opacity: 1 !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero-meta b {
  color: #fff !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-primary-action {
  min-width: 170px;
  min-height: 54px;
  padding-inline: 20px;
  white-space: nowrap;
}

body.bshq-vocab-fullscreen-page .bshq-growth-stats {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin: 14px 0 !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-stats article {
  position: relative;
  min-height: 132px;
  overflow: hidden;
  padding: 18px 19px !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 20px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.018), transparent), var(--bq-panel) !important;
  box-shadow: var(--bq-shadow-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-stats article::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 3px;
  opacity: .75;
  background: var(--bq-accent);
}

body.bshq-vocab-fullscreen-page .bshq-growth-stats article.is-accuracy::after { background: var(--bq-blue); }
body.bshq-vocab-fullscreen-page .bshq-growth-stats article.is-streak::after { background: var(--bq-yellow); }
body.bshq-vocab-fullscreen-page .bshq-growth-stats article.is-rank::after { background: #c18cff; }

body.bshq-vocab-fullscreen-page .bshq-growth-stat-label {
  display: flex;
  align-items: center;
  gap: 8px;
}

body.bshq-vocab-fullscreen-page .bshq-growth-stat-label i {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: rgba(99,230,190,.10);
  color: var(--bq-accent);
  font-style: normal;
}

body.bshq-vocab-fullscreen-page .bshq-growth-stats .is-accuracy .bshq-growth-stat-label i { background: rgba(121,169,255,.11); color: var(--bq-blue); }
body.bshq-vocab-fullscreen-page .bshq-growth-stats .is-streak .bshq-growth-stat-label i { background: rgba(244,199,95,.11); color: var(--bq-yellow); }
body.bshq-vocab-fullscreen-page .bshq-growth-stats .is-rank .bshq-growth-stat-label i { background: rgba(193,140,255,.11); color: #c18cff; }
body.bshq-vocab-fullscreen-page .bshq-growth-stat-label svg { width: 16px !important; height: 16px !important; }

body.bshq-vocab-fullscreen-page .bshq-growth-stat-label span {
  color: var(--bq-muted) !important;
  font-size: 11px !important;
  font-weight: 760;
  line-height: 1.25;
}

body.bshq-vocab-fullscreen-page .bshq-growth-stats strong {
  display: block;
  margin-top: 13px !important;
  color: var(--bq-text) !important;
  font-size: clamp(24px, 2.3vw, 33px) !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  letter-spacing: -.045em;
}

body.bshq-vocab-fullscreen-page .bshq-growth-stats small {
  display: block;
  margin-top: 8px;
  color: var(--bq-muted-2) !important;
  font-size: 10px;
  line-height: 1.35;
}

body.bshq-vocab-fullscreen-page .bshq-growth-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-card {
  min-height: 216px;
  padding: 24px !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 22px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.018), transparent 65%), var(--bq-panel) !important;
  box-shadow: var(--bq-shadow-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-card-head {
  align-items: flex-start !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-card-head span {
  color: var(--bq-muted) !important;
  font-size: 9px !important;
  font-weight: 900 !important;
  letter-spacing: .16em !important;
  opacity: 1 !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-card h3 {
  margin: 7px 0 0 !important;
  color: var(--bq-text) !important;
  font-size: clamp(19px, 1.8vw, 24px) !important;
  line-height: 1.15 !important;
  letter-spacing: -.03em !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-card-head > b {
  color: var(--bq-accent) !important;
  font-size: clamp(20px, 2vw, 29px) !important;
  line-height: 1;
}

body.bshq-vocab-fullscreen-page .bshq-growth-card p {
  margin: 13px 0 0 !important;
  color: var(--bq-muted) !important;
  font-size: 13px;
  line-height: 1.55;
}

body.bshq-vocab-fullscreen-page .bshq-challenge-card {
  background:
    radial-gradient(330px 160px at 100% 0%, rgba(99,230,190,.07), transparent 68%),
    var(--bq-panel) !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-progress {
  height: 9px !important;
  margin: 25px 0 8px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.07) !important;
  overflow: hidden;
}

body.bshq-vocab-fullscreen-page .bshq-growth-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #31cda2, #76edc9) !important;
  box-shadow: 0 0 18px rgba(99,230,190,.24);
}

body.bshq-vocab-fullscreen-page .bshq-latest-card > .bshq-text-btn {
  margin-top: 16px;
  padding-left: 0;
}

body.bshq-vocab-fullscreen-page .bshq-latest-card.is-empty .bshq-growth-card-head > b {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 2px solid var(--bq-accent);
  border-radius: 50%;
  font-size: 0 !important;
}

body.bshq-vocab-fullscreen-page .bshq-latest-card.is-empty .bshq-growth-card-head > b::after {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--bq-accent);
}

body.bshq-vocab-fullscreen-page .bshq-referral-card,
body.bshq-vocab-fullscreen-page .bshq-privacy-card {
  min-height: 0;
}

body.bshq-vocab-fullscreen-page .bshq-copy-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 9px !important;
  margin-top: 16px;
}

body.bshq-vocab-fullscreen-page .bshq-growth-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 15px 0;
}

body.bshq-vocab-fullscreen-page .bshq-privacy-card label {
  margin: 0 !important;
  color: var(--bq-muted) !important;
  font-size: 11px !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-card input,
body.bshq-vocab-fullscreen-page .bshq-growth-card select,
body.bshq-vocab-fullscreen-page .bshq-copy-row input {
  width: 100%;
  min-height: 45px;
  margin-top: 7px;
  padding: 10px 12px !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 12px !important;
  background: rgba(4,13,25,.70) !important;
  color: var(--bq-text) !important;
}

/* ---------- Listening library ---------- */
body.bshq-vocab-fullscreen-page .bshq-audio-screen {
  max-width: 1480px;
  margin-inline: auto;
}

body.bshq-vocab-fullscreen-page .bshq-continue-shell {
  margin-bottom: 16px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-continue-card {
  min-height: 96px;
  grid-template-columns: 58px minmax(0, 1fr) minmax(160px, 300px) auto !important;
  gap: 16px !important;
  padding: 17px 20px !important;
  border: 1px solid rgba(99,230,190,.28) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(320px 140px at 0 50%, rgba(99,230,190,.11), transparent 75%),
    linear-gradient(100deg, #0d2034, #102a38) !important;
  box-shadow: var(--bq-shadow-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-continue-play {
  width: 56px;
  height: 56px;
  border-radius: 18px;
}

body.bshq-vocab-fullscreen-page .bshq-continue-copy small {
  color: var(--bq-accent) !important;
}

body.bshq-vocab-fullscreen-page .bshq-continue-copy strong {
  color: var(--bq-text) !important;
  font-size: 18px !important;
}

body.bshq-vocab-fullscreen-page .bshq-continue-copy span {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-browser {
  margin-bottom: 16px !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-heading {
  margin-bottom: 13px !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-heading h2 {
  color: var(--bq-text) !important;
  font-size: clamp(25px, 2.5vw, 34px) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-heading p {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
  gap: 12px !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card {
  min-height: 116px;
  grid-template-columns: 76px minmax(0, 1fr) 20px !important;
  gap: 14px !important;
  padding: 14px !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.016), transparent), var(--bq-panel) !important;
  box-shadow: var(--bq-shadow-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(121,169,255,.52) !important;
  box-shadow: 0 18px 42px rgba(0,7,20,.24) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-art {
  height: 76px !important;
  border-radius: 16px !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-copy strong {
  color: var(--bq-text) !important;
  font-size: 16px !important;
  line-height: 1.25;
}

body.bshq-vocab-fullscreen-page .bshq-topic-copy small {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-copy em {
  color: var(--bq-blue) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-compact {
  min-height: 86px;
  padding: 18px 20px !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 20px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.018), transparent), var(--bq-panel) !important;
  box-shadow: var(--bq-shadow-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-compact strong {
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-reset {
  min-height: 43px;
  padding: 9px 13px !important;
  border-color: rgba(99,230,190,.25) !important;
  border-radius: 12px !important;
  color: var(--bq-accent) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-toolbar {
  position: sticky !important;
  top: -1px !important;
  z-index: 12;
  display: grid !important;
  grid-template-columns: minmax(280px, 1fr) 130px minmax(190px, .38fr) 160px !important;
  gap: 10px !important;
  margin: 16px 0 !important;
  padding: 11px !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 18px !important;
  background: rgba(8, 18, 32, .90) !important;
  box-shadow: 0 12px 35px rgba(0,7,20,.22) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

body.bshq-vocab-fullscreen-page .bshq-dd-search,
body.bshq-vocab-fullscreen-page .bshq-dd-select {
  min-height: 48px !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 13px !important;
  background: rgba(255,255,255,.035) !important;
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-search input {
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-select option {
  background: #102033 !important;
  color: #f4f8fc !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-collection-title {
  margin: 28px 0 10px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-collection-title h2 {
  color: var(--bq-text) !important;
  font-size: 22px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-section {
  margin-bottom: 12px !important;
  overflow: hidden;
  border: 1px solid var(--bq-line) !important;
  border-radius: 20px !important;
  background: rgba(14,27,45,.70) !important;
  box-shadow: var(--bq-shadow-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-section-head {
  min-height: 62px;
  padding: 15px 18px !important;
  color: var(--bq-text) !important;
  background: transparent !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-section-head > span {
  color: var(--bq-text) !important;
  font-size: 14px !important;
  font-weight: 850 !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-section-head em {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-lesson-grid {
  grid-template-columns: repeat(auto-fill, minmax(265px, 1fr)) !important;
  gap: 11px !important;
  padding: 0 12px 12px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-lesson-card {
  min-height: 190px !important;
  padding: 17px !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 17px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.018), transparent), #101d30 !important;
  box-shadow: none !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-lesson-card:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(121,169,255,.44) !important;
  box-shadow: 0 14px 32px rgba(0,7,20,.22) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-lesson-card.is-inprogress {
  border-color: rgba(99,230,190,.48) !important;
  background: linear-gradient(140deg, rgba(99,230,190,.09), transparent 56%), #112238 !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-lesson-card.is-complete {
  border-color: rgba(99,230,190,.22) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-card-title {
  color: var(--bq-text) !important;
  font-size: 15px !important;
  line-height: 1.38 !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-card-details,
body.bshq-vocab-fullscreen-page .bshq-dd-card-meta {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-card-state {
  color: var(--bq-accent) !important;
  font-weight: 800 !important;
}

/* ---------- Dictation focus workspace ---------- */
body.bshq-vocab-fullscreen-page .bshq-focus-mode .bshq-app-shell {
  grid-template-columns: 76px minmax(0, 1fr) !important;
}

body.bshq-vocab-fullscreen-page .bshq-focus-mode .bshq-main {
  padding-top: 10px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-screen {
  max-width: 1500px !important;
  margin-inline: auto;
  gap: 10px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-session-top {
  min-height: 44px !important;
  padding: 0 2px;
}

body.bshq-vocab-fullscreen-page .bshq-progress {
  height: 5px !important;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.07) !important;
}

body.bshq-vocab-fullscreen-page .bshq-progress i {
  background: linear-gradient(90deg, var(--bq-accent-2), var(--bq-accent)) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-layout {
  grid-template-columns: minmax(0, 1.48fr) minmax(310px, .52fr) !important;
  gap: 12px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-workspace,
body.bshq-vocab-fullscreen-page .bshq-dd-reference {
  border-radius: 22px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-workspace {
  min-height: calc(100vh - 112px) !important;
  padding: 18px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-title-row {
  min-height: 42px;
  margin-bottom: 10px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-title-row > strong {
  color: var(--bq-text) !important;
  font-size: 17px !important;
  line-height: 1.3;
}

body.bshq-vocab-fullscreen-page .bshq-dd-title-row > span {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-playerbar {
  min-height: 86px !important;
  grid-template-columns: 60px minmax(130px, 1fr) auto auto !important;
  gap: 14px !important;
  padding: 13px 15px !important;
  border: 1px solid rgba(99,230,190,.25) !important;
  border-radius: 18px !important;
  background: linear-gradient(105deg, rgba(99,230,190,.08), rgba(121,169,255,.035)) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-play {
  width: 56px !important;
  height: 56px !important;
  border-radius: 18px !important;
  background: linear-gradient(145deg, #68e9c0, #36cfa5) !important;
  color: #04231a !important;
  box-shadow: 0 12px 28px rgba(52,211,170,.22) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-play-label b {
  color: var(--bq-text) !important;
  font-size: 14px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-play-label small {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-shadowing-toggle,
body.bshq-vocab-fullscreen-page .bshq-dd-speed {
  min-height: 42px !important;
  border-color: var(--bq-line) !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.035) !important;
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-shadowing-toggle.active,
body.bshq-vocab-fullscreen-page .bshq-dd-speed.active {
  border-color: rgba(99,230,190,.47) !important;
  background: rgba(99,230,190,.12) !important;
  color: #dcfff3 !important;
}

body.bshq-vocab-fullscreen-page .bshq-admin-audio-tools {
  margin: 11px 0 !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 15px !important;
  background: rgba(255,255,255,.022) !important;
}

body.bshq-vocab-fullscreen-page .bshq-admin-audio-tools > summary {
  min-height: 46px;
  padding: 11px 13px !important;
  color: var(--bq-text-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-cut-tuner {
  border-top-color: var(--bq-line) !important;
}

body.bshq-vocab-fullscreen-page #bshq-audio-answer {
  min-height: 92px !important;
  max-height: 210px;
  margin-top: 12px !important;
  padding: 18px 19px !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 17px !important;
  background: #091526 !important;
  color: var(--bq-text) !important;
  font-size: clamp(18px, 1.7vw, 25px) !important;
  line-height: 1.45 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02) !important;
}

body.bshq-vocab-fullscreen-page #bshq-audio-answer:focus {
  border-color: rgba(99,230,190,.65) !important;
  box-shadow: 0 0 0 3px rgba(99,230,190,.11), 0 14px 32px rgba(0,0,0,.14) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-under-input {
  grid-template-columns: minmax(0, 1fr) 160px !important;
  gap: 10px !important;
  margin-top: 10px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-under-input .bshq-btn {
  width: 160px !important;
  min-width: 160px !important;
  min-height: 50px !important;
  font-size: 15px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-answer-options {
  margin-top: 11px;
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-shortcuts {
  color: var(--bq-muted-2) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-tabs {
  border-bottom-color: var(--bq-line) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-tabs button {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-tabs button.active {
  color: var(--bq-accent) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-reference-panel {
  max-height: calc(100vh - 126px) !important;
  scrollbar-color: rgba(155,177,202,.28) transparent;
}

body.bshq-vocab-fullscreen-page .bshq-dd-ref-block {
  border-color: var(--bq-line) !important;
  background: rgba(255,255,255,.025) !important;
}

body.bshq-vocab-fullscreen-page .bshq-audio-error {
  border-color: rgba(251,113,133,.35) !important;
  border-radius: 14px !important;
  background: rgba(190,24,93,.10) !important;
  color: #ffd1d9 !important;
}

/* ---------- Vocabulary library, add and SRS ---------- */
body.bshq-vocab-fullscreen-page .bshq-vocab-dashboard,
body.bshq-vocab-fullscreen-page .bshq-add-screen,
body.bshq-vocab-fullscreen-page .bshq-library-screen {
  max-width: 1180px;
  margin-inline: auto;
}

body.bshq-vocab-fullscreen-page .bshq-vocab-stats {
  gap: 12px !important;
}

body.bshq-vocab-fullscreen-page .bshq-vocab-stats article,
body.bshq-vocab-fullscreen-page .bshq-vocab-actions,
body.bshq-vocab-fullscreen-page .bshq-quick-add,
body.bshq-vocab-fullscreen-page .bshq-rule-banner,
body.bshq-vocab-fullscreen-page .bshq-word-row,
body.bshq-vocab-fullscreen-page .bshq-add-card {
  border-color: var(--bq-line) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.018), transparent), var(--bq-panel) !important;
  box-shadow: var(--bq-shadow-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-vocab-stats span,
body.bshq-vocab-fullscreen-page .bshq-word-meta,
body.bshq-vocab-fullscreen-page .bshq-word-meaning,
body.bshq-vocab-fullscreen-page .bshq-review-hint,
body.bshq-vocab-fullscreen-page .bshq-hotkey-hint {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-review-screen {
  max-width: 920px !important;
}

body.bshq-vocab-fullscreen-page .bshq-review-card,
body.bshq-vocab-fullscreen-page .bshq-deep-card,
body.bshq-vocab-fullscreen-page .bshq-sentence-card {
  border-radius: 24px !important;
}

body.bshq-vocab-fullscreen-page .bshq-review-term,
body.bshq-vocab-fullscreen-page .bshq-sentence-term,
body.bshq-vocab-fullscreen-page .bshq-dd-term {
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-review-screen textarea,
body.bshq-vocab-fullscreen-page .bshq-review-screen input {
  border-color: var(--bq-line) !important;
  background: #091526 !important;
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-rating-grid button,
body.bshq-vocab-fullscreen-page .bshq-meaning-grade button {
  border-color: var(--bq-line) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.035) !important;
  color: var(--bq-text-soft) !important;
}

/* ---------- Leaderboard and achievements ---------- */
body.bshq-vocab-fullscreen-page .bshq-leaderboard-controls {
  display: grid !important;
  grid-template-columns: minmax(420px, 1fr) minmax(240px, 330px) !important;
  gap: 12px !important;
  margin-bottom: 12px !important;
}

body.bshq-vocab-fullscreen-page .bshq-segmented {
  min-height: 54px;
  padding: 5px !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 16px !important;
  background: var(--bq-panel) !important;
}

body.bshq-vocab-fullscreen-page .bshq-segmented button {
  border-radius: 11px !important;
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-segmented button.active {
  background: rgba(99,230,190,.15) !important;
  color: #ddfff4 !important;
  box-shadow: inset 0 0 0 1px rgba(99,230,190,.22) !important;
}

body.bshq-vocab-fullscreen-page #bshq-leaderboard-metric {
  min-height: 54px;
  padding: 0 15px !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 16px !important;
  background: var(--bq-panel) !important;
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-leaderboard-note {
  margin-bottom: 12px !important;
  padding: 12px 15px !important;
  border: 1px solid rgba(99,230,190,.12) !important;
  border-radius: 13px !important;
  background: rgba(99,230,190,.055) !important;
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-leaderboard-list {
  gap: 9px !important;
}

body.bshq-vocab-fullscreen-page .bshq-rank-row {
  min-height: 76px;
  grid-template-columns: 58px 46px minmax(0,1fr) auto !important;
  gap: 12px !important;
  padding: 14px 18px !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 17px !important;
  background: var(--bq-panel) !important;
}

body.bshq-vocab-fullscreen-page .bshq-rank-row.is-me {
  border-color: rgba(99,230,190,.46) !important;
  background: linear-gradient(100deg, rgba(99,230,190,.10), var(--bq-panel)) !important;
}

body.bshq-vocab-fullscreen-page .bshq-rank-number,
body.bshq-vocab-fullscreen-page .bshq-rank-row small {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-rank-avatar {
  background: rgba(99,230,190,.11) !important;
  color: var(--bq-accent) !important;
}

body.bshq-vocab-fullscreen-page .bshq-rank-row em {
  color: var(--bq-accent) !important;
}

body.bshq-vocab-fullscreen-page .bshq-section-head h2 {
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-achievement-grid {
  gap: 12px !important;
}

body.bshq-vocab-fullscreen-page .bshq-achievement-item {
  min-height: 112px;
  padding: 18px !important;
  border: 1px solid var(--bq-line) !important;
  border-radius: 19px !important;
  background: var(--bq-panel) !important;
}

body.bshq-vocab-fullscreen-page .bshq-achievement-item > span {
  background: rgba(99,230,190,.10) !important;
}

body.bshq-vocab-fullscreen-page .bshq-achievement-item p,
body.bshq-vocab-fullscreen-page .bshq-achievement-item small {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-pagination button {
  border-color: var(--bq-line) !important;
  background: var(--bq-panel) !important;
  color: var(--bq-text-soft) !important;
}

/* ---------- Modals, completion, errors ---------- */
body.bshq-vocab-fullscreen-page .bshq-growth-overlay,
body.bshq-vocab-fullscreen-page .bshq-modal-wrap {
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

body.bshq-vocab-fullscreen-page .bshq-completion-modal,
body.bshq-vocab-fullscreen-page .bshq-share-modal,
body.bshq-vocab-fullscreen-page .bshq-modal {
  border: 1px solid var(--bq-line) !important;
  border-radius: 24px !important;
  background: var(--bq-panel) !important;
  color: var(--bq-text) !important;
  box-shadow: 0 32px 90px rgba(0,0,0,.46) !important;
}

body.bshq-vocab-fullscreen-page .bshq-loading-card,
body.bshq-vocab-fullscreen-page .bshq-error-card,
body.bshq-vocab-fullscreen-page .bshq-empty-state,
body.bshq-vocab-fullscreen-page .bshq-finish-card {
  border: 1px solid var(--bq-line) !important;
  border-radius: 22px !important;
  background: var(--bq-panel) !important;
  color: var(--bq-text) !important;
  box-shadow: var(--bq-shadow-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-loading-card p,
body.bshq-vocab-fullscreen-page .bshq-error-card p,
body.bshq-vocab-fullscreen-page .bshq-empty-state p,
body.bshq-vocab-fullscreen-page .bshq-finish-card p {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-toast {
  border: 1px solid var(--bq-line) !important;
  border-radius: 14px !important;
  background: #13243a !important;
  color: var(--bq-text) !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.28) !important;
}

/* ---------- Authentication ---------- */
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-vocab-root {
  background: #eef3f8 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-screen {
  min-height: 100%;
  grid-template-columns: minmax(390px, .86fr) minmax(520px, 1.14fr) !important;
  background: linear-gradient(90deg, #071321 0 42%, #eef3f8 42% 100%) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-intro {
  padding: clamp(40px, 5vw, 76px) !important;
  background:
    radial-gradient(520px 420px at 88% 18%, rgba(99,230,190,.09), transparent 66%),
    linear-gradient(160deg, rgba(99,230,190,.035), transparent 52%),
    #071321 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-intro-copy {
  max-width: 560px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-intro-copy h1 {
  color: #f8fbff !important;
  font-size: clamp(46px, 5vw, 72px) !important;
  line-height: .98 !important;
  letter-spacing: -.065em !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-intro-copy p {
  color: #a8b8ca !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-points span {
  border-color: rgba(99,230,190,.18) !important;
  background: rgba(99,230,190,.06) !important;
  color: #c7ddd7 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-form-zone {
  padding: clamp(22px, 3.6vw, 54px) !important;
  background:
    radial-gradient(520px 360px at 60% 0%, rgba(99,230,190,.08), transparent 68%),
    #eef3f8 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-card {
  width: min(100%, 540px) !important;
  gap: 19px !important;
  padding: clamp(26px, 3vw, 38px) !important;
  border: 1px solid #d9e2eb !important;
  border-radius: 26px !important;
  background: rgba(255,255,255,.96) !important;
  color: #132238 !important;
  box-shadow: 0 28px 84px rgba(15, 23, 42, .15) !important;
  transition: width .22s ease;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-card[data-mode="register"] {
  width: min(100%, 720px) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-switch {
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 5px !important;
  padding: 5px !important;
  border: 1px solid #dce5ee !important;
  border-radius: 15px !important;
  background: #edf2f6 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-switch button {
  min-height: 42px !important;
  border-radius: 11px !important;
  color: #66768a !important;
  font-size: 11px !important;
  font-weight: 850 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-switch button.active {
  background: #fff !important;
  color: #087b64 !important;
  box-shadow: 0 4px 14px rgba(15,23,42,.08), inset 0 0 0 1px #cfe2dc !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-heading h2 {
  margin: 8px 0 8px !important;
  color: #102033 !important;
  font-size: 32px !important;
  line-height: 1.05 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-heading p {
  color: #607084 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-kicker {
  color: #078169 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-field > label {
  color: #26364a !important;
  font-size: 12px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-input-wrap {
  min-height: 54px !important;
  border: 1px solid #ccd7e3 !important;
  border-radius: 14px !important;
  background: #f7f9fc !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-input-wrap:focus-within {
  border-color: #23ac89 !important;
  background: #fff !important;
  box-shadow: 0 0 0 4px rgba(35,172,137,.13) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-input-wrap input {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-input-wrap input::placeholder {
  color: #8a98aa !important;
  -webkit-text-fill-color: #8a98aa !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-field small,
body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-password-label,
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-terms,
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-remember {
  color: #637287 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-show-password,
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-link {
  color: #087b64 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-submit {
  min-height: 55px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #5de0b4, #34c99c) !important;
  color: #04251b !important;
  box-shadow: 0 14px 30px rgba(52,201,156,.20) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form.active {
  grid-template-columns: repeat(2, minmax(0,1fr));
  column-gap: 14px;
  row-gap: 16px;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-heading,
body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-terms,
body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-error,
body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-submit,
body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-honeypot {
  grid-column: 1 / -1;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-error {
  border-color: #efb4c2 !important;
  background: #fff3f6 !important;
  color: #a42846 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-success {
  border-color: #afe2d2 !important;
  background: #effaf6 !important;
  color: #176b57 !important;
}

/* ---------- Responsive ---------- */
@media (max-width: 1180px) {
  body.bshq-vocab-fullscreen-page .bshq-growth-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-toolbar {
    grid-template-columns: minmax(260px,1fr) 120px minmax(180px,.55fr) 150px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-layout {
    grid-template-columns: minmax(0, 1.3fr) minmax(290px, .7fr) !important;
  }
}

@media (max-width: 980px) {
  body.bshq-vocab-fullscreen-page .bshq-app-shell {
    grid-template-columns: 78px minmax(0, 1fr) !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-brand-name,
  body.bshq-vocab-fullscreen-page .bshq-nav-item span {
    display: none !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-grid {
    grid-template-columns: 1fr !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-toolbar {
    grid-template-columns: 1fr 1fr !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-search {
    grid-column: 1 / -1;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-layout {
    grid-template-columns: 1fr !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-reference-panel {
    max-height: 42vh !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-leaderboard-controls {
    grid-template-columns: 1fr !important;
  }
  body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-screen {
    grid-template-columns: 1fr !important;
    background: #eef3f8 !important;
  }
  body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-intro {
    display: none !important;
  }
}

@media (max-width: 760px) {
  body.bshq-vocab-fullscreen-page .bshq-app-shell,
  body.bshq-vocab-fullscreen-page .bshq-focus-mode .bshq-app-shell {
    grid-template-columns: 1fr !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-main {
    padding: 12px 12px calc(84px + env(safe-area-inset-bottom)) !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-top {
    min-height: 48px;
    margin-bottom: 12px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-top h1 {
    font-size: 26px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-hero {
    min-height: 0;
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    padding: 24px 20px !important;
    border-radius: 22px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-hero h2 {
    display: block;
    font-size: 34px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-hero h2 strong,
  body.bshq-vocab-fullscreen-page .bshq-growth-hero h2 span {
    display: inline;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-primary-action {
    width: 100%;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-stats {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 9px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-stats article {
    min-height: 120px;
    padding: 15px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-stat-label i {
    display: none;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-stats strong {
    font-size: 25px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-card {
    min-height: 0;
    padding: 19px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-form-grid {
    grid-template-columns: 1fr;
  }
  body.bshq-vocab-fullscreen-page .bshq-copy-row {
    grid-template-columns: 1fr;
  }
  body.bshq-vocab-fullscreen-page .bshq-topic-grid {
    grid-template-columns: 1fr !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-topic-card {
    min-height: 102px;
    grid-template-columns: 64px minmax(0,1fr) 18px !important;
    padding: 12px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-topic-art {
    height: 64px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-continue-card {
    grid-template-columns: 48px minmax(0,1fr) !important;
    padding: 14px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-continue-play {
    width: 48px;
    height: 48px;
    border-radius: 15px;
  }
  body.bshq-vocab-fullscreen-page .bshq-continue-meter,
  body.bshq-vocab-fullscreen-page .bshq-dd-continue-card > .bshq-dd-card-state {
    display: none !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-toolbar {
    position: static !important;
    grid-template-columns: 1fr 1fr !important;
    padding: 9px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-search {
    grid-column: 1 / -1;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-lesson-grid {
    grid-template-columns: 1fr !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-workspace {
    min-height: 0 !important;
    padding: 13px !important;
    border-radius: 18px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-playerbar {
    grid-template-columns: 52px minmax(0,1fr) !important;
    gap: 11px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-shadowing-toggle,
  body.bshq-vocab-fullscreen-page .bshq-dd-speeds {
    grid-column: 1 / -1;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-speeds {
    display: grid;
    grid-template-columns: repeat(3,1fr);
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-under-input {
    grid-template-columns: 1fr !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-under-input .bshq-btn {
    width: 100% !important;
    min-width: 0 !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-rank-row {
    grid-template-columns: 38px 40px minmax(0,1fr) !important;
    padding: 12px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-rank-row em {
    grid-column: 3;
  }
  body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-form-zone {
    min-height: 100dvh;
    padding: 16px !important;
    align-items: flex-start;
  }
  body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-card,
  body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-card[data-mode="register"] {
    width: 100% !important;
    margin: 14px auto;
    padding: 22px 17px !important;
    border-radius: 21px !important;
  }
  body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form.active {
    grid-template-columns: 1fr;
  }
  body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form > * {
    grid-column: 1 !important;
  }
  body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-switch button {
    font-size: 10px !important;
  }
}

@media (max-width: 420px) {
  body.bshq-vocab-fullscreen-page .bshq-growth-stats {
    grid-template-columns: 1fr 1fr !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-stats small {
    display: none;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-stats article {
    min-height: 98px;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-toolbar {
    grid-template-columns: 1fr !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-dd-search {
    grid-column: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.bshq-vocab-fullscreen-page .bshq-vocab-root *,
  body.bshq-vocab-fullscreen-page .bshq-vocab-root *::before,
  body.bshq-vocab-fullscreen-page .bshq-vocab-root *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* Final cascade corrections against older compact/light-theme rules. */
body.bshq-vocab-fullscreen-page .bshq-growth-hero h2 > span {
  color: #effffc !important;
  font-size: 1em !important;
  font-weight: 760 !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  opacity: 1 !important;
}
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-switch {
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
}
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-switch:has([data-auth-mode="register"]) {
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
}


/* ---------- v10.7.1: beta bug reporting ---------- */
.bshq-report-trigger {
  position: fixed;
  z-index: 100020;
  right: 18px;
  bottom: 18px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 9px 14px;
  border: 1px solid rgba(99, 230, 190, .28);
  border-radius: 999px;
  background: rgba(11, 28, 44, .94);
  color: #dffcf2;
  box-shadow: 0 16px 40px rgba(0, 7, 20, .32), inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  font: 800 12px/1 Inter, ui-sans-serif, system-ui, sans-serif;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}
.bshq-report-trigger:hover {
  transform: translateY(-2px);
  border-color: rgba(99,230,190,.55);
  background: rgba(14, 45, 55, .98);
}
.bshq-report-trigger svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
body.bshq-auth-open .bshq-report-trigger {
  color: #0b5e4d;
  background: rgba(255,255,255,.95);
  border-color: rgba(10,91,73,.16);
  box-shadow: 0 16px 38px rgba(12, 31, 49, .16);
}
body.bshq-report-open { overflow: hidden !important; }
.bshq-report-modal {
  position: fixed;
  inset: 0;
  z-index: 100100;
  display: grid;
  place-items: center;
  padding: 18px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.bshq-report-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 8, 18, .76);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.bshq-report-dialog {
  position: relative;
  width: min(680px, 100%);
  max-height: min(860px, calc(100vh - 36px));
  overflow: auto;
  border: 1px solid rgba(155,177,202,.20);
  border-radius: 24px;
  background: linear-gradient(180deg, #122238, #0c1929);
  color: #f7fafc;
  box-shadow: 0 34px 100px rgba(0, 5, 15, .58), inset 0 1px 0 rgba(255,255,255,.04);
  animation: bshq-report-in .18s ease-out both;
}
@keyframes bshq-report-in { from { opacity: 0; transform: translateY(12px) scale(.985); } to { opacity: 1; transform: none; } }
.bshq-report-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 24px 26px 20px;
  border-bottom: 1px solid rgba(155,177,202,.14);
}
.bshq-report-head h2 { margin: 4px 0 6px; color: #f7fafc; font-size: clamp(23px, 3vw, 30px); line-height: 1.1; letter-spacing: -.035em; }
.bshq-report-head p { margin: 0; color: #9dafc2; font-size: 14px; }
.bshq-report-kicker { color: #63e6be; font-size: 10px; font-weight: 900; letter-spacing: .16em; }
.bshq-report-close {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(155,177,202,.17);
  border-radius: 12px;
  background: rgba(255,255,255,.035);
  color: #d8e5ef;
  cursor: pointer;
}
.bshq-report-close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.bshq-report-form { display: grid; gap: 16px; padding: 22px 26px 26px; }
.bshq-report-field { display: grid; gap: 7px; color: #dce6f1; font-size: 13px; font-weight: 760; }
.bshq-report-field b { color: #fb7185; }
.bshq-report-field input,
.bshq-report-field textarea,
.bshq-report-field select {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid rgba(155,177,202,.19);
  border-radius: 13px;
  background: rgba(4, 14, 27, .72);
  color: #f7fafc;
  padding: 12px 13px;
  font: 500 15px/1.5 Inter, ui-sans-serif, system-ui, sans-serif;
  outline: none;
}
.bshq-report-field textarea { resize: vertical; min-height: 90px; }
.bshq-report-field input:focus,
.bshq-report-field textarea:focus,
.bshq-report-field select:focus { border-color: rgba(99,230,190,.62); box-shadow: 0 0 0 3px rgba(99,230,190,.12); }
.bshq-report-upload {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px 12px;
  padding: 13px 14px;
  border: 1px dashed rgba(99,230,190,.30);
  border-radius: 14px;
  background: rgba(99,230,190,.045);
  color: #cfeee4;
  cursor: pointer;
}
.bshq-report-upload input { position: absolute; inline-size: 1px; block-size: 1px; opacity: 0; pointer-events: none; }
.bshq-report-upload > span { display: inline-flex; align-items: center; gap: 7px; font-weight: 820; }
.bshq-report-upload svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }
.bshq-report-upload small { color: #8398ad; }
.bshq-report-preview { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 12px; background: rgba(255,255,255,.035); color: #aebed0; font-size: 12px; }
.bshq-report-preview img { width: 92px; height: 64px; object-fit: cover; border-radius: 9px; border: 1px solid rgba(155,177,202,.18); }
.bshq-report-consent { display: flex; align-items: flex-start; gap: 10px; color: #9dafc2; font-size: 12px; line-height: 1.55; cursor: pointer; }
.bshq-report-consent input { margin-top: 2px; accent-color: #34d3aa; }
.bshq-report-detected { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; padding: 12px 14px; border: 1px solid rgba(244,199,95,.22); border-radius: 13px; background: rgba(244,199,95,.06); }
.bshq-report-detected strong { grid-column: 1 / -1; color: #f5d67f; font-size: 12px; }
.bshq-report-detected span { color: #d9e3ed; font-size: 13px; }
.bshq-report-detected code { align-self: start; color: #f4c75f; font-size: 11px; }
.bshq-report-error { padding: 11px 13px; border: 1px solid rgba(251,113,133,.35); border-radius: 12px; background: rgba(251,113,133,.09); color: #ffc4ce; font-size: 13px; }
.bshq-report-actions { display: flex; justify-content: flex-end; gap: 10px; padding-top: 3px; }
.bshq-report-cancel,
.bshq-report-send {
  min-height: 44px;
  padding: 10px 16px;
  border-radius: 13px;
  font: 820 13px/1 Inter, ui-sans-serif, system-ui, sans-serif;
  cursor: pointer;
}
.bshq-report-cancel { border: 1px solid rgba(155,177,202,.18); background: rgba(255,255,255,.035); color: #cbd8e4; }
.bshq-report-send { display: inline-flex; align-items: center; gap: 8px; border: 0; background: linear-gradient(135deg, #72edc7, #37d0a6); color: #04261c; box-shadow: 0 13px 28px rgba(52,211,170,.18); }
.bshq-report-send svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }
.bshq-report-send:disabled { opacity: .58; cursor: wait; }
.bshq-report-honeypot { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; }
.bshq-toast { display: flex !important; align-items: center; gap: 12px; max-width: min(520px, calc(100vw - 28px)); }
.bshq-toast-text { flex: 1 1 auto; min-width: 0; }
.bshq-toast-report { flex: 0 0 auto; border: 1px solid currentColor; border-radius: 999px; background: transparent; color: inherit; padding: 7px 10px; font: 800 11px/1 Inter, ui-sans-serif, system-ui, sans-serif; cursor: pointer; }
@media (max-width: 820px) {
  .bshq-report-trigger { right: 12px; bottom: 82px; min-width: 42px; justify-content: center; padding: 10px; }
  .bshq-report-trigger span { display: none; }
  body.bshq-auth-open .bshq-report-trigger { bottom: 14px; }
  .bshq-report-modal { padding: 0; place-items: end center; }
  .bshq-report-dialog { width: 100%; max-height: 92vh; border-radius: 24px 24px 0 0; }
  .bshq-report-head { padding: 20px 18px 16px; }
  .bshq-report-form { padding: 18px; }
  .bshq-report-actions { position: sticky; bottom: -18px; margin: 2px -18px -18px; padding: 14px 18px calc(14px + env(safe-area-inset-bottom)); background: rgba(12,25,41,.96); border-top: 1px solid rgba(155,177,202,.13); }
  .bshq-report-cancel, .bshq-report-send { flex: 1; justify-content: center; }
  .bshq-report-detected { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .bshq-report-dialog { animation: none; } }


/* ---------- v10.7.2: visible, accessible checkboxes ---------- */
/* style.css intentionally resets native controls; restore checkbox/radio
   rendering so terms, bug-report consent and learning preferences stay usable. */
body.bshq-vocab-fullscreen-page .bshq-vocab-root input[type="checkbox"],
body.bshq-vocab-fullscreen-page .bshq-vocab-root input[type="radio"] {
  appearance: auto !important;
  -webkit-appearance: auto !important;
  inline-size: 18px !important;
  block-size: 18px !important;
  min-inline-size: 18px !important;
  min-block-size: 18px !important;
  flex: 0 0 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  accent-color: #20ad88;
  box-shadow: none !important;
  cursor: pointer;
}

/* Keep the bespoke "remember me" control visually hidden; its adjacent span
   is the rendered checkbox. */
body.bshq-vocab-fullscreen-page .bshq-auth-remember input[type="checkbox"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  min-inline-size: 1px !important;
  min-block-size: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-terms {
  display: flex !important;
  align-items: flex-start !important;
  gap: 11px !important;
  min-height: 48px;
  margin: 2px 0 0 !important;
  padding: 12px 14px !important;
  border: 1px solid #d8e1eb;
  border-radius: 12px;
  background: #f8fafc;
  color: #475467 !important;
  line-height: 1.45;
  cursor: pointer;
  user-select: none;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-terms:hover {
  border-color: #8fd7c2;
  background: #f2fbf8;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-terms:focus-within {
  border-color: #20ad88;
  box-shadow: 0 0 0 4px rgba(32,173,136,.13);
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-terms input[type="checkbox"] {
  margin-top: 1px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-terms span {
  display: block;
  min-width: 0;
}

/* ---------- v10.7.3: compact registration ---------- */
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-card[data-mode="register"] {
  width: min(100%, 760px) !important;
  gap: 12px !important;
  padding: 24px 26px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-card[data-mode="register"] .bshq-auth-switch {
  margin-bottom: 0 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form.active {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  column-gap: 12px !important;
  row-gap: 10px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-heading,
body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-field--email,
body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-error,
body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-submit,
body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-legal,
body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-honeypot {
  grid-column: 1 / -1 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-heading {
  margin: 0 0 2px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-heading h2 {
  margin: 4px 0 3px !important;
  font-size: 27px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-heading p {
  font-size: 12px !important;
  line-height: 1.4 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-field {
  gap: 5px !important;
  align-content: start;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-field > label {
  font-size: 11px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-input-wrap {
  min-height: 48px !important;
  border-radius: 12px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-input-wrap input {
  height: 46px !important;
  padding-inline: 13px !important;
  font-size: 15px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-password input {
  padding-right: 58px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-show-password {
  min-height: 34px !important;
  min-width: 46px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-field small,
body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form #bshq-password-label {
  min-height: 14px;
  font-size: 10px !important;
  line-height: 1.3 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-password-meter {
  margin-top: 1px !important;
  height: 3px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-submit {
  min-height: 50px !important;
  margin-top: 1px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-legal {
  margin: -2px 0 0 !important;
  color: #758397 !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
  text-align: center;
}

@media (max-width: 760px) {
  body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-card[data-mode="register"] {
    padding: 18px 16px !important;
    gap: 10px !important;
  }

  body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form.active {
    grid-template-columns: 1fr !important;
    row-gap: 9px !important;
  }

  body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form > * {
    grid-column: 1 !important;
  }

  body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-register-form .bshq-auth-heading h2 {
    font-size: 25px !important;
  }
}

/* =========================================================
   v10.7.4 — Account menu, logout and referral QR
   ========================================================= */
body.bshq-vocab-fullscreen-page .bshq-side {
  display: flex !important;
  flex-direction: column !important;
}

body.bshq-vocab-fullscreen-page .bshq-side-footer {
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid rgba(155,177,202,.10);
}

body.bshq-vocab-fullscreen-page .bshq-logout-nav {
  display: flex !important;
  text-decoration: none !important;
}

body.bshq-vocab-fullscreen-page .bshq-logout-nav:hover {
  border-color: rgba(251,113,133,.24) !important;
  background: rgba(251,113,133,.07) !important;
  color: #fecdd3 !important;
}

body.bshq-vocab-fullscreen-page .bshq-top-title {
  min-width: 0;
}

body.bshq-vocab-fullscreen-page .bshq-top-actions {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

/* v10.8.0 — Toàn bộ CSS Account/Profile đã chuyển sang assets/css/style.css
   (không scope theo body.bshq-vocab-fullscreen-page) để menu tài khoản luôn có
   style kể cả khi page builder khiến has_shortcode() không nhận diện được trang.
   Chỉ giữ lại rule dùng chung cho khối referral bên dưới. */
body.bshq-vocab-fullscreen-page .bshq-share-referral-link svg,
body.bshq-vocab-fullscreen-page .bshq-referral-modal .bshq-btn svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Referral card */
body.bshq-vocab-fullscreen-page .bshq-referral-card-body {
  display: grid;
  grid-template-columns: 116px minmax(0,1fr);
  gap: 16px;
  align-items: center;
  margin-top: 12px;
}

body.bshq-vocab-fullscreen-page .bshq-referral-qr-button {
  min-height: 132px;
  display: grid;
  place-items: center;
  gap: 7px;
  padding: 10px;
  border: 1px solid rgba(99,230,190,.20);
  border-radius: 17px;
  background: rgba(255,255,255,.035);
  color: var(--bq-accent);
  cursor: pointer;
}

body.bshq-vocab-fullscreen-page .bshq-referral-qr-button:hover {
  border-color: rgba(99,230,190,.44);
  background: rgba(99,230,190,.07);
  transform: translateY(-2px);
}

body.bshq-vocab-fullscreen-page .bshq-referral-qr-button img {
  width: 92px;
  height: 92px;
  padding: 5px;
  border-radius: 10px;
  background: #fff;
  object-fit: contain;
}

body.bshq-vocab-fullscreen-page .bshq-referral-qr-button span {
  font-size: 10px;
  font-weight: 850;
}

body.bshq-vocab-fullscreen-page .bshq-referral-card-copy {
  min-width: 0;
}

body.bshq-vocab-fullscreen-page .bshq-referral-card-copy > p {
  margin: 0 !important;
}

body.bshq-vocab-fullscreen-page .bshq-share-referral-link {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 8px;
  padding: 4px 0 !important;
}

/* Referral QR modal */
body.bshq-vocab-fullscreen-page .bshq-referral-modal {
  width: min(540px, 100%) !important;
  padding: 26px !important;
  text-align: center;
}

body.bshq-vocab-fullscreen-page .bshq-referral-modal-head > span {
  color: var(--bq-accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .17em;
}

body.bshq-vocab-fullscreen-page .bshq-referral-modal-head h2 {
  margin: 6px 0 5px !important;
  font-size: 27px !important;
  letter-spacing: -.035em;
}

body.bshq-vocab-fullscreen-page .bshq-referral-modal-head p {
  max-width: 420px;
  margin: 0 auto 17px;
  color: var(--bq-muted);
  font-size: 12px;
  line-height: 1.55;
}

body.bshq-vocab-fullscreen-page .bshq-referral-qr-shell {
  width: min(310px, 100%);
  margin: 0 auto;
  padding: 18px;
  border: 1px solid rgba(155,177,202,.14);
  border-radius: 22px;
  background: linear-gradient(180deg,#ffffff,#edf6f5);
  box-shadow: 0 18px 48px rgba(0,0,0,.20);
}

body.bshq-vocab-fullscreen-page .bshq-referral-qr {
  width: min(260px, 100%);
  height: auto;
  display: block;
  margin: 0 auto;
  border-radius: 10px;
  background: #fff;
}

body.bshq-vocab-fullscreen-page .bshq-referral-qr-fallback {
  min-height: 220px;
  display: grid;
  place-items: center;
  color: #536477;
  font-size: 12px;
}

body.bshq-vocab-fullscreen-page .bshq-referral-qr-fallback[hidden] {
  display: none !important;
}

body.bshq-vocab-fullscreen-page .bshq-referral-code {
  margin-top: 10px;
}

body.bshq-vocab-fullscreen-page .bshq-referral-code span,
body.bshq-vocab-fullscreen-page .bshq-referral-code strong {
  display: block;
}

body.bshq-vocab-fullscreen-page .bshq-referral-code span {
  color: #718196;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .16em;
}

body.bshq-vocab-fullscreen-page .bshq-referral-code strong {
  margin-top: 3px;
  color: #0b253a !important;
  font-size: 18px;
  letter-spacing: .10em;
}

body.bshq-vocab-fullscreen-page .bshq-referral-link-preview {
  overflow: hidden;
  margin: 14px auto 12px;
  padding: 10px 12px;
  border: 1px solid var(--bq-line);
  border-radius: 12px;
  background: rgba(4,13,25,.55);
  color: var(--bq-muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.bshq-vocab-fullscreen-page .bshq-referral-modal .bshq-share-actions {
  display: grid !important;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 8px !important;
}

body.bshq-vocab-fullscreen-page .bshq-referral-modal .bshq-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
}

@media (max-width: 820px) {
  body.bshq-vocab-fullscreen-page .bshq-side-footer {
    display: none;
  }

  body.bshq-vocab-fullscreen-page .bshq-referral-card-body {
    grid-template-columns: 98px minmax(0,1fr);
    gap: 11px;
  }

  body.bshq-vocab-fullscreen-page .bshq-referral-qr-button {
    min-height: 116px;
    padding: 8px;
  }

  body.bshq-vocab-fullscreen-page .bshq-referral-qr-button img {
    width: 78px;
    height: 78px;
  }
}

@media (max-width: 580px) {
  body.bshq-vocab-fullscreen-page .bshq-top {
    align-items: flex-start !important;
  }

  body.bshq-vocab-fullscreen-page .bshq-referral-card-body {
    grid-template-columns: 1fr;
  }

  body.bshq-vocab-fullscreen-page .bshq-referral-qr-button {
    min-height: 96px;
    grid-template-columns: 76px minmax(0,1fr);
    justify-content: start;
    text-align: left;
  }

  body.bshq-vocab-fullscreen-page .bshq-referral-qr-button img {
    width: 72px;
    height: 72px;
  }

  body.bshq-vocab-fullscreen-page .bshq-referral-modal {
    padding: 22px 15px !important;
  }

  body.bshq-vocab-fullscreen-page .bshq-referral-modal .bshq-share-actions {
    grid-template-columns: 1fr !important;
  }
}

/* ======================================================================
 * v10.12.1 — Compact visual listening catalog
 * Flat lesson grid, no technical Section/Lesson labels, compact topic cards.
 * Presentation only: no R2, REST, progress or learning logic changes.
 * ====================================================================== */
body.bshq-vocab-fullscreen-page .bshq-route-audio .bshq-top {
  min-height: 52px;
  margin-bottom: 10px !important;
}

body.bshq-vocab-fullscreen-page .bshq-route-audio .bshq-top h1 {
  color: #f7fbff !important;
  font-size: clamp(25px, 2.2vw, 34px) !important;
  letter-spacing: -.045em;
}

body.bshq-vocab-fullscreen-page .bshq-library-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 0 0 14px;
  padding: 16px 18px;
  border: 1px solid rgba(123,164,219,.18);
  border-radius: 18px;
  background:
    radial-gradient(260px 140px at 100% 0%, rgba(99,230,190,.10), transparent 70%),
    linear-gradient(135deg, rgba(18,35,57,.96), rgba(10,24,41,.96));
  box-shadow: 0 14px 34px rgba(0,7,20,.16);
}

body.bshq-vocab-fullscreen-page .bshq-library-heading-copy {
  min-width: 0;
}

body.bshq-vocab-fullscreen-page .bshq-library-heading-copy > span {
  display: block;
  margin-bottom: 3px;
  color: var(--bq-accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
}

body.bshq-vocab-fullscreen-page .bshq-library-heading h2 {
  margin: 0 !important;
  color: #f8fbff !important;
  font-size: clamp(24px, 2.4vw, 34px) !important;
  font-weight: 900 !important;
  line-height: 1.05;
  letter-spacing: -.045em;
}

body.bshq-vocab-fullscreen-page .bshq-library-heading p {
  margin: 5px 0 0;
  color: #93a8bf;
  font-size: 12px;
}

body.bshq-vocab-fullscreen-page .bshq-library-count-chip {
  min-width: 78px;
  padding: 10px 13px;
  border: 1px solid rgba(99,230,190,.22);
  border-radius: 14px;
  background: rgba(5,18,31,.58);
  text-align: center;
}

body.bshq-vocab-fullscreen-page .bshq-library-count-chip strong {
  display: block;
  color: #fff !important;
  font-size: 22px;
  line-height: 1;
}

body.bshq-vocab-fullscreen-page .bshq-library-count-chip span {
  display: block;
  margin-top: 4px;
  color: var(--bq-accent);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.bshq-vocab-fullscreen-page .bshq-topic-reset {
  flex: 0 0 auto;
  min-height: 42px;
  padding: 0 15px;
  border: 1px solid rgba(99,230,190,.28);
  border-radius: 13px;
  background: rgba(99,230,190,.07);
  color: #cffff0;
  font-size: 11px;
  font-weight: 850;
  cursor: pointer;
}

body.bshq-vocab-fullscreen-page .bshq-topic-browser {
  margin: 0 0 14px;
}

body.bshq-vocab-fullscreen-page .bshq-topic-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 12px !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card {
  position: relative;
  min-height: 104px !important;
  display: grid !important;
  grid-template-columns: 66px minmax(0,1fr) 28px !important;
  align-items: center;
  gap: 12px !important;
  overflow: hidden;
  padding: 12px !important;
  border: 1px solid rgba(123,164,219,.18) !important;
  border-radius: 18px !important;
  background: linear-gradient(145deg, #11233a, #0d1c30) !important;
  color: #eaf3fc !important;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 12px 28px rgba(0,7,20,.15) !important;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(99,230,190,.42) !important;
  box-shadow: 0 18px 36px rgba(0,7,20,.25) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card::after {
  content: "";
  position: absolute;
  width: 100px;
  height: 100px;
  right: -52px;
  top: -55px;
  border: 18px solid rgba(255,255,255,.025);
  border-radius: 999px;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card-art {
  position: relative;
  width: 66px;
  height: 76px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 15px;
  color: #fff;
  background: linear-gradient(145deg, #7b61ff, #5538c9);
  box-shadow: 0 10px 24px rgba(0,0,0,.23);
}

body.bshq-vocab-fullscreen-page .bshq-topic-card.tone-stories .bshq-topic-card-art { background: linear-gradient(145deg, #ffb11b, #e86d00); }
body.bshq-vocab-fullscreen-page .bshq-topic-card.tone-ielts .bshq-topic-card-art { background: linear-gradient(145deg, #ffdc45, #ffb617); color: #241707; }
body.bshq-vocab-fullscreen-page .bshq-topic-card.tone-focus .bshq-topic-card-art { background: linear-gradient(145deg, #45dfb7, #0e8b72); }
body.bshq-vocab-fullscreen-page .bshq-topic-card.tone-conversation .bshq-topic-card-art { background: linear-gradient(145deg, #63bdff, #3e6fe9); }

body.bshq-vocab-fullscreen-page .bshq-topic-card-art i {
  position: relative;
  z-index: 2;
  font-size: 30px;
  font-style: normal;
  line-height: 1;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card-art b {
  position: absolute;
  right: 7px;
  bottom: 5px;
  color: currentColor;
  font-size: 9px;
  opacity: .72;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card-copy small {
  color: var(--bq-blue);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .07em;
  text-transform: uppercase;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card-copy strong {
  overflow: hidden;
  color: #f5f9fd !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  line-height: 1.18;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card-copy em {
  color: #8fa4bb;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card-arrow {
  position: relative;
  z-index: 2;
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 1px solid rgba(123,164,219,.18);
  border-radius: 9px;
  color: var(--bq-accent);
  background: rgba(255,255,255,.025);
}

body.bshq-vocab-fullscreen-page .bshq-library-filter-strip {
  position: sticky;
  top: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: minmax(260px,1fr) 118px minmax(160px,.55fr) 142px auto;
  gap: 9px;
  margin: 0 0 14px;
  padding: 10px;
  border: 1px solid rgba(123,164,219,.18);
  border-radius: 17px;
  background: rgba(12,26,44,.94);
  box-shadow: 0 12px 30px rgba(0,7,20,.20);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

body.bshq-vocab-fullscreen-page .bshq-library-filter-strip .bshq-dd-search,
body.bshq-vocab-fullscreen-page .bshq-library-filter-strip .bshq-dd-select {
  min-height: 44px !important;
  margin: 0 !important;
  border: 1px solid rgba(155,177,202,.16) !important;
  border-radius: 12px !important;
  background: rgba(5,16,29,.72) !important;
  color: #dce8f4 !important;
}

body.bshq-vocab-fullscreen-page .bshq-library-filter-strip .bshq-dd-search:focus-within,
body.bshq-vocab-fullscreen-page .bshq-library-filter-strip .bshq-dd-select:focus {
  border-color: rgba(99,230,190,.55) !important;
  box-shadow: 0 0 0 3px rgba(99,230,190,.09) !important;
}

body.bshq-vocab-fullscreen-page .bshq-active-filter-count {
  align-self: center;
  justify-self: center;
  min-width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--bq-accent);
  color: #03261d;
  font-size: 10px;
  font-weight: 900;
}

body.bshq-vocab-fullscreen-page .bshq-catalog-shell {
  margin-top: 4px;
}

body.bshq-vocab-fullscreen-page .bshq-catalog-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
  margin: 0 2px 10px;
}

body.bshq-vocab-fullscreen-page .bshq-catalog-head > div {
  display: flex;
  align-items: baseline;
  gap: 9px;
  min-width: 0;
}

body.bshq-vocab-fullscreen-page .bshq-catalog-head strong {
  overflow: hidden;
  color: #eef6fd !important;
  font-size: 17px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.bshq-vocab-fullscreen-page .bshq-catalog-head span,
body.bshq-vocab-fullscreen-page .bshq-catalog-head small {
  color: #8298af;
  font-size: 10px;
}

body.bshq-vocab-fullscreen-page .bshq-lesson-catalog-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 14px;
}

body.bshq-vocab-fullscreen-page .bshq-dd-lesson-card {
  position: relative;
  min-width: 0;
  min-height: 286px !important;
  display: flex !important;
  flex-direction: column;
  overflow: hidden;
  gap: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(123,164,219,.18) !important;
  border-radius: 18px !important;
  background: #101d30 !important;
  box-shadow: 0 13px 30px rgba(0,7,20,.17) !important;
  cursor: pointer;
  isolation: isolate;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-lesson-card:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(104,167,255,.55) !important;
  box-shadow: 0 21px 42px rgba(0,7,20,.29) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-lesson-card.is-inprogress {
  border-color: rgba(99,230,190,.72) !important;
  box-shadow: 0 16px 36px rgba(25,174,135,.13), 0 0 0 1px rgba(99,230,190,.11) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-lesson-card.is-complete {
  border-color: rgba(99,230,190,.27) !important;
}

body.bshq-vocab-fullscreen-page .bshq-lesson-cover {
  position: relative;
  height: 142px;
  flex: 0 0 142px;
  overflow: hidden;
  background:
    radial-gradient(150px 110px at 80% 15%, rgba(255,255,255,.18), transparent 62%),
    linear-gradient(140deg, #7359ed, #4934b1);
  color: #fff;
}

body.bshq-vocab-fullscreen-page .tone-stories .bshq-lesson-cover { background: radial-gradient(150px 110px at 80% 15%, rgba(255,255,255,.18), transparent 62%), linear-gradient(140deg, #ffb11b, #e56c00); }
body.bshq-vocab-fullscreen-page .tone-ielts .bshq-lesson-cover { background: radial-gradient(150px 110px at 80% 15%, rgba(255,255,255,.25), transparent 62%), linear-gradient(140deg, #ffdc43, #ffb515); color: #1d1306; }
body.bshq-vocab-fullscreen-page .tone-focus .bshq-lesson-cover { background: radial-gradient(150px 110px at 80% 15%, rgba(255,255,255,.16), transparent 62%), linear-gradient(140deg, #42dcb2, #0d8c72); color: #04271f; }
body.bshq-vocab-fullscreen-page .tone-conversation .bshq-lesson-cover { background: radial-gradient(150px 110px at 80% 15%, rgba(255,255,255,.18), transparent 62%), linear-gradient(140deg, #60bbff, #3e70e8); }

body.bshq-vocab-fullscreen-page .bshq-lesson-cover::before,
body.bshq-vocab-fullscreen-page .bshq-lesson-cover::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(255,255,255,.20);
  border-radius: 999px;
}

body.bshq-vocab-fullscreen-page .bshq-lesson-cover::before { width: 145px; height: 145px; right: -66px; top: -78px; }
body.bshq-vocab-fullscreen-page .bshq-lesson-cover::after { width: 82px; height: 82px; left: -38px; bottom: -48px; }

body.bshq-vocab-fullscreen-page .bshq-cover-listens,
body.bshq-vocab-fullscreen-page .bshq-cover-level,
body.bshq-vocab-fullscreen-page .bshq-cover-audio,
body.bshq-vocab-fullscreen-page .bshq-cover-duration {
  position: absolute;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 25px;
  padding: 4px 7px;
  border-radius: 8px;
  background: rgba(255,255,255,.86);
  color: #182238;
  font-size: 9px;
  font-weight: 850;
  box-shadow: 0 5px 14px rgba(0,0,0,.10);
}

body.bshq-vocab-fullscreen-page .tone-stories .bshq-cover-listens,
body.bshq-vocab-fullscreen-page .tone-stories .bshq-cover-audio,
body.bshq-vocab-fullscreen-page .tone-stories .bshq-cover-duration,
body.bshq-vocab-fullscreen-page .tone-conversation .bshq-cover-listens,
body.bshq-vocab-fullscreen-page .tone-conversation .bshq-cover-audio,
body.bshq-vocab-fullscreen-page .tone-conversation .bshq-cover-duration {
  background: rgba(255,255,255,.20);
  color: #fff;
  backdrop-filter: blur(8px);
}

body.bshq-vocab-fullscreen-page .bshq-cover-listens { left: 10px; top: 10px; }
body.bshq-vocab-fullscreen-page .bshq-cover-level {
  right: 0;
  top: 0;
  min-width: 43px;
  min-height: 35px;
  justify-content: center;
  border-radius: 0 17px 0 13px;
  background: rgba(239,244,255,.94);
  color: #3342a8;
  font-size: 12px;
  font-weight: 950;
}
body.bshq-vocab-fullscreen-page .bshq-cover-audio { left: 10px; bottom: 9px; }
body.bshq-vocab-fullscreen-page .bshq-cover-duration { right: 10px; bottom: 9px; }

body.bshq-vocab-fullscreen-page .bshq-cover-listens svg,
body.bshq-vocab-fullscreen-page .bshq-cover-audio svg,
body.bshq-vocab-fullscreen-page .bshq-cover-duration svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
}

body.bshq-vocab-fullscreen-page .bshq-cover-glyph {
  position: absolute;
  left: 50%;
  top: 48%;
  z-index: 2;
  transform: translate(-50%,-50%);
  color: currentColor;
  font-size: 58px;
  font-weight: 900;
  line-height: 1;
  opacity: .88;
  text-shadow: 0 8px 22px rgba(0,0,0,.10);
}

body.bshq-vocab-fullscreen-page .art-ielts .bshq-cover-glyph { font-size: 49px; letter-spacing: -10px; }

body.bshq-vocab-fullscreen-page .bshq-cover-eq {
  position: absolute;
  left: 50%;
  top: 51%;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 6px;
  transform: translate(-50%,-50%);
  opacity: .18;
}

body.bshq-vocab-fullscreen-page .bshq-cover-eq i {
  width: 7px;
  border-radius: 99px;
  background: currentColor;
}
body.bshq-vocab-fullscreen-page .bshq-cover-eq i:nth-child(1) { height: 28px; }
body.bshq-vocab-fullscreen-page .bshq-cover-eq i:nth-child(2) { height: 52px; }
body.bshq-vocab-fullscreen-page .bshq-cover-eq i:nth-child(3) { height: 76px; }
body.bshq-vocab-fullscreen-page .bshq-cover-eq i:nth-child(4) { height: 58px; }
body.bshq-vocab-fullscreen-page .bshq-cover-eq i:nth-child(5) { height: 38px; }
body.bshq-vocab-fullscreen-page .bshq-cover-eq i:nth-child(6) { height: 22px; }

body.bshq-vocab-fullscreen-page .bshq-lesson-card-body {
  min-height: 142px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 13px 14px 11px;
  background: linear-gradient(180deg, rgba(255,255,255,.018), transparent 50%), #101d30;
}

body.bshq-vocab-fullscreen-page .bshq-card-title-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) 27px;
  gap: 7px;
  align-items: start;
}

body.bshq-vocab-fullscreen-page .bshq-dd-card-title {
  min-height: 39px !important;
  display: -webkit-box;
  overflow: hidden;
  color: #f5f9fd !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  line-height: 1.3 !important;
  letter-spacing: -.015em;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

body.bshq-vocab-fullscreen-page .bshq-dd-fav {
  width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(155,177,202,.14);
  border-radius: 8px;
  background: rgba(255,255,255,.025);
  color: #74889d;
  font-size: 14px;
  cursor: pointer;
}
body.bshq-vocab-fullscreen-page .bshq-dd-fav.on { color: #ffd05a; border-color: rgba(255,208,90,.28); background: rgba(255,208,90,.07); }

body.bshq-vocab-fullscreen-page .bshq-mode-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

body.bshq-vocab-fullscreen-page .bshq-mode-row span {
  padding: 4px 7px;
  border: 1px solid rgba(123,164,219,.14);
  border-radius: 999px;
  background: rgba(255,255,255,.025);
  color: #aebed0;
  font-size: 9px;
  font-weight: 750;
}

body.bshq-vocab-fullscreen-page .bshq-lesson-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: auto;
}

body.bshq-vocab-fullscreen-page .bshq-dd-card-state {
  margin: 0 !important;
  color: var(--bq-accent) !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}

body.bshq-vocab-fullscreen-page .bshq-lesson-card-footer small,
body.bshq-vocab-fullscreen-page .bshq-dd-card-meta {
  color: #7f93a9 !important;
  font-size: 9px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-card-meta {
  position: absolute;
  right: 14px;
  bottom: 7px;
  max-width: 85px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.bshq-vocab-fullscreen-page .bshq-dd-card-progress {
  height: 4px !important;
  margin-top: 0;
  border-radius: 99px;
  background: rgba(155,177,202,.12) !important;
}
body.bshq-vocab-fullscreen-page .bshq-dd-card-progress i { background: linear-gradient(90deg, #34d2a5, #7bf1cd) !important; }

body.bshq-vocab-fullscreen-page .bshq-dd-lesson-card.needs-prep .bshq-lesson-cover { filter: saturate(.4); }
body.bshq-vocab-fullscreen-page .bshq-dd-lesson-card.needs-prep .bshq-dd-card-state { color: #fb7185 !important; }

body.bshq-vocab-fullscreen-page .bshq-tagging-bar {
  margin: 0 0 13px !important;
  padding: 11px 13px !important;
  border-radius: 14px !important;
}

body.bshq-vocab-fullscreen-page .bshq-continue-shell { margin: 0 0 13px; }
body.bshq-vocab-fullscreen-page .bshq-dd-continue-card {
  min-height: 86px !important;
  display: grid !important;
  grid-template-columns: 48px minmax(0,1fr) minmax(110px,.25fr) auto !important;
  align-items: center;
  gap: 13px !important;
  padding: 13px 16px !important;
  border-radius: 17px !important;
}

/* Desktop sidebar: labels remain visible at normal laptop widths. */
@media (min-width: 900px) {
  body.bshq-vocab-fullscreen-page .bshq-app-shell { grid-template-columns: 218px minmax(0,1fr) !important; }
  body.bshq-vocab-fullscreen-page .bshq-side { padding: 16px 13px !important; }
  body.bshq-vocab-fullscreen-page .bshq-brand {
    min-height: 58px;
    flex-direction: row !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    padding: 0 8px 17px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-brand-mark { flex: 0 0 43px; }
  body.bshq-vocab-fullscreen-page .bshq-brand-name {
    display: block !important;
    max-width: none !important;
    font-size: 12px !important;
    line-height: 1.15;
    text-align: left !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-nav-item {
    min-height: 49px !important;
    flex-direction: row !important;
    justify-content: flex-start !important;
    gap: 11px !important;
    padding: 9px 12px !important;
    border-radius: 14px !important;
    font-size: 11px !important;
    text-align: left !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-nav-item svg { flex: 0 0 21px; width: 21px !important; height: 21px !important; }
  body.bshq-vocab-fullscreen-page .bshq-nav-item span { display: block !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  body.bshq-vocab-fullscreen-page .bshq-side-footer .bshq-nav-item,
  body.bshq-vocab-fullscreen-page .bshq-side-footer .bshq-logout-nav {
    flex-direction: row !important;
    justify-content: flex-start !important;
    gap: 11px !important;
    padding-inline: 12px !important;
    font-size: 11px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-main { padding-inline: clamp(18px,2vw,34px) !important; }
  body.bshq-vocab-fullscreen-page .bshq-main > .bshq-top,
  body.bshq-vocab-fullscreen-page .bshq-main > .bshq-view { width: min(100%, 1540px) !important; }
}

@media (min-width: 1440px) {
  body.bshq-vocab-fullscreen-page .bshq-lesson-catalog-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
}

@media (min-width: 1100px) and (max-width: 1439px) {
  body.bshq-vocab-fullscreen-page .bshq-topic-grid { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
  body.bshq-vocab-fullscreen-page .bshq-lesson-catalog-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media (min-width: 760px) and (max-width: 1099px) {
  body.bshq-vocab-fullscreen-page .bshq-topic-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  body.bshq-vocab-fullscreen-page .bshq-lesson-catalog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body.bshq-vocab-fullscreen-page .bshq-library-filter-strip { grid-template-columns: minmax(220px,1fr) 110px 140px; }
  body.bshq-vocab-fullscreen-page .bshq-library-filter-strip .bshq-dd-status-sel { grid-column: span 1; }
}

@media (max-width: 759px) {
  body.bshq-vocab-fullscreen-page .bshq-library-heading { align-items: flex-start; padding: 14px; }
  body.bshq-vocab-fullscreen-page .bshq-library-heading h2 { font-size: 25px !important; }
  body.bshq-vocab-fullscreen-page .bshq-library-heading p { display: none; }
  body.bshq-vocab-fullscreen-page .bshq-library-count-chip { min-width: 64px; }
  body.bshq-vocab-fullscreen-page .bshq-topic-grid {
    display: flex !important;
    gap: 10px !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 1px 1px 8px;
  }
  body.bshq-vocab-fullscreen-page .bshq-topic-card { flex: 0 0 82vw; scroll-snap-align: start; }
  body.bshq-vocab-fullscreen-page .bshq-library-filter-strip {
    position: static;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 9px;
  }
  body.bshq-vocab-fullscreen-page .bshq-library-filter-strip .bshq-dd-search { grid-column: 1/-1; }
  body.bshq-vocab-fullscreen-page .bshq-active-filter-count { display: none; }
  body.bshq-vocab-fullscreen-page .bshq-catalog-head small { display: none; }
  body.bshq-vocab-fullscreen-page .bshq-lesson-catalog-grid { grid-template-columns: 1fr; gap: 12px; }
  body.bshq-vocab-fullscreen-page .bshq-dd-lesson-card { min-height: 270px !important; }
  body.bshq-vocab-fullscreen-page .bshq-lesson-cover { height: 136px; flex-basis: 136px; }
  body.bshq-vocab-fullscreen-page .bshq-dd-continue-card {
    grid-template-columns: 44px minmax(0,1fr) auto !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-continue-meter { display: none; }
}

/* ======================================================================
 * v10.13.0 — Academic Playground
 * Presentation-only final cascade. No learning, audio or data logic.
 * ====================================================================== */

:root {
  --bq-bg: #f4f5fb;
  --bq-bg-soft: #eef1f8;
  --bq-panel: #ffffff;
  --bq-panel-2: #f7f8fc;
  --bq-panel-3: #eef1ff;
  --bq-text: #18233f;
  --bq-text-soft: #34425f;
  --bq-muted: #68758d;
  --bq-muted-2: #8994a8;
  --bq-line: #dbe2ee;
  --bq-line-strong: #c8d2e1;
  --bq-accent: #4a5ce5;
  --bq-accent-2: #3447d3;
  --bq-accent-deep: #25349e;
  --bq-blue: #4a5ce5;
  --bq-mint: #28c7a3;
  --bq-yellow: #ffc84f;
  --bq-coral: #ff765f;
  --bq-purple: #9b7cf4;
  --bq-red: #e95870;
  --bq-radius-sm: 12px;
  --bq-radius: 18px;
  --bq-radius-lg: 26px;
  --bq-shadow: 0 22px 55px rgba(42, 55, 98, .12);
  --bq-shadow-soft: 0 10px 26px rgba(42, 55, 98, .08);
  --bq-shadow-pop: 4px 5px 0 rgba(28, 40, 77, .09);
}

body.bshq-vocab-fullscreen-page .bshq-vocab-root {
  color: var(--bq-text) !important;
  background-color: var(--bq-bg) !important;
  background-image:
    linear-gradient(rgba(74, 92, 229, .032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(74, 92, 229, .032) 1px, transparent 1px),
    radial-gradient(700px 420px at 87% -10%, rgba(255, 200, 79, .18), transparent 70%),
    radial-gradient(600px 440px at -8% 96%, rgba(40, 199, 163, .13), transparent 72%) !important;
  background-size: 28px 28px, 28px 28px, auto, auto !important;
  font-family: Inter, Aptos, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body.bshq-vocab-fullscreen-page .bshq-vocab-root h1,
body.bshq-vocab-fullscreen-page .bshq-vocab-root h2,
body.bshq-vocab-fullscreen-page .bshq-vocab-root h3,
body.bshq-vocab-fullscreen-page .bshq-vocab-root h4,
body.bshq-vocab-fullscreen-page .bshq-vocab-root strong {
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page #bshq-page-title,
body.bshq-vocab-fullscreen-page .bshq-library-heading h2,
body.bshq-vocab-fullscreen-page .bshq-growth-hero h2,
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-intro-copy h1 {
  font-family: Georgia, Cambria, "Times New Roman", serif !important;
  font-weight: 800 !important;
  letter-spacing: -.045em !important;
}

body.bshq-vocab-fullscreen-page .bshq-vocab-root button:focus-visible,
body.bshq-vocab-fullscreen-page .bshq-vocab-root [role="button"]:focus-visible,
body.bshq-vocab-fullscreen-page .bshq-vocab-root input:focus-visible,
body.bshq-vocab-fullscreen-page .bshq-vocab-root textarea:focus-visible,
body.bshq-vocab-fullscreen-page .bshq-vocab-root select:focus-visible {
  outline: 3px solid rgba(74, 92, 229, .22) !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}

/* App chrome */
body.bshq-vocab-fullscreen-page .bshq-app-shell {
  grid-template-columns: 226px minmax(0, 1fr) !important;
  background: transparent !important;
}

body.bshq-vocab-fullscreen-page .bshq-side {
  position: relative;
  overflow: hidden;
  padding: 18px 14px !important;
  border-right: 0 !important;
  background:
    radial-gradient(220px 180px at 110% -4%, rgba(255, 200, 79, .26), transparent 72%),
    radial-gradient(260px 230px at -30% 100%, rgba(40, 199, 163, .22), transparent 70%),
    linear-gradient(165deg, #3345c4 0%, #25359d 54%, #1f2d7d 100%) !important;
  box-shadow: 12px 0 32px rgba(40, 51, 118, .13) !important;
  backdrop-filter: none !important;
}

body.bshq-vocab-fullscreen-page .bshq-side::after {
  content: "";
  position: absolute;
  right: -44px;
  bottom: 18%;
  width: 96px;
  height: 96px;
  border: 16px solid rgba(255,255,255,.055);
  border-radius: 50%;
  pointer-events: none;
}

body.bshq-vocab-fullscreen-page .bshq-brand {
  min-height: 64px !important;
  flex-direction: row !important;
  justify-content: flex-start !important;
  gap: 11px !important;
  margin-bottom: 16px !important;
  padding: 3px 7px 19px !important;
  border-bottom: 1px solid rgba(255,255,255,.13);
}

body.bshq-vocab-fullscreen-page .bshq-brand-mark {
  width: 47px !important;
  height: 47px !important;
  flex: 0 0 47px;
  border: 2px solid rgba(24,35,63,.82) !important;
  border-radius: 15px 15px 15px 7px !important;
  background: var(--bq-yellow) !important;
  color: #17213b !important;
  box-shadow: 3px 4px 0 rgba(12, 20, 64, .28) !important;
  transform: rotate(-2deg);
}

body.bshq-vocab-fullscreen-page .bshq-brand-name {
  display: block !important;
  max-width: none !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
  text-align: left !important;
}

body.bshq-vocab-fullscreen-page .bshq-nav {
  gap: 7px !important;
}

body.bshq-vocab-fullscreen-page .bshq-nav-item {
  min-height: 51px !important;
  flex-direction: row !important;
  justify-content: flex-start !important;
  gap: 11px !important;
  padding: 10px 12px !important;
  border: 1px solid transparent !important;
  border-radius: 15px !important;
  color: rgba(255,255,255,.68) !important;
  font-size: 12px !important;
  font-weight: 760 !important;
  text-align: left !important;
}

body.bshq-vocab-fullscreen-page .bshq-nav-item svg {
  width: 21px !important;
  height: 21px !important;
  flex: 0 0 21px;
}

body.bshq-vocab-fullscreen-page .bshq-nav-item:hover {
  transform: translateX(2px) !important;
  border-color: rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
}

body.bshq-vocab-fullscreen-page .bshq-nav-item.active {
  border-color: rgba(255,255,255,.82) !important;
  background: #fff !important;
  color: #2d3fb5 !important;
  box-shadow: 4px 5px 0 rgba(16, 26, 85, .22) !important;
}

body.bshq-vocab-fullscreen-page .bshq-nav-item.active svg {
  color: #2d3fb5 !important;
}

body.bshq-vocab-fullscreen-page .bshq-side-footer {
  border-top-color: rgba(255,255,255,.13) !important;
}

body.bshq-vocab-fullscreen-page .bshq-logout-nav:hover {
  border-color: rgba(255,255,255,.2) !important;
  background: rgba(255,118,95,.18) !important;
  color: #fff !important;
}

body.bshq-vocab-fullscreen-page .bshq-main {
  padding: 18px clamp(18px, 2.5vw, 40px) 42px !important;
  background: transparent !important;
  scrollbar-color: #bbc5d5 transparent !important;
}

body.bshq-vocab-fullscreen-page .bshq-main > .bshq-top,
body.bshq-vocab-fullscreen-page .bshq-main > .bshq-view {
  width: min(100%, 1510px) !important;
}

body.bshq-vocab-fullscreen-page .bshq-top {
  min-height: 68px !important;
  margin-bottom: 18px !important;
  padding: 10px 12px 10px 19px !important;
  border: 1px solid rgba(200,210,225,.95);
  border-radius: 20px;
  background: rgba(255,255,255,.86);
  box-shadow: var(--bq-shadow-soft);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

body.bshq-vocab-fullscreen-page .bshq-top h1 {
  color: var(--bq-text) !important;
  font-size: clamp(26px, 2.4vw, 37px) !important;
}

body.bshq-vocab-fullscreen-page .bshq-eyebrow {
  color: var(--bq-accent) !important;
  font-size: 9px !important;
  letter-spacing: .18em !important;
}

body.bshq-vocab-fullscreen-page .bshq-account-toggle {
  border: 1px solid var(--bq-line) !important;
  background: #fff !important;
  color: var(--bq-text) !important;
  box-shadow: 2px 3px 0 rgba(28,40,77,.07) !important;
}

body.bshq-vocab-fullscreen-page .bshq-account-popover {
  border: 1px solid var(--bq-line-strong) !important;
  background: #fff !important;
  color: var(--bq-text) !important;
  box-shadow: 0 24px 65px rgba(31,44,90,.18) !important;
}

body.bshq-vocab-fullscreen-page .bshq-account-item {
  color: var(--bq-text-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-account-item:hover {
  background: #f0f2ff !important;
  color: var(--bq-accent) !important;
}

/* Reusable paper surfaces */
body.bshq-vocab-fullscreen-page .bshq-panel,
body.bshq-vocab-fullscreen-page .bshq-growth-card,
body.bshq-vocab-fullscreen-page .bshq-rank-row,
body.bshq-vocab-fullscreen-page .bshq-achievement-item,
body.bshq-vocab-fullscreen-page .bshq-review-card,
body.bshq-vocab-fullscreen-page .bshq-deep-card,
body.bshq-vocab-fullscreen-page .bshq-sentence-card,
body.bshq-vocab-fullscreen-page .bshq-dd-workspace,
body.bshq-vocab-fullscreen-page .bshq-dd-reference,
body.bshq-vocab-fullscreen-page .bshq-loading-card,
body.bshq-vocab-fullscreen-page .bshq-error-card,
body.bshq-vocab-fullscreen-page .bshq-empty-state,
body.bshq-vocab-fullscreen-page .bshq-finish-card {
  border: 1px solid var(--bq-line) !important;
  background: #fff !important;
  color: var(--bq-text) !important;
  box-shadow: var(--bq-shadow-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-btn {
  min-height: 44px;
  border-radius: 13px !important;
}

body.bshq-vocab-fullscreen-page .bshq-btn-primary,
body.bshq-vocab-fullscreen-page .bshq-auth-submit {
  border: 1px solid #22319b !important;
  background: linear-gradient(135deg, #5869ef, #3f50dc) !important;
  color: #fff !important;
  box-shadow: 3px 4px 0 rgba(37,52,158,.20) !important;
}

body.bshq-vocab-fullscreen-page .bshq-btn-primary:hover:not(:disabled),
body.bshq-vocab-fullscreen-page .bshq-auth-submit:hover:not(:disabled) {
  transform: translate(-1px,-1px) !important;
  box-shadow: 5px 6px 0 rgba(37,52,158,.18) !important;
}

body.bshq-vocab-fullscreen-page .bshq-btn-soft,
body.bshq-vocab-fullscreen-page .bshq-icon-btn {
  border-color: var(--bq-line-strong) !important;
  background: #fff !important;
  color: var(--bq-text-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-btn-soft:hover:not(:disabled),
body.bshq-vocab-fullscreen-page .bshq-icon-btn:hover:not(:disabled) {
  border-color: #aebaf8 !important;
  background: #f0f2ff !important;
  color: var(--bq-accent) !important;
}

body.bshq-vocab-fullscreen-page .bshq-text-btn,
body.bshq-vocab-fullscreen-page .bshq-section-kicker {
  color: var(--bq-accent) !important;
}

/* Dashboard */
body.bshq-vocab-fullscreen-page .bshq-growth-hero {
  min-height: 226px !important;
  border: 2px solid #25359f !important;
  border-radius: 28px 28px 28px 12px !important;
  background:
    radial-gradient(330px 210px at 91% 0%, rgba(255,255,255,.17), transparent 70%),
    radial-gradient(300px 180px at 4% 110%, rgba(40,199,163,.28), transparent 72%),
    linear-gradient(120deg, #3447cf 0%, #4b5de4 56%, #6d78ef 100%) !important;
  box-shadow: 7px 8px 0 rgba(36,51,151,.15) !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero::before {
  right: 5% !important;
  bottom: -185px !important;
  border-color: rgba(255,200,79,.55) !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero::after {
  width: 126px !important;
  height: 126px !important;
  top: -62px !important;
  background: var(--bq-yellow) !important;
  opacity: .85;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero h2,
body.bshq-vocab-fullscreen-page .bshq-growth-hero h2 strong,
body.bshq-vocab-fullscreen-page .bshq-growth-hero h2 span {
  color: #fff !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero-kicker {
  color: #fff4c3 !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-hero-meta > span {
  border-color: rgba(255,255,255,.25) !important;
  background: rgba(23,33,100,.18) !important;
  color: #fff !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-stats article {
  border: 1px solid var(--bq-line) !important;
  border-radius: 20px 20px 20px 8px !important;
  background: #fff !important;
  box-shadow: var(--bq-shadow-pop) !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-stats article::after {
  height: 5px !important;
  background: var(--bq-mint) !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-stats article.is-accuracy::after { background: var(--bq-accent) !important; }
body.bshq-vocab-fullscreen-page .bshq-growth-stats article.is-streak::after { background: var(--bq-yellow) !important; }
body.bshq-vocab-fullscreen-page .bshq-growth-stats article.is-rank::after { background: var(--bq-purple) !important; }

body.bshq-vocab-fullscreen-page .bshq-growth-stat-label i {
  background: #e9fbf6 !important;
  color: #139a7d !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-stats .is-accuracy .bshq-growth-stat-label i { background: #eef0ff !important; color: var(--bq-accent) !important; }
body.bshq-vocab-fullscreen-page .bshq-growth-stats .is-streak .bshq-growth-stat-label i { background: #fff7dc !important; color: #b97900 !important; }
body.bshq-vocab-fullscreen-page .bshq-growth-stats .is-rank .bshq-growth-stat-label i { background: #f3efff !important; color: #795bd0 !important; }

body.bshq-vocab-fullscreen-page .bshq-growth-stat-label span,
body.bshq-vocab-fullscreen-page .bshq-growth-stats small,
body.bshq-vocab-fullscreen-page .bshq-growth-card p {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-card {
  border-radius: 22px 22px 22px 9px !important;
  background: #fff !important;
  box-shadow: var(--bq-shadow-pop) !important;
}

body.bshq-vocab-fullscreen-page .bshq-challenge-card {
  background: linear-gradient(135deg, #f0f2ff, #fff) !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-progress {
  background: #e7ebf3 !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-progress i {
  background: linear-gradient(90deg, var(--bq-accent), var(--bq-mint)) !important;
}

body.bshq-vocab-fullscreen-page .bshq-growth-card input,
body.bshq-vocab-fullscreen-page .bshq-growth-card select,
body.bshq-vocab-fullscreen-page .bshq-copy-row input {
  border-color: var(--bq-line-strong) !important;
  background: #f8f9fc !important;
  color: var(--bq-text) !important;
}

/* Listening catalog */
body.bshq-vocab-fullscreen-page .bshq-route-audio .bshq-top h1 {
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-library-heading {
  padding: 21px 22px !important;
  border: 2px solid #2638a9 !important;
  border-radius: 24px 24px 24px 10px !important;
  background:
    radial-gradient(270px 150px at 100% 0%, rgba(255,200,79,.34), transparent 68%),
    linear-gradient(135deg, #3e50da, #5a68e8) !important;
  box-shadow: 6px 7px 0 rgba(38,56,169,.13) !important;
}

body.bshq-vocab-fullscreen-page .bshq-library-heading-copy > span,
body.bshq-vocab-fullscreen-page .bshq-library-heading p {
  color: #e8ebff !important;
}

body.bshq-vocab-fullscreen-page .bshq-library-heading h2 {
  color: #fff !important;
}

body.bshq-vocab-fullscreen-page .bshq-library-count-chip {
  border: 2px solid #1c285f !important;
  background: var(--bq-yellow) !important;
  box-shadow: 3px 4px 0 rgba(24,35,63,.24) !important;
  transform: rotate(1.5deg);
}

body.bshq-vocab-fullscreen-page .bshq-library-count-chip strong,
body.bshq-vocab-fullscreen-page .bshq-library-count-chip span {
  color: #18233f !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-reset {
  border-color: rgba(255,255,255,.65) !important;
  background: #fff !important;
  color: #3345c4 !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card {
  min-height: 110px !important;
  border: 1px solid var(--bq-line-strong) !important;
  border-radius: 20px 20px 20px 8px !important;
  background: #fff !important;
  color: var(--bq-text) !important;
  box-shadow: var(--bq-shadow-pop) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card:hover {
  transform: translate(-2px,-3px) !important;
  border-color: #9ca9f3 !important;
  box-shadow: 7px 9px 0 rgba(57,73,153,.11) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card::after {
  border-color: rgba(74,92,229,.06) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card-art {
  border: 1px solid rgba(24,35,63,.32);
  box-shadow: 3px 4px 0 rgba(24,35,63,.12) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card-copy small,
body.bshq-vocab-fullscreen-page .bshq-topic-card-copy em {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-topic-card-copy strong,
body.bshq-vocab-fullscreen-page .bshq-topic-card-arrow {
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-library-filter-strip {
  border: 1px solid var(--bq-line-strong) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.93) !important;
  box-shadow: 0 8px 22px rgba(42,55,98,.07) !important;
}

body.bshq-vocab-fullscreen-page .bshq-library-filter-strip .bshq-dd-search,
body.bshq-vocab-fullscreen-page .bshq-library-filter-strip .bshq-dd-select {
  border-color: var(--bq-line) !important;
  background: #f7f8fc !important;
  color: var(--bq-text-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-library-filter-strip .bshq-dd-search:focus-within,
body.bshq-vocab-fullscreen-page .bshq-library-filter-strip .bshq-dd-select:focus {
  border-color: #8695ef !important;
  background: #fff !important;
}

body.bshq-vocab-fullscreen-page .bshq-catalog-head {
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-catalog-head span,
body.bshq-vocab-fullscreen-page .bshq-catalog-head small {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-lesson-card {
  overflow: hidden;
  border: 1px solid var(--bq-line-strong) !important;
  border-radius: 22px 22px 22px 9px !important;
  background: #fff !important;
  box-shadow: var(--bq-shadow-pop) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-lesson-card:hover {
  transform: translate(-2px,-4px) !important;
  border-color: #9daaf4 !important;
  box-shadow: 7px 10px 0 rgba(57,73,153,.10) !important;
}

body.bshq-vocab-fullscreen-page .bshq-lesson-card-body {
  background: #fff !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-card-title {
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-fav {
  border-color: var(--bq-line) !important;
  background: #f7f8fc !important;
  color: #8a96aa !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-fav.on {
  border-color: #efbd35 !important;
  background: #fff7d9 !important;
  color: #bd7b00 !important;
}

body.bshq-vocab-fullscreen-page .bshq-mode-row span {
  border-color: #dfe4f4 !important;
  background: #f3f5fc !important;
  color: #60708b !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-card-state {
  color: var(--bq-accent) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-card-meta,
body.bshq-vocab-fullscreen-page .bshq-lesson-card-footer small {
  color: var(--bq-muted-2) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-card-progress {
  background: #e7eaf3 !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-card-progress i {
  background: linear-gradient(90deg, var(--bq-accent), var(--bq-mint)) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-continue-card {
  border: 2px solid #25359f !important;
  background: linear-gradient(105deg, #edf0ff, #fff) !important;
  box-shadow: 4px 5px 0 rgba(37,53,159,.12) !important;
}

body.bshq-vocab-fullscreen-page .bshq-continue-play {
  border: 1px solid #2637ab !important;
  background: var(--bq-accent) !important;
  color: #fff !important;
}

body.bshq-vocab-fullscreen-page .bshq-continue-copy small,
body.bshq-vocab-fullscreen-page .bshq-continue-copy strong {
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-continue-copy small { color: var(--bq-accent) !important; }
body.bshq-vocab-fullscreen-page .bshq-continue-copy span { color: var(--bq-muted) !important; }
body.bshq-vocab-fullscreen-page .bshq-continue-meter { background: #dfe4f2 !important; }
body.bshq-vocab-fullscreen-page .bshq-continue-meter i { background: linear-gradient(90deg, var(--bq-accent), var(--bq-mint)) !important; }

/* Dictation studio */
body.bshq-vocab-fullscreen-page .bshq-focus-mode .bshq-app-shell {
  grid-template-columns: 82px minmax(0, 1fr) !important;
}

body.bshq-vocab-fullscreen-page .bshq-focus-mode .bshq-side {
  padding-inline: 10px !important;
}

body.bshq-vocab-fullscreen-page .bshq-focus-mode .bshq-brand {
  justify-content: center !important;
  padding-inline: 0 !important;
}

body.bshq-vocab-fullscreen-page .bshq-focus-mode .bshq-brand-name,
body.bshq-vocab-fullscreen-page .bshq-focus-mode .bshq-nav-item span,
body.bshq-vocab-fullscreen-page .bshq-focus-mode .bshq-side-footer span {
  display: none !important;
}

body.bshq-vocab-fullscreen-page .bshq-focus-mode .bshq-nav-item {
  justify-content: center !important;
  padding-inline: 8px !important;
}

body.bshq-vocab-fullscreen-page .bshq-focus-mode .bshq-top {
  min-height: 58px !important;
  margin-bottom: 10px !important;
}

body.bshq-vocab-fullscreen-page .bshq-progress {
  height: 7px !important;
  border: 1px solid #d7deec;
  background: #e6eaf2 !important;
}

body.bshq-vocab-fullscreen-page .bshq-progress i {
  background: linear-gradient(90deg, var(--bq-accent), var(--bq-mint), var(--bq-yellow)) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-workspace,
body.bshq-vocab-fullscreen-page .bshq-dd-reference {
  border-radius: 24px 24px 24px 10px !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-workspace {
  border: 1px solid var(--bq-line-strong) !important;
  background: #fff !important;
  box-shadow: 5px 6px 0 rgba(42,55,98,.08) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-reference {
  border-color: #d9dcf6 !important;
  background: #f4f3ff !important;
  box-shadow: 4px 5px 0 rgba(86,72,160,.07) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-title-row > strong {
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-title-row > span {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-playerbar {
  border: 1px solid #cdd5fb !important;
  border-radius: 20px !important;
  background:
    radial-gradient(220px 120px at 100% 0%, rgba(255,200,79,.20), transparent 70%),
    linear-gradient(110deg, #eef0ff, #fafbff) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-play {
  border: 2px solid #24339a !important;
  background: var(--bq-accent) !important;
  color: #fff !important;
  box-shadow: 3px 4px 0 rgba(37,52,158,.22) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-play-label b { color: var(--bq-text) !important; }
body.bshq-vocab-fullscreen-page .bshq-dd-play-label small { color: var(--bq-muted) !important; }

body.bshq-vocab-fullscreen-page .bshq-shadowing-toggle,
body.bshq-vocab-fullscreen-page .bshq-dd-speed {
  border-color: #ccd4e6 !important;
  background: #fff !important;
  color: var(--bq-text-soft) !important;
}

body.bshq-vocab-fullscreen-page .bshq-shadowing-toggle.active,
body.bshq-vocab-fullscreen-page .bshq-dd-speed.active {
  border-color: #6475e7 !important;
  background: var(--bq-accent) !important;
  color: #fff !important;
}

body.bshq-vocab-fullscreen-page #bshq-audio-answer {
  min-height: 110px !important;
  border: 2px solid #bfc9da !important;
  border-radius: 18px 18px 18px 7px !important;
  background: #fffef8 !important;
  color: var(--bq-text) !important;
  box-shadow: inset 0 -4px 0 rgba(255,200,79,.15) !important;
}

body.bshq-vocab-fullscreen-page #bshq-audio-answer::placeholder {
  color: #9aa4b4 !important;
}

body.bshq-vocab-fullscreen-page #bshq-audio-answer:focus {
  border-color: var(--bq-accent) !important;
  box-shadow: 0 0 0 4px rgba(74,92,229,.10), inset 0 -4px 0 rgba(255,200,79,.20) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-answer-options,
body.bshq-vocab-fullscreen-page .bshq-dd-shortcuts {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-shortcuts kbd {
  border-color: #c8d1e0 !important;
  background: #fff !important;
  color: var(--bq-text-soft) !important;
  box-shadow: 0 2px 0 #c5ccda !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-tabs {
  border-bottom-color: #d7d9f0 !important;
}

body.bshq-vocab-fullscreen-page .bshq-dd-tabs button { color: var(--bq-muted) !important; }
body.bshq-vocab-fullscreen-page .bshq-dd-tabs button.active { color: var(--bq-accent) !important; }

body.bshq-vocab-fullscreen-page .bshq-dd-ref-block {
  border-color: #d9dcf0 !important;
  background: rgba(255,255,255,.76) !important;
}

body.bshq-vocab-fullscreen-page .bshq-audio-error {
  border-color: #f0b5bf !important;
  background: #fff1f3 !important;
  color: #a93448 !important;
}

/* Vocabulary and review */
body.bshq-vocab-fullscreen-page .bshq-vocab-stats article,
body.bshq-vocab-fullscreen-page .bshq-vocab-actions,
body.bshq-vocab-fullscreen-page .bshq-quick-add,
body.bshq-vocab-fullscreen-page .bshq-rule-banner,
body.bshq-vocab-fullscreen-page .bshq-word-row,
body.bshq-vocab-fullscreen-page .bshq-add-card {
  border-color: var(--bq-line) !important;
  border-radius: 20px 20px 20px 8px !important;
  background: #fff !important;
  color: var(--bq-text) !important;
  box-shadow: var(--bq-shadow-pop) !important;
}

body.bshq-vocab-fullscreen-page .bshq-vocab-stats span,
body.bshq-vocab-fullscreen-page .bshq-word-meta,
body.bshq-vocab-fullscreen-page .bshq-word-meaning,
body.bshq-vocab-fullscreen-page .bshq-review-hint,
body.bshq-vocab-fullscreen-page .bshq-hotkey-hint {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-review-screen textarea,
body.bshq-vocab-fullscreen-page .bshq-review-screen input,
body.bshq-vocab-fullscreen-page .bshq-search input,
body.bshq-vocab-fullscreen-page .bshq-form input,
body.bshq-vocab-fullscreen-page .bshq-form textarea,
body.bshq-vocab-fullscreen-page .bshq-form select {
  border-color: var(--bq-line-strong) !important;
  background: #f9fafc !important;
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page .bshq-rating-grid button,
body.bshq-vocab-fullscreen-page .bshq-meaning-grade button {
  border-color: var(--bq-line-strong) !important;
  background: #fff !important;
  color: var(--bq-text-soft) !important;
}

/* Leaderboard and achievements */
body.bshq-vocab-fullscreen-page .bshq-leaderboard-controls {
  gap: 12px !important;
}

body.bshq-vocab-fullscreen-page .bshq-segmented,
body.bshq-vocab-fullscreen-page #bshq-leaderboard-metric {
  border: 1px solid var(--bq-line-strong) !important;
  background: #fff !important;
  color: var(--bq-text) !important;
  box-shadow: var(--bq-shadow-pop) !important;
}

body.bshq-vocab-fullscreen-page .bshq-segmented button { color: var(--bq-muted) !important; }

body.bshq-vocab-fullscreen-page .bshq-segmented button.active {
  background: var(--bq-accent) !important;
  color: #fff !important;
  box-shadow: 2px 3px 0 rgba(37,52,158,.18) !important;
}

body.bshq-vocab-fullscreen-page .bshq-leaderboard-note {
  border-color: #d2d8fb !important;
  background: #eef0ff !important;
  color: #53617e !important;
}

body.bshq-vocab-fullscreen-page .bshq-rank-row {
  border: 1px solid var(--bq-line-strong) !important;
  border-radius: 18px 18px 18px 7px !important;
  background: #fff !important;
  box-shadow: 3px 4px 0 rgba(42,55,98,.07) !important;
}

body.bshq-vocab-fullscreen-page .bshq-rank-row:nth-child(1) { border-left: 7px solid var(--bq-yellow) !important; }
body.bshq-vocab-fullscreen-page .bshq-rank-row:nth-child(2) { border-left: 7px solid var(--bq-mint) !important; }
body.bshq-vocab-fullscreen-page .bshq-rank-row:nth-child(3) { border-left: 7px solid var(--bq-purple) !important; }

body.bshq-vocab-fullscreen-page .bshq-rank-row.is-me {
  border-color: #7e8bea !important;
  background: linear-gradient(100deg, #eef0ff, #fff) !important;
}

body.bshq-vocab-fullscreen-page .bshq-rank-avatar {
  background: #eef0ff !important;
  color: var(--bq-accent) !important;
}

body.bshq-vocab-fullscreen-page .bshq-rank-row em { color: var(--bq-accent) !important; }
body.bshq-vocab-fullscreen-page .bshq-rank-number,
body.bshq-vocab-fullscreen-page .bshq-rank-row small { color: var(--bq-muted) !important; }

body.bshq-vocab-fullscreen-page .bshq-achievement-item {
  border-radius: 20px 20px 20px 8px !important;
  background: #fff !important;
  box-shadow: var(--bq-shadow-pop) !important;
}

body.bshq-vocab-fullscreen-page .bshq-achievement-item > span {
  background: #fff4cf !important;
}

body.bshq-vocab-fullscreen-page .bshq-achievement-item p,
body.bshq-vocab-fullscreen-page .bshq-achievement-item small { color: var(--bq-muted) !important; }

/* Dialogs, account profile and notifications */
body.bshq-vocab-fullscreen-page .bshq-growth-overlay,
body.bshq-vocab-fullscreen-page .bshq-modal-wrap {
  background: rgba(27,36,71,.44) !important;
  backdrop-filter: blur(12px) !important;
}

body.bshq-vocab-fullscreen-page .bshq-completion-modal,
body.bshq-vocab-fullscreen-page .bshq-share-modal,
body.bshq-vocab-fullscreen-page .bshq-modal,
body.bshq-vocab-fullscreen-page .bshq-profile-modal {
  border: 1px solid var(--bq-line-strong) !important;
  border-radius: 26px 26px 26px 11px !important;
  background: #fff !important;
  color: var(--bq-text) !important;
  box-shadow: 8px 10px 0 rgba(27,36,71,.14), 0 36px 90px rgba(27,36,71,.22) !important;
}

body.bshq-vocab-fullscreen-page .bshq-profile-card {
  border: 2px solid #2638a9 !important;
  background:
    radial-gradient(260px 180px at 100% 0%, rgba(255,200,79,.28), transparent 70%),
    linear-gradient(135deg, #4254dc, #6673ea) !important;
  box-shadow: 5px 6px 0 rgba(38,56,169,.16) !important;
}

body.bshq-vocab-fullscreen-page .bshq-profile-card h2,
body.bshq-vocab-fullscreen-page .bshq-profile-card strong,
body.bshq-vocab-fullscreen-page .bshq-profile-card b,
body.bshq-vocab-fullscreen-page .bshq-profile-card span,
body.bshq-vocab-fullscreen-page .bshq-profile-card p {
  color: #fff !important;
}

body.bshq-vocab-fullscreen-page .bshq-profile-stat,
body.bshq-vocab-fullscreen-page .bshq-profile-badge {
  border-color: rgba(255,255,255,.24) !important;
  background: rgba(24,35,99,.16) !important;
}

body.bshq-vocab-fullscreen-page .bshq-profile-progress-bar {
  background: rgba(255,255,255,.2) !important;
}

body.bshq-vocab-fullscreen-page .bshq-profile-progress-bar i {
  background: linear-gradient(90deg, var(--bq-yellow), #ffe79a) !important;
}

body.bshq-vocab-fullscreen-page .bshq-referral-qr-button {
  border-color: #cfd7e7 !important;
  background: #f7f8fc !important;
  color: var(--bq-accent) !important;
}

body.bshq-vocab-fullscreen-page .bshq-referral-link-preview {
  border-color: var(--bq-line) !important;
  background: #f7f8fc !important;
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page .bshq-toast {
  border: 1px solid #cbd4e2 !important;
  background: #fff !important;
  color: var(--bq-text) !important;
  box-shadow: 4px 5px 0 rgba(28,40,77,.11), 0 18px 45px rgba(28,40,77,.12) !important;
}

/* Authentication */
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-vocab-root {
  background: #f3f4fb !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-screen {
  grid-template-columns: minmax(430px, .92fr) minmax(520px, 1.08fr) !important;
  background: linear-gradient(90deg, #3d50d5 0 45%, #f4f5fb 45% 100%) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-intro {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(430px 330px at 100% 0%, rgba(255,200,79,.30), transparent 70%),
    radial-gradient(420px 300px at -10% 100%, rgba(40,199,163,.28), transparent 72%),
    linear-gradient(155deg, #4256dd, #2d3db2) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-intro::before {
  content: "Aa";
  position: absolute;
  right: -20px;
  bottom: -80px;
  color: rgba(255,255,255,.07);
  font: 900 260px/1 Georgia, serif;
  transform: rotate(-8deg);
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-logo {
  border: 2px solid #18233f !important;
  border-radius: 15px 15px 15px 6px !important;
  background: var(--bq-yellow) !important;
  color: #18233f !important;
  box-shadow: 3px 4px 0 rgba(18,29,92,.28) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-intro-copy h1,
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-brandline strong {
  color: #fff !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-intro-copy p,
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-brandline span,
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-intro > small {
  color: rgba(255,255,255,.76) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-points span {
  border-color: rgba(255,255,255,.3) !important;
  background: rgba(25,35,110,.22) !important;
  color: #fff !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-form-zone {
  background:
    linear-gradient(rgba(74,92,229,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(74,92,229,.035) 1px, transparent 1px),
    #f4f5fb !important;
  background-size: 28px 28px !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-card {
  border: 1px solid #cbd4e3 !important;
  border-radius: 28px 28px 28px 11px !important;
  background: #fff !important;
  color: var(--bq-text) !important;
  box-shadow: 7px 9px 0 rgba(44,59,125,.10), 0 28px 75px rgba(44,59,125,.13) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-switch {
  border-color: #d9e0ec !important;
  background: #eef1f7 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-switch button { color: var(--bq-muted) !important; }

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-switch button.active {
  background: var(--bq-accent) !important;
  color: #fff !important;
  box-shadow: 2px 3px 0 rgba(37,52,158,.16) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-heading h2,
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-field > label {
  color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-heading p,
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-field small,
body.bshq-vocab-fullscreen-page.bshq-auth-open #bshq-password-label,
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-legal,
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-remember {
  color: var(--bq-muted) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-kicker,
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-link,
body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-show-password {
  color: var(--bq-accent) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-input-wrap {
  border-color: #c7d0df !important;
  background: #f9fafc !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-input-wrap:focus-within {
  border-color: var(--bq-accent) !important;
  background: #fff !important;
  box-shadow: 0 0 0 4px rgba(74,92,229,.10) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-input-wrap input {
  color: var(--bq-text) !important;
  -webkit-text-fill-color: var(--bq-text) !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-error {
  border-color: #efb8c2 !important;
  background: #fff1f3 !important;
  color: #a93448 !important;
}

body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-success {
  border-color: #aee2d4 !important;
  background: #effbf7 !important;
  color: #14715b !important;
}

/* Responsive academic playground */
@media (min-width: 1440px) {
  body.bshq-vocab-fullscreen-page .bshq-app-shell { grid-template-columns: 236px minmax(0,1fr) !important; }
  body.bshq-vocab-fullscreen-page .bshq-lesson-catalog-grid { grid-template-columns: repeat(4,minmax(0,1fr)) !important; }
}

@media (min-width: 900px) and (max-width: 1180px) {
  body.bshq-vocab-fullscreen-page .bshq-app-shell { grid-template-columns: 196px minmax(0,1fr) !important; }
  body.bshq-vocab-fullscreen-page .bshq-nav-item { padding-inline: 10px !important; font-size: 11px !important; }
}

@media (max-width: 980px) {
  body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-screen {
    grid-template-columns: 1fr !important;
    background: #f4f5fb !important;
  }
  body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-intro { display: none !important; }
}

@media (max-width: 899px) {
  body.bshq-vocab-fullscreen-page .bshq-app-shell,
  body.bshq-vocab-fullscreen-page .bshq-focus-mode .bshq-app-shell { grid-template-columns: 78px minmax(0,1fr) !important; }
  body.bshq-vocab-fullscreen-page .bshq-side { padding-inline: 9px !important; }
  body.bshq-vocab-fullscreen-page .bshq-brand { justify-content: center !important; padding-inline: 0 !important; }
  body.bshq-vocab-fullscreen-page .bshq-brand-name,
  body.bshq-vocab-fullscreen-page .bshq-nav-item span,
  body.bshq-vocab-fullscreen-page .bshq-side-footer span { display: none !important; }
  body.bshq-vocab-fullscreen-page .bshq-nav-item { justify-content: center !important; padding-inline: 8px !important; }
}

@media (max-width: 760px) {
  body.bshq-vocab-fullscreen-page .bshq-app-shell,
  body.bshq-vocab-fullscreen-page .bshq-focus-mode .bshq-app-shell { display: block !important; }
  body.bshq-vocab-fullscreen-page .bshq-side { display: none !important; }
  body.bshq-vocab-fullscreen-page .bshq-main { padding: 10px 10px 92px !important; }
  body.bshq-vocab-fullscreen-page .bshq-top {
    min-height: 58px !important;
    margin-bottom: 10px !important;
    padding: 8px 9px 8px 13px !important;
    border-radius: 17px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-top h1 { font-size: 24px !important; }
  body.bshq-vocab-fullscreen-page .bshq-eyebrow { font-size: 8px !important; }
  body.bshq-vocab-fullscreen-page .bshq-account-name,
  body.bshq-vocab-fullscreen-page .bshq-account-caret { display: none !important; }
  body.bshq-vocab-fullscreen-page .bshq-bottom-nav {
    left: 10px !important;
    right: 10px !important;
    bottom: 10px !important;
    width: auto !important;
    height: 68px !important;
    padding: 6px !important;
    border: 1px solid #ccd5e3 !important;
    border-radius: 22px !important;
    background: rgba(255,255,255,.95) !important;
    box-shadow: 0 16px 42px rgba(31,44,90,.18) !important;
    backdrop-filter: blur(16px);
  }
  body.bshq-vocab-fullscreen-page .bshq-bottom-item { color: #7b879b !important; }
  body.bshq-vocab-fullscreen-page .bshq-bottom-item.active {
    border-radius: 16px !important;
    background: #eef0ff !important;
    color: var(--bq-accent) !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-hero {
    min-height: 210px !important;
    padding: 24px 20px !important;
    border-radius: 23px 23px 23px 9px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-growth-stats { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  body.bshq-vocab-fullscreen-page .bshq-growth-grid { grid-template-columns: 1fr !important; }
  body.bshq-vocab-fullscreen-page .bshq-library-heading {
    padding: 16px !important;
    border-radius: 21px 21px 21px 8px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-topic-card { flex-basis: 84vw !important; }
  body.bshq-vocab-fullscreen-page .bshq-library-filter-strip { background: #fff !important; }
  body.bshq-vocab-fullscreen-page .bshq-dd-layout { grid-template-columns: 1fr !important; }
  body.bshq-vocab-fullscreen-page .bshq-dd-workspace { min-height: 0 !important; padding: 14px !important; }
  body.bshq-vocab-fullscreen-page .bshq-dd-reference { min-height: 260px !important; }
  body.bshq-vocab-fullscreen-page .bshq-dd-playerbar {
    grid-template-columns: 54px minmax(0,1fr) !important;
    gap: 10px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-shadowing-toggle,
  body.bshq-vocab-fullscreen-page .bshq-dd-speeds { grid-column: auto !important; }
  body.bshq-vocab-fullscreen-page #bshq-audio-answer { font-size: 19px !important; }
  body.bshq-vocab-fullscreen-page .bshq-leaderboard-controls { grid-template-columns: 1fr !important; }
  body.bshq-vocab-fullscreen-page .bshq-segmented { overflow-x: auto; }
  body.bshq-vocab-fullscreen-page .bshq-rank-row { grid-template-columns: 42px 42px minmax(0,1fr) auto !important; padding: 12px !important; }
}

@media (max-width: 480px) {
  body.bshq-vocab-fullscreen-page .bshq-main { padding-inline: 8px !important; }
  body.bshq-vocab-fullscreen-page .bshq-top-add { display: none !important; }
  body.bshq-vocab-fullscreen-page .bshq-library-heading h2 { font-size: 24px !important; }
  body.bshq-vocab-fullscreen-page .bshq-library-count-chip { min-width: 58px !important; padding: 8px !important; }
  body.bshq-vocab-fullscreen-page .bshq-topic-card { flex-basis: 88vw !important; }
  body.bshq-vocab-fullscreen-page .bshq-growth-stats article { min-height: 116px !important; padding: 15px !important; }
  body.bshq-vocab-fullscreen-page .bshq-dd-under-input { grid-template-columns: 1fr !important; }
  body.bshq-vocab-fullscreen-page .bshq-dd-under-input .bshq-btn { width: 100% !important; min-width: 0 !important; }
  body.bshq-vocab-fullscreen-page .bshq-dd-answer-options { display: grid !important; gap: 8px !important; }
  body.bshq-vocab-fullscreen-page .bshq-rank-row { grid-template-columns: 34px 40px minmax(0,1fr) !important; }
  body.bshq-vocab-fullscreen-page .bshq-rank-row em { grid-column: 3; justify-self: start; }
  body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-form-zone { padding: 10px !important; }
  body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-card {
    padding: 18px 14px !important;
    border-radius: 22px 22px 22px 8px !important;
  }
  body.bshq-vocab-fullscreen-page.bshq-auth-open .bshq-auth-switch button { font-size: 9px !important; }
}

@media (prefers-reduced-motion: reduce) {
  body.bshq-vocab-fullscreen-page .bshq-vocab-root *,
  body.bshq-vocab-fullscreen-page .bshq-vocab-root *::before,
  body.bshq-vocab-fullscreen-page .bshq-vocab-root *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}


/* v10.14.2 — leaderboard avatars + crowns */
body.bshq-vocab-fullscreen-page .bshq-rank-badge {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 68px !important;
}
body.bshq-vocab-fullscreen-page .bshq-rank-number {
  font-size: 20px !important;
  font-weight: 900 !important;
  letter-spacing: -0.02em !important;
  color: var(--bq-text) !important;
}
body.bshq-vocab-fullscreen-page .bshq-rank-crown {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  box-shadow: 0 8px 20px rgba(15,23,42,.10) !important;
}
body.bshq-vocab-fullscreen-page .bshq-rank-crown svg {
  width: 16px !important;
  height: 16px !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 2 !important;
}
body.bshq-vocab-fullscreen-page .bshq-rank-crown.is-1 {
  background: linear-gradient(135deg, #fef3c7, #fbbf24) !important;
  color: #7c2d12 !important;
}
body.bshq-vocab-fullscreen-page .bshq-rank-crown.is-2 {
  background: linear-gradient(135deg, #f8fafc, #cbd5e1) !important;
  color: #334155 !important;
}
body.bshq-vocab-fullscreen-page .bshq-rank-crown.is-3 {
  background: linear-gradient(135deg, #fed7aa, #fb923c) !important;
  color: #7c2d12 !important;
}
body.bshq-vocab-fullscreen-page .bshq-rank-avatar {
  overflow: hidden !important;
}
body.bshq-vocab-fullscreen-page .bshq-rank-avatar.has-photo {
  background: #fff !important;
  color: transparent !important;
}
body.bshq-vocab-fullscreen-page .bshq-rank-avatar img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
body.bshq-vocab-fullscreen-page .bshq-rank-row.is-podium {
  position: relative !important;
}
body.bshq-vocab-fullscreen-page .bshq-rank-row.rank-1 {
  box-shadow: 0 14px 34px rgba(79,70,229,.12) !important;
}
@media (max-width: 640px) {
  body.bshq-vocab-fullscreen-page .bshq-rank-badge {
    min-width: 56px !important;
    gap: 6px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-rank-number {
    font-size: 18px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-rank-crown {
    width: 24px !important;
    height: 24px !important;
  }
  body.bshq-vocab-fullscreen-page .bshq-rank-crown svg {
    width: 13px !important;
    height: 13px !important;
  }
}


/* v10.22.1 — admin-visible Grammar Tag health status. */
#bshq-vocab-root .bshq-grammar-tagging-bar.is-complete {
  border-color: rgba(16,185,129,.35) !important;
  background: linear-gradient(135deg,rgba(236,253,245,.96),rgba(240,253,250,.96)) !important;
}
#bshq-vocab-root .bshq-grammar-tagging-bar.is-complete strong,
#bshq-vocab-root .bshq-grammar-tagging-bar.is-complete span { color:#08745d !important; }
#bshq-vocab-root .bshq-tag-complete-badge {
  display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:0 13px;
  border-radius:999px; border:1px solid rgba(16,185,129,.30); background:#dff8ee; color:#08745d;
  font-size:11px; font-weight:900; letter-spacing:.04em; white-space:nowrap;
}
#bshq-vocab-root .bshq-admin-grammar-chip {
  margin-left:auto; padding:3px 6px; border-radius:999px; font-size:8px; font-weight:900; letter-spacing:.04em;
  border:1px solid #cfd8e6; background:#f4f7fb; color:#637085;
}
#bshq-vocab-root .bshq-admin-grammar-chip.is-ready { border-color:#a7e4d0; background:#e8faf3; color:#08745d; }
#bshq-vocab-root .bshq-admin-grammar-chip.has-error { border-color:#fecdd3; background:#fff1f2; color:#be123c; }
#bshq-vocab-root .bshq-admin-grammar-chip.is-pending { border-color:#fde68a; background:#fffbeb; color:#a16207; }
@media (max-width:700px) { #bshq-vocab-root .bshq-tag-complete-badge { width:100%; } }
