:root {
  --ink: #1f3035;
  --muted: #728187;
  --muted-2: #9ca9ad;
  --canvas: #f4f7f6;
  --panel: #ffffff;
  --line: #e4ebea;
  --teal: #0e6570;
  --teal-deep: #0a4e57;
  --teal-soft: #e6f3f1;
  --amber: #d88c25;
  --amber-soft: #fff3df;
  --red: #d35f4e;
  --red-soft: #fff0ed;
  --blue: #4d77ab;
  --blue-soft: #eaf1fa;
  --shadow: 0 16px 40px rgba(27, 58, 64, 0.06);
  font-family: "Segoe UI", "Microsoft YaHei", "PingFang SC", "Noto Sans SC", Arial, sans-serif;
  color: var(--ink);
  background: var(--canvas);
}
.language-setting { display: flex; align-items: center; gap: 8px; font-size: 12px; flex-wrap: wrap; }
.language-setting select { max-width: 160px; padding: 7px; border: 1px solid #d7e4e1; border-radius: 4px; background: white; color: #1f3035; }
.login-card > .language-setting { margin-bottom: 16px; }
.workshop-rename { margin: 16px 0; display: flex; flex-wrap: wrap; align-items: end; gap: 10px; }
.workshop-rename label { display: grid; gap: 6px; flex: 1 1 200px; font-size: 12px; }
.workshop-rename input { width: 100%; min-width: 0; padding: 10px; border: 1px solid #d7e4e1; border-radius: 4px; }
.workshop-message { flex: 1 0 100%; font-size: 12px; }
@media (max-width: 520px) { .topbar-actions .language-setting > span { display: none; } .topbar-actions .language-setting select { max-width: 94px; } }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: var(--canvas); }
[hidden] { display: none !important; }
button { font: inherit; border: 0; cursor: pointer; }
button:focus-visible { outline: 3px solid rgba(14, 101, 112, .25); outline-offset: 2px; }
.app-shell { display: flex; min-height: 100vh; }
.login-screen { min-height: 100vh; padding: 34px clamp(20px, 5vw, 84px) 44px; background: #f4f7f6; }
.login-brand { display: flex; align-items: center; gap: 11px; max-width: 1180px; margin: 0 auto; }
.login-brand strong, .login-brand span { display: block; }
.login-brand strong { font-size: 15px; }
.login-brand span { margin-top: 3px; color: var(--muted-2); font-size: 10px; }
.login-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, 460px); align-items: center; gap: clamp(34px, 8vw, 120px); max-width: 1180px; min-height: calc(100vh - 130px); margin: 0 auto; }
.login-intro { max-width: 570px; }
.login-intro h1 { margin-top: 15px; color: var(--ink); font-size: clamp(34px, 4vw, 54px); line-height: 1.14; letter-spacing: 0; }
.login-intro h1 em { color: var(--teal); font-style: normal; }
.login-intro > p { max-width: 470px; margin-top: 20px; color: var(--muted); font-size: 13px; line-height: 1.8; }
.login-flow { display: flex; align-items: center; gap: 13px; margin-top: 35px; color: var(--muted-2); font-size: 10px; }
.login-flow span { display: inline-flex; align-items: center; gap: 7px; }
.login-flow b { display: grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; background: var(--teal-soft); color: var(--teal); font-size: 9px; }
.login-flow svg { width: 14px; color: #b2c1bf; }
.login-card { padding: 25px; border: 1px solid #d9e6e3; border-radius: 12px; background: #fff; box-shadow: 0 18px 45px rgba(25, 55, 60, .1); }
.login-card-head, .demo-account-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.login-card h2 { margin-top: 8px; font-size: 22px; }
.login-status { display: inline-flex; align-items: center; gap: 6px; color: #4a9b7e; font-size: 9px; white-space: nowrap; }
.login-status .live-dot { width: 6px; height: 6px; }
.login-form { display: flex; flex-direction: column; gap: 13px; margin-top: 23px; }
.login-form label { display: flex; flex-direction: column; gap: 6px; color: #64787a; font-size: 10px; font-weight: 700; }
.login-form input { width: 100%; height: 40px; padding: 0 11px; border: 1px solid #d7e4e1; border-radius: 6px; outline: 0; background: #fbfdfc; color: var(--ink); font: inherit; font-size: 11px; }
.login-form input:focus { border-color: #77afa3; box-shadow: 0 0 0 3px rgba(14,101,112,.08); }
.login-error { min-height: 16px; color: var(--red); font-size: 10px; line-height: 1.4; }
.demo-account-block { margin-top: 24px; padding-top: 17px; border-top: 1px solid var(--line); }
.demo-account-title span { color: var(--ink); font-size: 10px; font-weight: 800; }
.demo-account-title small { color: var(--muted-2); font-size: 9px; }
.demo-account-list { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 10px; }
.demo-account { min-width: 0; padding: 10px; border: 1px solid #e1ebe8; border-radius: 7px; background: #fbfdfc; text-align: left; }
.demo-account:hover { border-color: #9ac6bc; background: var(--teal-soft); }
.demo-account strong, .demo-account span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.demo-account strong { color: var(--ink); font-size: 10px; }
.demo-account span { margin-top: 4px; color: var(--muted); font-size: 8px; }
.login-disclaimer { display: flex; align-items: flex-start; gap: 6px; margin-top: 17px; color: var(--muted-2); font-size: 9px; line-height: 1.5; }
.login-disclaimer svg { width: 13px; height: 13px; flex: 0 0 auto; }
.sidebar { width: 254px; background: #fdfefe; border-right: 1px solid var(--line); padding: 24px 15px 18px; display: flex; flex-direction: column; flex-shrink: 0; }
.brand-lockup, .mobile-brand { display: flex; align-items: center; gap: 11px; }
.brand-lockup { padding: 0 10px 25px; }
.brand-mark { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: var(--teal); color: white; box-shadow: 0 5px 12px rgba(14,101,112,.16); }
.brand-mark svg { width: 18px; height: 18px; stroke-width: 2.3; }
.brand-lockup strong, .mobile-brand strong { display: block; font-size: 15px; letter-spacing: .01em; }
.brand-lockup span { display: block; margin-top: 3px; color: var(--muted-2); font-size: 10px; }
.factory-card { background: #f2f7f6; border: 1px solid #e2efec; border-radius: 10px; padding: 13px 12px 11px; margin: 0 2px 23px; }
.eyebrow, .panel-eyebrow, .section-kicker { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted-2); }
.factory-select { display: flex; justify-content: space-between; align-items: center; background: transparent; color: var(--ink); width: 100%; padding: 10px 0 7px; text-align: left; font-size: 12px; font-weight: 700; }
.factory-select span { display: flex; align-items: center; gap: 7px; }
.factory-select svg { width: 14px; height: 14px; color: var(--teal); }
.factory-meta { display: flex; align-items: center; gap: 6px; color: #718b8b; font-size: 10px; }
.live-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #47af83; box-shadow: 0 0 0 3px rgba(71,175,131,.12); }
.nav-list { display: flex; flex-direction: column; gap: 4px; }
.nav-label { padding: 0 12px 8px; color: #a6b1b4; text-transform: uppercase; letter-spacing: .1em; font-size: 9px; }
.nav-spacer { padding-top: 21px; }
.nav-item { display: flex; align-items: center; gap: 11px; width: 100%; padding: 11px 12px; border-radius: 8px; background: transparent; color: #6c7b7f; text-align: left; font-size: 12px; font-weight: 600; }
.nav-item svg { width: 16px; height: 16px; stroke-width: 1.8; }
.nav-item:hover { background: #f3f8f7; color: var(--teal); }
.nav-item.active { background: var(--teal-soft); color: var(--teal-deep); }
.nav-item b { margin-left: auto; min-width: 20px; height: 19px; display: grid; place-items: center; border-radius: 10px; background: rgba(14,101,112,.11); color: var(--teal); font-size: 10px; }
.nav-item .nav-count-warn { background: var(--amber-soft); color: var(--amber); }
.status-mini { margin-left: auto; color: #4d9a7d; font-size: 10px; font-weight: 700; }
.sidebar-bottom { margin-top: auto; }
.offline-card { display: flex; align-items: center; gap: 9px; margin: 0 3px 14px; padding: 11px 8px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.offline-icon { color: var(--amber); background: var(--amber-soft); width: 28px; height: 28px; display: grid; place-items: center; border-radius: 7px; flex-shrink: 0; }
.offline-icon svg { width: 14px; }
.offline-card strong, .offline-card span { display: block; }
.offline-card strong { font-size: 10px; }
.offline-card span { color: var(--muted); font-size: 10px; margin-top: 3px; }
.offline-card .icon-button { margin-left: auto; }
.user-chip { display: flex; align-items: center; gap: 9px; padding: 9px 8px; }
.avatar, .top-avatar { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: #e8c8a6; color: #714a2a; font-size: 11px; font-weight: 800; }
.user-chip strong, .user-chip span { display: block; }
.user-chip strong { font-size: 11px; }
.user-chip span { margin-top: 3px; color: var(--muted); font-size: 10px; }
.user-chip .icon-button { margin-left: auto; }
.main-content { flex: 1; min-width: 0; }
.topbar { height: 70px; padding: 0 40px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.78); }
.mobile-brand { display: none; }
.breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 11px; color: var(--muted); }
.breadcrumb svg { width: 13px; color: #b6c0c0; }
.breadcrumb strong { color: var(--ink); }
.topbar-actions { display: flex; align-items: center; gap: 17px; }
.shift-pill { display: flex; align-items: center; gap: 7px; color: #6d7f81; font-size: 11px; }
.shift-pill .live-dot { width: 6px; height: 6px; }
.icon-button { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 7px; background: transparent; color: #8b999c; position: relative; }
.icon-button:hover { background: #eef5f4; color: var(--teal); }
.icon-button svg { width: 15px; height: 15px; }
.top-icon { width: 29px; height: 29px; }
.notification-dot { position: absolute; width: 5px; height: 5px; top: 5px; right: 5px; border-radius: 50%; background: var(--red); border: 1px solid white; }
.page-wrap { max-width: 1420px; margin: 0 auto; padding: 38px 40px 48px; }
.page-heading { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 30px; }
.section-kicker { display: flex; align-items: center; gap: 8px; color: var(--teal); letter-spacing: .06em; }
.kicker-line { width: 18px; height: 2px; background: var(--teal); }
h1, h2, h3, p { margin: 0; }
h1 { font-size: 27px; line-height: 1.2; letter-spacing: 0; margin-top: 9px; }
.page-heading p { margin-top: 9px; color: var(--muted); font-size: 12px; }
.page-heading p strong { color: var(--teal); }
.role-scope-note { display: inline-flex; align-items: center; gap: 6px; margin-top: 9px; color: var(--teal); font-size: 10px; line-height: 1.5; }
.role-scope-note svg { width: 13px; height: 13px; flex: 0 0 auto; }
.primary-button, .secondary-button, .ghost-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 7px; font-size: 11px; font-weight: 700; transition: transform .15s, box-shadow .15s, background .15s; }
.primary-button { min-height: 37px; padding: 0 15px; color: white; background: var(--teal); box-shadow: 0 5px 12px rgba(14,101,112,.16); }
.primary-button:hover { transform: translateY(-1px); background: var(--teal-deep); box-shadow: 0 8px 18px rgba(14,101,112,.22); }
.primary-button svg, .secondary-button svg, .ghost-button svg { width: 15px; height: 15px; }
.metrics-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; margin-bottom: 28px; }
.metric-card { position: relative; background: var(--panel); border: 1px solid var(--line); border-top: 3px solid; border-radius: 9px; padding: 15px 17px 13px; min-height: 128px; box-shadow: 0 3px 12px rgba(27,58,64,.02); cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .15s; }.metric-card:hover, .metric-card:focus-visible { border-color: #c7dcd8; box-shadow: var(--shadow); transform: translateY(-1px); outline: 0; }
.accent-teal { border-top-color: var(--teal); }.accent-amber { border-top-color: var(--amber); }.accent-red { border-top-color: var(--red); }.accent-blue { border-top-color: var(--blue); }
.metric-top { display: flex; justify-content: space-between; align-items: center; color: var(--muted); font-size: 11px; }.metric-top-actions { display: inline-flex; align-items: center; gap: 4px; }.metric-top-actions > svg { margin-left: 2px; }.metric-top svg { width: 15px; height: 15px; color: #aac0bd; }.accent-amber .metric-top svg { color: #e1ad69; }.accent-red .metric-top svg { color: #e58d80; }.accent-blue .metric-top svg { color: #8eabd0; }.metric-adjust { display: grid; width: 21px; height: 21px; place-items: center; border: 1px solid #dce8e5; border-radius: 5px; background: #fff; color: #7c9192; }.metric-adjust:hover { border-color: #94c3b9; background: var(--teal-soft); color: var(--teal); }.metric-adjust svg { width: 11px; height: 11px; color: inherit; }
.metric-card > strong { display: block; font-size: 29px; line-height: 1; margin: 16px 0 13px; letter-spacing: 0; }
.metric-foot { display: flex; align-items: center; justify-content: space-between; color: var(--muted-2); font-size: 9px; }
.metric-bar { display: inline-block; width: 50px; height: 4px; border-radius: 3px; background: #e5efed; overflow: hidden; }.metric-bar span { display: block; height: 100%; background: var(--teal); border-radius: inherit; }
.trend-up { display: inline-flex; align-items: center; gap: 2px; color: #4b9c7d; font-size: 9px; font-weight: 700; }.trend-up svg { width: 12px; }.trend-neutral { color: var(--red); font-size: 9px; font-weight: 700; }
.workspace-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(340px, .85fr); gap: 26px; }
.section-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 13px; }
.section-head h2 { font-size: 15px; letter-spacing: 0; }.section-head span { display: block; margin-top: 5px; color: var(--muted-2); font-size: 10px; }
.text-button, .link-button { background: transparent; color: var(--teal); font-size: 10px; font-weight: 700; display: inline-flex; align-items: center; gap: 4px; }.text-button svg { width: 12px; }.text-button:hover, .link-button:hover { color: var(--teal-deep); }
.issue-list { display: flex; flex-direction: column; gap: 10px; }
.issue-card { display: flex; align-items: center; gap: 14px; padding: 17px 18px; border: 1px solid var(--line); background: var(--panel); border-left: 3px solid; border-radius: 8px; box-shadow: 0 3px 12px rgba(27,58,64,.025); }.issue-card.urgent { border-left-color: var(--red); }.issue-card.warning { border-left-color: var(--amber); }
.issue-card:hover { border-color: #ceddda; box-shadow: var(--shadow); }.issue-icon { width: 40px; height: 40px; display: grid; place-items: center; flex-shrink: 0; border-radius: 9px; background: var(--red-soft); color: var(--red); }.warning .issue-icon { background: var(--amber-soft); color: var(--amber); }.issue-icon svg { width: 20px; }
.issue-main { min-width: 0; flex: 1; }.issue-title-row { display: flex; align-items: center; gap: 8px; }.issue-title-row h3 { font-size: 12px; }.priority { display: inline-flex; align-items: center; border-radius: 4px; padding: 4px 6px; font-size: 9px; font-weight: 800; white-space: nowrap; }.priority.high { background: var(--red-soft); color: var(--red); }.priority.medium { background: var(--amber-soft); color: var(--amber); }
.issue-main p { margin: 8px 0 11px; color: #536367; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.issue-meta { display: flex; gap: 14px; color: var(--muted-2); font-size: 9px; }.issue-meta span { display: inline-flex; align-items: center; gap: 4px; }.issue-meta svg { width: 11px; height: 11px; }
.issue-action { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; align-self: stretch; }.issue-action-buttons { display: flex; gap: 6px; }.confidence { display: inline-flex; align-items: center; gap: 4px; color: #4a9b7e; font-size: 9px; white-space: nowrap; }.confidence svg { width: 11px; }.round-action { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: #f1f6f5; color: var(--teal); }.round-action:hover { background: var(--teal); color: white; }.round-action svg { width: 14px; }
.inspection-modal { width: min(760px, calc(100vw - 32px)); max-height: min(88vh, 760px); overflow-y: auto; }.inspection-form { display: grid; gap: 14px; }.inspection-section { border: 1px solid var(--line); border-radius: 8px; background: #fbfdfd; overflow: hidden; }.inspection-section-head { display: flex; align-items: center; justify-content: space-between; padding: 11px 14px; background: #f0f7f6; color: var(--teal-deep); font-size: 12px; }.inspection-section-head span { color: var(--muted); font-size: 10px; }.inspection-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 14px; border-top: 1px solid var(--line); }.inspection-check { display: flex; align-items: flex-start; gap: 9px; cursor: pointer; }.inspection-check input { width: 16px; height: 16px; margin: 1px 0 0; accent-color: var(--teal); }.inspection-check span { display: grid; gap: 4px; }.inspection-check strong { color: var(--ink); font-size: 11px; }.inspection-check small { color: var(--muted); font-size: 10px; line-height: 1.45; }.inspection-item-fields { display: flex; align-items: center; gap: 7px; }.inspection-item-fields select, .inspection-item-fields input { min-height: 32px; padding: 0 8px; border: 1px solid var(--line); border-radius: 5px; background: #fff; color: var(--ink); font: inherit; font-size: 10px; }.inspection-item-fields input { width: 110px; }.inspection-evidence { display: inline-flex; align-items: center; gap: 4px; color: var(--teal); white-space: nowrap; font-size: 10px; }.inspection-evidence svg { width: 13px; }.inspection-notes { display: grid; gap: 6px; color: var(--muted); font-size: 10px; }.inspection-notes textarea { min-height: 70px; padding: 9px; border: 1px solid var(--line); border-radius: 6px; resize: vertical; font: inherit; font-size: 11px; }
.progress-head { margin-top: 28px; }.line-progress { background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 5px 18px; }.line-row { display: grid; grid-template-columns: 155px minmax(70px, 1fr) 38px 65px; align-items: center; gap: 12px; min-height: 55px; border-bottom: 1px solid #edf1f0; }.line-row:last-child { border-bottom: 0; }.line-name { display: flex; align-items: center; gap: 7px; min-width: 0; }.line-name strong { font-size: 11px; }.line-name small { color: var(--muted-2); font-size: 9px; white-space: nowrap; }.line-dot { width: 7px; height: 7px; border-radius: 50%; }.line-dot.green { background: #4aa580; }.line-dot.amber { background: var(--amber); }.line-dot.blue { background: var(--blue); }.progress-track { height: 6px; border-radius: 3px; overflow: hidden; background: #e4efed; }.progress-track span { display: block; height: 100%; border-radius: inherit; background: var(--teal); }.amber-track { background: #faeedc; }.amber-track span { background: var(--amber); }.blue-track { background: #e7eef7; }.blue-track span { background: var(--blue); }.line-row > b { color: #6d7e81; font-size: 10px; }.line-state { font-size: 9px; font-weight: 700; text-align: right; }.line-state.done { color: #4a9b7e; }.active-state { color: var(--amber); }
.right-column { display: flex; flex-direction: column; gap: 17px; }.capture-panel, .ai-result, .queue-panel { background: var(--panel); border: 1px solid var(--line); border-radius: 9px; padding: 18px; box-shadow: 0 3px 12px rgba(27,58,64,.025); }.capture-panel { background: #f8fbfa; border-color: #dcebe7; }.capture-top, .result-head { display: flex; justify-content: space-between; align-items: flex-start; }.panel-eyebrow { display: inline-flex; align-items: center; gap: 5px; color: var(--teal); font-weight: 700; letter-spacing: .05em; }.panel-eyebrow svg { width: 12px; height: 12px; }.capture-panel h2, .ai-result h2 { margin-top: 8px; font-size: 17px; letter-spacing: 0; }.capture-panel > p { color: var(--muted); margin-top: 8px; font-size: 10px; }.privacy-tag { display: inline-flex; align-items: center; gap: 4px; padding: 5px 7px; border-radius: 5px; background: var(--teal-soft); color: var(--teal); font-size: 9px; font-weight: 700; }.privacy-tag svg { width: 11px; }
.mode-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; margin-top: 15px; border-radius: 7px; background: #eaf3f1; }.mode-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 30px; border-radius: 5px; background: transparent; color: #78908e; font-size: 10px; font-weight: 700; }.mode-button svg { width: 13px; height: 13px; }.mode-button.active { background: white; color: var(--teal-deep); box-shadow: 0 2px 5px rgba(27,58,64,.08); }.mode-button:not(.active):hover { color: var(--teal); }
.drop-zone { min-height: 184px; margin-top: 17px; padding: 22px 14px 15px; border: 1px dashed #a9c9c2; border-radius: 8px; background: white; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }.drop-zone.dragging { background: var(--teal-soft); border-color: var(--teal); }.drop-icon { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 50%; background: var(--teal-soft); color: var(--teal); margin-bottom: 10px; }.drop-icon svg { width: 20px; }.drop-zone strong { font-size: 11px; }.drop-zone > span { color: var(--muted-2); font-size: 9px; margin-top: 6px; }.drop-actions { display: flex; gap: 7px; margin-top: 16px; }.secondary-button { height: 31px; padding: 0 10px; color: white; background: var(--teal); }.secondary-button:hover { background: var(--teal-deep); }.ghost-button { height: 31px; padding: 0 9px; color: #6f8182; background: #f0f5f4; }.ghost-button:hover { background: #e6efed; color: var(--teal); }.capture-footer { display: flex; justify-content: space-between; margin-top: 12px; color: var(--muted-2); font-size: 9px; }.capture-footer span:first-child { display: inline-flex; gap: 5px; align-items: center; color: #7d9994; }.capture-footer svg { width: 11px; }
.ai-result { border-color: #a9d3ca; box-shadow: 0 10px 26px rgba(14,101,112,.08); animation: result-in .25s ease-out; }.ai-result[hidden] { display: none; }@keyframes result-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }.result-time { color: var(--muted-2); font-size: 9px; }.result-device { display: flex; align-items: center; gap: 9px; margin-top: 16px; padding-bottom: 13px; border-bottom: 1px solid var(--line); }.device-thumb { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 7px; background: var(--red-soft); color: var(--red); }.device-thumb svg { width: 16px; }.result-device strong, .result-device span:not(.priority) { display: block; }.result-device strong { font-size: 11px; }.result-device span:not(.priority) { margin-top: 3px; color: var(--muted-2); font-size: 9px; }.result-device .priority { margin-left: auto; }.finding { display: flex; gap: 9px; padding: 13px 0; }.finding-mark { width: 25px; height: 25px; display: grid; place-items: center; flex-shrink: 0; color: var(--red); background: var(--red-soft); border-radius: 6px; }.finding-mark svg { width: 14px; }.finding strong { font-size: 10px; }.finding p { margin-top: 5px; color: #627276; line-height: 1.55; font-size: 10px; }.result-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; border-top: 1px solid var(--line); padding: 12px 0 14px; }.result-grid span, .result-grid strong { display: block; }.result-grid span { color: var(--muted-2); font-size: 9px; }.result-grid strong { margin-top: 5px; font-size: 10px; }.confidence-value { color: #4a9b7e; }.full-width { width: 100%; }.link-button { justify-content: center; width: 100%; margin-top: 12px; color: var(--muted); font-weight: 600; }
.queue-panel .section-head { margin-bottom: 7px; }.queue-list { display: flex; flex-direction: column; }.queue-item { display: flex; align-items: center; gap: 9px; padding: 11px 0; border-bottom: 1px solid #edf1f0; }.queue-item:last-child { border-bottom: 0; }.queue-icon { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 7px; flex-shrink: 0; }.queue-icon svg { width: 14px; }.queue-icon.teal { background: var(--teal-soft); color: var(--teal); }.queue-icon.amber { background: var(--amber-soft); color: var(--amber); }.queue-icon.blue { background: var(--blue-soft); color: var(--blue); }.queue-item strong, .queue-item span { display: block; }.queue-item strong { font-size: 10px; }.queue-item div:nth-child(2) span { color: var(--muted-2); font-size: 9px; margin-top: 4px; white-space: nowrap; }.queue-status { margin-left: auto; font-size: 9px !important; font-weight: 700; white-space: nowrap; }.on-way { color: var(--teal); }.ready { color: #4a9b7e; }.pending { color: var(--amber); }
.toast { position: fixed; z-index: 5; right: 25px; bottom: 25px; display: flex; align-items: center; gap: 9px; padding: 12px 15px; border: 1px solid #b6d8d0; border-radius: 8px; background: #f4fbf8; color: var(--teal-deep); box-shadow: 0 12px 30px rgba(27,58,64,.13); font-size: 11px; opacity: 0; transform: translateY(10px); pointer-events: none; transition: opacity .2s, transform .2s; }.toast.show { opacity: 1; transform: translateY(0); }.toast svg { width: 15px; }
.agent-page { padding-bottom: 15px; }
.agent-heading { margin-bottom: 24px; }
.agent-heading p { max-width: 500px; }
.agent-hero-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(300px, .85fr); gap: 16px; }
.agent-command-panel, .agent-health-panel, .agent-data-panel, .agent-trigger-panel, .agent-knowledge-panel, .agent-adoption-panel { border: 1px solid var(--line); border-radius: 9px; background: var(--panel); padding: 19px; box-shadow: 0 3px 12px rgba(27,58,64,.025); }
.agent-command-panel { background: #f8fbfa; border-color: #d6e8e3; }
.agent-panel-top, .agent-panel-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.agent-panel-top h2 { margin-top: 8px; font-size: 20px; letter-spacing: 0; }
.agent-panel-top h2 small { color: var(--muted-2); font-size: 11px; font-weight: 600; }
.agent-command-panel > p, .agent-helper { margin-top: 8px; color: var(--muted); font-size: 10px; line-height: 1.55; }
.agent-live { display: inline-flex; align-items: center; gap: 6px; padding: 5px 7px; border-radius: 5px; background: var(--teal-soft); color: var(--teal); font-size: 9px; font-weight: 700; white-space: nowrap; }
.agent-live .live-dot { width: 6px; height: 6px; }
.command-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 17px; }
.command-chips button { padding: 7px 9px; border: 1px solid #d6e8e3; border-radius: 6px; background: white; color: #517172; font-size: 9px; font-weight: 700; }
.command-chips button:hover { border-color: #82b6ac; color: var(--teal); background: #f4fbf9; }
.agent-command-form { display: flex; align-items: center; gap: 7px; margin-top: 14px; padding: 7px 8px 7px 10px; border: 1px solid #cfe2dd; border-radius: 7px; background: white; }
.agent-command-form > svg { width: 14px; height: 14px; color: var(--teal); flex-shrink: 0; }
.agent-command-form input { min-width: 0; flex: 1; border: 0; outline: 0; color: var(--ink); font: inherit; font-size: 10px; }
.agent-command-form input::placeholder { color: #a3b1b0; }
.agent-command-form .icon-button { width: 26px; height: 26px; background: var(--teal); color: white; border-radius: 6px; flex-shrink: 0; }
.agent-command-form .icon-button:hover { background: var(--teal-deep); }
.agent-command-form .icon-button svg { width: 13px; height: 13px; }
.agent-response { display: flex; align-items: flex-start; gap: 9px; margin-top: 14px; padding: 11px; border: 1px solid #cde4de; border-radius: 7px; background: #eff8f6; animation: result-in .2s ease-out; }
.agent-response[hidden] { display: none; }
.response-avatar { width: 25px; height: 25px; display: grid; place-items: center; flex-shrink: 0; border-radius: 6px; background: var(--teal); color: white; }
.response-avatar svg { width: 14px; height: 14px; }
.agent-response strong { display: block; color: var(--teal-deep); font-size: 10px; }
.agent-response p { margin-top: 5px; color: #4f6868; font-size: 10px; line-height: 1.55; }
.response-meta { display: block; margin-top: 7px; color: #7d9994; font-size: 8px; }
.health-trend { display: inline-flex; align-items: center; gap: 4px; color: #4a9b7e; font-size: 9px; font-weight: 700; }
.health-trend svg { width: 12px; height: 12px; }
.health-track, .adoption-track { height: 7px; overflow: hidden; border-radius: 4px; background: #e4efed; }
.health-track { margin-top: 22px; }.health-track span, .adoption-track span { display: block; height: 100%; border-radius: inherit; background: var(--teal); }
.health-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px 22px; margin-top: 21px; }
.health-grid span, .health-grid strong { display: block; }.health-grid span { color: var(--muted-2); font-size: 9px; }.health-grid strong { margin-top: 5px; color: var(--ink); font-size: 13px; }
.agent-section-head { display: flex; align-items: flex-end; justify-content: space-between; margin: 28px 0 13px; }.agent-section-head h2 { font-size: 16px; }.agent-section-head > div > span { display: block; margin-top: 6px; color: var(--muted-2); font-size: 10px; }.agent-updated { display: inline-flex; align-items: center; gap: 5px; color: var(--muted-2); font-size: 9px; }.agent-updated svg { width: 12px; height: 12px; }
.agent-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.agent-panel-title h3 { margin-top: 8px; font-size: 15px; }.agent-panel-title .text-button { color: var(--teal); font-size: 10px; }.agent-panel-title .text-button svg { width: 12px; height: 12px; }
.trigger-count { padding: 5px 7px; border-radius: 5px; background: var(--teal-soft); color: var(--teal); font-size: 9px; font-weight: 700; white-space: nowrap; }
.agent-data-list, .trigger-list { display: flex; flex-direction: column; margin-top: 15px; }.agent-data-list > div, .trigger-list > div { display: flex; align-items: center; gap: 9px; min-height: 45px; border-bottom: 1px solid #edf1f0; }.agent-data-list > div:last-child, .trigger-list > div:last-child { border-bottom: 0; }.data-icon { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 6px; flex-shrink: 0; }.data-icon svg { width: 14px; height: 14px; }.data-icon.teal { background: var(--teal-soft); color: var(--teal); }.data-icon.blue { background: var(--blue-soft); color: var(--blue); }.data-icon.amber { background: var(--amber-soft); color: var(--amber); }.data-icon.violet { background: #f1eef8; color: #8062a6; }.agent-data-list strong, .agent-data-list small, .trigger-list strong, .trigger-list small { display: block; }.agent-data-list strong, .trigger-list strong { font-size: 10px; }.agent-data-list small, .trigger-list small { margin-top: 3px; color: var(--muted-2); font-size: 8px; }.agent-data-list b { margin-left: auto; color: #5b7274; font-size: 10px; }.trigger-number { width: 25px; color: #9cadad; font-size: 9px; font-weight: 800; }.trigger-list > div > svg { width: 14px; height: 14px; margin-left: auto; color: #4a9b7e; }
.knowledge-summary { display: flex; align-items: flex-end; gap: 7px; margin-top: 17px; padding-bottom: 13px; border-bottom: 1px solid var(--line); }.knowledge-summary strong { color: var(--teal); font-size: 25px; line-height: 1; }.knowledge-summary span { color: var(--muted); font-size: 9px; }.knowledge-summary b { margin-left: auto; color: #4a9b7e; font-size: 9px; }.tag-list { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 13px; }.tag-list span { padding: 6px 7px; border-radius: 5px; background: #f1f6f5; color: #63807d; font-size: 8px; }.knowledge-footer { display: flex; justify-content: space-between; gap: 8px; margin-top: 17px; color: #71908b; font-size: 8px; }.knowledge-footer span { display: inline-flex; align-items: center; gap: 4px; }.knowledge-footer svg { width: 11px; height: 11px; color: var(--teal); }
.adoption-value { color: var(--teal); font-size: 18px; font-weight: 800; }.adoption-track { margin-top: 18px; }.adoption-row { display: flex; justify-content: space-between; padding: 11px 0; border-bottom: 1px solid #edf1f0; color: var(--muted); font-size: 9px; }.adoption-row strong { color: var(--ink); font-size: 10px; }.agent-adoption-panel .secondary-button { margin-top: 15px; }
.agent-note { display: flex; align-items: flex-start; gap: 9px; margin-top: 16px; padding: 13px 15px; border: 1px solid #eee2c9; border-radius: 8px; background: #fffaf0; color: #836b42; }.agent-note > svg { width: 15px; height: 15px; margin-top: 1px; color: var(--amber); flex-shrink: 0; }.agent-note strong { display: block; font-size: 10px; }.agent-note p { margin-top: 4px; color: #937d59; font-size: 9px; line-height: 1.55; }.agent-back { margin-top: 17px; }
.identity-modal[hidden] { display: none; }
.identity-modal { position: fixed; inset: 0; z-index: 10; display: grid; place-items: center; padding: 20px; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(25, 45, 49, .38); backdrop-filter: blur(3px); }
.modal-card { position: relative; width: min(100%, 460px); padding: 25px; border: 1px solid #d9e6e3; border-radius: 12px; background: #fff; box-shadow: 0 24px 70px rgba(25, 55, 60, .2); }
.modal-close { position: absolute; right: 15px; top: 15px; }
.modal-card h2 { margin-top: 9px; font-size: 20px; letter-spacing: 0; }
.modal-card > p { margin-top: 8px; color: var(--muted); font-size: 11px; line-height: 1.55; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 21px; }
.form-grid label { display: flex; flex-direction: column; gap: 7px; color: #6c7f81; font-size: 10px; font-weight: 700; }
.form-grid select { width: 100%; min-height: 37px; padding: 0 10px; border: 1px solid #dbe7e4; border-radius: 7px; background: #f8fbfa; color: var(--ink); font: inherit; font-size: 11px; outline: 0; }
.form-grid select:focus { border-color: #8dbcb3; box-shadow: 0 0 0 3px rgba(14,101,112,.09); }
.field-label { margin-top: 20px; color: #6c7f81; font-size: 10px; font-weight: 700; }
.access-choices { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 9px; }
.access-choice { display: flex; align-items: flex-start; gap: 8px; min-height: 64px; padding: 10px 9px; border: 1px solid #e0eae8; border-radius: 7px; background: #fbfdfc; color: var(--ink); text-align: left; }
.access-choice:hover { border-color: #a9c9c2; }
.access-choice.active { border-color: #6ca99e; background: #eff8f6; box-shadow: inset 0 0 0 1px #6ca99e; }
.access-choice strong, .access-choice small { display: block; }
.access-choice strong { font-size: 11px; }
.access-choice small { margin-top: 4px; color: var(--muted); font-size: 8px; line-height: 1.35; }
.access-dot { width: 8px; height: 8px; flex-shrink: 0; margin-top: 3px; border-radius: 50%; }
.access-dot.ordinary { background: #4d9b7b; }.access-dot.confidential { background: #d88c25; }.access-dot.top-secret { background: #c45856; }
.access-note { display: flex; align-items: flex-start; gap: 7px; margin: 13px 0 17px; padding: 10px; border-radius: 7px; background: #f7faf9; color: #6b7f80; font-size: 9px; line-height: 1.5; }
.access-note svg { width: 13px; height: 13px; flex-shrink: 0; color: var(--teal); margin-top: 1px; }
.user-chip .icon-button { transition: background .15s, color .15s; }
.user-chip:hover .icon-button { color: var(--teal); background: #eef5f4; }
.upload-preview { width: 100%; max-height: 144px; object-fit: cover; border-radius: 6px; margin-bottom: 10px; }
.drop-zone.has-upload { padding-top: 13px; }.analysis-disclaimer { display: flex; align-items: flex-start; gap: 5px; margin: 0 0 12px; color: #7f8e91; font-size: 8px; line-height: 1.45; }.analysis-disclaimer svg { width: 11px; height: 11px; flex-shrink: 0; margin-top: 1px; }
.state-empty { display: flex; align-items: center; gap: 9px; min-height: 70px; padding: 15px; border: 1px dashed #d8e5e2; border-radius: 8px; background: #fbfdfc; color: var(--muted); }.state-empty > svg { width: 18px; color: #4a9b7e; }.state-empty strong { color: var(--ink); font-size: 11px; }.state-empty span { font-size: 9px; }
.module-page { min-height: 60vh; }.module-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 13px; color: var(--muted-2); font-size: 10px; }.filter-tabs { display: flex; align-items: center; gap: 5px; padding: 4px; border-radius: 7px; background: #eaf3f1; }.filter-tabs button { min-height: 28px; padding: 0 9px; border-radius: 5px; background: transparent; color: #718584; font-size: 10px; font-weight: 700; }.filter-tabs button.active { background: #fff; color: var(--teal-deep); box-shadow: 0 1px 4px rgba(27,58,64,.08); }
.table-panel { overflow-x: auto; overflow-y: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); box-shadow: 0 3px 12px rgba(27,58,64,.025); }.data-table { min-width: 720px; }.data-row { display: grid; align-items: center; gap: 14px; min-height: 62px; padding: 0 17px; border-bottom: 1px solid #edf1f0; color: #536367; font-size: 10px; }.data-row:last-child { border-bottom: 0; }.data-row > span { min-width: 0; }.data-row strong, .data-row small { display: block; }.data-row strong { color: var(--ink); font-size: 10px; }.data-row small { margin-top: 4px; overflow: hidden; color: var(--muted-2); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }.data-head { min-height: 39px; background: #f8fbfa; color: #8b9a9b; font-size: 9px; font-weight: 700; text-transform: uppercase; }.data-head span { color: inherit; }.order-table .data-row { grid-template-columns: minmax(190px, 2fr) 90px 80px 75px minmax(120px, 1fr); }.asset-table .data-row { grid-template-columns: minmax(195px, 2fr) minmax(130px, 1fr) 65px 82px minmax(180px, 1fr); }.inventory-table .data-row { grid-template-columns: minmax(185px, 2fr) 65px 95px 65px 96px; }.row-actions { display: flex; align-items: center; gap: 7px; }.mini-button { width: auto; height: 28px; min-height: 28px; font-size: 9px; white-space: nowrap; }.muted-cell { color: var(--muted-2); font-size: 9px; }.status-badge, .access-badge { display: inline-flex; align-items: center; justify-content: center; min-height: 21px; padding: 0 6px; border-radius: 4px; font-size: 8px; font-weight: 800; white-space: nowrap; }.status-badge.closed { background: #e8f5ef; color: #3f926f; }.status-badge.in-progress { background: var(--teal-soft); color: var(--teal); }.status-badge.waiting { background: var(--amber-soft); color: var(--amber); }.access-badge.access-普通 { background: #eaf4ef; color: #4a9b7e; }.access-badge.access-机密 { background: var(--amber-soft); color: #b5761d; }.access-badge.access-绝密 { background: var(--red-soft); color: var(--red); }.table-empty { display: grid; min-height: 150px; place-items: center; color: var(--muted); font-size: 11px; }
.inventory-part-cell { display: flex; align-items: center; gap: 9px; min-width: 0; }
.part-image-button { display: grid; width: 42px; height: 34px; flex: 0 0 auto; padding: 0; place-items: center; border: 1px solid #d9e8e5; border-radius: 6px; background: #f7fbfa; overflow: hidden; cursor: pointer; }
.part-image-button:hover { border-color: #74aea3; box-shadow: 0 0 0 2px rgba(14,101,112,.08); }
.part-image { display: block; width: 100%; height: 100%; object-fit: cover; }
.part-detail-layout { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 14px; align-items: start; min-width: 0; }
.part-detail-media { display: flex; min-width: 0; flex-direction: column; gap: 7px; }
.part-detail-image { width: 220px; height: 160px; object-fit: cover; border: 1px solid var(--line); border-radius: 8px; background: #f7fbfa; }
.part-image-note, .part-source-link { color: var(--muted-2); font-size: 8px; line-height: 1.45; }
.part-source-link { color: var(--teal); text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; }
.part-photo-upload { display: inline-flex; width: fit-content; align-items: center; gap: 5px; min-height: 28px; padding: 0 9px; border: 1px solid #d7e4e1; border-radius: 5px; background: #fff; color: var(--teal); cursor: pointer; font-size: 9px; font-weight: 700; }
.part-photo-upload:hover { border-color: #77afa3; background: #f4faf8; }
.part-photo-upload svg { width: 13px; height: 13px; }
.part-photo-upload input { display: none; }
.part-intro { display: grid; gap: 5px; margin-top: 14px; padding: 11px 12px; border: 1px solid #e2ece9; border-radius: 7px; background: #f8fbfa; }
.part-intro strong { color: var(--ink); font-size: 10px; }
.part-intro p, .part-intro small { color: var(--muted); font-size: 9px; line-height: 1.55; }
.work-modal-card.part-detail-modal { width: min(100%, 720px); }
.part-detail-layout > .detail-stack { min-width: 0; }
.part-detail-layout > .detail-stack > div { min-width: 0; }
.part-detail-layout > .detail-stack strong { min-width: 0; overflow-wrap: anywhere; word-break: break-word; }
.integration-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }.integration-card { display: flex; flex-direction: column; min-height: 210px; padding: 18px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); box-shadow: 0 3px 12px rgba(27,58,64,.025); }.integration-icon { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 8px; background: var(--teal-soft); color: var(--teal); }.integration-icon svg { width: 18px; height: 18px; }.integration-copy { margin-top: 15px; }.integration-copy h2 { font-size: 14px; }.integration-copy p { min-height: 34px; margin-top: 7px; color: var(--muted); font-size: 10px; line-height: 1.55; }.integration-card .toggle { margin-top: auto; margin-left: auto; }.toggle { position: relative; width: 35px; height: 20px; padding: 2px; border-radius: 10px; background: #d9e4e2; }.toggle span { display: block; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(29,50,54,.18); transition: transform .15s; }.toggle.on { background: var(--teal); }.toggle.on span { transform: translateX(15px); }.integration-note { display: flex; align-items: flex-start; gap: 9px; margin-top: 16px; padding: 14px; border: 1px solid #e3e9e7; border-radius: 8px; background: #f8fbfa; }.integration-note svg { width: 15px; color: var(--teal); }.integration-note strong { display: block; font-size: 10px; }.integration-note p { margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.55; }
.work-modal[hidden] { display: none; }.work-modal { position: fixed; z-index: 20; inset: 0; display: grid; place-items: center; padding: 20px; }.work-modal-card { position: relative; width: min(100%, 520px); max-height: calc(100vh - 40px); overflow-y: auto; padding: 24px; border: 1px solid #d9e6e3; border-radius: 10px; background: #fff; box-shadow: 0 24px 70px rgba(25,55,60,.24); }.work-modal-card h2 { margin-top: 9px; font-size: 19px; }.modal-intro { margin: 8px 0 17px; color: var(--muted); font-size: 10px; line-height: 1.55; }.detail-stack { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 7px; overflow: hidden; }.detail-stack > div { display: grid; grid-template-columns: 88px minmax(0,1fr); gap: 12px; padding: 10px; border-bottom: 1px solid #edf1f0; }.detail-stack > div:last-child { border-bottom: 0; }.detail-stack span { color: var(--muted-2); font-size: 9px; }.detail-stack strong { color: #4d6265; font-size: 10px; line-height: 1.5; }.modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 17px; }.modal-actions .secondary-button, .modal-actions .primary-button { width: auto; }.modal-form { display: flex; flex-direction: column; gap: 13px; }.modal-form label { display: flex; flex-direction: column; gap: 6px; color: #64787a; font-size: 10px; font-weight: 700; }.modal-form input, .modal-form select, .modal-form textarea { width: 100%; min-height: 36px; padding: 8px 10px; border: 1px solid #d7e4e1; border-radius: 6px; outline: 0; background: #fbfdfc; color: var(--ink); font: inherit; font-size: 11px; }.modal-form textarea { min-height: 86px; resize: vertical; }.modal-form input:focus, .modal-form select:focus, .modal-form textarea:focus { border-color: #77afa3; box-shadow: 0 0 0 3px rgba(14,101,112,.08); }.modal-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }.history-list { display: flex; flex-direction: column; gap: 7px; margin-top: 16px; padding: 11px; border-radius: 7px; background: #f8fbfa; }.history-list strong { font-size: 10px; }.history-list span { color: var(--muted); font-size: 9px; line-height: 1.5; }.activity-list { max-height: 320px; overflow-y: auto; }.asset-modal-actions { justify-content: flex-start; flex-wrap: wrap; }.danger-button { color: var(--red); }.danger-button:hover { border-color: #e5b9b9; background: var(--red-soft); color: #a64344; }.knowledge-checklist { display: flex; flex-direction: column; gap: 10px; }.knowledge-checklist > div { display: flex; gap: 8px; padding: 10px; border: 1px solid var(--line); border-radius: 7px; }.knowledge-checklist > div > svg { width: 14px; height: 14px; color: #4a9b7e; flex-shrink: 0; }.knowledge-checklist strong, .knowledge-checklist small { display: block; }.knowledge-checklist strong { font-size: 10px; }.knowledge-checklist small { margin-top: 3px; color: var(--muted); font-size: 9px; line-height: 1.45; }
.metric-detail-list { display: flex; flex-direction: column; gap: 7px; max-height: 330px; overflow-y: auto; }.metric-detail-row { display: flex; align-items: center; gap: 9px; min-height: 51px; padding: 8px 9px; border: 1px solid var(--line); border-radius: 7px; background: #fbfdfc; }.metric-detail-row > span:nth-child(2) { min-width: 0; flex: 1; }.metric-detail-row strong, .metric-detail-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.metric-detail-row strong { color: var(--ink); font-size: 10px; }.metric-detail-row small { margin-top: 4px; color: var(--muted); font-size: 8px; }.metric-detail-icon { display: grid; width: 28px; height: 28px; flex-shrink: 0; place-items: center; border-radius: 6px; background: var(--teal-soft); color: var(--teal); }.metric-detail-icon svg { width: 14px; height: 14px; }.metric-detail-icon.amber { background: var(--amber-soft); color: var(--amber); }.metric-detail-icon.red { background: var(--red-soft); color: var(--red); }.metric-detail-icon.blue { background: var(--blue-soft); color: var(--blue); }.metric-detail-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; margin-left: auto; }.inspection-frequency-control { display: inline-flex; align-items: center; gap: 4px; color: var(--muted); font-size: 8px; white-space: nowrap; }.inspection-frequency-control select { height: 28px; min-width: 64px; padding: 0 5px; border: 1px solid #d7e4e1; border-radius: 5px; background: #fff; color: var(--teal-deep); font: inherit; font-size: 9px; font-weight: 700; }.inspection-frequency-control select:focus { border-color: #77afa3; outline: 0; box-shadow: 0 0 0 3px rgba(14,101,112,.08); }.metric-detail-empty { display: flex; align-items: center; gap: 8px; min-height: 80px; padding: 14px; border: 1px dashed #d6e4e1; border-radius: 7px; color: var(--muted); font-size: 10px; }.metric-detail-empty svg { width: 16px; color: var(--teal); }
.work-modal-card.metric-detail-modal { display: block; height: auto; max-height: calc(100vh - 32px); overflow-y: auto; }
.metric-detail-modal .metric-detail-list { flex: 0 0 auto; min-height: 120px; max-height: none; overflow: visible; padding: 2px 4px 12px 0; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; scrollbar-gutter: stable; }
.metric-detail-modal .inspection-canceled-list { flex: 0 0 auto; max-height: 145px; overflow-y: auto; }
.metric-detail-modal .modal-actions { margin-top: 10px; padding-top: 10px; background: #fff; }
.inspection-detail-row { align-items: center; }
.inspection-project-select { display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; color: var(--muted-2); font-size: 8px; white-space: nowrap; cursor: pointer; }
.inspection-project-select input { width: 15px; height: 15px; margin: 0; accent-color: var(--teal); }
.inspection-detail-main { min-width: 0; flex: 1; }
.inspection-selection-count { color: var(--muted-2); font-size: 9px; white-space: nowrap; }
.metric-detail-modal .modal-actions button:disabled { cursor: not-allowed; opacity: .48; }
.inspection-detail-row { display: grid; grid-template-columns: 28px 42px minmax(0, 1fr) auto; align-items: start; gap: 8px; }
.inspection-detail-row .metric-detail-icon { grid-column: 1; }
.inspection-detail-row .inspection-project-select { grid-column: 2; padding-top: 7px; }
.inspection-detail-row .inspection-detail-main { grid-column: 3; padding-top: 3px; }
.inspection-detail-row > .metric-detail-actions { grid-column: 4; min-width: 0; margin-left: 0; }
.inspection-detail-row .inspection-detail-main strong,
.inspection-detail-row .inspection-detail-main small { overflow: visible; text-overflow: clip; white-space: normal; }
.inspection-detail-row .inspection-detail-main strong { line-height: 1.3; }
.inspection-detail-row .inspection-detail-main small { line-height: 1.4; }
.metric-select-row { display: grid; grid-template-columns: 28px 42px minmax(0, 1fr) auto; align-items: start; gap: 8px; }
.metric-select-row .metric-detail-icon { grid-column: 1; }
.metric-record-select { display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; padding-top: 7px; color: var(--muted-2); font-size: 8px; white-space: nowrap; cursor: pointer; }
.metric-record-select input { width: 15px; height: 15px; margin: 0; accent-color: var(--teal); }
.metric-select-row .metric-record-select { grid-column: 2; }
.metric-record-main { grid-column: 3; min-width: 0; padding-top: 3px; }
.metric-record-main strong, .metric-record-main small { display: block; overflow: visible; text-overflow: clip; white-space: normal; }
.metric-record-main strong { line-height: 1.3; }
.metric-record-main small { line-height: 1.4; }
.metric-select-row .metric-detail-actions { grid-column: 4; margin-left: 0; }
.evidence-block { display: flex; flex-direction: column; gap: 7px; margin-top: 15px; padding: 11px; border: 1px solid var(--line); border-radius: 7px; background: #f8fbfa; }.evidence-block strong { color: var(--ink); font-size: 10px; }.evidence-block small, .evidence-missing span { color: var(--muted); font-size: 9px; }.evidence-preview { width: 100%; max-height: 220px; object-fit: contain; border-radius: 5px; background: #eef5f3; }.evidence-missing { border-color: #f0d5bd; background: #fff9f3; }
.inspection-canceled-list { margin-top: 12px; border: 1px dashed #e6cdb5; border-radius: 7px; background: #fffaf4; overflow: hidden; }.inspection-canceled-head { display: flex; align-items: center; justify-content: space-between; padding: 9px 11px; color: #9a6c3e; font-size: 10px; }.inspection-canceled-head span { font-size: 8px; }.inspection-canceled-row { display: flex; align-items: center; gap: 8px; padding: 9px 11px; border-top: 1px solid #f1e3d4; }.inspection-canceled-row > span { min-width: 0; flex: 1; }.inspection-canceled-row strong, .inspection-canceled-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.inspection-canceled-row strong { color: var(--ink); font-size: 9px; }.inspection-canceled-row small { margin-top: 3px; color: #9b836b; font-size: 8px; }
.mobile-menu-button, .mobile-nav { display: none; }
.scenario-banner { display: flex; align-items: flex-start; gap: 12px; margin: -7px 0 24px; padding: 13px 15px; border: 1px solid #cfe4df; border-left: 3px solid var(--teal); border-radius: 8px; background: #f4faf8; }.scenario-icon { display: grid; width: 31px; height: 31px; flex-shrink: 0; place-items: center; border-radius: 7px; background: var(--teal-soft); color: var(--teal); }.scenario-icon svg { width: 16px; height: 16px; }.scenario-banner strong { display: block; color: var(--ink); font-size: 11px; }.scenario-banner p { margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.5; }.scenario-tag { margin-left: auto; padding: 4px 6px; border-radius: 4px; background: #e4f2ee; color: var(--teal); font-size: 8px; font-weight: 800; white-space: nowrap; }
@media (max-width: 520px) { .modal-card { padding: 21px 17px 17px; }.form-grid { grid-template-columns: 1fr; gap: 10px; margin-top: 17px; }.access-choices { grid-template-columns: 1fr; }.access-choice { min-height: 51px; align-items: center; }.access-choice small { margin-top: 2px; } }
@media (max-width: 760px) { .login-screen { padding: 24px 16px 30px; }.login-layout { display: flex; flex-direction: column; align-items: stretch; gap: 28px; min-height: auto; margin-top: 48px; }.login-intro h1 { font-size: 34px; }.login-intro > p { margin-top: 14px; font-size: 11px; }.login-flow { gap: 7px; margin-top: 22px; font-size: 8px; justify-content: space-between; }.login-flow b { width: 20px; height: 20px; }.login-flow svg { width: 11px; }.login-card { padding: 20px 17px; }.login-card h2 { font-size: 20px; }.demo-account-list { gap: 6px; } }
@media (max-width: 1050px) { .topbar { padding: 0 25px; }.page-wrap { padding: 30px 25px 40px; }.workspace-grid { grid-template-columns: 1fr; }.right-column { display: grid; grid-template-columns: 1fr 1fr; align-items: start; }.queue-panel { grid-column: 1 / -1; }.sidebar { width: 222px; } }
@media (max-width: 760px) { .app-shell { display: block; }.sidebar { display: none; }.topbar { height: 62px; padding: 0 16px; }.mobile-brand { display: flex; }.mobile-brand .brand-mark { width: 29px; height: 29px; }.mobile-brand .brand-mark svg { width: 15px; }.breadcrumb { display: none; }.topbar-actions { gap: 10px; }.mobile-menu-button { display: grid; }.shift-pill { display: none; }.top-avatar { width: 28px; height: 28px; }.mobile-nav:not([hidden]) { position: fixed; z-index: 30; inset: 0; display: block; }.mobile-nav-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; background: rgba(22, 44, 48, .28); }.mobile-nav-panel { position: relative; display: flex; flex-direction: column; width: min(82vw, 320px); height: 100%; padding: 20px 14px; background: #fff; box-shadow: 14px 0 36px rgba(21, 48, 53, .16); }.mobile-nav-heading { display: flex; flex-direction: column; gap: 4px; padding: 10px 10px 17px; border-bottom: 1px solid var(--line); color: var(--ink); }.mobile-nav-heading strong { font-size: 14px; }.mobile-nav-heading span { color: var(--muted); font-size: 9px; }.mobile-nav-item { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 10px; margin-top: 6px; border-radius: 6px; background: transparent; color: #5d7275; font-size: 11px; font-weight: 700; text-align: left; }.mobile-nav-item svg { width: 17px; height: 17px; }.mobile-nav-item.active { background: var(--teal-soft); color: var(--teal-deep); }.page-wrap { padding: 26px 16px 36px; }.page-heading { align-items: flex-start; gap: 18px; flex-direction: column; margin-bottom: 24px; }.page-heading h1 { font-size: 24px; }.metrics-grid { grid-template-columns: repeat(2, 1fr); gap: 9px; margin-bottom: 23px; }.metric-card { min-height: 117px; padding: 13px 13px 11px; }.metric-card > strong { font-size: 26px; margin: 14px 0 12px; }.metric-foot { gap: 7px; }.metric-foot small { font-size: 8px; }.workspace-grid { gap: 20px; }.right-column { display: flex; }.issue-card { align-items: flex-start; padding: 14px; gap: 10px; }.issue-icon { width: 34px; height: 34px; }.issue-main p { white-space: normal; line-height: 1.4; }.issue-meta { flex-wrap: wrap; gap: 5px 10px; }.issue-action { gap: 12px; }.confidence { font-size: 8px; }.line-progress { padding: 2px 12px; }.line-row { grid-template-columns: 112px minmax(55px, 1fr) 32px; gap: 7px; }.line-state { display: none; }.line-name { flex-wrap: wrap; gap: 5px; }.line-name small { width: 100%; margin-left: 12px; }.drop-actions { flex-direction: column; width: 100%; }.secondary-button, .ghost-button { width: 100%; }.inspection-item { grid-template-columns: 1fr; gap: 9px; }.inspection-item-fields { justify-content: flex-end; }.inspection-item-fields select, .inspection-item-fields input { flex: 1; }.inspection-evidence { margin-left: auto; }.toast { right: 16px; left: 16px; bottom: 16px; } }
@media (max-width: 1050px) { .agent-hero-grid { grid-template-columns: 1fr; } }
.inspection-evidence input { display: none; }
.frequency-chip { color: var(--teal); font-size: 9px; }
.inspection-frequency-group { border: 1px solid var(--line); border-radius: 7px; overflow: hidden; margin-bottom: 10px; }.inspection-frequency-group:last-child { margin-bottom: 0; }.inspection-frequency-head { display: flex; align-items: center; justify-content: space-between; padding: 9px 12px; background: #f0f7f6; color: var(--teal-deep); font-size: 11px; }.inspection-frequency-head span { color: var(--muted); font-size: 9px; }.empty-frequency { padding-bottom: 9px; }.empty-frequency > small { display: block; padding: 8px 12px 0; color: var(--muted-2); font-size: 9px; }
@media (max-width: 760px) { .agent-grid { grid-template-columns: 1fr; }.agent-section-head { align-items: flex-start; flex-direction: column; gap: 9px; }.agent-panel-top h2 { font-size: 18px; }.knowledge-footer { flex-direction: column; gap: 7px; }.agent-command-panel, .agent-health-panel, .agent-data-panel, .agent-trigger-panel, .agent-knowledge-panel, .agent-adoption-panel { padding: 16px; }.metric-detail-actions { width: 100%; justify-content: flex-end; }.metric-detail-actions .mini-button { width: auto; } }
@media (max-width: 760px) { .integration-grid { grid-template-columns: 1fr; }.scenario-banner { flex-wrap: wrap; }.scenario-banner > div { min-width: 0; flex: 1; }.scenario-tag { margin-left: 43px; }.work-modal { align-items: end; padding: 10px; overflow-y: auto; }.work-modal-card { width: 100%; max-height: calc(100vh - 20px); padding: 18px; }.work-modal-card.metric-detail-modal { max-height: min(calc(100dvh - 20px), 760px); }.modal-form-grid { grid-template-columns: 1fr; }.modal-actions { flex-wrap: wrap; }.modal-actions .secondary-button, .modal-actions .primary-button, .modal-actions .ghost-button { width: auto; }.row-actions .mini-button { width: auto; } }
@media (max-width: 680px) { .part-detail-layout { grid-template-columns: 1fr; }.part-detail-image { width: 100%; height: 150px; }.inventory-part-cell { gap: 7px; }.part-image-button { width: 38px; height: 32px; } }
.inspection-detail-row .inspection-detail-actions { min-width: 0; }
@media (max-width: 760px) {
  .inspection-detail-row, .metric-select-row {
    grid-template-columns: 28px 36px minmax(0, 1fr);
    min-width: 0;
    padding: 12px 10px;
  }
  .inspection-detail-row .inspection-project-select { grid-column: 2; }
  .inspection-detail-row .inspection-detail-main, .metric-select-row .metric-record-main { grid-column: 3; }
  .inspection-detail-row:not(:has(.inspection-project-select)), .metric-select-row:not(:has(.metric-record-select)) { grid-template-columns: 28px minmax(0, 1fr); }
  .inspection-detail-row:not(:has(.inspection-project-select)) .inspection-detail-main, .metric-select-row:not(:has(.metric-record-select)) .metric-record-main { grid-column: 2; }
  .inspection-detail-main, .metric-record-main { overflow-wrap: anywhere; }
  .inspection-detail-row .inspection-detail-main strong, .metric-record-main strong { font-size: 13px; }
  .inspection-detail-row .inspection-detail-main small, .metric-record-main small { font-size: 11px; line-height: 1.6; }
  /* Actions must span the row, not the 28px icon column. */
  .inspection-detail-row > .metric-detail-actions, .metric-select-row > .metric-detail-actions {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
    min-width: 0;
    gap: 8px;
    margin: 4px 0 0;
  }
  .inspection-detail-row > .metric-detail-actions > *, .metric-select-row > .metric-detail-actions > * {
    flex: 1 1 110px;
    min-width: 0;
    max-width: 100%;
  }
  .inspection-detail-row .inspection-frequency-control { flex-basis: 100%; font-size: 12px; }
  .inspection-frequency-control select { flex: 1; min-width: 0; min-height: 44px; font-size: 13px; }
  .inspection-detail-row .mini-button, .metric-select-row .mini-button { min-height: 44px; font-size: 12px; white-space: normal; }
  .metric-detail-actions > .muted-cell { font-size: 11px; line-height: 1.5; }
  .inspection-project-select, .metric-record-select { min-height: 44px; padding-top: 0; }
  .inspection-project-select input, .metric-record-select input { width: 18px; height: 18px; }
  .inspection-selection-count { flex: 1 0 100%; }
}
.capture-target { display: flex; align-items: center; gap: 5px; margin-top: 9px; color: var(--teal-deep); font-size: 9px; font-weight: 700; line-height: 1.45; }.capture-target svg { width: 12px; height: 12px; flex-shrink: 0; }
.notification-modal { width: min(100%, 520px); }
.notification-list { display: flex; flex-direction: column; gap: 7px; }
.notification-row { display: flex; align-items: center; gap: 9px; width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 7px; background: #fbfdfc; color: var(--ink); text-align: left; }
.notification-row:hover { border-color: #9ac6bc; background: var(--teal-soft); }
.notification-icon { display: grid; width: 29px; height: 29px; flex: 0 0 auto; place-items: center; border-radius: 6px; }
.notification-icon svg { width: 14px; height: 14px; }
.notification-icon.teal { background: var(--teal-soft); color: var(--teal); }
.notification-icon.red { background: var(--red-soft); color: var(--red); }
.notification-icon.amber { background: var(--amber-soft); color: var(--amber); }
.notification-icon.blue { background: var(--blue-soft); color: var(--blue); }
.notification-row > span:nth-child(2) { min-width: 0; flex: 1; }
.notification-row strong, .notification-row small { display: block; }
.notification-row strong { font-size: 10px; }
.notification-row small { margin-top: 3px; color: var(--muted); font-size: 9px; line-height: 1.4; }
.notification-arrow { width: 13px; height: 13px; flex: 0 0 auto; color: var(--muted-2); }
.part-detail-layout > .detail-stack > div { grid-template-columns: 96px minmax(0, 1fr); }
.part-detail-layout > .detail-stack strong { min-width: 0; overflow-wrap: break-word; word-break: normal; white-space: normal; }
.part-detail-layout { grid-template-columns: 220px minmax(0, 1fr); }
.collab-details { display: flex; flex-direction: column; gap: 4px; margin: -2px 0 10px; padding: 7px 8px; border-radius: 5px; background: #fff8f0; }.collab-details span { display: flex; align-items: flex-start; gap: 4px; color: #a26b35; font-size: 8px; line-height: 1.4; }.collab-details svg { width: 10px; height: 10px; flex-shrink: 0; margin-top: 1px; }
.asset-row-actions { gap: 5px; }.asset-row-actions .mini-button { padding: 0 8px; }.work-modal-card.work-modal-wide { width: min(100%, 920px); }.two-window-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; margin-top: 17px; }.workflow-window { min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fbfdfc; }.discovery-window { border-top: 3px solid var(--teal); }.resolution-window { border-top: 3px solid var(--amber); }.workflow-window-head { display: flex; align-items: center; gap: 9px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }.workflow-window-icon { display: grid; width: 29px; height: 29px; flex-shrink: 0; place-items: center; border-radius: 6px; background: var(--teal-soft); color: var(--teal); }.workflow-window-icon.amber { background: var(--amber-soft); color: var(--amber); }.workflow-window-icon svg { width: 15px; height: 15px; }.workflow-window-head strong, .workflow-window-head small { display: block; }.workflow-window-head strong { color: var(--ink); font-size: 11px; }.workflow-window-head small { margin-top: 3px; color: var(--muted-2); font-size: 8px; }.workflow-stage { display: grid; grid-template-columns: 23px minmax(0, 1fr); gap: 8px; padding: 13px 0; border-bottom: 1px solid #edf1f0; }.workflow-stage:last-child { padding-bottom: 0; border-bottom: 0; }.workflow-number { display: grid; width: 23px; height: 23px; place-items: center; border-radius: 50%; background: #e9f3f0; color: var(--teal); font-size: 9px; font-weight: 800; }.workflow-stage-copy { min-width: 0; }.workflow-stage-copy > div { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }.workflow-stage-copy strong { color: var(--ink); font-size: 10px; }.workflow-stage-copy p { margin-top: 5px; color: var(--muted); font-size: 9px; line-height: 1.5; }.workflow-state { padding: 3px 5px; border-radius: 4px; font-size: 8px; font-weight: 800; white-space: nowrap; }.workflow-state.done { background: #e8f5ef; color: #3f926f; }.workflow-state.active { background: var(--teal-soft); color: var(--teal); }.workflow-state.waiting { background: var(--amber-soft); color: var(--amber); }.workflow-stage-actions { display: flex; flex-wrap: wrap; gap: 6px; grid-column: 2; }.workflow-stage-actions .mini-button { width: auto; }.workflow-empty { align-self: center; color: var(--muted-2); font-size: 8px; line-height: 1.4; }
@media (max-width: 760px) { .two-window-grid { grid-template-columns: 1fr; }.work-modal-card.work-modal-wide { width: 100%; }.asset-row-actions { min-width: 250px; }.workflow-stage-actions .mini-button { width: auto; } }
.two-conversation-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; margin-top: 17px; }.conversation-window { display: flex; min-width: 0; flex-direction: column; min-height: 390px; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fbfdfc; }.discovery-conversation { border-top: 3px solid var(--teal); }.resolution-conversation { border-top: 3px solid var(--amber); }.conversation-head { display: flex; align-items: center; gap: 9px; padding-bottom: 11px; border-bottom: 1px solid var(--line); }.conversation-head > div { min-width: 0; }.conversation-head strong, .conversation-head small { display: block; }.conversation-head strong { color: var(--ink); font-size: 11px; }.conversation-head small { margin-top: 3px; color: var(--muted-2); font-size: 8px; }.conversation-online { margin-left: auto; padding: 3px 5px; border-radius: 4px; background: #e8f5ef; color: #3f926f; font-size: 8px; font-weight: 800; }.chat-stream { display: flex; flex: 1; flex-direction: column; gap: 9px; min-height: 185px; max-height: 250px; overflow-y: auto; padding: 13px 0; }.chat-bubble { max-width: 91%; padding: 9px 10px; border-radius: 8px; }.chat-bubble.agent { align-self: flex-start; border: 1px solid #dce9e6; background: #fff; }.chat-bubble.user { align-self: flex-end; background: var(--teal-soft); }.chat-bubble span { display: block; color: var(--muted-2); font-size: 8px; font-weight: 800; }.chat-bubble p { margin-top: 4px; color: #506669; font-size: 9px; line-height: 1.55; }.conversation-form { display: flex; align-items: center; gap: 6px; padding-top: 10px; border-top: 1px solid var(--line); }.conversation-form input { min-width: 0; flex: 1; height: 31px; padding: 0 9px; border: 1px solid #d7e4e1; border-radius: 5px; outline: 0; background: #fff; color: var(--ink); font: inherit; font-size: 9px; }.conversation-form input:focus { border-color: #77afa3; box-shadow: 0 0 0 3px rgba(14,101,112,.08); }.conversation-form .icon-button { width: 31px; height: 31px; flex-shrink: 0; }.conversation-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }.conversation-actions .mini-button { width: auto; }.conversation-window .workflow-window-icon { width: 29px; height: 29px; }.conversation-window .workflow-window-icon svg { width: 15px; height: 15px; }
@media (max-width: 760px) { .table-panel:has(.asset-table) { overflow: visible; }.asset-table { min-width: 0; }.asset-table .data-head { display: none; }.asset-table .data-row { grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px 10px; min-height: 0; padding: 14px; }.asset-table .data-row > span:nth-child(1) { grid-column: 1 / -1; }.asset-table .data-row > span:nth-child(2) { grid-column: 1; }.asset-table .data-row > span:nth-child(3), .asset-table .data-row > span:nth-child(4) { justify-self: end; }.asset-table .data-row > span:nth-child(2)::before { content: "位置"; display: block; margin-bottom: 3px; color: var(--muted-2); font-size: 8px; font-weight: 700; }.asset-table .row-actions { grid-column: 1 / -1; width: 100%; min-width: 0; flex-wrap: wrap; padding-top: 4px; }.asset-table .asset-row-actions .mini-button { width: auto; min-width: 0; padding: 0 9px; } }
@media (max-width: 760px) { .two-conversation-grid { grid-template-columns: 1fr; }.conversation-window { min-height: 340px; }.chat-stream { max-height: 210px; } }
.agent-collab-panel { margin: 4px 0 26px; padding: 18px; border: 1px solid #d6e8e3; border-radius: 9px; background: #f8fbfa; }.collab-head { margin-bottom: 15px; }.collab-head h2 { margin-top: 7px; font-size: 17px; }.collab-head > div > span:last-child { display: block; margin-top: 5px; color: var(--muted); font-size: 10px; }.collab-scope { align-self: center; padding: 5px 7px; border-radius: 4px; background: #e7f2ef; color: var(--teal); font-size: 9px; font-weight: 700; }.agent-collab-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }.collab-agent { padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }.collab-agent-top { display: flex; align-items: center; gap: 8px; }.collab-agent-top > div { min-width: 0; flex: 1; }.collab-avatar { display: grid; width: 30px; height: 30px; flex-shrink: 0; place-items: center; border-radius: 7px; background: var(--teal-soft); color: var(--teal); }.collab-avatar.amber { background: var(--amber-soft); color: var(--amber); }.collab-avatar svg { width: 15px; height: 15px; }.collab-agent-top strong, .collab-agent-top small { display: block; }.collab-agent-top strong { color: var(--ink); font-size: 10px; }.collab-agent-top small { margin-top: 3px; color: var(--muted-2); font-size: 8px; }.collab-status { padding: 3px 5px; border-radius: 4px; font-size: 8px; font-weight: 800; white-space: nowrap; }.collab-status.checked { background: #e8f5ef; color: #3f926f; }.collab-status.needs-action { background: var(--red-soft); color: var(--red); }.collab-status.pending { background: var(--amber-soft); color: var(--amber); }.collab-agent > p { min-height: 29px; margin: 11px 0; color: var(--muted); font-size: 9px; line-height: 1.5; }.collab-agent .mini-button { width: auto; }.collab-last { display: block; margin-top: 9px; color: var(--muted-2); font-size: 8px; }.collab-modules { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--line); }.collab-modules > strong { color: var(--ink); font-size: 10px; }.collab-modules > div { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 9px; }.collab-module { display: inline-flex; align-items: center; gap: 5px; padding: 5px 7px; border-radius: 5px; background: #edf3f1; color: #627577; font-size: 8px; }.collab-module b { color: #899898; font-size: 7px; }.collab-module.checked { background: #e8f5ef; color: #3f926f; }.collab-module.checked b { color: #4a9b7e; }.collab-module.needs-action { background: var(--red-soft); color: var(--red); }.collab-module.needs-action b { color: var(--red); }
@media (max-width: 760px) { .agent-collab-grid { grid-template-columns: 1fr; }.agent-collab-panel { padding: 15px; }.collab-head { align-items: flex-start; flex-direction: column; gap: 9px; }.collab-scope { align-self: flex-start; } }
.status-badge.cancelled { background: #f4eeee; color: #9a6262; }

/* Keep metric detail dialogs on one predictable touch scroll surface. */
.work-modal-card {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  scrollbar-width: thin;
}
.metric-detail-modal .metric-detail-list {
  flex: 0 0 auto;
  min-height: 120px;
  max-height: none;
  overflow: visible;
  padding: 2px 4px 12px 0;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable;
}
.metric-detail-modal .modal-actions {
  /* Keep the footer in normal flow so it never covers the last project. */
  position: static;
  flex-wrap: wrap;
  margin-right: 0;
  margin-left: 0;
  padding: 12px 0 2px;
  border-top: 1px solid var(--line);
  background: #fff;
}
.metric-detail-modal .inspection-canceled-list { max-height: none; overflow: hidden; }
.inspection-canceled-list > summary { list-style: none; cursor: pointer; }
.inspection-canceled-list > summary::-webkit-details-marker { display: none; }
.inspection-canceled-list[open] { max-height: 145px; overflow-y: auto; }

@media (max-width: 760px) {
  .work-modal {
    padding: max(10px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
    overflow: hidden;
  }
  .work-modal-card.metric-detail-modal {
    max-height: calc(100vh - 20px);
    max-height: calc(100dvh - max(10px, env(safe-area-inset-top)) - max(10px, env(safe-area-inset-bottom)));
    min-width: 0;
    padding: 16px 12px;
  }
  .metric-detail-modal h2 { padding-right: 36px; }
  .metric-detail-modal .modal-close { width: 44px; height: 44px; top: 6px; right: 6px; }
  .metric-detail-modal .modal-intro { font-size: 12px; line-height: 1.6; }
  .metric-detail-modal .metric-detail-list { min-width: 0; padding-right: 0; }
  .metric-detail-modal .modal-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
  .metric-detail-modal .modal-actions > button { min-width: 0; min-height: 44px; width: 100%; white-space: normal; font-size: 12px; }
  .metric-detail-modal .modal-actions > .danger-button { grid-column: 1 / -1; }
  .metric-detail-modal .inspection-selection-count { grid-column: 1 / -1; grid-row: 1; white-space: normal; font-size: 11px; }
}
