/* 西创全域自动化 · Seatrust Hub
   色板：海军蓝 Pantone 295C #002855 · 西创绿 Pantone 368C #78BE20
   本文件服务内部作业界面（密、可读），不是营销站 */

:root {
  --navy: #002855;
  --navy-deep: #001A36;
  --navy-mid: #0A3A6B;
  --navy-soft: #1C4F82;
  --green: #78BE20;
  --green-bright: #8FD42A;
  --green-deep: #4F8A12;
  --cream: #F3EFE6;
  --paper: #F4F0E8;
  --white: #FFFFFF;
  --ink: #161C24;
  --ink-2: #3D4754;
  --ink-3: #6B7380;
  --line: #DDD6C8;
  --line-strong: #C9BFAE;
  --ok: #1F6B4A;
  --ok-bg: #E7F3EC;
  --warn: #8A5A12;
  --warn-bg: #F8F0E0;
  --info: #1C3D68;
  --info-bg: #E8EEF6;
  --err: #A33A2C;
  --err-bg: #F8EBE8;
  --muted: #8A8478;
  --header-h: 56px;
  --radius: 3px;
  --shadow: 0 8px 28px rgba(0, 40, 85, 0.08);
  --shadow-lg: 0 18px 50px rgba(0, 40, 85, 0.16);
  --font: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-doc: "Times New Roman", Times, "Noto Serif SC", "Songti SC", serif;
  --font-doc-sans: Arial, "Noto Sans SC", Helvetica, sans-serif;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--font);
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--ink);
  background: var(--paper);
  min-height: 100vh;
}

img, svg { max-width: 100%; display: block; }

a { color: var(--navy); text-decoration: none; }
a:hover { color: var(--green-deep); }

button, input, select, textarea { font-family: inherit; font-size: inherit; color: inherit; }

:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 2px;
}

.skip-link {
  position: absolute;
  left: 12px;
  top: -48px;
  z-index: 1000;
  background: var(--green);
  color: var(--navy);
  padding: 8px 14px;
  font-weight: 600;
}
.skip-link:focus { top: 12px; }

/* ========== Header ========== */
.app-header {
  position: sticky;
  top: 0;
  z-index: 200;
  height: var(--header-h);
  background: var(--navy);
  color: var(--cream);
  border-bottom: 1px solid rgba(120, 190, 32, 0.28);
}
.header-inner {
  height: 100%;
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 0 20px;
  max-width: 1440px;
  margin: 0 auto;
  min-width: 0;
  width: 100%;
}
.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--cream);
  flex-shrink: 1;
  min-width: 0;
}
.brand:hover { color: var(--cream); }
.brand-mark { width: 32px; height: 32px; flex-shrink: 0; }
.brand-logo {
  height: 34px;
  width: auto;
  max-width: 160px;
  object-fit: contain;
  object-position: left center;
  flex-shrink: 0;
}
.brand-text { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; overflow: hidden; }
.brand-text strong { font-size: 13px; font-weight: 650; letter-spacing: 0.02em; }
.brand-text span { font-size: 11px; color: var(--green-bright); letter-spacing: 0.12em; }

.app-nav {
  display: flex;
  align-items: stretch;
  gap: 2px;
  flex: 1;
  min-width: 0;
  height: var(--header-h);
}
.app-nav a {
  color: rgba(243, 239, 230, 0.78);
  padding: 0 11px;
  display: flex;
  align-items: center;
  font-size: 13px;
  font-weight: 500;
  border-bottom: 2px solid transparent;
  white-space: nowrap;
}
.app-nav a:hover { color: var(--cream); }
.app-nav a.is-active {
  color: var(--cream);
  border-bottom-color: var(--green);
}

.header-aside {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-left: auto;
  flex-shrink: 1;
  min-width: 0;
}
.sample-badge {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border: 1px solid rgba(120, 190, 32, 0.55);
  color: var(--green-bright);
  font-size: 11px;
  letter-spacing: 0.14em;
  font-weight: 600;
}
.header-settings {
  color: var(--cream);
  font-size: 13px;
  font-weight: 500;
  padding: 4px 8px;
}
.header-settings:hover { color: var(--green-bright); }
.header-settings.is-active { color: var(--green-bright); }

.nav-toggle {
  display: none;
  background: none;
  border: 0;
  width: 36px;
  height: 36px;
  padding: 8px;
  cursor: pointer;
  margin-left: auto;
  flex-shrink: 0;
}
.nav-toggle span {
  display: block;
  height: 2px;
  background: var(--cream);
  margin: 5px 0;
}

/* ========== Layout ========== */
.app-main {
  max-width: 1440px;
  margin: 0 auto;
  padding: 20px 20px 64px;
}

.page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.page-head h1 {
  margin: 0;
  font-size: 20px;
  font-weight: 650;
  letter-spacing: 0.02em;
  color: var(--navy);
}
.page-head .sub {
  margin: 4px 0 0;
  color: var(--ink-3);
  font-size: 12.5px;
}
.page-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

.crumb {
  font-size: 12px;
  color: var(--ink-3);
  margin-bottom: 6px;
}
.crumb a { color: var(--navy-soft); }
.crumb a:hover { color: var(--green-deep); }

/* ========== Buttons ========== */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 32px;
  padding: 0 12px;
  background: var(--navy);
  color: var(--cream);
  border: 1px solid var(--navy);
  border-radius: var(--radius);
  font-weight: 550;
  cursor: pointer;
  white-space: nowrap;
}
.btn:hover { background: var(--navy-mid); color: var(--cream); }
.btn-copper {
  background: var(--green);
  border-color: var(--green);
  color: var(--navy-deep);
}
.btn-copper:hover { background: var(--green-bright); color: var(--navy-deep); }
.btn-ghost {
  background: transparent;
  color: var(--navy);
  border-color: var(--line-strong);
}
.btn-ghost:hover { border-color: var(--navy); background: var(--white); color: var(--navy); }
.btn-danger {
  background: transparent;
  color: var(--err);
  border-color: #e0b8b2;
}
.btn-danger:hover { background: var(--err-bg); }
.btn-sm { height: 28px; padding: 0 10px; font-size: 12.5px; }
.btn:disabled { opacity: 0.45; cursor: not-allowed; }

/* ========== Cards / panels ========== */
.card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.card-pad { padding: 16px 18px; }
.card + .card { margin-top: 14px; }

.panel-title {
  font-size: 13px;
  font-weight: 650;
  color: var(--navy);
  margin: 0 0 12px;
  letter-spacing: 0.04em;
}

