/* workspace · общий стиль страниц тестов */
:root{
  --bg:#000;--surface:#080808;--surface-2:#101010;--surface-3:#181818;--border:#1a1a1a;--border-2:#252525;--border-hi:#aaa;
  --t1:#f0f0f0;--t2:#aaaaaa;--t3:#666666;--t4:#3a3a3a;
  --up:#7da8ff;--up-bg:rgba(91,141,239,.14);--up-bg-2:rgba(91,141,239,.28);
  --dn:#f4a0cc;--dn-bg:rgba(244,160,204,.12);--dn-bg-2:rgba(244,160,204,.26);
  --dot:#3fbf6f;--toggle-bg:#222;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:'IBM Plex Sans',-apple-system,'Helvetica Neue',Arial,sans-serif;
  color-scheme:dark;
}
/* светлая тема: включается переключателем в углу экрана (кнопка внизу файла) */
:root[data-theme="light"]{
  --bg:#ffffff;--surface:#f6f7f8;--surface-2:#ebedef;--surface-3:#e1e4e7;--border:#e2e4e7;--border-2:#d2d5d9;--border-hi:#1a1a1a;
  --t1:#111318;--t2:#52565c;--t3:#84888e;--t4:#c7cad0;
  --up:#2f5fd6;--up-bg:rgba(47,95,214,.10);--up-bg-2:rgba(47,95,214,.20);
  --dn:#c22e6d;--dn-bg:rgba(194,46,109,.09);--dn-bg-2:rgba(194,46,109,.18);
  --dot:#1f9d54;--toggle-bg:#dcdfe3;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--t1);font-family:var(--mono);font-size:13px;line-height:1.5;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;transition:background-color .15s,color .15s}
a{color:var(--up);text-decoration:none}
a:hover{text-decoration:underline}
.app{max-width:none;margin:0;padding:24px 32px 96px}

/* переключатель темы: тумблер, как на сайте COT Report (broxy-cot-report.netlify.app) */
.theme-toggle{position:fixed;top:16px;right:20px;z-index:50;display:flex;align-items:center;gap:7px;cursor:pointer;user-select:none;font:inherit;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--t3)}
.theme-toggle-track{width:32px;height:16px;background:var(--toggle-bg);border-radius:8px;position:relative;transition:background .2s}
.theme-toggle-knob{width:12px;height:12px;background:var(--up);border-radius:50%;position:absolute;top:2px;left:2px;transition:transform .2s,background-color .2s}
:root[data-theme="light"] .theme-toggle-knob{transform:translateX(16px)}
@media(max-width:640px){.theme-toggle .label{display:none}}

/* breadcrumbs (путь как в проводнике) */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--t3);margin-bottom:18px;padding-right:52px}
.crumbs a{color:var(--t3)}
.crumbs a:hover{color:var(--t2);text-decoration:none}
.crumbs .sep{color:var(--t4)}
.crumbs .cur{color:var(--t1)}

/* header */
.hdr{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding-bottom:16px;margin-bottom:18px;border-bottom:1px solid var(--border);flex-wrap:wrap}
.hdr h1{margin:0;font-size:15px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.hdr .sub{font-size:10px;color:var(--t3);letter-spacing:.14em;text-transform:uppercase;margin-top:5px}
.hdr .meta{font-size:10px;color:var(--t3);letter-spacing:.08em;text-transform:uppercase;text-align:right;line-height:1.9}
.hdr .meta b{color:var(--t2);font-weight:500}
.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--dot);margin-right:6px;vertical-align:1px}

/* cards */
.card{background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:18px 20px;margin-bottom:16px}
.card.card-chart{margin-top:44px;position:relative}
.card.card-chart::before{content:'';position:absolute;left:-1px;right:-1px;top:-23px;border-top:1px solid var(--border)}
.card-title{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--t1);font-weight:600;margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.card-title .hint{font-weight:400;color:var(--t3);letter-spacing:.06em;text-transform:none}

