:root {
  color-scheme: light;
  --ink: #1d1d1f;
  --muted: #65686d;
  --line: #e0e3e7;
  --surface: #ffffff;
  --canvas: #f5f5f7;
  --green: #1f6550;
  --green-dark: #174f3f;
  --green-soft: #e8f3ec;
  --amber: #9a5d08;
  --amber-soft: #fff3dc;
  --red: #a83a35;
  --red-soft: #fceceb;
  --blue: #275f83;
  --blue-soft: #eaf3f8;
  --shadow: 0 18px 50px rgba(25, 44, 34, .14);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-synthesis: none;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--canvas); font-size: 14px; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .56; }
a { color: inherit; }
.loading-screen { min-height: 100vh; display: grid; place-items: center; color: var(--muted); }
.app-shell { min-height: 100vh; }

/* Authentication */
.auth-layout { min-height: 100vh; display: grid; grid-template-columns: minmax(320px, .9fr) minmax(420px, 1.1fr); background: var(--surface); }
.auth-brand { display: flex; flex-direction: column; justify-content: space-between; padding: 44px clamp(28px, 6vw, 84px); color: #f7fbf8; background: #1e6546; }
.brand-lockup { display: flex; align-items: center; gap: 12px; font-size: 17px; font-weight: 700; }
.brand-mark { width: 64px; height: 64px; display: block; flex: 0 0 auto; object-fit: contain; }
.auth-brand-copy { max-width: 440px; margin: 80px 0; }
.auth-brand-copy h1 { max-width: 420px; margin: 0 0 16px; font-size: clamp(28px, 4vw, 42px); line-height: 1.28; }
.auth-brand-copy p { margin: 0; color: #d1e6d9; line-height: 1.8; }
.auth-brand-foot { color: #d1e6d9; font-size: 12px; }
.auth-main { display: grid; place-items: center; padding: 36px 24px; }
.auth-card { width: min(100%, 440px); }
.auth-card h2 { margin: 0 0 8px; font-size: 24px; }
.auth-subtitle { margin: 0 0 24px; color: var(--muted); line-height: 1.7; }
.auth-tabs { display: flex; gap: 20px; margin-bottom: 22px; border-bottom: 1px solid var(--line); }
.auth-tab { position: relative; padding: 0 0 12px; border: 0; color: var(--muted); background: none; }
.auth-tab.active { color: var(--green); font-weight: 700; }
.auth-tab.active::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: var(--green); content: ""; }
.form-stack { display: grid; gap: 15px; }
.field { display: grid; gap: 7px; min-width: 0; }
.field label, .field-label { color: #38443d; font-size: 13px; font-weight: 600; }
.field input, .field select, .field textarea, .filter-control input, .filter-control select {
  width: 100%; min-width: 0; padding: 10px 11px; border: 1px solid #cbd5ce; border-radius: 5px; outline: none; color: var(--ink); background: #fff;
}
.field textarea { min-height: 98px; resize: vertical; line-height: 1.6; }
.field input:focus, .field select:focus, .field textarea:focus, .filter-control input:focus, .filter-control select:focus { border-color: #428362; box-shadow: 0 0 0 3px rgba(35,115,79,.12); }
.field-help { color: var(--muted); font-size: 12px; line-height: 1.55; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.form-grid .span-2 { grid-column: 1 / -1; }
.primary-button, .secondary-button, .quiet-button, .danger-button {
  min-height: 38px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 8px 13px; border: 1px solid transparent; border-radius: 5px; font-weight: 600; white-space: nowrap;
}
.primary-button { color: #fff; background: var(--green); }
.primary-button:hover { background: var(--green-dark); }
.secondary-button { border-color: #cbd5ce; color: #34443b; background: #fff; }
.secondary-button:hover, .quiet-button:hover { background: #f0f5f1; }
.quiet-button { color: #365447; background: transparent; }
.danger-button { border-color: #efc8c5; color: var(--red); background: #fff; }
.wide-button { width: 100%; margin-top: 5px; }
.notice { margin: 0 0 16px; padding: 11px 12px; border: 1px solid #c8dfcf; border-radius: 5px; color: #285b3d; background: #edf7ef; line-height: 1.55; }
.notice.error { border-color: #efc8c5; color: #8d302c; background: var(--red-soft); }

/* Main workspace */
.workspace { min-height: 100vh; display: grid; grid-template-columns: 236px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 22px 15px 16px; border-right: 1px solid var(--line); background: #fff; }
.sidebar .brand-lockup { padding: 0 10px 25px; color: var(--ink); font-size: 14px; }
.sidebar .brand-mark { width: 48px; height: 48px; }
.side-caption { padding: 10px 10px 7px; color: #87918b; font-size: 11px; font-weight: 700; }
.side-nav { display: grid; gap: 4px; }
.nav-button { width: 100%; display: flex; align-items: center; gap: 11px; padding: 10px; border: 0; border-radius: 5px; color: #536159; text-align: left; background: transparent; }
.nav-button:hover { color: var(--green-dark); background: #f1f6f2; }
.nav-button.active { color: var(--green-dark); font-weight: 700; background: var(--green-soft); }
.nav-icon { width: 20px; height: 20px; display: grid; place-items: center; font-size: 16px; }
.sidebar-spacer { flex: 1; }
.sidebar-user { display: flex; align-items: center; gap: 10px; padding: 13px 8px 3px; border-top: 1px solid var(--line); }
.avatar { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: var(--green-dark); background: var(--green-soft); font-weight: 700; }
.sidebar-user-copy { min-width: 0; flex: 1; }
.sidebar-user-copy strong, .sidebar-user-copy span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-user-copy strong { font-size: 12px; }
.sidebar-user-copy span { margin-top: 3px; color: var(--muted); font-size: 11px; }
.main-column { min-width: 0; }
.topbar { min-height: 66px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 12px clamp(18px, 3vw, 38px); border-bottom: 1px solid var(--line); background: #fff; }
.breadcrumb { color: var(--muted); font-size: 12px; }
.topbar-actions { display: flex; align-items: center; gap: 10px; }
.role-pill, .status-pill, .stage-pill, .team-pill { display: inline-flex; align-items: center; min-height: 24px; padding: 3px 8px; border: 1px solid transparent; border-radius: 4px; font-size: 11px; font-weight: 600; white-space: nowrap; }
.role-pill { color: #3c5949; background: #edf4ef; }
.content { width: min(100%, 1440px); margin: 0 auto; padding: 28px clamp(18px, 3vw, 38px) 44px; }
.page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.page-heading h1 { margin: 0; font-size: 23px; line-height: 1.35; }
.page-heading p { margin: 6px 0 0; color: var(--muted); line-height: 1.6; }
.heading-actions { display: flex; align-items: center; gap: 8px; }
.metric-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 24px; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.metric { min-width: 0; padding: 16px 19px; border-right: 1px solid var(--line); }
.metric:last-child { border-right: 0; }
.metric-label { color: var(--muted); font-size: 12px; }
.metric-value { display: block; margin-top: 7px; font-size: 25px; font-weight: 700; line-height: 1; }
.metric-value.overdue { color: var(--red); }
.metric-value.today { color: var(--amber); }
.metric-foot { margin-top: 7px; color: #7c8781; font-size: 11px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 26px 0 13px; }
.section-heading h2 { margin: 0; font-size: 16px; }
.section-heading span { color: var(--muted); font-size: 12px; }
.filter-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin-bottom: 14px; }
.filter-control { min-width: 145px; }
.filter-control.search { min-width: min(280px, 100%); flex: 1; }
.filter-control input, .filter-control select { height: 38px; padding-top: 7px; padding-bottom: 7px; font-size: 13px; }
.segmented { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.segment-button { min-height: 29px; padding: 5px 10px; border: 0; border-radius: 3px; color: var(--muted); background: transparent; font-size: 12px; white-space: nowrap; }
.segment-button.active { color: var(--green-dark); background: var(--green-soft); font-weight: 700; }
.results-bar { display: flex; align-items: center; justify-content: space-between; margin: 5px 0 9px; color: var(--muted); font-size: 12px; }
.project-list { display: grid; gap: 9px; }
.project-row { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(130px, .9fr) minmax(120px, .7fr) minmax(135px, .85fr) auto; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 6px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.project-row:hover { border-color: #a9c5b3; box-shadow: 0 3px 12px rgba(28,76,49,.06); }
.project-main { min-width: 0; }
.project-title-button { max-width: 100%; padding: 0; overflow: hidden; border: 0; color: #26382e; text-align: left; text-overflow: ellipsis; white-space: nowrap; background: none; font-size: 15px; font-weight: 700; }
.project-title-button:hover { color: var(--green); }
.project-subtitle { margin-top: 6px; overflow: hidden; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.row-meta-label { margin-bottom: 5px; color: #859089; font-size: 10px; }
.row-meta-value { overflow: hidden; color: #3b4840; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.stage-pill { color: #365c49; background: #edf5ef; }
.stage-pill.terminal { color: #59645e; background: #eef0ee; }
.stage-pill.warning { color: var(--amber); background: var(--amber-soft); }
.stage-pill.danger { color: var(--red); background: var(--red-soft); }
.due-text { color: #33463a; font-weight: 600; }
.due-text.overdue { color: var(--red); }
.due-text.today { color: var(--amber); }
.row-open { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid transparent; border-radius: 4px; color: #69766e; background: transparent; font-size: 17px; }
.row-open:hover { border-color: var(--line); color: var(--green); background: #f7faf7; }
.empty-state { padding: 48px 18px; border: 1px dashed #c8d3cb; border-radius: 6px; color: var(--muted); text-align: center; background: rgba(255,255,255,.6); }
.empty-state strong { display: block; margin-bottom: 7px; color: #3c4941; font-size: 14px; }
.error-banner { margin: 0 0 14px; padding: 11px 13px; border: 1px solid #efc8c5; border-radius: 5px; color: #8d302c; background: var(--red-soft); }

/* Detail and administration */
.detail-back { display: inline-flex; align-items: center; gap: 7px; padding: 0; border: 0; color: var(--green); background: transparent; font-weight: 600; }
.detail-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin: 16px 0 22px; }
.detail-header h1 { margin: 0; font-size: 24px; }
.detail-header p { margin: 7px 0 0; color: var(--muted); }
.detail-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.detail-layout { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(290px, .8fr); gap: 22px; align-items: start; }
.detail-section { margin-bottom: 22px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.detail-section:last-child { border-bottom: 0; }
.detail-section h2 { margin: 0 0 14px; font-size: 15px; }
.detail-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px 22px; }
.detail-field { min-width: 0; }
.detail-field.wide { grid-column: 1 / -1; }
.detail-field dt { margin-bottom: 5px; color: #7c8881; font-size: 11px; }
.detail-field dd { margin: 0; overflow-wrap: anywhere; line-height: 1.65; }
.followup-list { display: grid; gap: 0; }
.followup-item { position: relative; padding: 0 0 18px 22px; border-left: 1px solid #ccdad0; }
.followup-item:last-child { padding-bottom: 0; border-left-color: transparent; }
.followup-item::before { position: absolute; top: 2px; left: -5px; width: 9px; height: 9px; border: 2px solid #fff; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 1px #91b29b; content: ""; }
.followup-date { margin-bottom: 6px; color: #637168; font-size: 11px; }
.followup-body { color: #35423a; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }
.followup-stage { margin-bottom: 7px; }
.followup-next { margin-top: 7px; color: var(--muted); font-size: 11px; }
.form-panel { padding: 16px; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.form-panel h2 { margin: 0 0 15px; font-size: 15px; }
.panel-note { margin: -6px 0 14px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.admin-tabs { display: flex; gap: 17px; margin-bottom: 17px; border-bottom: 1px solid var(--line); }
.admin-tab { padding: 0 0 10px; border: 0; color: var(--muted); background: transparent; }
.admin-tab.active { border-bottom: 2px solid var(--green); color: var(--green-dark); font-weight: 700; }
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.data-table { width: 100%; border-collapse: collapse; text-align: left; white-space: nowrap; }
.data-table th, .data-table td { padding: 11px 13px; border-bottom: 1px solid #e7ece8; }
.data-table th { color: #647068; background: #f6f8f6; font-size: 11px; font-weight: 700; }
.data-table td { color: #354139; font-size: 12px; }
.data-table tr:last-child td { border-bottom: 0; }
.status-pill.pending { color: var(--amber); background: var(--amber-soft); }
.status-pill.approved { color: var(--green-dark); background: var(--green-soft); }
.status-pill.rejected { color: var(--red); background: var(--red-soft); }
.table-actions { display: flex; align-items: center; gap: 6px; }
.table-actions select { max-width: 140px; min-height: 32px; padding: 5px 7px; border: 1px solid #cbd5ce; border-radius: 4px; color: var(--ink); background: #fff; font-size: 11px; }
.table-actions input { width: 170px; min-height: 32px; padding: 5px 7px; border: 1px solid #cbd5ce; border-radius: 4px; color: var(--ink); background: #fff; font-size: 11px; }
.table-actions input:focus, .table-actions select:focus { border-color: #428362; outline: 2px solid rgba(35,115,79,.12); }
.team-list { display: grid; gap: 8px; margin-top: 14px; }
.team-row { display: flex; align-items: center; justify-content: space-between; padding: 11px 13px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.team-pill { color: #3b604b; background: #eef5f0; }
.admin-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, .58fr); gap: 20px; align-items: start; }
.migration-upload { display: grid; grid-template-columns: minmax(190px, .7fr) minmax(0, 1.3fr); gap: 22px; align-items: start; }
.migration-upload h2 { margin-bottom: 10px; }
.migration-upload .panel-note { margin: 0; }
.migration-upload-form { display: grid; gap: 12px; }
.migration-upload-form input[type="file"] { padding: 9px; border: 1px dashed #aab8af; border-radius: 5px; color: var(--ink); background: #fbfcfb; }
.migration-file-name, .migration-submit-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.migration-file-name { color: var(--muted); font-size: 12px; }
.migration-file-name strong { max-width: min(520px, 100%); overflow-wrap: anywhere; color: var(--ink); font-weight: 600; }
.migration-submit-row { padding-top: 2px; }
.migration-stage-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 14px 0; }
.migration-batches { margin: 26px 0 10px; }
.migration-batches > .section-heading { margin: 0 0 12px; }
.migration-batch-notice { margin: 0 0 12px; }
.migration-batch-table { min-width: 850px; }
.migration-batch-table td { vertical-align: top; white-space: normal; }
.migration-batch-table .migration-counts { grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)); min-width: 220px; gap: 5px; margin: 0; }
.migration-batch-table .migration-counts > div { padding: 5px 6px; }
.migration-batch-table .migration-counts dt { font-size: 10px; }
.migration-batch-table .migration-counts dd { font-size: 13px; }
.migration-short-hash { display: block; max-width: 155px; overflow-wrap: anywhere; color: #39463e; font-size: 10px; white-space: normal; }
.migration-actions { display: grid; justify-items: start; gap: 6px; }
.compact-button { min-height: 30px; padding: 6px 9px; font-size: 11px; }
.status-pill.neutral { border-color: #dfe5e1; color: #536159; background: #f1f4f2; }
.migration-confirm-warning { margin: 13px 0; padding: 11px 13px; border-left: 3px solid #c99534; color: #5a4828; background: #fff8e8; font-size: 13px; line-height: 1.6; }
.dialog-body > .dialog-footer { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.migration-result { margin-top: 22px; }
.migration-result-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.migration-result-heading h2 { margin: 0; font-size: 17px; }
.migration-result-heading p { margin: 5px 0 0; color: var(--muted); font-size: 12px; }
.migration-summary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 12px 0 18px; }
.migration-summary { min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.migration-summary h3, .migration-section h3, .migration-blockers h3 { margin: 0; font-size: 14px; }
.migration-summary > p { margin: 8px 0 0; color: var(--muted); font-size: 12px; }
.migration-counts { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 8px; margin: 11px 0 0; }
.migration-counts > div { min-width: 0; padding: 8px 9px; border: 1px solid #e7ece8; border-radius: 4px; background: #fbfcfb; }
.migration-counts dt { overflow-wrap: anywhere; color: var(--muted); font-size: 11px; }
.migration-counts dd { margin: 4px 0 0; color: var(--ink); font-size: 16px; font-weight: 700; }
.migration-hash { display: grid; gap: 5px; margin-top: 12px; color: var(--muted); font-size: 11px; }
.migration-hash code { overflow-wrap: anywhere; color: #39463e; }
.migration-section { margin: 19px 0; }
.migration-section .section-heading { margin-top: 0; }
.migration-table { min-width: 680px; }
.migration-table td { vertical-align: top; white-space: normal; }
.migration-map-control { display: grid; min-width: 210px; gap: 7px; }
.migration-map-control select, .migration-create-fields input { width: 100%; min-height: 34px; padding: 6px 8px; border: 1px solid #cbd5ce; border-radius: 4px; color: var(--ink); background: #fff; font-size: 12px; }
.migration-map-control select:focus, .migration-create-fields input:focus { border-color: #428362; outline: 2px solid rgba(35,115,79,.12); }
.migration-map-control select:disabled { color: #78837c; background: #f0f2f0; }
.migration-prerequisite { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin: 10px 0 14px; padding: 12px 14px; border: 1px solid #dfc98e; border-left: 3px solid #c99534; border-radius: 4px; color: #4b4028; background: #fff9eb; }
.migration-prerequisite strong { display: block; color: #4b4028; font-size: 13px; }
.migration-prerequisite p { margin: 5px 0 0; color: #5e553f; font-size: 12px; line-height: 1.6; }
.migration-prerequisite .secondary-button { flex: 0 0 auto; }
.migration-merge-confirm { display: flex; align-items: flex-start; gap: 10px; margin-top: 14px; padding: 12px 14px; border: 1px solid #dfc98e; border-left: 3px solid var(--amber); border-radius: 4px; color: #4b4028; background: #fff9eb; cursor: pointer; }
.migration-merge-confirm input { flex: 0 0 auto; width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--green); }
.migration-merge-confirm span { display: grid; gap: 4px; }
.migration-merge-confirm strong { color: #4b4028; font-size: 13px; line-height: 1.45; }
.migration-merge-confirm small { color: #5e553f; font-size: 12px; line-height: 1.55; }
.migration-create-fields { display: grid; gap: 7px; padding: 9px; border-left: 2px solid #8ab398; background: #f7faf7; }
.migration-create-fields > label:not(.migration-check) { display: grid; gap: 4px; color: var(--muted); font-size: 11px; }
.migration-create-fields .migration-check { display: flex; align-items: center; gap: 7px; color: #45534a; font-size: 11px; }
.migration-create-fields .migration-check input { width: 15px; height: 15px; min-height: 0; accent-color: var(--green); }
.migration-issue { margin-top: 5px; color: var(--red); font-size: 11px; line-height: 1.5; }
.migration-blockers { margin: 14px 0; padding: 13px 15px; border: 1px solid #efc8c5; border-radius: 5px; color: #71332e; background: #fff6f5; }
.migration-blockers h3 { color: #8d302c; }
.migration-blockers ul { display: grid; gap: 6px; margin: 9px 0 0; padding-left: 20px; line-height: 1.55; }
.migration-disclaimer { margin: 12px 0; color: var(--muted); font-size: 11px; line-height: 1.6; }

/* Follow-up analytics */
.analytics-filter-panel { margin: 0 0 22px; padding: 16px; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.analytics-filter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; align-items: end; }
.analytics-filter-grid .field { min-width: 0; }
.analytics-filter-grid input[type="date"] { width: 100%; min-width: 0; min-height: 38px; padding: 7px 9px; border: 1px solid #cbd5ce; border-radius: 5px; color: var(--ink); background: #fff; }
.analytics-filter-grid input[type="date"]:focus { border-color: #428362; outline: 2px solid rgba(35,115,79,.12); }
.analytics-multiselect { position: relative; min-width: 0; }
.analytics-multiselect > summary { min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 10px; overflow: hidden; border: 1px solid #cbd5ce; border-radius: 5px; color: var(--ink); background: #fff; cursor: pointer; list-style: none; }
.analytics-multiselect > summary::-webkit-details-marker { display: none; }
.analytics-multiselect > summary::after { flex: 0 0 auto; color: var(--muted); content: "⌄"; }
.analytics-multiselect > summary strong { min-width: 0; overflow: hidden; color: var(--green-dark); text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.analytics-multiselect[open] > summary { border-color: #8bb79a; border-radius: 5px 5px 0 0; }
.analytics-picker-menu { position: absolute; z-index: 4; top: calc(100% - 1px); left: 0; width: min(360px, calc(100vw - 38px)); max-height: 340px; overflow: hidden; border: 1px solid #8bb79a; border-radius: 0 0 5px 5px; background: #fff; box-shadow: 0 10px 28px rgba(25,44,34,.14); }
.analytics-picker-actions { display: flex; gap: 12px; padding: 8px 12px; border-bottom: 1px solid var(--line); }
.analytics-picker-actions .quiet-button { min-height: 28px; padding: 4px 0; color: var(--green-dark); font-size: 11px; }
.analytics-picker-options { max-height: 288px; overflow: auto; padding: 4px 9px; }
.analytics-choice { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 8px 5px; border-bottom: 1px solid #edf0ed; cursor: pointer; }
.analytics-choice:last-child { border-bottom: 0; }
.analytics-choice > input { width: 16px; height: 16px; flex: 0 0 16px; margin: 0; accent-color: var(--green); }
.analytics-choice > span { min-width: 0; display: grid; gap: 2px; }
.analytics-choice strong { overflow: hidden; color: #354139; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.analytics-choice small { overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.analytics-picker-empty { margin: 0; padding: 15px 10px; color: var(--muted); font-size: 12px; }
.analytics-filter-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 14px; }
.analytics-filter-actions { display: flex; flex: 0 0 auto; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.analytics-page-heading { align-items: center; }
.analytics-actions { flex: 0 0 auto; }
.analytics-report { min-width: 0; }
.analytics-report-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin: 26px 0 14px; }
.analytics-report-heading h2 { margin: 0; font-size: 18px; }
.analytics-report-heading p { margin: 5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.analytics-interval { flex: 0 0 auto; padding: 5px 8px; border-radius: 4px; color: #275f83; background: #eaf3f8; font-size: 11px; font-weight: 600; }
.analytics-metrics { margin: 0 0 10px; }
.analytics-metrics .metric-value { font-size: 23px; }
.analytics-status-metrics { grid-template-columns: repeat(6, minmax(0, 1fr)); margin: 0 0 14px; }
.analytics-status-metrics .metric { padding: 12px 10px; }
.analytics-subheading { margin-top: 18px !important; }
.analytics-subheading h3 { margin: 0; font-size: 13px; }
.analytics-section { min-width: 0; padding: 19px 0 21px; border-bottom: 1px solid var(--line); }
.analytics-section > .section-heading { margin: 0 0 13px; }
.analytics-section > .section-heading h2 { font-size: 15px; }
.analytics-trend-wrap { min-width: 0; }
.analytics-legend { display: flex; flex-wrap: wrap; gap: 14px; margin: 0 0 5px 50px; color: var(--muted); font-size: 11px; }
.analytics-legend span { display: inline-flex; align-items: center; gap: 6px; }
.analytics-legend i { width: 15px; height: 3px; border-radius: 3px; background: #23734f; }
.analytics-legend i.projects { background: #275f83; }
.analytics-trend-svg { display: block; width: 100%; height: auto; max-height: 310px; overflow: visible; }
.analytics-grid-line { stroke: #e7ece8; stroke-width: 1; }
.analytics-axis-label { fill: #68746e; font-family: inherit; font-size: 11px; }
.analytics-line-followups, .analytics-line-projects { fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.analytics-line-followups { stroke: #23734f; }
.analytics-line-projects { stroke: #275f83; }
.analytics-dot-followups { fill: #fff; stroke: #23734f; stroke-width: 2; }
.analytics-dot-projects { fill: #fff; stroke: #275f83; stroke-width: 2; }
.analytics-comparison-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.analytics-comparison-grid > section { min-width: 0; }
.analytics-comparison-grid h3 { margin: 0 0 10px; font-size: 13px; }
.analytics-comparison-list { display: grid; gap: 9px; }
.analytics-comparison-row { min-width: 0; padding: 9px 0; border-bottom: 1px solid #e7ece8; }
.analytics-comparison-title { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.analytics-comparison-title strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.analytics-comparison-title > span { flex: 0 0 auto; color: var(--muted); font-size: 10px; }
.analytics-bar-line { display: grid; grid-template-columns: 33px minmax(0, 1fr) 30px; align-items: center; gap: 7px; margin-top: 4px; color: var(--muted); font-size: 10px; }
.analytics-bar-track { height: 7px; overflow: hidden; border-radius: 5px; background: #eef1ef; }
.analytics-bar-track i { height: 100%; display: block; min-width: 0; border-radius: inherit; }
.analytics-bar-track i.followups { background: #4b946e; }
.analytics-bar-track i.projects { background: #5b8eae; }
.analytics-bar-line b { color: #354139; text-align: right; font-size: 10px; }
.analytics-stage-layout { display: grid; grid-template-columns: minmax(170px, .55fr) minmax(240px, 1fr); align-items: center; gap: 30px; }
.analytics-donut { width: min(220px, 100%); aspect-ratio: 1; display: grid; place-items: center; justify-self: center; border-radius: 50%; }
.analytics-donut-center { width: 62%; aspect-ratio: 1; display: grid; align-content: center; justify-items: center; border-radius: 50%; color: var(--ink); background: #fff; box-shadow: 0 0 0 1px rgba(32,41,37,.08); }
.analytics-donut-center strong { font-size: 24px; line-height: 1.1; }
.analytics-donut-center span { margin-top: 4px; color: var(--muted); font-size: 11px; }
.analytics-stage-legend { display: grid; gap: 8px; }
.analytics-stage-row { display: grid; grid-template-columns: 12px minmax(0, 1fr) auto; align-items: center; gap: 8px; color: #354139; font-size: 12px; }
.analytics-color-swatch { width: 10px; height: 10px; border-radius: 2px; }
.analytics-stage-row strong { color: var(--muted); font-size: 11px; }
.analytics-funnel { display: grid; gap: 11px; }
.analytics-funnel-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 16px; padding: 9px 0; border-bottom: 1px solid #e7ece8; }
.analytics-funnel-heading { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.analytics-funnel-heading strong { overflow: hidden; color: #2d3933; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.analytics-funnel-heading span { flex: 0 0 auto; color: var(--muted); font-size: 11px; }
.analytics-funnel-track { grid-column: 1 / -1; height: 10px; overflow: hidden; border-radius: 2px; background: #edf1ee; }
.analytics-funnel-track i { height: 100%; display: block; min-width: 0; border-radius: inherit; background: #28745f; }
.analytics-funnel-rate { grid-column: 1 / -1; color: #275f83; font-size: 11px; font-weight: 650; }
.analytics-table-wrap { border-radius: 4px; }
.analytics-table { width: 100%; min-width: 420px; white-space: normal; }
.analytics-table th, .analytics-table td { vertical-align: top; overflow-wrap: anywhere; }
.analytics-table td { line-height: 1.5; }
.analytics-details-table { min-width: 1030px; }
.analytics-funnel-table { min-width: 640px; margin-top: 14px; }
.analytics-details-table .analytics-situation { min-width: 220px; max-width: 360px; white-space: pre-wrap; }
.analytics-chart-empty { padding: 22px 14px; }
.analytics-truncation-note { margin: 0 0 10px; padding: 9px 11px; border-left: 3px solid #bc8431; border-radius: 3px; color: #715017; background: #fff7e6; font-size: 12px; line-height: 1.55; }
.analytics-loading { min-height: 22vh; }

/* Dialogs */
dialog { width: min(720px, calc(100% - 28px)); max-height: min(90vh, 900px); padding: 0; overflow: hidden; border: 1px solid #d7e0d9; border-radius: 7px; color: var(--ink); background: #fff; box-shadow: var(--shadow); }
dialog::backdrop { background: rgba(25, 40, 31, .42); }
.dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 17px 20px; border-bottom: 1px solid var(--line); }
.dialog-header h2 { margin: 0; font-size: 17px; }
.icon-button { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid transparent; border-radius: 4px; color: #657169; background: transparent; font-size: 20px; }
.icon-button:hover { border-color: var(--line); background: #f5f8f5; }
.dialog-body { max-height: calc(90vh - 68px); padding: 20px; overflow: auto; }
.dialog-footer { display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; }
.mobile-nav { display: none; }
.toast-region { position: fixed; z-index: 10; top: 16px; right: 16px; display: grid; gap: 8px; width: min(360px, calc(100vw - 32px)); pointer-events: none; }
.toast { padding: 12px 14px; border: 1px solid #b8d8c4; border-radius: 5px; color: #265b3b; background: #f2faf4; box-shadow: 0 8px 24px rgba(22,52,35,.13); line-height: 1.55; }
.toast.error { border-color: #efc8c5; color: #8d302c; background: #fff6f5; }

@media (max-width: 1050px) {
  .project-row { grid-template-columns: minmax(0, 1.3fr) minmax(110px, .8fr) minmax(120px, .8fr) auto; }
  .project-row .row-sales { display: none; }
  .admin-split { grid-template-columns: 1fr; }
  .migration-upload { grid-template-columns: 1fr; gap: 14px; }
  .analytics-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .auth-layout { grid-template-columns: 1fr; }
  .auth-brand { min-height: auto; padding: 20px 22px; }
  .auth-brand-copy { margin: 34px 0 22px; }
  .auth-brand-copy h1 { font-size: 28px; }
  .auth-brand-foot { display: none; }
  .auth-main { align-items: start; padding: 28px 22px 42px; }
  .workspace { display: block; padding-bottom: 62px; }
  .sidebar { display: none; }
  .topbar { min-height: 58px; padding: 9px 16px; }
  .topbar-actions { gap: 5px; }
  .topbar-actions .secondary-button { min-height: 32px; padding: 6px 8px; font-size: 11px; }
  .topbar-actions .role-pill { padding: 3px 5px; font-size: 10px; }
  .topbar .breadcrumb { display: none; }
  .content { padding: 22px 15px 30px; }
  .page-heading { align-items: stretch; flex-direction: column; gap: 13px; margin-bottom: 17px; }
  .page-heading h1 { font-size: 21px; }
  .heading-actions { align-self: flex-start; flex-wrap: wrap; }
  .metric-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 20px; }
  .metric:nth-child(2) { border-right: 0; }
  .metric:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .metric { padding: 13px 14px; }
  .metric-value { font-size: 22px; }
  .filter-bar { align-items: stretch; }
  .filter-control, .filter-control.search { min-width: calc(50% - 5px); flex: 1 1 calc(50% - 5px); }
  .filter-control.search { flex-basis: 100%; }
  .segmented { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); }
  .segment-button { padding-right: 5px; padding-left: 5px; }
  .project-row { grid-template-columns: minmax(0, 1fr) auto; gap: 10px 12px; padding: 13px; }
  .project-main { grid-column: 1; }
  .project-row .row-stage { grid-column: 1; grid-row: 2; }
  .project-row .row-due { grid-column: 2; grid-row: 2; text-align: right; }
  .project-row .row-open { grid-column: 2; grid-row: 1; }
  .project-row .row-sales { display: none; }
  .detail-layout { grid-template-columns: 1fr; }
  .migration-summary-grid { grid-template-columns: 1fr; }
  .migration-result-heading { align-items: flex-start; }
  .detail-header { flex-direction: column; }
  .detail-header h1 { font-size: 21px; }
  .detail-fields { gap: 14px; }
  .mobile-nav { position: fixed; z-index: 5; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: repeat(3, 1fr); padding: 6px 8px calc(6px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: rgba(255,255,255,.97); }
  .mobile-nav.two-items { grid-template-columns: repeat(2, 1fr); }
  .mobile-nav.one-item { grid-template-columns: 1fr; }
  .mobile-nav.analytics-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .mobile-nav.analytics-nav.has-export { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .mobile-nav .nav-button { justify-content: center; flex-direction: column; gap: 2px; padding: 5px 2px; font-size: 10px; }
  .mobile-nav .nav-icon { font-size: 17px; }
  .analytics-comparison-grid { grid-template-columns: 1fr; gap: 20px; }
  .analytics-stage-layout { grid-template-columns: 1fr; gap: 18px; }
  .analytics-status-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .analytics-donut { width: min(200px, 56vw); }
  .analytics-picker-menu { width: min(360px, calc(100vw - 32px)); }
}
@media (max-width: 480px) {
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .span-2 { grid-column: auto; }
  .auth-brand-copy p { max-width: 340px; }
  .role-pill { display: none; }
  .topbar-actions { gap: 4px; }
  .topbar-actions .secondary-button { min-height: 33px; padding: 6px 9px; font-size: 12px; }
  .data-table th, .data-table td { padding: 9px; }
  .detail-fields { grid-template-columns: 1fr 1fr; }
  .dialog-body { padding: 16px; }
  .migration-prerequisite { align-items: flex-start; }
  .analytics-filter-grid { grid-template-columns: 1fr; }
  .analytics-status-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analytics-filter-footer { align-items: flex-start; flex-direction: column; }
  .analytics-filter-actions { width: 100%; }
  .analytics-filter-actions .primary-button { flex: 1 1 auto; }
  .analytics-page-heading { align-items: flex-start; }
  .analytics-report-heading { align-items: flex-start; }
  .analytics-report-heading h2 { font-size: 16px; }
  .analytics-metrics .metric-value { font-size: 20px; }
  .analytics-stage-layout { gap: 14px; }
  .analytics-legend { margin-left: 0; }
  .analytics-trend-svg { min-height: 200px; }
}

@page { size: A4 landscape; margin: 12mm; }
@media print {
  body { color: #202925; background: #fff; font-size: 9pt; }
  .analytics-workspace { display: block; min-height: 0; padding: 0; }
  .analytics-workspace .sidebar,
  .analytics-workspace .topbar,
  .analytics-workspace .mobile-nav,
  .analytics-actions,
  .analytics-filter-panel,
  .toast-region { display: none !important; }
  .analytics-workspace .main-column,
  .analytics-workspace .content { width: 100%; max-width: none; margin: 0; padding: 0; }
  .analytics-report-heading { margin-top: 0; }
  .analytics-report-heading p { color: #38443d; }
  .analytics-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 0 5mm; }
  .analytics-metrics .metric { padding: 8px 10px; }
  .analytics-metrics .metric-value { font-size: 16pt; }
  .analytics-section { padding: 4mm 0; break-inside: avoid; }
  .analytics-comparison-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8mm; }
  .analytics-stage-layout { grid-template-columns: 45mm 1fr; gap: 8mm; }
  .analytics-donut { width: 38mm; }
  .analytics-trend-svg { max-height: 58mm; }
  .analytics-chart-empty { padding: 8px; }
  .analytics-table-wrap { overflow: visible; border-color: #cbd5ce; }
  .analytics-table,
  .analytics-details-table { width: 100%; min-width: 0; table-layout: fixed; font-size: 7pt; }
  .analytics-table th, .analytics-table td { padding: 4px 5px; }
  .analytics-details-table td { overflow-wrap: anywhere; }
  .analytics-details-table .analytics-situation { min-width: 0; max-width: none; }
  .analytics-details-section { break-before: page; }
  .analytics-workspace .metric-strip,
  .analytics-report-heading,
  .analytics-section { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  button, details { display: none !important; }
}


/* 1.13.0: a shared, quiet brand system for login and administration. */
.auth-layout { grid-template-columns: minmax(330px, 1fr) minmax(420px, 1fr); background: #fff; }
.auth-brand { padding: 42px clamp(32px, 6.3vw, 96px); color: var(--ink); background: #f5f5f7; }
.auth-home { text-decoration: none; width: fit-content; font-size: 21px; font-weight: 600; letter-spacing: -.5px; }
.auth-home .brand-mark { width: 53px; height: 53px; }
.auth-brand-copy { margin: 80px 0; max-width: 440px; }
.auth-brand-copy h1 { max-width: 440px; font-size: clamp(36px, 3.7vw, 52px); line-height: 1.22; font-weight: 600; letter-spacing: -1.7px; margin-bottom: 25px; }
.auth-brand-copy p { color: var(--muted); font-size: 16px; line-height: 1.9; }
.auth-brands { display: flex; align-items: center; gap: 23px; margin-top: 34px; color: var(--green); font-size: 13px; font-weight: 500; }
.auth-brand-foot { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; color: var(--muted); font-size: 12px; line-height: 1.8; }
.auth-brand-foot a { text-decoration: none; }
.auth-brand-foot a:hover { color: var(--green); }
.auth-main { padding: 48px; }
.auth-card { width: min(100%, 370px); }
.auth-card h2 { font-size: 28px; font-weight: 600; letter-spacing: -.8px; margin-bottom: 12px; }
.auth-subtitle { font-size: 13px; line-height: 1.8; margin-bottom: 32px; }
.auth-tabs { padding: 4px; gap: 3px; border: 0; border-radius: 10px; background: #f1f2f4; margin-bottom: 26px; }
.auth-tab { min-height: 35px; padding: 7px 15px; flex: 1; border-radius: 7px; font-size: 13px; }
.auth-tab.active { color: var(--ink); background: #fff; font-weight: 500; }
.auth-tab.active::after { display: none; }
.auth-card .form-stack { gap: 21px; }
.auth-card .field { gap: 8px; }
.auth-card .field label { font-weight: 500; color: #4f545c; font-size: 12px; }
.auth-card .field input { min-height: 45px; border-color: #cfd3d9; border-radius: 9px; padding: 11px 13px; }
.auth-card .field input:focus { border-color: var(--green); box-shadow: none; }
.auth-card .primary-button { min-height: 45px; border-radius: 9px; font-weight: 500; margin-top: 3px; }
.auth-card .field-help { font-size: 11px; line-height: 1.7; }
.primary-button, .secondary-button, .quiet-button, .danger-button { border-radius: 8px; }
.nav-button { border-radius: 8px; }
.nav-button.active { background: #e9ebee; color: var(--ink); }
@media (max-width: 1000px) { .auth-brand { padding-inline: 36px; } .auth-main { padding: 36px; } .auth-brand-copy h1 { font-size: 40px; } .auth-brand-copy p { font-size: 14px; } }
@media (max-width: 760px) { .auth-layout { grid-template-columns: 1fr; } .auth-brand { padding: 22px 26px 28px; } .auth-home { font-size: 19px; } .auth-home .brand-mark { width: 42px; height: 42px; } .auth-brand-copy { margin: 35px 0 0; } .auth-brand-copy h1 { font-size: 35px; letter-spacing: -1px; margin-bottom: 16px; } .auth-brand-copy h1 br { display: none; } .auth-brand-copy p { font-size: 13px; } .auth-brand-copy p br { display: none; } .auth-brands { margin-top: 22px; font-size: 12px; } .auth-brand-foot { display: none; } .auth-main { padding: 32px 26px 42px; align-items: start; } .auth-card { width: min(100%, 440px); } .auth-card h2 { font-size: 25px; } .auth-subtitle { margin-bottom: 25px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; } }