/* ========== KPI ========== */
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 18px;
}
.kpi {
  background: var(--white);
  border: 1px solid var(--line);
  padding: 14px 16px 12px;
  position: relative;
  overflow: hidden;
}
.kpi::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--green);
}
.kpi .label {
  font-size: 12px;
  color: var(--ink-3);
  letter-spacing: 0.08em;
}
.kpi .value {
  font-size: 22px;
  font-weight: 700;
  color: var(--navy);
  margin-top: 4px;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.kpi .hint { font-size: 11.5px; color: var(--muted); margin-top: 2px; }

/* ========== Kanban / pipeline ========== */
.pipeline-wrap {
  position: relative;
  min-width: 0;
  max-width: 100%;
  margin-bottom: 18px;
}
.pipeline {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  padding-bottom: 8px;
  min-width: 0;
}
.pipe-col {
  flex: 0 0 168px;
  background: rgba(255,255,255,0.55);
  border: 1px solid var(--line);
  min-height: 140px;
}
.pipe-col h3 {
  margin: 0;
  padding: 8px 10px;
  font-size: 11.5px;
  font-weight: 650;
  letter-spacing: 0.06em;
  color: var(--navy);
  background: var(--cream);
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
}
.pipe-col h3 span { color: var(--ink-3); font-weight: 500; }
.pipe-card {
  display: block;
  margin: 8px;
  padding: 8px 10px;
  background: var(--white);
  border: 1px solid var(--line);
  border-left: 3px solid var(--green);
  color: var(--ink);
  font-size: 12px;
}
.pipe-card:hover { border-color: var(--green); color: var(--ink); }
.pipe-card .no { font-weight: 650; color: var(--navy); }
.pipe-card .meta { color: var(--ink-3); margin-top: 2px; font-size: 11.5px; }

.stepper {
  display: flex;
  gap: 0;
  overflow-x: auto;
  margin: 8px 0 16px;
  padding: 4px 0;
}
.step {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1;
  min-width: 72px;
  font-size: 11.5px;
  color: var(--ink-3);
}
.step .dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--line-strong);
  flex-shrink: 0;
}
.step.is-done .dot { background: var(--ok); }
.step.is-current .dot { background: var(--green); box-shadow: 0 0 0 3px rgba(120,190,32,0.25); }
.step.is-done, .step.is-current { color: var(--navy); font-weight: 600; }
.step .bar {
  flex: 1;
  height: 1px;
  background: var(--line);
  margin: 0 4px 0 2px;
}
.step:last-child .bar { display: none; }

/* ========== Tables ========== */
.toolbar {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.search {
  height: 32px;
  border: 1px solid var(--line-strong);
  background: var(--white);
  padding: 0 10px;
  min-width: 280px;
  max-height: min(70vh, 520px);
  overflow: auto;
  border-radius: var(--radius);
}
.search:focus { border-color: var(--navy-soft); outline: none; }
.filter-select {
  height: 32px;
  border: 1px solid var(--line-strong);
  background: var(--white);
  padding: 0 8px;
  border-radius: var(--radius);
}

.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
table.data {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
table.data th {
  text-align: left;
  background: var(--navy);
  color: var(--cream);
  font-weight: 550;
  font-size: 12px;
  letter-spacing: 0.04em;
  padding: 8px 10px;
  white-space: nowrap;
}
table.data td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}
table.data tbody tr:hover td { background: #faf7f1; }
table.data a.row-link { font-weight: 600; color: var(--navy); }
table.data .num { font-variant-numeric: tabular-nums; text-align: right; }
table.data th.num { text-align: right; }
table.data .actions { white-space: nowrap; }
table.data .actions .btn { margin-right: 4px; }

/* ========== Status pills ========== */
.pill {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.04em;
  border-radius: 11px;
  background: var(--cream);
  color: var(--ink-2);
  white-space: nowrap;
}
.pill-draft { background: #eeeae2; color: var(--ink-2); }
.pill-sent, .pill-info { background: var(--info-bg); color: var(--info); }
.pill-ok, .pill-accepted, .pill-ready, .pill-arrived, .pill-paid { background: var(--ok-bg); color: var(--ok); }
.pill-warn, .pill-queued, .pill-booking { background: var(--warn-bg); color: var(--warn); }
.pill-run, .pill-progress, .pill-production, .pill-stuffed, .pill-sailed { background: #e8f4d4; color: var(--green-deep); }
.pill-err { background: var(--err-bg); color: var(--err); }

/* ========== Forms ========== */
.form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px 16px;
}
.form-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
.field { display: flex; flex-direction: column; gap: 4px; }
.field.span-2 { grid-column: span 2; }
.field.span-3 { grid-column: 1 / -1; }
.field label { font-size: 12px; font-weight: 600; color: var(--ink-2); }
.field .req { color: var(--err); margin-left: 2px; }
.field input,
.field select,
.field textarea {
  height: 34px;
  border: 1px solid var(--line-strong);
  background: var(--white);
  padding: 0 10px;
  border-radius: var(--radius);
}
.field input[type="checkbox"],
.field input[type="radio"] {
  height: auto;
  width: auto;
  border: none;
  padding: 0;
  background: none;
  box-shadow: none;
}
.pw-wrap { display: flex; flex-direction: column; gap: 6px; }
.pw-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-2);
  cursor: pointer;
  user-select: none;
}
.pw-toggle input { margin: 0; }
.drive-perm { display: flex; flex-direction: column; gap: 8px; }
.drive-perm .check {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-weight: 500;
  color: var(--ink);
  cursor: pointer;
}
.field textarea { height: auto; min-height: 72px; padding: 8px 10px; resize: vertical; }
.field input:focus,
.field select:focus,
.field textarea:focus {
  outline: none;
  border-color: var(--navy-soft);
  box-shadow: 0 0 0 3px rgba(28, 61, 104, 0.12);
}
.field.is-invalid input,
.field.is-invalid select,
.field.is-invalid textarea { border-color: var(--err); }
.field .err-msg { display: none; color: var(--err); font-size: 11.5px; }
.field.is-invalid .err-msg { display: block; }
.help { font-size: 11.5px; color: var(--ink-3); }

.lines-table input { height: 30px; width: 100%; border: 1px solid var(--line); padding: 0 6px; background: var(--white); }
.lines-table select { height: 30px; width: 100%; border: 1px solid var(--line); background: var(--white); }

/* ========== Detail ========== */
.detail-grid {
  display: grid;
  grid-template-columns: 1.4fr 0.9fr;
  gap: 14px;
}
.kv { display: grid; grid-template-columns: 92px 1fr; gap: 6px 10px; font-size: 13px; }
.kv dt { color: var(--ink-3); }
.kv dd { margin: 0; font-weight: 550; }

.progress {
  height: 8px;
  background: var(--cream);
  border: 1px solid var(--line);
  overflow: hidden;
}
.progress > span {
  display: block;
  height: 100%;
  background: var(--green);
}

.steps-list { list-style: none; margin: 0; padding: 0; }
.steps-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
}
.steps-list li:last-child { border-bottom: 0; }
.steps-list .name { font-weight: 600; width: 56px; }
.steps-list .dates { color: var(--ink-3); font-size: 12px; flex: 1; }