/* карточки детей раздела (как в Notion) */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-bottom:16px}
.tcard{display:flex;flex-direction:column;gap:8px;background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:16px 18px;color:var(--t1);min-height:120px;transition:border-color .15s}
.tcard:hover{border-color:var(--border-2);text-decoration:none;background:var(--surface-2)}
.tcard-kind{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--t3)}
.tcard-name{font-size:13.5px;font-weight:600;letter-spacing:.02em}
.tcard-sub{font-family:var(--sans);font-size:13px;color:var(--t2);line-height:1.5;flex:1}
.tcard-foot{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.empty{font-family:var(--sans);font-size:13.5px;color:var(--t3);padding:24px 0}

/* prose */
.prose{font-family:var(--sans);font-size:14.5px;line-height:1.65;color:var(--t2)}
.prose p{margin:0 0 12px}
.prose strong{color:var(--t1);font-weight:500}
.prose h2,.prose h3{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--t1);margin:22px 0 10px;font-weight:600}
.prose h2:first-child,.prose h3:first-child{margin-top:0}
.prose ul,.prose ol{padding-left:18px;margin:0 0 12px}
.prose li{margin-bottom:5px}
.prose code{font-family:var(--mono);font-size:12px;color:var(--t1);background:var(--surface-2);padding:1px 5px;border-radius:2px;border:1px solid var(--border)}
.prose .twrap{max-width:none;margin:0 0 14px}
.formula{font-family:var(--mono);font-size:12px;color:var(--t1);background:var(--surface-2);border:1px solid var(--border);border-radius:3px;padding:12px 14px;margin:8px 0 14px;white-space:pre;overflow-x:auto;line-height:1.7}
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:820px){.two{grid-template-columns:1fr}}

/* key/value table (паспорт теста) */
.kv{width:100%;border-collapse:collapse;font-size:12px}
.kv td{padding:8px 0;border-bottom:1px solid var(--border);vertical-align:top}
.kv td:first-child{color:var(--t3);letter-spacing:.06em;text-transform:uppercase;font-size:10px;width:170px;padding-right:18px}
.kv tr:last-child td{border-bottom:none}
.kv .sans{font-family:var(--sans);font-size:13.5px;color:var(--t2)}
.kv ul{margin:0;padding-left:16px}
.kv li{margin-bottom:3px}

/* controls */
.controls{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.ctl{display:flex;align-items:center;gap:8px}
.ctl-label{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--t3)}
.seg{display:inline-flex;border:1px solid var(--border-2);border-radius:2px;overflow:hidden}
.seg button{font:inherit;font-size:11px;letter-spacing:.06em;color:var(--t3);background:var(--surface);border:none;border-right:1px solid var(--border-2);padding:6px 12px;cursor:pointer}
.seg button:last-child{border-right:none}
.seg button:hover{color:var(--t2)}
.seg button[aria-pressed="true"]{color:var(--t1);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border-hi)}
.seg button:focus-visible{outline:1px solid var(--border-hi);outline-offset:-1px}

/* stat tiles */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));border:1px solid var(--border);border-radius:3px;overflow:hidden;margin-bottom:16px}
.tile{padding:12px 14px;border-right:1px solid var(--border);background:var(--surface)}
.tile:last-child{border-right:none}
.tile .l{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--t3);margin-bottom:6px}
.tile .v{font-size:19px;font-weight:600;line-height:1.1}
.tile .s{font-size:10px;color:var(--t3);margin-top:4px;line-height:1.6}
.tile .s b{color:var(--t2);font-weight:500}
.v.up{color:var(--up)}.v.dn{color:var(--dn)}
.up{color:var(--up)}.dn{color:var(--dn)}
/* большие тайлы да/нет */
.big{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
@media(max-width:700px){.big{grid-template-columns:1fr}}
.big .tile{border:1px solid var(--border);border-radius:4px;padding:16px 18px}
.big .tile .l{font-size:10px;margin-bottom:8px}
.big .tile .v{font-size:34px;line-height:1}
.tile .v.ok{color:var(--up)}
.tile .v.no{color:var(--t2)}

/* verdict */
.verdict{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--border-2);border-radius:3px;margin-bottom:16px;font-family:var(--sans);font-size:13.5px;color:var(--t2);background:var(--surface-2)}
.pill{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:4px 9px;border-radius:2px;border:1px solid var(--border-hi);color:var(--t1);white-space:nowrap}
.pill.pass,.pill.ok{border-color:var(--up);color:var(--up)}
.pill.fail{border-color:var(--t4);color:var(--t3)}
.pill.part{border-color:var(--t3);color:var(--t2)}
.pill.dim{border-color:var(--border-2);color:var(--t3)}
.pill.mid{border-color:var(--dn);color:var(--dn)}

