:root {
  color-scheme: light;
  --bg: #f4f6f8;
  --panel: #ffffff;
  --surface: #f9fafb;
  --surface-2: #f3f6f8;
  --ink: #1c2430;
  --muted: #667085;
  --line: #d9e0e8;
  --brand: #0f6a61;
  --brand-hover: #0b5851;
  --on-brand: #ffffff;
  --brand-2: #b85a34;
  --brand-2-hover: #9e4726;
  --soft: #e9f5f2;
  --warn: #fff7e8;
  --warn-line: #ead8b8;
  --danger: #b7472a;
  --shadow-drawer: -18px 0 42px rgba(28, 36, 48, .14);
  --radius: 8px;
  --radius-pill: 999px;
  --control-h: 38px;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
a { color: inherit; text-decoration: none; }
.topbar {
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 0 28px;
  background: var(--panel);
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  z-index: 5;
}
.topbar div { display: flex; align-items: baseline; gap: 12px; }
.topbar span, .muted, .hint, small { color: var(--muted); }
.hint.success { color: var(--brand); }
.hint.error { color: var(--danger); }
.topbar nav { display: flex; gap: 10px; }
.topbar nav a {
  min-height: 36px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
}
.topbar nav a:hover,
.flow-tabs button:hover,
.case-row:hover,
.creator-pool-table tbody tr:hover {
  border-color: var(--brand);
  background: var(--soft);
}
.workspace {
  width: min(1420px, calc(100% - 40px));
  margin: 24px auto 48px;
}
.goal-band {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(420px, 1fr);
  gap: 24px;
  align-items: stretch;
  margin-bottom: 24px;
}
.goal-band h1 { margin: 6px 0 10px; font-size: 28px; letter-spacing: 0; }
.manager-workspace {
  width: min(1360px, calc(100% - 40px));
}
.manager-overview {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
  margin-bottom: 14px;
}
.manager-title-block {
  display: grid;
  gap: 8px;
}
.manager-title-row {
  display: flex;
  justify-content: space-between;
  gap: 22px;
  align-items: end;
}
.manager-title-row h1 {
  margin: 0;
  font-size: 26px;
}
.scope-line {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 0;
  color: var(--muted);
}
.scope-pill {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  padding: 4px 9px;
  border-radius: var(--radius-pill);
  background: var(--soft);
  color: var(--brand);
  font-size: 13px;
  font-weight: 800;
}
.hero-month-switcher {
  width: 190px;
  margin-top: 2px;
}
.manager-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 8px;
}
.manager-metrics article {
  min-height: 82px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}
