/* ============================================================================
   tools-chart.css — SHARED chart primitives for every design variant.
   Loaded on every casino-tools-N page AFTER the theme stylesheet. Each theme
   defines the --k* custom properties; the same tokens are read by tools-core.js
   for the inline SVG fills, so charts always match the active design.
   Theme contract (define these on .lab):
     --k1 primary/positive   --k2 reference   --k3 neutral   --kr risk
     --kgrid grid+axis line   --klabel tick/label text   --kvalue value text
     --kband band fill        --kband2 lighter band fill  --kmono chart font
   ============================================================================ */
.lab .lab-chart text { font-family: var(--kmono, ui-monospace, "SF Mono", Menlo, monospace); fill: var(--klabel, #74869a); }
.lab .lab-chart .axis { stroke: var(--kgrid, #223044); stroke-width: 1; }
.lab .lab-chart .gridline { stroke: var(--kgrid, #223044); stroke-width: 1; stroke-dasharray: 2 4; opacity: .55; }
.lab .lab-chart .series-teal { stroke: var(--k1, #2fd4bf); }
.lab .lab-chart .series-amber { stroke: var(--k2, #f6b53f); }
.lab .lab-chart .series-blue { stroke: var(--k3, #64a6ff); }
.lab .lab-chart .series-rose { stroke: var(--kr, #ff6f6f); }
.lab .lab-chart .fill-band { fill: var(--kband, rgba(47,212,191,.14)); }
.lab .lab-chart .fill-band-2 { fill: var(--kband2, rgba(47,212,191,.08)); }
/* solid fills for server-rendered bars/segments (variant gallery) */
.lab .lab-chart .fill-k1 { fill: var(--k1, #2fd4bf); }
.lab .lab-chart .fill-k2 { fill: var(--k2, #f6b53f); }
.lab .lab-chart .fill-k3 { fill: var(--k3, #64a6ff); }
.lab .lab-chart .fill-kr { fill: var(--kr, #ff6f6f); }
.lab .lab-chart .chart-val { fill: var(--kvalue, #eaf1f8); }
.lab .lab-chart .chart-inv { fill: #10151c; }
/* key-facts list (regional/legal tool, national markets) */
.lab .lab-facts { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 10px; }
.lab .lab-facts li { position: relative; padding-left: 20px; font-size: 13.5px; color: var(--muted, #a4b5c6); line-height: 1.5; }
.lab .lab-facts li::before { content: "\2192"; position: absolute; left: 0; color: var(--k1, #2fd4bf); }
/* ---- layout modifiers (variant axis: input/output arrangement) ---- */
.lab .lab-tool[data-layout="b"] .lab-grid { grid-template-columns: 1fr 320px; }
.lab .lab-tool[data-layout="b"] .lab-inputs { order: 2; }
.lab .lab-tool[data-layout="b"] .lab-output { order: 1; }
.lab .lab-tool[data-layout="c"] .lab-grid { grid-template-columns: 1fr; }
.lab .lab-tool[data-layout="d"] .lab-metrics { grid-template-columns: 1fr; }
@media (max-width: 940px) {
  .lab .lab-tool[data-layout="b"] .lab-grid { grid-template-columns: 1fr; }
}
@keyframes labDraw { to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) { .lab .lab-chart [style*="animation"] { animation: none !important; } }
