/* B&B original daily games: Gem Burst + Crumbapult. */
.gb-wrap, .cp-wrap, .gb-wrap *, .cp-wrap * { box-sizing: border-box; }
.gb-wrap, .cp-wrap {
  width: 100%; max-width: 720px; margin: 0 auto;
  display: flex; flex-direction: column; align-items: stretch; gap: .7rem;
}
.extra-game-head { display: flex; flex-direction: column; align-items: center; gap: .18rem; text-align: center; }
.extra-game-head strong { color: var(--ink); font-size: 1rem; }
.extra-game-kicker { color: var(--ink-soft); font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.extra-game-howto { margin: 0; padding: .65rem .75rem; border: 1px solid rgba(255,255,255,.1); border-radius: 10px; background: rgba(255,255,255,.045); color: var(--ink); font-size: .84rem; line-height: 1.45; text-align: left; }
.gb-hud, .cp-hud { display: flex; justify-content: space-between; gap: .7rem; font-weight: 800; color: var(--ink); }
.gb-score, .cp-hits { color: #68d9ef; }
.gb-moves, .cp-shots { color: #ffd08a; }
.extra-game-status { min-height: 1.4em; color: var(--ink-soft); font-size: .86rem; font-weight: 700; text-align: center; }
.extra-game-status.done { color: var(--mint-deep); }
.extra-game-actions { display: flex; justify-content: center; min-height: 2.25rem; }
.extra-share-btn {
  border: 1px solid var(--purple-soft); border-radius: 999px; padding: .48rem 1rem;
  background: var(--bg); color: var(--ink); cursor: pointer; font: inherit; font-size: .82rem; font-weight: 800;
}
.extra-share-btn:hover { border-color: var(--purple); }

.gb-grid {
  width: min(100%, 520px); margin: 0 auto; padding: clamp(6px, 1.5vw, 10px);
  display: grid; grid-template-columns: repeat(8, 1fr); gap: clamp(3px, 1vw, 7px);
  border: 1px solid rgba(139,233,253,.35); border-radius: 16px;
  background: linear-gradient(145deg, #130e25, #21143b); box-shadow: inset 0 0 32px rgba(34,184,207,.08);
}
.gb-cell {
  aspect-ratio: 1; min-width: 0; border: 0; border-radius: 25%; padding: 0;
  display: grid; place-items: center; cursor: pointer; font-size: clamp(1rem, 5.8vw, 2rem); line-height: 1;
  background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), 0 3px 8px rgba(0,0,0,.25);
  transition: transform .12s ease, filter .12s ease, opacity .12s ease;
}
.gb-cell:hover:not(:disabled) { transform: translateY(-2px) scale(1.06); filter: brightness(1.15); }
.gb-cell:focus-visible { outline: 3px solid #fff; outline-offset: 1px; }
.gb-cell.gb-empty { opacity: 0; cursor: default; }
.gb-c0 { background: rgba(71,197,255,.17); } .gb-c1 { background: rgba(85,154,255,.17); }
.gb-c2 { background: rgba(255,169,62,.17); } .gb-c3 { background: rgba(75,225,157,.17); }
.gb-c4 { background: rgba(190,103,255,.17); }
.gb-nope { animation: gbNope .28s ease; }
@keyframes gbNope { 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }

.cp-canvas {
  display: block; width: 100%; height: auto; aspect-ratio: 2 / 1;
  border: 1px solid rgba(255,208,138,.35); border-radius: 16px; background: #17102c;
  box-shadow: 0 10px 28px rgba(0,0,0,.25); cursor: grab;
}
.cp-canvas:active { cursor: grabbing; }
@media (prefers-reduced-motion: reduce) {
  .gb-cell { transition: none; }
  .gb-nope { animation: none; }
}

/* Per-game tracking picker dialog */
.track-dlg { border: 1px solid var(--purple-soft, #3a2a5e); border-radius: 16px; background: var(--card, #1b1430); color: var(--ink, #f3eefc); padding: 18px 20px; max-width: 360px; width: calc(100vw - 40px); box-shadow: 0 18px 50px rgba(0,0,0,.6); }
.track-dlg::backdrop { background: rgba(0,0,0,.55); }
.track-dlg h3 { margin: 0 0 4px; font-family: var(--font-display, inherit); font-size: 1.15rem; }
.track-sub { margin: 0 0 12px; font-size: .8rem; line-height: 1.4; color: var(--muted, #b7a9d0); }
.track-row { display: flex; align-items: center; gap: 10px; padding: 9px 6px; border-radius: 9px; cursor: pointer; font-weight: 600; }
.track-row:hover { background: rgba(255,255,255,.05); }
.track-row input { width: 18px; height: 18px; accent-color: var(--purple, #8b5cf6); cursor: pointer; }
.track-actions { display: flex; justify-content: flex-end; margin: 14px 0 0; padding: 0; }

/* ---- Settings panel (real tappable dialog; replaced the numbered prompt) ---- */
.settings-dlg {
  border: 1px solid var(--purple-soft, #3a2a5e); border-radius: 18px;