.bkg-app {
  --bkg-primary: #3bcdaa;
  --bkg-primary-dark: #168f73;
  --bkg-secondary: #69bbf5;
  --bkg-ink: #18212a;
  --bkg-muted: #5f6b76;
  --bkg-surface: #ffffff;
  --bkg-soft: #f0f7f6;
  --bkg-border: #dfe9e7;
  --bkg-coral: #ff806f;
  --bkg-yellow: #ffd568;
  --card-vocab-1: #F1F0FE;
  --card-vocab-2: #EDF7FE;
  --card-vocab-3: #F0F9F3;
  --card-vocab-4: #FBF5D7;
  --bkg-shadow: 0 18px 50px rgba(24, 33, 42, .12);
  width: 100%;
  min-height: calc(100svh - 24px);
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid var(--bkg-border);
  border-radius: 24px;
  background: var(--bkg-surface);
  box-shadow: var(--bkg-shadow);
  color: var(--bkg-ink);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  isolation: isolate;
}

.bkg-app *, .bkg-app *::before, .bkg-app *::after { box-sizing: border-box; }
.bkg-app button { font: inherit; }
.bkg-app button:focus-visible { outline: 4px solid rgba(105, 187, 245, .6); outline-offset: 3px; }
.bkg-app [hidden] { display: none !important; }
.bkg-app:fullscreen { width: 100%; min-height: 100svh; margin: 0; border: 0; border-radius: 0; }

.bkg-loading {
  display: grid;
  min-height: inherit;
  place-content: center;
  justify-items: center;
  gap: 16px;
  background: radial-gradient(circle at 50% 20%, rgba(59, 205, 170, .2), transparent 36%), var(--bkg-soft);
  font-weight: 800;
}

.bkg-loading__face, .bkg-character span {
  display: grid;
  width: 68px;
  aspect-ratio: 1;
  place-items: center;
  border-radius: 42% 58% 54% 46%;
  background: var(--bkg-primary);
  color: #063e37;
  font-size: 25px;
  font-weight: 900;
  transform: rotate(-4deg);
}