.manager-metrics span,
.manager-metrics small {
  display: block;
  color: var(--muted);
  font-size: 13px;
}
.manager-metrics b {
  display: block;
  margin: 6px 0 1px;
  color: var(--ink);
  font-size: 26px;
}
.manager-layout {
  display: grid;
  grid-template-columns: minmax(720px, 1fr) 320px;
  gap: 14px;
  align-items: start;
}
.manager-main-column,
.manager-side-column {
  display: grid;
  gap: 14px;
}
.manager-section {
  margin-bottom: 0;
}
.manager-card {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
}
.manager-card h2 {
  margin: 0 0 6px;
  font-size: 18px;
}
.manager-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}
.subtle-card {
  background: var(--warn);
  border-color: var(--warn-line);
}
.manager-alert-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}
.manager-alert-list article {
  display: grid;
  gap: 2px;
  padding: 12px;
  border-radius: var(--radius);
  background: var(--surface);
}
.manager-alert-list span,
.manager-alert-list small {
  color: var(--muted);
  font-size: 13px;
}
.manager-alert-list b {
  font-size: 24px;
}
.weekly-grid {
  display: grid;
  grid-template-columns: minmax(280px, .9fr) minmax(320px, 1.1fr);
  gap: 12px;
  margin-bottom: 12px;
}
.weekly-grid article {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}
.weekly-grid h3 {
  margin: 0 0 8px;
  font-size: 16px;
}
.weekly-grid p {
  margin: 6px 0;
  color: var(--muted);
  line-height: 1.55;
}
.mini-list {
  display: grid;
  gap: 7px;
}
.mini-list span {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 10px;
  border-radius: var(--radius);
  background: var(--panel);
  color: var(--muted);
}
.compact-table-wrap {
  margin-top: 10px;
}
.eyebrow {
  margin: 0;
  color: var(--brand);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 12px;
}
.kpi-grid article, .flow-panel, .login-panel, .drawer details, .two-col article {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.kpi-grid article { padding: 16px; }
.kpi-grid span { display: block; color: var(--muted); font-size: 13px; }
.kpi-grid b { display: block; margin: 8px 0 2px; font-size: 30px; }
.flow-panel { padding: 18px; margin-bottom: 14px; }
.queue-section {
  display: grid;
  gap: 10px;
}
.queue-section-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: end;
  padding: 4px 0 10px;
}
.queue-section-head h3 {
  margin: 0 0 4px;
  font-size: 18px;
}
.queue-section-head p {
  margin: 0;
}
.queue-section-head > span {
  min-width: 72px;
  padding: 7px 10px;
  border-radius: var(--radius-pill);
  background: var(--soft);
  color: var(--brand);
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}
.owned-queue-section {
  margin-top: 10px;
}
.support-panel details {
  border: 0;
  background: transparent;
}
.support-panel summary {
  cursor: pointer;
  font-size: 18px;
  font-weight: 800;
}
#statusForm, #transferForm {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}
#statusForm label, #transferForm label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
}
#statusForm select, #transferForm select {
  min-height: var(--control-h);
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
  font: inherit;
}
#statusForm button, #transferForm button {
  min-height: 40px;
  border: 1px solid var(--brand);
  border-radius: var(--radius);
  background: var(--brand);
  color: var(--on-brand);
  font-weight: 800;
  cursor: pointer;
}
.drawer-form {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.drawer-form label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
}
.drawer-form input,
.drawer-form select,
.drawer-form textarea {
  min-height: var(--control-h);
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
  font: inherit;
  color: var(--ink);
}
.drawer-form textarea {
  min-height: 84px;
  resize: vertical;
}
.drawer-form .checkbox-line {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: var(--control-h);
  color: var(--ink);
}
.drawer-form .checkbox-line input {
  width: 16px;
  min-height: 16px;
  padding: 0;
}
.stage-form {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px;
}
.drawer-form button {
  min-height: 40px;
  border: 1px solid var(--brand);
  border-radius: var(--radius);
  background: var(--brand);
  color: var(--on-brand);
  font-weight: 800;
  cursor: pointer;
}
.drawer-form button:hover,
.creator-pool-table button:not(.link-row-button):hover,
.claim-row button:hover,
.transfer-row button:hover,
.note-form button:hover,
.kr-note-form button:hover,
.advance-form button:hover,
.admin-form button:hover,
.inline-admin-form button:hover,
.permission-form button:hover,
.stack-form button:hover,
.manager-target-row button:hover,
.okr-form button:hover,
.objective-edit-form button:hover,
.kr-edit-form button:hover,
.primary-action:hover {
  border-color: var(--brand-hover);
  background: var(--brand-hover);
}
.deal-preview {
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px solid var(--warn-line);
  border-radius: var(--radius);
  background: var(--warn);
}
.deal-preview p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.5;
}
.mini-history {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}
.mini-history article {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}
.mini-history b,
.mini-history small {
  display: block;
}
.mini-history p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.45;
  white-space: pre-wrap;
}
.flow-tabs {
  display: grid;
  grid-template-columns: repeat(10, minmax(86px, 1fr));
  gap: 8px;
  margin-bottom: 18px;
}
.flow-tabs button, .case-row, .primary-action, .fallback-form button {
  cursor: pointer;
  border: 1px solid var(--line);
  background: var(--panel);
  border-radius: var(--radius);
}
.flow-tabs button {
  min-height: 78px;
  padding: 10px;
  text-align: left;
}
.flow-tabs button.active {
  border-color: var(--brand);
  background: var(--soft);
}
.flow-tabs span, .flow-tabs small, .flow-tabs b { display: block; }
.flow-tabs b { margin-top: 6px; font-size: 20px; }
.list-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 18px;
  margin-bottom: 12px;
}
.list-head h2 { margin: 4px 0 0; }
.list-head .muted {
  max-width: 760px;
  line-height: 1.55;
}
.search-box input, .fallback-form input, .drawer textarea {
  width: 100%;
  min-height: 42px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  font: inherit;
}
.case-list { display: grid; gap: 8px; }
.creator-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.creator-pool-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
  background: var(--panel);
}
.creator-pool-table th,
.creator-pool-table td {
  padding: 11px 14px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
}
.creator-pool-table th {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  background: var(--surface);
}
.creator-pool-table td b,
.creator-pool-table td small {
  display: block;
}
.creator-pool-table td small {
  margin-top: 4px;
  color: var(--muted);
}
.creator-pool-table tr:last-child td { border-bottom: 0; }
.creator-pool-table tbody tr:hover {
  background: var(--surface);
}
.creator-pool-table button:not(.link-row-button) {
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--brand);
  border-radius: var(--radius);
  background: var(--brand);
  color: var(--on-brand);
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}
.link-row-button {
  width: 100%;
  min-height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ink) !important;
  text-align: left;
  white-space: normal !important;
}
.link-row-button b {
  font-size: 15px;
}
.pool-detail-row {
  cursor: pointer;
}
.pool-detail-row td:last-child {
  cursor: default;
}
.empty-cell {
  color: var(--muted);
  text-align: center !important;
}
.case-row {
  width: 100%;
  display: grid;
  grid-template-columns: 1.4fr 1fr 140px 120px;
  gap: 14px;
  align-items: center;
  padding: 14px;
  text-align: left;
}
.claim-row { grid-template-columns: 1.4fr 1fr 150px 130px; }
.transfer-row { grid-template-columns: 1.3fr 1fr 150px 190px 86px; }
.claim-row button, .transfer-row button, .note-form button, .kr-note-form button {
  min-height: var(--control-h);
  padding: 0 14px;
  border: 1px solid var(--brand);
  border-radius: var(--radius);
  background: var(--brand);
  color: var(--on-brand);
  font-weight: 800;
  cursor: pointer;
}
.transfer-row label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
}
.transfer-row select {
  min-height: var(--control-h);
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
  font: inherit;
  color: var(--ink);
}
.admin-request-row { grid-template-columns: 1.3fr 120px 150px 90px minmax(360px, 1fr) 80px; }
.admin-user-row { grid-template-columns: 1.1fr 90px minmax(220px, 1fr) 80px minmax(360px, 1.2fr) 78px 78px; }
.case-row:hover { border-color: var(--brand); }
.static-row { cursor: default; }
.static-row:hover { border-color: var(--line); }
.case-row span, .case-row small { display: block; }
.workflow-row {
  grid-template-columns: minmax(190px, 1fr) minmax(130px, .7fr) minmax(130px, .7fr) minmax(130px, .7fr) minmax(260px, 1.3fr);
}
.advance-form {
  display: grid;
  grid-template-columns: minmax(120px, 150px) minmax(180px, 1fr) auto;
  gap: 8px;
  align-items: center;
}
.workflow-row[data-status="to_contact"] .advance-form,
.workflow-row[data-status="sample_pending"] .advance-form,
.workflow-row[data-status="publish_pending"] .advance-form,
.workflow-row[data-status="payment_pending"] .advance-form,
.workflow-row[data-status="completed"] .advance-form,
.workflow-row[data-status="follow_up"] .advance-form {
  display: flex;
  justify-content: flex-end;
}
.advance-form select {
  min-height: var(--control-h);
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
  font: inherit;
}
.advance-form textarea {
  width: 100%;
  min-height: 40px;
  max-height: 88px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  resize: vertical;
  font: inherit;
}
.advance-form button {
  min-height: var(--control-h);
  padding: 0 14px;
  border: 1px solid var(--brand);
  border-radius: var(--radius);
  background: var(--brand);
  color: var(--on-brand);
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}
.workflow-done {
  min-height: 34px;
  display: inline-grid !important;
  place-items: center;
  padding: 0 12px;
  border-radius: var(--radius-pill);
  background: var(--soft);
  color: var(--brand);
  font-weight: 800;
}
.admin-form {
  display: grid;
  grid-template-columns:
    minmax(150px, 190px)
    minmax(180px, 230px)
    minmax(150px, 200px)
    minmax(150px, 190px)
    minmax(130px, 170px)
    minmax(170px, 210px)
    minmax(150px, 170px);
  gap: 12px;
  align-items: end;
}
.admin-form label, .inline-admin-form {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
}
.admin-form input, .admin-form select, .inline-admin-form input, .inline-admin-form select,
.permission-form select {
  min-height: var(--control-h);
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
  font: inherit;
  color: var(--ink);
}
.admin-form button, .inline-admin-form button, .permission-form button {
  min-height: var(--control-h);
  padding: 0 16px;
  border: 1px solid var(--brand);
  border-radius: var(--radius);
  background: var(--brand);
  color: var(--on-brand);
  font-weight: 800;
  cursor: pointer;
}
.inline-admin-form {
  grid-template-columns: 90px 90px 120px 70px;
  align-items: center;
}
.inline-admin-form.compact { grid-template-columns: 70px; }
.permission-chips {
  display: flex !important;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.permission-chips i {
  padding: 5px 8px;
  border-radius: var(--radius-pill);
  background: var(--soft);
  color: var(--brand);
  font-style: normal;
  font-size: 12px;
  font-weight: 800;
}
.permission-chips small {
  flex-basis: 100%;
}
.permission-form {
  display: grid;
  grid-template-columns: 1fr 1fr 92px;
  gap: 8px;
  align-items: center;
}
.stack-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(120px, 1fr));
  gap: 10px;
  margin-top: 14px;
}
.stack-form input, .manager-target-row input, .manager-target-row select,
.okr-form input, .okr-form select, .month-switcher select,
.objective-edit-form input, .objective-edit-form select,
.kr-edit-form input, .kr-edit-form select {
  min-height: var(--control-h);
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
  font: inherit;
  color: var(--ink);
}
.stack-form button, .manager-target-row button, .okr-form button,
.objective-edit-form button, .kr-edit-form button {
  min-height: var(--control-h);
  padding: 0 16px;
  border: 1px solid var(--brand);
  border-radius: var(--radius);
  background: var(--brand);
  color: var(--on-brand);
  font-weight: 800;
  cursor: pointer;
}
.mini-list {
  display: grid;
  gap: 6px;
  margin-top: 12px;
}
.mini-list span {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: var(--muted);
}
.mini-list b {
  float: right;
  color: var(--ink);
}
.mini-list small {
  display: block;
  margin-top: 3px;
}
.manager-target-row {
  display: grid;
  grid-template-columns: minmax(150px, 1.15fr) repeat(5, 72px) minmax(190px, 1.25fr) 70px;
  gap: 8px;
  align-items: end;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
}
.manager-target-row label, .okr-form label, .month-switcher label,
.objective-edit-form label, .kr-edit-form label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
}
.target-person {
  min-height: 58px;
  display: grid;
  align-content: center;
  gap: 3px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}