/* сворачиваемый блок, как toggle в Notion */
.card.fold{padding-top:0;padding-bottom:0}
.card.fold details{padding:18px 0}
.card.fold summary{list-style:none;cursor:pointer;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--t2);font-weight:600;display:flex;align-items:center;gap:9px}
.card.fold summary::-webkit-details-marker{display:none}
.card.fold summary::before{content:'';width:0;height:0;border-left:5px solid var(--t3);border-top:4px solid transparent;border-bottom:4px solid transparent;transition:transform .15s}
.card.fold details[open] summary::before{transform:rotate(90deg)}
.card.fold summary:hover{color:var(--t1)}
.card.fold details[open] summary{margin-bottom:14px}
.card.fold .hint{margin-left:10px}

/* results table */
.twrap{overflow-x:auto;border:1px solid var(--border);border-radius:3px}
table.res{width:100%;border-collapse:collapse;font-size:12.5px;min-width:760px}
.res th{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--t3);font-weight:500;padding:10px 12px;text-align:right;border-bottom:1px solid var(--border-2);background:var(--surface);white-space:nowrap}
.res th:first-child,.res td:first-child{text-align:left}
.res td{padding:9px 12px;text-align:right;border-bottom:1px solid var(--border);vertical-align:top;background:var(--surface)}
.res tr:last-child td{border-bottom:none}
.res td.state{font-weight:600;letter-spacing:.06em}
.res td.n{color:var(--t2)}
.res .sep{border-left:1px solid var(--border-2)}
.res .cell{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.res .pct{font-weight:500}
.res .d{font-size:10.5px;color:var(--t3)}
.res .d.up{color:var(--up)}.res .d.dn{color:var(--dn)}
.res td.hit-up{background:var(--up-bg)}
.res td.hit-dn{background:var(--dn-bg)}
.res td.hit{background:var(--up-bg)}
.res tr.mid td{background:var(--surface-2)}
.res td.muted{color:var(--t3)}
.res td .lbl2{display:block;font-size:10px;color:var(--t3);font-weight:400;letter-spacing:.04em}
.res .yes{font-weight:600}

/* distribution bars */
.bars{margin-top:16px;display:grid;gap:8px}
.bar-row{display:grid;grid-template-columns:52px 1fr;align-items:center;gap:12px}
.bar-lbl{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--t3)}
.bar{display:flex;height:16px;border-radius:2px;overflow:hidden;border:1px solid var(--border-2);background:var(--surface)}
.bar span{display:block;height:100%}
.bar .b0{background:var(--dn-bg-2)}.bar .b1{background:var(--dn-bg)}.bar .b2{background:var(--surface-2)}.bar .b3{background:var(--up-bg)}.bar .b4{background:var(--up-bg-2)}
.bar-legend{display:flex;gap:14px;font-size:10px;color:var(--t3);margin-top:8px;flex-wrap:wrap}
.bar-legend i{display:inline-block;width:10px;height:10px;border-radius:1px;margin-right:5px;vertical-align:-1px;border:1px solid var(--border-2)}

/* funnel */
.funnel{display:grid;gap:6px;font-size:12px}
.frow{display:grid;grid-template-columns:1fr auto;gap:12px;padding:6px 0;border-bottom:1px solid var(--border)}
.frow:last-child{border-bottom:none}
.frow .k{color:var(--t2);font-family:var(--sans);font-size:13px}
.frow .v{color:var(--t1);font-weight:500}
.frow .v small{color:var(--t3);font-weight:400;margin-left:6px}

