/* LLM IQ Test page. Scoped under body.llm-iq-page (class added by llm-iq.js). */

body.llm-iq-page {
  --liq-bg: #0d0d0d;
  --liq-panel: #141414;
  --liq-panel-2: #1b1b1b;
  --liq-line: rgba(255, 255, 255, 0.14);
  --liq-grid: rgba(255, 255, 255, 0.08);
  --liq-text: rgba(255, 255, 255, 0.86);
  --liq-muted: rgba(255, 255, 255, 0.55);
  --liq-accent-rgb: 150 190 230;
  --liq-ring: rgba(255, 255, 255, 0.9);
  --liq-c0: #8fb8a3;
  --liq-c1: #d4a27f;
  --liq-c2: #8ea6d6;
  --liq-c3: #c98f9f;
  --liq-c4: #b9b27a;
  --liq-c5: #9a8fc9;
  --liq-c6: #78b7bd;
  --liq-c7: #c9a36a;
  --liq-c8: #a3a8ae;
  --liq-c9: #d08a6e;
  --liq-c10: #7fb0dd;
  --liq-c11: #c7a0c9;
  --liq-c12: #a5c27f;
  --liq-c13: #dcc28c;
  --global-bg: #0d0d0d;
  --font-color: rgba(255, 255, 255, 0.82);
  --hr-border: rgba(255, 255, 255, 0.24);
  --card-bg: #121212;
  --site-link-color: #c4c7cb;
  --site-link-hover-color: #ffffff;
  color: var(--font-color);
  background: var(--global-bg);
  color-scheme: dark;
}

[data-theme='light'] body.llm-iq-page,
html[data-theme='light'] body.llm-iq-page {
  --liq-bg: #f4f3ef;
  --liq-panel: #fbfaf7;
  --liq-panel-2: #efede7;
  --liq-line: rgba(0, 0, 0, 0.16);
  --liq-grid: rgba(0, 0, 0, 0.08);
  --liq-text: rgba(0, 0, 0, 0.84);
  --liq-muted: rgba(0, 0, 0, 0.55);
  --liq-accent-rgb: 70 110 160;
  --liq-ring: rgba(0, 0, 0, 0.85);
  --liq-c0: #3f8466;
  --liq-c1: #b0612f;
  --liq-c2: #3f62a8;
  --liq-c3: #a8475f;
  --liq-c4: #857b24;
  --liq-c5: #6a5aa8;
  --liq-c6: #2f8088;
  --liq-c7: #94691f;
  --liq-c8: #5f656c;
  --liq-c9: #b2502d;
  --liq-c10: #2d6f9e;
  --liq-c11: #8a4f8c;
  --liq-c12: #5b7f2c;
  --liq-c13: #8c6d24;
  --global-bg: #f4f3ef;
  --font-color: rgba(0, 0, 0, 0.82);
  --hr-border: rgba(0, 0, 0, 0.2);
  --card-bg: #fbfaf7;
  color-scheme: light;
}

body.llm-iq-page #content-inner {
  display: block;
  max-width: 1180px;
  padding: 36px 16px 64px;
}
body.llm-iq-page #content-inner > #page {
  width: 100%;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.llm-iq-page #aside-content { display: none; }
body.llm-iq-page #article-container {
  max-width: none;
  margin: 0 auto;
  padding: 0;
  color: var(--liq-text);
}
body.llm-iq-page .liq-app { color: var(--liq-text); }
body.llm-iq-page .liq-app h2 {
  margin: 0 0 14px;
  padding: 0;
  font-size: 1.25rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  border: 0;
  color: var(--liq-text);
}
body.llm-iq-page .liq-app h2::before { content: none; }
body.llm-iq-page .liq-lede { max-width: 820px; margin: 0 0 8px; line-height: 1.7; }
body.llm-iq-page .liq-updated { margin: 0 0 20px; font-size: 0.85rem; color: var(--liq-muted); }
body.llm-iq-page .liq-section { margin: 32px 0 0; }
body.llm-iq-page .liq-caption { margin: 10px 0 0; font-size: 0.85rem; color: var(--liq-muted); }
body.llm-iq-page .liq-status:empty { display: none; }
body.llm-iq-page .liq-status {
  padding: 28px 16px;
  border: 1px dashed var(--liq-line);
  border-radius: 6px;
  text-align: center;
  color: var(--liq-muted);
}
body.llm-iq-page .liq-app[data-state='loading'] .liq-section,
body.llm-iq-page .liq-app[data-state='empty'] .liq-section,
body.llm-iq-page .liq-app[data-state='error'] .liq-section { display: none; }

