/* Chart cards (5 Oct 2026): the default view on every screener (HV Screener & Results Room).
   Cream cards by default; the navy glass Screener (.gx) gets its own tokens below. */
.cc-bar,.cc-grid,.cc-key,.cc-vt{--cc-ink:#1d1512;--cc-soft:#5f4f45;--cc-muted:#6a5a4f;--cc-line:#e7d4c2;--cc-card:#fffdf9;--cc-plot:#fff;--cc-hover:#e8eef6;--cc-accent:#1F3A5F;--cc-up:#1e7a5a;--cc-down:#b0392b;--cc-p:#1F3A5F;--cc-m:#9a8f86;--cc-l:#C2453B;--cc-area:rgba(31,58,95,.07);--cc-dot:#F46C62;--cc-shadow:0 10px 26px -12px rgba(61,44,36,.28)}
.gx .cc-bar,.gx .cc-grid,.gx .cc-key,.gx .cc-vt{--cc-ink:#fff;--cc-soft:#C9D3E2;--cc-muted:#93A1B8;--cc-line:rgba(255,255,255,.14);--cc-card:rgba(255,255,255,.06);--cc-plot:rgba(10,20,36,.45);--cc-hover:rgba(255,255,255,.1);--cc-accent:#FFB3A6;--cc-up:#7FE0B8;--cc-down:#FF8A78;--cc-p:#E8E2D9;--cc-m:rgba(232,226,217,.55);--cc-l:#FFB3A6;--cc-area:rgba(232,226,217,.08);--cc-dot:#FF8A78;--cc-shadow:0 14px 30px -16px rgba(0,0,0,.8)}
/* View switch & sort */
.cc-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin:4px 0 12px}
.cc-vt{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--cc-line);border-radius:999px;background:var(--cc-card)}
.cc-vt a{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:0 16px;border-radius:999px;font-size:14px;font-weight:700;color:var(--cc-ink);text-decoration:none}
.cc-vt a:hover{background:var(--cc-hover)}
.cc-vt a[aria-current]{background:var(--cc-accent);color:#fff}
.gx .cc-vt a[aria-current]{color:#0E1B2E}
.cc-vt a:focus-visible,.cc-a:focus-visible,.cc-sort select:focus-visible{outline:2px solid var(--cc-accent);outline-offset:2px}
.cc-ic{display:inline-block;width:14px;height:12px;border:1.6px solid currentColor;border-radius:2px;position:relative}
.cc-icg{background:linear-gradient(currentColor,currentColor) 50% 0/1.6px 100% no-repeat,linear-gradient(currentColor,currentColor) 0 50%/100% 1.6px no-repeat}
.cc-ict{background:linear-gradient(currentColor,currentColor) 0 33%/100% 1.6px no-repeat,linear-gradient(currentColor,currentColor) 0 70%/100% 1.6px no-repeat}
.cc-sort{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:14px;color:var(--cc-soft)}
.cc-sort label{display:inline-flex;align-items:center;gap:6px}
.cc-sort select{font:inherit;font-size:14px;min-height:36px;padding:0 8px;border-radius:8px;border:1px solid var(--cc-line);background:var(--cc-card);color:var(--cc-ink)}
.gx .cc-sort select{background:#13233A}
.cc-sort .go{padding:7px 12px}
/* Legend */
.cc-key{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:0 0 12px;font-size:13.5px;line-height:1.5;color:var(--cc-soft)}
.cc-k{display:inline-block;width:18px;height:0;border-top:2px solid var(--cc-p);vertical-align:middle}
/* v61 (12 Oct 2026): each sample & its words are one group; a group that wraps keeps its second line under its words */
.cc-key{column-gap:16px}.cc-ki{min-width:0}.cc-ki>.cc-k{margin-right:8px}.cc-ki:has(>.cc-k){padding-left:26px;text-indent:-26px}
.cc-km{border-top:1.5px dashed var(--cc-m)}.cc-kl{border-top:2px dotted var(--cc-l)}
/* Grid: 4 per row from 1100px, 3 on laptops, 2 on tablets, 1 on phones */
.cc-grid{list-style:none;margin:0 0 14px;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
@media(max-width:1099px){.cc-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:860px){.cc-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}}
@media(max-width:560px){.cc-grid{grid-template-columns:minmax(0,1fr)}}
.cc{min-width:0}
.cc-a{display:flex;flex-direction:column;gap:8px;height:100%;box-sizing:border-box;padding:12px 12px 10px;border:1px solid var(--cc-line);border-radius:14px;background:var(--cc-card);color:inherit;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
a.cc-a:hover{transform:translateY(-3px);box-shadow:var(--cc-shadow);border-color:var(--cc-accent)}
.cc-h{display:block;min-width:0}
.cc-n{display:block;font-weight:700;font-size:15px;line-height:1.3;color:var(--cc-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
a.cc-a:hover .cc-n{color:var(--cc-accent);text-decoration:underline}
.cc-h small{display:block;font-size:12.5px;color:var(--cc-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:1px}
/* Chart box: one size for drawn & image charts */
.cc-cv{position:relative;display:block;width:100%;aspect-ratio:8/3;background:var(--cc-plot);border:1px solid var(--cc-line);border-radius:8px;overflow:hidden}
.cc-pl{position:absolute;inset:6px 8px}
.cc-pl svg,.cc-pl img{position:absolute;inset:0;width:100%;height:100%;display:block}
.cc-pl svg{overflow:visible}
.cc-p{fill:none;stroke:var(--cc-p);stroke-width:1.7;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.cc-m{fill:none;stroke:var(--cc-m);stroke-width:1.2;stroke-dasharray:4 3;vector-effect:non-scaling-stroke}
.cc-l{fill:none;stroke:var(--cc-l);stroke-width:1.4;stroke-dasharray:1.5 3;stroke-linecap:round;vector-effect:non-scaling-stroke}
.cc-ar{fill:var(--cc-area);stroke:none}
.cc-dot{position:absolute;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:var(--cc-dot);box-shadow:0 0 0 2px var(--cc-plot)}
.cc-per{position:absolute;right:6px;top:4px;font-style:normal;font-size:11px;font-weight:700;color:var(--cc-muted);background:var(--cc-plot);padding:0 4px;border-radius:4px}
.cc-none{display:flex;align-items:center;justify-content:center;font-size:12.5px;color:var(--cc-muted)}
/* Key numbers: plain text colour; green/red only for up & down */
.cc-st{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:0;padding-top:8px;border-top:1px solid var(--cc-line)}
.cc-st div{min-width:0}
.cc-st dt{font-size:11.5px;color:var(--cc-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-st dd{margin:1px 0 0;font-size:14px;font-weight:700;color:var(--cc-ink);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-st .up{color:var(--cc-up)}.cc-st .down,.cc-st .dn{color:var(--cc-down)}.cc-st .na{color:var(--cc-muted);font-weight:400}
/* Free views: the placeholder & call to action as the last card */
.cc-lock{display:flex;flex-direction:column;justify-content:center;border:1px dashed var(--cc-line);border-radius:14px;background:var(--cc-card);padding:10px;min-height:200px}
.cc-lock .tl{margin:0}.cc-lock .tl-tease{margin:8px 0 0}
@media(max-width:560px){.cc-bar{flex-direction:column;align-items:stretch}.cc-vt{align-self:flex-start}.cc-cv{aspect-ratio:5/2}}
@media (prefers-reduced-motion:reduce){.cc-a{transition:none}a.cc-a:hover{transform:none}}

/* Cream member pages (hv-cream.css, .hvd) wrap the navy glass markup (.gx): use the cream tokens there
   (5 Oct 2026 fix: white names & values were invisible on cream). */
.hvd .gx .cc-bar,.hvd .gx .cc-grid,.hvd .gx .cc-key,.hvd .gx .cc-vt{--cc-ink:#1d1512;--cc-soft:#5f4f45;--cc-muted:#6a5a4f;--cc-line:#e7d4c2;--cc-card:#fffdf9;--cc-plot:#fff;--cc-hover:#e8eef6;--cc-accent:#1F3A5F;--cc-up:#1e7a5a;--cc-down:#b0392b;--cc-p:#1F3A5F;--cc-m:#9a8f86;--cc-l:#C2453B;--cc-area:rgba(31,58,95,.07);--cc-dot:#F46C62;--cc-shadow:0 10px 26px -12px rgba(61,44,36,.28)}
.hvd .gx .cc-vt a[aria-current]{color:#fff}
.hvd .gx .cc-sort select{background:var(--cc-card);color:var(--cc-ink)}
/* Big counts in headings: tabular digits gave "4 , 728" a gap around the comma (5 Oct 2026). */
.hvd h1 .n,.hvd h2 .n{font-variant-numeric:lining-nums proportional-nums}
/* "Why it passed" (5 Oct 2026): one plain line with the screen's own numbers for this company. */
.cc-why{display:block;font-size:13px;line-height:1.35;font-weight:600;color:var(--cc-ink);margin:-2px 0 0}
.cc-why::before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--cc-up);margin-right:6px;vertical-align:2px}
