/* PRLab · блок результата (Screen04, ResultOverview) и таблица по запросам (QueryTable / QueryCards). */

/* ------------------------------------------------------------ шапка */

.s-res-head { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
.s-res-title { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); min-width: 0; }
.s-res-title .pl-h1 { min-width: 0; overflow-wrap: anywhere; }
.s-res-tags { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.s-res-tags span { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--radius-full); background: var(--surface-raised); font-size: 12.5px; color: var(--ink-muted); }
.s-res-fail-act { display: block; margin-top: var(--space-2); }

/* ------------------------------------------------------------ итоговый блок: две половины */

.s-res-ov { display: flex; flex-wrap: wrap; padding: 0; overflow: hidden; }

.s-res-vis { flex: 1 1 400px; min-width: 0; display: flex; flex-direction: column; gap: var(--space-5); padding: var(--space-6) var(--space-8) var(--space-6) var(--space-6); }
.s-res-top { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-3); }
.s-res-count { font-size: 12.5px; }
.s-res-ringrow { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-6) var(--space-8); }

/* кольцо 168: трек — «нет в топ-100», сегменты по часовой от 12 часов */
.s-res-ring { position: relative; flex: 0 0 168px; width: 168px; height: 168px; }
.s-res-ring svg { display: block; transform: rotate(-90deg); }
.s-res-ring circle { fill: none; stroke-width: 14; }
.s-res-ring .s-ring-seg { stroke-linecap: round; }
.s-ring-track { stroke: var(--line); }
.s-ring-t10 { stroke: var(--t10); }
.s-ring-t50 { stroke: color-mix(in oklch, var(--t10) 50%, var(--surface-raised)); }
.s-ring-t100 { stroke: color-mix(in oklch, var(--t100) 45%, var(--surface-raised)); }
.s-res-ring-mid { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; }
.s-res-ring-mid b { font-size: 38px; line-height: 42px; font-weight: 600; letter-spacing: -0.03em; }
.s-res-ring-mid span { font-size: 12.5px; }

.s-res-sum { flex: 1 1 180px; min-width: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.s-res-big { display: flex; flex-direction: column; gap: 2px; }
.s-res-big b { font-size: 22px; line-height: 28px; font-weight: 600; letter-spacing: -0.01em; }
.s-res-big span { font-size: 12.5px; line-height: 18px; }
/* ТОП-1 и ТОП-5 — сверх макета, тихой строкой под «X из Y» */
.s-res-tops { display: flex; flex-wrap: wrap; gap: 2px var(--space-4); margin-top: calc(-1 * var(--space-1)); font-size: 12.5px; line-height: 18px; }
.s-res-tops b { color: var(--ink); font-weight: 600; }
.s-res-legend { display: flex; flex-direction: column; gap: var(--space-2); padding-top: var(--space-3); border-top: 1px solid var(--line); }
.s-res-lg { display: flex; align-items: center; gap: var(--space-2); font-size: 13px; line-height: 18px; }
.s-res-lg i { flex: 0 0 10px; height: 10px; border-radius: 3px; }
.s-res-lg span { flex: 1 1 auto; }
.s-res-lg b { font-weight: 600; }
/* «не удалось» — вне процента, отбита пунктиром */
.s-res-lg-fail { padding-top: var(--space-2); border-top: 1px dashed var(--line); }
.s-res-note { margin: 0; font-size: 12.5px; line-height: 18px; }

/* правая половина; разделитель — тень: рядом вертикальный, при переносе горизонтальный */
.s-res-eng { flex: 1.5 1 480px; min-width: 0; display: flex; flex-direction: column; padding: var(--space-6) var(--space-6) var(--space-3) var(--space-8); box-shadow: -1px 0 0 var(--line), 0 -1px 0 var(--line); }
.s-res-eng-title { padding-bottom: var(--space-3); }
.s-res-cols { display: flex; align-items: center; gap: var(--space-4); padding-bottom: var(--space-2); font-size: 12px; }
.s-res-cols span:nth-child(1) { flex: 0 0 136px; }
.s-res-cols span:nth-child(2) { flex: 0 0 76px; }
.s-res-cols span:nth-child(3) { flex: 0 0 64px; }
.s-res-cols span:nth-child(4) { flex: 1 1 200px; }
.s-res-erow { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); padding: var(--space-3) 0; border-top: 1px solid var(--line); }
.s-res-ename { flex: 0 0 136px; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.s-res-ename b { font-size: 14px; line-height: 20px; font-weight: 600; }
.s-res-ename span { font-size: 12px; line-height: 16px; }
.s-res-etop { flex: 0 0 76px; display: flex; align-items: baseline; gap: 4px; }
.s-res-etop b { font-size: 24px; line-height: 28px; font-weight: 600; letter-spacing: -0.02em; }
.s-res-etop span { font-size: 13px; }
.s-res-eavg { flex: 0 0 64px; font-size: 14px; font-weight: 600; }
.s-res-bar { flex: 1 1 200px; min-width: 0; display: flex; gap: 2px; height: 8px; border-radius: var(--radius-full); overflow: hidden; background: var(--surface-sunken); box-shadow: inset 0 0 0 1px var(--line); }
.s-res-bar i { display: block; }

@media (max-width: 860px) {
  .s-res-cols { display: none; }
}

/* ------------------------------------------------------------ позиции по запросам */

.s-res-q { display: flex; flex-direction: column; gap: var(--space-3); }
.s-res-qhead { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); }
.s-res-acts { display: flex; flex-wrap: wrap; gap: var(--space-2); }