/* plain / markdown tables */
table.plain{width:100%;border-collapse:collapse;font-size:12px}
.plain th{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--t3);font-weight:500;text-align:right;padding:8px 10px;border-bottom:1px solid var(--border-2)}
.plain td{padding:7px 10px;text-align:right;border-bottom:1px solid var(--border)}
.plain th:first-child,.plain td:first-child{text-align:left}
.plain tr:last-child td{border-bottom:none}
.plain.md th,.plain.md td{text-align:left;font-family:var(--sans);font-size:13px;color:var(--t2);vertical-align:top}
.plain.md th{font-family:var(--mono)}
.plain.md td:first-child{font-family:var(--mono);font-size:12px;color:var(--t1);white-space:nowrap}
.note{font-family:var(--sans);font-size:13px;color:var(--t3);margin-top:12px;line-height:1.55}
.chip{display:inline-block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--border-2);border-radius:2px;padding:2px 7px;color:var(--t2);margin-right:6px}
.foot{margin-top:28px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--t4)}

/* главная: обычная шапка страницы, заголовок чуть крупнее; плитки в стилистике COT Report */
.hdr.hdr-root{border-bottom:none;margin-bottom:0}
/* панель плиток на главной: сверху такая же черта, как под шапкой страниц */
.tools-wrap{border-top:1px solid var(--border);padding-top:18px}
.hdr.hdr-root h1{font-size:20px}
.hdr.hdr-root .sub{text-transform:none;letter-spacing:.06em;font-size:11px}
.tools-panel{border:1px solid var(--border);border-radius:2px;padding:14px;background:var(--surface)}
.cards.tools{display:flex;flex-wrap:wrap;gap:14px;margin:0}
.cards.tools .tcard{width:280px;min-height:120px;padding:16px 18px;border-radius:2px;background:var(--surface-2);border-color:var(--border-2)}
.cards.tools .tcard:hover{border-color:var(--border-hi)}
.cards.tools .tcard-name{font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.cards.tools .tcard-sub{font-family:var(--mono);font-size:11.5px;color:var(--t3)}
.tcard.tplus{width:150px;align-items:center;justify-content:center;font-family:var(--mono);font-size:34px;font-weight:300;color:var(--t3);background:var(--surface)}
.tcard.tplus:hover{border-color:var(--border-hi);background:var(--surface-2);color:var(--t1)}
.cards-title{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--t1);font-weight:600;margin:26px 0 12px}

.card .cards{margin-bottom:0}
/* карточка Tests: плитки разделов плана тестов, внутри тесты списком */
.tgroups{display:flex;flex-direction:column;gap:14px}
.tgroup{border:1px solid var(--border-2);border-radius:2px;padding:14px 16px 16px}
.tgroup-title{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--t1);font-weight:600;margin:0 0 12px}
.cards.tlist{display:flex;flex-direction:column;gap:8px}
.cards.tlist .tcard{min-height:0;padding:12px 16px;gap:4px;background:var(--surface-2);border-color:var(--border-2);transition:background .15s}
.cards.tlist .tcard:hover{background:var(--surface-3)}

/* инструкция: ссылка в шапке, скриншоты в теме страницы, печать в PDF */
.hdr .meta a.hdr-link{color:var(--t2);text-decoration:none;border-bottom:1px solid var(--border);padding-bottom:2px;transition:color .15s,border-color .15s}
.hdr .meta a.hdr-link:hover{color:var(--t1);border-color:var(--t2)}
.prose a.guide-pdf{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--t1);text-decoration:none;border-bottom:1px solid var(--border);padding-bottom:2px}
.prose a.guide-pdf:hover{border-color:var(--t2)}
.app:has(figure.shot){max-width:900px;margin:0 auto}
.app:has(figure.shot) table.plain td:first-child{white-space:normal;min-width:120px}
figure.shot{margin:6px 0 18px}
figure.shot img{display:block;width:100%;height:auto;border:1px solid var(--border);border-radius:2px}
figure.shot img.l{display:none}
:root[data-theme="light"] figure.shot img.d{display:none}
:root[data-theme="light"] figure.shot img.l{display:block}
figure.shot figcaption{font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--t3);margin-top:7px}
@media print{
  .theme-toggle,.crumbs,.guide-pdf{display:none!important}
  body{background:#fff}
  .app{max-width:none;padding:0}
  .card{break-inside:auto;border-radius:2px}
  .card-title,.prose h3{break-after:avoid}
  figure.shot,.prose tr{break-inside:avoid}
  .card.fold summary::before{display:none}
  .prose .twrap{overflow:visible}
}