/* Screen tab result styles. The shell (toolbar, rail, status bar) is one design for every tab
   and lives in app.css; nothing here restyles it. */
  border: 2px solid var(--ink); background: var(--accent); color: var(--ink);
  box-shadow: 3px 3px 0 var(--ink); transition: transform .12s, box-shadow .12s;
}
.tab-screen .out { display: flex; flex-direction: column; gap: 20px; }
.tab-screen .screen-verdict { border-width: 2px; padding: 20px 22px; border-radius: 12px; }
.screen-caption { font-size: 12px; font-weight: 600; margin-bottom: 8px; }
.screen-verdict .lead { gap: 10px; }
.screen-verdict .lead h2 { margin: 0; font-size: clamp(18px, 1.7vw, 24px); line-height: 1.3; }
.screen-verdict .why { margin-top: 10px; }
.screen-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 20px; align-items: start; }
.screen-evidence,.screen-context { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.tab-screen .panel { border: 2px solid var(--border-strong); border-radius: 12px; }
.tab-screen .panel-head { min-height: 52px; padding: 12px 16px; gap: 12px; }
.tab-screen .panel-title { font: 700 14px var(--font); text-transform: none; letter-spacing: 0; color: var(--ink); }
.tab-screen .panel-body { padding: 16px; }
.tab-screen .screen-sources > .panel-body { padding: 0; }
.tab-screen .vm { list-style: none; margin: 0; padding: 0; }
.tab-screen .vm-cell {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 16px;
  padding: 14px 16px; min-width: 0; border-bottom: 1px solid var(--line);
}
.tab-screen .vm-cell:last-child { border-bottom: 0; border-radius: 0 0 10px 10px; }
.tab-screen .vm-hit { background: #fff7f7; }
.vm-identity { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
.vm-identity > svg { margin-top: 3px; width: 18px; height: 18px; }
.vm-name { font-weight: 700; font-size: 13px; min-width: 0; overflow-wrap: break-word; }
.vm-result { display: flex; align-items: flex-start; justify-content: flex-end; }
.vm-detail { grid-column: 1 / -1; padding-left: 28px; font-size: 12px; color: var(--dim); }
.vm-links { grid-column: 1 / -1; padding-left: 28px; }
.tab-screen .sev { font-family: var(--font); font-size: 11px; text-transform: none; letter-spacing: 0; padding: 3px 8px; }
.screen-context .statrow { grid-template-columns: repeat(2, minmax(0, 1fr)); border: 0; border-radius: 0; }
.screen-context .stat { padding: 0 12px 12px 0; border: 0; }
.screen-context .stat .k { font-size: 12px; text-transform: none; letter-spacing: 0; }
.screen-context .stat .v { font-size: 16px; }
.screen-context .panel-actions { flex: 1 1 100%; gap: 10px; }
.screen-context .panel-actions .btn { min-height: 36px; }
.tab-screen .tblwrap { border: 0; border-radius: 0; }
.tab-screen .tblwrap table { min-width: 560px; }
.tab-screen .tblwrap th:first-child,
.tab-screen .tblwrap td:first-child { position: sticky; left: 0; background: var(--panel); z-index: 1; }
.tab-screen .tblwrap th:first-child { z-index: 3; }
.tab-screen .tblwrap tr.hit td:first-child { background: var(--critbg); }
@media (max-width: 1180px) {
  .screen-layout { grid-template-columns: minmax(0, 1fr) 260px; gap: 16px; }
}
@media (max-width: 1023px) {
  .screen-layout { grid-template-columns: minmax(0, 1fr); }
  .screen-context { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
}
@media (max-width: 700px) {
  .tab-screen .out,.screen-evidence,.screen-context { gap: 14px; }
  .tab-screen .screen-verdict { padding: 16px; }
  .screen-verdict .lead h2 { flex: 1 1 100%; }
  .screen-context { display: flex; }
  .tab-screen .vm-cell { gap: 8px; padding: 14px 12px; }
  .vm-identity { gap: 8px; }
  .vm-detail,.vm-links { padding-left: 26px; }
  .tab-screen .btn { min-height: 44px; }
  .tab-screen .panel-actions { gap: 12px; }
  .tab-screen .vm-links .srclink { display: inline-flex; min-height: 44px; align-items: center; }
}
@media (max-width: 400px) {
  .tab-screen .vm-cell { grid-template-columns: minmax(0, 1fr); }
  .vm-result { padding-left: 26px; justify-content: flex-start; }
}

