.quality-row { display: flex; flex-direction: column; gap: 7px; width: 100%; padding: 16px 20px; text-align: left; border: 0; border-bottom: 1px solid var(--border); background: white; cursor: pointer; font: inherit; }
.quality-row:hover, .quality-row.selected { background: #EEF2FF; }
.quality-row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.quality-row small { color: var(--muted); }
#quality-panel { overflow-y: auto; }
#view-quality.active { height: 100vh; overflow: hidden; }
#view-quality .app-layout, #view-quality .cw { overflow: hidden; min-height: 0; }
#quality-panel > .aphdr { position: sticky; top: 0; z-index: 2; background: #fff; flex-shrink: 0; }
#quality-panel .chat-list { max-height: none; overflow-y: visible; }
.quality-chat-title { padding: 9px 12px; font-size: 13px; font-weight: 600; color: var(--sec); }
.quality-filters { display: flex; flex-direction: column; gap: 7px; padding: 0 6px 12px; }
.quality-filters label, .quality-filter-label { font-size: 12px; font-weight: 600; margin-top: 4px; }
.quality-reply-range { display: flex; align-items: center; gap: 8px; }
.quality-reply-range input { min-width: 0; }
#quality-filter-error { color: var(--red); }
.quality-agent-picker { position: relative; }
.quality-agent-menu { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 10; max-height: 240px; overflow-y: auto; padding: 5px; background: #fff; border: 1px solid var(--border); border-radius: 9px; box-shadow: 0 8px 24px #1c234022; }
.quality-agent-menu button { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 0; background: transparent; border-radius: 5px; padding: 10px 11px; font: inherit; font-size: 13px; text-align: left; cursor: pointer; color: var(--text); }
.quality-agent-menu button:hover, .quality-agent-menu button.keyboard-active { background: #EEF2FF; }
.quality-agent-menu button[aria-selected="true"] { color: var(--accent); font-weight: 600; background: #F4F6FF; }
.quality-agent-menu small, .quality-agent-empty { font-size: 12px; color: var(--sec); }
.quality-agent-empty { padding: 12px; }
.quality-segments { display: flex; gap: 3px; padding: 3px; background: #E3E7F1; border-radius: 7px; }
.quality-segments button { flex: 1; border: 0; border-radius: 5px; padding: 8px 6px; background: transparent; font: inherit; font-size: 12px; color: var(--sec); cursor: pointer; }
.quality-segments button[aria-pressed="true"] { background: #fff; color: var(--text); box-shadow: 0 1px 3px #1c234014; font-weight: 600; }
.quality-segments button:disabled { opacity: .5; cursor: default; }
.quality-segments button:focus-visible { outline: 2px solid var(--accent); }
.quality-direction-options { display: flex; flex-wrap: wrap; gap: 5px; }
.quality-direction-options button { padding: 6px 9px; border: 1px solid var(--border); border-radius: 6px; font: inherit; font-size: 12px; background: #fff; color: var(--sec); cursor: pointer; }
.quality-direction-options button[aria-pressed="true"] { border-color: var(--accent); background: #EEF2FF; color: var(--accent); font-weight: 600; }
.quality-direction-options button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.quality-timing-title { font-size: 13px; font-weight: 600; color: var(--sec); margin-bottom: 10px; }
.quality-timing-row { padding: 12px 0; border-top: 1px solid var(--border); }
.quality-timing-agent { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: baseline; font-size: 13px; }
.quality-timing-agent span { color: var(--sec); font-size: 12px; }
.quality-timing-metrics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin-top: 10px; }
.quality-timing-metrics > div { display: flex; flex-direction: column; gap: 4px; }
.quality-timing-metrics span, .quality-timing-metrics small { font-size: 11px; color: var(--sec); }
.quality-timing-metrics b { font-size: 14px; }
.quality-timing-notes { margin-top: 8px; color: #96600B; font-size: 11px; }
.quality-reply-gap { margin-top: 10px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 7px; }
.quality-gap-heading { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; font-size: 13px; margin-bottom: 5px; }
.quality-gap-warning { border-color: #F3B9B9; background: #FFF5F5; }
.quality-gap-warning .quality-gap-heading b, .quality-gap-label { color: #B42318; }
.quality-gap-label { font-size: 11px; margin-top: 6px; font-weight: 600; }
.quality-dialog-layout { display: grid; grid-template-columns: minmax(0,1fr) 290px; align-items: start; }
.quality-dialog-messages { min-width: 0; }
.quality-dialog-timings { position: sticky; top: var(--quality-header-height,140px); max-height: calc(100vh - 50px - var(--quality-header-height,140px)); overflow-y: auto; border-left: 1px solid var(--border); background: #FAFBFE; }
.quality-dialog-timings .apblock { padding: 14px; }
.quality-dialog-timings .quality-timing-agent { flex-direction: column; gap: 4px; }
.quality-dialog-timings .quality-timing-metrics { grid-template-columns: 1fr; gap: 12px; }
.quality-dialog-timings .quality-gap-heading { flex-direction: column; }
.quality-dialog-timings .quality-reply-gap .note { font-size: 11px; }
.quality-activity-row { padding: 12px 0; border-top: 1px solid var(--border); font-size: 13px; }
.quality-activity-row > strong { display: block; margin-bottom: 7px; }
.quality-activity-reply { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; }
.quality-activity-reply span { color: var(--sec); }
.quality-activity-extra { margin-top: 5px; color: var(--sec); font-size: 11px; line-height: 1.5; }
.quality-activity-gap { margin-top: 9px; padding: 8px 9px; border-radius: 5px; background: #EEF1F8; font-size: 11px; }
.quality-activity-gap b { display: block; font-size: 13px; margin-top: 3px; }
.quality-activity-gap.is-long { color: #B42318; background: #FFF0F0; }
.quality-chat-image { display: block; max-width: 320px; margin: 6px 0; border: 1px solid var(--border); border-radius: 7px; overflow: hidden; background: #fff; color: var(--accent); text-decoration: none; white-space: normal; }
.quality-chat-image img { display: block; max-width: 100%; max-height: 240px; object-fit: contain; margin: auto; }
.quality-chat-image span { display: block; padding: 8px 10px; font-size: 12px; }
.quality-chat-image:hover { border-color: var(--accent); }
.quality-chat-image:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.quality-chat-image.is-unavailable::before { content: 'Изображение не загрузилось'; display: block; padding: 12px 10px 0; font-size: 12px; color: var(--sec); }
.quality-repeat-badge { display: inline-block; margin-left: 6px; padding: 3px 7px; border-radius: 5px; color: #8A5500; background: #FFF0CF; font-size: 11px; }
.quality-history { border-top: 1px solid var(--border); }
.quality-history-item { display: flex; flex-direction: column; gap: 5px; width: 100%; text-align: left; margin-top: 8px; padding: 10px; border: 1px solid var(--border); border-radius: 6px; background: #fff; font: inherit; cursor: pointer; }
.quality-history-item strong { font-size: 12px; font-weight: 600; }
.quality-history-item span { font-size: 11px; color: var(--sec); }
.quality-history-item small { color: #8A5500; font-size: 11px; }
.quality-history-item:hover { border-color: var(--accent); background: #F5F7FF; }
.quality-history-item:focus-visible { outline: 2px solid var(--accent); }
.quality-history-pages { display: flex; gap: 6px; justify-content: space-between; align-items: center; margin-top: 12px; font-size: 11px; color: var(--sec); }
.quality-history-pages button { padding: 6px 8px; font-size: 11px; }
#quality-panel > .quality-card-header { background: #F5F7FD; border-bottom: 2px solid #DCE3F2; box-shadow: 0 2px 6px #1C234008; }
.quality-source-line { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; }
.quality-source-tag { display: inline-flex; align-items: center; gap: 7px; padding: 6px 9px; border-radius: 6px; font-size: 12px; font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.quality-source-tag svg { width: 16px; height: 16px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.quality-source-tag.from-telegram { background: #DDF1FA; color: #126482; }
.quality-source-tag.from-site { background: #E4E9FE; color: #354DA8; }
.quality-product-tag { padding: 5px 8px; border: 1px solid #D5DDED; border-radius: 5px; background: #fff; color: #4A5874; font-size: 11px; font-weight: 600; }
@media (max-width: 1000px) {
  .quality-dialog-layout { grid-template-columns: minmax(0,1fr); }
  .quality-dialog-timings { position: static; max-height: none; border-left: 0; border-top: 1px solid var(--border); }
}
.quality-reply-range input { appearance: textfield; -moz-appearance: textfield; }
.quality-reply-range input::-webkit-inner-spin-button, .quality-reply-range input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

#quality-period .date-btn { width:100%; justify-content:space-between; }
#quality-topics[hidden] { display:none; }
#quality-topics .quality-filter-label { display:block; margin-bottom:8px; }
.quality-topic-picker { position:relative; }
.quality-topic-picker summary { cursor:pointer; list-style:none; overflow-wrap:anywhere; }
.quality-topic-picker summary::-webkit-details-marker { display:none; }
.quality-topic-picker[open] summary { border-color:var(--accent,#4e63ff); }
.quality-topic-popup { position:absolute; z-index:30; top:calc(100% + 6px); left:0; right:0; padding:10px; background:white; border:1px solid #dce2ef; border-radius:12px; box-shadow:0 12px 30px #26345424; }
.quality-topic-popup input { width:100%; margin-bottom:8px; }
.quality-topic-options { max-height:300px; overflow-y:auto; }
.quality-topic-options button { display:block; width:100%; text-align:left; border:0; border-radius:7px; background:transparent; color:inherit; padding:9px 12px; font:inherit; cursor:pointer; overflow-wrap:anywhere; }
.quality-topic-options button[hidden] { display:none; }
.quality-topic-options button:hover,.quality-topic-options button:focus-visible { background:#f0f3fa; }
.quality-topic-options button[aria-pressed="true"] { background:#eef0ff; color:#465cff; }
.quality-topic-branch { color:#94a3b8; }
.quality-topic-options .quality-topic-folder { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.quality-topic-folder small { color:var(--muted); font-size:11px; flex-shrink:0; }
.quality-topic-location { padding:8px 12px; font-size:12px; color:var(--muted); overflow-wrap:anywhere; }
.quality-topic-options .quality-topic-back { color:var(--accent); font-size:12px; }
.quality-review-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.quality-review-meta { color:var(--muted); font-size:12px; margin-top:8px; overflow-wrap:anywhere; }
.quality-review-badge { display:inline-block; width:fit-content; padding:3px 7px; border-radius:5px; font-size:11px; color:#586780; background:#edf0f5; }
.quality-review-badge.checked { color:#18633e; background:#e3f3e9; }
.quality-review-badge.unsuitable { color:#725324; background:#fff1d9; }
#quality-skip-reason:not([hidden]) { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
#quality-review-note { flex:1; min-width:180px; }
.quality-card-header { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); align-items:start; gap:24px; }
.quality-header-details { min-width:0; flex:1; }
#quality-review { min-width:0; }
.quality-header-side { min-width:0; }
.quality-header-side.has-page { border-left:1px solid #D5DDED; padding-left:24px; }
.quality-header-side.has-page #quality-review { margin-top:14px; }
.quality-review-actions { justify-content:flex-end; margin-top:0; }
.quality-review-meta,#quality-viewing { text-align:right; }
.quality-viewer { font-size:12px; color:#6850a5; }
.quality-viewer:empty { display:none; }
#quality-viewing { margin-bottom:8px; }
.quality-random-action { padding:0 6px 14px; }
#quality-random { width:100%; }
#quality-panel { container-type:inline-size; }
@container(max-width:640px) {
 .quality-card-header { grid-template-columns:minmax(0,1fr); gap:14px; }
 .quality-header-side.has-page { border-left:0; border-top:1px solid #D5DDED; padding:14px 0 0; }
}
.quality-connection { margin:0 6px 12px; padding:10px; border-radius:6px; background:#fff1d9; color:#725324; font-size:12px; }
.quality-connection[hidden] { display:none; }
.quality-topic-popup { position:fixed; right:auto; overflow-y:auto; }
.quality-start { display:flex; min-height:100%; align-items:center; justify-content:center; padding:32px; }
.quality-start-content { max-width:420px; text-align:center; }
.quality-start h2 { font-size:22px; margin:0 0 12px; }
.quality-start p { color:var(--sec); font-size:14px; line-height:1.6; margin:0 0 22px; }
.quality-start #quality-random { width:auto; min-height:44px; padding:10px 24px; background:var(--accent); color:white; border-color:var(--accent); }
.quality-start #quality-random:disabled { opacity:.55; }
.quality-start .quality-start-hint { margin:12px 0 0; font-size:12px; }

.quality-first-page { min-width:0; }
.quality-page-label { color:var(--sec); font-size:12px; margin-bottom:6px; }
.quality-page-time { margin-top:7px; font-size:11px; }
.quality-page-title { font-size:13px; font-weight:600; margin-top:3px; overflow-wrap:anywhere; }
.quality-page-url { display:inline; font-size:13px; margin-top:3px; white-space:normal; overflow-wrap:anywhere; word-break:break-word; }

.quality-day-summary { font-size:12px; font-weight:600; color:var(--accent); }
.quality-day-heading { font-size:13px; font-weight:600; margin-top:7px; }
.quality-reading-chat { color:var(--accent); font-weight:600; margin-top:5px; }
.quality-review-target { color:var(--text); font-size:12px; font-weight:600; text-align:right; margin-bottom:7px; }
.quality-day-chat + .quality-day-chat { border-top:3px solid #DCE3F2; }
.quality-day-divider { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); align-items:start; gap:16px; padding:15px 16px; background:#F5F7FD; border-bottom:1px solid var(--border); }
.quality-day-divider strong { font-size:13px; }
.quality-day-links { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin-top:8px; }
.quality-day-links .aplinks { margin-top:0; }
.quality-day-source-details { min-width:0; }
.quality-day-page { min-width:0; border-left:1px solid #D5DDED; padding-left:16px; }
.quality-review-scope { font-size:11px; color:var(--sec); text-align:right; margin-bottom:8px; }
.quality-day-transcript { padding-bottom:clamp(180px,35vh,420px); }
.quality-day-links .btn-sec { font-size:11px; padding:5px 8px; }
.quality-current-chat-label { padding:12px 14px; font-size:12px; font-weight:600; color:var(--accent); border-bottom:1px solid var(--border); }
.chat-msg.agent.quality-selected-agent { background:#EBE7FF; border-left:3px solid #8E75E8; }
@container(max-width:640px) {
 .quality-day-divider { grid-template-columns:minmax(0,1fr); }
 .quality-day-page { border-left:0; border-top:1px solid #D5DDED; padding:12px 0 0; }
 .quality-day-links { align-items:flex-start; }
}

.quality-day-update { color:#725324; background:#fff1d9; padding:9px; font-size:12px; border-radius:6px; margin-top:10px; }
.quality-day-update[hidden] { display:none; }
