:root {
  --bg: #f4f6f8;
  --surface: #ffffff;
  --surface-soft: #f8fafb;
  --sidebar: #17202b;
  --sidebar-soft: #222d39;
  --text: #18202a;
  --muted: #748090;
  --line: #e5e9ee;
  --accent: #ef3655;
  --accent-soft: #fff0f3;
  --blue: #2678d9;
  --blue-soft: #edf5ff;
  --green: #258c62;
  --green-soft: #eaf8f1;
  --amber: #b97916;
  --amber-soft: #fff6e6;
  --red: #d13d48;
  --red-soft: #fff0f1;
  --purple: #7c5ab8;
  --purple-soft: #f3effa;
  --panel: var(--surface);
  --primary: var(--accent);
  --danger: var(--red);
  --ink: var(--text);
  --soft: var(--surface-soft);
  --shadow: 0 4px 16px rgba(20, 28, 38, .07);
  --sidebar-width: 220px;
  font-family: Inter, "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
}

html[data-theme="dark"] {
  --bg: #11161c;
  --surface: #1a2028;
  --surface-soft: #202833;
  --sidebar: #0d1218;
  --sidebar-soft: #1a232d;
  --text: #edf1f5;
  --muted: #9aa7b5;
  --line: #303a46;
  --accent-soft: #3b2028;
  --blue-soft: #1d3145;
  --green-soft: #18372c;
  --amber-soft: #3b301d;
  --red-soft: #3c2226;
  --purple-soft: #30283f;
  --shadow: 0 4px 18px rgba(0,0,0,.25);
}
html[data-theme="dark"] .topbar,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .toolbar,
html[data-theme="dark"] .filter-panel,
html[data-theme="dark"] .project-workspace,
html[data-theme="dark"] .recruitment-form-section,
html[data-theme="dark"] .recruitment-schema-row,
html[data-theme="dark"] .modal,
html[data-theme="dark"] .modal-head,
html[data-theme="dark"] .login-form-pane,
html[data-theme="dark"] .login-box,
html[data-theme="dark"] .detail-actions { background: var(--surface); }
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .btn { color: var(--text); border-color: var(--line); background-color: var(--surface-soft); }
html[data-theme="dark"] .btn-primary { color: #fff; border-color: var(--accent); background: var(--accent); }
html[data-theme="dark"] .btn-danger { color: #ffabb3; border-color: #6a3038; background: #362128; }
html[data-theme="dark"] .project-row:hover,
html[data-theme="dark"] .view-tab:hover,
html[data-theme="dark"] tbody tr:hover { background: #202833; }
html[data-theme="dark"] .project-row-head,
html[data-theme="dark"] thead,
html[data-theme="dark"] .upload-preview { background: #171d24; }
html[data-theme="dark"] .project-blogger-result:hover,
html[data-theme="dark"] .project-blogger-result.selected { color: var(--muted); background: var(--surface-soft); }
html[data-theme="dark"] .finance-media-row.has-risk td { background: #2b2024; }
html[data-theme="dark"] .inner-table th { background: #202833; }
html[data-theme="dark"] .commission-main-row:hover td { background: #202833; }
html[data-theme="dark"] .picker-avatar { border-color: #69404a; color: #ff9caf; background: var(--accent-soft); }
html[data-theme="dark"] .picker-match-summary { border-color: #315f4a; color: #78d4a8; background: var(--green-soft); }
html[data-theme="dark"] .picker-issue.danger,
html[data-theme="dark"] .picker-submit-summary { border-color: #67363d; color: #ff9ca6; background: var(--red-soft); }
html[data-theme="dark"] .picker-submit-summary span,
html[data-theme="dark"] .project-blogger-bulk-settings label,
html[data-theme="dark"] .project-blogger-selected-fields label,
html[data-theme="dark"] .picker-selected-empty strong { color: var(--muted); }
html[data-theme="dark"] .sticky-modal-actions { background: var(--surface); }
html[data-theme="dark"] .blogger-filter-group-title,
html[data-theme="dark"] .blogger-filter-line > strong,
html[data-theme="dark"] .blogger-filter-popover > summary:hover { background: var(--surface-soft); }
html[data-theme="dark"] .blogger-filter-line { border-color: var(--line); }
html[data-theme="dark"] .blogger-filter-popover > summary { color: var(--muted); }
html[data-theme="dark"] .blogger-filter-popover[open] > summary,
html[data-theme="dark"] .blogger-filter-popover.is-active > summary { border-color: #7a3c47; color: #ff9cab; background: #342027; }
html[data-theme="dark"] .blogger-filter-popover-panel { border-color: var(--line); background: var(--surface); }
html[data-theme="dark"] .blogger-filter-footer { border-color: var(--line); }
html[data-theme="dark"] .blogger-filter-status { border-color: var(--line); background: #171d24; box-shadow: none; }
html[data-theme="dark"] .blogger-filter-status-icon { color: #b8c3cf; background: #252f3a; }
html[data-theme="dark"] .blogger-filter-status.is-active .blogger-filter-status-icon { color: #ff9cab; background: #342027; }
html[data-theme="dark"] .blogger-filter-status-copy > strong { color: #dce3eb; }
html[data-theme="dark"] .blogger-active-filters button { border-color: #6a3038; color: #ffabb3; background: #342027; }
html[data-theme="dark"] .blogger-table thead th { color: #c0cad5; background: #171d24; }
html[data-theme="dark"] .blogger-table tbody td { color: #dce3eb; background: var(--surface); }
html[data-theme="dark"] .blogger-table tbody tr:nth-child(even) td { background: #1d252e; }
html[data-theme="dark"] .blogger-table tbody tr:hover td { background: #25303b; }
html[data-theme="dark"] .blogger-table tbody td > strong,
html[data-theme="dark"] .blogger-table .table-title,
html[data-theme="dark"] .blogger-note-item strong,
html[data-theme="dark"] .cost-metric-value { color: #f2f5f8; }
html[data-theme="dark"] .blogger-table .table-sub,
html[data-theme="dark"] .blogger-location,
html[data-theme="dark"] .blogger-note-item small { color: #a8b4c1; }
html[data-theme="dark"] .blogger-table .mini-tag,
html[data-theme="dark"] .blogger-cost-row { border-color: var(--line); color: #dce3eb; background: #242d37; }
html[data-theme="dark"] .blogger-cost-row > strong { color: #c3ced9; }
html[data-theme="dark"] .blogger-cost-row > span > small { color: #9eabb9; }

* { box-sizing: border-box; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
html, body { margin: 0; min-height: 100%; background: var(--bg); }
body { min-width: 320px; font-size: 14px; letter-spacing: 0; }
button, input, select, textarea { font: inherit; letter-spacing: 0; }
button { cursor: pointer; }
a { color: var(--blue); text-decoration: none; }
a:hover { text-decoration: underline; }

.login-page {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(280px, 440px) minmax(420px, 1fr);
  background: var(--surface);
}
.login-brand-pane {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 42px;
  color: #f8fafc;
  background: var(--sidebar);
}
.login-brand-pane h1 { max-width: 320px; margin: 0 0 14px; font-size: 34px; line-height: 1.25; }
.login-brand-pane p { max-width: 330px; margin: 0; color: #aeb9c6; line-height: 1.8; }
.login-facts { display: grid; gap: 12px; }
.login-fact { display: flex; align-items: center; gap: 10px; color: #dbe3ec; }
.login-fact svg { width: 17px; height: 17px; color: #ff6a82; }
.login-form-pane { display: grid; place-items: center; padding: 32px; background: #f7f8fa; }
.login-box { width: min(420px, 100%); padding: 34px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: var(--shadow); }
.login-box h2 { margin: 24px 0 8px; font-size: 24px; }
.login-box > p { margin: 0 0 24px; color: var(--muted); }
.login-hint { margin-top: 18px; padding: 12px; border-radius: 6px; color: #556171; background: var(--surface-soft); font-size: 12px; line-height: 1.6; }

.brand { display: flex; align-items: center; gap: 11px; min-width: 0; }
.brand-mark {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 7px;
  color: #fff;
  background: var(--accent);
  font-weight: 800;
}
.brand-copy { min-width: 0; }
.brand-copy strong { display: block; color: inherit; font-size: 15px; }
.brand-copy span { display: block; margin-top: 2px; color: #8f9dab; font-size: 10px; text-transform: uppercase; }

.shell { min-height: 100vh; }
.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 40;
  display: flex;
  width: var(--sidebar-width);
  flex-direction: column;
  color: #dbe3ec;
  background: var(--sidebar);
}
.sidebar-head { height: 70px; display: flex; align-items: center; padding: 0 19px; border-bottom: 1px solid rgba(255,255,255,.08); }
.sidebar-nav { overflow-y: auto; padding: 10px 0 14px; }
.nav-group { padding: 9px 18px 4px; color: #718092; font-size: 11px; font-weight: 700; }
.nav-item {
  position: relative;
  display: flex;
  width: 100%;
  height: 40px;
  align-items: center;
  gap: 11px;
  padding: 0 18px;
  border: 0;
  color: #bbc6d2;
  background: transparent;
  text-align: left;
}
.nav-item svg { width: 17px; height: 17px; }
.nav-item:hover { color: #fff; background: var(--sidebar-soft); }
.nav-item.active { color: #fff; background: rgba(239,54,85,.16); }
.nav-item.active::before { position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--accent); content: ""; }
.sidebar-user { margin-top: auto; padding: 16px 18px; border-top: 1px solid rgba(255,255,255,.08); }
.user-row { display: grid; grid-template-columns: 34px minmax(0,1fr) 30px; gap: 9px; align-items: center; }
.avatar { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; color: #fff; background: var(--accent); font-weight: 700; }
.user-copy { min-width: 0; }
.user-copy strong, .user-copy span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-copy span { margin-top: 3px; color: #8d9aab; font-size: 11px; }
.avatar-button, .user-copy-button { border: 0; padding: 0; text-align: left; cursor: pointer; }
.avatar-button:hover { box-shadow: 0 0 0 3px rgba(239,54,85,.22); }
.user-copy-button { color: inherit; background: transparent; }
.user-copy-button:hover strong { color: #fff; }

.main { min-height: 100vh; margin-left: var(--sidebar-width); }
.topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  height: 64px;
  align-items: center;
  justify-content: space-between;
  padding: 0 28px;
  border-bottom: 1px solid var(--line);
  background: rgba(255,255,255,.96);
}
.breadcrumbs { color: var(--muted); font-size: 13px; }
.breadcrumbs strong { color: var(--text); }
.top-actions { display: flex; align-items: center; gap: 10px; }
.notification-bell { position: relative; }
.notification-badge { position: absolute; top: -5px; right: -5px; min-width: 18px; height: 18px; padding: 0 4px; border: 2px solid #fff; border-radius: 9px; background: var(--red); color: #fff; font-size: 10px; font-weight: 700; line-height: 14px; text-align: center; }
.notification-badge.is-hidden { display: none; }
.notification-list { display: grid; }
.notification-row { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 15px 2px; border-bottom: 1px solid var(--line); }
.notification-row:last-child { border-bottom: 0; }
.notification-row.unread { background: var(--blue-soft); }
.notification-icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 6px; background: #eef5ff; color: var(--blue); }
.notification-icon svg { width: 16px; }
.notification-copy { min-width: 0; display: grid; gap: 4px; font-size: 13px; line-height: 1.55; }
.role-pill { padding: 7px 10px; border: 1px solid var(--line); border-radius: 6px; color: var(--text); background: var(--surface); font-size: 12px; }
.content { width: 100%; margin: 0 auto; padding: 26px 24px 44px; }
.page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.page-head h1 { margin: 0 0 6px; font-size: 23px; line-height: 1.25; }
.page-head p { margin: 0; color: var(--muted); line-height: 1.6; }
.commission-month-picker { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 0 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); color: var(--muted); font-size: 12px; font-weight: 700; }
.commission-month-picker input { width: 132px; min-height: 30px; padding: 3px 6px; border: 0; background: transparent; color: var(--text); }
.page-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }

.btn {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 7px 12px;
  border: 1px solid #d8dee5;
  border-radius: 6px;
  color: #354150;
  background: #fff;
  font-weight: 600;
}
.btn:hover { border-color: #bfc8d2; background: #f9fafb; text-decoration: none; }
.btn svg { width: 15px; height: 15px; }
.btn-primary { border-color: var(--accent); color: #fff; background: var(--accent); }
.btn-primary:hover { border-color: #d92747; background: #d92747; }
.btn-danger { border-color: #f1c8cc; color: var(--red); background: var(--red-soft); }
.btn-danger-outline { border-color: #ef9ca5; color: var(--red); background: #fff; }
.btn-danger-outline:hover { border-color: var(--red); color: #fff; background: var(--red); }
.btn-ghost { border-color: transparent; color: var(--muted); background: transparent; }
.btn-sm { min-height: 30px; padding: 5px 9px; font-size: 12px; }
.btn-icon { width: 34px; padding: 0; }
.btn-block { width: 100%; }
.btn:disabled { cursor: not-allowed; opacity: .55; }

.metric-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px,1fr)); gap: 14px; margin-bottom: 18px; }
.metric {
  min-height: 116px;
  padding: 18px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--blue);
  border-radius: 7px;
  background: var(--surface);
  box-shadow: 0 2px 8px rgba(20,28,38,.035);
}
.metric.green { border-left-color: var(--green); }
.metric.amber { border-left-color: var(--amber); }
.metric.red { border-left-color: var(--red); }
.metric.purple { border-left-color: var(--purple); }
.metric-head { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 12px; }
.metric-head svg { width: 18px; height: 18px; }
.metric-value { margin-top: 12px; font-size: 27px; font-weight: 800; line-height: 1; }
.metric-note { margin-top: 10px; color: var(--muted); font-size: 11px; }
.metric-note.positive { color: var(--green); }
.metric-note.danger { color: var(--red); }

.grid-2 { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(280px,.85fr); gap: 16px; margin-bottom: 18px; }
.grid-equal { grid-template-columns: repeat(2,minmax(0,1fr)); }
.panel { overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); box-shadow: 0 2px 10px rgba(20,28,38,.035); }
.panel + .panel { margin-top: 16px; }
.grid-2 .panel + .panel { margin-top: 0; }
.panel-head { display: flex; min-height: 50px; align-items: center; justify-content: space-between; gap: 12px; padding: 0 17px; border-bottom: 1px solid var(--line); }
.panel-head h2 { margin: 0; font-size: 15px; }
.panel-head p { margin: 0; color: var(--muted); font-size: 11px; }
.panel-body { padding: 16px 17px; }
.panel-body.flush { padding: 0; }

.toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.filters { display: flex; flex: 1; flex-wrap: wrap; gap: 8px; }
.filter-panel { display: grid; gap: 12px; margin-bottom: 12px; padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.task-category-name { display: inline-flex; align-items: center; gap: 9px; }
.task-category-name > i { width: 12px; height: 12px; flex: 0 0 12px; border: 1px solid rgba(15,23,42,.12); border-radius: 3px; }
.task-category-color-input { display: grid; grid-template-columns: 48px 1fr; align-items: center; gap: 10px; min-height: 40px; }
.task-category-color-input input[type="color"] { width: 48px; height: 38px; padding: 3px; cursor: pointer; }
.task-category-color-input code { color: var(--muted); font-size: 12px; }
.task-category-status { display: flex; align-items: center; gap: 10px; min-height: 68px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 6px; cursor: pointer; }
.task-category-status input { width: 18px; height: 18px; }
.task-category-status span { display: grid; gap: 3px; }
.task-category-status small { color: var(--muted); }
.scope-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; color: var(--muted); font-size: 12px; }
.scope-button { min-height: 30px; padding: 5px 10px; border: 0; border-bottom: 2px solid transparent; color: #526071; background: transparent; }
.scope-button:hover { color: var(--text); background: #f1f4f7; }
.scope-button.active { border-bottom-color: var(--accent); color: var(--accent); font-weight: 700; }
.category-filter { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: start; gap: 8px; min-width: 0; }
.category-filter-label { padding-top: 7px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.category-filter-controls { display: flex; min-width: 0; align-items: flex-start; gap: 6px; }
.category-filter-options { display: flex; min-width: 0; flex-wrap: wrap; gap: 6px; }
.category-filter-button { display: inline-flex; min-height: 32px; max-width: 240px; align-items: center; gap: 6px; padding: 5px 11px; border: 1px solid var(--line); border-radius: 5px; color: #526071; background: var(--surface); cursor: pointer; }
.category-filter-button > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.category-filter-button > small { flex: 0 0 auto; color: var(--muted); font-size: 10px; font-variant-numeric: tabular-nums; }
.category-filter-button:hover { border-color: #c8d0da; color: var(--text); background: var(--surface-soft); }
.category-filter-button.active { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); font-weight: 700; }
.category-filter-button.active > small { color: var(--accent); }
.category-filter-more { position: relative; flex: 0 0 auto; }
.category-filter-more > summary { display: inline-flex; min-height: 32px; align-items: center; gap: 6px; padding: 5px 10px; border: 1px solid var(--line); border-radius: 5px; color: var(--text); background: var(--surface); cursor: pointer; list-style: none; }
.category-filter-more > summary::-webkit-details-marker { display: none; }
.category-filter-more > summary svg { width: 14px; height: 14px; color: var(--muted); }
.category-filter-more > summary span { color: var(--muted); font-size: 10px; }
.category-filter-more[open] > summary { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.category-filter-menu { position: absolute; z-index: 22; top: calc(100% + 6px); right: 0; width: min(620px,calc(100vw - 64px)); padding: 10px; border: 1px solid var(--line); border-radius: 6px; box-shadow: 0 14px 34px rgba(28,39,54,.16); background: var(--surface); }
.category-filter-search { position: relative; display: block; }
.category-filter-search svg { position: absolute; top: 10px; left: 10px; width: 15px; height: 15px; color: var(--muted); pointer-events: none; }
.category-filter-search input { padding-left: 31px; }
.category-filter-menu-list { display: flex; max-height: 264px; flex-wrap: wrap; align-content: flex-start; gap: 6px; margin-top: 9px; overflow-y: auto; }
.category-filter-menu-item { max-width: 100%; }
.category-filter-menu-item[hidden] { display: none; }
.category-filter-empty { margin: 12px 2px 2px; color: var(--muted); font-size: 12px; text-align: center; }
.filter-row { align-items: center; }
.filter-control { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.filter-control select { min-width: 118px; }
.blogger-filter-row { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)) minmax(210px,1.5fr) auto auto; width: 100%; gap: 12px; }
.blogger-filter-row .filter-control select { width: 100%; min-width: 0; }
.blogger-advanced-filter { border-top: 1px dashed var(--line); }
.blogger-advanced-filter > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 2px 0; color: var(--text); cursor: pointer; }
.blogger-advanced-filter > summary span { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 700; }
.blogger-advanced-filter > summary svg { width: 16px; }
.blogger-advanced-filter > summary small { color: var(--muted); font-size: 12px; font-weight: 400; }
.blogger-advanced-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); align-items: end; gap: 10px; padding-top: 12px; }
.blogger-advanced-grid .filter-control { display: grid; gap: 6px; min-width: 0; }
.blogger-advanced-grid .filter-control span { color: var(--muted); font-size: 12px; }
.blogger-advanced-grid input, .blogger-advanced-grid select { width: 100%; min-width: 0; }
.blogger-advanced-apply { min-height: 38px; }
.blogger-search-box { position: relative; width: 100%; }
.blogger-search-box svg { position: absolute; top: 10px; left: 10px; width: 15px; height: 15px; color: var(--muted); pointer-events: none; }
.blogger-search-box input { width: 100%; padding-left: 31px; }
.blogger-discovery-filter { margin: 0 0 14px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--surface); }
.blogger-search-toolbar { display: grid; grid-template-columns: auto minmax(260px,1fr) auto auto auto; gap: 10px; align-items: center; padding: 15px 0; }
.blogger-search-modes { display: inline-flex; min-width: max-content; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.blogger-search-modes button { min-height: 36px; padding: 7px 12px; border: 0; border-right: 1px solid var(--line); color: #4f5c6b; background: var(--surface-soft); font-size: 12px; }
.blogger-search-modes button:last-child { border-right: 0; }
.blogger-search-modes button:hover { color: var(--text); background: #edf1f5; }
.blogger-search-modes button.active { color: #fff; background: var(--accent); font-weight: 700; }
.blogger-preset-row { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; padding: 10px 0; border-top: 1px solid var(--line); }
.blogger-preset-row strong { width: 88px; color: #26323f; font-size: 12px; }
.blogger-preset-row button { min-height: 29px; padding: 5px 9px; border: 1px solid var(--line); border-radius: 4px; color: #536171; background: #fff; font-size: 11px; }
.blogger-preset-row button:hover { border-color: #bdc6d0; color: var(--accent); background: var(--accent-soft); }
.blogger-filter-matrix { border-top: 1px solid var(--line); }
.blogger-filter-group { --filter-tone:#516173; --filter-tone-soft:#f4f6f8; display: grid; grid-template-columns: 92px minmax(0,1fr); border-bottom: 1px solid var(--line); }
.blogger-filter-group.tone-note { --filter-tone:#245f91; --filter-tone-soft:#eef6fc; }
.blogger-filter-group.tone-traffic { --filter-tone:#24755a; --filter-tone-soft:#edf8f3; }
.blogger-filter-group.tone-internal { --filter-tone:#72529a; --filter-tone-soft:#f6f1fb; }
.blogger-filter-group-title { display: grid; place-items: center; padding: 12px 10px; border-right: 1px solid var(--line); background: var(--filter-tone-soft); }
.blogger-filter-group-title span { color: var(--filter-tone); font-size: 12px; font-weight: 800; line-height: 1.45; text-align: center; }
.blogger-filter-group-body { min-width: 0; }
.blogger-filter-line { display: grid; grid-template-columns: 106px minmax(0,1fr); gap: 12px; min-height: 52px; padding: 8px 14px; border-bottom: 1px solid #edf0f3; }
.blogger-filter-line:last-child { border-bottom: 0; }
.blogger-filter-line > strong { align-self: start; padding: 8px 10px; border-radius: 4px; color: #657181; background: #f4f6f8; font-size: 12px; text-align: center; }
.blogger-filter-controls { display: flex; min-width: 0; flex-wrap: wrap; align-items: flex-start; gap: 5px 8px; }
.blogger-filter-controls > label { display: inline-grid; grid-template-columns: auto minmax(108px,auto); align-items: center; gap: 6px; min-height: 36px; color: #5b6775; font-size: 11px; white-space: nowrap; }
.blogger-filter-controls input, .blogger-filter-controls select { width: auto; min-width: 118px; max-width: 210px; min-height: 34px; padding: 6px 8px; }
.blogger-category-all { max-height: 116px; overflow-y: auto; padding-right: 4px; }
.blogger-filter-popover { position: relative; flex: 0 0 auto; }
.blogger-filter-popover > summary { display: inline-flex; min-height: 34px; align-items: center; gap: 4px; padding: 6px 8px 6px 10px; border: 1px solid transparent; border-radius: 4px; color: #4c5968; background: transparent; cursor: pointer; list-style: none; transition: border-color .16s ease, color .16s ease, background .16s ease; }
.blogger-filter-popover > summary::-webkit-details-marker { display: none; }
.blogger-filter-popover > summary:hover { border-color: #d8dee6; color: var(--accent); background: #f8fafc; }
.blogger-filter-popover > summary span { font-size: 12px; white-space: nowrap; }
.blogger-filter-popover > summary b { padding: 2px 5px; border-radius: 3px; color: var(--accent); background: var(--accent-soft); font-size: 9px; font-weight: 700; }
.blogger-filter-popover > summary svg { width: 13px; height: 13px; color: #8a95a2; transition: transform .16s ease; }
.blogger-filter-popover[open] { z-index: 30; }
.blogger-filter-popover[open] > summary { border-color: #f0a1ac; color: var(--accent); background: #fff5f6; }
.blogger-filter-popover[open] > summary svg { transform: rotate(180deg); }
.blogger-filter-popover.is-active > summary { color: #a33143; background: #fff6f7; }
.blogger-filter-popover-panel { position: absolute; z-index: 31; top: calc(100% + 6px); left: 0; display: grid; width: max-content; min-width: 268px; max-width: min(380px,calc(100vw - 48px)); gap: 8px; padding: 13px; border: 1px solid #d9dfe7; border-radius: 6px; box-shadow: 0 16px 38px rgba(26,37,50,.16); background: var(--surface); }
.blogger-filter-popover:nth-last-child(-n+2) .blogger-filter-popover-panel { right: 0; left: auto; }
.blogger-filter-popover-panel > label { color: #4b5867; font-size: 11px; font-weight: 700; }
.blogger-filter-popover-panel > small { max-width: 320px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.blogger-filter-popover-panel > input, .blogger-filter-popover-panel > select { width: 100%; max-width: none; }
.blogger-popover-range { display: grid; grid-template-columns: minmax(92px,1fr) 10px minmax(92px,1fr) auto; align-items: center; gap: 6px; }
.blogger-popover-range input { width: 100%; min-width: 0; max-width: none; }
.blogger-popover-range b { color: #9aa4af; font-weight: 400; text-align: center; }
.blogger-popover-range em, .blogger-popover-composite em { color: var(--muted); font-size: 11px; font-style: normal; }
.blogger-popover-composite { display: grid; grid-template-columns: minmax(116px,1fr) minmax(100px,1fr) auto; align-items: center; gap: 7px; }
.blogger-popover-composite input, .blogger-popover-composite select { width: 100%; min-width: 0; max-width: none; }
.blogger-range { display: inline-grid; grid-template-columns: 92px 10px 92px auto; align-items: center; gap: 5px; }
.blogger-range input { width: 92px; min-width: 0; }
.blogger-range b { color: #a1aab5; font-weight: 400; text-align: center; }
.blogger-range small { color: var(--muted); }
.blogger-more-filters > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; padding: 8px 2px; color: #334150; cursor: pointer; list-style: none; }
.blogger-more-filters > summary::-webkit-details-marker { display: none; }
.blogger-more-filters > summary span { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 700; }
.blogger-more-filters > summary svg { width: 15px; height: 15px; }
.blogger-more-filters > summary small { color: var(--muted); font-size: 11px; font-weight: 400; }
.blogger-more-filters[open] > summary { color: var(--accent); }
.blogger-filter-footer { display: flex; width: 100%; max-width: 100%; align-items: center; gap: 16px; margin-top: 10px; padding: 10px 0 2px; border-top: 1px solid var(--line); }
.blogger-filter-status { display: flex; min-width: 230px; max-width: min(720px,calc(100% - 220px)); align-items: center; gap: 9px; padding: 7px 9px; border: 1px solid #dfe4ea; border-radius: 6px; background: #f8fafb; box-shadow: 0 1px 2px rgba(24,32,42,.04); }
.blogger-filter-status-icon { display: grid; width: 32px; height: 32px; flex: 0 0 32px; place-items: center; border-radius: 5px; color: #697687; background: #e9edf2; }
.blogger-filter-status-icon svg { width: 15px; height: 15px; }
.blogger-filter-status.is-active .blogger-filter-status-icon { color: #b33246; background: #ffe9ed; }
.blogger-filter-status-copy { display: grid; min-width: 0; gap: 3px; }
.blogger-filter-status-copy > strong { color: #3f4b59; font-size: 11px; line-height: 1.2; }
.blogger-active-filters { display: flex; min-width: 0; flex-wrap: wrap; align-items: center; gap: 5px; }
.blogger-active-filters > span { color: var(--muted); font-size: 11px; line-height: 1.35; }
.blogger-active-filters button { display: inline-flex; max-width: 240px; min-height: 25px; align-items: center; gap: 5px; padding: 3px 7px; border: 1px solid #f2cbd0; border-radius: 4px; color: #a43c49; background: #fff6f7; font-size: 10px; }
.blogger-active-filters button span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.blogger-active-filters button svg { width: 12px; height: 12px; }
.blogger-filter-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 5px; margin-left: auto; }
.blogger-filter-actions .btn { min-height: 34px; white-space: nowrap; }
.blogger-column-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin-top: 14px; }
.blogger-column-option { display: flex; min-height: 40px; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 5px; cursor: pointer; }
.blogger-column-option input { width: 16px; min-height: 16px; }
.blogger-column-option span { flex: 1; font-size: 12px; }
.blogger-column-option small { color: var(--muted); font-size: 10px; }
.blogger-column-option.locked { background: var(--surface-soft); cursor: default; }
.bulk-bar { display: flex; min-height: 46px; align-items: center; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; color: #4d5968; }
.bulk-bar > span { margin-left: auto; color: var(--muted); font-size: 12px; }
.field { display: grid; gap: 7px; }
.field label { color: #485565; font-size: 12px; font-weight: 700; }
.field small { color: var(--muted); line-height: 1.45; }
input, select, textarea {
  width: 100%;
  min-height: 36px;
  padding: 8px 10px;
  border: 1px solid #d9dfe6;
  border-radius: 6px;
  outline: none;
  color: var(--text);
  background: #fff;
}
input[type="checkbox"] {
  appearance: none;
  display: inline-grid;
  width: 16px;
  min-width: 16px;
  height: 16px;
  min-height: 16px;
  place-content: center;
  padding: 0;
  margin: 0;
  border: 1px solid #aeb8c4;
  border-radius: 4px;
  background: #fff;
  vertical-align: middle;
}
input[type="checkbox"]::before { width: 8px; height: 5px; border: solid #fff; border-width: 0 0 2px 2px; content: ""; transform: translateY(-1px) rotate(-45deg) scale(0); }
input[type="checkbox"]:checked { border-color: var(--accent); background: var(--accent); }
input[type="checkbox"]:checked::before { transform: translateY(-1px) rotate(-45deg) scale(1); }
input[type="checkbox"]:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(239,54,85,.12); }
input[type="checkbox"]:disabled { cursor: not-allowed; opacity: .45; }
textarea { min-height: 88px; resize: vertical; line-height: 1.55; }
input:focus, select:focus, textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(38,120,217,.1); }
.filters input { width: min(260px,100%); }
.filters select { width: auto; min-width: 130px; }
.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }
.form-grid .span-2 { grid-column: 1 / -1; }
.form-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; }
.export-field-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 16px 0 10px; }
.export-field-toolbar > span { color: var(--muted); font-size: 13px; }
.export-field-toolbar > div { display: flex; gap: 6px; }
.export-field-groups { max-height: min(58vh, 620px); overflow: auto; border-block: 1px solid var(--line); }
.export-field-group { padding: 13px 2px 14px; }
.export-field-group + .export-field-group { border-top: 1px solid var(--line); }
.export-group-head { display: flex; align-items: center; gap: 8px; color: var(--text); font-weight: 700; cursor: pointer; }
.export-group-head small { margin-left: auto; color: var(--muted); font-size: 12px; font-weight: 500; }
.export-field-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px 16px; margin-top: 10px; padding-left: 24px; }
.export-field-options label { display: flex; min-width: 0; align-items: flex-start; gap: 7px; color: var(--text-2); font-size: 12px; line-height: 1.45; cursor: pointer; }
.export-field-options span { min-width: 0; overflow-wrap: anywhere; }
.export-field-options input, .export-group-head input { flex: 0 0 auto; margin-top: 2px; accent-color: var(--primary); }

.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; min-width: 820px; border-collapse: collapse; }
th { padding: 11px 13px; border-bottom: 1px solid var(--line); color: #667281; background: #fafbfc; font-size: 11px; text-align: left; white-space: nowrap; }
td { padding: 12px 13px; border-bottom: 1px solid #edf0f3; vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover td { background: #fbfcfd; }
.review-user-row td { padding: 10px 14px; background: var(--surface-soft); border-top: 1px solid var(--line); }
.review-user-row:hover td { background: var(--surface-soft); }
.review-user-row td > div { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.review-user-row span { color: var(--muted); font-size: 12px; }
.table-title { font-weight: 700; line-height: 1.35; }
.table-sub { margin-top: 4px; color: var(--muted); font-size: 11px; line-height: 1.4; }
.table-actions { display: flex; flex-wrap: nowrap; gap: 6px; }
.danger-text { color: var(--red); }
strong.positive { color: var(--green); }
.assessment-panel table { min-width: 1180px; }
.assessment-panel td { min-width: 122px; vertical-align: top; }
.assessment-panel td:first-child { min-width: 250px; }
.assessment-panel td:nth-child(3), .assessment-panel td:nth-child(4) { min-width: 240px; }
.assessment-statuses { display: flex; flex-wrap: wrap; gap: 5px; min-height: 24px; }
.assessment-progress { width: 100%; height: 6px; margin-top: 9px; overflow: hidden; border-radius: 3px; background: #e8edf2; }
.assessment-progress span { display: block; height: 100%; border-radius: inherit; background: var(--green); }
.assessment-trend { display: grid; grid-template-columns: repeat(7,22px); align-items: end; gap: 5px; height: 58px; margin-top: 9px; }
.assessment-trend > span { display: grid; grid-template-rows: 28px 12px 12px; justify-items: center; align-items: end; color: var(--muted); cursor: default; }
.assessment-trend i { display: block; width: 10px; max-height: 28px; border-radius: 2px 2px 0 0; background: var(--blue); }
.assessment-trend small { font-size: 8px; line-height: 12px; white-space: nowrap; }
.assessment-trend b { color: #43505f; font-size: 9px; line-height: 12px; }
.assessment-double-trend { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.assessment-double-trend > div > small { display: block; margin-top: 7px; color: var(--muted); font-weight: 700; }
.assessment-double-trend .assessment-trend { grid-template-columns: repeat(7,17px); gap: 3px; }
.assessment-double-trend .assessment-trend i { width: 8px; }
.assessment-detail { margin-top: 8px; }
.assessment-detail > summary { color: var(--blue); cursor: pointer; font-size: 11px; font-weight: 700; }
.assessment-detail > div { display: grid; gap: 6px; max-height: 180px; margin-top: 8px; overflow-y: auto; }
.assessment-detail p { display: grid; grid-template-columns: minmax(120px,1fr) auto auto; align-items: center; gap: 7px; margin: 0; padding: 6px 8px; background: var(--surface-soft); font-size: 11px; }
.assessment-detail p > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.assessment-detail p > strong { white-space: nowrap; }
.assessment-result { min-width: 180px; }
.assessment-result ul { display: grid; gap: 5px; margin: 8px 0 0; padding: 0; list-style: none; }
.assessment-result li { display: flex; align-items: center; gap: 5px; font-size: 11px; white-space: nowrap; }
.assessment-result li.positive { color: var(--green); }
.assessment-result li svg { width: 13px; height: 13px; flex: 0 0 auto; }
.assessment-settings-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.assessment-setting-field { display: grid; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); }
.assessment-setting-field .toggle-line { display: flex; align-items: center; gap: 7px; font-weight: 700; }
.assessment-setting-field .input-with-unit { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 7px; }
.assessment-setting-field .input-with-unit span { color: var(--muted); font-size: 12px; }
@media (max-width: 760px) { .assessment-settings-grid { grid-template-columns: 1fr; } }
.commission-panel table { min-width: 1260px; }
.commission-panel td { vertical-align: top; }
.commission-status-reasons { max-width: 220px; margin-top: 6px; color: #9a6810; font-size: 11px; line-height: 1.45; }
.commission-main-row { cursor: pointer; }
.commission-main-row:hover td { background: #fbfcfd; }
.commission-person { display: grid; grid-template-columns: 28px minmax(120px,1fr); align-items: start; gap: 8px; }
.commission-person span, .commission-person small { display: block; }
.commission-person small { margin-top: 4px; color: var(--muted); font-size: 11px; font-weight: 400; line-height: 1.4; }
.commission-detail-row > td { padding: 0; background: var(--surface-soft); }
.commission-detail-row:hover > td { background: var(--surface-soft); }
.commission-detail-wrap { display: grid; gap: 18px; padding: 18px 20px 20px 54px; border-bottom: 1px solid var(--line); box-shadow: inset 3px 0 0 var(--accent); }
.commission-tier-breakdown { display: grid; grid-template-columns: repeat(auto-fit,minmax(190px,1fr)); gap: 8px; }
.commission-tier-part { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 6px 12px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.commission-tier-part span { color: var(--muted); font-size: 11px; font-weight: 700; }
.commission-tier-part strong { color: #4b5867; font-size: 11px; text-align: right; }
.commission-tier-part b { grid-column: 1 / -1; font-size: 17px; }
.commission-rule-overview { overflow: hidden; }
.commission-rule-cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; padding: 16px 18px 18px; }
.commission-rule-group { display: flex; min-width: 0; align-items: stretch; flex-wrap: wrap; gap: 7px; }
.commission-rule-label { display: grid; min-width: 72px; place-items: center; padding: 9px 12px; border-left: 3px solid var(--accent); color: var(--text); background: var(--accent-soft); font-size: 12px; font-weight: 800; }
.commission-rule-chip { min-width: 132px; flex: 1; padding: 9px 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.commission-rule-chip strong, .commission-rule-chip span, .commission-rule-chip b { display: block; }
.commission-rule-chip strong { font-size: 12px; }
.commission-rule-chip span { margin-top: 4px; color: var(--muted); font-size: 10px; white-space: nowrap; }
.commission-rule-chip b { margin-top: 6px; color: var(--accent); font-size: 16px; }
.commission-tools { align-items: stretch; }
.commission-tools > .panel { margin: 0; }
.commission-calculator-form { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)) auto; align-items: end; gap: 10px; padding: 16px 18px; }
.commission-calculator-form label { display: grid; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 700; }
.commission-calculator-form .btn { min-height: 36px; }
.commission-calc-result { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 0 18px 18px; padding: 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); }
.commission-calc-result > div { padding: 5px 8px; }
.commission-calc-result span, .commission-calc-result strong { display: block; }
.commission-calc-result span { color: var(--muted); font-size: 10px; }
.commission-calc-result strong { margin-top: 5px; font-size: 17px; }
.commission-calc-result .total { border-left: 3px solid var(--green); color: var(--green); }
.commission-calc-result p { grid-column: 1 / -1; margin: 0; padding: 9px 8px 0; border-top: 1px dashed var(--line); color: var(--muted); font-size: 10px; line-height: 1.6; }
.commission-basis-list { display: grid; gap: 0; padding: 4px 18px 14px; }
.commission-basis-list > div { display: grid; grid-template-columns: 86px minmax(0,1fr); gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.commission-basis-list > div:last-child { border-bottom: 0; }
.commission-basis-list strong { font-size: 12px; }
.commission-basis-list p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.65; }
.blogger-table { scrollbar-color: #aeb8c3 #edf1f4; }
.blogger-table table { min-width: 2260px; }
.blogger-table thead th { height: 52px; padding: 12px 15px; background: #f5f7f9; color: #465464; font-size: 12px; font-weight: 750; }
.blogger-table tbody td { height: 122px; padding: 15px; color: #243140; font-size: 13px; line-height: 1.5; vertical-align: middle; }
.blogger-table tbody tr:nth-child(even) td { background: #fbfcfd; }
.blogger-table tbody tr:hover td { background: #f2f6fa; }
.blogger-table tbody td > strong { color: #172433; font-size: 14px; font-variant-numeric: tabular-nums; }
.blogger-table .table-title { color: #172433; font-size: 14px; line-height: 1.45; }
.blogger-table .table-sub { margin-top: 5px; color: #596879; font-size: 12px; line-height: 1.5; }
.blogger-profile-cell { min-width: 228px; }
.blogger-profile-cell .identity-cell { min-width: 206px; align-items: flex-start; gap: 11px; }
.blogger-profile-cell .avatar { position: relative; width: 48px; height: 48px; flex-basis: 48px; overflow: hidden; font-size: 14px; }
.blogger-profile-cell .avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.blogger-profile-cell .avatar img.is-broken { display: none; }
.blogger-location { display: flex; align-items: center; gap: 4px; margin-top: 5px; color: #596879; font-size: 12px; line-height: 1.45; }
.blogger-location svg { width: 13px; height: 13px; flex: 0 0 auto; }
.blogger-notes-cell { min-width: 326px; }
.blogger-note-list { display: flex; gap: 10px; }
.blogger-note-item { display: grid; width: 150px; grid-template-columns: 56px minmax(0,1fr); gap: 9px; align-items: center; color: inherit; text-decoration: none; }
.blogger-note-media { position: relative; display: block; width: 56px; height: 76px; overflow: hidden; border-radius: 5px; background: #eef1f4; }
.blogger-note-item img, .blogger-note-placeholder { position: absolute; inset: 0; display: grid; width: 56px; height: 76px; place-items: center; object-fit: cover; background: #eef1f4; }
.blogger-note-item img.is-broken { visibility: hidden; }
.blogger-note-placeholder svg { width: 18px; color: #9ba5b1; }
.blogger-note-item strong, .blogger-note-item small { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.blogger-note-item strong { display: -webkit-box; color: #273646; font-size: 12px; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.blogger-note-item small { margin-top: 6px; color: #627182; font-size: 11px; line-height: 1.4; white-space: nowrap; }
.blogger-note-item:hover strong { color: var(--accent); }
.blogger-note-empty { display: inline-flex; min-width: 170px; align-items: center; gap: 7px; color: #667587; font-size: 12px; }
.blogger-note-empty svg { width: 15px; height: 15px; }
.blogger-dual-value { display: grid; gap: 7px; min-width: 122px; }
.blogger-dual-value span { display: flex; align-items: center; gap: 6px; font-size: 13px; font-variant-numeric: tabular-nums; font-weight: 750; white-space: nowrap; }
.blogger-dual-value svg { width: 14px; height: 14px; color: #677587; }
.blogger-table .tag-list { gap: 5px; margin-top: 0; }
.blogger-table .mini-tag { min-height: 23px; padding: 3px 7px; color: #465668; background: #f6f8fa; font-size: 11px; }
.blogger-cost-cell { min-width: 218px; }
.blogger-cost-row { display: grid; grid-template-columns: 38px repeat(2,minmax(68px,1fr)); align-items: center; gap: 8px; margin-bottom: 7px; padding: 6px 8px; border-radius: 5px; background: #f6f8fa; white-space: nowrap; }
.blogger-cost-row:last-child { margin-bottom: 0; }
.blogger-cost-row > strong { color: #39495a; font-size: 11px; }
.blogger-cost-row > span { display: grid; gap: 2px; }
.blogger-cost-row > span > small { color: #768495; font-size: 9px; font-weight: 700; line-height: 1; }
.blogger-metric-stack { display: grid; grid-template-columns: repeat(2,minmax(50px,1fr)); gap: 5px 9px; min-width: 122px; color: #465668; font-size: 12px; font-variant-numeric: tabular-nums; }
.blogger-coverage { display: grid; gap: 5px; min-width: 84px; }
.blogger-sort-label { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; color: inherit; background: transparent; font: inherit; font-weight: 700; white-space: nowrap; }
.blogger-sort-label:hover, .blogger-sort-label.active { color: var(--accent); }
.blogger-sort-label svg { width: 12px; height: 12px; }
.cost-metric-group { text-align: center; font-weight: 800; }
.cost-metric-group.picture { color: #1f6eb8; background: #f1f7fc; }
.cost-metric-group.video { color: #16734a; background: #f1f8f5; }
.cost-metric-head { padding: 0; text-align: center; }
.cost-metric-head button { display: inline-flex; width: 100%; min-width: 68px; min-height: 36px; align-items: center; justify-content: center; gap: 4px; padding: 8px 9px; border: 0; color: #657181; background: transparent; font-size: 11px; font-weight: 800; }
.cost-metric-head button:hover { color: var(--text); background: #eef2f6; }
.cost-metric-head.active button { color: var(--accent); background: #fff1f3; }
.cost-metric-head svg { width: 13px; height: 13px; }
.cost-metric-value { color: #1f2f40; font-size: 12px; font-variant-numeric: tabular-nums; font-weight: 750; white-space: nowrap; }
.cost-metric-empty { color: #7e8b99; font-size: 12px; white-space: nowrap; }
.cost-metric-detail-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; padding-top: 14px; }
.cost-metric-detail-grid > div { display: grid; grid-template-columns: minmax(52px,.7fr) repeat(4,minmax(90px,1fr)); align-items: center; gap: 8px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 6px; background: #fafbfc; }
.cost-metric-detail-grid strong { color: var(--text); }
.cost-metric-detail-grid span { color: #485565; font-variant-numeric: tabular-nums; white-space: nowrap; }
.metric-formula-note { margin-top: 10px; }
.selection-cell { width: 42px; min-width: 42px; text-align: center; }
.blogger-table .selection-cell input { width: 17px; min-height: 17px; }
.table-footer { display: flex; min-height: 58px; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 16px; border-top: 1px solid var(--line); background: var(--surface); }
.page-size-control { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; }
.page-size-control select { width: auto; min-width: 78px; min-height: 32px; padding: 5px 8px; }
.pager { display: flex; align-items: center; gap: 4px; }
.pager-button { display: inline-grid; width: 32px; height: 32px; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 5px; color: var(--text); background: var(--surface); font-weight: 600; }
.pager-button:hover:not(:disabled) { border-color: #b9c2cd; background: var(--surface-soft); }
.pager-button.active { border-color: var(--accent); color: #fff; background: var(--accent); }
.pager-button:disabled { cursor: not-allowed; opacity: .42; }
.pager-button svg { width: 15px; height: 15px; }
.pager-ellipsis { width: 24px; color: var(--muted); text-align: center; }
.active-row { background: #fff8f9; }
.active-row td:first-child { box-shadow: inset 3px 0 0 var(--accent); }
.link-button { max-width: 180px; padding: 0; border: 0; color: var(--blue); background: transparent; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.link-button:hover { text-decoration: underline; }
.duplicate-flag { display: inline-flex; margin-top: 5px; padding: 2px 5px; border-radius: 4px; color: var(--red); background: var(--red-soft); font-size: 10px; font-weight: 700; }
.agency-data-panel { margin-top: 16px; }
.agency-filter-body { display: grid; gap: 12px; border-bottom: 1px solid var(--line); }
.agency-filters { display: grid; grid-template-columns: repeat(4, minmax(130px,1fr)); }
.agency-filters .btn { min-width: 90px; }
.agency-bulk { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.agency-bulk select { width: auto; min-width: 150px; }
.agency-items-table table { min-width: 1500px; }
.plain-note { margin: 0; padding: 12px; border-left: 3px solid var(--line); color: var(--muted); background: var(--surface-soft); line-height: 1.65; white-space: pre-wrap; }
.inline-followup { display: grid; grid-template-columns: 150px minmax(0,1fr) auto; gap: 8px; margin-bottom: 12px; }
.followup-list { display: grid; gap: 0; }
.followup-item { display: grid; grid-template-columns: 132px 180px minmax(0,1fr); gap: 12px; align-items: start; padding: 11px 0; border-bottom: 1px solid var(--line); }
.followup-item > span { color: var(--muted); font-size: 11px; }
.followup-item > strong { font-size: 12px; }
.followup-item > p { margin: 0; line-height: 1.55; white-space: pre-wrap; }
.field > label.check-row { display: flex; width: 100%; min-height: 38px; align-items: center; gap: 8px; padding: 8px 10px; }
.field > label.check-row input { width: 16px; min-height: 16px; margin: 0; }
.role-view-hint { display: inline-flex; min-height: 34px; align-items: center; gap: 7px; padding: 7px 10px; color: var(--muted); font-size: 12px; }
.role-view-hint svg { width: 15px; height: 15px; }
.identity-cell { display: flex; min-width: 150px; align-items: center; gap: 9px; }
.avatar-sm { width: 30px; height: 30px; flex: 0 0 30px; font-size: 12px; }
.avatar-lg { width: 48px; height: 48px; flex: 0 0 48px; font-size: 18px; }
.inline-icon { width: 13px; height: 13px; vertical-align: -2px; }
.tag-list { display: flex; max-width: 220px; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.mini-tag { display: inline-flex; min-height: 20px; align-items: center; padding: 2px 6px; border: 1px solid #dfe5eb; border-radius: 4px; color: #556273; background: #f7f9fb; font-size: 10px; white-space: nowrap; }
.clamp { max-width: 230px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.row-disabled { opacity: .68; }
.check-row { display: flex; min-height: 36px; align-items: center; flex-wrap: wrap; gap: 16px; padding: 7px 10px; border: 1px solid #d9dfe6; border-radius: 6px; }
.check-row label { display: inline-flex; align-items: center; gap: 6px; font-weight: 400; }
.check-row input { width: 15px; min-height: 15px; margin: 0; }
.money { font-variant-numeric: tabular-nums; font-weight: 700; white-space: nowrap; }
.money.positive { color: var(--green); }
.money.danger { color: var(--red); }

.badge { display: inline-flex; min-height: 23px; align-items: center; padding: 3px 8px; border-radius: 999px; color: #4f5d6c; background: #edf1f4; font-size: 11px; font-weight: 700; white-space: nowrap; }
.badge.green { color: var(--green); background: var(--green-soft); }
.badge.blue { color: var(--blue); background: var(--blue-soft); }
.badge.amber { color: var(--amber); background: var(--amber-soft); }
.badge.red { color: var(--red); background: var(--red-soft); }
.badge.purple { color: var(--purple); background: var(--purple-soft); }
.badge.dark { color: #fff; background: #4b5968; }

.alert { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 16px; padding: 12px 14px; border: 1px solid #f3d6a5; border-radius: 7px; color: #7c5615; background: var(--amber-soft); line-height: 1.55; }
.alert.red { border-color: #f0c6ca; color: #9a3039; background: var(--red-soft); }
.alert.blue { border-color: #c9def5; color: #285d94; background: var(--blue-soft); }
.alert.green { border-color: #bfe3cc; color: #22663a; background: #effaf3; }
.alert svg { width: 18px; height: 18px; flex: 0 0 18px; margin-top: 1px; }
.alert .btn { margin-top: 9px; }
.ai-ready-models { margin-top: 8px; }
.ai-ready-models .mini-tag { display: inline-flex; align-items: center; gap: 5px; }
.ai-ready-models svg { width: 13px; height: 13px; margin: 0; }
.row-selected td { background: var(--blue-soft); }
.ai-project-row { cursor: pointer; }
.ai-project-row:hover td { background: var(--surface-soft); }
.ai-project-row.row-selected td { background: var(--red-soft); }
.ai-project-row.row-selected td:first-child { box-shadow: inset 3px 0 0 var(--accent); }
.ai-project-row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.ai-project-row .table-actions { min-width: 190px; }
.ai-test-after-save { margin: 14px 0; align-items: flex-start; }
.ai-test-after-save strong, .ai-test-after-save small { display: block; }
.ai-test-after-save small { margin-top: 4px; color: var(--muted); line-height: 1.5; }

.progress-list { display: grid; }
.progress-row { display: grid; grid-template-columns: minmax(180px,1fr) 100px minmax(120px,1fr) 60px; gap: 14px; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--line); }
.progress-row:last-child { border-bottom: 0; }
.progress-track { height: 7px; overflow: hidden; border-radius: 999px; background: #e9edf1; }
.progress-track span { display: block; height: 100%; background: var(--green); }
.rank-list { display: grid; }
.rank-row { display: grid; grid-template-columns: 28px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); }
.rank-row:last-child { border-bottom: 0; }
.rank-no { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 5px; color: #6a7684; background: #edf0f3; font-size: 11px; font-weight: 800; }
.rank-row:first-child .rank-no { color: #785d00; background: #ffe28a; }
.todo-list { display: grid; gap: 9px; }
.todo { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 6px; }

.project-list { display: grid; gap: 10px; }
.project-row { display: grid; grid-template-columns: minmax(220px,1.5fr) 105px 105px 110px 110px auto; gap: 14px; align-items: center; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.project-row:last-child { border-bottom: 0; }
.project-row:hover { background: #fbfcfd; }
.project-row-head { color: var(--muted); background: #fafbfc; font-size: 11px; font-weight: 700; }

.project-status-filter { margin-bottom: 12px; }
.project-workspace { display: grid; grid-template-columns: 260px minmax(0,1fr); min-height: 620px; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.project-workspace-list { min-width: 0; border-right: 1px solid var(--line); background: var(--surface-soft); }
.project-list-head { display: flex; min-height: 48px; align-items: center; justify-content: space-between; padding: 0 14px; border-bottom: 1px solid var(--line); }
.project-list-head span { color: var(--muted); }
.project-nav-list { display: grid; gap: 7px; max-height: calc(100vh - 280px); padding: 8px; overflow-y: auto; }
.project-nav-item { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px 8px; width: 100%; padding: 12px; border: 1px solid transparent; border-radius: 6px; color: var(--text); background: var(--surface); text-align: left; }
.project-nav-item:hover { background: var(--surface); }
.project-nav-item.active { border-color: var(--accent); box-shadow: none; background: var(--red-soft); }
.project-nav-title { overflow: hidden; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.project-nav-item small { grid-column: 1 / -1; overflow: hidden; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.project-workspace-main { min-width: 0; padding: 18px; }
.project-detail-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.project-title-line { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }
.project-title-line h2 { margin: 0; font-size: 18px; }
.project-detail-head p { margin: 7px 0 0; color: var(--muted); }
.project-pipeline { display: flex; align-items: center; gap: 7px; margin: 14px 0; padding: 12px 14px; border: 1px solid var(--line); border-radius: 6px; overflow-x: auto; background: var(--surface-soft); }
.project-pipeline > span { flex: 0 0 auto; margin-right: 6px; color: var(--muted); font-size: 12px; font-weight: 700; }
.project-pipeline > i { color: var(--muted); font-style: normal; }
.pipeline-step { display: inline-flex; min-width: max-content; align-items: center; gap: 6px; padding: 5px 7px; border: 0; color: var(--muted); background: transparent; font-size: 12px; }
.pipeline-step b { display: grid; width: 24px; height: 24px; place-items: center; border: 1px solid var(--line); border-radius: 50%; font-size: 11px; }
.pipeline-step.done { color: var(--green); }
.pipeline-step.done b { color: #fff; border-color: var(--green); background: var(--green); }
.pipeline-step.active { color: var(--blue); font-weight: 700; }
.pipeline-step.active b { border-color: var(--blue); background: var(--blue-soft); }
.project-detail-metrics { grid-template-columns: repeat(7,minmax(110px,1fr)); gap: 18px; margin: 0 0 8px; }
.project-detail-metrics .detail-metric { min-height: 74px; padding: 8px 0; border: 0; background: transparent; }
.project-detail-metrics .detail-metric strong { margin-top: 5px; font-size: 18px; }
.project-requirements-copy { padding: 13px 14px; border-left: 3px solid var(--blue); background: var(--blue-soft); }
.project-requirements-copy p { max-height: 116px; margin: 6px 0 0; overflow: auto; color: var(--muted); line-height: 1.7; white-space: pre-wrap; }
.workspace-section { margin-top: 20px; }
.workspace-section + .workspace-section { padding-top: 18px; border-top: 1px solid var(--line); }
.candidate-list { display: flex; flex-wrap: wrap; gap: 8px; }
.candidate-chip { display: grid; grid-template-columns: auto auto minmax(130px,1fr) auto auto; align-items: center; gap: 7px; max-width: 390px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); }
.candidate-chip.blocked { opacity: .72; }
.candidate-chip strong, .candidate-chip small { display: block; }
.candidate-chip small { margin-top: 3px; color: var(--muted); font-size: 11px; }
.candidate-chip .badge { display: inline-flex; margin-top: 6px; }
.project-blogger-picker { display: grid; grid-template-columns: minmax(330px,.85fr) minmax(500px,1.15fr); min-height: 590px; border: 1px solid var(--line); border-radius: 7px; overflow: hidden; }
.project-blogger-source, .project-blogger-selection { min-width: 0; padding: 18px; background: var(--surface); }
.project-blogger-source { border-right: 1px solid var(--line); background: var(--surface-soft); }
.picker-section-head { display: flex; min-height: 43px; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 13px; }
.picker-section-head h3 { margin: 0; font-size: 14px; }
.picker-section-head p { margin: 5px 0 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.project-blogger-search input { min-height: 40px; background: var(--surface); }
.project-blogger-search svg { top: 12px; }
.picker-search-meta { min-height: 29px; padding: 8px 1px 6px; color: var(--muted); font-size: 11px; }
.project-blogger-results { display: grid; align-content: start; min-height: 220px; max-height: 340px; overflow: auto; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.project-blogger-result { display: grid; grid-template-columns: 36px minmax(0,1fr) auto 18px; align-items: center; gap: 9px; width: 100%; min-height: 62px; padding: 10px 11px; border: 0; border-bottom: 1px solid var(--line); color: var(--text); background: transparent; text-align: left; cursor: pointer; }
.project-blogger-result:last-child { border-bottom: 0; }
.project-blogger-result:hover { background: #f8fafc; }
.project-blogger-result.selected { color: #738092; background: #f1f4f7; cursor: default; }
.project-blogger-result > svg { width: 16px; color: var(--accent); }
.picker-avatar { display: inline-grid; width: 34px; height: 34px; place-items: center; flex: 0 0 34px; border: 1px solid #f2c8d0; border-radius: 50%; color: #b52743; background: #fff1f4; font-size: 12px; font-weight: 800; }
.picker-identity { min-width: 0; }
.picker-identity strong, .picker-identity small, .picker-price strong, .picker-price small { display: block; }
.picker-identity strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.picker-identity small, .picker-price small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.picker-price { text-align: right; white-space: nowrap; }
.picker-price strong { font-size: 12px; }
.picker-loading { display: flex; min-height: 110px; align-items: center; justify-content: center; gap: 8px; color: var(--muted); font-size: 12px; }
.picker-loading.inline { min-height: 40px; }
.picker-loading span { width: 14px; height: 14px; border: 2px solid #dce2e8; border-top-color: var(--accent); border-radius: 50%; animation: spin .8s linear infinite; }
.project-blogger-paste { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 10px; margin: 12px 0; padding: 12px; border: 1px solid var(--line); border-left: 3px solid var(--primary); border-radius: 6px; background: var(--surface); }
.project-blogger-paste .field { min-width: 0; }
.project-blogger-paste textarea { min-height: 82px; resize: vertical; background: var(--surface); }
.project-blogger-paste .btn { min-height: 38px; white-space: nowrap; }
.picker-or { display: flex; align-items: center; gap: 10px; margin: 12px 0; color: var(--muted); font-size: 12px; }
.picker-or::before, .picker-or::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.project-blogger-filter-row { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 10px 0; }
.project-blogger-filter-row select, .project-blogger-filter-row input { width: 100%; min-width: 0; min-height: 36px; }
.project-blogger-match-result { display: grid; gap: 7px; margin-top: 10px; }
.picker-match-summary, .picker-issue, .picker-submit-summary { padding: 9px 10px; border: 1px solid var(--line); border-radius: 6px; color: #4b5869; background: var(--surface); font-size: 11px; line-height: 1.5; }
.picker-match-summary { display: flex; align-items: center; gap: 7px; border-color: #b9dac8; color: #26704a; background: #f1faf5; }
.picker-match-summary svg { width: 15px; }
.picker-issue { display: grid; grid-template-columns: 84px minmax(0,1fr); gap: 8px; }
.picker-issue > span { display: flex; flex-wrap: wrap; gap: 5px; color: var(--muted); }
.picker-issue.danger { border-color: #f0c6cd; color: var(--red); background: #fff6f7; }
.project-blogger-bulk-settings { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto; align-items: end; gap: 8px; padding: 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); }
.project-blogger-bulk-settings label, .project-blogger-selected-fields label { display: grid; gap: 5px; color: #536071; font-size: 10px; font-weight: 700; }
.project-blogger-bulk-settings select { min-height: 34px; }
.project-blogger-selected { display: grid; align-content: start; gap: 10px; min-height: 430px; max-height: 505px; margin-top: 10px; overflow: auto; }
.picker-selected-empty { display: grid; min-height: 260px; place-items: center; align-content: center; gap: 7px; padding: 20px; color: var(--muted); text-align: center; }
.picker-selected-empty.compact { min-height: 150px; }
.picker-selected-empty svg { width: 25px; }
.picker-selected-empty strong { color: #526071; font-size: 13px; }
.picker-selected-empty span { max-width: 280px; font-size: 11px; line-height: 1.5; }
.picker-selected-empty.danger, .picker-selected-empty.danger strong { color: var(--red); }
.project-blogger-selected-card { border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.project-blogger-selected-card > header { display: grid; grid-template-columns: 24px 34px minmax(0,1fr) 32px; align-items: center; gap: 8px; min-height: 54px; padding: 8px 10px; border-bottom: 1px solid var(--line); }
.picker-index { display: inline-grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; color: #687586; background: #edf1f5; font-size: 10px; font-weight: 800; }
.project-blogger-selected-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; padding: 10px; }
.project-blogger-selected-fields .span-2 { grid-column: 1 / -1; }
.project-blogger-selected-fields input, .project-blogger-selected-fields select { min-height: 34px; }
.project-blogger-selected-fields textarea { min-height: 54px; }
.project-blogger-submit-result { margin-top: 12px; }
.picker-submit-summary { display: grid; grid-template-columns: 190px minmax(0,1fr); gap: 10px; border-color: #f0c6cd; color: var(--red); background: #fff6f7; }
.picker-submit-summary span { color: #7f4b54; }
.project-blogger-actions { align-items: center; }
.project-blogger-actions > span { margin-right: auto; color: var(--muted); font-size: 12px; font-weight: 700; }
.project-orders table { min-width: 1420px; }
.project-orders tr.approval-row { background: #fff8f8; }
.project-order-tools { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; }
.project-order-search { width: min(360px,32vw); }
.project-order-search input { min-height: 34px; font-size: 12px; }
.project-order-search + .btn-icon { flex: 0 0 auto; }
.project-orders tr[hidden] { display: none; }
.project-row-actions { min-width: 168px; }
.project-stage-control { display: grid; grid-template-columns: 25px 12px 25px 12px 25px; align-items: center; min-width: 112px; }
.project-stage-control small { grid-column: 1 / -1; margin-top: 5px; color: var(--muted); text-align: center; }
.stage-dot { display: grid; width: 25px; height: 25px; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 50%; color: var(--muted); background: var(--surface); font-size: 10px; font-weight: 800; }
.stage-dot.active { color: var(--blue); border-color: var(--blue); background: var(--blue-soft); }
.stage-dot.done { color: #fff; border-color: var(--green); background: var(--green); }
.project-stage-control > i { height: 2px; background: var(--line); }
.table-total { font-weight: 700; background: var(--surface-soft); }
.workspace-danger { display: flex; justify-content: flex-start; margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--line); }
.project-requirements-details { padding: 0; border-top: 1px solid var(--line); }
.project-requirements-details > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 0; cursor: pointer; list-style: none; }
.project-requirements-details > summary::-webkit-details-marker { display: none; }
.project-requirements-details > summary span, .project-requirements-details > summary small { display: block; }
.project-requirements-details > summary small { margin-top: 4px; color: var(--muted); font-weight: 400; }
.project-requirements-details > summary svg { width: 17px; transition: transform .2s ease; }
.project-requirements-details[open] > summary svg { transform: rotate(180deg); }
.project-requirements-details .project-requirements-copy { margin-bottom: 16px; }
.ai-brief-panel { margin: -2px 0 20px; padding: 16px; border: 1px solid #ffd2d8; border-radius: 7px; background: #fff7f8; }
.ai-brief-head { display: flex; align-items: flex-start; gap: 11px; margin-bottom: 12px; }
.ai-brief-head > span { display: grid; flex: 0 0 34px; width: 34px; height: 34px; place-items: center; border-radius: 6px; color: #fff; background: var(--accent); }
.ai-brief-head svg { width: 18px; }
.ai-brief-head strong { font-size: 14px; }
.ai-brief-head p { margin: 4px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.ai-brief-panel textarea { min-height: 122px; background: #fff; }
.ai-brief-actions { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
.ai-brief-actions span { color: var(--muted); font-size: 12px; }
.ai-endpoint { max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.table-error { display: block; max-width: 300px; color: var(--red); }
.ai-log-table table { min-width: 980px; }
.ai-recommend-intro { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 18px; padding: 14px; border: 1px solid #f1c6cd; border-radius: 7px; background: #fff8f9; }
.ai-recommend-intro > span { display: grid; width: 36px; height: 36px; place-items: center; flex: 0 0 36px; border-radius: 6px; color: #fff; background: var(--accent); }
.ai-recommend-intro svg { width: 18px; }
.ai-recommend-intro strong { font-size: 14px; }
.ai-recommend-intro p { margin: 5px 0 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.ai-model-choices { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 7px; }
.ai-reference-field { margin-top: 16px; }
.ai-reference-field > small { display: block; margin-top: 4px; color: var(--muted); line-height: 1.6; }
.ai-reference-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-top: 9px; }
.ai-reference-direction { display: grid; gap: 7px; padding: 11px; border: 1px solid var(--line); border-radius: 7px; background: var(--soft); }
.ai-reference-direction > span { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.ai-reference-direction strong { color: var(--text); font-size: 12px; }
.ai-reference-direction small { color: var(--muted); text-align: right; }
.ai-reference-direction textarea { min-height: 78px; resize: vertical; background: var(--surface); }
.ai-reference-summary { margin-top: 10px; }
.ai-note-evidence { margin-top: 10px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 6px; background: var(--soft); }
.ai-note-evidence summary { cursor: pointer; color: var(--text); font-size: 12px; font-weight: 700; }
.ai-note-evidence ul { display: grid; gap: 7px; margin: 9px 0 0; padding: 0; list-style: none; }
.ai-note-evidence li { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 12px; }
.ai-note-evidence a,.ai-note-evidence span { min-width: 0; overflow: hidden; color: var(--text); text-overflow: ellipsis; white-space: nowrap; }
.ai-note-evidence a:hover { color: var(--accent); }
.ai-note-evidence small { flex: 0 0 auto; color: var(--muted); }
.ai-model-choice { display: grid; grid-template-columns: 18px minmax(0,1fr) auto; align-items: center; gap: 9px; padding: 11px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); cursor: pointer; }
.ai-model-choice strong, .ai-model-choice small { display: block; }
.ai-model-choice small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.ai-run-history { margin-top: 16px; border-top: 1px solid var(--line); }
.ai-run-history > summary { padding: 13px 0; color: var(--muted); font-size: 12px; font-weight: 700; cursor: pointer; }
.ai-result-summary { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 10px; }
.ai-result-summary strong { font-size: 15px; }
.ai-result-summary p { margin: 5px 0 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.ai-model-errors { display: grid; gap: 7px; margin: 10px 0; }
.ai-result-toolbar { display: flex; align-items: center; gap: 8px; margin: 14px 0 9px; }
.ai-result-toolbar > span { margin-left: auto; color: var(--muted); font-size: 12px; font-weight: 700; }
.ai-recommend-results { display: grid; gap: 10px; max-height: 58vh; overflow: auto; padding-right: 3px; }
.ai-recommend-card { border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.ai-recommend-card.added { opacity: .55; }
.ai-recommend-card > header { display: grid; grid-template-columns: 58px minmax(0,1fr) 62px 32px; align-items: center; gap: 10px; padding: 11px 12px; border-bottom: 1px solid var(--line); }
.ai-result-check { display: flex; align-items: center; gap: 7px; }
.ai-score { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; color: #fff; background: var(--accent); font-size: 12px; font-weight: 800; }
.ai-result-identity strong, .ai-result-identity span, .ai-result-votes strong, .ai-result-votes span { display: block; }
.ai-result-identity strong { font-size: 13px; }
.ai-result-identity span, .ai-result-votes span { margin-top: 3px; color: var(--muted); font-size: 10px; }
.ai-result-votes { text-align: center; }
.ai-result-votes strong { font-size: 14px; }
.ai-result-body { padding: 11px 12px 12px; }
.ai-reason-list, .ai-risk-list { display: flex; flex-wrap: wrap; gap: 6px; }
.ai-reason, .ai-risk-list span { display: inline-flex; align-items: center; gap: 4px; padding: 5px 7px; border-radius: 5px; font-size: 10px; line-height: 1.35; }
.ai-reason { color: #237047; background: #edf8f2; }
.ai-risk-list { margin-top: 7px; }
.ai-risk-list span { color: #9a4b00; background: #fff5e8; }
.ai-reason svg, .ai-risk-list svg { width: 12px; height: 12px; }
.ai-result-facts { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 10px; padding-top: 9px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.ai-result-facts strong { margin-left: 3px; color: var(--text); }
.ai-result-facts strong.positive { color: var(--green); }
.ai-result-facts strong.danger { color: var(--red); }
.ai-result-fields { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin-top: 10px; }
.ai-result-fields label { display: grid; gap: 4px; color: var(--muted); font-size: 10px; font-weight: 700; }
.ai-result-fields input, .ai-result-fields select { min-height: 34px; }
.advanced-fields { margin-top: 18px; border-top: 1px solid var(--line); }
.advanced-fields > summary { padding: 15px 0; color: var(--text); font-size: 13px; font-weight: 700; cursor: pointer; }
.parsed-direction-list { display: grid; gap: 7px; }
.parsed-direction { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); }
.parsed-direction strong, .parsed-direction span { display: block; }
.parsed-direction span { margin-top: 3px; color: var(--muted); font-size: 11px; }
.parse-review { display: grid; gap: 5px; margin-top: 10px; color: #a64b00; font-size: 12px; }
.parse-review span::before { content: '需核对：'; font-weight: 700; }
.pgy-prefill { display: grid; grid-template-columns: minmax(0,1fr) 190px auto; align-items: end; gap: 10px; padding: 13px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); }
.pgy-prefill p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.field small, .form-help { display: block; margin-top: 5px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.order-profit-preview { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin-top: 16px; padding: 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); font-size: 12px; }
.order-profit-preview span, .order-profit-preview strong { min-width: 0; }
.finance-formula { display: grid; grid-template-columns: repeat(4,minmax(110px,1fr) auto) minmax(130px,1.15fr); align-items: center; gap: 8px; overflow-x: auto; }
.finance-formula > div { min-width: 110px; padding: 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); }
.finance-formula span, .finance-formula strong { display: block; }
.finance-formula span { color: var(--muted); font-size: 11px; }
.finance-formula strong { margin-top: 6px; font-size: 16px; }
.finance-formula > b { color: var(--muted); font-size: 18px; }
.finance-formula .formula-result { border-color: #f6b5bf; background: var(--red-soft); }
.finance-project-table table { min-width: 980px; }
.link-command { display: inline-flex; max-width: 260px; align-items: center; gap: 4px; padding: 0; border: 0; color: var(--text); background: transparent; overflow: hidden; font-weight: 700; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.link-command:hover { color: var(--blue); }
.link-command svg { width: 14px; height: 14px; flex: 0 0 14px; }
.disclosure-button { display: grid; width: 26px; height: 26px; place-items: center; padding: 0; border: 1px solid transparent; border-radius: 5px; color: var(--muted); background: transparent; }
.disclosure-button:hover { border-color: var(--line); color: var(--text); background: var(--surface); }
.disclosure-button svg { width: 15px; height: 15px; transition: transform .18s ease; }
.disclosure-button[aria-expanded="true"] svg { transform: rotate(90deg); }
.finance-media-panel table { min-width: 1360px; }
.finance-media-row.has-risk td { background: #fffafb; }
.finance-media-row.has-risk td:first-child { box-shadow: inset 3px 0 0 var(--red); }
.finance-media-detail > td { padding: 0; background: var(--surface-soft); }
.finance-media-detail:hover > td { background: var(--surface-soft); }
.finance-detail-wrap { padding: 0 18px 18px 46px; border-bottom: 1px solid var(--line); box-shadow: inset 3px 0 0 #c8d1dc; }
.finance-detail-tabs { display: flex; gap: 4px; padding: 12px 0; }
.finance-detail-tabs button { padding: 7px 12px; border: 1px solid transparent; border-radius: 5px; color: var(--muted); background: transparent; font-size: 11px; font-weight: 800; }
.finance-detail-tabs button:hover { color: var(--text); background: var(--surface); }
.finance-detail-tabs button.active { border-color: #f0a7b3; color: var(--accent); background: var(--accent-soft); }
.finance-detail-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 9px; }
.finance-detail-title strong { font-size: 12px; }
.finance-detail-title span { color: var(--muted); font-size: 10px; }
.inner-table { min-width: 940px; border: 1px solid var(--line); background: var(--surface); }
.inner-table th { background: #f5f7f9; }
.finance-blogger-detail-table { min-width: 1260px; }
.finance-overdue-row td { background: var(--red-soft); }
.finance-progress { display: grid; grid-template-columns: minmax(64px,1fr) 38px; align-items: center; gap: 7px; min-width: 110px; }
.finance-progress > span { height: 6px; overflow: hidden; border-radius: 3px; background: #e9edf1; }
.finance-progress i { display: block; height: 100%; border-radius: inherit; }
.finance-progress i.green { background: var(--green); }
.finance-progress i.amber { background: var(--amber); }
.finance-progress i.red { background: var(--red); }
.finance-progress strong { color: #4a5664; font-size: 10px; text-align: right; }
.panel-footnote { display: flex; align-items: flex-start; gap: 7px; padding: 10px 14px; border-top: 1px solid var(--line); color: var(--muted); background: var(--surface-soft); font-size: 10px; line-height: 1.55; }
.panel-footnote svg { width: 14px; height: 14px; flex: 0 0 14px; }
.finance-project-panel table { min-width: 1230px; }
.contract-progress-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; padding: 16px 18px 18px; }
.contract-progress-card { display: grid; min-width: 0; gap: 8px; padding: 13px; border: 1px solid var(--line); border-radius: 7px; color: var(--text); background: var(--surface); text-align: left; }
.contract-progress-card:hover { border-color: #c9d2dc; box-shadow: 0 4px 14px rgba(26,38,52,.07); }
.contract-progress-card.risk { border-left: 3px solid var(--red); }
.contract-progress-card > b { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.contract-progress-card > small { color: var(--muted); font-size: 10px; }
.contract-progress-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.contract-progress-head > strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.contract-progress-next { display: flex; align-items: center; gap: 5px; color: var(--blue); font-size: 10px; font-weight: 700; }
.contract-progress-next svg { width: 12px; height: 12px; }
.contract-stage-flow { display: grid; grid-template-columns: repeat(4,minmax(48px,1fr)); align-items: start; gap: 0; min-width: 270px; }
.contract-stage-flow span { position: relative; display: grid; justify-items: center; gap: 4px; color: #a0a8b2; font-size: 9px; text-align: center; }
.contract-stage-flow span::after { position: absolute; top: 10px; left: calc(50% + 11px); width: calc(100% - 22px); height: 1px; background: #dce2e8; content: ""; }
.contract-stage-flow span:last-child::after { display: none; }
.contract-stage-flow i { position: relative; z-index: 1; display: grid; width: 21px; height: 21px; place-items: center; border: 1px solid #cfd6de; border-radius: 50%; background: var(--surface); font-size: 9px; font-style: normal; }
.contract-stage-flow i svg { width: 11px; height: 11px; }
.contract-stage-flow span.done { color: var(--green); }
.contract-stage-flow span.done i { border-color: var(--green); color: #fff; background: var(--green); }
.contract-stage-flow span.done::after { background: var(--green); }
.contract-stage-flow span.current { color: var(--blue); font-weight: 700; }
.contract-stage-flow span.current i { border-color: var(--blue); color: var(--blue); }
.contract-next-action { display: inline-flex; padding: 3px 7px; border-radius: 4px; font-size: 10px; font-weight: 800; }
.contract-next-action.amber { color: var(--amber); background: var(--amber-soft); }
.contract-next-action.red { color: var(--red); background: var(--red-soft); }
.contract-next-action.blue { color: var(--blue); background: var(--blue-soft); }
.contract-next-action.purple { color: var(--purple); background: var(--purple-soft); }
.contract-next-action.green { color: var(--green); background: var(--green-soft); }
.contract-table-panel table { min-width: 1540px; }
.contract-link-list { display: grid; gap: 7px; }
.contract-link-row { display: grid; grid-template-columns: minmax(0,1fr) minmax(180px,.7fr) auto; align-items: center; gap: 16px; width: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 6px; color: var(--text); background: var(--surface); text-align: left; }
.contract-link-row:hover { border-color: #f1a2ae; background: var(--red-soft); }
.contract-link-row span, .contract-link-row strong, .contract-link-row small { display: block; }
.contract-link-row small { margin-top: 4px; color: var(--muted); }
.recruitment-table table { min-width: 1680px; }
.address-cell { display: block; max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recruitment-task-table table { min-width: 1480px; }
.direction-summary { display: block; max-width: 250px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notify-intro { margin: 0 0 13px; color: var(--muted); font-size: 12px; line-height: 1.65; }
#notify-bloggers { min-height: 114px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 12px; }
.notify-format-row { display: flex; align-items: center; gap: 10px; margin: 10px 0 14px; color: var(--muted); font-size: 11px; }
.notify-format-row > span { flex: 1; }
.notify-match-result { overflow: hidden; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.notify-match-empty, .notify-match-loading { min-height: 86px; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 16px; color: var(--muted); text-align: center; }
.notify-match-empty svg { width: 18px; height: 18px; }
.notify-match-empty.danger { color: var(--red); background: var(--red-soft); }
.notify-match-loading > span { width: 18px; height: 18px; border: 2px solid #dce2e8; border-top-color: var(--accent); border-radius: 50%; animation: spin .8s linear infinite; }
.notify-match-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 13px; border-bottom: 1px solid var(--line); }
.notify-match-title strong { padding-left: 9px; border-left: 3px solid var(--accent); font-size: 14px; }
.notify-match-title span { color: var(--muted); font-size: 11px; }
.notify-match-table { max-height: 270px; }
.notify-match-table table { min-width: 620px; }
.notify-match-table th, .notify-match-table td { padding: 10px 12px; }
.notify-issues { padding: 6px 13px 10px; border-top: 1px solid var(--line); background: var(--surface-soft); }
.notify-issue { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 10px; padding: 6px 0; font-size: 11px; }
.notify-issue > span { color: var(--red); font-weight: 700; }
.notify-issue p { margin: 0; color: var(--muted); line-height: 1.5; overflow-wrap: anywhere; }
.notify-delivery-settings { margin-top: 14px; border: 1px solid var(--line); border-radius: 6px; }
.notify-delivery-settings summary { display: flex; align-items: center; gap: 9px; padding: 12px 13px; cursor: pointer; font-weight: 700; }
.notify-delivery-settings[open] summary { border-bottom: 1px solid var(--line); }
.notify-delivery-settings > .field { margin: 14px; }
.notify-delivery-settings .upload-preview { min-height: 80px; }
.notify-delivery-settings .upload-preview img { height: 130px; }
.notify-modal-actions { position: sticky; bottom: -20px; z-index: 2; margin: 18px -20px -20px; padding: 14px 20px; border-top: 1px solid var(--line); background: #fff; }

.recruit-preview-dialog { width: min(760px,100%); overflow: hidden; }
.recruit-preview-dialog .modal-body { padding: 0; }
.recruit-preview-stage { max-height: calc(100vh - 178px); overflow-y: auto; padding: 22px; background: #f1f3f5; }
.recruit-phone-preview { width: min(360px,100%); margin: 0 auto; overflow: hidden; border: 1px solid #dce2e8; border-radius: 8px; background: #fff; box-shadow: 0 10px 26px rgba(15,22,30,.11); }
.recruit-phone-preview > header { min-height: 108px; display: flex; flex-direction: column; justify-content: flex-end; padding: 18px; color: #fff; background: #ff3153; }
.recruit-phone-preview > header span { font-size: 11px; }
.recruit-phone-preview > header strong { margin: 7px 0 5px; font-size: 18px; line-height: 1.35; overflow-wrap: anywhere; }
.recruit-phone-preview > header small { color: rgba(255,255,255,.9); font-size: 11px; }
.recruit-preview-fields { display: grid; gap: 14px; padding: 18px; }
.recruit-preview-field label { display: block; margin-bottom: 6px; color: #202936; font-size: 12px; font-weight: 700; }
.recruit-preview-field em { color: #ff3153; font-style: normal; }
.recruit-preview-field input, .recruit-preview-field select, .recruit-preview-field textarea { width: 100%; min-height: 36px; padding: 8px 10px; border: 1px solid #d4dae2; border-radius: 6px; color: #344054; background: #fff; }
.recruit-preview-field textarea { min-height: 76px; resize: vertical; }
.recruit-preview-consent { display: flex; align-items: flex-start; gap: 8px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.recruit-preview-consent input { width: 15px; min-height: 15px; margin: 0; accent-color: #ff3153; }
.recruit-preview-submit { min-height: 38px; border: 0; border-radius: 6px; color: #fff; background: #ff3153; font-weight: 700; }
.recruit-preview-actions { margin: 0; padding: 12px 20px; border-top: 1px solid var(--line); background: #fff; }

.steps { display: flex; align-items: center; gap: 4px; min-width: 150px; }
.step { display: grid; place-items: center; width: 24px; height: 24px; border: 1px solid #dce2e8; border-radius: 50%; color: #8a95a2; background: #fff; font-size: 10px; font-weight: 800; }
.step.done { border-color: var(--green); color: #fff; background: var(--green); }
.step.active { border-color: var(--blue); color: var(--blue); background: var(--blue-soft); }
.step-line { width: 12px; height: 2px; background: #dce2e8; }
.step-line.done { background: var(--green); }

.integration-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.integration-item { padding: 15px; border: 1px solid var(--line); border-radius: 6px; }
.integration-item h3 { margin: 0 0 7px; font-size: 14px; }
.integration-item p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.integration-flow { display: grid; grid-template-columns: repeat(4,minmax(20px,auto) minmax(120px,1fr)) minmax(120px,1fr); align-items: center; gap: 8px; margin-bottom: 16px; padding: 15px 18px; border: 1px solid var(--line); background: var(--surface); }
.integration-flow > div { min-width: 0; text-align: center; }
.integration-flow strong, .integration-flow span { display: block; }
.integration-flow strong { font-size: 22px; }
.integration-flow span { margin-top: 4px; color: var(--muted); font-size: 12px; }
.integration-flow > svg { width: 16px; color: var(--muted); }

.view-tabs { display: flex; align-items: center; gap: 2px; margin: -4px 0 16px; border-bottom: 1px solid var(--line); }
.view-tab { display: inline-flex; min-height: 40px; align-items: center; gap: 7px; padding: 8px 13px; border: 0; border-bottom: 2px solid transparent; color: var(--muted); background: transparent; font-weight: 700; }
.view-tab:hover { color: var(--text); background: #f7f9fb; }
.view-tab.active { border-bottom-color: var(--accent); color: var(--accent); }
.view-tab svg { width: 16px; height: 16px; }
.upload-field { margin-top: 14px; }
.form-grid .upload-field { margin-top: 0; }
.upload-row { display: flex; min-height: 38px; align-items: center; gap: 10px; }
.upload-row .btn { position: relative; overflow: hidden; }
.upload-preview { display: grid; width: 100%; min-height: 104px; place-items: center; overflow: hidden; border: 1px dashed #d6dde5; border-radius: 6px; color: var(--muted); background: #fafbfc; }
.upload-preview img { display: block; width: 100%; height: 180px; object-fit: contain; background: #fff; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; min-height: 1px !important; padding: 0 !important; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0 !important; }
.qr-thumb { display: block; width: 64px; height: 64px; object-fit: contain; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.qr-large { display: block; width: min(240px,100%); aspect-ratio: 1; object-fit: contain; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.recruitment-draft-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: var(--surface-soft); font-size: 12px; }
.recruitment-draft-bar > div { display: flex; min-width: 0; align-items: center; gap: 8px; }
.recruitment-draft-bar svg { width: 16px; height: 16px; color: var(--green); }
.recruitment-flow-note { margin-bottom: 18px; }
.recruitment-form-section { padding: 18px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.recruitment-form-section + .recruitment-form-section { margin-top: 16px; }
.section-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 15px; }
.section-title h3 { margin: 0; font-size: 15px; }
.section-title p { margin: 5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.recruitment-schema-list { display: grid; gap: 8px; }
.recruitment-schema-row { display: grid; grid-template-columns: 22px minmax(140px,1fr) 120px 68px 68px minmax(145px,1fr) minmax(170px,1.1fr) auto; gap: 9px; align-items: center; min-height: 48px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); }
.recruitment-schema-row.fixed { min-height: 44px; background: var(--surface); }
.recruitment-schema-row.is-hidden-field { opacity: .62; background: var(--surface-soft); }
.schema-drag { grid-column: 1; color: var(--muted); }
.schema-drag svg { width: 16px; height: 16px; }
.schema-name { grid-column: 2; min-width: 0; }
.schema-name strong, .schema-name small { display: block; }
.schema-name small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.schema-type { grid-column: 3; color: var(--muted); font-size: 12px; }
.schema-visible { grid-column: 4; display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12px; }
.schema-required { grid-column: 5; display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12px; }
.schema-visible input, .schema-required input { width: 15px; min-height: 15px; margin: 0; }
.schema-placeholder { grid-column: 6; }
.schema-options { grid-column: 7; }
.schema-options.is-hidden { display: none; }
.schema-actions { grid-column: 8; display: flex; justify-content: flex-end; gap: 5px; }
.info-grid.compact { grid-template-columns: repeat(2,minmax(0,1fr)); }
.table-sub.danger { color: var(--red); }

.empty { padding: 48px 20px; color: var(--muted); text-align: center; }
.loading { display: grid; min-height: 240px; place-items: center; color: var(--muted); }
.loading::before { width: 24px; height: 24px; border: 2px solid #dce2e8; border-top-color: var(--accent); border-radius: 50%; animation: spin .8s linear infinite; content: ""; }
@keyframes spin { to { transform: rotate(360deg); } }

.modal-backdrop { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 24px; background: rgba(15,22,30,.56); }
.modal { width: min(620px,100%); max-height: calc(100vh - 48px); overflow: auto; border-radius: 8px; background: #fff; box-shadow: 0 20px 60px rgba(0,0,0,.22); }
.modal.wide { width: min(1160px,100%); }
.modal-head { position: sticky; top: 0; z-index: 2; display: flex; min-height: 58px; align-items: center; justify-content: space-between; gap: 12px; padding: 0 19px; border-bottom: 1px solid var(--line); background: #fff; }
.modal-head h2 { margin: 0; font-size: 17px; }
.modal-body { padding: 20px; }
.recruitment-poster-dialog { display: grid; grid-template-columns: minmax(0, 1fr) 260px; align-items: start; gap: 22px; }
.recruitment-poster-preview { position: relative; display: grid; place-items: center; min-width: 0; min-height: 480px; padding: 18px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: #e9edeb; }
.recruitment-poster-preview canvas { width: auto; max-width: 100%; height: min(72vh, 720px); max-height: 720px; display: block; aspect-ratio: 9 / 16; background: #fff; box-shadow: 0 14px 36px rgba(15,22,30,.16); }
.poster-rendering { position: absolute; inset: 18px; display: flex; align-items: center; justify-content: center; gap: 10px; color: var(--muted); background: rgba(255,255,255,.9); font-size: 13px; font-weight: 700; }
.poster-rendering[hidden] { display: none; }
.poster-rendering span { width: 22px; height: 22px; border: 2px solid #d6dde1; border-top-color: var(--accent); border-radius: 50%; animation: spin .8s linear infinite; }
.poster-rendering.failed { padding: 24px; color: var(--danger); text-align: center; }
.poster-rendering.failed svg { width: 20px; }
.recruitment-poster-actions { display: grid; gap: 10px; position: sticky; top: 78px; }
.recruitment-poster-actions .btn { width: 100%; justify-content: center; }
.poster-spec, .poster-link { padding: 14px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.poster-spec span, .poster-link span { display: block; margin-bottom: 5px; color: var(--muted); font-size: 11px; }
.poster-spec strong { display: block; font-size: 20px; }
.poster-spec small { color: var(--muted); font-size: 11px; }
.poster-link code { display: block; max-height: 96px; overflow: auto; color: var(--ink); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; white-space: normal; }
.modal-section + .modal-section { margin-top: 22px; }
.modal-section h3 { margin: 0 0 12px; font-size: 14px; }
.detail-metrics { display: grid; grid-template-columns: repeat(5,minmax(120px,1fr)); gap: 10px; }
.detail-metric { padding: 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); }
.detail-metric span { display: block; color: var(--muted); font-size: 11px; }
.detail-metric strong { display: block; margin-top: 7px; font-size: 17px; }
.detail-metric small { display: block; margin-top: 5px; color: var(--muted); }
.pgy-performance-grid { display: grid; gap: 18px; }
.pgy-performance-block { min-width: 0; }
.pgy-performance-block h4 { margin: 0 0 9px; font-size: 13px; }
.pgy-performance-table { min-width: 1180px; }
.pgy-performance-table th,
.pgy-performance-table td { white-space: nowrap; }
.pgy-source-grid { margin-top: 18px; }
.pgy-data-section { border-top: 3px solid var(--blue); }
.pgy-data-section > .detail-section-head { margin-bottom: 14px; }
.pgy-performance-panel { padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.pgy-profile-feature-section { border-top: 3px solid var(--green); }
.pgy-profile-feature-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-top: 14px; }
.pgy-profile-feature-card { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); }
.pgy-profile-feature-card h4 { margin: 0 0 9px; color: var(--green); font-size: 12px; }
.pgy-profile-feature-card .tag-list { gap: 5px; }
.pgy-commercial-section { border-top: 3px solid var(--purple); }
.pgy-commercial-section .detail-section-head { align-items: flex-start; }
.pgy-commercial-section .detail-section-head > .tag-list { justify-content: flex-end; }
.followup-stage-strip { display: flex; justify-content: flex-start; padding: 2px 0 16px; border-bottom: 1px solid var(--line); }
.followup-stage-strip .project-stage-control { min-width: 210px; grid-template-columns: 28px 42px 28px 42px 28px; }
.followup-stage-strip .project-stage-control > i { margin: 0 5px; }
.followup-money-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
.followup-facts { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 12px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.section-actions { display: flex; justify-content: flex-end; margin-top: 12px; }
.followup-history { display: grid; }
.followup-history-item { position: relative; display: grid; grid-template-columns: 18px minmax(0,1fr); gap: 9px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.followup-history-dot { width: 9px; height: 9px; margin-top: 5px; border: 2px solid #fff; border-radius: 50%; outline: 1px solid var(--accent); background: var(--accent); }
.followup-history-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.followup-history-head span { color: var(--muted); font-size: 11px; }
.followup-history-item p { margin: 6px 0 0; line-height: 1.65; white-space: pre-wrap; }
.sticky-modal-actions { position: sticky; bottom: -20px; z-index: 2; margin: 22px -20px -20px; padding: 14px 20px; border-top: 1px solid var(--line); background: #fff; }
.pgy-audience-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.pgy-dist { padding: 13px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); }
.pgy-dist h4 { margin: 0 0 12px; font-size: 13px; }
.pgy-dist-row + .pgy-dist-row { margin-top: 10px; }
.pgy-dist-row > div:first-child { display: flex; justify-content: space-between; gap: 12px; font-size: 12px; }
.pgy-dist-row strong { font-weight: 600; }
.pgy-dist-track { height: 6px; margin-top: 5px; overflow: hidden; border-radius: 3px; background: var(--line); }
.pgy-dist-track i { display: block; height: 100%; border-radius: inherit; background: var(--primary); }
.requirement-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.requirement { padding: 12px; border-left: 3px solid var(--blue); background: var(--surface-soft); }
.requirement strong { display: block; margin-bottom: 6px; }
.requirement p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.requirement-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.requirement-head > span { display: flex; gap: 4px; }
.detail-section-head { min-height: 42px; padding: 0 0 10px; border: 0; }
.blogger-detail-head { display: flex; align-items: center; gap: 13px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.blogger-detail-head h3 { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 0; font-size: 18px; }
.blogger-detail-showcase { display: grid; grid-template-columns: 270px minmax(0,1fr); gap: 22px; padding-bottom: 22px; border-bottom: 1px solid var(--line); }
.blogger-detail-profile { min-width: 0; padding-right: 21px; border-right: 1px solid var(--line); }
.blogger-detail-identity { display: flex; align-items: center; gap: 12px; }
.blogger-detail-identity h3 { margin: 0 0 5px; font-size: 17px; }
.blogger-detail-identity p { display: flex; align-items: center; gap: 4px; margin: 7px 0 0; color: var(--muted); font-size: 11px; }
.blogger-detail-identity p svg { width: 13px; height: 13px; }
.blogger-detail-portrait { position: relative; display: grid; width: 64px; height: 64px; flex: 0 0 64px; place-items: center; overflow: hidden; border-radius: 50%; color: #fff; background: var(--accent); font-size: 20px; font-weight: 700; }
.blogger-detail-portrait img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.blogger-detail-portrait img.is-broken { display: none; }
.blogger-detail-profile > .tag-list { margin-top: 14px; }
.blogger-profile-numbers { display: grid; grid-template-columns: 1fr 1fr; margin-top: 17px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.blogger-profile-numbers div { padding: 14px 8px; text-align: center; }
.blogger-profile-numbers div + div { border-left: 1px solid var(--line); }
.blogger-profile-numbers span, .blogger-profile-prices span { display: block; color: var(--muted); font-size: 10px; }
.blogger-profile-numbers strong { display: block; margin-top: 6px; font-size: 18px; }
.blogger-profile-prices { display: grid; gap: 9px; margin-top: 15px; }
.blogger-profile-prices div { padding: 11px 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); }
.blogger-profile-prices strong { display: block; margin-top: 5px; font-size: 16px; }
.blogger-profile-links { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 14px; }
.blogger-profile-links .btn { justify-content: center; padding-inline: 8px; }
.blogger-detail-profile > small { display: block; margin-top: 12px; color: var(--muted); text-align: center; }
.pgy-note-stage { min-width: 0; }
.pgy-note-stage > .empty { min-height: 320px; display: grid; align-content: center; gap: 8px; border: 1px dashed var(--line); }
.pgy-note-stage > .empty svg { width: 24px; margin: 0 auto; }
.pgy-note-stage-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.pgy-note-stage-head h3 { margin: 0; font-size: 15px; }
.pgy-note-stage-head p { margin: 5px 0 0; color: var(--muted); font-size: 11px; }
.pgy-note-filters { display: inline-flex; flex-wrap: wrap; gap: 3px; padding: 3px; background: var(--surface-soft); }
.pgy-note-filters button { min-height: 28px; padding: 0 9px; border: 0; border-radius: 4px; color: var(--muted); background: transparent; cursor: pointer; font-size: 11px; }
.pgy-note-filters button.active { color: var(--accent); background: #fff; box-shadow: 0 1px 4px rgba(24,34,45,.1); }
.pgy-note-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.pgy-note-card-link { display: block; min-width: 0; color: inherit; text-decoration: none; }
.pgy-note-card-link[hidden] { display: none; }
.pgy-note-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 6px; background: #fff; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.pgy-note-card-link:hover .pgy-note-card { border-color: #c5ccd4; box-shadow: 0 8px 20px rgba(24,34,45,.08); transform: translateY(-2px); }
.pgy-note-cover { position: relative; aspect-ratio: 4 / 5; overflow: hidden; background: #eef1f4; }
.pgy-note-cover > span, .pgy-note-cover img { position: absolute; inset: 0; display: grid; width: 100%; height: 100%; place-items: center; object-fit: cover; }
.pgy-note-cover > span svg { width: 22px; color: #9ba5b1; }
.pgy-note-cover img.is-broken { display: none; }
.pgy-note-cover em, .pgy-note-cover b { position: absolute; top: 8px; z-index: 1; padding: 3px 6px; color: #fff; background: rgba(20,27,34,.72); font-size: 9px; font-style: normal; font-weight: 600; }
.pgy-note-cover em { left: 8px; }
.pgy-note-cover b { right: 8px; }
.pgy-note-copy { padding: 9px; }
.pgy-note-copy > strong { display: -webkit-box; min-height: 34px; overflow: hidden; color: var(--text); font-size: 11px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.pgy-note-brand { display: block; margin-top: 5px; overflow: hidden; color: var(--accent); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.pgy-note-copy dl { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 8px; margin: 9px 0 0; padding-top: 8px; border-top: 1px solid var(--line); }
.pgy-note-copy dl div { display: flex; align-items: center; justify-content: space-between; gap: 4px; }
.pgy-note-copy dt { color: var(--muted); font-size: 9px; }
.pgy-note-copy dd { margin: 0; font-size: 10px; font-weight: 600; }
.pgy-note-copy time { display: block; margin-top: 8px; color: var(--muted); font-size: 9px; }
.detail-disclosure { padding: 0; overflow: hidden; }
.detail-disclosure > summary { display: flex; min-height: 64px; align-items: center; justify-content: space-between; gap: 14px; padding: 15px 18px; cursor: pointer; list-style: none; }
.detail-disclosure > summary::-webkit-details-marker { display: none; }
.detail-disclosure > summary > span { display: grid; gap: 4px; }
.detail-disclosure > summary strong { font-size: 14px; }
.detail-disclosure > summary small { color: var(--muted); }
.detail-disclosure > summary > svg { width: 17px; flex: 0 0 17px; color: var(--muted); transition: transform .18s ease; }
.detail-disclosure[open] > summary > svg { transform: rotate(180deg); }
.detail-disclosure > .detail-metrics, .detail-disclosure-body { margin: 0 18px 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.detail-disclosure-body > .modal-section { margin: 0; padding: 0 0 18px; border: 0; box-shadow: none; }
.detail-subsection + .detail-subsection { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.detail-subsection h3 { margin: 0 0 12px; font-size: 14px; }
.info-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.info-item { min-height: 68px; padding: 11px 12px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.info-item > span { display: block; margin-bottom: 6px; color: var(--muted); font-size: 11px; }
.private-note { margin-top: 12px; padding: 12px 14px; border-left: 3px solid var(--purple); background: var(--purple-soft); }
.private-note p { margin: 6px 0 0; color: #5c4d73; line-height: 1.6; }
.inline-form { display: grid; grid-template-columns: minmax(220px,1fr) minmax(160px,230px) auto; gap: 10px; align-items: end; margin-bottom: 14px; }
.inline-form textarea { min-height: 72px; }
.timeline { display: grid; gap: 0; }
.timeline-item { display: grid; grid-template-columns: 92px minmax(0,1fr); gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); line-height: 1.55; }
.timeline-item > span { color: var(--muted); font-size: 11px; }
.group-list { display: grid; margin-bottom: 18px; border-top: 1px solid var(--line); }
.group-row { display: flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); }
.detail-actions { position: sticky; bottom: -20px; z-index: 2; margin: 22px -20px -20px; padding: 14px 20px; border-top: 1px solid var(--line); background: #fff; }
.action-spacer { flex: 1; }
.profile-layout { grid-template-columns: minmax(0,1.25fr) minmax(320px,.75fr); align-items: start; }
.profile-layout > div { display: grid; gap: 16px; }
.profile-summary { display: flex; align-items: center; gap: 13px; margin-bottom: 16px; }
.profile-summary strong { font-size: 18px; }
.profile-summary p { margin: 5px 0 0; color: var(--muted); line-height: 1.5; }
.profile-permissions { margin-top: 16px; border-top: 1px solid var(--line); }
.profile-permissions summary { padding: 13px 0; cursor: pointer; color: var(--muted); font-weight: 600; }

.data-updated-at { white-space: nowrap; font-variant-numeric: tabular-nums; }
.sync-progress-panel { position: fixed; right: 24px; bottom: 82px; z-index: 150; width: min(420px,calc(100vw - 48px)); overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: 0 18px 52px rgba(20,31,44,.2); }
.sync-progress-panel > header { display: flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 12px 9px 16px; border-bottom: 1px solid var(--line); }
.sync-progress-panel > header > div:first-child { display: flex; min-width: 0; align-items: baseline; gap: 10px; }
.sync-progress-panel > header strong { font-size: 14px; }
.sync-progress-panel > header span { color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.sync-progress-panel.collapsed .sync-progress-body { display: none; }
.sync-progress-panel.collapsed > header { border-bottom: 0; }
.sync-progress-body { padding: 14px 16px 16px; }
.sync-progress-track { height: 8px; overflow: hidden; border-radius: 4px; background: #e8edf2; }
.sync-progress-track > i { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--blue); transition: width .2s ease; }
.sync-progress-panel.all-success .sync-progress-track > i { background: var(--green); }
.sync-progress-panel.has-errors .sync-progress-track > i { background: var(--amber); }
.sync-progress-stats { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; color: var(--muted); font-size: 12px; }
.sync-progress-stats [data-sync-current] { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sync-progress-stats [data-sync-counts] { flex: 0 0 auto; }
.sync-progress-results { display: grid; gap: 7px; max-height: 180px; margin-top: 12px; overflow: auto; }
.sync-result { display: grid; grid-template-columns: 18px minmax(0,1fr); gap: 8px; align-items: start; padding: 8px 10px; background: var(--surface-soft); }
.sync-result > i { width: 16px; height: 16px; margin-top: 1px; color: var(--green); }
.sync-result.failed > i { color: var(--red); }
.sync-result strong, .sync-result small { display: block; overflow-wrap: anywhere; }
.sync-result strong { font-size: 12px; }
.sync-result small { margin-top: 2px; color: var(--muted); font-size: 11px; }
.pgy-schedule-overview { display: grid; grid-template-columns: repeat(5,minmax(120px,1fr)); gap: 8px; margin-bottom: 12px; }
.pgy-schedule-overview > div { display: grid; min-height: 72px; align-content: center; gap: 7px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 5px; background: var(--surface-soft); }
.pgy-schedule-overview span { color: var(--muted); font-size: 11px; }
.pgy-schedule-overview strong { color: var(--text); font-size: 20px; }
.pgy-schedule-overview strong .badge { font-size: 11px; }
.schedule-toggle { display: flex; align-items: center; gap: 10px; margin: 14px 0; padding: 12px 14px; border: 1px solid var(--line); border-radius: 5px; background: var(--surface-soft); cursor: pointer; }
.schedule-toggle input { flex: 0 0 auto; }
.schedule-toggle span { display: grid; gap: 3px; }
.schedule-toggle strong { font-size: 12px; }
.schedule-toggle small { color: var(--muted); font-size: 11px; }
.pgy-schedule-settings { grid-template-columns: repeat(4,minmax(0,1fr)); }
.pgy-schedule-actions { position: sticky; z-index: 2; bottom: 0; margin-top: 15px; padding: 12px 0; border-top: 1px solid var(--line); background: var(--surface); }
.pgy-schedule-history { margin-top: 12px; }

.toast { position: fixed; right: 24px; bottom: 24px; z-index: 160; max-width: min(380px,calc(100vw - 48px)); padding: 12px 15px; border-radius: 6px; color: #fff; background: #26313d; box-shadow: var(--shadow); opacity: 0; pointer-events: none; transform: translateY(12px); transition: .2s ease; }
.toast.show { opacity: 1; transform: translateY(0); }
.toast.error { background: var(--red); }
.mobile-menu, .sidebar-overlay { display: none; }

@media (max-width: 1180px) {
  .metric-grid { grid-template-columns: repeat(3,minmax(150px,1fr)); }
  .blogger-filter-row { grid-template-columns: repeat(3,minmax(160px,1fr)); }
  .blogger-advanced-grid { grid-template-columns: repeat(3,minmax(150px,1fr)); }
  .blogger-search-toolbar { grid-template-columns: auto minmax(220px,1fr) auto auto; }
  .blogger-search-toolbar #blogger-column-settings { grid-column: 4; }
  .blogger-filter-controls > label { grid-template-columns: 1fr; gap: 4px; }
  .pgy-schedule-overview { grid-template-columns: repeat(3,minmax(120px,1fr)); }
  .pgy-schedule-settings { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .project-row { grid-template-columns: minmax(220px,1.5fr) repeat(3,100px) auto; }
  .project-row > :nth-child(5) { display: none; }
  .project-workspace { grid-template-columns: 220px minmax(0,1fr); }
  .project-detail-metrics { grid-template-columns: repeat(4,minmax(110px,1fr)); }
  .requirement-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 760px) {
  .integration-flow { grid-template-columns: 1fr; }
  .integration-flow > svg { margin: 0 auto; transform: rotate(90deg); }
}

@media (max-width: 820px) {
  .login-page { grid-template-columns: 1fr; }
  .login-brand-pane { min-height: 220px; padding: 28px; }
  .login-brand-pane h1 { font-size: 27px; }
  .login-facts { display: none; }
  .sidebar { transform: translateX(-100%); transition: transform .2s ease; }
  .shell.menu-open .sidebar { transform: translateX(0); }
  .sidebar-overlay { position: fixed; inset: 0; z-index: 35; display: none; background: rgba(10,15,22,.45); }
  .shell.menu-open .sidebar-overlay { display: block; }
  .main { margin-left: 0; }
  .mobile-menu { display: inline-flex; }
  .topbar { padding: 0 16px; }
  .content { padding: 20px 16px 36px; }
  .project-orders .detail-section-head { align-items: stretch; flex-direction: column; }
  .project-order-tools { display: grid; grid-template-columns: minmax(0,1fr) auto auto; width: 100%; justify-content: stretch; }
  .project-order-search { width: 100%; }
  .category-filter { grid-template-columns: 1fr; gap: 5px; }
  .category-filter-label { padding-top: 0; }
  .category-filter-controls { flex-direction: column; }
  .category-filter-more { width: 100%; }
  .category-filter-more > summary { width: 100%; justify-content: center; }
  .category-filter-menu { position: static; width: 100%; margin-top: 6px; box-shadow: none; }
  .blogger-filter-row { grid-template-columns: 1fr; }
  .blogger-advanced-filter > summary { align-items: flex-start; flex-direction: column; }
  .blogger-advanced-grid { grid-template-columns: 1fr; }
  .blogger-search-toolbar { grid-template-columns: 1fr 1fr; }
  .blogger-search-modes, .blogger-search-box { grid-column: 1 / -1; }
  .blogger-search-modes { display: grid; grid-template-columns: repeat(4,1fr); min-width: 0; }
  .blogger-search-modes button { padding-inline: 5px; font-size: 10px; }
  .blogger-search-toolbar .btn { width: 100%; }
  .blogger-search-toolbar #blogger-column-settings { grid-column: auto; }
  .blogger-preset-row strong { width: 100%; }
  .blogger-filter-group { grid-template-columns: 1fr; }
  .blogger-filter-group-title { display: block; padding: 9px 12px; border-right: 0; border-bottom: 1px solid var(--line); }
  .blogger-filter-group-title span { display: block; text-align: left; }
  .blogger-filter-line { grid-template-columns: 1fr; gap: 6px; }
  .blogger-filter-line > strong { text-align: left; }
  .blogger-filter-controls { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; }
  .blogger-filter-popover { width: 100%; }
  .blogger-filter-popover > summary { width: 100%; justify-content: space-between; border-color: var(--line); background: var(--surface-soft); }
  .blogger-filter-popover[open] { grid-column: 1 / -1; }
  .blogger-filter-popover-panel { position: static; width: 100%; min-width: 0; max-width: none; margin-top: 5px; box-shadow: none; }
  .blogger-filter-controls > label { display: grid; grid-template-columns: 90px minmax(0,1fr); }
  .blogger-filter-controls input, .blogger-filter-controls select { width: 100%; max-width: none; }
  .blogger-range { grid-template-columns: minmax(0,1fr) 10px minmax(0,1fr) auto; }
  .blogger-range input { width: 100%; }
  .blogger-more-filters > summary { align-items: flex-start; flex-direction: column; }
  .blogger-filter-footer { display: grid; width: 100%; grid-template-columns: minmax(0,1fr); align-items: stretch; }
  .blogger-filter-status { min-width: 0; max-width: none; }
  .blogger-filter-actions { justify-content: flex-end; margin-left: 0; padding: 8px 0 0; border-top: 1px solid var(--line); border-left: 0; }
  .blogger-column-options { grid-template-columns: 1fr 1fr; }
  .pgy-schedule-overview { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .pgy-schedule-settings { grid-template-columns: 1fr; }
  .page-head { flex-direction: column; }
  .page-actions { justify-content: flex-start; }
  .metric-grid { grid-template-columns: repeat(2,minmax(140px,1fr)); }
  .grid-2, .grid-equal { grid-template-columns: 1fr; }
  .profile-layout { grid-template-columns: 1fr; }
  .blogger-detail-showcase { grid-template-columns: 1fr; }
  .blogger-detail-profile { padding: 0 0 18px; border-right: 0; border-bottom: 1px solid var(--line); }
  .pgy-note-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .grid-2 .panel + .panel { margin-top: 16px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .span-2 { grid-column: auto; }
  .detail-metrics { grid-template-columns: repeat(2,minmax(120px,1fr)); }
  .cost-metric-detail-grid { grid-template-columns: 1fr; }
  .cost-metric-detail-grid > div { grid-template-columns: minmax(48px,.7fr) repeat(4,minmax(82px,1fr)); overflow-x: auto; }
  .followup-money-grid, .followup-facts { grid-template-columns: repeat(2,minmax(120px,1fr)); }
  .pgy-audience-grid { grid-template-columns: 1fr; }
  .pgy-profile-feature-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .info-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .inline-form { grid-template-columns: 1fr; }
  .requirement-grid { grid-template-columns: 1fr; }
  .recruitment-schema-row { grid-template-columns: 22px minmax(0,1fr) auto; align-items: start; }
  .schema-drag { grid-column: 1; grid-row: 1 / span 5; padding-top: 9px; }
  .schema-name { grid-column: 2; grid-row: 1; }
  .schema-type { grid-column: 2; grid-row: 2; }
  .schema-visible { grid-column: 3; grid-row: 1; padding-top: 9px; }
  .schema-required { grid-column: 3; grid-row: 2; padding-top: 9px; }
  .schema-placeholder { grid-column: 2 / -1; grid-row: 3; }
  .schema-options { grid-column: 2 / -1; grid-row: 4; }
  .schema-actions { grid-column: 2 / -1; grid-row: 5; justify-content: flex-start; }
  .project-workspace { grid-template-columns: 1fr; }
  .project-workspace-list { border-right: 0; border-bottom: 1px solid var(--line); }
  .project-nav-list { grid-template-columns: repeat(2,minmax(220px,1fr)); max-height: 240px; overflow: auto; }
  .project-nav-item { border-right: 1px solid var(--line); }
  .project-detail-head { flex-direction: column; }
  .project-detail-metrics { grid-template-columns: repeat(2,minmax(120px,1fr)); }
  .candidate-chip { max-width: 100%; flex: 1 1 320px; }
  .project-blogger-picker { grid-template-columns: 1fr; min-height: 0; }
  .project-blogger-source { border-right: 0; border-bottom: 1px solid var(--line); }
  .project-blogger-results { max-height: 300px; }
  .project-blogger-filter-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .project-blogger-selected { min-height: 280px; max-height: none; }
  .ai-model-choices { grid-template-columns: 1fr; }
  .ai-reference-grid { grid-template-columns: 1fr; }
  .pgy-prefill { grid-template-columns: 1fr; align-items: stretch; }
  .order-profit-preview { grid-template-columns: 1fr 1fr; }
  .contract-link-row { grid-template-columns: 1fr auto; }
  .contract-link-row > span:nth-child(2) { grid-column: 1 / -1; }
  .contract-progress-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .commission-rule-cards { grid-template-columns: 1fr; }
  .commission-calculator-form { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .commission-detail-wrap { padding-left: 20px; }
  .finance-detail-wrap { padding-left: 18px; }
  .view-tabs { overflow-x: auto; }
  .view-tab { flex: 0 0 auto; }
  .agency-filters { grid-template-columns: repeat(2,minmax(130px,1fr)); }
  .inline-followup { grid-template-columns: 1fr; }
  .followup-item { grid-template-columns: 1fr; gap: 4px; }
  .qr-large { width: 180px; }
  .role-pill { display: none; }
}

@media (max-width: 520px) {
  .blogger-filter-controls { grid-template-columns: 1fr; }
  .blogger-filter-popover[open] { grid-column: auto; }
  .blogger-filter-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .blogger-filter-actions .btn { width: 100%; justify-content: center; }
  .blogger-filter-actions .btn:only-child { grid-column: 1 / -1; }
  .pgy-schedule-overview { grid-template-columns: 1fr; }
  .login-form-pane { padding: 18px; }
  .login-box { padding: 24px; }
  .metric-grid { grid-template-columns: 1fr; }
  .metric { min-height: 104px; }
  .progress-row { grid-template-columns: 1fr 70px; }
  .progress-row .progress-track { grid-column: 1 / -1; }
  .modal-backdrop { padding: 0; place-items: end center; }
  .modal, .modal.wide { width: 100%; max-height: 94vh; border-radius: 8px 8px 0 0; }
  .recruitment-poster-dialog { grid-template-columns: 1fr; gap: 14px; }
  .recruitment-poster-preview { min-height: 0; padding: 12px; }
  .recruitment-poster-preview canvas { width: min(100%, 390px); height: auto; max-height: none; }
  .poster-rendering { inset: 12px; }
  .recruitment-poster-actions { position: static; grid-template-columns: repeat(2, minmax(0,1fr)); }
  .poster-spec, .poster-link { grid-column: 1 / -1; }
  .recruitment-poster-actions .btn-primary { grid-column: 1 / -1; }
  .recruitment-draft-bar, .section-title { align-items: stretch; flex-direction: column; }
  .recruitment-form-section { padding: 14px; }
  .detail-metrics { grid-template-columns: 1fr; }
  .pgy-profile-feature-grid { grid-template-columns: 1fr; }
  .pgy-note-stage-head { flex-direction: column; }
  .pgy-note-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .followup-money-grid, .followup-facts { grid-template-columns: 1fr; }
  .project-workspace-main { padding: 14px; }
  .project-nav-list { grid-template-columns: 1fr; }
  .project-detail-metrics { grid-template-columns: 1fr; }
  .project-blogger-source, .project-blogger-selection { padding: 13px; }
  .project-blogger-paste { grid-template-columns: 1fr; }
  .project-blogger-filter-row { grid-template-columns: 1fr; }
  .project-blogger-bulk-settings, .project-blogger-selected-fields, .picker-submit-summary { grid-template-columns: 1fr; }
  .project-blogger-selected-fields .span-2 { grid-column: auto; }
  .project-blogger-result { grid-template-columns: 34px minmax(0,1fr) 17px; }
  .project-blogger-result .picker-price { display: none; }
  .picker-issue { grid-template-columns: 1fr; }
  .project-blogger-actions { flex-wrap: wrap; }
  .project-blogger-actions > span { width: 100%; margin-right: 0; }
  .contract-progress-grid { grid-template-columns: 1fr; padding: 12px; }
  .commission-calculator-form { grid-template-columns: 1fr; }
  .commission-calc-result { grid-template-columns: 1fr; }
  .commission-rule-cards { padding: 12px; }
  .commission-rule-group { display: grid; }
  .commission-basis-list > div { grid-template-columns: 1fr; gap: 5px; }
  .ai-recommend-card > header { grid-template-columns: 54px minmax(0,1fr) 50px; }
  .ai-recommend-card > header > a { display: none; }
  .ai-result-fields { grid-template-columns: 1fr; }
  .project-pipeline > span { display: none; }
  .ai-brief-actions { align-items: stretch; flex-direction: column; }
  .order-profit-preview { grid-template-columns: 1fr; }
  .info-grid { grid-template-columns: 1fr; }
  .export-field-toolbar { align-items: flex-start; flex-direction: column; }
  .export-field-options { grid-template-columns: 1fr; padding-left: 22px; }
  .export-field-groups { max-height: 56vh; }
  .bulk-bar > span { width: 100%; margin-left: 0; }
  .table-footer { align-items: flex-start; flex-direction: column; }
  .pager { max-width: 100%; overflow-x: auto; }
  .agency-filters { grid-template-columns: 1fr; }
  .agency-bulk { justify-content: stretch; }
  .agency-bulk > * { flex: 1 1 140px; }
  .timeline-item { grid-template-columns: 1fr; gap: 4px; }
  .detail-actions { justify-content: flex-start; overflow-x: auto; overscroll-behavior-x: contain; padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
  .detail-actions .btn { flex: 0 0 auto; min-width: max-content; white-space: nowrap; }
  .detail-actions .action-spacer { display: none; }
  .notification-row { grid-template-columns: 32px minmax(0,1fr); }
  .notification-row > .table-actions { grid-column: 2; justify-content: flex-start; }
  .sync-progress-panel { right: 12px; bottom: 72px; width: calc(100vw - 24px); }
  .notify-format-row, .notify-match-title { align-items: flex-start; flex-direction: column; }
  .notify-issue { grid-template-columns: 1fr; gap: 3px; }
  .recruit-preview-stage { max-height: calc(94vh - 130px); padding: 0; }
  .recruit-phone-preview { width: 100%; border: 0; border-radius: 0; box-shadow: none; }
}