/* ════════════════════════════════════════════════════════════════════════════
   rcai·qa — витрина v3, структура по образцу TestIT, фирменный стиль SZRCAI.
   Брендовые цвета из логотипа: ink #343D55 · accent #479BBF · red #DA374B.
   Шрифт: SZRCAI / SZRCAI Mono. Self-contained.
   ════════════════════════════════════════════════════════════════════════════ */
@font-face { font-family:'SZRCAI'; src:url('assets/fonts/SZRCAI.ttf') format('truetype'); font-weight:400 900; font-display:swap; }
@font-face { font-family:'SZRCAI Mono'; src:url('assets/fonts/SZRCAI_mono.ttf') format('truetype'); font-weight:400 700; font-display:swap; }

:root {
  --ink:#343D55; --accent:#479BBF; --accent-2:#3a86a8; --red:#DA374B;
  --bg:#f4f6f9; --grid-line:#e9ecf2; --surface:#ffffff; --surface-2:#f7f9fb; --surface-3:#eef2f6;
  --border:#d4dae4; --border-strong:#bcc4d2;
  --text:#2b3145; --muted:#6d7488; --muted-2:#a4abbb;
  --accent-soft:#e6f1f6;
  --pass:#2b9348; --pass-soft:#e7f5ec; --fail:#DA374B; --fail-soft:#fce8eb;
  --warn:#e8920a; --warn-soft:#fcf2dd; --info:#479BBF; --info-soft:#e6f1f6;
  --r:12px; --r-sm:8px; --shadow:0 1px 2px rgba(52,61,85,.04), 0 4px 14px rgba(52,61,85,.05);
  --topbar:#343D55;
}
/* Тёмная тема ОТКЛЮЧЕНА — витрина всегда светлая (институциональная), как rcai-redmine.
   Раньше здесь был @media (prefers-color-scheme:dark) — удалён: при тёмном режиме ОС
   витрина уходила в графит, от чего отказались. Форсим светлую через color-scheme ниже. */
:root{ color-scheme: light; }
*{box-sizing:border-box;}
/* Technical Modular Grid: НИКАКИХ скруглений — только прямые углы (SVG-кольца донатов не затрагиваются) */
*,*::before,*::after{border-radius:0 !important;}
html,body{margin:0;padding:0;}
/* Фон НЕЙТРАЛЬНЫЙ. «Сеточность» создают тонкие границы самих элементов (карточек/блоков),
   а не подложка — иначе сетка лезет под текст и мешает читать. */
body{font-family:'SZRCAI',system-ui,-apple-system,sans-serif; color:var(--text);
  font-size:14px; line-height:1.5; -webkit-font-smoothing:antialiased; background:var(--bg);}
.mono{font-family:'SZRCAI Mono',ui-monospace,SFMono-Regular,monospace;}
a{color:var(--accent); text-decoration:none;}
button{font-family:inherit;}

/* ── topbar (глобальный, навигация уровня TestIT) ─────────────────────────── */
.topbar{display:flex; align-items:center; gap:18px; height:56px; padding:0 20px; background:var(--topbar);
  position:sticky; top:0; z-index:40;}