.s-q { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }

/* таблица ≥ 1200 */
.s-qt .pl-table { table-layout: fixed; }
.s-qt .pl-table .s-qt-n { width: 48px; padding-left: var(--space-5); }
.s-qt .pl-table td.s-qt-n { font-size: 12px; }
.s-qt .pl-table .pl-c { width: 132px; }
.s-qt .pl-table .pl-q { padding-top: 10px; padding-bottom: 10px; }
.s-qt-q { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.s-qt-phrase { font-weight: 500; overflow-wrap: anywhere; }
.s-qt-url { display: block; max-width: 520px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--font-mono); font-size: 11.5px; line-height: 16px; color: var(--ink-muted); }
.s-qt-wait { font-size: 12px; line-height: 16px; }
.s-qt-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-5); padding: var(--space-3) var(--space-5); border-top: 1px solid var(--line); background: var(--surface-sunken); font-size: 12.5px; line-height: 18px; color: var(--ink-muted); }
.s-qt-keys { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-5); }
.s-qt-key { display: inline-flex; align-items: center; gap: var(--space-2); }
.s-qt-why { margin-left: auto; }

/* карточки < 1200 */
.s-qc { display: flex; flex-direction: column; gap: var(--space-2); }
.s-qc-card { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-4); }
.s-qc-head { display: flex; gap: var(--space-2); align-items: baseline; }
.s-qc-head span { flex: 0 0 20px; font-size: 12px; }
.s-qc-head b { min-width: 0; font-weight: 500; line-height: 20px; overflow-wrap: anywhere; }
.s-qc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
.s-qc-one .s-qc-grid { grid-template-columns: minmax(0, 1fr); }
.s-qc-cell { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px var(--space-2); min-height: 40px; padding: var(--space-2) var(--space-2) var(--space-2) var(--space-3); border-radius: var(--radius-md); background: var(--surface-sunken); }
.s-qc-name { font-size: 12.5px; line-height: 16px; }
.s-qc-url { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; color: var(--ink-muted); }
.s-qc-note { margin: 0; font-size: 12.5px; line-height: 18px; }

@media (max-width: 1199.98px) {
  .s-qt { display: none; }
}
@media (min-width: 1200px) {
  .s-qc, .s-qc-note { display: none; }
}