/* workbench.css —— 研究工作台样式(作用域 #workbench-root,前缀 wb-)
   不与旧页面全局选择器冲突;不覆盖 .plate/.navcol 等既有类。 */

#workbench-root { display: flex; gap: 10px; align-items: flex-start; height: 100%; min-height: 0; }
#workbench-root * { box-sizing: border-box; }

.wb-side { width: 230px; flex: 0 0 230px; display: flex; flex-direction: column; gap: 8px; min-height: 0; }
.wb-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 8px; min-height: 0; }

.wb-card { background: var(--panel, #0D1320); border: 1px solid #22364b; border-radius: 6px; padding: 10px 12px; }
.wb-card > h3 { margin: 0 0 8px; font-size: 12.5px; color: #7fd4ff; font-weight: 700; letter-spacing: .3px; }
.wb-card > h4 { margin: 10px 0 6px; font-size: 11.5px; color: #9fd8ff; font-weight: 600; }

.wb-proj { display: block; width: 100%; text-align: left; background: var(--panel, #0D1320);
  border: 1px solid #22364b; border-radius: 5px; color: #d6deea; padding: 7px 9px; margin-bottom: 6px;
  cursor: pointer; font-size: 12px; line-height: 1.45; }
.wb-proj:hover { border-color: #2f81c7; }
.wb-proj.cur { border-color: #4a90c2; background: #10243a; }
.wb-proj b { color: #ffd28a; }
.wb-proj .wb-sub { display: block; color: #8494a7; font-size: 10.5px; margin-top: 2px; }

.wb-tabs { display: flex; gap: 4px; flex-wrap: wrap; }
.wb-tab { background: #0e1a27; border: 1px solid #22364b; border-radius: 5px 5px 0 0; color: #9fb4c8;
  padding: 6px 13px; font-size: 12px; cursor: pointer; border-bottom: none; }
.wb-tab:hover { color: #d6deea; }
.wb-tab.cur { background: #14304c; color: #fff; border-color: #2f81c7; font-weight: 600; }
.wb-tab[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }

.wb-body { background: var(--panel, #0D1320); border: 1px solid #22364b; border-radius: 0 6px 6px 6px;
  padding: 12px; flex: 1 1 auto; min-height: 0; overflow: auto; }

.wb-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.wb-form label { display: flex; flex-direction: column; font-size: 10.5px; color: #8494a7; gap: 3px; }
.wb-form input, .wb-form select, .wb-form textarea {
  background: #0a0f17; border: 1px solid #23405a; border-radius: 4px; color: #d6deea;
  padding: 5px 8px; font-size: 12px; font-family: inherit; min-width: 120px; }
.wb-form textarea { min-height: 62px; width: 100%; min-width: 0; }
.wb-form .wb-wide { flex: 1 1 100%; }

.wb-btn { background: #1d4e79; color: #fff; border: 1px solid #2f81c7; border-radius: 5px;
  padding: 6px 13px; font-size: 12px; cursor: pointer; }
.wb-btn:hover { background: #25609a; }
.wb-btn.ghost { background: transparent; color: #9fd8ff; }
.wb-btn.warn { background: #6d2f2f; border-color: #a04a4a; }
.wb-btn:disabled { opacity: .45; cursor: not-allowed; }

.wb-kv { display: flex; flex-wrap: wrap; gap: 7px; margin: 6px 0; }
.wb-kv span { background: #0a0f17; border: 1px solid #23405a; border-radius: 4px; padding: 3px 8px;
  font-size: 11px; color: #9fd8ff; }
.wb-kv span b { color: #ffd28a; }
.wb-kv span.ok { border-color: #2f6d43; color: #5bd487; }
.wb-kv span.warn { border-color: #7a6a2f; color: #ffd28a; }
.wb-kv span.bad { border-color: #7a2f2f; color: #ff9d9d; }

.wb-table { width: 100%; border-collapse: collapse; font-size: 11.5px; margin-top: 6px; }
.wb-table th { text-align: left; color: #7fd4ff; border-bottom: 1px solid #23405a; padding: 4px 6px;
  position: sticky; top: 0; background: #0b1420; }
.wb-table td { border-bottom: 1px solid #12212f; padding: 4px 6px; color: #d6deea; vertical-align: top; }
.wb-table tr.sel td { background: #14304c; }
.wb-scroll { max-height: 340px; overflow: auto; border: 1px solid #16222f; border-radius: 4px; }

.wb-badge { display: inline-block; border-radius: 3px; padding: 1px 6px; font-size: 10.5px; border: 1px solid #23405a; color: #9fb4c8; }
.wb-badge.passed { border-color: #2f6d43; color: #5bd487; }
.wb-badge.warning { border-color: #7a6a2f; color: #ffd28a; }
.wb-badge.failed { border-color: #7a2f2f; color: #ff9d9d; }
.wb-badge.not_applicable, .wb-badge.unknown, .wb-badge.not_checked { border-color: #3a4a5a; color: #8494a7; }
.wb-badge.legacy { border-color: #6a4a2f; color: #d8a86a; }

.wb-drawer { position: fixed; top: 0; right: 0; width: min(430px, 92vw); height: 100vh;
  background: #0b1420; border-left: 1px solid #2f81c7; z-index: 60; padding: 14px; overflow: auto; }
.wb-drawer h3 { margin: 0 0 10px; font-size: 13px; color: #7fd4ff; }
.wb-drawer-mask { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 55; }

.wb-empty { color: #6b7c8d; font-size: 11.5px; padding: 10px 0; }
.wb-err { color: #ff9d9d; font-size: 11.5px; }
.wb-note { color: #8494a7; font-size: 11px; line-height: 1.6; }
.wb-mono { font-family: ui-monospace, Consolas, monospace; font-size: 10.5px; color: #9fb4c8; word-break: break-all; }
.wb-chart { background: #0a0f17; border: 1px solid #23405a; border-radius: 4px; margin-top: 6px; }

@media (max-width: 1100px) {
  #workbench-root { flex-direction: column; }
  .wb-side { width: 100%; flex: 1 1 auto; }
}
@media (max-width: 640px) {
  .wb-tabs { overflow-x: auto; flex-wrap: nowrap; }
  .wb-tab { white-space: nowrap; }
  .wb-drawer { width: 100vw; }
  .wb-form input, .wb-form select { min-width: 92px; }
}

/* 作品视图：列表与证据各自滚动，外层不随项目数量增长。 */
body.workbench-mode { height: 100dvh; overflow: hidden; }
body.workbench-mode #app { height: 100dvh; display: flex; flex-direction: column; }
body.workbench-mode .topbar, body.workbench-mode .blind { flex-shrink: 0; }
body.workbench-mode .frame { flex: 1; min-height: 0; height: 0; grid-template-columns: 180px minmax(0, 1fr); }
body.workbench-mode .railL { height: 100%; min-height: 0; top: auto; padding: 12px; overflow-y: auto; }
body.workbench-mode .navcol { width: 100%; min-width: 0; }
body.workbench-mode .navcol a { white-space: nowrap; }
body.workbench-mode .stream-wrap, body.workbench-mode .side, body.workbench-mode .deckfoot { display: none; }
body.workbench-mode #view { height: 100%; min-height: 0; padding: 12px; overflow: hidden; }
body.workbench-mode #workbench-root { height: 100%; align-items: stretch; overflow: hidden; }
body.workbench-mode .wb-side { height: 100%; overflow: auto; overscroll-behavior: contain; }
body.workbench-mode .wb-main { height: 100%; overflow: hidden; }
body.workbench-mode .wb-project-card { display: flex; flex-direction: column; flex: 1; min-height: 120px; overflow: hidden; }
#wb-projects { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
#wb-projects .wb-proj[hidden] { display: none; }
.wb-search { width: 100%; min-width: 0; margin: 0 0 8px; background: #0a0f17; color: #d6deea; border: 1px solid #23405a; border-radius: 4px; padding: 7px; }
.wb-cap-card { flex-shrink: 0; max-height: 150px; overflow: auto; }
.wb-cap-card summary, .wb-logic summary { color: #7fd4ff; cursor: pointer; font-weight: 600; }
.wb-logic { border-bottom: 1px solid #23405a; padding-bottom: 12px; margin-bottom: 14px; font-size: 12px; line-height: 1.7; }
.wb-logic p { margin: 8px 0; }
.wb-logic ol { padding-left: 22px; }
.wb-body { overscroll-behavior: contain; scrollbar-gutter: stable; }
.wb-main > .wb-card, .wb-tabs { flex-shrink: 0; }
@media (min-width: 761px) and (max-width: 1100px) {
  body.workbench-mode #workbench-root { flex-direction: row; }
  body.workbench-mode .wb-side { width: 210px; flex: 0 0 210px; }
}
@media (max-width: 760px) {
  body.workbench-mode .frame { display: flex; flex-direction: column; }
  body.workbench-mode .railL { flex: 0 0 auto; height: auto; padding: 4px 8px; }
  body.workbench-mode .navcol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; }
  body.workbench-mode .navcol a { padding: 7px 4px; font-size: 11px; gap: 0; justify-content: center; }
  body.workbench-mode .navcol .k, body.workbench-mode .navcol .foot, body.workbench-mode .blind { display: none; }
  body.workbench-mode .topbar .chip { display: none; }
  body.workbench-mode #view { flex: 1; height: 0; padding: 8px; }
  body.workbench-mode #workbench-root { flex-direction: column; }
  body.workbench-mode .wb-side { width: 100%; flex: 0 0 185px; height: 185px; gap: 4px; }
  body.workbench-mode .wb-side > .wb-card { padding: 6px 8px; }
  body.workbench-mode .wb-cap-card { display: none; }
  body.workbench-mode .wb-side > .wb-card:nth-child(2) h3 { display: none; }
  body.workbench-mode .wb-main { flex: 1; height: 0; }
  body.workbench-mode .wb-kv { gap: 3px; }
  body.workbench-mode .wb-kv span { font-size: 10px; padding: 2px 4px; }
  body.workbench-mode .wb-kv .wb-mono { display: none; }
  body.workbench-mode .wb-tab { padding: 7px 9px; }
  body.workbench-mode .wb-form label { max-width: 100%; }
}
