/* SVG charts (cellopsis-charts.js). Okabe-Ito colours led by the brand teal; shapes as well as colour tell series
   apart. Review-flagged points are hollow and always drawn. Dark mode swaps tokens only, so no redraw is needed. */
.cc-svg { --cc-ink:#1d232a; --cc-muted:#5b6570; --cc-grid:#e3e6e8; --cc-base:#8a939b; --cc-guide:#d6dadd; --cc-paper:#ffffff;
  --cc-c0:#1f6b7a; --cc-c1:#d55e00; --cc-c2:#0072b2; --cc-c3:#009e73; --cc-c4:#b07a00; --cc-c5:#cc79a7; --cc-c6:#3a8fc4; --cc-c7:#4d4d4d;
  display:block; width:100%; max-width:640px; height:auto; overflow:visible; font-family:var(--font-body, Inter, system-ui, sans-serif); }
html[data-theme="dark"] .cc-svg { --cc-ink:#eef0f5; --cc-muted:#b4b7c3; --cc-grid:rgba(255,255,255,0.09); --cc-base:rgba(255,255,255,0.4);
  --cc-guide:rgba(255,255,255,0.14); --cc-paper:#0f1428;
  --cc-c0:#7fb8c2; --cc-c1:#f08c4a; --cc-c2:#56b4e9; --cc-c3:#2fc79a; --cc-c4:#f0c04a; --cc-c5:#e091c4; --cc-c6:#9fd3f0; --cc-c7:#c4c7d0; }
.cc-svg text { fill:var(--cc-ink); }
.cc-n { font-size:11px; fill:var(--cc-muted) !important; }
.cc-tick, .cc-value { font-family:var(--font-mono, ui-monospace, Menlo, monospace); font-size:11px; fill:var(--cc-muted) !important; }
.cc-label { font-size:12px; }
.cc-axis-title { font-size:12px; font-weight:600; }
.cc-grid { stroke:var(--cc-grid); stroke-width:1; }
.cc-baseline { stroke:var(--cc-base); stroke-width:1; }
.cc-guide { stroke:var(--cc-guide); stroke-width:1.5; }
.cc-s0 { --cc-c:var(--cc-c0); } .cc-s1 { --cc-c:var(--cc-c1); } .cc-s2 { --cc-c:var(--cc-c2); } .cc-s3 { --cc-c:var(--cc-c3); }
.cc-s4 { --cc-c:var(--cc-c4); } .cc-s5 { --cc-c:var(--cc-c5); } .cc-s6 { --cc-c:var(--cc-c6); } .cc-s7 { --cc-c:var(--cc-c7); }
.cc-mark { fill:var(--cc-c); stroke:var(--cc-c); stroke-width:1; }
.cc-dot { fill-opacity:.85; }
.cc-mark.cc-review { fill:var(--cc-paper); fill-opacity:1; stroke-width:1.8; }
.cc-line { stroke:var(--cc-c); stroke-width:2; fill:none; }
.cc-mean { stroke:var(--cc-c); stroke-width:2.5; }
.cc-whisker { stroke:var(--cc-c); stroke-width:1.6; }
.cc-band { fill:var(--cc-c); fill-opacity:.14; stroke:none; }
.cc-bar { fill:var(--cc-c); fill-opacity:.75; }
.cc-threshold { stroke:var(--cc-ink); stroke-width:1.6; stroke-dasharray:4 3; }
.cc-auto { stroke:var(--cc-base); stroke-width:1; stroke-dasharray:2 3; }
.cc-point { cursor:default; outline:none; }
.cc-point:focus-visible { outline:2px solid var(--cv-focus, #14525e); outline-offset:2px; border-radius:2px; }
.cc-point:focus-visible .cc-mark, .cc-point:hover .cc-mark { stroke:var(--cc-ink); stroke-width:2.5; }

/* Chart holders outside the chat (experiment page): notes, downloads, empty state. */
.cc-holder { --cc-h-ink:#1d232a; --cc-h-muted:#5b6570; --cc-h-line:#d4d4d8; min-width:0; }
html[data-theme="dark"] .cc-holder { --cc-h-ink:#eef0f5; --cc-h-muted:#b4b7c3; --cc-h-line:rgba(255,255,255,0.22); }
.cc-holder .cc-svg { margin:0 auto; }
.cc-empty { padding:48px 16px; text-align:center; font-size:0.875rem; color:var(--cc-h-muted); }
.cc-legend-note { display:flex; align-items:center; gap:8px; margin:6px 0 0; font-size:0.75rem; color:var(--cc-h-muted); }
.cc-legend-note::before { content:""; width:9px; height:9px; border:1.6px solid currentColor; border-radius:50%; flex:none; }
.cc-notes { margin:8px 0 0; padding:0 0 0 16px; list-style:disc; font-size:0.75rem; line-height:1.5; color:var(--cc-h-muted); }
.cc-actions { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:10px; }
.cc-actions-label { font-size:0.75rem; color:var(--cc-h-muted); margin-right:2px; }
.cc-btn { min-height:30px; padding:0 10px; border:1px solid var(--cc-h-line); border-radius:6px; background:transparent; color:var(--cc-h-ink);
  font:inherit; font-size:0.75rem; font-weight:500; cursor:pointer; }
.cc-btn:hover { border-color:var(--cc-h-ink); }
.cc-btn:focus-visible { outline:2px solid #14525e; outline-offset:2px; }