.topbar .logo-badge{display:flex; align-items:center; gap:9px; cursor:pointer;}
.topbar .logo-badge .chip{background:#fff; border-radius:8px; padding:5px 8px; display:flex;}
.topbar .logo-badge img{height:18px; display:block;}
.topbar .logo-badge .wm{color:#fff; font-weight:800; font-size:16px; letter-spacing:-.02em;}
.topbar .logo-badge .wm b{color:var(--accent);}
.topbar .gnav{display:flex; gap:0; margin-left:10px; align-self:stretch; align-items:stretch;}
.topbar .gnav a{color:rgba(255,255,255,.72); padding:18px 16px; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; line-height:1; align-self:stretch; display:flex; align-items:center;}
.topbar .gnav a:hover{background:rgba(255,255,255,.08); color:#fff;}
.topbar .gnav a.active{background:var(--accent); color:#fff;}
.topbar .spacer{flex:1;}
.topbar .search{position:relative;}
.topbar .search input{width:240px; max-width:34vw; padding:7px 12px 7px 32px; border:none; border-radius:8px;
  background:rgba(255,255,255,.14); color:#fff; font:inherit; font-size:13px;}
.topbar .search input::placeholder{color:rgba(255,255,255,.6);}
.topbar .search input:focus{outline:none; background:rgba(255,255,255,.22);}
.topbar .search .si{position:absolute; left:10px; top:7px; color:rgba(255,255,255,.6); font-size:13px;}
.topbar .avatar{width:30px; height:30px; border-radius:50%; background:var(--accent); color:#fff;
  display:grid; place-items:center; font-weight:700; font-size:13px;}

/* ── subnav (вкладки внутри проекта) ──────────────────────────────────────── */
.subnav{display:flex; align-items:center; gap:4px; padding:0 20px; background:var(--surface);
  border-bottom:1px solid var(--border); position:sticky; top:56px; z-index:30; height:46px;}
.subnav .pname{font-weight:700; font-size:14px; margin-right:14px; display:flex; align-items:center; gap:8px;}
.subnav .pname .back{color:var(--muted); cursor:pointer;}
.subnav a{color:var(--muted); padding:13px 13px; font-size:13.5px; font-weight:600; border-bottom:2px solid transparent; margin-bottom:-1px;}
.subnav a:hover{color:var(--text);}
.subnav a.active{color:var(--accent); border-bottom-color:var(--accent);}

/* ── layout ───────────────────────────────────────────────────────────────── */
.page{max-width:1360px; margin:0 auto; padding:22px 24px 80px;}
.page-h{font-size:21px; font-weight:800; letter-spacing:-.02em; margin:2px 0 16px; display:flex; align-items:center; gap:12px;}
.page-h .sub{font-size:13px; font-weight:500; color:var(--muted);}
.crumbs{font-size:12.5px; color:var(--muted); margin-bottom:10px;}
.crumbs a{color:var(--muted);} .crumbs b{color:var(--text);}
.proto-banner{display:flex; gap:8px; align-items:center; background:var(--accent-soft); color:var(--accent-2);
  border:1px solid var(--accent); border-radius:var(--r-sm); padding:8px 14px; font-size:12.5px; margin-bottom:16px;}
.sec-label{font-family:'SZRCAI Mono',monospace; font-size:10px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--muted-2); margin:24px 2px 12px; display:flex; align-items:center; gap:8px;}

/* ── bento / cards ────────────────────────────────────────────────────────── */
.bento{display:grid; grid-template-columns:repeat(12,1fr); gap:12px;}
.c3{grid-column:span 3;} .c4{grid-column:span 4;} .c5{grid-column:span 5;} .c6{grid-column:span 6;}
.c7{grid-column:span 7;} .c8{grid-column:span 8;} .c9{grid-column:span 9;} .c12{grid-column:span 12;}
@media(max-width:980px){ .bento{grid-template-columns:repeat(6,1fr);} .c5,.c7,.c8,.c9,.c12{grid-column:span 6;} .c3,.c4{grid-column:span 3;} .c6{grid-column:span 6;} }
@media(max-width:620px){ .bento{grid-template-columns:1fr;} [class*="c"]{grid-column:span 1 !important;} }
.card{background:var(--surface); border:1px solid var(--border); border-radius:var(--r); box-shadow:var(--shadow);
  padding:16px 18px; min-width:0; display:flex; flex-direction:column;}
.card .ct{font-size:13px; font-weight:700; color:var(--text); margin-bottom:12px; display:flex; align-items:center; gap:8px;}
.card .ct .cidx{color:var(--accent); font-size:11px; letter-spacing:.06em; opacity:.9; font-weight:700;}
.card .ct .tools{margin-left:auto; display:flex; gap:6px;}
.icobtn{width:24px; height:24px; border-radius:50%; border:1px solid var(--border); background:var(--surface-2);
  color:var(--muted); display:grid; place-items:center; font-size:12px; cursor:pointer;}
.help{width:15px;height:15px;border-radius:50%;border:1px solid var(--border-strong);color:var(--muted);
  font-size:10px;display:inline-grid;place-items:center;cursor:help;flex-shrink:0;}

/* ── status / priority chips ──────────────────────────────────────────────── */
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex-shrink:0;}
.dot.pass,.dot.passed,.dot.ok{background:var(--pass);} .dot.fail,.dot.failed,.dot.bad{background:var(--fail);}
.dot.skip,.dot.skipped,.dot.warn{background:var(--warn);} .dot.muted{background:var(--muted-2);}
.st{display:inline-flex; align-items:center; gap:7px; font-size:13px;}
.st-ico{width:18px;height:18px;border-radius:50%;display:inline-grid;place-items:center;font-size:11px;font-weight:800;flex-shrink:0;}
.st-ico.ok{background:var(--pass-soft);color:var(--pass);} .st-ico.bad{background:var(--fail-soft);color:var(--fail);}
.st-ico.warn{background:var(--warn-soft);color:var(--warn);} .st-ico.mut{background:var(--surface-3);color:var(--muted);}
.fg-ok{color:var(--pass);} .fg-bad{color:var(--fail);} .fg-warn{color:var(--warn);} .fg-mut{color:var(--muted);} .fg-acc{color:var(--accent);}
.prio{font-size:12px; display:inline-flex; align-items:center; gap:4px; color:var(--warn);}
.badge{display:inline-flex; align-items:center; padding:2px 9px; border-radius:999px; font-size:11px;
  background:var(--surface-3); border:1px solid var(--border); color:var(--muted); white-space:nowrap;}
.badge.ok{background:var(--pass-soft); color:var(--pass); border-color:transparent;}
.badge.bad{background:var(--fail-soft); color:var(--fail); border-color:transparent;}
.badge.warn{background:var(--warn-soft); color:var(--warn); border-color:transparent;}
.badge.acc{background:var(--accent-soft); color:var(--accent-2); border-color:transparent;}
.badge.todo{background:var(--warn-soft); color:var(--warn); border-color:transparent;}

/* ── hero verdict (наше ноу-хау, TestIT такого нет) ───────────────────────── */
.hero{flex-direction:row; align-items:center; gap:20px; border-left:5px solid var(--muted);}
.hero.green{border-left-color:var(--pass);} .hero.red{border-left-color:var(--fail);}
.hero .glyph{width:64px;height:64px;border-radius:14px;display:grid;place-items:center;font-size:34px;font-weight:800;flex-shrink:0;}
.hero.green .glyph{background:var(--pass-soft);color:var(--pass);} .hero.red .glyph{background:var(--fail-soft);color:var(--fail);}
.hero .verdict{font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1.1;}
.hero.green .verdict{color:var(--pass);} .hero.red .verdict{color:var(--fail);}
.hero .vsub{font-size:13px;margin-top:5px;} .hero .vmeta{color:var(--muted);font-size:12px;margin-top:8px;display:flex;gap:14px;flex-wrap:wrap;}
.hero .vcount{margin-left:auto;text-align:right;flex-shrink:0;}
.hero .vcount .n{font-size:32px;font-weight:800;letter-spacing:-.03em;line-height:1;}
.hero .vcount .l{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em;margin-top:6px;}

/* ── donut widget (как тест-планы / дашборд TestIT) ───────────────────────── */
.donut-wrap{display:flex; align-items:center; gap:16px; flex-wrap:wrap;}
.donut{position:relative; width:104px; height:104px; flex-shrink:0;}
.donut svg{display:block; transform:rotate(-90deg);}
.donut .center{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; pointer-events:none;}
.donut .center .n{font-size:22px; font-weight:800; letter-spacing:-.03em; line-height:1;}
.donut .center .l{font-size:9px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; margin-top:3px;}
.legend{display:grid; gap:5px; flex:1 1 150px; min-width:0;}
.legend .lr{display:flex; align-items:center; gap:8px; font-size:12.5px; min-width:0;}
.legend .lr .nm{flex:1; min-width:0; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.legend .lr .v{font-weight:700; flex-shrink:0;} .legend .lr .pct{color:var(--muted); width:40px; text-align:right; flex-shrink:0;}

/* ── KPI tiles ────────────────────────────────────────────────────────────── */
.kpi{cursor:pointer; transition:border-color .12s; user-select:none;}
.kpi:hover{border-color:var(--border-strong);} .kpi.active{border-color:var(--accent); box-shadow:0 0 0 1px var(--accent);}
.kpi .k{color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.06em; display:flex; align-items:center; gap:6px;}
.kpi .v{font-size:28px; font-weight:800; letter-spacing:-.03em; margin-top:6px; line-height:1;}
.kpi.pass .v{color:var(--pass);} .kpi.fail .v{color:var(--fail);} .kpi.skip .v{color:var(--warn);}
.kpi .bar{height:3px; border-radius:3px; margin-top:10px; background:var(--surface-3); overflow:hidden;}
.kpi .bar>i{display:block; height:100%; border-radius:3px;}

/* ── trend bars ───────────────────────────────────────────────────────────── */
.bars{display:flex; align-items:flex-end; gap:4px; height:58px; margin-top:auto;}
.bars .b{flex:1; min-width:4px; border-radius:3px 3px 1px 1px; cursor:pointer;}
.trend-cap{color:var(--muted); font-size:11.5px; margin-top:10px; display:flex; justify-content:space-between;}

/* ── project / feature cards ──────────────────────────────────────────────── */
.grid-cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(330px,1fr)); gap:14px;}
.ecard{display:block; background:var(--surface); border:1px solid var(--border); border-radius:var(--r);
  box-shadow:var(--shadow); padding:18px; color:var(--text); transition:border-color .12s, transform .12s; cursor:pointer;}
.ecard:hover{border-color:var(--accent); transform:translateY(-1px);}
.ecard .meta{font-size:11.5px; color:var(--muted-2); display:flex; gap:12px; flex-wrap:wrap; margin-bottom:9px;}
.ecard .chips{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:11px;}
.ecard .chip{display:flex; align-items:center; gap:6px; font-size:12px; color:var(--muted);}
.ecard .chip b{color:var(--text); font-weight:700;}
.ecard .name{font-size:17px; font-weight:700; letter-spacing:-.01em;}
.ecard .desc{color:var(--muted); font-size:12.5px; margin-top:7px; line-height:1.5; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;}
.ecard .platform{font-size:12px; color:var(--accent); margin-top:4px;}
.seg{display:inline-flex; border:1px solid var(--border-strong); border-radius:var(--r-sm); overflow:hidden;}
.seg button{background:var(--surface); border:none; padding:7px 13px; font:inherit; font-size:13px; color:var(--muted); cursor:pointer; border-left:1px solid var(--border);}
.seg button:first-child{border-left:none;} .seg button.active{background:var(--accent-soft); color:var(--accent-2); font-weight:600;}

/* ── tests layout: tree + table + drawer ──────────────────────────────────── */
.split{display:grid; grid-template-columns:248px 1fr; gap:16px; align-items:start;}
@media(max-width:860px){ .split{grid-template-columns:1fr;} }
.aside{position:sticky; top:118px;}
.aside .card{padding:12px;}
.tabs2{display:flex; gap:2px; margin-bottom:10px; background:var(--surface-3); border-radius:var(--r-sm); padding:3px;}
.tabs2 button{flex:1; background:none; border:none; padding:6px; font:inherit; font-size:12.5px; color:var(--muted); cursor:pointer; border-radius:6px;}
.tabs2 button.active{background:var(--surface); color:var(--text); font-weight:600; box-shadow:var(--shadow);}
.tree{display:grid; gap:1px;}
.tnode{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:7px 9px; border-radius:var(--r-sm); cursor:pointer; font-size:13px;}
.tnode:hover{background:var(--surface-2);} .tnode.active{background:var(--accent-soft); color:var(--accent-2); font-weight:600;}
.tnode .nm{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:flex; align-items:center; gap:7px;}
.tnode .cnt{color:var(--muted); font-size:11.5px; flex-shrink:0;} .tnode.active .cnt{color:var(--accent-2);} .tnode .cnt.fail{color:var(--fail); font-weight:700;}
.tnode.child{padding-left:22px; font-size:12.5px;}
.toolbar{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:14px;}
.search-inline{flex:1; min-width:200px;}
.search-inline input{width:100%; padding:9px 12px; border:1px solid var(--border-strong); border-radius:var(--r-sm); background:var(--surface); color:var(--text); font:inherit;}
.search-inline input:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft);}
/* overflow НЕ hidden — иначе ломается position:sticky у вложенных .thead/.ghead */
.tbl{background:var(--surface); border:1px solid var(--border); border-radius:var(--r); box-shadow:var(--shadow);}
.thead,.trow{display:grid; grid-template-columns:34px 1fr 130px 96px 64px; align-items:center; gap:12px; padding:9px 16px;}
.thead{background:var(--surface-2); border-bottom:1px solid var(--border); font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted);
  position:sticky; top:var(--stick-top, 102px); z-index:17; border-radius:var(--r) var(--r) 0 0;}