/* controls */
body.llm-iq-page .liq-controls { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-bottom: 10px; align-items: center; }
body.llm-iq-page .liq-chips,
body.llm-iq-page .liq-legend { display: flex; flex-wrap: wrap; gap: 6px; }
body.llm-iq-page .liq-chip,
body.llm-iq-page .liq-legend-item,
body.llm-iq-page .liq-tab {
  font: inherit;
  font-size: 0.82rem;
  color: var(--liq-text);
  background: transparent;
  border: 1px solid var(--liq-line);
  border-radius: 999px;
  padding: 4px 11px;
  cursor: pointer;
  line-height: 1.4;
}
body.llm-iq-page .liq-chip[aria-pressed='true'],
body.llm-iq-page .liq-tab[aria-selected='true'] {
  background: var(--liq-panel-2);
  border-color: var(--liq-muted);
}
body.llm-iq-page .liq-legend-item { display: inline-flex; align-items: center; gap: 6px; }
body.llm-iq-page .liq-legend-item[aria-pressed='false'] { opacity: 0.4; text-decoration: line-through; }
body.llm-iq-page .liq-legend-item svg { width: 14px; height: 14px; overflow: visible; }
body.llm-iq-page .liq-chip:hover,
body.llm-iq-page .liq-legend-item:hover,
body.llm-iq-page .liq-tab:hover { border-color: var(--liq-muted); }
body.llm-iq-page button:focus-visible,
body.llm-iq-page .liq-pt:focus-visible,
body.llm-iq-page .liq-cell:focus-visible { outline: 2px solid var(--liq-text); outline-offset: 2px; }

/* chart */
body.llm-iq-page .liq-chart {
  position: relative;
  background: var(--liq-panel);
  border: 1px solid var(--liq-line);
  border-radius: 6px;
  padding: 6px;
}
body.llm-iq-page .liq-chart svg { display: block; width: 100%; height: auto; font-family: inherit; }
body.llm-iq-page .liq-grid { stroke: var(--liq-grid); stroke-width: 1; }
body.llm-iq-page .liq-axis { stroke: var(--liq-muted); stroke-width: 1; }
body.llm-iq-page .liq-tick { fill: var(--liq-muted); font-size: 11px; }
body.llm-iq-page .liq-axis-title { fill: var(--liq-text); font-size: 12px; }
body.llm-iq-page .liq-line { fill: none; stroke-width: 1.6; opacity: 0.85; }
body.llm-iq-page .liq-leader { stroke-width: 0.8; opacity: 0.6; }
body.llm-iq-page .liq-lbl { font-size: 10.5px; paint-order: stroke; stroke: var(--liq-panel); stroke-width: 3px; stroke-linejoin: round; }
body.llm-iq-page .liq-pt { cursor: pointer; outline: none; }
body.llm-iq-page .liq-pt .liq-mark { stroke: var(--liq-panel); stroke-width: 1.2; }
body.llm-iq-page .liq-pt:hover .liq-mark,
body.llm-iq-page .liq-pt:focus .liq-mark { stroke: var(--liq-text); stroke-width: 1.8; }
body.llm-iq-page .liq-ringc { fill: none; stroke-width: 1.5; }
body.llm-iq-page .liq-tip {
  position: absolute;
  z-index: 5;
  pointer-events: none;
  min-width: 160px;
  max-width: 260px;
  padding: 8px 10px;
  font-size: 0.8rem;
  line-height: 1.5;
  background: var(--liq-panel-2);
  border: 1px solid var(--liq-line);
  border-radius: 6px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
}
body.llm-iq-page .liq-tip[hidden] { display: none; }
body.llm-iq-page .liq-tip b { display: block; margin-bottom: 2px; }

