.wb-navigation-status { position: fixed; inset: 0 0 auto; z-index: 200; padding: 6px 12px; background: var(--surface); color: var(--primary-dark); border-bottom: 1px solid var(--line); text-align: center; font-size: 0.85rem; }
.wb-navigating, .wb-navigating a { cursor: progress; }
.wb-nav-item[data-navigating] { background: var(--primary-soft); color: var(--primary-dark); }
/* Shared operating surface: one workflow, one control vocabulary, no remote assets. */
:root { --side-w: 238px; --control-line: #b9cad2; }
html { scroll-padding-top: 92px; }
.wb-side { padding: 14px 12px; gap: 8px; }
.wb-side > .wb-nav { overflow-y: auto; overscroll-behavior: contain; min-height: 0; flex: 1; margin-top: 0; padding: 0 4px 10px; }
.wb-nav-group { margin: 0 0 14px; }
.wb-nav-group h2, .wb-nav-advanced > summary { font-size: .75rem; font-weight: 650; color: var(--muted); letter-spacing: 0; padding: 8px 12px 5px; }
.wb-nav-item { min-height: 40px; font-size: .9rem; border-radius: 7px; }
.wb-nav-advanced { border-top: 1px solid var(--line); padding-top: 8px; }
.wb-nav-advanced > summary { min-height: 44px; cursor: pointer; font-size: .86rem; padding-top: 12px; }
.wb-nav-advanced[open] > summary { margin-bottom: 4px; }
.wb-side-foot { margin: 0; padding: 8px 12px 0; border-top: 1px solid var(--line); }
.wb-top { background: var(--bg); backdrop-filter: none; -webkit-backdrop-filter: none; }
.wb-project { flex: 1; max-width: 720px; }
.wb-project .wb-select-shell { min-width: 0; max-width: 100%; }
.wb-project select { min-width: 0; width: 100%; text-overflow: ellipsis; }
.wb-top-right { flex-shrink: 0; }
.wb-page-head { padding: 2px 0 4px; }
.wb-lede { max-width: 78ch; line-height: 1.65; }
.wb-page-jumps { display: flex; gap: 8px; flex-wrap: wrap; }
.wb-card-head p { line-height: 1.6; max-width: 90ch; }
.wb-field > span, .wb-field > label { line-height: 1.45; }
.wb-input, .wb-select-plain, .wb-select-shell { border-color: var(--control-line); }
.wb-input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
.wb-btn:active:not(:disabled) { background-image: none; filter: brightness(.96); }
.wb-btn:disabled { opacity: 1; background: var(--neutral-soft); border-color: var(--line); color: #69777d; }
.wb-btn, .wb-file-link, .wb-nav-item { touch-action: manipulation; }
summary { min-height: 38px; }
.wb-empty { padding: 30px 24px; background: var(--surface-2); }
.wb-empty-hint { max-width: 60ch; margin: 8px auto 0; line-height: 1.7; }
.wb-empty .wb-btn { margin-top: 14px; }
.wb-card details > summary { cursor: pointer; }
.wb-mobile-nav-fallback, .wb-menu-trigger { display: none; }
.wb-menu-dialog { margin: 0; height: 100dvh; max-height: 100dvh; width: min(340px, 92vw); max-width: 100vw; padding: 16px 16px calc(20px + env(safe-area-inset-bottom)); border: 0; color: var(--ink); background: var(--surface); overflow-y: auto; }
.wb-menu-dialog::backdrop { background: rgba(23,38,46,.38); }
.wb-menu-dialog header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.wb-menu-project { margin: 4px 10px 12px; font-size: .82rem; color: var(--muted); overflow-wrap: anywhere; }
.wb-menu-dialog .wb-nav-item { min-height: 44px; }
.wb-menu-dialog .wb-nav { margin: 0; }
body.wb-menu-open { overflow: hidden; }
.wb-table-wrap[data-scrollable="true"] { position: relative; }
.wb-table-scroll-note { color: var(--muted); font-size: .78rem; padding: 8px 16px; background: var(--surface-2); border-bottom: 1px solid var(--line); }
.wb-filter-empty { padding: 20px; text-align: center; color: var(--muted); }
.wb-stage-scroll { max-height: 360px; }
#wb-stage-summary { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); align-items: start; gap: 12px; }
#wb-stage-summary > span { font-size: .82rem; line-height: 1.8; }
#wb-stage-summary > span > strong { display: block; color: var(--primary-dark); font-size: 1rem; }
#wb-stage-summary > .muted { grid-column: 1 / -1; }
#wb-flow-assignment { border: 1px solid var(--line); border-radius: 10px; padding: 16px; margin: 0; min-width: 0; }
#wb-flow-assignment legend { font-weight: 650; padding: 0 8px; }
#wb-flow-assignment:disabled { background: var(--surface-2); }
#wb-flow-assignment p { margin-top: 12px; line-height: 1.6; }
#wb-location-filters > summary { color: var(--primary-dark); font-size: .88rem; }
#wb-location-filters[open] > summary { margin-bottom: 12px; }
#wb-flow-summary { padding: 12px; background: var(--surface-2); border-radius: 8px; font-weight: 600; line-height: 1.7; }
#wb-flow-message { line-height: 1.7; }
#wb-existing-tools > summary { min-height: 52px; font-weight: 600; }
/* The input retains its original name/ISO value. Only the calendar UI is enhanced. */
.wb-date-control { display: inline-flex; position: relative; align-items: center; min-width: 0; width: 100%; }
.wb-date-control > .wb-input { width: 100%; min-width: 0; padding-right: 44px; font-variant-numeric: tabular-nums; }
.wb-date-trigger { position: absolute; inset: 1px 1px 1px auto; width: 42px; border: 0; border-radius: 6px; display: grid; place-items: center; color: var(--primary-dark); background: transparent; }
.wb-date-trigger:hover { background: var(--primary-soft); }
.wb-date-trigger svg { width: 19px; height: 19px; }
.wb-date-control > input[aria-invalid="true"] { border-color: var(--danger); }
.wb-date-popover { position: fixed; z-index: 100; width: 320px; max-width: calc(100vw - 24px); padding: 16px; border: 0; border-radius: 14px; box-shadow: 0 8px 34px rgba(23,38,46,.22); background: var(--surface); color: var(--ink); }
.wb-date-popover[hidden] { display: none; }
.wb-date-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 12px; }
.wb-date-head strong { font-size: 1rem; font-variant-numeric: tabular-nums; }
.wb-date-popover button { min-height: 40px; min-width: 36px; border: 0; background: transparent; border-radius: 7px; font-size: .88rem; }
.wb-date-popover button:hover:not(:disabled) { background: var(--primary-soft); color: var(--primary-dark); }
.wb-date-grid { display: block; }
.wb-date-week { display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 2px; }
.wb-date-grid [role=columnheader] { font-size: .75rem; text-align: center; padding: 5px 0 9px; color: var(--muted); }
.wb-date-grid button { font-variant-numeric: tabular-nums; padding: 0; }
.wb-date-grid .is-adjacent { color: var(--muted); }
.wb-date-grid button[aria-current=date] { text-decoration: underline; text-underline-offset: 5px; font-weight: 700; }
.wb-date-grid button[aria-selected=true], .wb-date-grid button[aria-selected=true]:hover { background: var(--primary); color: white; }
.wb-date-grid button:disabled { opacity: 1; color: #9ba7ad; background: var(--surface-2); }
.wb-date-actions { display: flex; gap: 6px; align-items: center; border-top: 1px solid var(--line); margin-top: 12px; padding-top: 10px; }
.wb-date-actions button { color: var(--primary-dark); flex: 1; }
.wb-date-help { font-size: .72rem; color: var(--muted); line-height: 1.6; margin-top: 8px; }
.wb-reassign .wb-date-control { width: 154px; flex: none; }
@media (min-width:761px) and (max-width:1050px) { :root { --side-w: 206px; } .wb-brand small { display: none; } .wb-top { padding-inline: 16px; } .wb-user .chip { display: none; } }
@media (max-width:760px) {
 .wb-menu-trigger:not([hidden]) { display: inline-flex; min-width: 44px; padding-inline: 10px; flex: none; }
 .wb-menu-trigger span { display: none; }
 .wb-mobile-nav-fallback { display: block; padding: 8px 16px; background: var(--surface); border-bottom: 1px solid var(--line); }
 .wb-mobile-nav-fallback summary { padding: 8px 0; cursor: pointer; }
 .wb-js .wb-mobile-nav-fallback { display: none; }
 .wb-top { gap: 6px; padding: calc(8px + env(safe-area-inset-top)) 10px 8px; }
 .wb-project { max-width: none; }
 .wb-project .wb-select-shell { width: 100%; }
 .wb-project .wb-select-shell > .wb-icon { display: none; }
 .wb-project select { padding-left: 10px; font-size: .82rem; }
 .wb-top-right { gap: 0; }
 .wb-user { display: none; }
 .wb-top-right .wb-btn { padding: 0 10px; }
 .wb-page-jumps .wb-btn { flex: 1; }
 .wb-main { padding-inline: 12px; }
 .wb-input, .wb-select-plain, .wb-select-shell select, textarea,
 .wb-field > .wb-input, .wb-field > .wb-select-plain { font-size: 16px; } /* 低于 16px 时 iOS 聚焦会放大页面；.wb-field 那条 0.95rem 更具体，要一并覆盖 */
 .wb-ledger td { white-space: normal; overflow-wrap: anywhere; }
 .wb-ledger td.wb-cell-chip { position: static; }
 .wb-ledger td.wb-cell-chip::before { display: block; }
 .wb-ledger td:is([data-label="说明"],[data-label="Description"]), .wb-ledger td:is([data-label="错误"],[data-label="Error"]), .wb-ledger td:is([data-label="原因"],[data-label="Reason"]), .wb-ledger td:is([data-label="目标"],[data-label="Target"]), .wb-ledger td[data-label="QA"] { min-width: 0; }
 .wb-date-popover { padding: 14px; }
 .wb-date-popover button { min-height: 42px; }
 .wb-reassign .wb-date-control { flex: 1 1 154px; width: auto; }
 #wb-stage-summary { grid-template-columns: 1fr; gap: 8px; }
 #wb-stage-summary > span > strong { display: inline; margin-right: 6px; }
 .wb-stage-scroll { max-height: 320px; }
 #wb-flow-assignment { padding: 12px; }
 .wb-form-actions { gap: 10px; }
 .wb-form-actions .wb-btn { flex: 1 1 auto; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } }
@media print { .wb-side, .wb-top, .wb-mobile-nav-fallback, .wb-menu-dialog, .wb-date-popover { display: none !important; } .wb-shell { display: block; } }

.wb-table th > .muted.small { display: block; margin-top: 3px; font-weight: 500; }

.wb-readback { min-width: 240px; max-width: 420px; white-space: normal !important; }
.wb-readback > p + p { margin-top: 6px; }
.wb-readback details { margin-top: 8px; }
@media(max-width:760px) { .wb-ledger .wb-readback { min-width: 0; max-width: none; } }

.wb-import-result { flex-basis: 100%; width: 100%; min-width: 0; overflow-wrap: anywhere; }
.wb-import-result .wb-table { table-layout: fixed; }
.wb-import-result td, .wb-table td:is([data-label="原表值"],[data-label="Source value"]) { white-space: normal; overflow-wrap: anywhere; max-width: 460px; }
.wb-source-hash { overflow-wrap: anywhere; font: .8rem/1.7 var(--mono); }
.wb-card-body > p + p { margin-top: 8px; }
@media(max-width:760px) { .wb-import-result .wb-table { table-layout: auto; } .wb-import-result .wb-ledger td { max-width: none; } }

.wb-stage-overview { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); padding: 20px; gap: 24px; }
.wb-stage-overview h2 { color: var(--primary-dark); font-size: 1rem; margin-bottom: 10px; }
.wb-stage-overview h2 span { display: block; margin-top: 6px; color: var(--ink); font-size: .85rem; font-weight: 500; }
.wb-stage-overview p { color: var(--muted); font-size: .8rem; line-height: 1.7; }
.wb-stage-overview strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.wb-stage-foot { padding: 12px 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: .8rem; }
.wb-import-result > details > ul { max-height: 420px; overflow-y: auto; padding: 12px 16px 12px 32px; margin: 8px 0 16px; background: var(--surface-2); border-radius: 8px; }
.wb-import-result li + li { margin-top: 10px; }
@media(max-width:760px) { .wb-stage-overview { grid-template-columns: 1fr; gap: 16px; padding: 16px; } .wb-stage-overview h2 span { display: inline; margin-left: 8px; } .wb-stage-overview h2 { margin-bottom: 6px; } .wb-stage-foot { padding: 12px 16px; line-height: 1.7; } }

.wb-password-control { position: relative; display: block; }
.wb-password-control .wb-input { width: 100%; padding-right: 64px; }
.wb-password-toggle { position: absolute; inset: 1px 1px 1px auto; min-width: 60px; border: 0; border-radius: 6px; background: transparent; color: var(--primary-dark); font-size: .82rem; }
.wb-password-toggle:hover { background: var(--primary-soft); }
.wb-auth-head h1 { margin-top: 12px; }
.wb-auth-head p { line-height: 1.65; }

.wb-release-blockers { flex-basis: 100%; min-width: 220px; max-width: 420px; white-space: normal; font-size: .8rem; }
.wb-release-blockers > summary { color: var(--danger); line-height: 1.6; padding-block: 8px; }
.wb-release-blockers ul { padding-left: 18px; line-height: 1.7; }
.wb-release-blockers p { margin-top: 10px; color: var(--muted); line-height: 1.6; }
.wb-release-blockers > div { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 8px; }
@media(max-width:760px) { .wb-release-blockers { min-width: 0; max-width: none; } .wb-release-blockers a { min-height: 44px; align-items: center; } }


.wb-report-preview { width:min(1200px,96vw);height:92dvh;max-width:96vw;max-height:96dvh;border:0;border-radius:12px;padding:16px;background:var(--surface);color:var(--ink); }
.wb-report-preview::backdrop { background:rgba(23,38,46,.5); }
.wb-report-preview[open] { display:flex;flex-direction:column;gap:12px; }
.wb-report-preview header { display:flex;align-items:center;gap:10px;flex-wrap:wrap; }
.wb-report-preview h2 { flex:1 1 200px;font-size:1rem;margin:0;overflow-wrap:anywhere; }
.wb-report-preview p { margin:0;color:var(--muted);font-size:.85rem; }
.wb-report-pages { flex:1;min-height:0;overflow:auto;background:var(--surface-2);padding:10px;overscroll-behavior:contain; }
.wb-report-pages img { display:block;width:100%;height:auto;margin:0 auto 16px; }
@media(max-width:600px) { .wb-report-preview { width:96vw;padding:12px; } .wb-report-preview header .wb-btn { flex:1; } }

/* Original images use the same authenticated, keyboard-accessible viewer as reports. */
.wb-file-status { font-size:.8rem; font-weight:400; }
a[aria-busy="true"] { cursor:progress; }
.wb-image-body { position:relative;flex:1;min-height:0;overflow:auto;display:flex;align-items:center;justify-content:center;background:var(--surface-2);overscroll-behavior:contain; }
.wb-image-body img { display:block;width:100%;height:100%;object-fit:contain;transition:filter .25s ease-out; }
.wb-image-body.is-actual { display:block; }
.wb-image-body.is-actual img { width:auto;height:auto;max-width:none;max-height:none;margin:auto; }
.wb-image-body.is-loading img { filter:blur(2px);transition:none; }   /* 先放的缩略图，原图到了换上（换上时由虚变清） */
.wb-image-body.is-loading.is-mid img { filter:none; }   /* 预览图先到了：已经清楚，不再虚（用户 11-09） */
/* 等原图时标在照片正中（不压左下角的水印）：转圈 + 正在加载原图 + 读了多少。等不到 0.4 秒的（已经读好）不出（用户 11-09，原先 0.15 秒） */
.wb-image-wait { position:absolute;left:50%;top:50%;display:flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:rgba(23,38,46,.78);color:#fff;font-size:.85rem;line-height:1.4;white-space:nowrap;pointer-events:none;transform:translate(-50%,-50%);opacity:0;animation:wb-wait-in .2s .4s forwards; }
.wb-image-body.is-mid .wb-image-wait { left:12px;top:12px;transform:none; }   /* 预览图已经清楚：挪到左上角，不挡照片、不压水印 */
.wb-image-wait i { flex:none;width:14px;height:14px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:wb-spin .8s linear infinite; }
.wb-image-wait b { font-weight:600;font-variant-numeric:tabular-nums; }
.wb-image-wait b:empty { display:none; }
@keyframes wb-wait-in { to { opacity:1; } }
@keyframes wb-spin { to { transform:rotate(360deg); } }
body:has(.wb-report-preview[open]) { overflow:hidden; }
/* 一组照片里看大图：标题旁写第几张，两边箭头翻上一张 / 下一张 */
.wb-image-count { color:var(--muted);font-size:.85rem;font-variant-numeric:tabular-nums;white-space:nowrap; }
.wb-image-nav { position:absolute;top:50%;z-index:1;width:44px;height:44px;margin-top:-22px;padding:0 0 3px;border:0;border-radius:50%;background:rgba(23,38,46,.55);color:#fff;font-size:30px;line-height:1;cursor:pointer; }
.wb-image-nav:hover { background:rgba(23,38,46,.78); }
.wb-image-nav:focus-visible { border-radius:50%; }
.wb-image-nav:disabled { visibility:hidden; }
.wb-image-nav.is-prev { left:24px; }
.wb-image-nav.is-next { right:24px; }
@media(max-width:600px) { .wb-image-nav.is-prev { left:18px; } .wb-image-nav.is-next { right:18px; } }
/* 触屏设备（含 761px 以上的平板）同样按 16px：iOS / iPadOS 对小于 16px 的输入框聚焦时会放大页面 */
@media (pointer:coarse) { .wb-input, .wb-select-plain, .wb-select-shell select, textarea, .wb-field > .wb-input, .wb-field > .wb-select-plain { font-size: 16px; } }
/* 手机和触屏上所有可点控件至少 44px 高（10-31 导航页面手机巡检：筛选栏的下拉框、搜索框、日期框、展开条偏矮） */
@media (max-width:760px), (pointer:coarse) { #wb-main select, #wb-main input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=file]):not(.np-file), #wb-main .wb-btn, #wb-main summary { min-height: 44px; } }