.shortcut-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.shortcut {
  display: block;
  padding: 12px 14px;
  background: var(--white);
  border: 1px solid var(--line);
  color: var(--ink);
}
.shortcut:hover { border-color: var(--green); color: var(--ink); }
.shortcut strong { display: block; color: var(--navy); font-size: 13.5px; }
.shortcut span { font-size: 12px; color: var(--ink-3); }

.empty {
  text-align: center;
  padding: 40px 16px;
  color: var(--ink-3);
  background: var(--white);
  border: 1px dashed var(--line-strong);
}
.empty p { margin: 0 0 12px; }

.note-example {
  font-size: 11.5px;
  color: var(--muted);
  margin: 8px 0 0;
}

/* ========== Modal ========== */
.modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(6, 19, 33, 0.45);
  z-index: 400;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 40px 16px 24px;
  overflow: auto;
}
.modal {
  background: var(--white);
  width: min(720px, 100%);
  max-width: calc(100vw - 16px);
  max-height: min(90dvh, calc(100dvh - 64px), calc(100vh - 64px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid var(--line-strong);
  box-shadow: var(--shadow-lg);
}
.modal.wide { width: min(960px, 100%); max-width: calc(100vw - 16px); }
.modal > form,
#modal-form {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  background: var(--white);
}
.modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 0 0 auto;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  background: var(--navy);
  color: var(--cream);
}
.modal-head h2 { margin: 0; font-size: 15px; font-weight: 650; }
.modal-close {
  background: none;
  border: 0;
  color: var(--cream);
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  padding: 4px 8px;
}
.modal-body {
  flex: 1 1 auto;
  min-height: 0;
  padding: 16px;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--white);
}
.modal-foot {
  display: flex;
  justify-content: flex-end;
  flex: 0 0 auto;
  gap: 8px;
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  background: var(--cream);
}