/* matrix */
body.llm-iq-page .liq-tabs { display: flex; gap: 6px; margin-bottom: 12px; }
body.llm-iq-page .liq-scroll { overflow-x: auto; border: 1px solid var(--liq-line); border-radius: 6px; background: var(--liq-panel); }
body.llm-iq-page table.liq-table { border-collapse: separate; border-spacing: 0; width: max-content; min-width: 100%; margin: 0; border: 0; }
body.llm-iq-page .liq-table th,
body.llm-iq-page .liq-table td {
  border: 0;
  border-bottom: 1px solid var(--liq-grid);
  padding: 6px;
  text-align: center;
  vertical-align: middle;
  background: transparent;
  color: var(--liq-text);
}
body.llm-iq-page .liq-table thead th {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--liq-muted);
  background: var(--liq-panel-2);
  white-space: nowrap;
}
body.llm-iq-page .liq-table th.liq-rowh,
body.llm-iq-page .liq-table td.liq-rowh {
  position: sticky;
  left: 0;
  z-index: 2;
  text-align: left;
  min-width: 140px;
  max-width: 190px;
  background: var(--liq-panel);
  border-right: 1px solid var(--liq-grid);
  font-size: 0.85rem;
  font-weight: 600;
}
body.llm-iq-page .liq-table thead th.liq-rowh { background: var(--liq-panel-2); }
body.llm-iq-page .liq-table tr.liq-vendor th {
  text-align: left;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--liq-muted);
  background: var(--liq-panel-2);
}
body.llm-iq-page .liq-rowh small { display: block; font-weight: 400; color: var(--liq-muted); }
body.llm-iq-page .liq-sort { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; padding: 0; }
body.llm-iq-page .liq-cell {
  --heat: 0;
  display: block;
  width: 100%;
  min-width: 84px;
  padding: 7px 8px;
  font: inherit;
  color: var(--liq-text);
  text-align: center;
  cursor: pointer;
  border: 1px solid var(--liq-grid);
  border-radius: 5px;
  background: rgb(var(--liq-accent-rgb) / calc(0.04 + var(--heat) * 0.5));
  line-height: 1.25;
}
body.llm-iq-page .liq-cell:hover { border-color: var(--liq-muted); }
body.llm-iq-page .liq-cell strong { display: block; font-size: 1.1rem; font-variant-numeric: tabular-nums; }
body.llm-iq-page .liq-cell span { display: block; font-size: 0.7rem; color: var(--liq-muted); font-variant-numeric: tabular-nums; }
body.llm-iq-page .liq-cell.liq-rec { box-shadow: inset 0 0 0 1px var(--liq-ring); }
body.llm-iq-page .liq-empty { color: var(--liq-muted); }

