/* Multiplication trainer */
.mt{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}
.mt button{font:inherit;cursor:pointer}
.mt-row{display:grid;grid-template-columns:150px 1fr;gap:6px 14px;align-items:start;padding:8px 0;border-bottom:1px dashed var(--line)}
.mt-lab{font-weight:700;font-size:.92rem;padding-top:7px}
.mt-chips{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:6px}
.mt-c{border:1.5px solid var(--line);background:#fff;border-radius:10px;padding:7px 0;font-weight:700;font-size:1rem;color:var(--ink)}
.mt-c[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.mt-pre{grid-column:2;display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.mt-pre button,.mt-link,.mt-print,.mt-clear,.mt-stop{background:none;border:0;color:var(--marker-dark);text-decoration:underline;font-size:.88rem;padding:2px 4px}
.mt-opts{display:flex;flex-wrap:wrap;gap:6px}
.mt-o{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:5px 14px;font-weight:600;font-size:.92rem;color:var(--ink)}
.mt-o[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.mt-sum{color:var(--muted);font-size:.92rem;margin:10px 0 6px}
.mt-go{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:8px}
.mt-go .btn:disabled{opacity:.45;cursor:not-allowed}
.mt-linkout input{width:100%;font:inherit;font-size:.85rem;padding:6px 8px;border:1.5px solid var(--line);border-radius:8px}
.mt-hist{margin-top:14px;font-size:.9rem}
.mt-hist table{border-collapse:collapse;margin:8px 0}
.mt-hist td,.mt-hist th{border:1px solid var(--line);padding:4px 10px;text-align:left}
.mt-top{display:flex;justify-content:space-between;align-items:center;gap:10px;font-weight:600;font-size:.95rem}
.mt-score .ok{color:var(--marker-dark)}.mt-score .no{color:#c0392b;margin-left:8px}
.mt-bar,.mt-tbar{height:8px;background:var(--grid);border-radius:99px;overflow:hidden;margin:8px 0}
.mt-bar i,.mt-tbar i{display:block;height:100%;background:var(--marker);width:0;transition:width .2s}
.mt-tbar i{background:#3b6fd8;transition:none}.mt-tbar i.low{background:#e67e22}
.mt-q{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:10px;font-size:clamp(2.2rem,8vw,3.6rem);font-weight:700;margin:18px 0 6px;font-variant-numeric:tabular-nums}
.mt-in{width:3.2em;font:inherit;text-align:center;border:3px solid var(--ink);border-radius:14px;padding:2px 6px;color:var(--ink);background:#fff}
.mt-in.good{border-color:var(--marker);background:#e6f4ee}.mt-in.bad{border-color:#c0392b;background:#fbeaea}
.mt-fb{text-align:center;min-height:3.2em;margin:4px 0 10px;font-size:1.05rem}
.mt-fb.good{color:var(--marker-dark);font-weight:700}.mt-fb.bad strong{color:#c0392b;font-size:1.3rem}.mt-fb span{color:var(--muted)}
.mt-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-width:300px;margin:0 auto}
.mt-pad button{border:1.5px solid var(--line);background:var(--grid);border-radius:12px;padding:12px 0;font-size:1.35rem;font-weight:700;color:var(--ink)}
.mt-pad button:active{transform:translateY(1px)}
.mt-pad .mt-ok{background:var(--marker);color:#fff;border-color:var(--marker)}
.mt-res{text-align:left}
.mt-badge{display:inline-block;background:var(--pencil);border-radius:999px;padding:3px 14px;font-weight:700;margin:0}
.mt-big{font-size:2.6rem;font-weight:700;margin:4px 0}.mt-big small{font-size:1.2rem;color:var(--muted)}
.mt-stats{color:var(--muted);margin:0 0 6px}
.mt-miss{padding-left:20px}.mt-miss li{margin:4px 0}.mt-miss span{color:var(--muted);font-size:.92rem}
.mt-key{font-size:.85rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
.mt-key i{display:inline-block;width:14px;height:14px;border:1px solid var(--line);border-radius:3px;vertical-align:-2px;margin-right:4px}
.mt-gridw{overflow-x:auto}
.mt-grid{border-collapse:collapse;font-size:.85rem;font-variant-numeric:tabular-nums}
.mt-grid th,.mt-grid td{border:1px solid var(--line);padding:4px 6px;text-align:center;min-width:30px}
.mt-grid th{background:var(--grid)}
.mt-grid td{color:#9aa3b5}
.mt-key .g,.mt-grid td.g{background:#cdeedd}.mt-key .y,.mt-grid td.y{background:#fff0b8}.mt-key .r,.mt-grid td.r{background:#f7c6c0}
.mt-grid td.g,.mt-grid td.y,.mt-grid td.r{color:var(--ink);font-weight:700}
.mt-name input{font:inherit;padding:4px 8px;border:1.5px solid var(--line);border-radius:8px;margin-left:6px}
@media (max-width:640px){
  .mt{padding:14px 12px}
  .mt-row{grid-template-columns:1fr}
  .mt-lab{padding-top:0}
  .mt-pre{grid-column:1}
  .mt-chips{grid-template-columns:repeat(5,minmax(0,1fr))}
}
@media print{
  body.mt-printing *{visibility:hidden}
  body.mt-printing .mt,body.mt-printing .mt *{visibility:visible}
  body.mt-printing .mt{position:absolute;left:0;top:0;box-shadow:none;border:0}
  body.mt-printing .mt::before{content:"Multiplication practice results · " attr(data-name) " · mathifykids.com";display:block;font-weight:700;margin-bottom:8px}
  body.mt-printing .mt-go,body.mt-printing .mt-name{display:none}
}
.mt-quick li{margin:4px 0}.mt-quick .muted{color:var(--muted);font-size:.9rem}
.mt-clock{font-variant-numeric:tabular-nums;font-size:1.35rem;font-weight:700;color:var(--ink)}.mt-pb{margin:10px 0 0;font-size:.95rem}
/* kid-friendly extras */
.mt{position:relative;overflow:hidden}
.mt-confetti{position:absolute;inset:0;pointer-events:none}
.mt-confetti i{position:absolute;top:-30px;font-style:normal;animation:mtfall 2.2s ease-in forwards}
@keyframes mtfall{to{transform:translateY(520px) rotate(300deg);opacity:0}}
.mt-badge{font-size:1.1rem}
@media (max-width:640px){
  .mt-pad{max-width:none;gap:10px}
  .mt-pad button{padding:16px 0;font-size:1.6rem;border-radius:14px}
  .mt-o{padding:8px 14px;font-size:1rem}
  .mt-c{padding:10px 0;font-size:1.1rem}
  .mt-go .btn{flex:1 1 100%;font-size:1.1rem;padding:14px}
  .mt-q{font-size:3rem}
}
.mt-more{margin:8px 0 2px}.mt-more summary{cursor:pointer;font-weight:600;color:var(--muted);padding:6px 0}

/* rulebook: 48px targets, 8px gaps, dark ink text */
.mt-chips,.mt-opts,.mt-pre{gap:8px}
.mt-o,.mt-c,.mt-pre button,.mt-clr{min-height:48px}
.mt-pre button{background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:6px 16px;text-decoration:none;color:var(--ink);font-weight:600;font-size:1rem}
.mt-pre button[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.mt-clr{grid-column:1/-1;background:none;border:1.5px dashed var(--line);border-radius:10px;color:var(--ink);font-weight:600}
.mt-own,.mt-more{margin-top:8px}
.mt-own summary,.mt-more summary{min-height:48px;display:flex;align-items:center;cursor:pointer;font-weight:600}
.mt-own .mt-chips{margin-top:8px}
.mt-link,.mt-print,.mt-clear,.mt-stop{min-height:48px;padding:6px 12px}
.mt-fb span{color:var(--ink)}
.mt-fb.wait{color:#9a6200;font-weight:700}
.mt-pad button{min-height:56px}
.mt-say{min-height:48px;min-width:48px;border:1.5px solid var(--line);background:var(--grid);border-radius:999px;font-size:1.2rem;cursor:pointer}