/* Drawing classes for the matrix puzzles (inside 100 x 100 viewBoxes).
   The page defines the colours: --paper, --p-ink, --p-grey, --p-white, --p-faint. */
svg { display: block; width: 100%; height: 100%; }
svg .k { fill: var(--p-ink); }
svg .kf { fill: var(--p-ink); stroke: var(--p-ink); stroke-width: 1; stroke-linejoin: round; }
svg .gf { fill: var(--p-grey); stroke: var(--p-ink); stroke-width: 1; }
svg .pp { fill: var(--paper); }
svg .w, svg .g, svg .b { stroke: var(--p-ink); stroke-width: 2.5; stroke-linejoin: round; }
svg .w { fill: var(--p-white); }
svg .g { fill: var(--p-grey); }
svg .b { fill: var(--p-ink); }
svg .o { fill: none; stroke: var(--p-ink); stroke-width: 2.5; stroke-linejoin: round; }
svg .ln { stroke: var(--p-ink); stroke-width: 3.4; stroke-linecap: round; stroke-linejoin: round; fill: none; }
svg .lnb { stroke: var(--p-ink); stroke-width: 6.5; stroke-linecap: round; fill: none; }
svg .gl { stroke: var(--p-faint); stroke-width: 1.2; fill: none; }
svg .tk { stroke: var(--p-faint); stroke-width: 2; stroke-linecap: round; }
svg .tick { fill: var(--p-faint); }
svg .guide { stroke: var(--p-faint); stroke-width: 1.2; fill: none; }
svg .fr { stroke: var(--p-ink); stroke-width: 1.5; fill: none; opacity: .5; }
svg .mk { fill: none; stroke: var(--p-ink); stroke-width: 3; }