.target-person span, .target-person small { color: var(--muted); font-size: 13px; }
.target-person b { font-size: 15px; }
.month-switcher {
  min-width: 180px;
}
.manager-kpi-grid { grid-template-columns: repeat(4, minmax(150px, 1fr)); }
.target-progress {
  display: grid;
  grid-template-columns: repeat(2, minmax(90px, 1fr));
  gap: 6px;
}
.target-progress span {
  min-height: 34px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--muted);
  font-size: 13px;
}
.okr-form {
  display: grid;
  grid-template-columns: 120px 180px minmax(260px, 1fr) 86px;
  gap: 10px;
  align-items: end;
  margin-top: 14px;
}
.okr-form.compact {
  grid-template-columns: 150px 130px 90px 140px minmax(220px, 1fr) 86px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.okr-list {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}
.okr-card {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
}
.okr-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: start;
}
.okr-head span, .okr-head small, .kr-item span, .kr-item small {
  color: var(--muted);
  font-size: 13px;
}
.okr-head h3 {
  margin: 4px 0 0;
  font-size: 18px;
}
.kr-list {
  display: grid;
  gap: 8px;
  margin: 12px 0;
}
.kr-item {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) 180px 130px;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border-radius: var(--radius);
  background: var(--surface);
}
.objective-edit-form {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 200px 82px;
  gap: 10px;
  align-items: end;
}
.kr-edit-form {
  display: grid;
  grid-template-columns: minmax(200px, 1fr) 120px 110px 130px 78px 82px 76px;
  gap: 8px;
  align-items: end;
  padding: 9px 10px;
  border-radius: var(--radius);
  background: var(--surface);
}
.kr-progress {
  min-height: var(--control-h);
  display: grid;
  align-content: center;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: var(--muted);
}
.kr-progress span, .kr-progress small { display: block; }
.bd-kr-item { grid-template-columns: minmax(240px, 1fr) 180px minmax(260px, 1fr); }
.note-form {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 110px;
  gap: 12px;
  align-items: end;
  margin: 14px 0;
}
.note-form label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
}
.note-form textarea, .kr-note-form textarea {
  width: 100%;
  min-height: 72px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  resize: vertical;
  font: inherit;
}
.kr-note-form {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 72px;
  gap: 8px;
  align-items: end;
}
.drawer {
  position: fixed;
  inset: 0 0 0 auto;
  width: min(520px, 100vw);
  padding: 18px;
  background: var(--surface);
  border-left: 1px solid var(--line);
  box-shadow: var(--shadow-drawer);
  transform: translateX(104%);
  transition: transform .2s ease;
  z-index: 20;
  overflow: auto;
}
.drawer.open { transform: translateX(0); }
.drawer-head { display: flex; justify-content: space-between; gap: 18px; align-items: start; }
.icon-button { width: 36px; height: 36px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--panel); }
.drawer details { margin-top: 12px; padding: 14px; }
.drawer summary { cursor: pointer; font-weight: 800; }
.detail-grid {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 8px 14px;
}
.detail-grid dt { color: var(--muted); }
.detail-grid dd { margin: 0; }
.detail-grid a {
  color: var(--brand);
  font-weight: 800;
  text-decoration: underline;
}
.template-card {
  margin-top: 12px;
  padding: 12px;
  border-radius: var(--radius);
  background: var(--warn);
  border: 1px solid var(--warn-line);
}
.login-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}
.login-panel { width: min(480px, 100%); padding: 28px; }
.login-panel h1 { margin: 8px 0 10px; }
.primary-action {
  display: block;
  margin: 20px 0 12px;
  padding: 13px 16px;
  background: var(--brand);
  color: var(--on-brand);
  text-align: center;
  font-weight: 800;
}
.compact-action {
  margin: 0;
  width: max-content;
  min-width: 150px;
}
.primary-action.disabled {
  pointer-events: none;
  opacity: .55;
}
.fallback-form { margin-top: 20px; display: grid; gap: 10px; }
.fallback-form button { min-height: 42px; background: var(--brand-2); color: var(--on-brand); font-weight: 800; }
.fallback-form button:hover { background: var(--brand-2-hover); }
.admin-link {
  margin: 14px 0 0;
  text-align: center;
  color: var(--muted);
  font-size: 13px;
}
.admin-link a { text-decoration: underline; }
.two-col { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.two-col article { padding: 16px; }
@media (max-width: 980px) {
  .goal-band, .manager-layout, .two-col { grid-template-columns: 1fr; }
  .manager-title-row { align-items: start; flex-direction: column; }
  .manager-metrics, .kpi-grid, .flow-tabs, .manager-kpi-grid { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
  .admin-form { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
  .stack-form, .manager-target-row, .okr-form, .okr-form.compact, .kr-item, .claim-row, .transfer-row, .note-form, .kr-note-form, .objective-edit-form, .kr-edit-form { grid-template-columns: 1fr; }
  .case-row { grid-template-columns: 1fr; }
  .topbar { height: auto; align-items: start; padding: 14px; flex-direction: column; }
}

/* System visual refresh: shared page rhythm for every role. */
html { min-height: 100%; }
body {
  min-height: 100%;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}
button, input, select, textarea { outline-color: var(--brand); }
input:focus, select:focus, textarea:focus {
  border-color: var(--brand) !important;
  box-shadow: 0 0 0 3px rgba(15, 106, 97, .12);
}
.topbar {
  height: 58px;
  padding: 0 24px;
  box-shadow: 0 1px 0 rgba(28, 36, 48, .04);
}
.topbar > div {
  min-width: 260px;
  align-items: center;
}
.topbar strong {
  font-size: 15px;
  letter-spacing: 0;
}
.topbar span {
  font-size: 14px;
}
.topbar nav {
  align-items: center;
  gap: 8px;
}
.topbar nav a {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding: 7px 12px;
  font-size: 14px;
  color: var(--muted);
}
.topbar nav a.active {
  border-color: var(--brand);
  background: var(--soft);
  color: var(--brand);
  font-weight: 800;
}
.workspace,
.manager-workspace {
  width: min(1360px, calc(100% - 48px));
  margin: 22px auto 52px;
}
.goal-band {
  grid-template-columns: minmax(360px, 1.05fr) minmax(420px, .95fr);
  gap: 18px;
  align-items: center;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
}
.goal-band h1,
.manager-title-row h1 {
  margin: 4px 0 8px;
  font-size: 26px;
  line-height: 1.18;
}
.goal-band p,
.manager-title-block p,
.flow-panel p {
  max-width: 880px;
  color: var(--muted);
}
.eyebrow {
  letter-spacing: .02em;
}
.kpi-grid,
.manager-metrics {
  gap: 10px;
}
.kpi-grid article,
.manager-metrics article {
  min-height: 90px;
  padding: 13px 14px;
  border-color: var(--line);
  background: var(--surface);
}
.kpi-grid b,
.manager-metrics b {
  margin: 5px 0 0;
  font-size: 28px;
  line-height: 1.05;
}
.kpi-grid span,
.manager-metrics span {
  color: var(--muted);
  font-weight: 700;
}
.flow-panel,
.manager-overview,
.manager-card,
.okr-card,
.weekly-grid article,
.two-col article {
  box-shadow: 0 1px 2px rgba(28, 36, 48, .03);
}
.flow-panel {
  padding: 18px;
  margin-bottom: 14px;
}
.list-head {
  align-items: center;
  min-height: 48px;
  margin-bottom: 14px;
}
.list-head h2 {
  margin: 3px 0 4px;
  font-size: 22px;
  line-height: 1.2;
}
.search-box {
  min-width: 240px;
}
.search-box input {
  min-height: 40px;
  background: var(--surface);
}
.flow-tabs {
  grid-template-columns: repeat(10, minmax(92px, 1fr));
  gap: 7px;
  margin-bottom: 16px;
}
.flow-tabs button {
  min-height: 70px;
  padding: 9px 10px;
}
.flow-tabs span {
  font-weight: 750;
}
.flow-tabs small {
  color: var(--muted);
}
.flow-tabs b {
  margin-top: 4px;
  font-size: 19px;
}
.queue-section-head {
  align-items: center;
  padding: 2px 0 8px;
}
.queue-section-head h3 {
  font-size: 18px;
}
.case-row {
  min-height: 64px;
  padding: 12px 14px;
  border-color: var(--line);
  background: var(--panel);
}
.workflow-row {
  grid-template-columns: minmax(190px, 1.2fr) minmax(150px, .8fr) minmax(150px, .8fr) minmax(150px, .8fr) minmax(240px, 1.25fr);
}
.case-row b,
.creator-pool-table b {
  color: var(--ink);
}
.row-metrics b {
  font-size: 16px;
}
.advance-form button,
.creator-pool-table button:not(.link-row-button),
.drawer-form button,
.admin-form button,
.inline-admin-form button,
.permission-form button,
.manager-target-row button,
.okr-form button,
.objective-edit-form button,
.kr-edit-form button,
.note-form button,
.kr-note-form button {
  box-shadow: 0 1px 0 rgba(28, 36, 48, .06);
}
.creator-table-wrap {
  background: var(--panel);
}
.creator-pool-table th {
  height: 44px;
  background: var(--surface-2);
}
.creator-pool-table td {
  height: 60px;
}
.drawer {
  width: min(560px, 100vw);
  padding: 16px;
  background: var(--panel);
}
.drawer-head {
  position: sticky;
  top: -16px;
  z-index: 2;
  margin: -16px -16px 8px;
  padding: 16px;
  background: var(--panel);
  border-bottom: 1px solid var(--line);
}
.drawer details {
  padding: 13px;
  background: var(--surface);
}
.drawer details[open] {
  background: var(--panel);
}
.template-card,
.deal-preview,
.subtle-card {
  background: var(--warn);
  border-color: var(--warn-line);
}
.drawer-form,
#statusForm,
#transferForm {
  gap: 9px;
}
.stage-form {
  background: var(--surface);
}
.manager-overview {
  padding: 18px;
  margin-bottom: 14px;
}
.manager-title-row {
  align-items: center;
}
.manager-metrics {
  grid-template-columns: repeat(6, minmax(110px, 1fr));
}
.manager-layout {
  grid-template-columns: minmax(760px, 1fr) 300px;
}
.manager-card {
  padding: 15px;
}
.weekly-grid {
  grid-template-columns: minmax(360px, .9fr) minmax(420px, 1.1fr);
}
.manager-target-row {
  grid-template-columns: minmax(160px, 1.15fr) repeat(5, 76px) minmax(240px, 1.35fr) 72px;
  padding: 11px;
  background: var(--surface);
}
.target-person,
.target-progress span {
  background: var(--panel);
}
.okr-card {
  background: var(--surface);
}
.objective-edit-form,
.kr-edit-form,
.okr-form.compact {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 10px;
}
.kr-edit-form {
  background: var(--panel);
}
.admin-form {
  grid-template-columns:
    minmax(140px, 1fr)
    minmax(150px, 1fr)
    minmax(140px, 1fr)
    minmax(130px, .9fr)
    minmax(130px, .9fr)
    minmax(150px, .95fr)
    auto;
  align-items: end;
}
.admin-user-row {
  grid-template-columns: minmax(180px, 1.15fr) 90px minmax(230px, 1.2fr) 86px minmax(320px, 1.4fr) 72px 72px;
  background: var(--panel);
}
.permission-form {
  grid-template-columns: minmax(100px, 1fr) minmax(120px, 1fr) auto;
}
.permission-form button,
.inline-admin-form.compact button {
  padding: 0 12px;
}
.two-col {
  align-items: stretch;
}
.two-col article h2 {
  margin: 0 0 8px;
  font-size: 20px;
}
.login-shell {
  place-items: center;
  background:
    linear-gradient(180deg, rgba(15, 106, 97, .08), transparent 34%),
    var(--bg);
}
.login-panel {
  position: relative;
  width: min(500px, 100%);
  padding: 30px;
  border-color: var(--line);
  box-shadow: 0 18px 50px rgba(28, 36, 48, .12);
}
.login-panel::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 6px;
  border-radius: var(--radius) 0 0 var(--radius);
  background: var(--brand);
}
.login-panel h1 {
  margin: 6px 0 8px;
  font-size: 30px;
}
.login-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 16px 0 2px;
}
.login-meta span {
  padding: 5px 9px;
  border-radius: var(--radius-pill);
  background: var(--soft);
  color: var(--brand);
  font-size: 12px;
  font-weight: 800;
}
.fallback-form {
  margin-top: 18px;
  gap: 11px;
}
.fallback-form label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}
.fallback-form input {
  background: var(--surface);
}
.fallback-form button {
  border-color: var(--brand);
  background: var(--brand);
}
.fallback-form button:hover {
  border-color: var(--brand-hover);
  background: var(--brand-hover);
}
.primary-action {
  border-radius: var(--radius);
}
.mini-list span {
  background: var(--panel);
}
@media (max-width: 1180px) {
  .manager-layout,
  .weekly-grid,
  .goal-band {
    grid-template-columns: 1fr;
  }
  .manager-metrics {
    grid-template-columns: repeat(3, minmax(120px, 1fr));
  }
  .workflow-row,
  .manager-target-row,
  .admin-user-row {
    grid-template-columns: 1fr;
  }
  .advance-form,
  .permission-form {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .workspace,
  .manager-workspace {
    width: min(100% - 24px, 1360px);
    margin-top: 14px;
  }
  .topbar nav {
    width: 100%;
    overflow-x: auto;
    padding-bottom: 2px;
  }
  .goal-band,
  .flow-panel,
  .manager-overview {
    padding: 14px;
  }
  .kpi-grid,
  .manager-metrics,
  .flow-tabs {
    grid-template-columns: repeat(2, minmax(120px, 1fr));
  }
  .list-head {
    align-items: stretch;
    flex-direction: column;
  }
  .search-box {
    min-width: 0;
  }
  .admin-form {
    grid-template-columns: 1fr;
  }
}


/* shadcn/ui light dashboard correction - top navigation, keep existing workflow logic */
:root{--bg:#fafafa;--panel:#fff;--surface:#fafafa;--surface-2:#f4f4f5;--ink:#09090b;--muted:#71717a;--line:#e4e4e7;--brand:#18181b;--brand-hover:#27272a;--on-brand:#fafafa;--brand-2:#0f766e;--brand-2-hover:#0f5f59;--soft:#f4f4f5;--warn:#fffbeb;--warn-line:#fde68a;--danger:#dc2626;--radius:10px;--radius-pill:999px;--control-h:36px;--shadow-drawer:-24px 0 50px rgba(15,23,42,.16)}
body{background:var(--bg);color:var(--ink);font-size:14px;line-height:1.5}.topbar{position:sticky;top:0;z-index:30;height:56px;width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:0 24px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:rgba(255,255,255,.96);box-shadow:none;backdrop-filter:blur(10px)}.topbar>div{min-width:240px;display:flex;align-items:baseline;gap:10px;padding:0;border:0}.topbar strong{font-size:15px;font-weight:700;color:var(--ink)}.topbar span{font-size:13px;color:var(--muted)}.topbar nav{display:flex;align-items:center;justify-content:flex-end;gap:8px}.topbar nav a{min-height:36px;width:auto;display:inline-flex;align-items:center;justify-content:center;padding:7px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink);font-size:14px;font-weight:500;white-space:nowrap}.topbar nav a:hover,.topbar nav a.active{border-color:#d4d4d8;background:var(--soft);color:var(--ink)}
.workspace,.manager-workspace{width:min(1440px,calc(100% - 48px));margin:22px auto 56px}.goal-band,.manager-overview,.flow-panel,.manager-card,.login-panel,.weekly-grid article,.two-col article,.okr-card,.creator-table-wrap,.case-row,.workflow-row,.kpi-grid article,.manager-metrics article,.target-person,.target-progress span,.objective-edit-form,.kr-edit-form,.okr-form.compact,.mini-list span,.manager-alert-list article,.drawer details{border:1px solid var(--line);border-radius:12px;background:var(--panel);box-shadow:none}.goal-band{grid-template-columns:minmax(360px,1fr) minmax(440px,.95fr);gap:20px;padding:22px;align-items:center}.goal-band h1,.manager-title-row h1{margin:4px 0 8px;font-size:28px;font-weight:700;letter-spacing:0}.goal-band p,.scope-line,.list-head .muted,.manager-card p{color:var(--muted);line-height:1.55}.eyebrow{color:#0f766e;font-size:12px;font-weight:800;letter-spacing:0;text-transform:uppercase}.kpi-grid{grid-template-columns:repeat(4,minmax(140px,1fr));gap:12px}.manager-metrics{grid-template-columns:repeat(6,minmax(120px,1fr));gap:10px}.kpi-grid article,.manager-metrics article{min-height:94px;padding:15px}.kpi-grid span,.manager-metrics span{color:var(--muted);font-size:13px;font-weight:650}.kpi-grid b,.manager-metrics b{margin-top:8px;color:var(--ink);font-size:30px;font-weight:700;line-height:1.05}.flow-panel{padding:20px;margin-bottom:16px}.list-head{align-items:center;min-height:46px;margin-bottom:16px}.list-head h2{margin:3px 0 4px;font-size:22px;font-weight:700}.search-box{min-width:260px}.flow-tabs{grid-template-columns:repeat(10,minmax(92px,1fr));gap:8px;margin-bottom:16px}.flow-tabs button{min-height:74px;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--ink)}.flow-tabs button:hover,.flow-tabs button.active{border-color:#d4d4d8;background:var(--soft);color:var(--ink)}.flow-tabs span{font-weight:650}.flow-tabs b{margin-top:5px;font-size:22px;font-weight:700}.queue-section-head{align-items:center;padding:2px 0 10px}.queue-section-head>span,.scope-pill,.permission-chips i,.workflow-done,.login-meta span{border-radius:999px;background:var(--soft);color:#0f766e;font-weight:800}
.workflow-row{grid-template-columns:minmax(210px,1.2fr) minmax(150px,.8fr) minmax(150px,.8fr) minmax(150px,.8fr) minmax(260px,1.25fr)}.case-row{min-height:64px;padding:12px 14px}.case-row:hover,.creator-pool-table tbody tr:hover{border-color:#d4d4d8;background:var(--surface)}.creator-table-wrap{overflow:hidden}.creator-pool-table th{height:44px;background:var(--surface);color:var(--muted);font-size:13px;font-weight:650}.creator-pool-table td{padding:12px 14px;border-color:var(--line)}.creator-pool-table tbody tr:hover td{background:var(--surface)}input,select,textarea,.search-box input,.fallback-form input,.admin-form input,.admin-form select,.inline-admin-form input,.inline-admin-form select,.permission-form select,.drawer-form input,.drawer-form select,.drawer-form textarea,.advance-form select,.advance-form textarea,.stack-form input,.manager-target-row input,.manager-target-row select,.okr-form input,.okr-form select,.month-switcher select,.objective-edit-form input,.objective-edit-form select,.kr-edit-form input,.kr-edit-form select,.note-form textarea,.kr-note-form textarea,#statusForm select,#transferForm select{min-height:var(--control-h);border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink);box-shadow:none}input:focus,select:focus,textarea:focus{border-color:#a1a1aa!important;box-shadow:0 0 0 3px rgba(161,161,170,.22)}
.primary-action,.advance-form button,.creator-pool-table button:not(.link-row-button),.claim-row button,.transfer-row button,.drawer-form button,#statusForm button,#transferForm button,.admin-form button,.inline-admin-form button,.permission-form button,.stack-form button,.manager-target-row button,.okr-form button,.objective-edit-form button,.kr-edit-form button,.note-form button,.kr-note-form button,.fallback-form button{min-height:36px;border:1px solid var(--brand);border-radius:8px;background:var(--brand);color:var(--on-brand);font-weight:600;box-shadow:none}.primary-action:hover,.advance-form button:hover,.creator-pool-table button:not(.link-row-button):hover,.claim-row button:hover,.transfer-row button:hover,.drawer-form button:hover,#statusForm button:hover,#transferForm button:hover,.admin-form button:hover,.inline-admin-form button:hover,.permission-form button:hover,.stack-form button:hover,.manager-target-row button:hover,.okr-form button:hover,.objective-edit-form button:hover,.kr-edit-form button:hover,.note-form button:hover,.kr-note-form button:hover,.fallback-form button:hover{border-color:var(--brand-hover);background:var(--brand-hover)}.subtle-card,.template-card,.deal-preview{border-color:var(--warn-line);background:var(--warn)}.manager-layout{grid-template-columns:minmax(760px,1fr) 340px;gap:16px}.manager-overview{padding:20px}.manager-card{padding:18px}.weekly-grid{grid-template-columns:minmax(360px,.9fr) minmax(420px,1.1fr)}.manager-target-row{border-radius:12px;background:var(--surface)}.okr-card{background:var(--surface)}.objective-edit-form,.kr-edit-form,.okr-form.compact{padding:10px;background:var(--panel)}.drawer{width:min(580px,100vw);background:var(--panel);border-left:1px solid var(--line)}.drawer-head{background:var(--panel)}.drawer details{background:var(--panel)}.login-shell{background:radial-gradient(circle at top left,rgba(15,118,110,.08),transparent 32rem),var(--bg)}.login-panel{width:min(420px,100%);padding:28px}.login-panel h1{font-size:26px;font-weight:700}@media (max-width:1180px){.workspace,.manager-workspace{width:min(100% - 24px,1440px);margin-top:16px}.goal-band,.manager-layout,.weekly-grid{grid-template-columns:1fr}.manager-metrics{grid-template-columns:repeat(3,minmax(120px,1fr))}.workflow-row,.manager-target-row,.admin-user-row{grid-template-columns:1fr}.advance-form,.permission-form{grid-template-columns:1fr}}@media (max-width:760px){.topbar{height:auto;align-items:flex-start;flex-direction:column;padding:12px 14px}.topbar nav{width:100%;overflow-x:auto;justify-content:flex-start}.kpi-grid,.manager-metrics,.flow-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.goal-band,.flow-panel,.manager-overview{padding:14px}.list-head{align-items:stretch;flex-direction:column}.search-box{min-width:0}.admin-form{grid-template-columns:1fr}}