/* ========== Toast ========== */
.toast-root {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 500;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.toast {
  background: var(--navy);
  color: var(--cream);
  padding: 10px 14px;
  min-width: 280px;
  max-height: min(70vh, 520px);
  overflow: auto;
  box-shadow: var(--shadow-lg);
  font-size: 13px;
}
.toast.is-err { background: var(--err); }

/* ========== Documents ========== */
.doc-toolbar {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.doc-stage {
  background: #e6e0d4;
  padding: 24px 12px 48px;
  display: flex;
  justify-content: center;
}
.paper {
  width: 210mm;
  max-width: 100%;
  min-height: 280mm;
  background: #fffdf8;
  color: #111;
  padding: 16mm 16mm 18mm;
  box-shadow: 0 12px 40px rgba(0,40,85,0.18);
  font-family: var(--font-doc);
  font-size: 12.5px;
  line-height: 1.45;
}
.paper * { font-family: inherit; }
.paper table { font-family: var(--font-doc-sans); font-size: 11.5px; }

.doc-letterhead {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 2.4px solid #002855;
  padding-bottom: 10px;
  margin-bottom: 12px;
}
.doc-letterhead .co-en {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #002855;
  margin: 0;
}
.doc-letterhead .co-zh {
  font-size: 13px;
  color: #002855;
  margin: 2px 0 6px;
  font-family: var(--font);
}
.doc-letterhead .co-addr {
  font-size: 10.5px;
  color: #333;
  line-height: 1.4;
  font-family: var(--font-doc-sans);
}
.doc-mark {
  width: 148px;
  height: auto;
  max-height: 52px;
  object-fit: contain;
  flex-shrink: 0;
}
.doc-title {
  text-align: center;
  font-size: 18px;
  letter-spacing: 0.18em;
  font-weight: 700;
  color: #002855;
  margin: 8px 0 12px;
  text-transform: uppercase;
}
.doc-meta {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 10px;
}
.doc-meta td { padding: 2px 6px 2px 0; vertical-align: top; }
.doc-meta .lbl { color: #444; width: 140px; }
.doc-box {
  border: 1px solid #222;
  padding: 6px 8px;
  margin-bottom: 10px;
}
.doc-box .cap {
  font-size: 10px;
  letter-spacing: 0.08em;
  color: #444;
  font-family: var(--font-doc-sans);
  margin-bottom: 2px;
}
.doc-split { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

.doc-items {
  width: 100%;
  border-collapse: collapse;
  margin: 8px 0 10px;
}
.doc-items th, .doc-items td {
  border: 1px solid #222;
  padding: 5px 6px;
  vertical-align: top;
}
.doc-items th {
  background: #002855;
  color: #F3EFE6;
  font-weight: 600;
  font-size: 10.5px;
  letter-spacing: 0.04em;
}
.doc-items td.r, .doc-items th.r { text-align: right; }
.doc-items td.c, .doc-items th.c { text-align: center; }
.doc-items tfoot td { font-weight: 700; }

.doc-words { margin: 4px 0 10px; font-size: 12px; }
.doc-clause { margin: 8px 0; font-size: 12px; }
.doc-clause h4 { margin: 0 0 2px; font-size: 12px; }
.doc-sign {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 28px;
}
.doc-sign .line {
  border-top: 1px solid #222;
  margin-top: 48px;
  padding-top: 6px;
  font-size: 11.5px;
}
.doc-stamp {
  font-size: 10.5px;
  color: #666;
  font-family: var(--font-doc-sans);
}
.doc-notes-cn {
  margin-top: 16px;
  padding-top: 8px;
  border-top: 1px dashed #bbb;
  font-family: var(--font);
  font-size: 11px;
  color: #555;
}
.marks {
  font-family: var(--font-doc-sans);
  white-space: pre;
  border: 1px solid #222;
  padding: 8px 12px;
  display: inline-block;
  line-height: 1.35;
  font-size: 12px;
}

.doc-list .doc-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  background: var(--white);
  margin-bottom: 8px;
}
.doc-card .kind { font-weight: 650; color: var(--navy); }

/* ========== Settings ========== */
.settings-block + .settings-block { margin-top: 18px; }
.settings-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.org-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-bottom: 18px;
}
.org-dept .panel-title { margin-bottom: 10px; }
.org-seat {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 10px;
  padding: 8px 0 10px;
  border-bottom: 1px solid var(--line);
}
.org-seat-label { font-size: 12px; color: var(--ink-3); min-width: 2.5em; }
.org-seat.is-vacant strong { color: var(--muted); font-weight: 600; }
.org-cap {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--navy);
  border: 1px solid var(--navy-soft);
  padding: 0 6px;
  line-height: 1.6;
}
.org-sub { margin: 12px 0 6px; font-size: 12.5px; color: var(--ink-2); font-weight: 650; }
.org-members { list-style: none; margin: 0; padding: 0; }
.org-members li {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  padding: 5px 0;
  border-bottom: 1px solid var(--line);
}
.org-members li span { color: var(--ink-3); font-size: 12px; }
@media (max-width: 860px) {
  .org-grid { grid-template-columns: 1fr; }
}

/* ========== Responsive ========== */
@media (max-width: 1100px) {
  .kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .detail-grid { grid-template-columns: 1fr; }
  .shortcut-grid { grid-template-columns: repeat(2, 1fr); }
  .form-grid.cols-3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .nav-toggle { display: block; }
  .app-nav {
    display: none;
    position: absolute;
    top: var(--header-h);
    left: 0; right: 0;
    background: var(--navy-deep);
    flex-direction: column;
    height: auto;
    padding: 8px 0 12px;
    z-index: 210;
  }
  .app-nav.is-open { display: flex; }
  .app-nav a { height: 40px; padding: 0 20px; border-bottom: 0; }
  .header-inner { gap: 10px; }
  .form-grid, .form-grid.cols-3, .doc-split, .doc-sign { grid-template-columns: 1fr; }
  .field.span-2 { grid-column: auto; }
  .kpi-grid { grid-template-columns: 1fr 1fr; }
  .paper { padding: 12px; min-height: 0; }
}
@media (max-width: 560px) {
  .shortcut-grid { grid-template-columns: 1fr; }
  .search { min-width: 0; width: 100%; }
}
@media (max-width: 400px) {
  .kpi-grid { grid-template-columns: 1fr; }
}

/* ========== Print ========== */
@media print {
  @page { size: A4; margin: 10mm 12mm; }
  html, body {
    background: #fff !important;
    font-size: 12px;
  }
  .skip-link, .app-header, .doc-toolbar, .toast-root, .modal-backdrop,
  .sample-badge, .header-aside, .note-example, .doc-notes-cn, .no-print,
  .mail-banner, .tech-banner, .portal-chip, .header-switch {
    display: none !important;
  }
  .app-main { max-width: none; padding: 0; }
  .doc-stage {
    background: transparent;
    padding: 0;
    display: block;
  }
  .paper {
    width: auto;
    min-height: 0;
    box-shadow: none;
    padding: 0;
    background: #fff;
  }
  .page-head { display: none; }
  a { color: inherit; }
}


/* ========== Portal chooser ========== */
.portal-chip {
  font-size: 11px;
  letter-spacing: 0.16em;
  color: var(--green-bright);
  border-left: 1px solid rgba(120, 190, 32, 0.35);
  padding-left: 12px;
  font-weight: 650;
  white-space: nowrap;
}
.header-switch {
  color: rgba(243, 239, 230, 0.78);
  font-size: 12.5px;
  font-weight: 500;
  padding: 4px 6px;
}
.header-switch:hover { color: var(--green-bright); }

.app-header.is-chooser .app-nav { display: none; }

.portal-home {
  max-width: 1080px;
  margin: 12px auto 0;
}
.portal-kicker {
  margin: 0 0 6px;
  font-size: 11.5px;
  letter-spacing: 0.18em;
  color: var(--green-deep);
  font-weight: 650;
}
.portal-home h1 {
  margin: 0;
  font-size: 28px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: 0.04em;
}
.portal-home > .sub {
  margin: 8px 0 22px;
  color: var(--ink-3);
  max-width: 42em;
}
.portal-doors {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.portal-door {
  display: flex;
  flex-direction: column;
  min-height: 280px;
  padding: 22px 22px 18px;
  background: var(--navy);
  color: var(--cream);
  border: 1px solid var(--navy-deep);
  box-shadow: var(--shadow);
  position: relative;
  overflow: hidden;
}
.portal-door::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(120,190,32,0.08), transparent 42%),
    repeating-linear-gradient(90deg, transparent 0 31px, rgba(243,239,230,0.03) 31px 32px);
  pointer-events: none;
}
.portal-door::after {
  content: "";
  position: absolute;
  left: 0; top: 0; right: 0;
  height: 3px;
  background: var(--green);
}
.portal-door:hover { color: var(--cream); border-color: var(--green); }
.portal-door .door-idx {
  font-size: 11px;
  letter-spacing: 0.2em;
  color: var(--green-bright);
  font-weight: 650;
}
.portal-door strong {
  display: block;
  margin-top: 18px;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.06em;
  position: relative;
}
.portal-door .door-en {
  font-size: 11px;
  letter-spacing: 0.16em;
  color: rgba(243,239,230,0.55);
  margin-top: 4px;
  text-transform: uppercase;
}
.portal-door p {
  margin: 16px 0 0;
  font-size: 13px;
  line-height: 1.55;
  color: rgba(243,239,230,0.78);
  flex: 1;
  position: relative;
}
.portal-door .door-go {
  margin-top: 18px;
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding: 0 12px;
  background: var(--green);
  color: var(--navy-deep);
  font-weight: 650;
  font-size: 12.5px;
  position: relative;
  align-self: flex-start;
}
.portal-ops {
  margin: 22px 0 0;
  font-size: 13px;
  color: var(--ink-3);
}
.portal-ops a { font-weight: 650; color: var(--navy); border-bottom: 1px solid var(--green); }
.portal-ops a:hover { color: var(--green-deep); }