/* dialog */
body.llm-iq-page .liq-dialog,
.liq-dialog {
  width: min(960px, calc(100vw - 24px));
  max-height: calc(100vh - 24px);
  padding: 0;
  border: 1px solid var(--liq-line, rgba(255, 255, 255, 0.2));
  border-radius: 8px;
  background: var(--liq-panel, #141414);
  color: var(--liq-text, rgba(255, 255, 255, 0.86));
}
body.llm-iq-page .liq-dialog::backdrop { background: rgba(0, 0, 0, 0.7); }
body.llm-iq-page .liq-dlg-head {
  position: sticky;
  top: 0;
  z-index: 3;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  background: var(--liq-panel-2);
  border-bottom: 1px solid var(--liq-line);
}
body.llm-iq-page .liq-dlg-head h3 { margin: 0; font-size: 1.1rem; }
body.llm-iq-page .liq-dlg-head h3::before { content: none; }
body.llm-iq-page .liq-close { font: inherit; font-size: 1.3rem; line-height: 1; color: var(--liq-text); background: none; border: 1px solid var(--liq-line); border-radius: 6px; padding: 2px 10px; cursor: pointer; }
body.llm-iq-page .liq-dlg-body { padding: 16px 18px 24px; overflow-wrap: anywhere; }
body.llm-iq-page .liq-dlg-scroll { max-height: calc(100vh - 90px); overflow: auto; }
body.llm-iq-page .liq-facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px; margin: 0 0 14px; }
body.llm-iq-page .liq-fact { padding: 8px 10px; border: 1px solid var(--liq-grid); border-radius: 6px; }
body.llm-iq-page .liq-fact dt { font-size: 0.7rem; color: var(--liq-muted); text-transform: uppercase; letter-spacing: 0.08em; }
body.llm-iq-page .liq-fact dd { margin: 2px 0 0; font-weight: 600; font-variant-numeric: tabular-nums; }
body.llm-iq-page .liq-q { margin: 22px 0 0; padding-top: 14px; border-top: 1px solid var(--liq-line); }
body.llm-iq-page .liq-q.liq-focus { animation: liq-flash 1.6s ease-out; }
@keyframes liq-flash { from { background: rgb(var(--liq-accent-rgb) / 0.2); } to { background: transparent; } }
body.llm-iq-page .liq-q h4 { margin: 0 0 8px; font-size: 1rem; }
body.llm-iq-page .liq-q h4::before { content: none; }
body.llm-iq-page .liq-q h5 { margin: 14px 0 6px; font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--liq-muted); }
body.llm-iq-page .liq-q h5::before { content: none; }
body.llm-iq-page .liq-bar { display: flex; align-items: center; gap: 10px; font-variant-numeric: tabular-nums; }
body.llm-iq-page .liq-bar-track { flex: 1; height: 8px; border-radius: 4px; background: var(--liq-panel-2); overflow: hidden; border: 1px solid var(--liq-grid); }
body.llm-iq-page .liq-bar-fill { height: 100%; background: rgb(var(--liq-accent-rgb) / 0.85); }
body.llm-iq-page .liq-pre {
  margin: 0;
  padding: 10px 12px;
  max-height: 360px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 0.8rem;
  line-height: 1.55;
  color: var(--liq-text);
  background: var(--liq-bg);
  border: 1px solid var(--liq-grid);
  border-radius: 6px;
}
body.llm-iq-page table.liq-rubric { width: 100%; margin: 0; font-size: 0.82rem; border-collapse: collapse; }
body.llm-iq-page .liq-rubric th,
body.llm-iq-page .liq-rubric td { padding: 5px 8px; text-align: left; border: 0; border-bottom: 1px solid var(--liq-grid); background: transparent; color: var(--liq-text); }
body.llm-iq-page .liq-rubric th { color: var(--liq-muted); font-weight: 600; }
body.llm-iq-page .liq-rubric .num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
body.llm-iq-page .liq-art { margin-top: 8px; }
body.llm-iq-page .liq-art-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 0.8rem; color: var(--liq-muted); margin-bottom: 4px; }
body.llm-iq-page .liq-art iframe,
body.llm-iq-page .liq-art img { display: block; width: 100%; min-height: 320px; border: 1px solid var(--liq-grid); border-radius: 6px; background: #fff; }
body.llm-iq-page .liq-art img { min-height: 0; max-height: 520px; object-fit: contain; }
body.llm-iq-page .liq-link { font: inherit; font-size: 0.78rem; color: var(--liq-text); background: none; border: 1px solid var(--liq-line); border-radius: 999px; padding: 2px 10px; cursor: pointer; }

/* language switch */
body.llm-iq-page .liq-lang { display: inline-flex; margin: 0 0 14px; border: 1px solid var(--liq-line); border-radius: 999px; overflow: hidden; }
body.llm-iq-page .liq-lang-btn {
  font: inherit; font-size: 0.82rem; line-height: 1.4; color: var(--liq-muted); background: transparent;
  border: 0; padding: 4px 14px; cursor: pointer;
}
body.llm-iq-page .liq-lang-btn + .liq-lang-btn { border-left: 1px solid var(--liq-line); }
body.llm-iq-page .liq-lang-btn[aria-pressed='true'] { color: var(--liq-text); background: var(--liq-panel-2); font-weight: 600; }
body.llm-iq-page .liq-lang-btn:hover { color: var(--liq-text); }
body.llm-iq-page .liq-lang-btn:focus-visible { outline: 2px solid var(--liq-text); outline-offset: 2px; }
body.llm-iq-page .liq-qt { display: block; font-weight: 400; font-size: 0.7rem; }
body.llm-iq-page .liq-app[lang='zh-CN'] { line-height: 1.7; }

/* exam */
body.llm-iq-page .liq-block { margin: 32px 0 0; }
body.llm-iq-page .liq-block h2 { margin: 0 0 14px; }
body.llm-iq-page .liq-exam { display: grid; gap: 10px; margin-top: 12px; }
body.llm-iq-page .liq-details { border: 1px solid var(--liq-line); border-radius: 6px; background: var(--liq-panel); }
body.llm-iq-page .liq-details > summary {
  display: flex; align-items: baseline; gap: 12px; padding: 11px 14px; cursor: pointer;
  list-style: none; font-weight: 600; color: var(--liq-text);
}
body.llm-iq-page .liq-details > summary::-webkit-details-marker { display: none; }
body.llm-iq-page .liq-details > summary::before {
  content: '▸'; color: var(--liq-muted); display: inline-block; transition: transform 0.15s; flex: none;
}
body.llm-iq-page .liq-details[open] > summary::before { transform: rotate(90deg); }
body.llm-iq-page .liq-details > summary:focus-visible { outline: 2px solid var(--liq-text); outline-offset: -2px; }
body.llm-iq-page .liq-sum-id { color: var(--liq-muted); font-variant-numeric: tabular-nums; }
body.llm-iq-page .liq-sum-title { flex: 1; }
body.llm-iq-page .liq-sum-pts { color: var(--liq-muted); font-size: 0.85rem; font-weight: 400; white-space: nowrap; }
body.llm-iq-page .liq-details[open] > summary { border-bottom: 1px solid var(--liq-line); background: var(--liq-panel-2); border-radius: 6px 6px 0 0; }
body.llm-iq-page .liq-details-body { padding: 4px 16px 18px; overflow-wrap: anywhere; }
body.llm-iq-page .liq-details-body p { margin: 8px 0; line-height: 1.65; }
body.llm-iq-page .liq-details-body ul { margin: 8px 0; padding-left: 1.3em; }
body.llm-iq-page .liq-details-body li { margin: 4px 0; line-height: 1.65; }
body.llm-iq-page .liq-details-body h5 {
  margin: 18px 0 6px; font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--liq-muted);
}
body.llm-iq-page .liq-details-body h4.liq-gradeh {
  margin: 26px 0 0; padding-top: 14px; border-top: 1px solid var(--liq-line); font-size: 1rem; color: var(--liq-text);
}
body.llm-iq-page .liq-details-body h4::before,
body.llm-iq-page .liq-details-body h5::before { content: none; }
body.llm-iq-page .liq-prompt {
  padding: 10px 12px; white-space: pre-wrap; line-height: 1.7; font-size: 0.92rem; color: var(--liq-text);
  background: var(--liq-bg); border: 1px solid var(--liq-grid); border-left: 3px solid var(--liq-muted); border-radius: 6px;
}
body.llm-iq-page .liq-sublabel { margin: 12px 0 4px; font-size: 0.82rem; font-weight: 600; color: var(--liq-muted); }
body.llm-iq-page .liq-fig { margin: 12px 0; }
body.llm-iq-page .liq-fig img { display: block; max-width: 100%; height: auto; border: 1px solid var(--liq-grid); border-radius: 6px; background: #fff; }
body.llm-iq-page .liq-formula {
  padding: 8px 12px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.85rem;
  background: var(--liq-bg); border: 1px solid var(--liq-grid); border-radius: 6px;
}
body.llm-iq-page .liq-exnote { padding: 8px 12px; border-left: 3px solid var(--liq-muted); background: var(--liq-panel-2); border-radius: 0 6px 6px 0; }
body.llm-iq-page .liq-details-body .liq-scroll { margin: 10px 0; }
body.llm-iq-page table.liq-extable { font-size: 0.85rem; }
body.llm-iq-page .liq-extable th,
body.llm-iq-page .liq-extable td { text-align: left; padding: 7px 10px; vertical-align: top; min-width: 70px; }
body.llm-iq-page .liq-extable thead th { white-space: nowrap; }
body.llm-iq-page .liq-extable td:last-child { min-width: 220px; }
body.llm-iq-page .liq-extable td.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; min-width: 0; }
body.llm-iq-page .liq-extable th.liq-grp { background: var(--liq-panel-2); font-weight: 600; min-width: 130px; border-right: 1px solid var(--liq-grid); }
body.llm-iq-page .liq-withheld { margin-top: 4px; font-style: italic; }

@media screen and (max-width: 768px) {
  body.llm-iq-page #content-inner { padding: 28px 12px 48px; }
  body.llm-iq-page .liq-table th.liq-rowh,
  body.llm-iq-page .liq-table td.liq-rowh { min-width: 110px; max-width: 120px; }
  body.llm-iq-page .liq-dlg-body { padding: 12px 12px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  body.llm-iq-page .liq-q.liq-focus { animation: none; }
}

/* Keep exam blocks inside the column: wide rubric tables scroll inside
   .liq-scroll instead of stretching the <details> (min-width:auto default). */
body.llm-iq-page #liq-exam,
body.llm-iq-page #liq-exam .liq-details,
body.llm-iq-page #liq-exam .liq-details-body,
body.llm-iq-page #liq-exam .liq-scroll {
  min-width: 0;
  max-width: 100%;
}
body.llm-iq-page #liq-exam .liq-scroll { overflow-x: auto; }
/* Exam rubric tables: fill the column and let description cells wrap
   (the score-matrix table style sets nowrap/display:block). */
body.llm-iq-page table.liq-extable { display: table; width: 100%; }
body.llm-iq-page .liq-extable td { white-space: normal; }
