/* Voronoi diagrams to explore (the bisector and the builder): the tints of
 * the cells, the edges and the small marks. Needs maths-applets.css. */

.vor-near { fill: color-mix(in srgb, var(--teal) 16%, transparent); stroke: none; }
.vor-t0 { fill: color-mix(in srgb, var(--teal) 20%, var(--paper)); }
.vor-t1 { fill: color-mix(in srgb, var(--tangerine) 22%, var(--paper)); }
.vor-t2 { fill: color-mix(in srgb, var(--gold) 34%, var(--paper)); }
.vor-t3 { fill: color-mix(in srgb, var(--ink) 11%, var(--paper)); }
.vor-t4 { fill: color-mix(in srgb, var(--teal-deep) 38%, var(--paper)); }
.vor-edge { fill: none; stroke: var(--ink); stroke-width: 2.6; stroke-linecap: round; }
.vor-region { fill: none; stroke: var(--ink); stroke-width: 1.6; }
.vor-bis { fill: none; stroke: var(--muted); stroke-width: 1.2; stroke-dasharray: 5 5; opacity: 0.8; }
.vor-circ { fill: none; stroke: var(--gold); stroke-width: 2.4; stroke-dasharray: 6 5; }
.vor-circ.is-p { stroke: var(--tangerine); stroke-width: 1.8; }
.vor-link { stroke: var(--tangerine); stroke-width: 2; }
.vor-right { fill: none; stroke: var(--ink); stroke-width: 1.4; }
.vor-label { font-size: 12px; font-weight: 700; fill: var(--ink); paint-order: stroke; stroke: var(--paper); stroke-width: 3px; stroke-linejoin: round; pointer-events: none; }
.vor-label.is-c { fill: var(--teal-deep); }
.vor-label.is-soft { font-weight: 600; fill: var(--muted); }
.vor-vertex { fill: var(--teal-deep); stroke: var(--paper); stroke-width: 2; cursor: pointer; }
.vor-vertex:hover { stroke: var(--gold); }
.vor-vertex:focus { outline: none; }
.vor-vertex:focus-visible { stroke: var(--tangerine); stroke-width: 3; }
.vor-vertex.is-on { fill: var(--gold); stroke: var(--ink); }
.mca-handle.is-sel { stroke: var(--tangerine); stroke-width: 4; }

.vor-step { display: block; }
.vor-step + .vor-step { margin-top: 6px; }
.vor-step b { color: var(--teal-deep); }
.vor-step.is-final { margin-top: 10px; padding-top: 8px; border-top: 2px solid var(--line); font-size: 1.12rem; }
.vor-step.is-check { font-size: 0.9rem; font-weight: 600; color: var(--muted); }

.vor-dists > div.is-near { background: color-mix(in srgb, var(--tangerine) 22%, var(--paper)); }
.vor-dists dt { font-weight: 700; }
.vor-dists { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px; }
.vor-dists > div { padding: 6px 12px; font-size: 0.92rem; }