/* ========== Mail / CRM ========== */
.mail-banner {
  background: var(--warn-bg);
  border: 1px solid #e4d3b0;
  color: var(--warn);
  padding: 8px 12px;
  margin-bottom: 14px;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.04em;
}
.mail-row {
  display: block;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
}
.mail-row:hover { color: var(--ink); }
.mail-row .mail-sub { font-weight: 650; color: var(--navy); }
.mail-item {
  background: var(--white);
  border: 1px solid var(--line);
  border-left: 3px solid var(--navy);
  padding: 14px 16px;
  margin-bottom: 10px;
}
.mail-item.is-out { border-left-color: var(--green); }
.mail-item.is-draft { background: #faf7f1; }
.mail-item header {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: center;
  margin-bottom: 6px;
}
.mail-item header strong { color: var(--navy); flex: 1; }
.mail-item header time { color: var(--ink-3); font-size: 12px; }
.mail-meta { font-size: 12px; color: var(--ink-3); margin-bottom: 8px; }
.mail-body {
  margin: 0;
  white-space: pre-wrap;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.55;
  color: var(--ink);
}

.check-list { display: flex; flex-direction: column; gap: 6px; }
.check-list label { font-weight: 500; color: var(--ink-2); }

/* ========== Files ========== */
.file-thumb {
  width: 48px;
  height: 36px;
  object-fit: cover;
  border: 1px solid var(--line);
  background: var(--cream);
  margin-top: 4px;
}

/* ========== Sailing timeline ========== */
.timeline {
  list-style: none;
  margin: 0;
  padding: 0 0 0 14px;
  border-left: 2px solid var(--green);
}
.timeline li {
  position: relative;
  padding: 0 0 16px 14px;
}
.timeline li::before {
  content: "";
  position: absolute;
  left: -19px;
  top: 5px;
  width: 8px;
  height: 8px;
  background: var(--green);
  border: 2px solid var(--navy);
}
.timeline .tl-code { font-weight: 650; color: var(--navy); margin-right: 8px; }
.timeline .tl-at { color: var(--ink-3); font-size: 12px; }

@media (max-width: 1100px) {
  .portal-doors { grid-template-columns: 1fr; }
  .portal-door { min-height: 0; }
}
@media (max-width: 900px) {
  .app-header.is-chooser .nav-toggle { display: none; }
  .portal-chip { display: none; }
}

@media print {
  .header-switch, .portal-chip, .mail-banner { display: none !important; }
}


/* ========== App shell: sidebar + role login ========== */
.app-body {
  display: flex;
  align-items: stretch;
  min-height: calc(100vh - var(--header-h));
}
.app-sidebar {
  width: 200px;
  flex-shrink: 0;
  background: var(--navy-deep);
  border-right: 1px solid rgba(120, 190, 32, 0.22);
  position: sticky;
  top: var(--header-h);
  height: calc(100vh - var(--header-h));
  overflow-y: auto;
}
.app-sidebar .app-nav {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  height: auto;
  gap: 0;
  padding: 10px 0 24px;
}
.app-sidebar .app-nav a {
  height: 34px;
  padding: 0 16px;
  border-bottom: 0;
  border-left: 3px solid transparent;
  font-size: 13px;
}
.app-sidebar .app-nav a.is-active {
  border-bottom-color: transparent;
  border-left-color: var(--green);
  background: rgba(120, 190, 32, 0.12);
  color: var(--cream);
}
.nav-group { padding: 4px 0 8px; }
.nav-group-label {
  padding: 10px 16px 4px;
  font-size: 10.5px;
  letter-spacing: 0.14em;
  color: var(--green-bright);
  font-weight: 650;
}
.app-body .app-main {
  flex: 1;
  min-width: 0;
  max-width: none;
}

body.is-login .app-sidebar,
body.is-login .nav-toggle { display: none; }
body.is-login .app-body { display: block; }
body.is-login .app-main { max-width: 560px; margin: 0 auto; }

.login-wrap { padding: 12px 0 24px; }
.login-logo {
  height: 64px;
  width: auto;
  max-width: 280px;
  object-fit: contain;
  object-position: left center;
  margin: 8px 0 18px;
}
.login-wrap h1 {
  margin: 0;
  font-size: 26px;
  color: var(--navy);
  font-weight: 700;
}
.login-card { margin-top: 16px; }
.login-accounts {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
}
.login-account {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  text-align: left;
  padding: 12px 14px;
  background: var(--white);
  border: 1px solid var(--line);
  cursor: pointer;
  color: var(--ink);
}
.login-account:hover { border-color: var(--green); }
.login-account strong { color: var(--navy); font-size: 13.5px; }
.login-account span { font-size: 12px; color: var(--ink-3); }

.user-switch { position: relative; min-width: 0; max-width: 100%; }
.user-switch summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  line-height: 1.2;
  color: var(--cream);
  padding: 4px 2px;
  min-width: 0;
  max-width: 100%;
}
.user-switch summary::-webkit-details-marker { display: none; }
.user-switch summary strong { font-size: 13px; font-weight: 650; white-space: nowrap; }
.user-switch summary span,
.user-duty {
  font-size: 11px;
  color: var(--green-bright);
  letter-spacing: 0.08em;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.user-menu-duty {
  padding: 8px 12px 10px;
  font-size: 12px;
  color: var(--ink-2);
  line-height: 1.4;
  border-bottom: 1px solid var(--line);
  margin-bottom: 4px;
}
.user-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  min-width: 168px;
  max-height: min(70vh, 520px);
  overflow: auto;
  background: var(--white);
  border: 1px solid var(--line-strong);
  box-shadow: var(--shadow-lg);
  z-index: 240;
  padding: 6px 0;
}
.user-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  background: none;
  border: 0;
  padding: 8px 12px;
  cursor: pointer;
  text-align: left;
  color: var(--ink);
}
.user-item span { font-size: 11.5px; color: var(--ink-3); }
.user-item:hover { background: var(--cream); }
.user-item.is-current { background: var(--info-bg); }

@media (max-width: 900px) {
  .app-sidebar {
    display: none;
    position: fixed;
    left: 0; right: auto;
    top: var(--header-h);
    bottom: 0;
    z-index: 210;
    width: min(280px, 86vw);
  }
  .app-sidebar.is-open,
  .app-sidebar:has(.app-nav.is-open) { display: block; }
  .app-nav.is-open {
    display: flex !important;
    position: static;
    background: transparent;
  }
  .login-accounts { grid-template-columns: 1fr; }
}

@media print {
  .app-sidebar, .user-switch, .user-menu { display: none !important; }
  .app-body { display: block; }
}