.ghead{display:flex; align-items:center; gap:9px; padding:9px 16px; background:var(--surface-2); border-top:1px solid var(--border); font-size:12.5px; font-weight:700; cursor:pointer;
  position:sticky; top:calc(var(--stick-top, 102px) + 36px); z-index:15;}
.ghead .cnt{color:var(--muted); font-weight:400;} .ghead .chev{color:var(--muted-2); transition:transform .15s;} .ghead.collapsed .chev{transform:rotate(-90deg);}
.trow{border-top:1px solid var(--border); cursor:pointer;} .trow:hover{background:var(--surface-2);}
.trow .nm{font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.trow .sui{color:var(--muted); font-size:11.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-top:1px;}
.trow .dur{color:var(--muted); font-size:11.5px; text-align:right;}
.tcount{color:var(--muted); font-size:12px; padding:0 2px 10px;}
.empty{padding:38px; text-align:center; color:var(--muted);}
.typeicon{font-size:13px;}

/* ── feature detail (наше ноу-хау): tabs + right meta ─────────────────────── */
.fdetail{display:grid; grid-template-columns:1fr 300px; gap:18px; align-items:start;}
@media(max-width:920px){ .fdetail{grid-template-columns:1fr;} }
.wtabs{display:flex; gap:4px; border-bottom:1px solid var(--border); margin-bottom:16px; flex-wrap:wrap;}
.wtabs button{background:none; border:none; padding:10px 14px; font:inherit; color:var(--muted); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px;}
.wtabs button.active{color:var(--accent); border-bottom-color:var(--accent); font-weight:600;}
.wsec{background:var(--surface); border:1px solid var(--border); border-radius:var(--r); box-shadow:var(--shadow); padding:16px 18px; margin-bottom:14px;}
.wsec h3{margin:0 0 12px; font-size:14px; font-weight:700;}
/* Липкий аккордеон (секции wsc()): шапка липнет под topbar(56)+subnav(46)=102px, сворачивание по клику.
   Только .wsec.acc — прямые .wsec (напр. черновики «Входящих») сохраняют базовый padding. */
.wsec.acc{padding:0;}
.wsec.acc > .wsec-head{margin:0; font-size:14px; font-weight:700; padding:12px 18px; cursor:pointer; display:flex; align-items:center; gap:9px;
  position:sticky; top:var(--stick-top, 102px); z-index:20; background:var(--surface); border-radius:var(--r) var(--r) 0 0;}
.wsec.acc:not(.collapsed) > .wsec-head{border-bottom:1px solid var(--border);}
.wsec.acc.collapsed > .wsec-head{border-radius:var(--r);}
.wsec.acc > .wsec-body{padding:14px 18px;}
.wsec.acc.collapsed > .wsec-body{display:none;}
.wcaret{color:var(--muted); font-size:11px; width:10px; flex:none;}
.wsec.acc:not(.collapsed) .wcaret::before{content:'▾';}
.wsec.acc.collapsed .wcaret::before{content:'▸';}
/* Навигатор по разделам (последний сегмент крошки/заголовка) */
.secnav{position:relative; cursor:pointer; color:var(--muted); font-weight:600; user-select:none; font-size:13px;}
.subnav .secnav{margin-left:auto; padding:0 4px;}
.secnav .secnav-ico{color:var(--accent);}
.secnav .secnav-cur{color:var(--text);}
.secnav-menu{display:none; position:absolute; top:100%; right:0; margin-top:6px; min-width:210px; z-index:60;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r); box-shadow:var(--shadow); padding:4px;}
.secnav-menu.open{display:block;}
.secnav-menu a{display:block; padding:7px 10px; font-size:13px; color:var(--text); border-radius:6px; cursor:pointer; white-space:nowrap;}
.secnav-menu a:hover{background:var(--surface-3, rgba(0,0,0,.05));}
.secnav-menu a.active{color:var(--accent); font-weight:700;}
.ug-intro{font-size:14.5px; line-height:1.6; max-width:74ch;}
.ug-sec{margin-top:14px;} .ug-sec h4{margin:0 0 4px; font-size:14px;} .ug-sec p{margin:0; line-height:1.6; max-width:74ch;}
.kv{display:flex; gap:10px; padding:5px 0; font-size:13px; border-bottom:1px dashed var(--border);}
.kv:last-child{border-bottom:none;} .kk{color:var(--muted); min-width:130px; flex-shrink:0;} .kvv{color:var(--text);}
.metapanel{position:sticky; top:118px;}
.metapanel .card{padding:16px;}
.metapanel .mh{font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin:0 0 10px;}
.coderef{display:inline-flex; align-items:center; padding:2px 7px; border-radius:6px; background:var(--accent-soft); color:var(--accent-2); font-size:11px; cursor:help;}
.refrow{display:flex; gap:6px; flex-wrap:wrap; margin-top:10px;}
.bhv{border:1px solid var(--border); border-radius:var(--r-sm); padding:11px 13px; margin-bottom:10px;}
.bhv-top{display:flex; gap:8px; align-items:center; flex-wrap:wrap;} .bhv-stmt{margin-top:6px; font-size:13px; line-height:1.5;} .bhv-note{margin-top:4px; font-size:12px; color:var(--muted);}
.btn{background:var(--accent-soft); color:var(--accent-2); border:none; border-radius:var(--r-sm); padding:8px 13px; font:inherit; font-size:12.5px; cursor:pointer; font-weight:600;}
.btn:hover{background:var(--accent); color:#fff;}
.muted-note{color:var(--muted); font-size:12.5px;}

/* coverage bar (Xray/TestIT-style) */
.covbar{display:flex; height:10px; border-radius:6px; overflow:hidden; background:var(--surface-3); margin:6px 0;}
.covbar i{display:block; height:100%;}

/* matrix */
.matrix-wrap{overflow-x:auto;}
table.matrix{border-collapse:collapse; font-size:12px; margin-top:8px;}
table.matrix th,table.matrix td{border:1px solid var(--border); padding:5px 8px; text-align:center; white-space:nowrap;}
table.matrix th{background:var(--surface-2); color:var(--muted); font-weight:600;}
table.matrix td.m-label{text-align:left; color:var(--text);}
.m-cell.m-show{color:var(--pass); background:var(--pass-soft);} .m-cell.m-hide{color:var(--muted-2);} .m-cell.m-bug{background:var(--fail-soft); color:var(--fail);}

/* колористика: визуальные свотчи (иконка-точка на своей зоне поверх фона карты) */
table.color-tbl td{vertical-align:middle;}
.sw{position:relative; width:46px; height:26px; border:1px solid var(--border-strong); overflow:hidden; display:inline-block; vertical-align:middle; flex-shrink:0;}
.sw-fill{position:absolute; inset:0;} .sw-dot{position:absolute; top:50%; left:50%; width:12px; height:12px; transform:translate(-50%,-50%); box-shadow:0 0 0 1px rgba(0,0,0,.25);}
.swrow{display:flex; gap:5px; align-items:center;}
.prop{display:flex; align-items:center; gap:7px;} .prop-hex{font-size:10.5px; color:var(--muted);}
.color-tbl .m-label{display:flex; flex-direction:column; align-items:flex-start; gap:2px;}
.fnd-sw{display:flex; gap:10px; align-items:center; margin-top:8px; flex-wrap:wrap;}
.fnd-sw .sg{display:flex; align-items:center; gap:6px; font-size:11px; color:var(--muted);}
.fnd-sw .arrow{color:var(--muted-2);}

/* ── run / plan cards (как тест-планы TestIT) ─────────────────────────────── */
.runcard .rc-top{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:6px;}
.runcard .rc-title{font-size:15px; font-weight:700;}
.runcard .rc-meta{color:var(--muted); font-size:11.5px; margin-bottom:12px;}

/* ── drawer ───────────────────────────────────────────────────────────────── */
.scrim{position:fixed; inset:0; background:rgba(10,12,16,.42); opacity:0; pointer-events:none; transition:opacity .18s; z-index:50;}
.scrim.open{opacity:1; pointer-events:auto;}
.drawer{position:fixed; top:0; right:0; height:100%; width:min(560px,94vw); background:var(--surface); border-left:1px solid var(--border);
  box-shadow:-8px 0 40px rgba(0,0,0,.16); transform:translateX(100%); transition:transform .22s cubic-bezier(.2,.7,.2,1); z-index:51; display:flex; flex-direction:column;}
.drawer.open{transform:none;}
.dh{padding:18px 20px; border-bottom:1px solid var(--border); display:flex; align-items:flex-start; justify-content:space-between; gap:16px;}
.dh .x{background:none; border:none; font-size:22px; color:var(--muted); cursor:pointer; line-height:1;}
.db{padding:18px 20px; overflow:auto;}
.steps{display:grid; gap:1px;} .step{display:grid; grid-template-columns:30px 1fr 1fr; gap:12px; padding:10px 8px; border-top:1px solid var(--border); font-size:12.5px;}
.step .n{color:var(--muted-2); font-weight:700;} .step .exp{color:var(--muted);}
.msg{background:var(--fail-soft); border:1px solid var(--fail); border-radius:var(--r-sm); padding:12px 14px; font-size:12.5px; white-space:pre-wrap; word-break:break-word;}
.why-box{background:var(--accent-soft); border:1px solid var(--accent); border-radius:var(--r-sm); padding:12px 14px; margin-bottom:16px; font-size:13px; line-height:1.5;}
.why-box .k{color:var(--accent-2); font-size:10.5px; text-transform:uppercase; letter-spacing:.06em; margin-bottom:4px; font-weight:700;}

/* FAB */
.fab{position:fixed; right:26px; bottom:26px; width:52px; height:52px; border-radius:50%; background:var(--accent); color:#fff;
  border:none; font-size:26px; box-shadow:0 6px 20px rgba(71,155,191,.45); cursor:pointer; z-index:35;}
footer{color:var(--muted-2); font-size:12px; text-align:center; padding:28px 0 8px;}