/* Diagram styles for shared/figures.js: double number lines, tape diagrams, ratio tables, shapes, coins.
   Load after game.css.
   ic-a … ic-d the shapes to count (MARKS); grp a dashed group box (new: the added batches); ftxt figure text (big larger,
   mid centered, rev cyan: a value the hint reveals); nl a number line; qb the gold ? box; rt a ratio table */
.ic-a{fill:rgba(255,201,60,.35);stroke:var(--gold);stroke-width:2.5}
.ic-b{fill:rgba(127,227,255,.3);stroke:var(--cyan);stroke-width:2.5}
.ic-c{fill:rgba(255,138,196,.3);stroke:var(--pink);stroke-width:2.5;stroke-linejoin:round}
.ic-d{fill:rgba(95,224,168,.3);stroke:var(--good);stroke-width:2.5;stroke-linejoin:round}
.ic-blue{fill:#3d7bff;stroke:#9dbcff;stroke-width:2}
.ic-yel{fill:#ffd23c;stroke:#fff1b8;stroke-width:2}
.grp{fill:none;stroke:rgba(243,246,251,.45);stroke-width:1.5;stroke-dasharray:6 5}
.grp.new{stroke:var(--cyan)}
.ftxt{fill:var(--dim);font:700 15px var(--mono)}
.ftxt.big{fill:var(--chalk);font-size:20px}
.ftxt.rev{fill:var(--cyan)}
.ftxt.mid{text-anchor:middle}
.nl{stroke:var(--chalk);stroke-width:2.5}
.nl-arrow{fill:var(--chalk)}
.tick{stroke:var(--chalk);stroke-width:2.5}
.tick.rev{stroke:var(--cyan)}
.qb rect{fill:var(--gold)}.qb text{fill:#1a1300;font:800 18px var(--mono);text-anchor:middle;dominant-baseline:central}
.tape{fill:rgba(255,201,60,.22);stroke:var(--gold);stroke-width:2.5}
.tape.b{fill:rgba(127,227,255,.2);stroke:var(--cyan)}
.brace{fill:none;stroke:var(--chalk);stroke-width:2.5}
.coin{fill:#c9d3df;stroke:#f3f6fb;stroke-width:2}.coin.cu{fill:#d9895a;stroke:#f5c6a5}
.coin-t{fill:#1a1300;font:700 13px var(--mono);text-anchor:middle;dominant-baseline:central}
.swatch{stroke:rgba(243,246,251,.6);stroke-width:2}
table.rt{border-collapse:collapse;margin:6px auto;font:700 20px var(--mono);font-variant-numeric:tabular-nums}
table.rt th{font:700 14px/1.25 var(--mono);color:var(--dim);padding:8px 14px;border-bottom:2px solid rgba(243,246,251,.5);max-width:11em}
table.rt td{padding:8px 18px;text-align:center;border-bottom:1px solid rgba(170,205,255,.25)}
table.rt td+td{border-left:2px solid rgba(243,246,251,.5)}
table.rt td.note{border:0;color:var(--cyan);font-size:15px;text-align:left;padding-left:12px;white-space:nowrap}
table.rt tr.rev td:not(.note){color:var(--cyan)}
table.rt .q{display:inline-block;min-width:1.8em;background:var(--gold);color:#1a1300;border-radius:6px;padding:0 6px}