/* ========== CRM chips / 公海 ========== */
.chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 10px;
  min-width: 0;
}
.drive-storage {
  width: 100%;
  min-width: 0;
  margin: 0 0 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  background: var(--white);
  font-size: 12.5px;
}
.drive-storage-copy {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 4px 16px;
  line-height: 1.5;
}
.drive-storage-copy strong { color: var(--navy); }
.drive-storage-copy span { color: var(--ink-2); }
.drive-storage-copy em { font-style: normal; font-weight: 700; }
.drive-storage-bar {
  height: 6px;
  margin-top: 7px;
  overflow: hidden;
  background: var(--cream);
  border-radius: 3px;
}
.drive-storage-bar > span { display: block; height: 100%; background: var(--green); }
.drive-storage.is-warn .drive-storage-bar > span { background: #c58b22; }
.drive-storage.is-warn .drive-storage-copy em { color: #9a6812; }
.drive-storage.is-danger .drive-storage-bar > span { background: #d65b35; }
.drive-storage.is-danger .drive-storage-copy em { color: #b34424; }
.drive-storage.is-critical .drive-storage-bar > span { background: var(--err); }
.drive-storage.is-critical .drive-storage-copy em { color: var(--err); }
.drive-storage.is-loading { color: var(--ink-3); }

.chip {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 12px;
  border: 1px solid var(--line-strong);
  background: var(--white);
  color: var(--ink-2);
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  border-radius: var(--radius);
}
a.chip:hover { color: var(--navy); border-color: var(--navy-soft); }
.chip.is-on {
  background: var(--navy);
  color: var(--cream);
  border-color: var(--navy);
}
.crm-head-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: center;
  margin: -4px 0 14px;
  color: var(--ink-2);
  font-size: 13px;
}
.crm-head-meta strong { color: var(--navy); }
.inline-grade {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}
.inline-grade label { font-weight: 600; color: var(--ink-2); }
.inline-grade select { height: 30px; }


/* ========== 报价双路径 / 技术单 ========== */
.quote-split {
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 14px;
  align-items: start;
}
@media (max-width: 960px) {
  .quote-split { grid-template-columns: 1fr; }
}
.tech-banner {
  background: var(--warn-bg);
  border: 1px solid #e4d3b0;
  color: var(--warn);
  padding: 10px 12px;
  margin-bottom: 14px;
  font-size: 13px;
  font-weight: 600;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
}
.tech-banner.is-ok {
  background: var(--ok-bg);
  border-color: #c5d6c8;
  color: var(--ok);
}
.hist-list { display: flex; flex-direction: column; gap: 10px; }
.hist-item {
  border: 1px solid var(--line);
  background: var(--white);
  padding: 10px 12px;
  font-size: 13px;
}
.hist-item .note-example { margin-top: 2px; }
.hist-actions { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; }
.check-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  padding-top: 4px;
}
.check-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 500;
  color: var(--ink-2);
}
.check-item input { margin: 0; }

.no-preview {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 13px;
  letter-spacing: 0.04em;
}
#contractPreview, #codePreview, #projectPreview, #newProjPreview, #newCustCode {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: 0.06em;
  font-weight: 650;
}

.archive-priority {
  border-left: 3px solid var(--green);
  padding-left: 12px;
  margin-bottom: 12px;
}
.archive-secondary {
  border-left: 3px solid var(--line-strong);
  padding-left: 12px;
  margin-bottom: 8px;
}
.combo-list {
  margin-top: 6px;
  max-height: 180px;
  overflow: auto;
  border: 1px solid var(--line);
  background: var(--white);
}
.combo-list.is-empty::after {
  content: attr(data-empty);
  display: block;
  padding: 8px 10px;
  color: var(--ink-3);
  font-size: 12.5px;
}
.combo-item {
  display: block;
  width: 100%;
  text-align: left;
  padding: 7px 10px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
}
.combo-item:last-child { border-bottom: 0; }
.combo-item:hover { background: var(--info-bg); }
.combo-item.is-on {
  background: var(--navy);
  color: var(--cream);
}
.combo-item.is-on .note-example { color: var(--cream); opacity: 0.8; }
.inline-panel {
  margin: 8px 0 12px;
  padding: 12px;
  border: 1px solid var(--line);
  background: var(--paper);
}


