/* Digital Gemology Cut Performance Index: /learn/cut-performance-index and the score box on the cut pages.
   Built by _build/cut-index/index_page.py. Black/White theme through --fg, --muted, --line and --surface; the
   red/green/blue accents (--red-text, --green-text, --blue-text) mark the findings and the sorted column only. */
.doc.ci{max-width:1072px}
.ci .lede{max-width:780px}
.ci-find{list-style:none;padding:0;margin:16px 0;display:grid;gap:10px}
.ci-find li{margin:0;padding:12px 16px;background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--blue-text);border-radius:var(--r-inner);line-height:1.5}
.ci-find li:nth-child(3n+2){border-left-color:var(--green-text)}
.ci-find li:nth-child(3n+3){border-left-color:var(--red-text)}
/* each table scrolls inside its own box; the page never scrolls sideways */
.ci-tw{max-width:100%;overscroll-behavior-x:contain}
.ci-tw:focus-visible{outline:2px solid var(--fg);outline-offset:2px}
.ci-table{min-width:980px}
.ci-tw .ci-table th,.ci-tw .ci-table td{padding:10px 12px;white-space:nowrap}
.ci-tw .ci-table td.num,.ci-tw .ci-table thead th[data-type="num"]{text-align:right;font-variant-numeric:tabular-nums}
.ci-tw .ci-table tbody th{font-weight:500}
.ci-tw .ci-table tbody th a{text-decoration:none;border-bottom:1px solid var(--line)}
.ci-tw .ci-table tbody th a:hover{border-bottom-color:var(--fg)}
.ci-table caption{text-align:left;padding:10px 12px;font-size:.8125rem;color:var(--muted);caption-side:top}
.ci-table thead th{position:sticky;top:0}
/* the cut's name stays at the left edge while the scores scroll past it */
.ci-tw .ci-table tbody th,.ci-tw .ci-table thead th:nth-child(2){position:sticky;left:0;z-index:1;background:var(--bg);box-shadow:1px 0 0 var(--line)}
.ci-tw .ci-table thead th:nth-child(2){background:var(--surface);z-index:2}
.ci-tw .ci-table tbody tr:hover th{background:var(--surface)}
.ci-table tbody tr:hover td,.ci-table tbody tr:hover th{background:var(--surface)}
.ci-table .ci-ns td{color:var(--muted);white-space:normal}
.ci-table .ci-ns td:last-child{min-width:420px}
/* sort buttons: added by cut-index.js, so without JavaScript the headings are plain text */
.ci-sort{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:4px;font-weight:600}
.ci-sort:focus-visible{outline:2px solid var(--fg);outline-offset:2px;border-radius:4px}
.ci-sort::after{content:"";width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid var(--muted);opacity:.5}
th[aria-sort="ascending"] .ci-sort::after{border-top:0;border-bottom:5px solid var(--blue-text);opacity:1}
th[aria-sort="descending"] .ci-sort::after{border-top-color:var(--blue-text);opacity:1}
.ci-hint{font-size:.875rem;color:var(--muted)}
.ci-defs{grid-template-columns:150px 1fr}
.ci-updated{font-weight:560}
.ci-dl{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.ci-dl li{margin:0;padding:10px 14px;border:1px solid var(--line);border-radius:var(--r-pill);display:flex;gap:10px;align-items:center}
.ci-dl span{font-size:.75rem;color:var(--muted);letter-spacing:.04em}
@media (max-width:600px){
  .ci-defs{grid-template-columns:1fr}
  .ci-defs dd{margin-bottom:8px}
}
/* the score box on a cut page */
.ci-box{margin:28px 0 0;padding:16px 18px;border:1px solid var(--line);border-left:3px solid var(--green-text);border-radius:var(--r-inner);background:var(--surface)}
.doc .ci-box .ci-box-h,.ci-box .ci-box-h{font-size:.8125rem;font-weight:600;letter-spacing:.02em;color:var(--muted);margin:0 0 8px;padding:0;border:0}
.ci-box ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 28px}
.ci-box li{margin:0}
.ci-box-m{color:var(--muted)}
.ci-box b{font-size:1.25rem;font-weight:620;margin:0 4px}
.ci-box-p,.ci-box-note{font-size:.875rem;color:var(--muted)}
.ci-box p{margin:8px 0 0}
