/* ---------- Mini Games ---------- */
  .mg-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:10px; margin-top:10px; }
  .mg-card{ display:flex; flex-direction:column; align-items:flex-start; gap:3px; text-align:left; padding:14px; border-radius:var(--radius); border:1.5px solid var(--line);
    background:var(--card); color:var(--ink); cursor:pointer; font-family:var(--font); min-height:150px; transition:transform .1s, border-color .15s; }
  .mg-card:hover{ border-color:var(--cover); } .mg-card:active{ transform:scale(.98); }
  .mg-icon{ font-size:30px; width:50px; height:50px; border-radius:14px; background:var(--primary-tint); display:flex; align-items:center; justify-content:center; margin-bottom:6px; }
  .mg-title{ font-weight:800; font-size:15px; } .mg-sub{ font-size:12.5px; color:var(--muted); line-height:1.35; }
  .mg-best{ margin-top:auto; padding-top:8px; font-size:11.5px; font-weight:800; color:var(--cover-deep); }
  .mg-top{ display:flex; align-items:center; gap:10px; margin:4px 0 10px; } .mg-top .skip-btn{ margin:0; width:auto; }
  .mg-top-title{ font-family:var(--font-display); font-weight:800; font-size:19px; }
  .mg-stage{ background:var(--card); border:1.5px solid var(--line); border-radius:var(--radius-lg); padding:16px; min-height:320px; }
  .mg-intro{ font-size:14.5px; line-height:1.55; margin-bottom:12px; } .mg-best-line{ font-weight:800; color:var(--cover-deep); margin:6px 0 12px; font-size:13px; }
  .mg-stage .check-btn{ width:100%; margin:6px 0 0; min-height:48px; } .mg-stage .skip-btn{ width:100%; margin:8px 0 0; }
  .mg-seg{ display:flex; gap:6px; margin:4px 0 8px; } .mg-seg button{ flex:1; border:1.5px solid var(--line); background:var(--card); color:var(--ink); border-radius:12px; padding:9px 6px; font:700 12.5px var(--font); cursor:pointer; }
  .mg-seg button.on{ background:var(--cover); border-color:var(--cover); color:var(--on-cover); }
  .mg-hud{ display:flex; gap:12px; align-items:center; justify-content:space-between; font:700 14px var(--font); margin-bottom:10px; flex-wrap:wrap; }
  .mg-hud .speak-btn{ margin:0; } .mg-time.low{ color:var(--bad); }
  .mg-picture{ font-size:64px; text-align:center; line-height:1.1; margin:4px 0 6px; }
  .mg-prompt{ text-align:center; font-family:var(--font-display); font-weight:800; font-size:26px; margin:4px 0; line-height:1.3; }
  .mg-prompt-sm{ font-family:var(--font); font-size:17px; font-weight:700; }
  .mg-prompt u{ text-decoration-color:var(--gold); text-decoration-thickness:4px; text-underline-offset:5px; }
  .mg-blank{ display:inline-block; min-width:70px; border-bottom:3px dashed var(--cover); color:transparent; }
  .mg-gloss{ text-align:center; color:var(--muted); font-size:13.5px; margin-bottom:12px; }
  .mg-opts{ display:grid; gap:8px; grid-template-columns:1fr 1fr; } .mg-opts.six{ grid-template-columns:repeat(3,1fr); } .mg-opts.two{ grid-template-columns:1fr 1fr; }
  .mg-opts.chain{ grid-template-columns:1fr 1fr; }
  .mg-opt{ border:1.5px solid var(--line); background:var(--card); color:var(--ink); border-radius:14px; padding:12px 8px; font:800 17px var(--font); cursor:pointer; min-height:54px;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; transition:transform .08s; }
  .mg-opt:active{ transform:scale(.97); } .mg-opt small{ font-size:11px; font-weight:600; color:var(--muted); }
  .mg-opt .mg-big{ font-size:21px; } .mg-opts.chain .mg-big{ font-size:17px; }
  .mg-opt.right{ background:var(--ok-bg); border-color:var(--ok); } .mg-opt.wrong{ background:var(--bad-bg); border-color:var(--bad); }
  .mg-opt:disabled{ cursor:default; }
  .mg-fb{ min-height:40px; margin-top:10px; text-align:center; font-size:14px; line-height:1.45; } .mg-also{ color:var(--muted); font-size:12.5px; }
  .mg-listen{ display:flex; justify-content:center; gap:10px; margin:6px 0 4px; } .mg-listen .speak-btn{ width:64px; height:64px; font-size:26px; margin:0; }
  .mg-chain-len{ text-align:center; font-weight:800; color:var(--cover-deep); } .mg-note{ text-align:center; font-size:12.5px; color:var(--muted); }
  .mg-result{ text-align:center; padding:8px 0; } .mg-result-emoji{ font-size:54px; } .mg-result-score{ font-family:var(--font-display); font-weight:800; font-size:44px; line-height:1.1; }
  .mg-result-label{ color:var(--muted); font-weight:700; margin-bottom:10px; }
  .mg-result-stats{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:8px 0 12px; } .mg-result-stats span{ background:var(--primary-tint); border-radius:999px; padding:5px 11px; font-size:13px; }
  .mg-review{ text-align:left; background:var(--paper); border-radius:14px; padding:10px 12px; margin-bottom:10px; } .mg-review-head{ font-weight:800; font-size:13px; margin-bottom:4px; }
  .mg-review-row{ font-size:14px; padding:3px 0; border-bottom:1px dashed var(--line); } .mg-review-row:last-child{ border-bottom:0; }
  .mg-bingo{ display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
  .mg-cell{ aspect-ratio:1; border:1.5px solid var(--line); background:var(--card); color:var(--ink); border-radius:12px; cursor:pointer; padding:4px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; font-family:var(--font); }
  .mg-cell-emoji{ font-size:clamp(22px, 7vw, 34px); line-height:1; } .mg-cell-word{ font-size:clamp(10px, 2.9vw, 13px); font-weight:700; text-align:center; line-height:1.15; word-break:break-word; }
  .mg-cell.hit{ background:var(--ok-bg); border-color:var(--ok); } .mg-cell.line{ background:var(--gold-tint); border-color:var(--gold); box-shadow:0 0 0 2px var(--gold) inset; }
  .mg-cell.miss{ animation:mgShake .35s; background:var(--bad-bg); }
  .mg-cell.given{ border-style:dashed; }
  @keyframes mgShake{ 0%,100%{ transform:translateX(0); } 25%{ transform:translateX(-4px); } 75%{ transform:translateX(4px); } }
  @media (max-width:420px){ .mg-prompt{ font-size:22px; } .mg-opt{ font-size:15px; } .mg-opts.six .mg-big{ font-size:18px; } }