/* 产品库投放 / 线夹 */
.lib-hint {
  background: #f3f7ee;
  border: 1px solid #c5d6c8;
  color: var(--ink-2);
  padding: 10px 12px;
  margin: 0 0 14px;
  font-size: 13px;
  line-height: 1.55;
}
#tech-prod-checks.check-list {
  flex-direction: column;
  align-items: flex-start;
  max-height: 280px;
  overflow: auto;
  margin-top: 8px;
}
#tech-prod-checks .check-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.check-sub {
  margin-left: 22px;
  font-weight: 400;
  font-size: 12.5px;
}
.tech-file-picks {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.tech-file-picks .check-sub { margin-left: 0; }


/* 图纸目录 / 识别 / 未投放 */
.btn-muted,
a.btn-muted {
  opacity: 0.55;
  color: var(--ink-2);
}
.dwg-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
}
.folder-toolbar .folder-path-row {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.folder-path {
  flex: 1;
  min-width: 200px;
  padding: 6px 10px;
  background: #f3f7ee;
  border: 1px solid #c5d6c8;
  word-break: break-all;
  font-size: 12.5px;
}
.folder-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 12px;
}
.folder-actions input[type="search"] {
  flex: 1;
  min-width: 180px;
}
.parse-card textarea { min-height: 120px; }
.parse-card-inline { margin: 0 0 16px; padding-bottom: 12px; border-bottom: 1px solid var(--line, #e4e0d8); }
.parse-card-inline textarea { min-height: 96px; }
.parse-preview { margin-top: 12px; }
.parse-leftover {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.parse-leftover-item {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.parse-leftover-item > span {
  flex: 1 1 180px;
  font-size: 13px;
}

.parse-near {
  margin-top: 6px;
  font-size: 12px;
  color: var(--ink-3);
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}


/* ========== 报价向导 step 2：询价清单 / 找产品 / 近两年价 / 草稿 ========== */
.draft-banner {
  background: var(--info-bg);
  border: 1px solid var(--navy-soft);
  color: var(--navy);
  padding: 10px 12px;
  margin-bottom: 14px;
  font-size: 13px;
  font-weight: 600;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
}
.draft-banner a { font-weight: 700; }
.empty-hint {
  color: var(--ink-3);
  font-size: 13px;
  margin: 8px 0 0;
}
.parse-files {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}
.parse-file {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border: 1px solid var(--line);
  background: var(--white);
  font-size: 12.5px;
}
#quote-cart-card { margin-top: 14px; }
#quote-cart .wiz-model,
#quote-cart .wiz-spec { width: 100%; min-width: 80px; }
#quote-cart .wiz-qty,
#quote-cart .wiz-price { width: 88px; text-align: right; }
.cart-status {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: var(--radius);
}
.cart-status.is-in { background: var(--ok-bg); color: var(--ok); }
.cart-status.is-miss { background: var(--warn-bg); color: var(--warn); }
.custom-add { margin-top: 8px; }
.prod-pick-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 8px;
}
.prod-pick {
  display: block;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  border: 1px solid var(--line);
  background: var(--white);
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.prod-pick strong { display: block; color: var(--navy); }
.prod-pick:hover { border-color: var(--navy-soft); background: var(--info-bg); }
.prod-pick.is-on {
  border-color: var(--green);
  background: #f3f7ee;
  box-shadow: inset 3px 0 0 var(--green);
}
.price-pick-list { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.price-pick-row {
  display: grid;
  grid-template-columns: auto 72px 88px 1fr auto;
  gap: 8px 12px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid var(--line);
  background: var(--white);
  cursor: pointer;
  font-size: 13px;
}
.price-pick-row:has(input:checked) {
  border-color: var(--navy);
  background: var(--info-bg);
}
.price-pick-lab { font-weight: 700; color: var(--navy); }
.price-pick-meta { color: var(--ink-3); font-size: 12.5px; }
.price-pick-who { color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.price-pick-amt { font-weight: 650; white-space: nowrap; }
.cart-add-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  margin-top: 12px;
}
.cart-add-row .field { margin: 0; }
#wiz-browse, .parse-card + #quote-cart-card { margin-top: 14px; }
#wiz-browse + .card, #quote-cart-card + #wiz-browse { margin-top: 14px; }

.review-block {
  padding: 10px 12px;
  background: #f7f8f4;
  border: 1px solid var(--line);
}
.review-block h3 {
  margin: 0 0 4px;
  font-size: 13px;
  color: var(--navy);
}
.review-new { margin-top: 12px; }
.review-new strong { display: block; margin-bottom: 6px; font-size: 13px; }
tr.review-row > td { padding: 0 8px 10px; background: #f7f8f4; }

tr.inq-row { cursor: pointer; }
tr.inq-row.is-open { background: var(--info-bg); }
tr.inq-row.is-miss { cursor: default; }
.inq-chevron {
  display: inline-block;
  width: 1em;
  color: var(--navy);
  transition: transform .15s ease;
}
tr.inq-row.is-open .inq-chevron { transform: rotate(90deg); }
.inq-price-sum { font-size: 12.5px; color: var(--ink-2); }
.tech-review-note { width: 100%; min-width: 120px; }
textarea.tech-reply-note {
  display: block;
  width: 100%;
  min-height: 64px;
  resize: vertical;
  line-height: 1.35;
  font: inherit;
  padding: 6px 8px;
  box-sizing: border-box;
}
.model-clip {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.25;
  max-width: 22em;
}
#tech-inq-rows td,
#tech-reply-cart td {
  padding: 5px 8px;
  line-height: 1.25;
  vertical-align: top;
}
#tech-inq-rows th,
#tech-reply-cart th { padding: 6px 8px; }
#tech-reply-cart td.note-cell,
table.data td.note-cell {
  width: 26%;
  min-width: 200px;
}
#tech-reply-cart .tech-inq-idx { max-width: 11em; }
.review-block tr.is-sales td { background: #e8f3dc; }
.review-block tr.is-sales td:first-child { box-shadow: inset 3px 0 0 var(--green); }


.price-sales { font-size: 12px; color: var(--ink-2); line-height: 1.3; margin-bottom: 2px; }
.inq-fixed { font-weight: 550; color: var(--navy); }
.inq-fixed.is-extra { color: var(--ink-2); font-weight: 400; }

.sales-verify .tech-orig {
  background: #f4f6f2;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  margin: 10px 0 14px;
}
.sales-verify .sales-usd { width: 110px; }
.sales-verify .sales-note {
  width: 100%;
  min-width: 140px;
  border: 1px solid var(--line);
  padding: 4px 6px;
  font: inherit;
  resize: vertical;
}

.price-src { display: inline-block; margin-top: 4px; font-size: 11px; color: var(--ink-3); }
.price-src.is-tech { color: #1c3d68; }
.price-src.is-sales-edit { color: #8a5a00; }
.price-src.is-sales { color: var(--ink-3); }
.form-autosave-stamp, #form-autosave-stamp { margin: 0 12px 0 0; }


/* ========== 西创网盘 / 外部分享 ========== */
body.is-share .app-sidebar,
body.is-share .nav-toggle { display: none; }
body.is-share .app-body { display: block; }
body.is-share .app-main { max-width: 920px; margin: 0 auto; }

.drive-proj-block { margin: 8px 0 16px; }
.drive-proj-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.drive-share { padding: 8px 0 32px; }
.drive-share-letter {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--navy);
  color: var(--cream);
  padding: 18px 20px;
  margin: 0 0 18px;
  border-radius: var(--radius);
}
.drive-share-letter img { height: 40px; width: auto; }
.drive-share-letter strong {
  display: block;
  font-size: 16px;
  font-weight: 650;
}
.drive-share-letter span {
  display: block;
  font-size: 12px;
  opacity: 0.85;
}
.drive-share-letter em {
  display: block;
  font-style: normal;
  font-size: 12px;
  opacity: 0.7;
  margin-top: 2px;
}


.drive-crumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0 0 12px;
  font-size: 13px;
  color: var(--ink-2);
}
.drive-crumb a { color: var(--navy); text-decoration: none; font-weight: 600; }
.drive-crumb a:hover { text-decoration: underline; }
.drive-crumb-sep { opacity: 0.45; }
.drive-up {
  display: flex;
  justify-content: flex-start;
  margin: 0 0 12px;
}
.drive-subfolders { margin: 0 0 14px; }
.drive-grant-list { margin-top: 8px; max-height: 280px; overflow: auto; }
.drive-grant-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-bottom: none;
  background: var(--white);
  font-size: 13px;
}
.drive-grant-list .drive-grant-row:first-child,
.drive-acl-list .drive-grant-row:first-child { border-radius: var(--radius) var(--radius) 0 0; }
.drive-grant-list .drive-grant-row:last-child,
.drive-acl-list .drive-grant-row:last-child { border-bottom: 1px solid var(--line); border-radius: 0 0 var(--radius) var(--radius); }
.drive-grant-name { font-weight: 600; color: var(--ink); }
.drive-grant-ops { display: flex; gap: 12px; white-space: nowrap; color: var(--ink-2); }
.drive-acl-list { margin: 8px 0; }
.drive-grant-row.is-removed { opacity: 0.45; }
.drive-grant-row.is-removed .drive-grant-name { text-decoration: line-through; }
.drive-grant-side { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.drive-grant-perm { font-size: 12px; max-width: 110px; }
.drive-acl-owner { color: var(--ink-2); font-weight: 600; white-space: nowrap; }
.drive-add-groups {
  max-height: 240px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--white);
}
.drive-add-group {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2);
  padding: 8px 10px 4px;
  background: var(--paper);
}
.drive-add-groups .drive-grant-row { justify-content: flex-start; cursor: pointer; }
.drive-add-groups .drive-grant-row input { margin: 0 8px 0 0; }
.drive-acl-more { margin-top: 8px; color: var(--ink-2); font-size: 13px; }
.drive-acl-more summary { cursor: pointer; }
.page-actions { flex-wrap: wrap; }

.drive-drop {
  border: 1.5px dashed var(--line-strong);
  border-radius: var(--radius);
  padding: 10px;
  background: var(--white);
  transition: border-color .15s, background .15s;
}
.drive-drop.is-drag {
  border-color: var(--green);
  background: var(--info-bg);
}
.drive-drop-pad {
  min-height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
  border-radius: calc(var(--radius) - 2px);
  color: var(--ink-3);
  font-size: 14px;
  letter-spacing: 0.02em;
  text-align: center;
}
.drive-drop > .card + .drive-drop-pad { margin-top: 8px; }
.drive-drop.is-drag .drive-drop-pad { color: var(--navy); }
.drive-drop.is-drag .drive-item.is-folder:hover { background: transparent; }


.drive-list .drive-name {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--ink);
  font-weight: 600;
  text-decoration: none;
}
button.drive-name {
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  font: inherit;
  cursor: pointer;
  text-align: left;
}
.drive-list a.drive-name:hover,
.drive-list button.drive-name:hover { color: var(--navy); }
.drive-preview-frame {
  display: block;
  width: 100%;
  height: min(70vh, 720px);
  border: 1px solid var(--line);
  background: var(--paper);
}
.drive-preview-img {
  display: block;
  max-width: 100%;
  max-height: min(70vh, 720px);
  margin: 0 auto;
}
.drive-preview-text {
  max-height: min(70vh, 720px);
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 12.5px;
  line-height: 1.45;
  background: var(--paper);
  padding: 12px;
  margin: 0;
}
.drive-preview-fallback {
  margin: 8px 0;
  color: var(--ink-2);
}
.drive-preview-pdf {
  display: block;
  width: 100%;
  min-height: 50vh;
  max-height: 70vh;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--line);
  background: var(--paper);
  box-sizing: border-box;
}
.drive-preview-pdf canvas {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 0 8px;
  background: #fff;
}
.drive-preview-pdf canvas:last-child { margin-bottom: 0; }
.drive-preview-pdf .drive-preview-fallback { padding: 16px; }
.drive-ico { width: 18px; height: 18px; flex: 0 0 18px; color: #E8A317; }
.drive-ico-file { color: var(--ink-3); }
.drive-item.is-folder { cursor: pointer; }
.drive-item.is-folder:hover { background: var(--info-bg); }

/* ========== Phone / foldable (640 folded, 641–900 unfolded) ========== */
@media (max-width: 900px) {
  html, body { overflow-x: hidden; }
  #app, .app-body, .app-main { min-width: 0; max-width: 100%; }
  .app-header { overflow: visible; }
  .header-inner {
    gap: 8px;
    padding: 0 max(12px, env(safe-area-inset-right)) 0 max(12px, env(safe-area-inset-left));
  }
  .brand-logo { height: 28px; max-width: 132px; }
  .login-logo { height: 48px; }
  .brand-text strong { font-size: 12px; }
  .brand-text span { font-size: 10px; letter-spacing: 0.08em; }
  .header-aside { gap: 8px; }
  #user-slot { min-width: 0; max-width: 100%; }
  .user-duty { max-width: min(42vw, 220px); }
  .user-menu { max-width: min(280px, calc(100vw - 16px)); }
  .page-actions, .toolbar { flex-wrap: wrap; }
  .pipeline-wrap::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 8px;
    width: 28px;
    pointer-events: none;
    background: linear-gradient(to right, transparent, var(--paper));
  }
  .pipe-col { flex: 0 0 200px; min-width: 200px; }
  .kpi-grid { grid-template-columns: 1fr 1fr; }
  .modal-backdrop { padding: 12px 8px 16px; }
}

@media (max-width: 640px) {
  .brand-text span { display: none; }
  .user-duty { display: none; }
  .sample-badge { display: none; }
  .header-inner { gap: 6px; }
  .app-main { padding: 14px 12px 56px; }
  .page-head h1 { font-size: 18px; }
  .pipe-col { flex: 0 0 210px; min-width: 210px; }
}

.modal-body { overflow-x: hidden; overflow-y: auto; }
.drive-preview-docx,
.drive-preview-sheet {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 100%;
  min-height: 30vh;
  max-height: 70vh;
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--line);
  background: var(--paper);
  box-sizing: border-box;
}
.drive-preview-docx { overflow-x: hidden; overflow-y: auto; }
.drive-preview-docx-html {
  padding: 12px 14px;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.55;
  font-size: 14px;
}
.drive-preview-docx-html img,
.drive-preview-docx-html pre {
  max-width: 100%;
  height: auto;
}
.drive-sheet-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}
.drive-sheet-tabs {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  border-top: 1px solid var(--line-strong);
  background: var(--cream);
  max-width: 100%;
}
.drive-sheet-tab {
  flex: 0 0 auto;
  appearance: none;
  border: 0;
  border-right: 1px solid var(--line);
  background: transparent;
  color: var(--navy);
  font: inherit;
  font-size: 12px;
  padding: 7px 12px;
  cursor: pointer;
  white-space: nowrap;
}
.drive-sheet-tab.is-on {
  background: var(--white);
  font-weight: 650;
  box-shadow: inset 0 2px 0 var(--navy);
}
.drive-preview-table-wrap {
  width: 100%;
  max-width: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.drive-preview-docx-html .drive-preview-table-wrap { margin: 10px 0; }
.drive-preview-table {
  border-collapse: collapse;
  width: max-content;
  max-width: none;
  min-width: 100%;
  font-size: 12px;
}
.drive-preview-table th,
.drive-preview-table td {
  border: 1px solid var(--line);
  padding: 4px 8px;
  white-space: nowrap;
  max-width: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
}
.drive-preview-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--cream);
  font-weight: 650;
}
.drive-preview-docx-html .drive-preview-table th,
.drive-preview-docx-html .drive-preview-table td {
  white-space: normal;
  max-width: none;
  overflow: visible;
  text-overflow: unset;
}
.drive-preview-docx-html .drive-preview-table tr:first-child td {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--cream);
  font-weight: 650;
}
.drive-preview-note,
.drive-preview-empty { margin: 8px 12px 12px; color: var(--ink-2); font-size: 12px; }
.drive-preview-img,
.drive-preview-pdf canvas {
  max-width: 100%;
}
@media (max-width: 900px) {
  .modal, .modal.wide {
    width: 100%;
    max-width: calc(100vw - 16px);
    max-height: min(90dvh, calc(100dvh - 28px), calc(100vh - 28px));
  }
  .drive-preview-pdf,
  .drive-preview-docx,
  .drive-preview-sheet { max-height: 62vh; }
}