/* Multiplication flash cards */
.mf{border:2px solid var(--ink);border-radius:16px;background:#fff;box-shadow:6px 6px 0 var(--pencil);padding:18px 20px;margin:14px 0 28px;scroll-margin-top:80px}
.mf button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.mf-card:focus{outline:none}.mf-card:focus-visible{outline:3px solid var(--marker);outline-offset:3px}
.mf-lab{font-weight:700;margin:4px 0 6px}
.mf-chips{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:6px}
.mf-c{border:1.5px solid var(--line);background:#fff;border-radius:10px;min-height:44px;font-weight:700;font-size:1.05rem;color:var(--ink)}
.mf-c[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.mf-pre{display:flex;flex-wrap:wrap;gap:4px 10px;margin:8px 0 10px}
.mf-pre button,.mf-stop{background:none;border:0;color:var(--marker-dark);text-decoration:underline;font-size:.92rem;padding:4px 2px}
.mf-opts{display:flex;flex-wrap:wrap;gap:6px}
.mf-o{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:7px 16px;font-weight:600;color:var(--ink);min-height:44px}
.mf-o[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.mf-go{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 6px}
.mf-go .btn{min-height:48px}.mf-go .btn:disabled{opacity:.45;cursor:not-allowed}
.mf-sum,.mf-count,.mf-keys{color:var(--muted);font-size:.92rem;margin:6px 0}
.mf-bar{height:10px;background:var(--line);border-radius:99px;overflow:hidden;margin:4px 0 14px}
.mf-bar i{display:block;height:100%;background:var(--marker);transition:width .3s}
.mf-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;min-height:220px;border:3px solid var(--ink);border-radius:20px;background:#fffaf0;color:var(--ink);box-shadow:5px 5px 0 var(--pencil);transition:transform .15s}
.mf-card:active{transform:scale(.98)}
.mf-card.on{background:#effaf3}
.mf-q{font-size:clamp(2.6rem,11vw,4.2rem);font-weight:800;font-variant-numeric:tabular-nums;line-height:1.1}
.mf-q b{color:var(--marker-dark)}
.mf-tip{color:var(--muted);font-size:1rem}
.mf-ans{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.mf-ans .btn{min-height:56px;font-size:1.1rem}
.mf-stars{font-size:2.2rem;text-align:center;margin:6px 0}
.mf-score{text-align:center;font-size:1.2rem}
.mf-miss{columns:2 140px;font-size:1.1rem;font-variant-numeric:tabular-nums}
@media (max-width:640px){.mf{padding:14px 12px}.mf-chips{grid-template-columns:repeat(6,minmax(0,1fr))}.mf-card{min-height:200px}}