/* ---- contents ------------------------------------------------------------------------------
 * From the blog.lnx.cx incident-response report. The number column is a fixed 26px tabular-nums
 * grid cell so a long title wraps UNDER itself instead of pushing the numbers out of alignment,
 * and .sec carries scroll-margin-top so a jump lands below the site chrome, not beneath it.
 */
.toc{background:var(--glass);border:1px solid var(--glass-brd);border-radius:14px;
  margin:30px 0 6px;padding:20px 22px}
.toc-h{font-family:var(--display);text-transform:uppercase;letter-spacing:.16em;
  font-size:9.5px;color:var(--faint);margin:0 0 12px}
.toc ol{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2px 26px}
.toc a{display:grid;grid-template-columns:26px 1fr;gap:10px;align-items:baseline;
  padding:6px 8px;border-radius:7px;text-decoration:none;color:#c5bed9;
  font-size:13.5px;line-height:1.4;transition:background .15s,color .15s}
.toc a:hover,.toc a:focus-visible{background:rgba(255,255,255,.05);color:var(--ink);
  text-decoration:none}
.toc a .n{font-family:var(--display);font-weight:700;font-size:11px;color:var(--ember);
  font-variant-numeric:tabular-nums}
.toc a:hover .n{color:var(--flare)}
.sec{margin:44px 0 0;scroll-margin-top:24px}
.sec > h2 .n{color:var(--ember);margin-right:11px;font-variant-numeric:tabular-nums;
  font-size:.72em}
.lede{color:var(--muted);font-size:14px;margin:0 0 16px;max-width:74ch}
h1{font-family:var(--display);font-weight:700;font-size:clamp(34px,6vw,52px);letter-spacing:-.02em;
  margin:0 0 14px;color:#f6f2ff;
  text-shadow:0 1px 2px rgba(8,5,15,.6),0 3px 30px rgba(8,5,15,.5),0 6px 48px rgba(120,80,200,.3)}
h1 .dot{color:var(--flare);text-shadow:0 0 22px rgba(255,138,61,.9)}
h2{font-family:var(--display);font-size:21px;margin:52px 0 6px;color:#fff;letter-spacing:-.01em}
h3{font-family:var(--display);font-size:15px;margin:22px 0 4px;color:#fff}
h3.warn{color:var(--warn)}

/* KPI tiles — the same shape as the Songbook's, in the flat finish.
 * .tiles/.tile/.tl/.tv/.ts now live in /assets/style.css, shared with the Scorecard and the
 * Songbook -- three copies of one component had already drifted to three different number
 * colors. This page picks the flat .panel finish; the Songbook picks .glass. */

/* charts */
.chart-wrap{position:relative;padding:14px 8px;overflow-x:auto;margin-top:12px}
.chart{width:100%;height:auto;display:block;min-width:640px}
.lbl{fill:var(--ink);font-size:12.5px;font-family:var(--body)}
.val{fill:var(--muted);font-size:11.5px;font-family:var(--display)}
.ax{fill:var(--muted);font-size:11px;font-family:var(--body)}
.rg{cursor:crosshair}
.rg:hover rect[fill-opacity]{fill-opacity:.85}
.tip{position:absolute;display:none;pointer-events:none;background:#120a24;
  border:1px solid #3a2b5e;border-radius:9px;padding:8px 11px;font-size:12px;
  color:var(--ink);z-index:9;box-shadow:0 6px 22px rgba(0,0,0,.55);max-width:290px;
  backdrop-filter:blur(var(--blur-float))}
.legend{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin:16px 0 10px;
  font-size:12px;color:var(--muted)}
.legend i{display:inline-block;width:11px;height:11px;border-radius:3px;
  margin-right:6px;vertical-align:-1px}
.legend .note{margin-left:auto;font-style:italic}

/* tables */
.tbl{width:100%;border-collapse:collapse;font-size:13px;margin-top:12px}
.tbl th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.07em;
  color:var(--muted);border-bottom:1px solid #2e2350;padding:7px 9px;font-weight:600}
.tbl td{padding:6px 9px;border-bottom:1px solid rgba(236,231,247,.07)}
.tbl tr:hover td{background:rgba(167,139,250,.08)}
.sng{color:#fff}
.num{text-align:right;font-family:var(--display);font-variant-numeric:tabular-nums}
.dimc{color:var(--muted)}

/* disclosure panels */
details{border-radius:12px;padding:10px 14px;margin-bottom:7px}
details summary{cursor:pointer;color:var(--ink);font-size:13.5px;list-style:none}
details summary::-webkit-details-marker{display:none}
details summary:before{content:"\25B8 ";color:var(--muted)}
details[open] summary:before{content:"\25BE "}
details[open] summary{margin-bottom:6px}

.empty{color:var(--muted);font-style:italic}
.warn{color:var(--warn);font-weight:600}
.ok{color:var(--ok)}
p.ok{font-size:14px}
.bad{color:var(--bad);font-weight:600}