.bkg-shell { display:flex; min-height:inherit; flex-direction:column; background:linear-gradient(180deg,#fff,#f7fbfa); }
.bkg-topbar {
  display: grid;
  grid-template-columns: 52px 1fr auto 52px;
  align-items: center;
  min-height: 76px;
  padding: 10px 20px;
  border-bottom: 1px solid var(--bkg-border);
  background: rgba(255, 255, 255, .93);
}

.bkg-topbar > [data-bkg-home] { grid-column: 1; }
.bkg-brand { display: flex; grid-column: 2; min-width: 0; align-items: center; justify-content: center; gap: 10px; }
.bkg-top-links { display: flex; grid-column: 3; align-items: center; gap: 6px; }
.bkg-top-links a { display: inline-flex; min-height: 42px; align-items: center; gap: 6px; padding: 7px 11px; border: 2px solid var(--bkg-border); border-radius: 999px; background: #fff; color: var(--bkg-ink); font-size: 12px; font-weight: 850; text-decoration: none; }
.bkg-top-links a:hover, .bkg-top-links a:focus-visible { border-color: var(--bkg-primary); background: #eafbf7; }
.bkg-top-links a span:first-child { font-size: 18px; }
.bkg-topbar > [data-bkg-fullscreen] { grid-column: 4; }
.bkg-brand > span:nth-child(2) { display: grid; line-height: 1.05; }
.bkg-brand .bkg-star-pill { display: inline-flex; min-height: 34px; align-items: center; padding: 5px 10px; border: 1px solid #f1d06d; border-radius: 999px; background: #fff8d9; color: #6c4f00; font-size: 13px; font-weight: 900; line-height: 1; }
.bkg-player-pill { overflow: hidden; max-width: 130px; color: var(--bkg-primary-dark); font-size: 13px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.bkg-player-tools { display:flex; min-width:0; align-items:center; justify-content:flex-end; gap:7px; }
.bkg-player-link,.bkg-player-tools .bkg-star-pill { display:inline-flex; min-height:44px; align-items:center; justify-content:center; gap:7px; padding:7px 13px; border:1px solid var(--bkg-border); border-radius:14px; background:var(--bkg-surface); color:var(--bkg-primary-dark); font-size:13px; font-weight:900; line-height:1; text-decoration:none; }
.bkg-player-link { overflow:hidden; max-width:190px; text-overflow:ellipsis; white-space:nowrap; }
.bkg-player-link:hover,.bkg-player-link:focus-visible { border-color:var(--bkg-primary); background:var(--bkg-soft); }
.bkg-brand strong { color: var(--bkg-primary-dark); font-size: 18px; letter-spacing: -.04em; }
.bkg-brand small { color: var(--bkg-muted); font-size: 9px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.bkg-brand__mark { display: grid; width: 38px; aspect-ratio: 1; place-items: center; border-radius: 12px; background: var(--bkg-primary); color: #063e37; font-weight: 900; transform: rotate(-5deg); }

.bkg-icon-button {
  display: grid;
  width: 48px;
  min-height: 48px;
  place-items: center;
  border: 1px solid var(--bkg-border);
  border-radius: 14px;
  background: var(--bkg-surface);
  color: var(--bkg-ink);
  cursor: pointer;
  font-size: 24px;
}
.bkg-icon-button:hover { border-color: var(--bkg-primary); background: var(--bkg-soft); }
.bkg-app:not(.is-playing) [data-bkg-fullscreen] { display:none; }

.bkg-main { min-height:calc(100svh - 100px); flex:1; }
.bkg-screen { width:min(100% - 48px,1500px); margin-inline:auto; }
.bkg-hub { padding:clamp(26px,4vh,52px) 0; }
.bkg-hub__intro { max-width:900px; margin:0 auto 24px; text-align:center; }
.bkg-eyebrow { margin: 0 0 10px; color: var(--bkg-primary-dark); font-size: 13px; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.bkg-hub h2, .bkg-complete h2 { margin: 0; font-size: clamp(38px, 7vw, 68px); letter-spacing: -.055em; line-height: 1.02; }
.bkg-hub__intro > p:last-child, .bkg-complete > p { color: var(--bkg-muted); font-size: clamp(16px, 2vw, 19px); }
.bkg-age-picker { max-width:1100px; margin:-8px auto 22px; text-align:center; }
.bkg-age-picker > p { margin: 0 0 9px; font-size: 13px; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }
.bkg-age-picker > div { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.bkg-age-picker button { display: grid; min-height: 64px; place-items: center; gap: 1px; padding: 8px; border: 2px solid var(--bkg-border); border-radius: 17px; background: #fff; color: var(--bkg-ink); cursor: pointer; font-size: 19px; font-weight: 900; }
.bkg-age-picker button small { color: var(--bkg-muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.bkg-age-picker button.is-selected { border-color: #9973dc; background: #f4efff; box-shadow: 0 7px 20px rgba(153,115,220,.18); }
.bkg-age-picker > small { display: block; margin-top: 9px; color: var(--bkg-muted); }
.bkg-age-disclosure { max-width:1100px; margin:-8px auto 18px; }
.bkg-age-disclosure > summary { display:flex; width:max-content; min-height:42px; align-items:center; justify-content:center; gap:8px; margin-inline:auto; padding:7px 13px; border:1px solid var(--bkg-border); border-radius:999px; background:var(--bkg-surface); color:var(--bkg-muted); cursor:pointer; font-size:12px; list-style:none; }
.bkg-age-disclosure > summary::-webkit-details-marker { display:none; }
.bkg-age-disclosure > summary strong { color:var(--bkg-primary-dark); font-size:13px; }
.bkg-age-disclosure > summary small { padding-left:8px; border-left:1px solid var(--bkg-border); font-weight:850; }
.bkg-age-disclosure[open] > summary { border-color:var(--bkg-primary); background:var(--bkg-soft); }
.bkg-age-disclosure .bkg-age-picker { margin:12px auto 22px; padding:14px; border:1px solid var(--bkg-border); border-radius:20px; background:var(--bkg-soft); }
.bkg-subject-hub { display:grid; align-content:center; min-height:calc(100svh - 100px); }
.bkg-subject-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; max-width:1400px; margin-inline:auto; }
.bkg-subject-card { display:grid; grid-template-columns:82px 1fr; align-items:center; gap:5px 17px; min-height:230px; padding:clamp(20px,2.4vw,30px); border:3px solid var(--bkg-border); border-radius:28px; background:#fff; color:var(--bkg-ink); box-shadow:0 15px 38px rgba(24,33,42,.1); cursor:pointer; text-align:left; }
.bkg-subject-card:hover { transform:translateY(-4px); box-shadow:0 20px 44px rgba(24,33,42,.14); }
.bkg-subject-card > span { grid-row:1/5; display:grid; width:82px; aspect-ratio:1; place-items:center; border-radius:24px; background:rgba(59,205,170,.2); font-size:46px; }
.bkg-subject-card > .bkg-icon img { display:block; width:78%; height:78%; object-fit:contain; }
.bkg-subject-card small { color:var(--bkg-primary-dark); font-size:13px; font-weight:900; letter-spacing:.06em; text-transform:uppercase; }
.bkg-subject-card strong { font-size:clamp(24px,2.25vw,34px); letter-spacing:-.045em; line-height:1.05; }
.bkg-subject-card em { color:var(--bkg-muted); font-size:16px; font-style:normal; line-height:1.45; }
.bkg-subject-card b { margin-top:8px; color:var(--bkg-primary-dark); font-size:15px; }
.bkg-subject-card--english { border-color:rgba(59,205,170,.72); background:linear-gradient(145deg,#fff,#effcf8); }
.bkg-subject-card--maths { border-color:rgba(153,115,220,.68); background:linear-gradient(145deg,#fff,#f4efff); }
.bkg-subject-card--maths > span { background:rgba(153,115,220,.18); }
.bkg-subject-card--cook { border-color:rgba(255,128,111,.72); background:linear-gradient(145deg,#fff,#fff2e9); }
.bkg-subject-card--cook > span { background:rgba(255,184,120,.22); }
.bkg-subject-card--shopping { border-color:rgba(232,174,52,.78); background:linear-gradient(145deg,#fff,#fff8df); }
.bkg-subject-card--shopping > span { background:rgba(255,213,104,.3); }
.bkg-subject-card--coding { border-color:rgba(52,150,211,.72); background:linear-gradient(145deg,#fff,#eaf7ff); }
.bkg-subject-card--coding > span { background:rgba(52,150,211,.17); }
.bkg-subject-card--geography { border-color:rgba(52,166,111,.72); background:linear-gradient(145deg,#fff,#edf9ef); }
.bkg-subject-card--geography > span { background:rgba(52,166,111,.17); }
.bkg-age-games { max-width:1400px; margin:0 auto 24px; padding:18px; border:1px solid var(--bkg-border); border-radius:24px; background:linear-gradient(145deg,#f3fbf8,#f7f2ff); }
.bkg-age-games__head { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:13px; }
.bkg-age-games__head h3 { margin:0; font-size:clamp(22px,2.4vw,32px); letter-spacing:-.035em; }
.bkg-age-games__head > span { color:var(--bkg-muted); font-size:12px; font-weight:800; }
.bkg-age-game-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.bkg-age-game { display:grid; grid-template-columns:58px 1fr auto; align-items:center; gap:4px 12px; min-height:108px; padding:14px; border:2px solid #fff; border-radius:19px; background:#fff; color:var(--bkg-ink); box-shadow:0 7px 20px rgba(24,33,42,.07); cursor:pointer; text-align:left; }
.bkg-age-game:hover { border-color:var(--bkg-primary); transform:translateY(-2px); }
.bkg-age-game > span { grid-row:1/3; font-size:40px; text-align:center; }
.bkg-age-game strong { font-size:18px; }
.bkg-age-game small { color:var(--bkg-muted); line-height:1.3; }
.bkg-age-game b { grid-column:3; grid-row:1/3; color:var(--bkg-primary-dark); font-size:13px; }
.bkg-center-links { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; max-width:1400px; margin:0 auto 20px; }
.bkg-profile-link { display:grid; grid-template-columns:52px 1fr 22px; align-items:center; gap:12px; min-height:82px; padding:13px 17px; border:2px solid rgba(153,115,220,.55); border-radius:20px; background:linear-gradient(145deg,#f7f2ff,#fff); color:var(--bkg-ink); text-decoration:none; box-shadow:0 7px 20px rgba(24,33,42,.06); }
.bkg-profile-link--leaderboard { border-color:rgba(240,183,45,.7); background:linear-gradient(145deg,#fff9d9,#fff); }
.bkg-profile-link > span:first-child { font-size:34px; text-align:center; }
.bkg-profile-link > span:nth-child(2) { display:grid; }
.bkg-profile-link strong { font-size:17px; }
.bkg-profile-link small { color:var(--bkg-muted); font-size:11px; }
.bkg-profile-link b { font-size:21px; }
.bkg-profile-link:hover { transform:translateY(-2px); box-shadow:0 12px 26px rgba(153,115,220,.17); }
.bkg-game-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; max-width:1400px; margin-inline:auto; }
.bkg-world-grid { grid-template-columns:repeat(4,1fr); max-width:1400px; }
.bkg-world-grid .bkg-game-card { grid-template-columns: 1fr; justify-items: center; text-align: center; }
.bkg-world-grid .bkg-game-card { min-height:170px; padding:18px; }
.bkg-world-grid .bkg-game-card__art { width:74px; font-size:38px; }
.bkg-world-card--farm { border-color: rgba(59, 205, 170, .75); background: linear-gradient(145deg, #fff, #f0fff7); }
.bkg-world-card--talk { border-color: rgba(105, 187, 245, .75); background: linear-gradient(145deg, #fff, #f1f8ff); }
.bkg-world-card--garage { border-color: rgba(255, 213, 104, .9); background: linear-gradient(145deg, #fff, #fff9e8); }
.bkg-game-card.is-coming { cursor: default; opacity: .62; box-shadow: none; }
.bkg-game-card.is-coming:hover { transform: none; border-color: var(--bkg-border); box-shadow: none; }
.bkg-activity-grid:has(.bkg-game-card:nth-child(3)) { grid-template-columns: repeat(3, 1fr); max-width: 1080px; }
.bkg-activity-grid:has(.bkg-game-card:only-child) { grid-template-columns:minmax(320px,720px); justify-content:center; }
.bkg-activity-grid .bkg-game-card { grid-template-columns: 82px 1fr; min-height: 185px; padding: 22px; }
.bkg-activity-grid .bkg-game-card__art { width: 78px; font-size: 40px; }
.bkg-game-card {
  display: grid;
  grid-template-columns: 104px 1fr;
  align-items: center;
  gap: 20px;
  min-height: 210px;
  padding: 26px;
  border: 2px solid var(--bkg-border);
  border-radius: 24px;
  background: var(--bkg-surface);
  color: var(--bkg-ink);
  box-shadow: 0 8px 24px rgba(24, 33, 42, .07);
  cursor: pointer;
  text-align: left;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.bkg-game-card:hover { transform: translateY(-5px); border-color: var(--bkg-primary); box-shadow: 0 16px 36px rgba(59, 205, 170, .2); }
.bkg-game-card--speak:hover { border-color: var(--bkg-secondary); box-shadow: 0 16px 36px rgba(105, 187, 245, .22); }
.bkg-game-card__art { display: grid; width: 98px; aspect-ratio: 1; place-items: center; border-radius: 30px; background: rgba(59,205,170,.16); font-size: 50px; transform: rotate(-4deg); }
.bkg-game-card--speak .bkg-game-card__art { background: rgba(105,187,245,.19); transform: rotate(4deg); }
.bkg-game-card--shopping { border-color:rgba(224,173,56,.72); background:linear-gradient(145deg,#fff,#fff8df); }
.bkg-game-card--shopping .bkg-game-card__art { background:rgba(255,213,104,.28); }
.bkg-game-card > span:last-child { display: grid; gap: 6px; }
.bkg-game-card small { color: var(--bkg-primary-dark); font-size: 11px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.bkg-game-card--speak small { color: #277aad; }
.bkg-game-card strong { font-size: clamp(20px, 2.5vw, 28px); letter-spacing: -.035em; line-height: 1.1; }
.bkg-game-card em { color: var(--bkg-muted); font-size: 14px; font-style: normal; line-height: 1.45; }
.bkg-levels { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.bkg-level-card {
  display: grid;
  min-height: 250px;
  place-items: center;
  align-content: center;
  gap: 9px;
  padding: 24px;
  border: 2px solid var(--bkg-border);
  border-radius: 22px;
  background: var(--bkg-surface);
  color: var(--bkg-ink);
  box-shadow: 0 6px 18px rgba(24, 33, 42, .06);
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.bkg-level-card:hover { transform: translateY(-5px); border-color: var(--bkg-primary); box-shadow: 0 14px 30px rgba(59, 205, 170, .2); }
.bkg-level-card.is-recommended { border-color: #9973dc; background: linear-gradient(#fff,#f6f1ff); box-shadow: 0 12px 28px rgba(153,115,220,.2); }
.bkg-level-card.is-recommended::after { content: "Recommended"; padding: 4px 9px; border-radius: 999px; background: #9973dc; color: #fff; font-size: 10px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.bkg-level-card strong { font-size: 23px; }
.bkg-level-card small { color: var(--bkg-muted); font-size: 14px; }
.bkg-level-card__art { display: grid; width: 86px; aspect-ratio: 1; place-items: center; border-radius: 26px; background: rgba(59, 205, 170, .15); font-size: 45px; transform: rotate(-4deg); }
.bkg-level-card:nth-child(2) .bkg-level-card__art { background: rgba(105, 187, 245, .18); transform: rotate(4deg); }
.bkg-level-card:nth-child(3) .bkg-level-card__art { background: rgba(255, 213, 104, .22); }

.bkg-play { padding: 18px 0 26px; }
.bkg-statusbar { display: flex; min-height: 38px; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.bkg-progress { display: flex; flex-wrap:wrap; align-items: center; gap: 5px 7px; }
.bkg-progress__dot { width: 28px; height: 9px; border-radius: 999px; background: #dfe8e6; transition: background .2s, transform .2s; }
.bkg-progress__dot.is-done { background: var(--bkg-primary); }
.bkg-progress__dot.is-current { background: var(--bkg-secondary); transform: scaleY(1.35); }
.bkg-level-pill { padding: 7px 12px; border-radius: 999px; background: rgba(59, 205, 170, .14); color: var(--bkg-primary-dark); font-size: 12px; font-weight: 900; text-transform: uppercase; }
.bkg-review-nudge { display: flex; align-items: center; gap: 7px; margin: 10px auto 0; padding: 8px 16px; max-width: fit-content; border-radius: 999px; background: rgba(255, 179, 71, .16); color: #8a5a12; font-size: 13px; font-weight: 800; }
.bkg-review-nudge::before { content: "🔁"; font-size: 14px; }

.bkg-prompt-card {
  display: grid;
  grid-template-columns: 62px 1fr auto;
  align-items: center;
  gap: 16px;
  min-height: 102px;
  margin-bottom: 14px;
  padding: 15px 17px;
  border: 1px solid var(--bkg-border);
  border-radius: 20px;
  background: var(--bkg-surface);
  box-shadow: 0 7px 20px rgba(24, 33, 42, .06);
}
.bkg-character span { width: 58px; font-size: 25px; }
.bkg-prompt-card__copy { min-width: 0; }
.bkg-prompt-card__copy p { margin: 0; }
.bkg-prompt-card__speaker { color: var(--bkg-muted); font-size: 12px; font-weight: 850; text-transform: uppercase; letter-spacing: .07em; }
.bkg-caption { margin-top: 3px !important; font-size: clamp(17px, 2.4vw, 23px); font-weight: 850; line-height: 1.25; white-space:pre-line; }
.bkg-feedback { min-height: 22px; margin-top: 4px !important; color: var(--bkg-muted); font-size: 14px; font-weight: 750; }
.bkg-feedback.is-success { color: #168f73; }
.bkg-feedback.is-support { color: #536475; }
.bkg-listen-button {
  display: inline-flex;
  min-width: 126px;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 17px;
  border: 0;
  border-radius: 16px;
  background: var(--bkg-primary);
  box-shadow: 0 5px 14px rgba(59, 205, 170, .25);
  color: #063e37;
  cursor: pointer;
  font-weight: 900;
}
.bkg-listen-button:hover { background: #46d9b6; transform: translateY(-1px); }
.bkg-mic-button {
  display: grid;
  min-width: 104px;
  min-height: 72px;
  place-items: center;
  align-content: center;
  gap: 2px;
  padding: 8px 14px;
  border: 0;
  border-radius: 20px;
  background: var(--bkg-secondary);
  box-shadow: 0 6px 18px rgba(105,187,245,.28);
  color: #103d59;
  cursor: pointer;
  font-weight: 900;
}
.bkg-mic-button__icon { font-size: 25px; line-height: 1; }
.bkg-mic-button.is-listening { background: var(--bkg-coral); color: #4d1710; animation: bkg-mic-pulse 1s ease-in-out infinite; }
.bkg-mic-button.is-success { background: var(--bkg-primary); color: #063e37; }
.bkg-feedback.is-listening { color: #b23d30; }

.bkg-scene {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 2px solid #cfe2df;
  border-radius: 24px;
  background:
    linear-gradient(90deg, transparent 49.6%, rgba(105, 187, 245, .08) 50%, transparent 50.4%),
    linear-gradient(#e9f7fb 0 66%, #d4b68e 66% 100%);
  box-shadow: inset 0 0 60px rgba(59, 205, 170, .08), 0 10px 28px rgba(24, 33, 42, .08);
}
.bkg-scene::before { content: ""; position: absolute; inset: 66% 0 auto; height: 8px; background: #b98e63; box-shadow: 0 5px 0 rgba(255,255,255,.2); }
.bkg-scene.is-listening { animation: bkg-scene-listen .65s ease; }
.bkg-scene--farm {
  background: radial-gradient(circle at 82% 17%, #ffe17c 0 5%, transparent 5.2%), linear-gradient(#a9ddfa 0 54%, #8fd276 54% 78%, #67b85c 78% 100%);
}
.bkg-scene--farm::before { inset: 76% 0 auto; height: 24%; background: repeating-linear-gradient(12deg, rgba(255,255,255,.09) 0 12px, transparent 12px 26px), #71bc5e; box-shadow: none; }
.bkg-scene--farm::after { content: ""; position: absolute; left: 70%; top: 24%; z-index: 0; width: 22%; height: 28%; border-radius: 18px 18px 3px 3px; background: linear-gradient(135deg, transparent 16%, #9c3e35 16% 31%, transparent 31%), linear-gradient(90deg, #cc594f 0 42%, #fff 42% 49%, #cc594f 49% 100%); box-shadow: inset 0 -10px 0 rgba(0,0,0,.08); opacity: .72; pointer-events: none; }
.bkg-scene--farm .bkg-kitchen__window, .bkg-scene--farm .bkg-kitchen__cabinet, .bkg-scene--farm .bkg-kitchen__counter, .bkg-scene--farm .bkg-kitchen__rug { display: none; }
.bkg-scene--talk { background: radial-gradient(circle at 18% 22%, rgba(255,255,255,.65) 0 8%, transparent 8.4%), radial-gradient(circle at 82% 30%, rgba(255,255,255,.55) 0 10%, transparent 10.4%), linear-gradient(145deg, #bde9ff, #d8c7ff 58%, #ffdfad); }
.bkg-scene--talk::before { inset: auto 0 0; height: 20%; background: rgba(255,255,255,.28); box-shadow: none; }
.bkg-scene--talk .bkg-kitchen__window, .bkg-scene--talk .bkg-kitchen__cabinet, .bkg-scene--talk .bkg-kitchen__counter, .bkg-scene--talk .bkg-kitchen__rug { display: none; }
.bkg-scene--garage { background: radial-gradient(circle at 84% 15%, #ffe17c 0 5%, transparent 5.2%), linear-gradient(#a9ddfa 0 48%, #8bcf78 48% 62%, #68747d 62% 100%); }
.bkg-scene--garage::before { inset: 72% 0 auto; height: 8px; background: repeating-linear-gradient(90deg, #ffe17c 0 8%, transparent 8% 15%); box-shadow: none; }
.bkg-scene--garage::after { content: ""; position: absolute; right: 0; top: 43%; z-index: 0; width: 18%; height: 32%; border-radius: 50% 0 0 50%; background: rgba(64,170,220,.65); pointer-events: none; }
.bkg-scene--garage .bkg-kitchen__window, .bkg-scene--garage .bkg-kitchen__cabinet, .bkg-scene--garage .bkg-kitchen__counter, .bkg-scene--garage .bkg-kitchen__rug { display: none; }
.bkg-scene--topic { background: radial-gradient(circle at 12% 15%, rgba(255,255,255,.72) 0 7%, transparent 7.4%), radial-gradient(circle at 88% 22%, rgba(255,225,124,.42) 0 8%, transparent 8.4%), linear-gradient(145deg,#dff8f2,#eef1ff 55%,#fff5cf); }
.bkg-scene--topic::before { inset:auto 0 0; height:16%; background:rgba(255,255,255,.38); box-shadow:none; }
.bkg-scene--topic::after { content:""; position:absolute; inset:7% 4%; z-index:0; border:2px dashed rgba(23,143,121,.14); border-radius:28px; pointer-events:none; }
.bkg-scene--topic .bkg-kitchen__window, .bkg-scene--topic .bkg-kitchen__cabinet, .bkg-scene--topic .bkg-kitchen__counter, .bkg-scene--topic .bkg-kitchen__rug { display:none; }
.bkg-scene--maths { background:radial-gradient(circle at 12% 18%,rgba(255,225,124,.55) 0 7%,transparent 7.4%),radial-gradient(circle at 88% 22%,rgba(59,205,170,.25) 0 9%,transparent 9.4%),linear-gradient(145deg,#eef8ff,#f2edff 55%,#fff8d9); }
.bkg-scene--maths::before { inset:auto 0 0; height:14%; background:repeating-linear-gradient(90deg,rgba(153,115,220,.12) 0 5%,transparent 5% 10%); box-shadow:none; }
.bkg-scene--maths::after { content:"+  −  ×  ="; position:absolute; right:5%; top:5%; z-index:0; color:rgba(112,78,170,.12); font-size:clamp(32px,6vw,72px); font-weight:950; letter-spacing:.2em; pointer-events:none; }
.bkg-scene--maths .bkg-kitchen__window, .bkg-scene--maths .bkg-kitchen__cabinet, .bkg-scene--maths .bkg-kitchen__counter, .bkg-scene--maths .bkg-kitchen__rug { display:none; }
.bkg-scene--maths .bkg-object span { max-width:100%; color:#372662; font-size:clamp(21px,3.4vw,38px); font-weight:950; line-height:1.05; text-align:center; }
.bkg-scene--maths .bkg-object small { font-size:12px; }
.bkg-scene--cook { background:linear-gradient(#fff7e9 0 65%,#d8b38a 65% 100%); }
.bkg-scene--cook::before { inset:65% 0 auto; height:12px; background:#aa805e; box-shadow:0 8px 0 rgba(255,255,255,.28); }
.bkg-scene--cook::after { content:"Cook with Elif"; position:absolute; right:5%; top:7%; z-index:0; color:rgba(173,87,62,.1); font-size:clamp(30px,5vw,64px); font-weight:950; transform:rotate(-4deg); pointer-events:none; }
.bkg-scene--cook .bkg-kitchen__window, .bkg-scene--cook .bkg-kitchen__cabinet, .bkg-scene--cook .bkg-kitchen__counter, .bkg-scene--cook .bkg-kitchen__rug { display:none; }
.bkg-scene--coding { background:radial-gradient(circle at 13% 17%,rgba(91,205,255,.28) 0 8%,transparent 8.4%),radial-gradient(circle at 86% 78%,rgba(59,205,170,.24) 0 10%,transparent 10.4%),linear-gradient(145deg,#effaff,#edf3ff 55%,#f4efff); }
.bkg-scene--coding::before { inset:auto 0 0; height:15%; background:repeating-linear-gradient(90deg,rgba(52,150,211,.13) 0 4%,transparent 4% 8%); box-shadow:none; }
.bkg-scene--coding::after { content:"→  ↻  IF  ✓"; position:absolute; right:5%; top:5%; z-index:0; color:rgba(31,112,164,.12); font-size:clamp(30px,5vw,66px); font-weight:950; letter-spacing:.15em; pointer-events:none; }
.bkg-scene--coding .bkg-kitchen__window, .bkg-scene--coding .bkg-kitchen__cabinet, .bkg-scene--coding .bkg-kitchen__counter, .bkg-scene--coding .bkg-kitchen__rug { display:none; }
.bkg-scene--coding .bkg-object span { max-width:100%; color:#154768; font-size:clamp(20px,3.2vw,36px); font-weight:950; line-height:1.12; text-align:center; }
.bkg-scene--geography { background:radial-gradient(circle at 14% 18%,rgba(255,225,124,.48) 0 7%,transparent 7.4%),radial-gradient(circle at 84% 25%,rgba(255,255,255,.62) 0 9%,transparent 9.4%),linear-gradient(145deg,#cceeff,#e8f8ef 58%,#fff3ca); }
.bkg-scene--geography::before { inset:auto 0 0; height:17%; background:linear-gradient(10deg,rgba(61,158,93,.25),rgba(61,158,93,.08)); box-shadow:none; }
.bkg-scene--geography::after { content:"N  ↑   🌍   E  →"; position:absolute; right:5%; top:5%; z-index:0; color:rgba(34,115,89,.13); font-size:clamp(28px,5vw,62px); font-weight:950; letter-spacing:.12em; pointer-events:none; }
.bkg-scene--geography .bkg-kitchen__window, .bkg-scene--geography .bkg-kitchen__cabinet, .bkg-scene--geography .bkg-kitchen__counter, .bkg-scene--geography .bkg-kitchen__rug { display:none; }
.bkg-scene--geography .bkg-objects { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:center; gap:clamp(12px,2vw,28px); padding:clamp(70px,9vw,120px) clamp(20px,4vw,65px) clamp(35px,5vw,70px); }
.bkg-scene--geography .bkg-object { position:relative; left:auto; top:auto; width:100%; min-height:clamp(155px,18vw,230px); align-content:center; gap:10px; padding:14px; transform:none; border-color:rgba(255,255,255,.96); border-radius:28px; background:rgba(255,255,255,.9); }
.bkg-scene--geography .bkg-object:hover { z-index:3; transform:translateY(-4px); }
.bkg-scene--geography .bkg-object.is-correct { animation:bkg-rich-celebrate .8s ease both; }
.bkg-scene--geography .bkg-object.is-try-again { animation:bkg-rich-wiggle .45s ease; }
.bkg-scene--geography .bkg-object.is-hint { animation:bkg-rich-hint 1.15s ease-in-out infinite; }
.bkg-scene--geography .bkg-object > span { display:block; width:100%; max-width:100%; color:#165d45; font-size:clamp(20px,3.2vw,36px); font-weight:950; line-height:1.12; text-align:center; }
.bkg-scene--geography .bkg-object small { display:block; color:#153d33; font-size:clamp(13px,1.4vw,18px); font-weight:900; line-height:1.2; text-align:center; }
.bkg-rich-visual { position:relative; display:grid; width:100%; min-height:112px; place-items:center; overflow:hidden; border-radius:20px; }
.bkg-rich-visual svg { display:block; width:100%; height:112px; overflow:visible; }
.bkg-rich-visual--map { background:linear-gradient(145deg,#e7f8ff,#f6fbff); }
.bkg-map-water { fill:#bde8f8; stroke:#5aa8c4; stroke-width:1.5; }
.bkg-map-region { fill:#dce8d7; stroke:#397660; stroke-linejoin:round; stroke-width:1.25; transition:fill .2s ease,transform .2s ease; transform-box:fill-box; transform-origin:center; }
.bkg-map-region.is-highlight { fill:#ffd568; stroke:#a56316; stroke-width:2.25; transform:scale(1.06); }
.bkg-ocean-region { fill:#328fd0; opacity:.72; }
.bkg-rich-visual--compass { background:radial-gradient(circle,#fff 0 52%,#e6f5f1 53% 100%); }
.bkg-rich-visual--compass circle { fill:#fff; stroke:#2f7762; stroke-width:2.5; }
.bkg-compass-cross { fill:none; stroke:#9bc7ba; stroke-width:1.5; }
.bkg-compass-arrow { fill:#f37f6d; stroke:#693127; stroke-linejoin:round; stroke-width:1.5; }
.bkg-compass-tail { fill:#b9dcd2; stroke:#397660; stroke-linejoin:round; stroke-width:1.2; }
.bkg-rich-visual--compass text { fill:#153d33; font:900 9px sans-serif; text-anchor:middle; }
.bkg-rich-visual--scene, .bkg-rich-visual--country, .bkg-rich-visual--city, .bkg-rich-visual--kit { background:linear-gradient(145deg,#dff5ff,#eff8e9 58%,#fff2c7); }
.bkg-rich-visual--country { background:linear-gradient(160deg,#eaf7ff 0 58%,#d9efd2 58%); }
.bkg-rich-visual--city { background:linear-gradient(#dff3ff 0 66%,#ead8b9 66%); }
.bkg-rich-visual--kit { background:linear-gradient(145deg,#fff8dd,#e8f7f2); }
.bkg-rich-visual > b { position:relative; z-index:2; font-size:clamp(48px,6vw,76px); line-height:1; filter:drop-shadow(0 5px 4px rgba(24,33,42,.14)); }
.bkg-rich-visual > i { position:absolute; right:8%; bottom:9%; width:22%; aspect-ratio:1; border-radius:50%; background:rgba(59,205,170,.24); }
.bkg-rich-visual--country > i::before { content:""; position:absolute; left:45%; top:-150%; width:10%; height:170%; border-radius:8px; background:#f37f6d; transform:rotate(18deg); transform-origin:bottom; }
.bkg-rich-visual--city > i { width:8px; height:36px; border-radius:8px 8px 2px 2px; background:#f37f6d; }
.bkg-rich-visual--city > i::before { content:""; position:absolute; left:50%; top:-8px; width:17px; aspect-ratio:1; border:4px solid #f37f6d; border-radius:50% 50% 50% 0; background:#fff; transform:translateX(-50%) rotate(-45deg); }
@keyframes bkg-rich-celebrate { 50% { transform:translateY(-8px) scale(1.04); } }
@keyframes bkg-rich-wiggle { 25% { transform:translateX(-8px); } 50% { transform:translateX(8px); } 75% { transform:translateX(-4px); } }
@keyframes bkg-rich-hint { 50% { transform:translateY(-5px); box-shadow:0 0 0 8px rgba(255,213,104,.34),0 12px 25px rgba(24,33,42,.18); } }
.bkg-caption.is-safety { padding:9px 13px; border:2px solid #ef8b64; border-radius:14px; background:#fff1e8; color:#7e301c; }
.bkg-map-puzzle { padding:22px 0 38px; }
.bkg-world-map { position:relative; min-height:clamp(330px,52vw,650px); overflow:hidden; margin-top:18px; border:4px solid #fff; border-radius:32px; background:radial-gradient(circle at 16% 17%,rgba(255,255,255,.7) 0 5%,transparent 5.4%),linear-gradient(155deg,#87d4f4,#bfeafa); box-shadow:0 18px 42px rgba(28,91,120,.18); isolation:isolate; }
.bkg-world-map::before { content:""; position:absolute; inset:0; z-index:-1; background:repeating-linear-gradient(0deg,transparent 0 19.7%,rgba(255,255,255,.2) 20%),repeating-linear-gradient(90deg,transparent 0 19.7%,rgba(255,255,255,.2) 20%); }
.bkg-map-target { position:absolute; left:var(--bkg-map-x); top:var(--bkg-map-y); display:grid; width:var(--bkg-map-w); height:var(--bkg-map-h); place-items:center; padding:8px; transform:translate(-50%,-50%) rotate(var(--bkg-map-r,0deg)); border:3px dashed rgba(29,105,79,.5); border-radius:var(--bkg-map-radius,45%); background:rgba(233,246,211,.4); color:#165d45; cursor:pointer; font-size:clamp(11px,1.4vw,17px); font-weight:900; text-align:center; }
.bkg-map-target:disabled { border-style:solid; border-color:rgba(29,105,79,.16); background:rgba(233,246,211,.24); cursor:default; }
.bkg-map-target.is-selected-target { border-color:#7650bd; background:#f1eaff; box-shadow:0 0 0 7px rgba(153,115,220,.2); }
.bkg-map-target.is-filled { border-style:solid; border-color:#168f73; background:#dff8e5; animation:bkg-map-pop .45s ease both; }
.bkg-map-target.is-guide { border-style:solid; border-color:rgba(29,105,79,.13); background:rgba(233,246,211,.18); cursor:default; }
.bkg-map-target[data-continent="north-america"] { --bkg-map-radius:55% 40% 52% 35%; }
.bkg-map-target[data-continent="south-america"] { --bkg-map-radius:48% 55% 65% 35%; }
.bkg-map-target[data-continent="europe"] { --bkg-map-radius:55% 45% 60% 40%; }
.bkg-map-target[data-continent="africa"] { --bkg-map-radius:45% 60% 55% 65%; }
.bkg-map-target[data-continent="asia"] { --bkg-map-radius:60% 42% 52% 38%; }
.bkg-map-target[data-continent="australia"] { --bkg-map-radius:55% 48% 60% 45%; }
.bkg-map-target[data-continent="antarctica"] { --bkg-map-radius:50%; }
.bkg-map-tray { display:grid; justify-items:center; gap:12px; margin-top:18px; padding:18px; border:2px solid var(--bkg-border); border-radius:26px; background:#fff; }
.bkg-map-tray h3 { margin:0; font-size:20px; }
.bkg-map-pieces { display:flex; width:100%; flex-wrap:wrap; justify-content:center; gap:10px; min-height:82px; }
.bkg-map-piece { display:grid; min-width:130px; min-height:70px; place-items:center; gap:2px; padding:10px 14px; touch-action:none; border:3px solid #56a985; border-radius:26px 18px 24px 16px; background:linear-gradient(145deg,#f4ffd9,#c9f1bd); color:#164f3e; box-shadow:0 7px 18px rgba(24,85,65,.14); cursor:grab; font-weight:900; user-select:none; }
.bkg-map-piece small { font-size:10px; font-weight:800; text-transform:uppercase; }
.bkg-map-piece:hover { transform:translateY(-2px); }
.bkg-map-piece.is-selected { border-color:#7650bd; background:#f1eaff; box-shadow:0 0 0 6px rgba(153,115,220,.18); }
.bkg-map-piece.is-dragging { position:relative; z-index:20; pointer-events:none; cursor:grabbing; opacity:.9; }
@keyframes bkg-map-pop { 50% { transform:translate(-50%,-50%) rotate(var(--bkg-map-r,0deg)) scale(1.1); } }
.bkg-spatial-build-game { padding:22px 0 38px; }
.bkg-spatial-build-workspace { display:grid; grid-template-columns:minmax(430px,1.35fr) minmax(260px,.65fr); gap:22px; margin-top:20px; }
.bkg-spatial-build-board { position:relative; min-height:clamp(470px,50vw,650px); overflow:hidden; border:5px solid #fff; border-radius:32px; background:linear-gradient(rgba(255,255,255,.5) 2px,transparent 2px),linear-gradient(90deg,rgba(255,255,255,.5) 2px,transparent 2px),radial-gradient(circle at 50% 50%,rgba(255,218,91,.25) 0 12%,transparent 12.5%),linear-gradient(145deg,#d9f7ef,#e9edff 62%,#fff2c8); background-size:25% 25%,25% 25%,auto,auto; box-shadow:0 16px 38px rgba(59,53,114,.16); }
.bkg-spatial-build-board::before, .bkg-spatial-build-board::after { content:""; position:absolute; z-index:0; background:rgba(94,78,168,.13); pointer-events:none; }
.bkg-spatial-build-board::before { left:9%; right:9%; top:48%; height:5%; border-radius:999px; }
.bkg-spatial-build-board::after { top:9%; bottom:9%; left:48%; width:5%; border-radius:999px; }
.bkg-spatial-build-target { position:absolute; left:var(--bkg-build-x); top:var(--bkg-build-y); z-index:2; display:grid; width:clamp(105px,13vw,155px); min-height:clamp(100px,12vw,145px); place-items:center; gap:2px; padding:9px; transform:translate(-50%,-50%); border:4px dashed #8d75c8; border-radius:26px; background:rgba(255,255,255,.86); color:#33275f; box-shadow:0 8px 20px rgba(50,39,95,.12); cursor:pointer; }
.bkg-spatial-build-target small { color:#7158ae; font-size:10px; font-weight:950; letter-spacing:.08em; text-transform:uppercase; }
.bkg-spatial-build-target span { font-size:clamp(30px,4vw,54px); line-height:1; }
.bkg-spatial-build-target strong { font-size:12px; }
.bkg-spatial-build-target.is-selected-target { border-color:#20a98a; background:#e9fff8; box-shadow:0 0 0 7px rgba(32,169,138,.17); }
.bkg-spatial-build-target.is-filled { border-style:solid; border-color:#28a98c; background:#f1fff9; animation:bkg-build-pop .5s ease both; cursor:default; }
.bkg-spatial-build-tray { display:grid; align-content:start; gap:13px; padding:22px; border:3px solid rgba(118,80,189,.25); border-radius:30px; background:linear-gradient(160deg,#fff,#f8f5ff); box-shadow:0 14px 32px rgba(42,34,78,.1); }
.bkg-spatial-build-tray h3, .bkg-spatial-build-tray p { margin:0; }
.bkg-spatial-build-pieces { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.bkg-spatial-build-piece { display:grid; min-height:112px; place-items:center; gap:3px; padding:9px; touch-action:none; border:3px solid #62b7a3; border-radius:21px; background:#effcf8; color:#193c35; box-shadow:0 6px 14px rgba(28,92,76,.11); cursor:grab; user-select:none; }
.bkg-spatial-build-piece small { color:#6b5a91; font-size:9px; font-weight:900; text-transform:uppercase; }
.bkg-spatial-build-piece span { font-size:42px; line-height:1; }
.bkg-spatial-build-piece strong { font-size:12px; text-align:center; }
.bkg-spatial-build-piece:hover { transform:translateY(-2px); border-color:#7650bd; }
.bkg-spatial-build-piece.is-selected { border-color:#7650bd; background:#f2ecff; box-shadow:0 0 0 6px rgba(118,80,189,.15); }
.bkg-spatial-build-piece.is-dragging { position:relative; z-index:30; pointer-events:none; opacity:.9; cursor:grabbing; }
@keyframes bkg-build-pop { 50% { transform:translate(-50%,-58%) scale(1.08); } }
.bkg-spatial-position-game { padding:22px 0 38px; }
.bkg-spatial-position-workspace { display:grid; grid-template-columns:minmax(0,1fr) 250px; gap:20px; margin-top:20px; }
.bkg-spatial-position-board { position:relative; min-height:clamp(520px,54vw,680px); overflow:hidden; border:5px solid #fff; border-radius:34px; background:linear-gradient(rgba(255,255,255,.42) 2px,transparent 2px),linear-gradient(90deg,rgba(255,255,255,.42) 2px,transparent 2px),linear-gradient(145deg,#dcf8f1,#eef0ff 62%,#fff4ce); background-size:25% 25%,25% 25%,auto; box-shadow:0 16px 38px rgba(53,48,104,.15); }
.bkg-spatial-position-board::after { position:absolute; right:18px; bottom:13px; color:#67558e; content:"Look at the whole scene"; font-size:11px; font-weight:900; }
.bkg-spatial-position-reference, .bkg-spatial-position-zone { position:absolute; left:var(--bkg-position-x); top:var(--bkg-position-y); transform:translate(-50%,-50%); }
.bkg-spatial-position-reference { z-index:2; display:grid; width:clamp(105px,14vw,150px); min-height:clamp(110px,14vw,155px); place-items:center; align-content:center; gap:7px; padding:10px; border:4px solid #fff; border-radius:29px; background:rgba(255,255,255,.94); color:#302652; box-shadow:0 10px 24px rgba(45,37,83,.14); text-align:center; pointer-events:none; }
.bkg-spatial-position-reference.is-large { width:clamp(145px,20vw,210px); min-height:clamp(145px,20vw,210px); opacity:.82; }
.bkg-spatial-position-reference span { font-size:clamp(42px,6vw,67px); line-height:1; }
.bkg-spatial-position-reference.is-large span { font-size:clamp(74px,10vw,112px); }
.bkg-spatial-position-reference strong { font-size:14px; }
.bkg-spatial-position-zone { z-index:3; display:grid; width:clamp(88px,11vw,118px); min-height:clamp(88px,11vw,118px); place-items:center; align-content:center; gap:3px; padding:8px; border:4px dashed #8f73c5; border-radius:50%; background:rgba(255,255,255,.68); color:#6f589f; cursor:pointer; }
.bkg-spatial-position-zone > span { font-size:30px; line-height:1; }
.bkg-spatial-position-zone small { font-size:10px; font-weight:900; }
.bkg-spatial-position-zone:hover:not(:disabled), .bkg-spatial-position-zone.is-selected-target { border-color:#24ad8f; background:#eafff8; transform:translate(-50%,-53%) scale(1.04); }
.bkg-spatial-position-zone.is-correct { border-style:solid; border-color:#24ad8f; background:#dffbef; color:#174f43; animation:bkg-position-correct .72s ease both; }
.bkg-spatial-position-zone.is-correct span { font-size:46px; }
.bkg-spatial-position-zone.is-correct strong { font-size:13px; }
.bkg-spatial-position-tray { display:grid; align-content:start; gap:17px; padding:22px 18px; border:3px solid #d9d2ea; border-radius:29px; background:linear-gradient(160deg,#fff,#f2edff); box-shadow:0 13px 30px rgba(53,48,104,.11); }
.bkg-spatial-position-tray h3 { margin:2px 0 0; color:#302652; font-size:21px; }
.bkg-spatial-position-elif { display:grid; width:100%; min-height:160px; place-items:center; align-content:center; gap:5px; padding:13px; border:4px solid #39c9a9; border-radius:26px; background:#e8fff8; color:#174f43; cursor:grab; touch-action:none; }
.bkg-spatial-position-elif span { font-size:67px; line-height:1; }
.bkg-spatial-position-elif strong { font-size:18px; }
.bkg-spatial-position-elif small { font-size:10px; font-weight:850; }
.bkg-spatial-position-elif.is-selected { outline:7px solid rgba(118,80,189,.2); border-color:#7650bd; }
.bkg-spatial-position-elif.is-dragging { z-index:10; cursor:grabbing; opacity:.88; }
@keyframes bkg-position-correct { 50% { transform:translate(-50%,-55%) scale(1.12); box-shadow:0 0 0 10px rgba(55,201,168,.2); } }
.bkg-spatial-memory-game { padding:22px 0 38px; }
.bkg-spatial-memory-workspace { display:grid; gap:20px; margin-top:20px; }
.bkg-spatial-memory-preview, .bkg-spatial-memory-rebuild { padding:clamp(20px,3vw,34px); border:4px solid #fff; border-radius:32px; box-shadow:0 14px 34px rgba(53,48,104,.13); }
.bkg-spatial-memory-preview { background:linear-gradient(135deg,#dff8f2,#eef0ff); }
.bkg-spatial-memory-rebuild { background:linear-gradient(135deg,#fff8dc,#f2ecff); }
.bkg-spatial-memory-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.bkg-spatial-memory-heading h3, .bkg-spatial-memory-rebuild h3 { margin:2px 0 18px; color:#302652; font-size:clamp(20px,2.8vw,30px); }
.bkg-spatial-memory-heading h3 { margin-bottom:0; }
.bkg-spatial-memory-route, .bkg-spatial-memory-recall { display:flex; min-height:150px; align-items:center; justify-content:center; gap:clamp(5px,1.2vw,14px); margin-top:22px; padding:16px; overflow-x:auto; border-radius:25px; background:rgba(255,255,255,.72); }
.bkg-spatial-memory-route > i, .bkg-spatial-memory-recall > i { flex:0 0 auto; color:#7650bd; font-size:clamp(18px,3vw,30px); font-style:normal; font-weight:950; }
.bkg-spatial-memory-stop, .bkg-spatial-memory-recall-slot { position:relative; display:grid; flex:0 0 clamp(92px,13vw,138px); min-height:116px; place-items:center; align-content:center; gap:5px; padding:12px 7px; border:3px solid #fff; border-radius:23px; background:#fff; color:#302652; box-shadow:0 8px 19px rgba(45,37,83,.12); transition:transform .24s ease,opacity .24s ease,filter .24s ease; }
.bkg-spatial-memory-stop small, .bkg-spatial-memory-recall-slot small { position:absolute; left:8px; top:7px; display:grid; width:22px; height:22px; place-items:center; border-radius:50%; background:#7650bd; color:#fff; font-size:11px; font-weight:950; }
.bkg-spatial-memory-stop span, .bkg-spatial-memory-recall-slot span { font-size:clamp(33px,5vw,52px); line-height:1; }
.bkg-spatial-memory-stop strong, .bkg-spatial-memory-recall-slot strong { font-size:12px; text-align:center; }
.bkg-spatial-memory-stop.is-hidden { color:#7d7496; filter:saturate(0); }
.bkg-spatial-memory-stop.is-hidden span { font-size:0; }
.bkg-spatial-memory-stop.is-hidden span::after { content:"?"; color:#8b7ca8; font-size:46px; }
.bkg-spatial-memory-stop.is-hidden strong { visibility:hidden; }
.bkg-spatial-memory-stop.is-showing { z-index:2; transform:translateY(-7px) scale(1.08); border-color:#39c9a9; box-shadow:0 0 0 8px rgba(57,201,169,.18),0 12px 24px rgba(45,37,83,.18); }
.bkg-spatial-memory-recall { min-height:144px; margin-top:10px; border:3px dashed rgba(118,80,189,.23); }
.bkg-spatial-memory-recall-slot { border-color:#ded6f4; background:rgba(255,255,255,.75); box-shadow:none; }
.bkg-spatial-memory-recall-slot:not(.is-filled) { color:#958ba9; }
.bkg-spatial-memory-recall-slot.is-filled { border-color:#9b7ddd; background:#fff; }
.bkg-spatial-memory-choices { display:grid; grid-template-columns:repeat(auto-fit,minmax(105px,1fr)); gap:10px; margin-top:16px; }
.bkg-spatial-memory-choice { display:grid; min-height:112px; place-items:center; align-content:center; gap:6px; padding:10px; border:3px solid #c8ded8; border-radius:22px; background:#fff; color:#292240; cursor:pointer; }
.bkg-spatial-memory-choice span { font-size:39px; line-height:1; }
.bkg-spatial-memory-choice strong { font-size:13px; }
.bkg-spatial-memory-choice:hover:not(:disabled) { border-color:#7650bd; transform:translateY(-3px); }
.bkg-spatial-memory-choice:disabled { opacity:.38; cursor:not-allowed; }
.bkg-spatial-memory-controls { display:flex; justify-content:flex-end; gap:10px; flex-wrap:wrap; margin-top:18px; }
.bkg-spatial-memory-controls .bkg-button--primary { min-width:180px; }
.bkg-spatial-memory-recall.is-try-again { animation:bkg-rich-wiggle .48s ease; }
.bkg-spatial-memory-recall.is-correct { animation:bkg-memory-correct .75s ease both; }
@keyframes bkg-memory-correct { 50% { transform:scale(1.02); box-shadow:0 0 0 10px rgba(55,201,168,.19); } }
.bkg-perspective-game { padding:22px 0 38px; }
.bkg-perspective-scene { position:relative; min-height:clamp(520px,55vw,700px); overflow:hidden; margin-top:20px; border:5px solid #fff; border-radius:34px; background:linear-gradient(rgba(255,255,255,.42) 2px,transparent 2px),linear-gradient(90deg,rgba(255,255,255,.42) 2px,transparent 2px),radial-gradient(circle at 50% 50%,rgba(255,218,91,.25) 0 14%,transparent 14.5%),linear-gradient(145deg,#dcf8f1,#ecefff 62%,#fff3cc); background-size:25% 25%,25% 25%,auto,auto; box-shadow:0 16px 38px rgba(53,48,104,.15); }
.bkg-perspective-scene::before, .bkg-perspective-scene::after { content:""; position:absolute; z-index:0; background:rgba(94,78,168,.1); pointer-events:none; }
.bkg-perspective-scene::before { left:8%; right:8%; top:49%; height:2%; }
.bkg-perspective-scene::after { top:8%; bottom:8%; left:49%; width:2%; }
.bkg-perspective-compass { position:absolute; inset:18px; z-index:1; color:#685399; font-size:13px; font-weight:950; pointer-events:none; }
.bkg-perspective-compass span { position:absolute; }
.bkg-perspective-compass span:nth-child(1) { left:50%; top:0; transform:translateX(-50%); }
.bkg-perspective-compass span:nth-child(2) { right:0; top:50%; transform:translateY(-50%); }
.bkg-perspective-compass span:nth-child(3) { left:50%; bottom:0; transform:translateX(-50%); }
.bkg-perspective-compass span:nth-child(4) { left:0; top:50%; transform:translateY(-50%); }
.bkg-perspective-elif { position:absolute; left:50%; top:50%; z-index:3; display:grid; width:clamp(105px,14vw,155px); min-height:clamp(120px,15vw,170px); place-items:center; align-content:center; gap:1px; transform:translate(-50%,-50%); border:5px solid #fff; border-radius:36px; background:#3bc9aa; color:#153d35; box-shadow:0 12px 25px rgba(24,79,67,.2); }
.bkg-perspective-elif i { position:absolute; left:50%; top:-34%; color:#604494; font-size:clamp(42px,6vw,72px); font-style:normal; font-weight:950; transform:translateX(-50%) rotate(var(--bkg-facing,0deg)); transform-origin:50% 86%; transition:transform .3s ease; }
.bkg-perspective-elif span { font-size:clamp(44px,6vw,68px); line-height:1; }
.bkg-perspective-elif strong { font-size:14px; }
.bkg-perspective-object { position:absolute; left:var(--bkg-view-x); top:var(--bkg-view-y); z-index:2; display:grid; width:clamp(115px,15vw,170px); min-height:clamp(105px,13vw,150px); place-items:center; align-content:center; gap:6px; padding:10px; transform:translate(-50%,-50%); border:4px solid #fff; border-radius:28px; background:rgba(255,255,255,.92); color:#2e2850; box-shadow:0 10px 24px rgba(45,37,83,.14); cursor:pointer; }
.bkg-perspective-object span { font-size:clamp(36px,5vw,60px); line-height:1; }
.bkg-perspective-object strong { font-size:clamp(12px,1.4vw,16px); text-align:center; }
.bkg-perspective-object:hover { border-color:#7650bd; transform:translate(-50%,-54%); }
.bkg-perspective-object.is-try-again { animation:bkg-perspective-wiggle .45s ease; }
.bkg-perspective-object.is-correct { border-color:#25a98b; background:#e9fff7; animation:bkg-perspective-correct .72s ease both; }
@keyframes bkg-perspective-wiggle { 25% { transform:translate(calc(-50% - 8px),-50%); } 50% { transform:translate(calc(-50% + 8px),-50%); } 75% { transform:translate(calc(-50% - 4px),-50%); } }
@keyframes bkg-perspective-correct { 50% { transform:translate(-50%,-58%) scale(1.08); box-shadow:0 0 0 10px rgba(55,201,168,.2); } }
.bkg-rotation-game { padding:22px 0 38px; }
.bkg-rotation-workspace { display:grid; grid-template-columns:minmax(240px,1fr) 70px minmax(240px,1fr); align-items:center; gap:18px; margin-top:20px; padding:clamp(22px,4vw,46px); border:5px solid #fff; border-radius:34px; background:linear-gradient(rgba(255,255,255,.35) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.35) 1px,transparent 1px),linear-gradient(145deg,#dff8f2,#efedff 60%,#fff3cc); background-size:54px 54px,54px 54px,auto; box-shadow:0 16px 38px rgba(61,49,115,.14); }
.bkg-rotation-card { display:grid; min-height:330px; place-items:center; align-content:center; gap:16px; padding:24px; border:3px solid rgba(118,80,189,.2); border-radius:30px; background:rgba(255,255,255,.87); text-align:center; }
.bkg-rotation-card small { color:#6d589b; font-size:12px; font-weight:950; letter-spacing:.12em; text-transform:uppercase; }
.bkg-rotation-card strong { color:#33275f; font-size:15px; }
.bkg-rotation-arrow { color:#7650bd; font-size:clamp(40px,6vw,72px); font-weight:950; text-align:center; }
.bkg-rotation-object { display:grid; width:clamp(135px,18vw,210px); aspect-ratio:1; place-items:center; transform:rotate(var(--bkg-rotation,0deg)); transition:transform .32s ease; }
.bkg-rotation-shape { position:relative; display:block; width:74%; height:74%; background:#805fd0; filter:drop-shadow(0 9px 8px rgba(51,39,95,.18)); }
.bkg-rotation-card--target .bkg-rotation-shape { background:#d8d2e8; outline:4px dashed #8877ac; outline-offset:7px; filter:none; }
.bkg-rotation-shape--arrow { clip-path:polygon(0 34%,58% 34%,58% 8%,100% 50%,58% 92%,58% 66%,0 66%); }
.bkg-rotation-shape--triangle { clip-path:polygon(50% 4%,96% 92%,4% 92%); }
.bkg-rotation-shape--corner { clip-path:polygon(8% 8%,44% 8%,44% 58%,92% 58%,92% 92%,8% 92%); }
.bkg-rotation-shape--step { clip-path:polygon(5% 5%,45% 5%,45% 32%,70% 32%,70% 58%,95% 58%,95% 95%,55% 95%,55% 68%,30% 68%,30% 42%,5% 42%); }
.bkg-rotation-shape--flag { clip-path:polygon(12% 5%,27% 5%,27% 18%,91% 18%,72% 45%,91% 72%,27% 72%,27% 95%,12% 95%); }
.bkg-rotation-shape--hook { clip-path:polygon(10% 8%,46% 8%,46% 58%,72% 58%,72% 36%,94% 36%,94% 74%,82% 92%,42% 92%,10% 64%); }
.bkg-rotation-shape--bolt { clip-path:polygon(55% 2%,20% 54%,46% 54%,34% 98%,82% 40%,56% 40%); }
.bkg-rotation-shape--double-corner { clip-path:polygon(5% 5%,42% 5%,42% 35%,95% 35%,95% 95%,58% 95%,58% 65%,5% 65%); }
.bkg-rotation-shape--key { clip-path:polygon(8% 36%,48% 36%,48% 20%,72% 20%,72% 36%,92% 36%,92% 64%,70% 64%,70% 82%,48% 82%,48% 64%,8% 64%); }
.bkg-rotation-object.is-turning .bkg-rotation-shape { animation:bkg-rotation-pulse .34s ease; }
.bkg-rotation-object.is-try-again .bkg-rotation-shape { animation:bkg-rich-wiggle .45s ease; }
.bkg-rotation-object.is-correct .bkg-rotation-shape { animation:bkg-rotation-fit .72s ease both; }
.bkg-rotation-controls { display:flex; justify-content:center; gap:10px; flex-wrap:wrap; margin-top:20px; }
.bkg-rotation-controls .bkg-button--primary { min-width:190px; }
@keyframes bkg-rotation-pulse { 50% { transform:scale(1.07); } }
@keyframes bkg-rotation-fit { 50% { transform:scale(1.13); filter:drop-shadow(0 0 15px rgba(55,201,168,.7)); } }
.bkg-robot-game { padding:22px 0 38px; }
.bkg-robot-workspace { display:grid; grid-template-columns:minmax(360px,1.05fr) minmax(330px,.95fr); gap:22px; margin-top:20px; }
.bkg-robot-board { position:relative; display:grid; overflow:hidden; aspect-ratio:1; grid-template-columns:repeat(5,1fr); grid-template-rows:repeat(5,1fr); border:5px solid #fff; border-radius:30px; background:linear-gradient(145deg,#eaf9ff,#e7f8e9); box-shadow:0 16px 38px rgba(26,84,111,.18); }
.bkg-robot-cell { display:grid; place-items:center; border:1px solid rgba(39,118,95,.18); background:rgba(255,255,255,.2); font-size:clamp(22px,3.7vw,48px); }
.bkg-robot-cell:nth-child(odd) { background:rgba(255,255,255,.48); }
.bkg-robot-cell.is-obstacle { background:rgba(255,213,104,.24); }
.bkg-robot-goal, .bkg-grid-robot { position:absolute; left:var(--robot-left); top:var(--robot-top); z-index:4; display:grid; width:15%; aspect-ratio:1; place-items:center; pointer-events:none; transform:translate(-50%,-50%); }
.bkg-robot-goal { z-index:2; border-radius:50%; background:rgba(255,213,104,.38); font-size:clamp(30px,5vw,64px); animation:bkg-goal-glow 1.5s ease-in-out infinite; }
.bkg-grid-robot { border:4px solid #fff; border-radius:24px; background:#a98ae8; box-shadow:0 8px 18px rgba(42,34,78,.25); transition:left .42s ease,top .42s ease; }
.bkg-grid-robot b { font-size:clamp(32px,5vw,62px); line-height:1; }
.bkg-grid-robot i { position:absolute; left:50%; top:-25%; color:#542f98; font-size:clamp(24px,3vw,38px); font-style:normal; font-weight:950; transform:translateX(-50%) rotate(var(--robot-turn)); transition:transform .3s ease; }
.bkg-grid-robot.is-moving { animation:bkg-robot-hop .5s ease; }
.bkg-grid-robot.is-success { background:#57d2ad; animation:bkg-robot-success .85s ease both; }
.bkg-robot-game.is-spatial-navigation .bkg-robot-board { background:linear-gradient(rgba(255,255,255,.38) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.38) 1px,transparent 1px),linear-gradient(145deg,#ddf8ef,#eef0ff 62%,#fff3c9); background-size:20% 20%,20% 20%,auto; }
.bkg-robot-game.is-spatial-navigation .bkg-robot-cell { border-color:rgba(91,68,161,.18); }
.bkg-robot-game.is-spatial-navigation .bkg-robot-cell.is-landmark { background:rgba(255,255,255,.66); }
.bkg-robot-game.is-spatial-navigation .bkg-grid-robot { border-color:#fff; background:#42c9a9; }
.bkg-robot-game.is-spatial-navigation .bkg-robot-goal { background:rgba(255,213,104,.48); }
.bkg-robot-game.is-spatial-navigation .bkg-program-panel { border-color:rgba(118,80,189,.3); background:linear-gradient(160deg,#fff,#f8f5ff); }
.bkg-program-panel { display:grid; align-content:start; gap:16px; padding:clamp(20px,3vw,32px); border:2px solid var(--bkg-border); border-radius:30px; background:#fff; box-shadow:0 14px 34px rgba(24,33,42,.1); }
.bkg-program-panel h3 { margin:2px 0 0; font-size:clamp(24px,3vw,36px); letter-spacing:-.035em; }
.bkg-command-palette { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.bkg-command-palette button { display:grid; grid-template-columns:46px 1fr; min-height:68px; align-items:center; gap:8px; padding:9px 13px; border:3px solid #8b6bc9; border-radius:18px; background:#f4efff; color:#2f2250; cursor:pointer; text-align:left; }
.bkg-command-palette button:hover { transform:translateY(-2px); box-shadow:0 7px 16px rgba(77,48,132,.15); }
.bkg-command-palette button span { font-size:27px; text-align:center; }
.bkg-command-palette button strong { font-size:14px; }
.bkg-command-palette button:disabled { cursor:default; opacity:.48; transform:none; }
.bkg-program-queue { display:flex; min-height:104px; overflow-x:auto; align-items:center; gap:8px; padding:12px; border:3px dashed #b8ccc7; border-radius:20px; background:#f4faf8; }
.bkg-program-queue > p { width:100%; margin:0; color:var(--bkg-muted); font-size:14px; font-weight:800; text-align:center; }
.bkg-program-queue button { position:relative; display:grid; flex:0 0 90px; min-height:78px; place-items:center; gap:1px; padding:8px; border:2px solid #5ea890; border-radius:16px; background:#fff; color:#153d33; cursor:pointer; }
.bkg-program-queue button small { position:absolute; left:6px; top:4px; color:#7650bd; font-size:10px; font-weight:950; }
.bkg-program-queue button span { font-size:25px; }
.bkg-program-queue button strong { font-size:11px; }
.bkg-program-queue button:hover { border-color:#f37f6d; background:#fff2ee; }
.bkg-program-queue button:disabled { cursor:default; opacity:.7; }
.bkg-program-controls { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:8px; }
.bkg-button--primary { border-color:#128f77; background:var(--bkg-primary); color:#073d34; }
@keyframes bkg-goal-glow { 50% { box-shadow:0 0 0 12px rgba(255,213,104,.18); transform:translate(-50%,-50%) scale(1.08); } }
@keyframes bkg-robot-hop { 50% { margin-top:-8px; } }
@keyframes bkg-robot-success { 50% { transform:translate(-50%,-65%) rotate(-5deg) scale(1.14); } }
.bkg-maths-board { padding:22px 0 38px; }
.bkg-maths-workspace { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr); gap:22px; align-items:stretch; margin-top:20px; }
.bkg-maths-zones { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:16px; align-content:stretch; }
.bkg-maths-zone { display:flex; min-height:245px; flex-direction:column; gap:14px; padding:18px; border:4px dashed #86bdb0; border-radius:30px; outline:0; background:linear-gradient(145deg,#f7fffc,#eaf8f4); box-shadow:0 12px 28px rgba(32,93,78,.1); cursor:pointer; }
.bkg-maths-zone:focus-visible, .bkg-maths-zone:hover { border-color:#8d69d5; box-shadow:0 0 0 6px rgba(141,105,213,.15),0 12px 28px rgba(32,93,78,.1); }
.bkg-maths-zone__head { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.bkg-maths-zone__head strong { font-size:clamp(18px,2.2vw,27px); }
.bkg-maths-zone__head span { display:grid; min-width:46px; min-height:46px; place-items:center; border-radius:50%; background:#fff; color:#5d3ea3; box-shadow:0 4px 12px rgba(69,45,116,.13); font-size:22px; font-weight:950; }
.bkg-maths-zone__items { display:flex; flex:1; flex-wrap:wrap; align-content:center; justify-content:center; gap:8px; min-height:140px; padding:10px; border-radius:22px; background:rgba(255,255,255,.55); }
.bkg-maths-zone--frame .bkg-maths-zone__items { display:grid; grid-template-columns:repeat(5,minmax(44px,1fr)); align-content:center; }
.bkg-maths-zone--basket .bkg-maths-zone__items { border:8px solid #d9a65d; border-top-width:3px; background:repeating-linear-gradient(45deg,#fff8e8 0 10px,#f4ddb5 10px 13px); }
.bkg-maths-zone--plate .bkg-maths-zone__items, .bkg-maths-zone--pizza .bkg-maths-zone__items { border:8px solid #dce8e5; border-radius:50%; background:#fff; }
.bkg-maths-zone--group .bkg-maths-zone__items { border:3px solid #bca6e8; background:#f6f1ff; }
.bkg-maths-empty { align-self:center; color:#72827e; font-size:14px; font-weight:850; text-align:center; }
.bkg-maths-tray { display:grid; align-content:start; gap:14px; min-height:245px; padding:22px; border:3px solid #d2e1de; border-radius:30px; background:#fff; box-shadow:0 12px 28px rgba(24,33,42,.09); }
.bkg-maths-tray h3 { margin:2px 0 0; font-size:clamp(22px,2.6vw,32px); }
.bkg-maths-tray > p { margin:0; color:var(--bkg-muted); font-size:13px; font-weight:800; }
.bkg-maths-pieces { display:grid; grid-template-columns:repeat(auto-fill,minmax(58px,1fr)); gap:8px; align-content:start; }
.bkg-maths-piece { display:grid; min-width:56px; min-height:56px; place-items:center; padding:6px; touch-action:none; border:3px solid #63aa96; border-radius:18px; background:#effbf6; box-shadow:0 5px 12px rgba(30,94,75,.12); cursor:grab; user-select:none; }
.bkg-maths-piece img { display:block; width:44px; height:44px; object-fit:contain; pointer-events:none; }
.bkg-maths-piece:hover { transform:translateY(-2px); border-color:#7650bd; }
.bkg-maths-piece.is-selected { border-color:#7650bd; background:#f2ecff; box-shadow:0 0 0 5px rgba(118,80,189,.15); }
.bkg-maths-piece.is-dragging { position:relative; z-index:30; pointer-events:none; opacity:.9; cursor:grabbing; }
.bkg-maths-piece.is-placed { min-width:50px; min-height:50px; border-width:2px; background:#fff; cursor:pointer; }
.bkg-maths-piece.is-placed img { width:40px; height:40px; }
.bkg-maths-piece:disabled { cursor:default; opacity:.88; transform:none; }
.bkg-maths-controls { display:flex; justify-content:center; gap:10px; flex-wrap:wrap; margin-top:20px; }
.bkg-maths-controls .bkg-button--primary { min-width:210px; }
.bkg-shopping-game { padding:22px 0 38px; }
.bkg-shop-decision { display:grid; grid-template-columns:minmax(220px,.8fr) minmax(190px,.55fr) minmax(250px,.8fr); max-width:940px; align-items:center; gap:24px; margin:24px auto 0; padding:clamp(20px,3vw,34px); border:3px solid #e1bd58; border-radius:32px; background:linear-gradient(145deg,#fff9df,#fff); box-shadow:0 16px 38px rgba(79,59,22,.13); }
.bkg-shop-decision[hidden] { display:none; }
.bkg-shop-goal { display:flex; align-items:center; gap:16px; padding:18px; border:3px solid #dccb9b; border-radius:24px; background:#fff; }
.bkg-shop-goal img { width:112px; height:112px; object-fit:contain; }
.bkg-shop-goal > span { display:grid; gap:5px; }.bkg-shop-goal small { color:#7650bd; font-size:11px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }.bkg-shop-goal strong { font-size:22px; }.bkg-shop-goal b { color:#76591d; font-size:16px; }
.bkg-coin-jar { position:relative; display:grid; min-height:230px; place-items:center; align-content:end; padding-bottom:8px; }
.bkg-coin-jar__lid { position:absolute; z-index:3; top:6px; width:112px; height:22px; border:4px solid #537b86; border-radius:10px; background:#84acb5; box-shadow:inset 0 4px rgba(255,255,255,.4); }
.bkg-coin-jar__glass { position:absolute; top:23px; width:132px; height:154px; border:5px solid #76a9bd; border-radius:20px 20px 34px 34px; background:linear-gradient(135deg,rgba(255,255,255,.78),rgba(174,224,240,.38)); box-shadow:inset 14px 0 rgba(255,255,255,.28); overflow:hidden; }
.bkg-coin-jar__glass i { position:absolute; bottom:13px; left:18px; width:29px; height:29px; border:4px solid #c79313; border-radius:50%; background:#ffd568; box-shadow:inset 0 0 0 4px #f4ba2c; }
.bkg-coin-jar__glass i:nth-child(2) { left:48px; bottom:9px; }.bkg-coin-jar__glass i:nth-child(3) { left:77px; bottom:15px; }.bkg-coin-jar__glass i:nth-child(4) { left:32px; bottom:39px; }.bkg-coin-jar__glass i:nth-child(5) { left:66px; bottom:42px; }
.bkg-coin-jar > strong { z-index:4; margin-bottom:25px; padding:7px 13px; border-radius:10px; background:#fff; color:#315763; font-size:15px; transform:rotate(-2deg); }.bkg-coin-jar > b { z-index:4; color:#62490e; font-size:18px; }
.bkg-shop-decision__math { display:grid; gap:10px; }.bkg-shop-decision__math > strong { color:#5d3ea3; font-size:clamp(24px,3vw,34px); }.bkg-shop-decision__math p { margin:0; color:var(--bkg-muted); line-height:1.5; }.bkg-shop-decision__math > div { display:flex; flex-wrap:wrap; gap:8px; margin-top:7px; }
.bkg-shop-choice-goal { display:grid; grid-template-columns:46px 1fr auto; align-items:center; gap:9px; padding:13px; border:2px solid #bda6e6; border-radius:18px; background:#f5f0ff; }.bkg-shop-choice-goal > span { font-size:30px; }.bkg-shop-choice-goal strong,.bkg-shop-choice-goal small { grid-column:2; }.bkg-shop-choice-goal small { color:var(--bkg-muted); font-weight:800; }.bkg-shop-choice-goal b { grid-column:3; grid-row:1/3; color:#5d3ea3; font-size:20px; }.bkg-shop-choice-note { margin:12px 3px 0; color:var(--bkg-muted); font-size:12px; line-height:1.5; }
.bkg-shopping-workspace { display:grid; grid-template-columns:minmax(245px,.62fr) minmax(420px,1.15fr) minmax(250px,.63fr); gap:16px; align-items:start; margin-top:20px; }
.bkg-shopping-list,.bkg-supermarket,.bkg-shopping-basket { min-height:470px; padding:20px; border:3px solid var(--bkg-border); border-radius:28px; background:#fff; box-shadow:0 14px 32px rgba(24,33,42,.09); }
.bkg-shopping-list { background:linear-gradient(145deg,#fffdf4,#fff); }
.bkg-shopping-list h3,.bkg-shopping-basket h3 { margin:2px 0 15px; font-size:clamp(20px,2.3vw,28px); }
.bkg-shopping-list > div,.bkg-shopping-basket > div:first-of-type { display:grid; gap:9px; }
.bkg-shop-list-item { display:grid; grid-template-columns:52px 1fr 34px; align-items:center; gap:9px; min-height:70px; padding:8px; border:2px solid #e4ddd0; border-radius:17px; background:#fff; }
.bkg-shop-list-item img { width:48px; height:48px; object-fit:contain; }
.bkg-shop-list-item span { display:grid; line-height:1.2; }
.bkg-shop-list-item strong { font-size:14px; }
.bkg-shop-list-item small { color:var(--bkg-muted); font-size:10px; font-weight:750; }
.bkg-shop-list-item > b { display:grid; width:32px; height:32px; place-items:center; border-radius:50%; background:#fff2c8; color:#76591d; }
.bkg-shop-list-item.is-done { border-color:#59c9ad; background:#effdf8; }
.bkg-shop-list-item.is-done > b { background:#36ba99; color:#073d34; }
.bkg-supermarket { overflow:hidden; padding:0; border-color:#d9b766; background:linear-gradient(#edf9ff 0 22%,#f5dfb6 22% 100%); }
.bkg-shop-departments { display:grid; grid-template-columns:repeat(5,1fr); gap:5px; padding:10px; border-bottom:3px solid #d9b766; background:rgba(255,255,255,.9); }
.bkg-shop-departments button { display:grid; min-width:0; min-height:70px; place-items:center; gap:2px; padding:7px 3px; border:2px solid transparent; border-radius:15px; background:transparent; color:var(--bkg-ink); cursor:pointer; }
.bkg-shop-departments button span { font-size:24px; }
.bkg-shop-departments button strong { overflow:hidden; max-width:100%; font-size:10px; text-overflow:ellipsis; }
.bkg-shop-departments button.is-active { border-color:#e0ad38; background:#fff4cd; box-shadow:0 5px 13px rgba(99,74,20,.13); }
.bkg-shop-shelf { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; min-height:375px; align-content:center; padding:20px; background:repeating-linear-gradient(0deg,rgba(153,105,52,.16) 0 4px,transparent 4px 174px); }
.bkg-shop-product { display:grid; min-height:162px; place-items:center; align-content:center; gap:4px; padding:10px; border:3px solid #d7bd8b; border-radius:22px; background:#fffdf7; color:var(--bkg-ink); box-shadow:0 9px 18px rgba(70,49,19,.12); cursor:pointer; }
.bkg-shop-product:hover { transform:translateY(-3px); border-color:#37b99a; }
.bkg-shop-product > span { position:relative; display:grid; width:92px; height:92px; place-items:center; }
.bkg-shop-product img { width:88px; height:88px; object-fit:contain; pointer-events:none; }
.bkg-shop-product > span b { position:absolute; right:-4px; top:-2px; display:grid; min-width:29px; min-height:29px; place-items:center; padding:2px; border-radius:50%; background:#7650bd; color:#fff; font-size:13px; }
.bkg-shop-product strong { font-size:15px; }
.bkg-shop-product small { color:#76591d; font-size:12px; font-weight:900; }
.bkg-shop-product.is-hint { border-color:#37c9a8; animation:bkg-shop-hint 1s ease infinite; }
.bkg-shop-basket-item { display:grid; grid-template-columns:1fr auto; align-items:center; gap:8px; padding:8px; border:2px solid #dbe7e4; border-radius:16px; background:#f8fffc; }
.bkg-shop-basket-item > span { display:grid; grid-template-columns:40px 1fr; align-items:center; gap:7px; min-width:0; }
.bkg-shop-basket-item img { width:38px; height:38px; object-fit:contain; }
.bkg-shop-basket-item strong { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.bkg-shop-basket-item > div { display:flex; align-items:center; gap:5px; }
.bkg-shop-basket-item button { display:grid; width:34px; min-height:34px; place-items:center; border:2px solid #9ecfc2; border-radius:11px; background:#fff; color:#176b57; cursor:pointer; font-size:20px; font-weight:900; }
.bkg-shop-basket-item b { min-width:20px; text-align:center; }
.bkg-shop-empty { margin:16px 0; color:var(--bkg-muted); font-size:13px; line-height:1.45; }
.bkg-shop-money { display:grid; gap:5px; margin:15px 0; padding:12px; border-radius:16px; background:#f4efff; }
.bkg-shop-money span { display:flex; justify-content:space-between; gap:12px; font-size:12px; font-weight:800; }
.bkg-shopping-basket > .bkg-button { width:100%; margin-top:14px; }
.bkg-shop-payment { display:grid; grid-template-columns:minmax(220px,.7fr) minmax(280px,1.2fr) auto auto; align-items:center; gap:16px; margin-top:18px; padding:20px; border:3px solid #9d7bd9; border-radius:26px; background:linear-gradient(145deg,#f6f1ff,#fff); box-shadow:0 12px 28px rgba(77,53,125,.13); }
.bkg-shop-payment h3 { margin:2px 0 4px; font-size:24px; }
.bkg-shop-payment p { margin:0; color:var(--bkg-muted); font-size:13px; }
.bkg-shop-cash { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; }
.bkg-shop-cash button { display:grid; min-height:68px; place-items:center; padding:7px; border:3px solid #63aa96; border-radius:15px; background:#effbf6; color:#17483d; cursor:pointer; }
.bkg-shop-cash button span { font-size:20px; font-weight:950; }
.bkg-shop-cash button small { font-size:9px; font-weight:850; text-transform:uppercase; }
.bkg-shop-payment > strong { min-width:110px; color:#5d3ea3; font-size:18px; text-align:center; }
.bkg-shop-payment > div:last-child { display:grid; gap:7px; }
.bkg-shopping-controls { display:flex; justify-content:center; margin-top:12px; }
@keyframes bkg-shop-hint { 50% { box-shadow:0 0 0 10px rgba(55,201,168,.2),0 9px 18px rgba(70,49,19,.12); transform:translateY(-3px) scale(1.02); } }
.bkg-cooking-game { padding:22px 0 38px; }
.bkg-cooking-workspace { display:grid; grid-template-columns:minmax(310px,.72fr) minmax(0,1.28fr); gap:22px; margin-top:20px; }
.bkg-cooking-pantry, .bkg-cooking-counter { min-height:480px; padding:clamp(20px,2.4vw,30px); border:3px solid var(--bkg-border); border-radius:32px; background:#fff; box-shadow:0 14px 32px rgba(24,33,42,.1); }
.bkg-cooking-pantry h3 { margin:2px 0 16px; font-size:clamp(22px,2.8vw,32px); }
.bkg-cooking-items { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.bkg-cook-item { position:relative; display:grid; min-height:152px; place-items:center; align-content:center; gap:8px; padding:13px 9px; border:3px solid #b7d8d0; border-radius:24px; background:#f5fffb; color:#193b35; cursor:grab; touch-action:none; }
.bkg-cook-item span { display:grid; width:88px; height:82px; place-items:center; font-size:64px; line-height:1; }
.bkg-cook-item img { width:82px; height:82px; object-fit:contain; pointer-events:none; }
.bkg-cook-item strong { font-size:14px; line-height:1.15; text-align:center; }
.bkg-cook-item small { position:absolute; right:6px; top:5px; color:#7650bd; font-size:10px; font-weight:950; text-transform:uppercase; }
.bkg-cook-item.is-current { border-color:#37c9a8; background:#e9fff7; box-shadow:0 0 0 5px rgba(55,201,168,.16); }
.bkg-cook-item:hover { transform:translateY(-2px); }
.bkg-cooking-counter { position:relative; display:grid; grid-template-rows:minmax(0,1fr) auto; place-items:center; gap:14px; overflow:hidden; background:linear-gradient(#fff8ea 0 60%,#d9b68c 60%); }
.bkg-cooking-counter::before { content:""; position:absolute; left:7%; right:7%; top:59%; height:16px; border-radius:8px; background:#ad805d; box-shadow:0 9px 0 rgba(255,255,255,.35); }
.bkg-cooking-target { position:relative; z-index:1; display:grid; width:min(90%,650px); min-height:320px; place-items:center; align-content:center; gap:10px; padding:22px; border:5px dashed #c9a275; border-radius:42px; background:rgba(255,255,255,.78); outline:0; box-shadow:0 15px 25px rgba(91,61,35,.15); }
.bkg-cooking-target.is-active:focus-visible, .bkg-cooking-target.is-active:hover { border-color:#7650bd; box-shadow:0 0 0 7px rgba(118,80,189,.16),0 15px 25px rgba(91,61,35,.15); }
.bkg-cooking-target > strong { color:#67482f; font-size:clamp(22px,3vw,35px); }
.bkg-cooking-target__hint { color:#765f4b; font-size:14px; font-weight:800; text-align:center; }
.bkg-cooking-result { display:flex; min-height:128px; align-items:center; justify-content:center; gap:6px; flex-wrap:wrap; }
.bkg-cooking-result span { display:grid; width:88px; height:88px; place-items:center; border-radius:24px; background:#fff; box-shadow:0 5px 12px rgba(40,30,20,.12); font-size:62px; }
.bkg-cooking-result img { width:78px; height:78px; object-fit:contain; }
.bkg-cooking-result .bkg-cooking-scene-object { width:clamp(150px,18vw,220px); height:clamp(150px,18vw,220px); margin:0; border-radius:34px; transform:none; }
.bkg-cooking-result .bkg-cooking-scene-object img { width:88%; height:88%; }
.bkg-cooking-counter > .bkg-button { position:relative; z-index:3; min-width:min(310px,84%); margin-bottom:2px; box-shadow:0 8px 18px rgba(70,46,28,.18); }
.bkg-cooking-result[data-recipe="cook-sandwich"] span,
.bkg-cooking-result[data-recipe="cook-pizza"] span,
.bkg-cooking-result[data-recipe="cook-cupcake"] span { margin-inline:-12px; transform:translateY(calc(var(--bkg-layer,0) * -2px)); }
.bkg-cooking-target.is-changing { animation:bkg-cook-change .7s ease; }
.bkg-cooking-target.is-pouring::after { content:"💧"; position:absolute; top:18%; left:50%; font-size:42px; animation:bkg-cook-pour .65s ease both; }
.bkg-cooking-target.is-chopping::after { content:"✂"; position:absolute; right:20%; top:20%; color:#d56b50; font-size:34px; animation:bkg-cook-chop .55s ease both; }
.bkg-cooking-target.is-mixing::after { content:"✦"; position:absolute; right:18%; top:25%; color:#37a98c; font-size:38px; animation:bkg-cook-mix .7s ease both; }
.bkg-cooking-target.is-baking::after { content:""; position:absolute; inset:18% 20%; border-radius:28px; background:radial-gradient(circle at 35% 70%,#ffcf65 0 8%,transparent 9%),radial-gradient(circle at 62% 62%,#ff9f43 0 7%,transparent 8%),linear-gradient(145deg,rgba(255,128,62,.2),rgba(255,213,104,.4)); animation:bkg-cook-bake .9s ease both; pointer-events:none; }
.bkg-cooking-target.is-decorating::after { content:"✦  ●  ✦"; position:absolute; right:13%; top:17%; color:#d85b9b; font-size:32px; animation:bkg-cook-decorate .7s ease both; }
.bkg-stir-pad { position:absolute; right:8%; bottom:9%; z-index:2; display:grid; width:130px; min-height:88px; place-items:center; gap:2px; padding:9px; border:3px solid #7650bd; border-radius:25px; background:#f2ecff; color:#4b347d; cursor:crosshair; touch-action:none; user-select:none; }
.bkg-stir-pad > span { font-size:38px; transform:rotate(var(--cook-stir-turn,0deg)); transition:transform .2s linear; }
.bkg-stir-pad strong { font-size:11px; text-align:center; }
.bkg-cooking-steps { display:flex; overflow-x:auto; gap:8px; margin-top:20px; padding:4px 2px 9px; }
.bkg-cook-step { display:grid; min-width:92px; place-items:center; gap:4px; padding:8px 7px; border:2px solid #d7e3df; border-radius:17px; background:#fff; color:#6b7975; }
.bkg-cook-step b { display:grid; width:28px; height:28px; place-items:center; border-radius:50%; background:#edf4f1; color:#5d716b; }
.bkg-cook-step small { max-width:90px; overflow:hidden; font-size:10px; font-weight:850; text-align:center; text-overflow:ellipsis; white-space:nowrap; }
.bkg-cook-step.is-current { border-color:#37c9a8; background:#effff9; color:#176b57; }
.bkg-cook-step.is-current b { background:#37c9a8; color:#073d34; }
.bkg-cook-step.is-done b { background:#7650bd; color:#fff; }
.bkg-cooking-controls { display:flex; justify-content:center; margin-top:8px; }
@keyframes bkg-cook-change { 50% { transform:scale(1.035) rotate(-1deg); box-shadow:0 0 0 12px rgba(55,201,168,.16),0 15px 25px rgba(91,61,35,.15); } }
@keyframes bkg-cook-pour { from { transform:translateY(-25px) rotate(-20deg); opacity:0; } 55% { opacity:1; } to { transform:translateY(28px); opacity:0; } }
@keyframes bkg-cook-chop { 50% { transform:rotate(-20deg) scale(1.18); } }
@keyframes bkg-cook-mix { 50% { transform:rotate(180deg) scale(1.2); } }
@keyframes bkg-cook-bake { from { opacity:0; transform:scale(.78); } 55% { opacity:1; } to { opacity:0; transform:scale(1.12); } }
@keyframes bkg-cook-decorate { 50% { transform:translateY(-12px) rotate(8deg) scale(1.18); } }
.bkg-game-card--recipe .bkg-game-card__art { width:110px; height:110px; font-size:64px; }
.bkg-game-card--recipe .bkg-game-card__art img { width:96px; height:96px; object-fit:contain; }
.bkg-kitchen__window { position: absolute; left: 42%; top: 8%; width: 20%; height: 29%; overflow: hidden; border: 8px solid #fff; border-radius: 16px; background: linear-gradient(#8fd5f7 65%, #8ccc7a 65%); box-shadow: 0 4px 12px rgba(24,33,42,.12); }
.bkg-kitchen__window::before, .bkg-kitchen__window::after { content: ""; position: absolute; background: rgba(255,255,255,.85); }
.bkg-kitchen__window::before { left: 48%; width: 7px; height: 100%; }
.bkg-kitchen__window::after { top: 48%; width: 100%; height: 7px; }
.bkg-kitchen__window span { position: absolute; right: 9%; top: 11%; width: 26px; aspect-ratio: 1; border-radius: 50%; background: var(--bkg-yellow); }
.bkg-kitchen__cabinet { position: absolute; top: 11%; width: 18%; height: 27%; border: 5px solid #b9d6d1; border-radius: 16px; background: #dcefeb; box-shadow: inset 0 0 0 5px rgba(255,255,255,.35); }
.bkg-kitchen__cabinet::after { content: ""; position: absolute; right: 12px; top: 48%; width: 8px; aspect-ratio: 1; border-radius: 50%; background: var(--bkg-primary-dark); }
.bkg-kitchen__cabinet--one { left: 17%; }
.bkg-kitchen__cabinet--two { right: 11%; }
.bkg-kitchen__counter { position: absolute; left: 17%; right: 5%; top: 52%; height: 21%; border: 5px solid #91a9a4; border-radius: 12px 12px 4px 4px; background: repeating-linear-gradient(90deg, #a9d1ca 0 19%, #8ebbb3 19% 20%); box-shadow: inset 0 12px 0 #f7fbfa; }
.bkg-kitchen__rug { position: absolute; left: 41%; bottom: 4%; width: 36%; height: 12%; border-radius: 50%; background: repeating-radial-gradient(ellipse, #69bbf5 0 12px, #aee2f8 12px 22px); opacity: .8; }
.bkg-objects { position: absolute; inset: 0; z-index: 2; }
.bkg-object {
  position: absolute;
  left: var(--bkg-x);
  top: var(--bkg-y);
  display: grid;
  width: clamp(52px, 7.2vw, 78px);
  min-height: clamp(52px, 7.2vw, 78px);
  place-items: center;
  padding: 2px;
  border: 3px solid rgba(255,255,255,.9);
  border-radius: 24px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 5px 12px rgba(24,33,42,.17);
  cursor: pointer;
  transform: translate(-50%, -50%);
  transition: transform .17s ease, box-shadow .17s ease, border-color .17s ease;
  -webkit-tap-highlight-color: transparent;
}
.bkg-object span { font-size: clamp(28px, 4.5vw, 48px); line-height: 1; filter: drop-shadow(0 2px 1px rgba(24,33,42,.1)); }
.bkg-picture-image { display: block; width: 1.25em; height: 1.25em; max-width: 100%; object-fit: contain; }
.bkg-object span .bkg-picture-image { width: clamp(44px, 6.5vw, 76px); height: clamp(44px, 6.5vw, 76px); }
.bkg-object--large span .bkg-picture-image { width: clamp(54px, 7.5vw, 90px); height: clamp(54px, 7.5vw, 90px); }
.bkg-object small { display: none; }
.bkg-object:hover { z-index: 2; transform: translate(-50%, -50%) scale(1.09); box-shadow: 0 9px 20px rgba(24,33,42,.2); }
.bkg-object--large { width: clamp(64px, 8.5vw, 92px); min-height: clamp(78px, 11vw, 120px); }
.bkg-object.is-correct { z-index: 4; border-color: #fff; background: var(--bkg-primary); animation: bkg-celebrate .8s ease both; }
.bkg-object.is-try-again { animation: bkg-wiggle .45s ease; }
.bkg-object.is-hint { z-index: 3; animation: bkg-hint 1.15s ease-in-out infinite; }
.bkg-object.is-draw-source { border-color: var(--bkg-secondary); box-shadow: 0 0 0 7px rgba(105,187,245,.24), 0 5px 12px rgba(24,33,42,.17); }
.bkg-object.is-draw-destination { border-color: var(--bkg-yellow); box-shadow: 0 0 0 7px rgba(255,213,104,.3), 0 5px 12px rgba(24,33,42,.17); }
.bkg-object:disabled { cursor: default; opacity: .78; }
.bkg-object.is-correct:disabled { opacity: 1; }
.bkg-speak-scene .bkg-object { pointer-events: none; }
.bkg-speak-scene.is-magic { box-shadow: inset 0 0 80px rgba(255,213,104,.26), 0 0 0 6px rgba(255,213,104,.18); }
.bkg-magic-stars { position: absolute; left: 50%; top: 15%; z-index: 8; font-size: clamp(46px,8vw,90px); opacity: 0; pointer-events: none; transform: translateX(-50%); }
.bkg-speak-scene.is-magic .bkg-magic-stars { animation: bkg-magic 1.3s ease both; }
.bkg-focus-object { position: absolute; left: 50%; top: 50%; z-index: 10; display: grid; width: min(42%, 280px); min-height: 62%; place-content: center; justify-items: center; gap: 12px; padding: 18px; border: 5px solid rgba(255,255,255,.94); border-radius: 34px; background: rgba(255,255,255,.9); box-shadow: 0 18px 40px rgba(24,33,42,.2); transform: translate(-50%,-50%) rotate(-2deg); }
.bkg-focus-object > span { font-size: clamp(90px, 18vw, 180px); line-height: 1; filter: drop-shadow(0 7px 4px rgba(24,33,42,.13)); }
.bkg-focus-object > strong { font-size: clamp(20px, 3.6vw, 36px); letter-spacing: -.03em; }
.bkg-focus-object.is-speaking-success { border-color: var(--bkg-primary); animation: bkg-focus-success .85s ease both; }
.bkg-object.is-speaking-success { z-index: 7; border-color: var(--bkg-yellow); background: #fff9df; }
.bkg-object.is-action-jump { animation: bkg-action-jump 1.25s ease both; }
.bkg-object.is-action-spin { animation: bkg-action-spin 1.25s ease both; }
.bkg-object.is-action-dance { animation: bkg-action-dance 1.25s ease both; }
.bkg-object.is-action-open { animation: bkg-action-open 1.25s ease both; }
.bkg-object.is-action-move { animation: bkg-action-move 1.35s ease both; }
.bkg-object.is-action-slide { animation: bkg-action-slide 1.25s ease both; }
.bkg-object.is-action-give { animation: bkg-action-give 1.25s ease both; }

.bkg-speak-fallback { margin: 14px 0; padding: 14px; border: 1px solid var(--bkg-border); border-radius: 18px; background: var(--bkg-soft); text-align: center; }
.bkg-speak-fallback > p { margin: 0 0 10px; color: var(--bkg-muted); font-size: 13px; font-weight: 750; }
.bkg-speak-choices { display: flex; justify-content: center; gap: 10px; }
.bkg-app.is-conversation .bkg-speak-choices { flex-wrap: wrap; }
.bkg-app.is-conversation .bkg-choice { flex: 1 1 104px; max-width: 150px; }
.bkg-choice { display: grid; min-width: 104px; min-height: 76px; place-items: center; gap: 3px; padding: 8px 12px; border: 2px solid var(--bkg-border); border-radius: 16px; background: #fff; color: var(--bkg-ink); cursor: pointer; }
.bkg-choice:hover { border-color: var(--bkg-secondary); transform: translateY(-2px); }
.bkg-choice span { font-size: 30px; line-height: 1; }
.bkg-choice strong { font-size: 12px; }
.bkg-privacy-note { margin: 9px 0 0; color: var(--bkg-muted); font-size: 11px; text-align: center; }
.bkg-draw-scene { cursor: crosshair; touch-action: none; }
.bkg-draw-scene .bkg-object { pointer-events: none; }
.bkg-drawing-canvas { position: absolute; inset: 0; z-index: 20; width: 100%; height: 100%; cursor: crosshair; touch-action: none; }

.bkg-controls { display: flex; justify-content: center; gap: 10px; margin-top: 14px; }
.bkg-control, .bkg-button {
  min-height: 48px;
  padding: 9px 16px;
  border: 1px solid var(--bkg-border);
  border-radius: 14px;
  background: var(--bkg-surface);
  color: var(--bkg-ink);
  cursor: pointer;
  font-weight: 800;
}
.bkg-control.is-active { border-color: var(--bkg-primary); background: rgba(59,205,170,.13); color: var(--bkg-primary-dark); }

.bkg-world-card--stories { background: linear-gradient(145deg, #fff0b7, #ffd6ed 52%, #ccecff); }
.bkg-world-card--dictionary { border-color: rgba(153,115,220,.65); background:linear-gradient(135deg,var(--card-vocab-1),var(--card-vocab-2) 36%,var(--card-vocab-3) 68%,var(--card-vocab-4)); }
.bkg-world-card--missions { border-color: rgba(255,128,111,.7); background: linear-gradient(145deg,#fff1ec,#fff8cc 52%,#e8fbf6); }
.bkg-world-card--journey { border-color: rgba(153,115,220,.72); background: linear-gradient(145deg,#fff4cb,#ffe4f2 46%,#dcf2ff); }
.bkg-world-card--rewards { border-color: rgba(240,183,45,.78); background: linear-gradient(145deg,#fff9d9,#fff0bd 50%,#e8fff4); }
.bkg-journey { padding: clamp(34px,6vw,72px) 0; }
.bkg-journey__intro { max-width: 760px; margin: 0 auto 34px; text-align: center; }
.bkg-journey__intro h2 { margin: 0; font-size: clamp(36px,6vw,64px); letter-spacing: -.055em; line-height: 1.02; }
.bkg-journey__intro > p:last-child { color: var(--bkg-muted); font-size: clamp(16px,2vw,19px); }
.bkg-journey-map { position: relative; display: grid; grid-template-columns: repeat(5,1fr); gap: 13px; max-width: 1040px; margin: 0 auto 28px; }
.bkg-journey-map::before { position: absolute; z-index: 0; top: 42px; right: 7%; left: 7%; height: 8px; border-radius: 99px; background: linear-gradient(90deg,#3bcdaa,#69bbf5,#9973dc,#ff806f,#ffd568); content: ""; opacity: .42; }
.bkg-journey-stop { position: relative; z-index: 1; display: grid; min-height: 205px; place-items: center; align-content: center; gap: 7px; padding: 18px 12px; border: 2px solid var(--bkg-border); border-radius: 24px; background: rgba(255,255,255,.94); box-shadow: 0 8px 22px rgba(24,33,42,.08); text-align: center; }
.bkg-journey-stop__number { display: grid; width: 42px; aspect-ratio: 1; place-items: center; border: 4px solid #fff; border-radius: 50%; background: #eaf1ef; box-shadow: 0 3px 10px rgba(24,33,42,.12); font-size: 16px; font-weight: 900; }
.bkg-journey-stop__icon { font-size: 42px; line-height: 1; }
.bkg-journey-stop strong { font-size: 17px; line-height: 1.1; }
.bkg-journey-stop small { color: var(--bkg-muted); font-size: 12px; }
.bkg-journey-stop.is-current { border-color: #9973dc; background: linear-gradient(#fff,#f4efff); box-shadow: 0 14px 30px rgba(153,115,220,.23); transform: translateY(-5px); }
.bkg-journey-stop.is-current .bkg-journey-stop__number { background: #9973dc; color: #fff; }
.bkg-journey-stop.is-done { border-color: rgba(59,205,170,.75); background: #effcf8; }
.bkg-journey-stop.is-done .bkg-journey-stop__number { background: var(--bkg-primary); color: #063e37; }
.bkg-journey__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.bkg-journey .bkg-privacy-note { text-align: center; }
.bkg-rewards { padding: clamp(34px,6vw,72px) 0; }
.bkg-rewards__intro { max-width: 720px; margin: 0 auto 30px; text-align: center; }
.bkg-rewards__intro h2 { margin: 0; font-size: clamp(38px,6vw,64px); letter-spacing: -.055em; line-height: 1.02; }
.bkg-rewards__intro > p:last-child { color: var(--bkg-muted); font-size: 17px; }
.bkg-reward-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; max-width: 760px; margin: 0 auto 34px; }
.bkg-reward-summary article { display: grid; min-height: 150px; place-items: center; align-content: center; gap: 2px; padding: 18px; border: 2px solid #f2df94; border-radius: 24px; background: linear-gradient(#fff,#fff9dc); box-shadow: 0 8px 22px rgba(24,33,42,.07); }
.bkg-reward-summary span { font-size: 38px; }
.bkg-reward-summary strong { font-size: 34px; line-height: 1; }
.bkg-reward-summary small { color: var(--bkg-muted); font-size: 12px; font-weight: 800; }
.bkg-rewards > h3 { margin: 0 0 15px; text-align: center; font-size: clamp(24px,3vw,32px); }
.bkg-badge-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 13px; }
.bkg-badge { display: grid; min-height: 180px; place-items: center; align-content: center; gap: 7px; padding: 17px; border: 2px solid var(--bkg-border); border-radius: 22px; background: #fff; text-align: center; }
.bkg-badge > span { font-size: 46px; filter: grayscale(1); }
.bkg-badge strong { font-size: 17px; }
.bkg-badge small { color: var(--bkg-muted); font-size: 12px; }
.bkg-badge.is-earned { border-color: #f1cb55; background: linear-gradient(#fff,#fff8d6); box-shadow: 0 10px 24px rgba(240,183,45,.16); }
.bkg-badge.is-earned > span { filter: none; }
.bkg-badge.is-locked { opacity: .66; }
.bkg-rewards .bkg-privacy-note { text-align: center; }
.bkg-mission-scene { position: relative; overflow: hidden; aspect-ratio: 3 / 2; border: 5px solid #fff; border-radius: 26px; background-color: #f4e5c8; background-position: center; background-size: cover; box-shadow: 0 14px 35px rgba(24,33,42,.16); touch-action: none; }
.bkg-mission-scene.is-listening { animation: bkg-scene-listen .7s ease; }
.bkg-mission-hotspots { position: absolute; inset: 0; z-index: 5; pointer-events: none; }
.bkg-mission-hotspots.is-find-mode { pointer-events: auto; }
.bkg-mission-hotspot { position: absolute; left: var(--bkg-x); top: var(--bkg-y); width: var(--bkg-size); aspect-ratio: 1; padding: 0; border: 3px solid transparent; border-radius: 50%; background: transparent; cursor: default; pointer-events: none; transform: translate(-50%,-50%); }
.bkg-mission-hotspots.is-find-mode .bkg-mission-hotspot { cursor: pointer; pointer-events: auto; }
.bkg-mission-hotspot.is-hint { border-color: #fff; background: rgba(105,187,245,.18); animation: bkg-hint 1.15s ease-in-out infinite; }
.bkg-mission-hotspot.is-correct { border-color: #fff; background: rgba(59,205,170,.35); box-shadow: 0 0 0 7px rgba(59,205,170,.32); animation: bkg-celebrate .8s ease both; }
.bkg-mission-canvas { z-index: 10; }
.bkg-dictionary { padding: clamp(30px,5vw,60px) 0; }
.bkg-dictionary__head { margin-bottom: 18px; }
.bkg-dictionary__head h2 { margin: 0; font-size: clamp(34px,5.6vw,58px); letter-spacing: -.05em; line-height: 1.02; }
.bkg-dictionary__head p:last-child { margin: 8px 0 0; color: var(--bkg-muted); }
.bkg-category-tabs { display: flex; gap: 9px; overflow-x: auto; padding: 4px 2px 12px; scrollbar-width: thin; }
.bkg-category-tab { display: flex; flex: 0 0 auto; min-height: 50px; align-items: center; gap: 7px; padding: 9px 14px; border: 2px solid var(--bkg-border); border-radius: 999px; background: #fff; color: var(--bkg-ink); cursor: pointer; font-size: 13px; font-weight: 850; }
.bkg-category-tab span { font-size: 22px; }
.bkg-category-tab.is-active { border-color: var(--bkg-primary); background: #eafbf7; color: #0d745f; }
.bkg-dictionary-tools { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 12px 0 2px; }
.bkg-dictionary-tools h3 { margin: 0; font-size: clamp(23px,3vw,32px); }
.bkg-word-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-top: 14px; }
.bkg-word-card { overflow: hidden; border: 2px solid var(--bkg-border); border-radius: 22px; background: #fff; box-shadow: 0 7px 18px rgba(24,33,42,.07); }
.bkg-word-card__hear { display: grid; width: 100%; min-height: 220px; place-items: center; align-content: center; gap: 7px; padding: 18px 14px 12px; border: 0; background: radial-gradient(circle at 82% 14%,rgba(255,213,104,.26),transparent 25%),linear-gradient(#fff,#f8fffd); color: var(--bkg-ink); cursor: pointer; }
.bkg-word-card__hear:hover { background: #effcf8; }
.bkg-word-card__hear > span { font-size: clamp(54px,7vw,82px); line-height: 1; filter: drop-shadow(0 4px 3px rgba(24,33,42,.12)); }
.bkg-word-card__hear strong { font-size: clamp(19px,2.2vw,25px); text-transform: capitalize; }
.bkg-word-card__hear small { min-height: 38px; color: var(--bkg-muted); font-size: 12px; line-height: 1.4; }
.bkg-word-card__actions { display: grid; grid-template-columns: 1fr 54px; border-top: 1px solid var(--bkg-border); }
.bkg-word-card__actions button { min-height: 50px; border: 0; background: #fff; color: var(--bkg-ink); cursor: pointer; font-size: 18px; font-weight: 800; }
.bkg-word-card__actions button:first-child { border-right: 1px solid var(--bkg-border); font-size: 13px; }
.bkg-word-card__actions button:hover { background: #f4fbfa; }
.bkg-dictionary-empty { grid-column: 1/-1; padding: 60px 20px; border: 2px dashed var(--bkg-border); border-radius: 22px; color: var(--bkg-muted); text-align: center; font-size: 18px; font-weight: 800; }
.bkg-dictionary-quiz { padding: 24px 0 30px; }
.bkg-dictionary-quiz-symbol { min-height: 92px; margin: 6px 0; font-size: 82px; line-height: 1; }
.bkg-story-reader, .bkg-story-quiz { padding: 24px 0 30px; }
.bkg-story-book { display: grid; grid-template-columns: minmax(260px, .82fr) 1.18fr; overflow: hidden; border: 5px solid #fff; border-radius: 30px; background: #fffdf5; box-shadow: 0 18px 45px rgba(45,55,80,.16); }
.bkg-story-art { aspect-ratio: 3 / 4; min-height: 430px; background-color: #dff2ec; background-repeat: no-repeat; background-size: 400% 200%; }
.bkg-story-copy { display: grid; align-content: center; padding: clamp(26px, 5vw, 66px); background: radial-gradient(circle at 92% 12%, rgba(255,213,104,.28), transparent 24%), linear-gradient(145deg,#fffdf5,#fff5ef); }
.bkg-story-copy h2 { margin: 4px 0 18px; font-size: clamp(28px, 4.3vw, 48px); line-height: 1.05; }
.bkg-story-copy > p:not(.bkg-eyebrow) { margin: 0 0 24px; color: #374552; font-size: clamp(18px, 2.3vw, 25px); font-weight: 650; line-height: 1.65; }
.bkg-story-read { justify-self: start; }
.bkg-story-nav { display: flex; justify-content: space-between; gap: 12px; margin-top: 16px; }
.bkg-story-nav .bkg-button:disabled { opacity: .45; cursor: default; }
.bkg-quiz-card { position: relative; max-width: 760px; margin: 0 auto; padding: clamp(26px, 5vw, 54px); border: 5px solid #fff; border-radius: 30px; background: radial-gradient(circle at 90% 8%, #fff2a7 0 10%, transparent 10.5%), linear-gradient(145deg,#f1fffb,#fff3f1); box-shadow: 0 18px 45px rgba(45,55,80,.16); text-align: center; }
.bkg-quiz-card .bkg-character { margin: 0 auto 12px; }
.bkg-quiz-card h2 { max-width: 620px; margin: 8px auto 12px; font-size: clamp(26px, 4vw, 42px); line-height: 1.15; }
.bkg-quiz-choices { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 24px 0 14px; }
.bkg-quiz-choice { flex: 1 1 150px; max-width: 210px; min-height: 112px; }
.bkg-quiz-choice span { font-size: 42px; }
.bkg-quiz-choice strong { font-size: 15px; }
.bkg-quiz-choice.is-hint { border-color: var(--bkg-secondary); background: #eaf8ff; animation: bkg-card-hint 1.15s ease-in-out infinite; }
.bkg-quiz-actions { display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; gap: 10px; margin-top: 18px; }
.bkg-quiz-actions .bkg-mic-button { min-width: 118px; min-height: 58px; }
@keyframes bkg-card-hint { 50% { transform: translateY(-4px) scale(1.03); box-shadow: 0 8px 20px rgba(105,187,245,.25); } }

.bkg-complete { display: grid; min-height: calc(min(900px, 92svh) - 76px); place-content: center; justify-items: center; padding: 54px 20px; text-align: center; }
.bkg-complete__burst { margin-bottom: 18px; font-size: 88px; animation: bkg-burst 1s ease both; }
.bkg-complete > p { max-width: 560px; }
.bkg-complete__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 20px; }
.bkg-button { min-width: 145px; }
.bkg-button--primary { border-color: var(--bkg-primary); background: var(--bkg-primary); color: #063e37; }
.bkg-notice { padding: 18px; border: 1px solid #ffd4c9; border-radius: 12px; background: #fff5f2; color: #7b392d; }

@keyframes bkg-wiggle { 0%,100% { transform: translate(-50%,-50%); } 25% { transform: translate(calc(-50% - 7px),-50%) rotate(-4deg); } 75% { transform: translate(calc(-50% + 7px),-50%) rotate(4deg); } }
@keyframes bkg-hint { 0%,100% { box-shadow: 0 0 0 0 rgba(105,187,245,.65); transform: translate(-50%,-50%); } 50% { box-shadow: 0 0 0 14px rgba(105,187,245,0); transform: translate(-50%,-50%) scale(1.08); } }
@keyframes bkg-celebrate { 0% { transform: translate(-50%,-50%) scale(.85) rotate(-5deg); } 45% { transform: translate(-50%,-50%) scale(1.22) rotate(5deg); } 100% { transform: translate(-50%,-50%) scale(1); } }
@keyframes bkg-burst { 0% { transform: scale(.75) rotate(-8deg); opacity: .3; } 55% { transform: scale(1.2) rotate(6deg); opacity: 1; } 100% { transform: scale(1); } }
@keyframes bkg-scene-listen { 50% { box-shadow: inset 0 0 60px rgba(59,205,170,.22), 0 0 0 6px rgba(59,205,170,.16); } }
@keyframes bkg-mic-pulse { 50% { transform: scale(1.05); box-shadow: 0 0 0 9px rgba(255,128,111,.18); } }
@keyframes bkg-magic { 0% { opacity: 0; transform: translateX(-50%) scale(.5) rotate(-10deg); } 45% { opacity: 1; transform: translateX(-50%) scale(1.2) rotate(7deg); } 100% { opacity: 0; transform: translateX(-50%) scale(1.45); } }
@keyframes bkg-action-jump { 0%,100% { transform: translate(-50%,-50%); } 42% { transform: translate(-50%,calc(-50% - 95px)) rotate(-8deg) scale(1.12); } 68% { transform: translate(-50%,calc(-50% - 12px)) rotate(5deg); } }
@keyframes bkg-action-spin { from { transform: translate(-50%,-50%) rotate(0); } to { transform: translate(-50%,-50%) rotate(720deg) scale(1.08); } }
@keyframes bkg-action-dance { 0%,100% { transform: translate(-50%,-50%) rotate(0); } 20% { transform: translate(calc(-50% - 16px),calc(-50% - 10px)) rotate(-18deg); } 45% { transform: translate(calc(-50% + 16px),calc(-50% - 20px)) rotate(18deg); } 70% { transform: translate(calc(-50% - 9px),calc(-50% - 8px)) rotate(-10deg); } }
@keyframes bkg-action-open { 0% { transform: translate(-50%,-50%) scaleX(1); } 45% { transform: translate(-50%,-50%) scaleX(.55) rotateY(45deg); } 100% { transform: translate(-50%,-50%) scaleX(1.08); } }
@keyframes bkg-action-move { 0% { transform: translate(-50%,-50%); } 75%,100% { transform: translate(calc(-50% + var(--bkg-move-x,0px)),calc(-50% + var(--bkg-move-y,0px))) scale(.75); } }
@keyframes bkg-action-slide { 0%,100% { transform: translate(-50%,-50%); } 55% { transform: translate(calc(-50% - 125px),calc(-50% + 70px)) rotate(-20deg); } }
@keyframes bkg-action-give { 0% { transform: translate(-50%,-50%); } 55% { transform: translate(-50%,calc(-50% - 135px)) scale(1.15); } 100% { transform: translate(-50%,-50%) scale(.9); opacity: .45; } }
@keyframes bkg-focus-success { 0% { transform: translate(-50%,-50%) rotate(-2deg) scale(.9); } 55% { transform: translate(-50%,-50%) rotate(3deg) scale(1.12); } 100% { transform: translate(-50%,-50%) rotate(0) scale(1); } }

@media (max-width:1100px) and (min-width:761px) {
  .bkg-subject-grid { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:980px; }
  .bkg-subject-card { min-height:190px; }
  .bkg-shopping-workspace { grid-template-columns:minmax(220px,.7fr) minmax(400px,1.3fr); }
  .bkg-shopping-basket { grid-column:1/-1; min-height:0; }
  .bkg-shopping-basket > div:first-of-type { grid-template-columns:repeat(2,1fr); }
  .bkg-shop-payment { grid-template-columns:1fr 1.4fr; }
  .bkg-shop-decision { grid-template-columns:1fr 1fr; }
  .bkg-shop-decision__math { grid-column:1/-1; text-align:center; }
  .bkg-shop-decision__math > div { justify-content:center; }
}

@media (max-width: 760px) {
  .bkg-app { min-height: 100svh; margin: 0; border-width: 0; border-radius: 0; }
  .bkg-main { min-height: calc(100svh - 68px); }
  .bkg-topbar { min-height: 68px; padding-inline: 12px; }
  .bkg-top-links a { min-width: 42px; justify-content: center; padding-inline: 8px; }
  .bkg-top-links a span:last-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .bkg-screen { width: min(100% - 24px, 1080px); }
  .bkg-subject-hub { padding-block:24px; }
  .bkg-subject-grid { grid-template-columns:1fr; gap:14px; }
  .bkg-subject-card { grid-template-columns:70px 1fr; min-height:200px; padding:20px; border-radius:24px; }
  .bkg-subject-card > span { width:70px; border-radius:20px; font-size:38px; }
  .bkg-subject-card strong { font-size:26px; }
  .bkg-levels { grid-template-columns: 1fr; }
  .bkg-game-grid { grid-template-columns: 1fr; }
  .bkg-world-grid, .bkg-activity-grid:has(.bkg-game-card:nth-child(3)) { grid-template-columns: 1fr; }
  .bkg-world-grid .bkg-game-card { grid-template-columns: 78px 1fr; justify-items: stretch; text-align: left; }
  .bkg-activity-grid .bkg-game-card { grid-template-columns: 68px 1fr; min-height: 126px; padding: 16px; }
  .bkg-activity-grid .bkg-game-card__art { width: 64px; font-size: 33px; }
  .bkg-game-card { grid-template-columns: 78px 1fr; min-height: 132px; padding: 18px; }
  .bkg-game-card__art { width: 74px; border-radius: 22px; font-size: 38px; }
  .bkg-level-card { grid-template-columns: 74px 1fr; min-height: 108px; justify-items: start; align-content: center; text-align: left; }
  .bkg-level-card__art { grid-row: 1 / 3; width: 66px; border-radius: 20px; font-size: 35px; }
  .bkg-level-card small { grid-column: 2; }
  .bkg-hub { padding: 38px 0; }
  .bkg-hub__intro { margin-bottom: 25px; }
  .bkg-age-picker { margin-top: -10px; }
  .bkg-age-picker button { min-height: 68px; font-size: 17px; }
  .bkg-center-links { grid-template-columns:1fr; }
  .bkg-age-game-grid { grid-template-columns:1fr; }
  .bkg-age-games__head { align-items:start; flex-direction:column; gap:3px; }
  .bkg-prompt-card { grid-template-columns: 50px 1fr 58px; min-height: 88px; gap: 10px; padding: 11px; }
  .bkg-character span { width: 48px; font-size: 20px; }
  .bkg-listen-button { min-width: 56px; min-height: 56px; padding: 8px; border-radius: 17px; }
  .bkg-listen-button span:last-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .bkg-listen-button span:first-child { font-size: 23px; }
  .bkg-mic-button { min-width: 64px; min-height: 62px; padding: 6px; border-radius: 17px; }
  .bkg-mic-button > span:last-child { font-size: 10px; }
  .bkg-prompt-card__speaker { font-size: 10px; }
  .bkg-feedback { font-size: 12px; }
  .bkg-scene { aspect-ratio: 4 / 5; }
  .bkg-scene--geography .bkg-objects { grid-template-columns:1fr; align-content:center; gap:10px; padding:52px 18px 24px; }
  .bkg-scene--geography .bkg-object { grid-template-columns:105px 1fr; min-height:112px; gap:12px; padding:8px 14px; text-align:left; }
  .bkg-scene--geography .bkg-object > span { width:105px; }
  .bkg-scene--geography .bkg-object small { font-size:15px; text-align:left; }
  .bkg-scene--geography .bkg-rich-visual { min-height:88px; }
  .bkg-scene--geography .bkg-rich-visual svg { height:88px; }
  .bkg-scene--geography .bkg-rich-visual > b { font-size:48px; }
  .bkg-world-map { min-height:520px; border-radius:24px; }
  .bkg-map-piece { min-width:105px; min-height:62px; padding:8px 10px; font-size:13px; }
  .bkg-robot-workspace { grid-template-columns:1fr; }
  .bkg-robot-board { width:min(100%,520px); margin-inline:auto; border-radius:22px; }
  .bkg-program-panel { padding:18px 14px; border-radius:22px; }
  .bkg-command-palette button { grid-template-columns:38px 1fr; min-height:62px; padding:8px; }
  .bkg-program-controls { grid-template-columns:1fr 1fr; }
  .bkg-program-controls .bkg-button--primary { grid-column:1/-1; }
  .bkg-grid-robot { border-width:3px; border-radius:17px; }
  .bkg-spatial-build-workspace { grid-template-columns:1fr; }
  .bkg-spatial-build-board { min-height:520px; border-radius:24px; }
  .bkg-spatial-build-target { width:102px; min-height:96px; padding:6px; border-radius:19px; }
  .bkg-spatial-build-target span { font-size:34px; }
  .bkg-spatial-build-tray { padding:17px 14px; border-radius:23px; }
  .bkg-spatial-build-pieces { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .bkg-spatial-build-piece { min-height:94px; padding:6px; border-radius:17px; }
  .bkg-spatial-build-piece span { font-size:34px; }
  .bkg-spatial-position-workspace { grid-template-columns:1fr; }
  .bkg-spatial-position-board { min-height:520px; border-radius:24px; }
  .bkg-spatial-position-reference { width:98px; min-height:102px; border-radius:21px; }
  .bkg-spatial-position-zone { width:78px; min-height:78px; padding:4px; }
  .bkg-spatial-position-zone > span { font-size:25px; }
  .bkg-spatial-position-tray { grid-template-columns:1fr 150px; align-items:center; padding:14px; border-radius:22px; }
  .bkg-spatial-position-tray > .bkg-button { grid-column:1/-1; }
  .bkg-spatial-position-elif { min-height:112px; }
  .bkg-spatial-position-elif span { font-size:50px; }
  .bkg-spatial-memory-preview, .bkg-spatial-memory-rebuild { padding:16px 10px; border-radius:24px; }
  .bkg-spatial-memory-heading { align-items:flex-start; }
  .bkg-spatial-memory-heading .bkg-button { min-height:48px; padding:8px 11px; font-size:12px; }
  .bkg-spatial-memory-route, .bkg-spatial-memory-recall { justify-content:flex-start; min-height:132px; padding:10px 8px; }
  .bkg-spatial-memory-stop, .bkg-spatial-memory-recall-slot { flex-basis:82px; min-height:105px; border-radius:18px; }
  .bkg-spatial-memory-stop span, .bkg-spatial-memory-recall-slot span { font-size:34px; }
  .bkg-spatial-memory-choices { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .bkg-spatial-memory-choice { min-height:94px; padding:6px; border-radius:17px; }
  .bkg-spatial-memory-choice span { font-size:33px; }
  .bkg-spatial-memory-controls { display:grid; grid-template-columns:1fr 1fr; }
  .bkg-spatial-memory-controls .bkg-button--primary { grid-column:1/-1; min-width:0; }
  .bkg-rotation-workspace { grid-template-columns:1fr 42px 1fr; gap:7px; padding:16px 8px; border-radius:24px; }
  .bkg-rotation-card { min-height:230px; gap:10px; padding:10px 6px; border-radius:21px; }
  .bkg-rotation-object { width:min(32vw,145px); }
  .bkg-rotation-arrow { font-size:34px; }
  .bkg-rotation-controls { display:grid; grid-template-columns:1fr 1fr; }
  .bkg-rotation-controls .bkg-button--primary { min-width:0; }
  .bkg-perspective-scene { min-height:540px; border-radius:24px; }
  .bkg-perspective-object { width:100px; min-height:96px; padding:7px; border-radius:20px; }
  .bkg-perspective-object span { font-size:36px; }
  .bkg-perspective-elif { width:92px; min-height:108px; border-radius:25px; }
  .bkg-perspective-elif i { top:-29%; font-size:45px; }
  .bkg-maths-workspace { grid-template-columns:1fr; }
  .bkg-maths-zones { grid-template-columns:repeat(auto-fit,minmax(145px,1fr)); }
  .bkg-maths-zone { min-height:210px; padding:13px; border-radius:23px; }
  .bkg-maths-zone__items { min-height:115px; padding:7px; }
  .bkg-maths-zone--frame .bkg-maths-zone__items { grid-template-columns:repeat(5,minmax(38px,1fr)); }
  .bkg-maths-tray { min-height:0; padding:17px 14px; border-radius:23px; }
  .bkg-maths-pieces { grid-template-columns:repeat(auto-fill,minmax(52px,1fr)); }
  .bkg-maths-piece { min-width:49px; min-height:49px; padding:4px; border-radius:15px; }
  .bkg-maths-piece img { width:38px; height:38px; }
  .bkg-maths-controls { display:grid; grid-template-columns:1fr 1fr; }
  .bkg-maths-controls .bkg-button--primary { grid-column:1/-1; min-width:0; }
  .bkg-shopping-workspace { grid-template-columns:1fr; }
  .bkg-shop-decision { grid-template-columns:1fr; gap:12px; padding:17px 13px; border-radius:24px; }
  .bkg-shop-goal { justify-content:center; }.bkg-shop-goal img { width:92px; height:92px; }
  .bkg-coin-jar { min-height:215px; }
  .bkg-shop-decision__math { text-align:center; }.bkg-shop-decision__math > div { justify-content:center; }.bkg-shop-decision__math .bkg-button { flex:1; min-width:125px; }
  .bkg-shopping-list,.bkg-supermarket,.bkg-shopping-basket { min-height:0; padding:15px 12px; border-radius:22px; }
  .bkg-supermarket { padding:0; }
  .bkg-shop-departments { overflow-x:auto; grid-template-columns:repeat(5,minmax(78px,1fr)); }
  .bkg-shop-shelf { min-height:340px; padding:13px; }
  .bkg-shop-product { min-height:142px; border-radius:18px; }
  .bkg-shop-product > span,.bkg-shop-product img { width:72px; height:72px; }
  .bkg-shop-payment { grid-template-columns:1fr; padding:16px 13px; border-radius:22px; }
  .bkg-shop-cash { grid-template-columns:repeat(4,1fr); }
  .bkg-shop-payment > strong { text-align:left; }
  .bkg-shop-payment > div:last-child { grid-template-columns:1fr 1fr; }
  .bkg-cooking-workspace { grid-template-columns:1fr; }
  .bkg-cooking-pantry, .bkg-cooking-counter { min-height:0; padding:17px 14px; border-radius:23px; }
  .bkg-cooking-items { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .bkg-cook-item { min-height:91px; border-radius:16px; }
  .bkg-cook-item span, .bkg-cook-item img { width:43px; height:43px; }
  .bkg-cooking-counter { min-height:310px; }
  .bkg-cooking-target { width:92%; min-height:190px; border-radius:27px; }
  .bkg-stir-pad { right:4%; bottom:5%; width:105px; min-height:73px; }
  .bkg-focus-object { width: min(58%, 240px); min-height: 58%; }
  .bkg-kitchen__window { left: 38%; width: 29%; height: 23%; }
  .bkg-kitchen__cabinet { top: 12%; width: 22%; height: 22%; }
  .bkg-kitchen__cabinet--one { left: 8%; }
  .bkg-kitchen__cabinet--two { right: 4%; }
  .bkg-kitchen__counter { left: 9%; right: 3%; top: 55%; height: 19%; }
  .bkg-kitchen__rug { left: 29%; width: 52%; bottom: 5%; }
  .bkg-object { width: clamp(48px, 13vw, 64px); min-height: clamp(48px, 13vw, 64px); border-radius: 18px; }
  .bkg-object--large { width: clamp(58px, 16vw, 76px); min-height: clamp(76px, 20vw, 98px); }
  .bkg-object[data-object-id="fridge"] { --bkg-x: 9% !important; --bkg-y: 46% !important; }
  .bkg-object[data-object-id="toaster"] { --bkg-x: 27% !important; --bkg-y: 48% !important; }
  .bkg-object[data-object-id="cookies"] { --bkg-x: 40% !important; --bkg-y: 48% !important; }
  .bkg-object[data-object-id="red-cup"] { --bkg-x: 56% !important; --bkg-y: 48% !important; }
  .bkg-object[data-object-id="yellow-bowl"] { --bkg-x: 72% !important; --bkg-y: 48% !important; }
  .bkg-object[data-object-id="blue-plate"] { --bkg-x: 88% !important; --bkg-y: 48% !important; }
  .bkg-object[data-object-id="apple"] { --bkg-x: 47% !important; --bkg-y: 57% !important; }
  .bkg-object[data-object-id="spoon"] { --bkg-x: 65% !important; --bkg-y: 62% !important; }
  .bkg-story-reader, .bkg-story-quiz { width: min(100% - 18px, 1080px); padding-top: 12px; }
  .bkg-dictionary { width: min(100% - 22px,1080px); padding-top: 26px; }
  .bkg-dictionary__actions { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .bkg-dictionary__actions .bkg-button { width: 100%; }
  .bkg-word-grid { grid-template-columns: repeat(2,1fr); gap: 9px; }
  .bkg-word-card { border-radius: 18px; }
  .bkg-word-card__hear { min-height: 190px; padding: 14px 8px 10px; }
  .bkg-word-card__hear > span { font-size: 56px; }
  .bkg-word-card__hear small { font-size: 11px; }
  .bkg-dictionary-tools { align-items: stretch; flex-direction: column; }
  .bkg-dictionary-tools .bkg-control { width: 100%; }
  .bkg-dictionary-quiz { width: min(100% - 18px,1080px); padding-top: 12px; }
  .bkg-mission { width: min(100% - 14px,1080px); }
  .bkg-mission-scene { border-width: 3px; border-radius: 18px; }
  .bkg-journey { width: min(100% - 22px,1080px); padding-top: 28px; }
  .bkg-journey__intro { margin-bottom: 24px; }
  .bkg-journey-map { grid-template-columns: 1fr; gap: 10px; max-width: 560px; }
  .bkg-journey-map::before { top: 5%; bottom: 5%; left: 31px; width: 7px; height: auto; }
  .bkg-journey-stop { grid-template-columns: 48px 48px 1fr; min-height: 92px; justify-items: start; gap: 10px; padding: 13px 14px; text-align: left; }
  .bkg-journey-stop.is-current { transform: translateX(4px); }
  .bkg-journey-stop__icon { font-size: 34px; }
  .bkg-journey-stop strong, .bkg-journey-stop small { grid-column: 3; }
  .bkg-journey-stop strong { align-self: end; }
  .bkg-journey-stop small { align-self: start; }
  .bkg-journey-stop__number { grid-row: 1 / 3; }
  .bkg-journey-stop__icon { grid-row: 1 / 3; }
  .bkg-rewards { width: min(100% - 22px,1080px); padding-top: 28px; }
  .bkg-reward-summary { grid-template-columns: repeat(3,1fr); gap: 7px; }
  .bkg-reward-summary article { min-height: 125px; padding: 10px 5px; }
  .bkg-reward-summary span { font-size: 30px; }
  .bkg-reward-summary strong { font-size: 28px; }
  .bkg-reward-summary small { text-align: center; }
  .bkg-badge-grid { grid-template-columns: repeat(2,1fr); gap: 9px; }
  .bkg-badge { min-height: 158px; padding: 12px; }
  .bkg-story-book { grid-template-columns: 1fr; border-width: 3px; border-radius: 22px; }
  .bkg-story-art { min-height: 0; aspect-ratio: 3 / 4; }
  .bkg-story-copy { padding: 24px 20px; }
  .bkg-story-copy h2 { margin-bottom: 12px; font-size: 27px; }
  .bkg-story-copy > p:not(.bkg-eyebrow) { margin-bottom: 18px; font-size: 17px; line-height: 1.52; }
  .bkg-story-read { width: 100%; }
  .bkg-story-nav .bkg-button { min-width: 0; flex: 1; }
  .bkg-quiz-card { padding: 26px 14px; border-width: 3px; border-radius: 22px; }
  .bkg-quiz-choice { min-width: 0; flex-basis: 42%; min-height: 96px; }
  .bkg-quiz-actions .bkg-button, .bkg-quiz-actions .bkg-mic-button { flex: 1 1 130px; }
}

@media (min-width:761px) and (max-width:1100px) {
  .bkg-world-grid { grid-template-columns:repeat(2,1fr); }
  .bkg-age-game-grid { grid-template-columns:1fr; }
}

.bkg-dictionary__actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; max-width: 760px; margin: 8px 0 20px; }
@media (max-width: 760px) { .bkg-dictionary__actions { grid-template-columns: 1fr; } }
.bkg-memory { width: min(100% - 22px, 900px); padding-top: 26px; }
.bkg-memory-head { display: grid; grid-template-columns: 68px 1fr; gap: 16px; align-items: center; max-width: 760px; margin: 0 auto; }
.bkg-memory-head h2 { margin: 2px 0 4px; }
.bkg-memory-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; max-width: 760px; margin: 22px auto; }
.bkg-memory-card { min-height: 145px; border: 3px solid #f2c14e; border-radius: 20px; background: linear-gradient(145deg,#fff7da,#ffe9a8); color: #5b421d; cursor: pointer; box-shadow: 0 5px 0 rgba(181,125,32,.18); transition: transform .15s ease, border-color .15s ease; }
.bkg-memory-card:hover, .bkg-memory-card:focus-visible { transform: translateY(-3px); border-color: #ef5b4f; }
.bkg-memory-card__back { display: grid; place-items: center; height: 100%; min-height: 139px; font-size: 48px; font-weight: 900; color: #ef5b4f; }
.bkg-memory-card__face { display: none; place-items: center; gap: 5px; min-height: 139px; padding: 10px 5px; }
.bkg-memory-card__face b { font-size: 44px; line-height: 1; }
.bkg-memory-card__face strong { font-size: 15px; }
.bkg-memory-card.is-up .bkg-memory-card__back { display: none; }
.bkg-memory-card.is-up .bkg-memory-card__face { display: grid; }
.bkg-memory-card.is-matched { border-color: #4bbf8a; background: linear-gradient(145deg,#e2fff1,#baf1d6); }
.bkg-word-builder { width: min(100% - 22px, 760px); padding-top: 26px; }
.bkg-builder-card { text-align: center; background: #fff; border: 3px solid #b9e5d5; border-radius: 28px; padding: 28px 20px; box-shadow: 0 12px 26px rgba(39,94,83,.12); }
.bkg-builder-symbol { font-size: 76px; line-height: 1.1; }
.bkg-builder-built { min-height: 58px; margin: 16px auto; padding: 10px; border-bottom: 4px solid #f2c14e; color: #284f49; font-size: 34px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.bkg-builder-letters { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 18px auto; }
.bkg-builder-letter { min-width: 52px; min-height: 52px; border: 2px solid #77c8b2; border-radius: 14px; background: #e9fff7; color: #24594d; font-size: 24px; font-weight: 900; cursor: pointer; box-shadow: 0 3px 0 rgba(43,132,108,.16); }
.bkg-builder-letter:disabled { opacity: .35; transform: translateY(3px); }
@media (max-width: 560px) { .bkg-builder-card { padding: 22px 12px; } .bkg-builder-symbol { font-size: 62px; } .bkg-builder-letter { min-width: 44px; min-height: 48px; } }
@media (max-width: 560px) { .bkg-memory-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; } .bkg-memory-card { min-height: 118px; border-width: 2px; border-radius: 15px; } .bkg-memory-card__back { min-height: 114px; font-size: 38px; } .bkg-memory-card__face { min-height: 114px; } .bkg-memory-card__face b { font-size: 34px; } .bkg-memory-card__face strong { font-size: 12px; } }

@media (max-width: 430px) {
  .bkg-brand > span:nth-child(2) { display: none; }
  .bkg-topbar { grid-template-columns: 44px 1fr auto 44px; padding-inline: 6px; }
  .bkg-top-links { gap: 3px; }
  .bkg-top-links a { min-height: 38px; padding: 5px 7px; }
  .bkg-top-links a span:last-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .bkg-brand { gap: 6px; }
  .bkg-brand__mark { width: 32px; border-radius: 10px; }
  .bkg-brand .bkg-star-pill { min-height: 31px; padding: 4px 8px; font-size: 12px; }
  .bkg-player-pill { max-width: 84px; font-size: 12px; }
  .bkg-icon-button { width: 44px; min-height: 44px; }
  .bkg-play { padding-top: 10px; }
  .bkg-statusbar { margin-bottom: 7px; }
  .bkg-prompt-card { margin-bottom: 8px; }
  .bkg-progress__dot { width: 20px; }
  .bkg-controls { margin-top: 9px; }
  .bkg-control { flex: 1; padding-inline: 8px; font-size: 13px; }
  .bkg-speak-choices { gap: 6px; }
  .bkg-choice { min-width: 0; flex: 1; min-height: 68px; padding-inline: 5px; }
}

@media (max-width: 360px) {
  .bkg-brand__mark { display: none; }
  .bkg-player-pill { max-width: 68px; }
}

/* Theme integration: themes may opt in with add_theme_support('byleron-kids-games'). */
.bkg-app[data-bkg-theme-integrated="1"] {
  --bkg-primary:var(--byleron-primary,var(--c-primary,#3bcdaa));
  --bkg-primary-dark:var(--byleron-primary-dark,var(--c-primary-h,#168f73));
  --bkg-secondary:var(--byleron-secondary,var(--c-secondary,#69bbf5));
  --bkg-ink:var(--byleron-text,var(--c-text,#18212a));
  --bkg-muted:var(--byleron-muted,var(--c-text-2,#5f6b76));
  --bkg-surface:var(--byleron-surface,var(--c-surface,#fff));
  --bkg-soft:var(--byleron-soft,var(--c-surface2,#f0f7f6));
  --bkg-border:var(--byleron-border,var(--c-border,#dfe9e7));
  --card-vocab-1:var(--byleron-vocab-1,#F1F0FE);
  --card-vocab-2:var(--byleron-vocab-2,#EDF7FE);
  --card-vocab-3:var(--byleron-vocab-3,#F0F9F3);
  --card-vocab-4:var(--byleron-vocab-4,#FBF5D7);
  min-height:calc(100svh - var(--byleron-site-header-height,72px));
  border:0;
  border-radius:0;
  box-shadow:none;
}
.bkg-app[data-bkg-theme-integrated="1"] .bkg-topbar { position:static; z-index:auto; display:block; height:0; min-height:0; padding:0; border:0; background:transparent; }
.bkg-app[data-bkg-theme-integrated="1"] .bkg-main { min-height:calc(100svh - var(--byleron-site-header-height,72px)); }
.bkg-app[data-bkg-theme-integrated="1"] .bkg-topbar > [data-bkg-home],
.bkg-app[data-bkg-theme-integrated="1"] .bkg-topbar > [data-bkg-fullscreen] { position:fixed; bottom:max(16px,env(safe-area-inset-bottom)); z-index:90; width:54px; min-height:54px; border:2px solid var(--bkg-border); border-radius:18px; background:color-mix(in srgb,var(--bkg-surface) 94%,transparent); box-shadow:0 10px 30px rgba(24,33,42,.18); backdrop-filter:blur(12px); }
.bkg-app[data-bkg-theme-integrated="1"] .bkg-topbar > [data-bkg-home] { left:max(16px,env(safe-area-inset-left)); }
.bkg-app[data-bkg-theme-integrated="1"] .bkg-topbar > [data-bkg-fullscreen] { right:max(16px,env(safe-area-inset-right)); }

/* Keep a complete question, scene, and its controls inside a laptop viewport. */
@media (min-width:761px) {
  .bkg-app[data-bkg-theme-integrated="1"] .bkg-play { padding:7px 0 9px; }
  .bkg-app[data-bkg-theme-integrated="1"] .bkg-play .bkg-statusbar { min-height:28px; margin-bottom:5px; }
  .bkg-app[data-bkg-theme-integrated="1"] .bkg-play .bkg-prompt-card { min-height:74px; margin-bottom:7px; padding:8px 13px; }
  .bkg-app[data-bkg-theme-integrated="1"] .bkg-play .bkg-character span { width:46px; font-size:20px; }
  .bkg-app[data-bkg-theme-integrated="1"] .bkg-play .bkg-caption { font-size:clamp(16px,1.45vw,20px); }
  .bkg-app[data-bkg-theme-integrated="1"] .bkg-play .bkg-feedback { min-height:18px; font-size:12px; }
  .bkg-app[data-bkg-theme-integrated="1"] .bkg-play .bkg-listen-button { min-height:46px; }
  .bkg-app[data-bkg-theme-integrated="1"] .bkg-play > .bkg-scene { height:clamp(260px,calc(100svh - var(--byleron-site-header-height,72px) - 205px),780px); aspect-ratio:auto; }
  .bkg-app[data-bkg-theme-integrated="1"] .bkg-play .bkg-controls { margin-top:7px; }
  .bkg-app[data-bkg-theme-integrated="1"] .bkg-play .bkg-control { min-height:42px; padding-block:6px; }
  .bkg-app[data-bkg-theme-integrated="1"]:fullscreen .bkg-play > .bkg-scene { height:clamp(300px,calc(100svh - 178px),780px); }
}

html.dark-mode .bkg-app {
  background:var(--bkg-surface);
}
html.dark-mode .bkg-shell { background:linear-gradient(180deg,#25282f,#202329); }
html.dark-mode .bkg-topbar { background:rgba(37,40,47,.96); }
html.dark-mode .bkg-icon-button, html.dark-mode .bkg-top-links a, html.dark-mode .bkg-age-picker button, html.dark-mode .bkg-subject-card, html.dark-mode .bkg-game-card, html.dark-mode .bkg-level-card { background:var(--bkg-surface); color:var(--bkg-ink); }
html.dark-mode .bkg-player-link,html.dark-mode .bkg-player-tools .bkg-star-pill,html.dark-mode .bkg-age-disclosure > summary { background:var(--bkg-surface); border-color:var(--bkg-border); }
html.dark-mode .bkg-subject-card--english, html.dark-mode .bkg-subject-card--maths, html.dark-mode .bkg-subject-card--cook, html.dark-mode .bkg-subject-card--shopping, html.dark-mode .bkg-subject-card--coding, html.dark-mode .bkg-subject-card--geography { background:linear-gradient(145deg,#2b2f36,#25282f); }
html.dark-mode .bkg-age-picker button.is-selected { background:#3b3154; }
html.dark-mode .bkg-prompt-card, html.dark-mode .bkg-program-panel, html.dark-mode .bkg-spatial-build-tray, html.dark-mode .bkg-spatial-position-tray, html.dark-mode .bkg-spatial-memory-preview, html.dark-mode .bkg-spatial-memory-rebuild { background:linear-gradient(145deg,#2b3037,#272a32); }
html.dark-mode .bkg-control,html.dark-mode .bkg-button,html.dark-mode .bkg-choice,html.dark-mode .bkg-age-game,html.dark-mode .bkg-map-tray,html.dark-mode .bkg-maths-tray,html.dark-mode .bkg-cooking-pantry,html.dark-mode .bkg-cooking-counter,html.dark-mode .bkg-category-tab,html.dark-mode .bkg-word-card,html.dark-mode .bkg-word-card__actions button,html.dark-mode .bkg-builder-card,html.dark-mode .bkg-badge { background:var(--bkg-surface); color:var(--bkg-ink); border-color:var(--bkg-border); }
html.dark-mode .bkg-level-card.is-recommended,html.dark-mode .bkg-age-picker button.is-selected,html.dark-mode .bkg-control.is-active { background:#3b3154; color:var(--bkg-ink); }
html.dark-mode .bkg-level-pill { background:rgba(59,205,170,.18); color:#78e5cb; }
html.dark-mode .bkg-review-nudge { background: rgba(255,179,71,.2); color: #ffcf8a; }
html.dark-mode .bkg-progress__dot { background:#50555f; }
html.dark-mode .bkg-feedback.is-support,html.dark-mode .bkg-privacy-note { color:var(--bkg-muted); }
html.dark-mode .bkg-spatial-memory-choice,html.dark-mode .bkg-spatial-memory-stop,html.dark-mode .bkg-spatial-memory-recall-slot { background:#30343d; color:#f4f0ff; border-color:#565064; }
html.dark-mode .bkg-scene { border-color:#47515b; background:linear-gradient(90deg,transparent 49.6%,rgba(105,187,245,.08) 50%,transparent 50.4%),linear-gradient(#253641 0 66%,#40372f 66% 100%); box-shadow:inset 0 0 60px rgba(59,205,170,.06),0 10px 28px rgba(0,0,0,.22); }
html.dark-mode .bkg-scene--topic { background:radial-gradient(circle at 12% 15%,rgba(255,255,255,.07) 0 7%,transparent 7.4%),radial-gradient(circle at 88% 22%,rgba(255,213,104,.11) 0 8%,transparent 8.4%),linear-gradient(145deg,#203b38,#2e3045 55%,#413c2b); }
html.dark-mode .bkg-scene--maths { background:radial-gradient(circle at 12% 18%,rgba(255,213,104,.13) 0 7%,transparent 7.4%),radial-gradient(circle at 88% 22%,rgba(59,205,170,.12) 0 9%,transparent 9.4%),linear-gradient(145deg,#263642,#332d45 55%,#423d2a); }
html.dark-mode .bkg-scene--coding { background:radial-gradient(circle at 13% 17%,rgba(91,205,255,.1) 0 8%,transparent 8.4%),linear-gradient(145deg,#20323c,#272f43 55%,#352d45); }
html.dark-mode .bkg-scene--geography { background:radial-gradient(circle at 14% 18%,rgba(255,213,104,.12) 0 7%,transparent 7.4%),linear-gradient(145deg,#203845,#253d34 58%,#423b28); }
html.dark-mode .bkg-age-games { border-color:var(--bkg-border); background:linear-gradient(145deg,#27333a,#302b3d); }
html.dark-mode .bkg-age-game b { color:#78e5cb; }
html.dark-mode .bkg-spatial-build-board,
html.dark-mode .bkg-spatial-position-board,
html.dark-mode .bkg-perspective-scene,
html.dark-mode .bkg-rotation-workspace { border-color:#4b505c; background:linear-gradient(rgba(255,255,255,.045) 2px,transparent 2px),linear-gradient(90deg,rgba(255,255,255,.045) 2px,transparent 2px),radial-gradient(circle at 50% 50%,rgba(255,213,104,.08) 0 13%,transparent 13.5%),linear-gradient(145deg,#203a38,#302f46 62%,#423c2a); background-size:25% 25%,25% 25%,auto,auto; box-shadow:0 16px 38px rgba(0,0,0,.28); }
html.dark-mode .bkg-spatial-build-board::before,
html.dark-mode .bkg-spatial-build-board::after,
html.dark-mode .bkg-perspective-scene::before,
html.dark-mode .bkg-perspective-scene::after { background:rgba(153,115,220,.14); }
html.dark-mode .bkg-spatial-build-target,
html.dark-mode .bkg-spatial-build-piece,
html.dark-mode .bkg-spatial-position-reference,
html.dark-mode .bkg-spatial-position-zone,
html.dark-mode .bkg-spatial-position-elif,
html.dark-mode .bkg-perspective-object,
html.dark-mode .bkg-rotation-card { border-color:#5c586a; background:#30343d; color:#f4f0ff; box-shadow:0 9px 22px rgba(0,0,0,.24); }
html.dark-mode .bkg-spatial-build-target small,
html.dark-mode .bkg-spatial-build-piece small,
html.dark-mode .bkg-spatial-position-board::after,
html.dark-mode .bkg-spatial-position-tray h3,
html.dark-mode .bkg-perspective-compass,
html.dark-mode .bkg-rotation-card small,
html.dark-mode .bkg-rotation-card strong { color:#d7c8ff; }
html.dark-mode .bkg-spatial-build-target.is-selected-target,
html.dark-mode .bkg-spatial-build-piece.is-selected,
html.dark-mode .bkg-spatial-position-zone:hover:not(:disabled),
html.dark-mode .bkg-spatial-position-zone.is-selected-target { border-color:#78e5cb; background:#263f3a; color:#e7fff8; }
html.dark-mode .bkg-spatial-build-target.is-filled,
html.dark-mode .bkg-spatial-position-zone.is-correct,
html.dark-mode .bkg-perspective-object.is-correct { border-color:#57d5b8; background:#24463e; color:#e7fff8; }
html.dark-mode .bkg-spatial-memory-route,
html.dark-mode .bkg-spatial-memory-recall { border-color:#565064; background:rgba(21,24,30,.58); }
html.dark-mode .bkg-rotation-card--target .bkg-rotation-shape { background:#666170; outline-color:#aaa0bf; }
html.dark-mode .bkg-cooking-counter { background:linear-gradient(#332f2d 0 60%,#4b382e 60%); }
html.dark-mode .bkg-cooking-counter::before { background:#73513d; box-shadow:0 9px 0 rgba(255,255,255,.07); }
html.dark-mode .bkg-cooking-target { border-color:#98754f; background:rgba(35,38,45,.88); }
html.dark-mode .bkg-cooking-target > strong { color:#ffe0b5; }
html.dark-mode .bkg-cooking-target__hint { color:#d9c3aa; }
html.dark-mode .bkg-cook-item,
html.dark-mode .bkg-cook-step,
html.dark-mode .bkg-cooking-result span { border-color:#4e625d; background:#303b39; color:#eefcf8; }
html.dark-mode .bkg-cook-item.is-current,
html.dark-mode .bkg-cook-step.is-current { border-color:#57d5b8; background:#25443d; color:#e7fff8; }
html.dark-mode .bkg-stir-pad { border-color:#a990e8; background:#353047; color:#eee7ff; }
html.dark-mode .bkg-cooking-result .bkg-cooking-scene-object { background:#253330; box-shadow:0 8px 20px rgba(0,0,0,.28); }
html.dark-mode .bkg-shopping-list,html.dark-mode .bkg-shopping-basket,html.dark-mode .bkg-supermarket,html.dark-mode .bkg-shop-payment,html.dark-mode .bkg-shop-decision { border-color:#55515f; background:linear-gradient(145deg,#2b3037,#272a32); color:var(--bkg-ink); }
html.dark-mode .bkg-shop-goal,html.dark-mode .bkg-shop-choice-goal { border-color:#565d65; background:#30353d; color:#f4f7f7; }
html.dark-mode .bkg-shop-goal b,html.dark-mode .bkg-coin-jar > b { color:#ffd568; }
html.dark-mode .bkg-shop-departments { border-color:#55515f; background:#282c33; }
html.dark-mode .bkg-shop-departments button { color:var(--bkg-ink); }
html.dark-mode .bkg-shop-departments button.is-active { border-color:#d4aa4f; background:#413b2c; }
html.dark-mode .bkg-shop-shelf { background:repeating-linear-gradient(0deg,rgba(255,213,104,.1) 0 4px,transparent 4px 174px),#292d34; }
html.dark-mode .bkg-shop-product,html.dark-mode .bkg-shop-list-item,html.dark-mode .bkg-shop-basket-item { border-color:#565d65; background:#30353d; color:#f4f7f7; }
html.dark-mode .bkg-shop-list-item.is-done { border-color:#57d5b8; background:#25443d; }
html.dark-mode .bkg-shop-basket-item button { border-color:#597b73; background:#252b31; color:#78e5cb; }
html.dark-mode .bkg-shop-money { background:#353047; }
html.dark-mode .bkg-shop-cash button { border-color:#57a993; background:#263c37; color:#dffbf4; }

@media (max-width:760px) {
  .bkg-app[data-bkg-theme-integrated="1"] { min-height:calc(100svh - var(--byleron-site-header-height-mobile,62px)); }
  .bkg-app[data-bkg-theme-integrated="1"] .bkg-main { min-height:calc(100svh - var(--byleron-site-header-height-mobile,62px)); }
  .bkg-app[data-bkg-theme-integrated="1"] .bkg-topbar > [data-bkg-home],
  .bkg-app[data-bkg-theme-integrated="1"] .bkg-topbar > [data-bkg-fullscreen] { width:48px; min-height:48px; border-radius:15px; font-size:21px; }
}

@media (prefers-reduced-motion: reduce) {
  .bkg-app *, .bkg-app *::before, .bkg-app *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}