:root {
  --canvas: #f3f4f1;
  --surface: #ffffff;
  --surface-soft: #f8f9f6;
  --surface-strong: #eef0ec;
  --ink: #1b211d;
  --ink-soft: #3f4742;
  --muted: #6c746f;
  --muted-light: #98a09a;
  --line: #dde1dc;
  --line-strong: #c8cec8;
  --nav: #171815;
  --nav-soft: #22231f;
  --nav-line: #30312c;
  --teal: #087f6a;
  --teal-soft: #e5f3ef;
  --blue: #2f62d0;
  --blue-soft: #eaf0ff;
  --amber: #a96100;
  --amber-soft: #fff1d8;
  --coral: #b84939;
  --coral-soft: #fdece8;
  --red: #b42318;
  --red-soft: #fde9e6;
  --green: #247248;
  --green-soft: #e9f5ed;
  --shadow-sm: 0 1px 2px rgba(24, 31, 26, 0.06);
  --shadow-md: 0 16px 48px rgba(16, 22, 18, 0.12);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  color-scheme: light;
}

* {
  box-sizing: border-box;
}

html,
body {
  min-width: 320px;
  min-height: 100%;
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--canvas);
  font-size: 14px;
  line-height: 1.5;
}

button,
input,
textarea,
select {
  font: inherit;
}

button,
summary {
  cursor: pointer;
}

button {
  letter-spacing: 0;
}

input,
textarea,
select {
  letter-spacing: 0;
}

button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible {
  outline: 3px solid rgba(47, 98, 208, 0.22);
  outline-offset: 2px;
}

button:disabled,
input:disabled,
textarea:disabled,
select:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.hidden {
  display: none !important;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

i[data-lucide] {
  display: none;
}

.lucide {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  stroke-width: 1.8;
}

html.icons-ready .icon-fallback,
html.icons-ready .rail-fallback {
  display: none;
}

.eyebrow,
.login-kicker,
.workspace-kicker {
  font-size: 13px;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Login */
.login-view {
  position: relative;
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  place-items: center;
  overflow: auto;
  padding: 40px;
  background-color: #22241f;
  background-image: url("./assets/workspace-login.jpg");
  background-position: center;
  background-size: cover;
  isolation: isolate;
}

.login-view::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  background: rgba(18, 20, 17, 0.7);
}

.login-shell {
  width: min(1220px, 100%);
  min-height: min(720px, calc(100dvh - 80px));
  display: grid;
  grid-template-columns: minmax(0, 1fr) 430px;
  gap: 64px;
  align-items: stretch;
}

.login-story {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 22px 0;
  color: #ffffff;
}

.brand-lockup {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  font-weight: 700;
}

.brand-mark,
.rail-mark {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #e2b94b;
  color: #171815;
  font-weight: 850;
}

.login-copy {
  max-width: 720px;
  padding: 80px 0;
}

.login-copy .eyebrow {
  color: #d9c581;
}

.login-copy h1 {
  max-width: 690px;
  margin: 18px 0 20px;
  font-size: 56px;
  font-weight: 720;
  line-height: 1.12;
  letter-spacing: 0;
}

.login-copy p {
  max-width: 660px;
  margin: 0;
  color: rgba(255, 255, 255, 0.74);
  font-size: 17px;
  line-height: 1.75;
}

.platform-ribbon {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.platform-ribbon span {
  padding: 7px 10px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.76);
  background: rgba(17, 18, 16, 0.26);
  font-size: 12px;
  backdrop-filter: blur(8px);
}

.login-panel {
  align-self: center;
  min-width: 0;
  padding: 34px;
  border: 1px solid rgba(255, 255, 255, 0.68);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: var(--shadow-md);
  backdrop-filter: blur(16px);
}

.login-panel-head {
  margin-bottom: 26px;
}

.login-kicker {
  color: var(--teal);
}

.login-panel h2 {
  margin: 8px 0 6px;
  font-size: 28px;
  line-height: 1.25;
}

.login-panel-head p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.6;
}

.login-method-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  margin-bottom: 18px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.login-method-tabs button {
  min-width: 0;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 0;
  border-radius: 5px;
  color: var(--muted);
  background: transparent;
  font-weight: 700;
  cursor: pointer;
}

.login-method-tabs button[aria-selected="true"] {
  color: var(--ink);
  background: var(--surface);
  box-shadow: 0 1px 3px rgba(20, 26, 22, 0.1);
}

.login-method-tabs .lucide {
  width: 17px;
  height: 17px;
}

.feishu-qr-login {
  display: grid;
  gap: 13px;
}

.feishu-qr-stage {
  position: relative;
  min-height: 300px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #ffffff;
}

.feishu-redirect-stage {
  min-height: 220px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
  text-align: center;
}

.feishu-redirect-mark {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  margin-bottom: 4px;
  border-radius: 50%;
  color: var(--blue);
  background: var(--blue-soft);
}

.feishu-redirect-mark .lucide {
  width: 28px;
  height: 28px;
}

.feishu-redirect-stage strong {
  font-size: 17px;
}

.feishu-redirect-stage > span:last-child {
  color: var(--muted);
  font-size: 13px;
}

.feishu-qr-container {
  width: 280px;
  min-height: 300px;
  display: grid;
  place-items: center;
}

.feishu-qr-container iframe {
  display: block;
  border: 0;
}

.feishu-qr-refresh {
  position: absolute;
  top: 10px;
  right: 10px;
  background: rgba(255, 255, 255, 0.92);
}

.feishu-qr-refresh.loading .lucide {
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

.feishu-qr-meta {
  display: grid;
  gap: 10px;
}

.feishu-qr-meta > div {
  min-width: 0;
  display: grid;
  gap: 3px;
  text-align: center;
}

.feishu-qr-meta strong {
  color: var(--ink);
  font-size: 15px;
}

.feishu-qr-meta span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.login-form {
  display: grid;
  gap: 15px;
}

.login-form label,
.provision-form label,
.identity-link-form label {
  display: grid;
  gap: 7px;
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 650;
}

.input-shell,
.admin-search-shell,
.password-input-shell {
  position: relative;
  display: flex;
  align-items: center;
}

.input-shell .lucide,
.admin-search-shell .lucide {
  position: absolute;
  left: 12px;
  width: 17px;
  height: 17px;
  color: var(--muted-light);
  pointer-events: none;
}

.login-form input,
.provision-form input,
.provision-form select,
.admin-search {
  width: 100%;
  min-width: 0;
  height: 44px;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  outline: none;
  color: var(--ink);
  background: var(--surface);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.login-form input {
  padding: 0 12px 0 40px;
}

.password-input-shell > input {
  padding-right: 48px;
}

.password-visibility-button {
  position: absolute;
  right: 6px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 6px;
  color: var(--muted);
  background: transparent;
}

.password-visibility-button:hover {
  color: var(--ink);
  background: var(--surface-soft);
}

.password-visibility-button:focus-visible {
  outline: 2px solid var(--teal);
  outline-offset: 1px;
}

.input-shell .password-visibility-button .lucide,
.password-visibility-button .lucide {
  position: static;
  width: 18px;
  height: 18px;
  color: currentColor;
  pointer-events: none;
}

.login-form input:focus,
.provision-form input:focus,
.provision-form select:focus,
.admin-search:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(8, 127, 106, 0.1);
}

.primary-button,
.secondary-button,
.ghost-button,
.send-button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 7px;
  font-weight: 700;
}

.primary-button,
.send-button {
  border: 1px solid var(--nav);
  color: #ffffff;
  background: var(--nav);
}

.primary-button:hover,
.send-button:hover {
  background: #2a2c27;
}

.secondary-button,
.ghost-button {
  border: 1px solid var(--line-strong);
  color: var(--ink);
  background: var(--surface);
}

.secondary-button:hover,
.ghost-button:hover {
  border-color: #aeb6af;
  background: var(--surface-soft);
}

.login-submit {
  width: 100%;
  height: 46px;
  margin-top: 3px;
  padding: 0 16px;
}

.login-submit .lucide {
  margin-left: auto;
}

.login-error {
  min-height: 18px;
  color: var(--red);
  font-size: 12px;
  line-height: 1.5;
}

.feishu-login-button {
  width: 100%;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--ink);
  background: var(--surface);
  font-weight: 650;
  cursor: pointer;
}

.feishu-login-button:hover {
  border-color: #8bb2f4;
  background: var(--blue-soft);
}

.feishu-login-button .lucide {
  width: 17px;
  height: 17px;
  color: var(--blue);
}

.demo-access {
  margin-top: 4px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.demo-access summary,
.context-panel > summary,
.side-disclosure > summary {
  list-style: none;
}

.demo-access summary::-webkit-details-marker,
.context-panel > summary::-webkit-details-marker,
.side-disclosure > summary::-webkit-details-marker {
  display: none;
}

.demo-access summary {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--muted);
  font-size: 13px;
}

.demo-access summary .lucide,
.context-panel > summary .lucide,
.side-disclosure > summary .lucide {
  width: 16px;
  height: 16px;
  transition: transform 0.18s ease;
}

.demo-access[open] summary .lucide,
.context-panel[open] > summary .lucide,
.side-disclosure[open] > summary .lucide {
  transform: rotate(180deg);
}

.login-options {
  display: grid;
  gap: 7px;
  padding: 0 0 12px;
}

.login-option {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 12px;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 7px;
  text-align: left;
  color: var(--ink);
  background: var(--surface-soft);
}

.login-option:hover {
  border-color: var(--line-strong);
  background: var(--surface-strong);
}

.login-option strong {
  min-width: 0;
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.login-option span {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 12px;
}

.login-footnote {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 18px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.login-footnote .lucide {
  width: 16px;
  height: 16px;
  color: var(--teal);
}

/* App shell and navigation */
.app-shell {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  display: grid;
  grid-template-columns: 52px 264px minmax(0, 1fr);
  overflow: hidden;
  background: var(--canvas);
}

@media (min-width: 1021px) {
  .app-shell[data-entry="admin"] {
    grid-template-columns: 264px minmax(0, 1fr);
  }

  .app-shell[data-entry="admin"] .activity-rail {
    display: none;
  }
}

.activity-rail {
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  padding: 10px 7px;
  color: #d9ddd7;
  background: #11120f;
  border-right: 1px solid #262722;
}

.rail-mark {
  width: 36px;
  height: 36px;
  margin-bottom: 9px;
  font-size: 12px;
}

.rail-button,
.icon-button {
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 7px;
  color: inherit;
  background: transparent;
}

.rail-button:hover,
.rail-button.active {
  border-color: rgba(255, 255, 255, 0.1);
  color: #ffffff;
  background: rgba(255, 255, 255, 0.08);
}

.rail-button.active {
  box-shadow: inset 2px 0 0 #e2b94b;
}

.rail-bottom {
  margin-top: auto;
}

.rail-fallback,
.icon-fallback {
  font-size: 12px;
  font-weight: 750;
}

.thread-sidebar {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding: 16px 14px 14px;
  overflow: hidden;
  color: #f2f3ef;
  background: var(--nav);
  border-right: 1px solid var(--nav-line);
}

.sidebar-head {
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.sidebar-brand {
  min-width: 0;
}

.sidebar-brand strong,
.sidebar-brand span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-brand strong {
  font-size: 14px;
}

.sidebar-brand span {
  margin-top: 3px;
  color: #999e97;
  font-size: 13px;
}

.thread-sidebar .icon-button {
  border-color: var(--nav-line);
  color: #f2f3ef;
  background: var(--nav-soft);
}

.thread-sidebar .icon-button:hover {
  background: #2a2c27;
}

.search-box {
  position: relative;
  display: flex;
  align-items: center;
}

.search-box .lucide {
  position: absolute;
  left: 10px;
  width: 15px;
  height: 15px;
  color: #858b84;
  pointer-events: none;
}

.search-box input {
  width: 100%;
  min-width: 0;
  height: 36px;
  padding: 0 10px 0 33px;
  border: 1px solid var(--nav-line);
  border-radius: 7px;
  outline: none;
  color: #f3f4f1;
  background: var(--nav-soft);
}

.search-box input::placeholder {
  color: #868c85;
}

.search-box input:focus {
  border-color: #595d56;
}

.sidebar-section {
  min-width: 0;
  display: grid;
  gap: 8px;
}

.sidebar-section.grow {
  min-height: 0;
  flex: 1;
}

.section-title {
  color: #8f958e;
  font-size: 13px;
  font-weight: 700;
}

.account-section {
  padding: 10px;
  border: 1px solid var(--nav-line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.035);
}

.account-card {
  min-width: 0;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
}

.avatar,
.avatar-small {
  display: grid;
  place-items: center;
  font-weight: 750;
}

.avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  color: #ffffff;
  background: var(--teal);
}

.account-copy {
  min-width: 0;
}

.account-copy strong,
.account-copy span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-copy strong {
  font-size: 13px;
}

.account-copy span {
  margin-top: 3px;
  color: #aab0a9;
  font-size: 13px;
}

.online-dot {
  width: 8px;
  height: 8px;
  border: 2px solid var(--nav);
  border-radius: 50%;
  background: #50b978;
  box-shadow: 0 0 0 2px rgba(80, 185, 120, 0.15);
}

.account-switch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--nav-line);
  color: #8f958e;
  font-size: 13px;
}

.account-switch button {
  padding: 3px 0;
  border: 0;
  color: #c6cac4;
  background: transparent;
  font-size: 13px;
}

.account-switch button:hover {
  color: #ffffff;
}

.role-context-switcher {
  width: 100%;
  min-width: 0;
  height: 36px;
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) 14px;
  align-items: center;
  gap: 7px;
  margin-top: 9px;
  padding: 0 9px;
  border: 1px solid var(--nav-line);
  border-radius: 6px;
  color: #c9cec7;
  background: rgba(255, 255, 255, 0.04);
}

.role-context-switcher .lucide {
  width: 15px;
  height: 15px;
}

.role-context-switcher select {
  min-width: 0;
  width: 100%;
  height: 34px;
  padding: 0;
  border: 0;
  outline: 0;
  appearance: none;
  color: #f2f4f0;
  background: transparent;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}

.role-context-switcher:focus-within {
  border-color: #7c9d91;
  box-shadow: 0 0 0 2px rgba(73, 177, 142, 0.15);
}

.admin-menu {
  gap: 5px;
}

.sidebar-nav {
  width: 100%;
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 10px;
  border: 1px solid transparent;
  border-radius: 7px;
  color: #c7cbc5;
  background: transparent;
  text-align: left;
  font-size: 13px;
}

.sidebar-nav .lucide {
  width: 16px;
  height: 16px;
}

.sidebar-nav:hover,
.sidebar-nav.active {
  border-color: var(--nav-line);
  color: #ffffff;
  background: var(--nav-soft);
}

.thread-list {
  min-height: 0;
  display: grid;
  align-content: start;
  gap: 4px;
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: #3d3f39 transparent;
}

.thread-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.thread-filter-tabs {
  display: inline-grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border: 1px solid var(--nav-line);
  border-radius: 6px;
  overflow: hidden;
}

.thread-filter-tabs button {
  min-width: 42px;
  height: 25px;
  padding: 0 7px;
  border: 0;
  color: #8f958e;
  background: transparent;
  font-size: 12px;
}

.thread-filter-tabs button.active {
  color: #ffffff;
  background: var(--nav-soft);
}

.thread-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 7px;
}

.thread-row:hover,
.thread-row.active {
  border-color: var(--nav-line);
  background: var(--nav-soft);
}

.thread-item {
  width: 100%;
  min-width: 0;
  padding: 9px 10px;
  border: 0;
  border-radius: 7px;
  color: #d7dad5;
  background: transparent;
  text-align: left;
}

.thread-item:hover,
.thread-item.active {
  background: transparent;
}

.thread-item.active {
  color: #ffffff;
}

.thread-item strong,
.thread-item span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.thread-item strong {
  font-size: 12px;
}

.thread-item span {
  margin-top: 4px;
  color: #8f958e;
  font-size: 13px;
}

.thread-menu-button {
  width: 26px;
  height: 28px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 5px;
  color: #8f958e;
  background: transparent;
  opacity: 0;
}

.thread-row:hover .thread-menu-button,
.thread-row.active .thread-menu-button,
.thread-menu-button:focus-visible {
  opacity: 1;
}

.thread-menu-button:hover {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.08);
}

.thread-menu-button .lucide {
  width: 14px;
  height: 14px;
}

.thread-context-menu {
  position: fixed;
  z-index: 2100;
  width: 168px;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #ffffff;
  box-shadow: 0 14px 38px rgba(18, 24, 21, 0.18);
}

.thread-context-menu button {
  width: 100%;
  min-height: 36px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 10px;
  border: 0;
  border-radius: 5px;
  color: var(--ink);
  background: transparent;
  text-align: left;
  font-size: 14px;
}

.thread-context-menu button:hover,
.thread-context-menu button:focus-visible {
  background: var(--surface-soft);
}

.thread-context-menu button.danger {
  color: var(--danger);
}

.thread-context-menu .lucide {
  width: 16px;
  height: 16px;
}

.thread-load-more {
  width: 100%;
  min-height: 30px;
  margin-top: 5px;
  border: 1px solid var(--nav-line);
  border-radius: 6px;
  color: #aab0a9;
  background: transparent;
  font-size: 12px;
}

.thread-load-more:hover {
  color: #ffffff;
  background: var(--nav-soft);
}

.thread-empty {
  padding: 18px 8px;
  color: #8f958e;
  text-align: center;
  font-size: 12px;
}

.sidebar-footer {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 10px 2px 0;
  border-top: 1px solid var(--nav-line);
  color: #8f958e;
  font-size: 13px;
}

.sidebar-footer .lucide {
  width: 14px;
  height: 14px;
  color: #55b782;
}

/* Workspace */
.workspace {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: 66px minmax(0, 1fr);
  overflow: hidden;
  background: var(--canvas);
}

.workspace-header {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 22px;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(14px);
}

.app-shell[data-entry="admin"] .workspace {
  grid-template-rows: minmax(0, 1fr);
}

.app-shell[data-entry="admin"] .workspace-header {
  display: none;
}

.app-shell[data-entry="admin"] .workspace-heading {
  display: none;
}

.workspace-heading {
  min-width: 0;
}

.workspace-kicker {
  margin-bottom: 3px;
  color: var(--teal);
  letter-spacing: 0.06em;
}

.workspace-header h2,
.workspace-header p {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-header h2 {
  margin: 0;
  font-size: 16px;
  line-height: 1.25;
}

.workspace-header p {
  max-width: 680px;
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.header-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
}

.model-pill,
.status-pill,
.safety-badge,
.security-lock,
.composer-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.model-pill {
  appearance: none;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid #cde3dd;
  border-radius: 999px;
  color: #176f60;
  background: var(--teal-soft);
  font-size: 13px;
  cursor: pointer;
}

.model-pill .lucide {
  width: 14px;
  height: 14px;
}

.model-pill:hover {
  border-color: var(--line-strong);
  color: var(--ink-soft);
}

.model-pill.admin-source {
  border-color: #d6def5;
  color: #345cae;
  background: var(--blue-soft);
}

.status-pill {
  min-height: 30px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface);
  font-size: 13px;
}

.status-pill b {
  color: var(--ink);
}

.header-icon {
  border-color: var(--line);
  color: var(--muted);
  background: var(--surface);
}

.header-icon:hover {
  border-color: var(--line-strong);
  color: var(--ink);
}

.mobile-thread-button {
  display: none;
}

.mobile-nav {
  display: none;
}

/* Chat */
.chat-layout {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 326px;
  overflow: hidden;
}

.conversation-panel {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto auto auto;
  background: #f7f8f5;
}

.chat-window {
  grid-row: 1;
  min-width: 0;
  min-height: 0;
  overflow: auto;
  padding: 30px max(28px, calc((100% - 860px) / 2)) 24px;
  scrollbar-width: thin;
  scrollbar-color: var(--line-strong) transparent;
}

.codex-empty {
  min-height: 100%;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 9px;
  padding: 36px 20px 12px;
  color: var(--muted);
  text-align: center;
}

.codex-empty::before {
  width: 44px;
  height: 5px;
  margin-bottom: 8px;
  border-radius: 999px;
  content: "";
  background: var(--teal);
  box-shadow: 18px 0 0 #e2b94b, -18px 0 0 var(--blue);
}

.codex-empty h3 {
  margin: 0;
  color: var(--ink);
  font-size: 25px;
  font-weight: 680;
}

.codex-empty p {
  max-width: 510px;
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
}

.codex-orb {
  display: none;
}

.quick-prompts {
  grid-row: 3;
  width: min(860px, calc(100% - 56px));
  margin: 0 auto 12px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.pilot-access-banner {
  grid-row: 2;
  width: min(860px, calc(100% - 56px));
  min-width: 0;
  margin: 0 auto 10px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 34px;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border: 1px solid #e2c98e;
  border-radius: 8px;
  color: #604a17;
  background: #fff8e7;
}

.pilot-access-icon {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  color: #8a6510;
  background: #f7e7b8;
}

.pilot-access-icon .lucide {
  width: 17px;
  height: 17px;
}

.pilot-access-banner strong,
.pilot-access-banner > div > span {
  display: block;
  overflow-wrap: anywhere;
}

.pilot-access-banner strong {
  font-size: 12px;
}

.pilot-access-banner > div > span {
  margin-top: 2px;
  color: #776129;
  font-size: 13px;
  line-height: 1.45;
}

.pilot-access-banner .icon-button {
  width: 32px;
  height: 32px;
  color: #776129;
  border-color: #e2c98e;
  background: rgba(255, 255, 255, 0.72);
}

.quick-prompts button {
  min-width: 0;
  min-height: 68px;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: var(--shadow-sm);
  text-align: left;
  transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.quick-prompts button:hover {
  border-color: var(--line-strong);
  box-shadow: 0 6px 16px rgba(29, 36, 31, 0.07);
  transform: translateY(-1px);
}

.quick-prompts strong,
.quick-prompts small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.quick-prompts strong {
  font-size: 13px;
}

.quick-prompts small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}

.prompt-icon,
.section-icon,
.panel-icon,
.empty-icon {
  display: grid;
  place-items: center;
  border-radius: 7px;
}

.prompt-icon {
  width: 36px;
  height: 36px;
}

.prompt-icon .lucide,
.section-icon .lucide,
.panel-icon .lucide,
.empty-icon .lucide {
  width: 18px;
  height: 18px;
}

.teal {
  color: var(--teal);
  background: var(--teal-soft);
}

.blue {
  color: var(--blue);
  background: var(--blue-soft);
}

.amber {
  color: var(--amber);
  background: var(--amber-soft);
}

.coral {
  color: var(--coral);
  background: var(--coral-soft);
}

.composer {
  grid-row: 4;
  width: min(860px, calc(100% - 56px));
  margin: 0 auto 18px;
  padding: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: 0 12px 34px rgba(23, 29, 25, 0.11);
}

.composer.pilot-locked {
  box-shadow: none;
  background: #f2f3f0;
}

.composer.pilot-locked textarea {
  cursor: not-allowed;
}

.composer-box {
  min-width: 0;
  display: flex;
  align-items: flex-end;
  gap: 8px;
}

.composer textarea {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  max-height: 130px;
  padding: 11px 10px 9px;
  resize: none;
  border: 0;
  outline: none;
  color: var(--ink);
  background: transparent;
  font-size: 14px;
  line-height: 1.55;
}

.composer textarea::placeholder {
  color: #929994;
}

.composer .icon-button {
  margin-bottom: 4px;
  border-color: transparent;
  color: var(--muted);
}

.composer .icon-button:hover {
  color: var(--ink);
  background: var(--surface-strong);
}

.send-button {
  width: 38px;
  min-width: 38px;
  height: 38px;
  min-height: 38px;
  margin-bottom: 3px;
  padding: 0;
  border-radius: 7px;
}

.send-button .lucide {
  width: 18px;
  height: 18px;
}

.composer-foot {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 4px 4px 0;
}

.composer-tools,
.scope-list,
.tag-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}

.chat-mode-switch {
  min-width: 118px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--surface);
}

.chat-mode-switch button {
  min-width: 0;
  min-height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 0 7px;
  border: 0;
  border-right: 1px solid var(--line);
  color: var(--muted);
  background: transparent;
  font-size: 12px;
}

.chat-mode-switch button:last-child {
  border-right: 0;
}

.chat-mode-switch button.active {
  color: var(--teal);
  background: var(--teal-soft);
}

.chat-mode-switch button:disabled {
  opacity: 0.55;
}

.chat-mode-switch .lucide {
  width: 12px;
  height: 12px;
}

.security-lock,
.tool-toggle,
.composer-status {
  min-height: 25px;
  font-size: 12px;
}

.security-lock {
  padding: 0 7px;
  border-radius: 999px;
  color: var(--teal);
  background: var(--teal-soft);
}

.security-lock .lucide {
  width: 13px;
  height: 13px;
}

.tool-toggle {
  padding: 0 8px;
  border: 1px solid transparent;
  border-radius: 999px;
  color: var(--muted);
  background: transparent;
}

.tool-toggle:hover,
.tool-toggle.active {
  border-color: var(--line);
  color: var(--ink-soft);
  background: var(--surface-soft);
}

.composer-status {
  flex: 0 0 auto;
  color: var(--muted);
}

.composer-status > span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #43a969;
}

.composer-status.blocked > span {
  background: #b68418;
}

/* Messages */
.message {
  width: min(860px, 100%);
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 11px;
  margin: 0 auto 24px;
}

.message.user {
  grid-template-columns: minmax(0, 1fr) 32px;
}

.message.user .avatar-small {
  grid-column: 2;
}

.message.user .message-body {
  width: min(720px, 100%);
  display: flex;
  align-items: flex-end;
  flex-direction: column;
  grid-column: 1;
  grid-row: 1;
  justify-self: end;
}

.message.user .message-head {
  justify-content: flex-end;
  text-align: right;
}

.avatar-small {
  width: 30px;
  height: 30px;
  border-radius: 7px;
  color: var(--ink);
  background: var(--surface-strong);
  font-size: 13px;
}

.message.assistant .avatar-small {
  color: #e2b94b;
  background: var(--nav);
}

.message.user .avatar-small {
  border-radius: 50%;
  color: #ffffff;
  background: var(--teal);
}

.message-body {
  min-width: 0;
}

.message-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.message-head strong,
.message-head span {
  display: block;
}

.message-head strong {
  font-size: 12px;
}

.message-head span {
  margin-top: 2px;
  color: var(--muted-light);
  font-size: 12px;
}

.bubble {
  max-width: 100%;
  padding: 0;
  overflow-wrap: anywhere;
  color: var(--ink-soft);
  background: transparent;
  font-size: 14px;
  line-height: 1.72;
}

.message.user .bubble {
  max-width: min(700px, 88%);
  padding: 10px 13px;
  border-radius: 8px;
  color: #ffffff;
  background: #252823;
}

.message-actions {
  min-height: 25px;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  opacity: 0;
  transition: opacity 0.15s ease;
}

.message:hover .message-actions,
.message:focus-within .message-actions {
  opacity: 1;
}

.message-actions button {
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--muted);
  background: var(--surface);
  font-size: 12px;
}

.message-actions button:hover {
  color: var(--ink);
  border-color: var(--line-strong);
}

.message-model-usage {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 12px;
  padding-top: 9px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.message-model-usage .lucide {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  color: var(--teal);
}

.message-model-usage span {
  color: var(--ink-soft);
  font-weight: 700;
}

.message-model-usage small {
  margin-left: auto;
  color: var(--muted);
  font-size: inherit;
}

.execution-details {
  margin-top: 14px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #ffffff;
  overflow: hidden;
  white-space: normal;
}

.execution-details summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 13px;
  color: var(--muted);
  font-size: 13px;
  cursor: pointer;
  list-style-position: inside;
}

.execution-details summary span {
  color: var(--ink-soft);
  font-weight: 650;
}

.execution-details summary small {
  margin-left: auto;
  color: var(--muted-light);
  font-size: 12px;
}

.agent-run-overview {
  padding: 14px 13px 13px;
  border-top: 1px solid var(--line);
}

.agent-run-head {
  display: flex;
  align-items: center;
}

.agent-run-head {
  justify-content: space-between;
  gap: 12px;
}

.agent-run-head strong {
  display: block;
  font-size: 14px;
}

.agent-run-head > div > small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.agent-status {
  color: var(--muted);
  font-size: 12px;
}

.agent-status.success {
  color: var(--teal);
}

.agent-status.partial,
.agent-status.blocked,
.agent-status.unavailable,
.agent-status.awaiting_approval,
.agent-status.approved_waiting_execution {
  color: var(--amber);
}

.agent-status.rejected {
  color: var(--red);
}

.agent-step-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.agent-step-item {
  min-width: 0;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--line-strong);
  border-radius: 6px;
  background: #fbfcfa;
}

.agent-step-item.success {
  border-left-color: var(--teal);
}

.agent-step-item.denied,
.agent-step-item.unavailable,
.agent-step-item.failed,
.agent-step-item.skipped,
.agent-step-item.pending_confirmation,
.agent-step-item.pending_admin_approval,
.agent-step-item.approved_waiting_execution,
.agent-step-item.cancelled,
.agent-step-item.expired,
.agent-step-item.rejected {
  border-left-color: var(--amber);
}

.agent-step-item > span {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  color: var(--muted);
  font-size: 12px;
}

.agent-step-item > div {
  min-width: 0;
}

.agent-step-item strong,
.agent-step-item small {
  display: block;
}

.agent-step-item strong {
  overflow: hidden;
  color: var(--ink-soft);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-step-item small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.agent-step-item > small {
  margin-top: 0;
  white-space: nowrap;
}

.agent-action-card {
  margin-top: 12px;
  padding: 12px;
  border: 1px solid #d7c38d;
  border-left: 4px solid var(--amber);
  border-radius: 7px;
  background: #fffdf7;
}

.permission-request-quick-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 14px;
  padding: 14px 16px;
  border: 1px solid #cad8d2;
  border-left: 4px solid var(--teal);
  border-radius: 7px;
  background: #f7fbf9;
}

.permission-request-quick-action > div:first-child {
  min-width: 0;
}

.permission-request-quick-action small,
.permission-request-quick-action strong,
.permission-request-quick-action span {
  display: block;
}

.permission-request-quick-action small,
.permission-request-quick-action span {
  color: var(--muted);
  font-size: 13px;
}

.permission-request-quick-action strong {
  margin: 3px 0;
  color: var(--ink);
  font-size: 15px;
}

.permission-request-quick-action > div:last-child {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
}

.permission-request-quick-action button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--surface);
  color: var(--ink);
  font: inherit;
  cursor: pointer;
}

.permission-request-quick-action button.primary {
  border-color: var(--ink);
  background: var(--ink);
  color: #fff;
}

.permission-request-quick-action button svg {
  width: 16px;
  height: 16px;
}

@media (max-width: 760px) {
  .permission-request-quick-action {
    align-items: stretch;
    flex-direction: column;
  }

  .permission-request-quick-action > div:last-child {
    width: 100%;
  }

  .permission-request-quick-action button {
    flex: 1 1 0;
  }
}

.agent-action-card.succeeded {
  border-color: #a8cabc;
  border-left-color: var(--teal);
  background: #f7fcfa;
}

.agent-action-card.approved_waiting_execution {
  border-color: #b7c9dc;
  border-left-color: var(--blue);
  background: #f7faff;
}

.agent-action-card.cancelled,
.agent-action-card.expired,
.agent-action-card.failed {
  border-color: var(--line);
  border-left-color: var(--muted-light);
  background: var(--surface-soft);
}

.agent-action-card.rejected {
  border-color: #d9a9a0;
  border-left-color: var(--red);
  background: #fff8f6;
}

.agent-action-head,
.agent-action-buttons {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.agent-action-head > div {
  min-width: 0;
}

.agent-action-head small,
.agent-action-head strong {
  display: block;
}

.agent-action-head small {
  color: var(--muted);
  font-size: 12px;
}

.agent-action-head strong {
  margin-top: 2px;
  color: var(--ink);
  font-size: 13px;
}

.agent-action-head > span {
  flex: 0 0 auto;
  color: #8a6115;
  font-size: 12px;
}

.agent-action-card.succeeded .agent-action-head > span {
  color: var(--teal);
}

.agent-action-rows {
  display: grid;
  gap: 0;
  margin-top: 10px;
  border-top: 1px solid var(--line);
}

.agent-action-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(88px, 0.35fr) minmax(0, 1fr);
  gap: 12px;
  padding: 7px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}

.agent-action-row span {
  color: var(--muted);
}

.agent-action-row strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--ink-soft);
  font-weight: 600;
}

.agent-action-result,
.agent-action-message,
.agent-action-approval {
  margin: 9px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.agent-action-approval {
  padding-top: 8px;
  border-top: 1px solid var(--line);
  color: #8a6115;
}

.agent-action-message:empty {
  display: none;
}

.agent-action-buttons {
  justify-content: flex-start;
  margin-top: 10px;
}

.agent-action-buttons button {
  min-height: 32px;
  padding: 6px 11px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--ink-soft);
  background: var(--surface);
  font-size: 13px;
}

.agent-action-buttons button.primary {
  border-color: #252823;
  color: #ffffff;
  background: #252823;
}

.agent-action-buttons button:disabled {
  cursor: wait;
  opacity: 0.55;
}

.tool-call,
.api-call {
  margin-top: 8px;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-left-width: 3px;
  border-radius: 6px;
  color: var(--ink-soft);
  background: var(--surface-soft);
  font-size: 13px;
  line-height: 1.5;
}

.execution-event-list {
  padding: 0 13px 13px;
  border-top: 1px solid var(--line);
}

.execution-event-list > strong {
  display: block;
  padding-top: 12px;
  color: var(--ink-soft);
  font-size: 13px;
}

.execution-event-list .tool-call {
  position: relative;
  margin-top: 0;
  padding: 9px 0 9px 18px;
  border: 0;
  border-radius: 0;
  color: var(--muted);
  background: transparent;
}

.execution-event-list .tool-call::before {
  position: absolute;
  top: 14px;
  left: 2px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--teal);
  content: "";
}

.technical-trace {
  border-top: 1px solid var(--line);
}

.technical-trace > summary {
  padding: 10px 13px;
  font-size: 12px;
}

.technical-trace .api-call {
  margin: 0 13px 10px;
}

.tool-call {
  border-left-color: var(--blue);
}

.api-call {
  border-left-color: var(--teal);
}

.api-call strong,
.api-call span {
  display: block;
}

.api-call span {
  margin-top: 3px;
  color: var(--muted);
}

/* Context inspector */
.inspector {
  min-width: 0;
  min-height: 0;
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 14px;
  overflow: auto;
  border-left: 1px solid var(--line);
  background: #f0f2ee;
  scrollbar-width: thin;
  scrollbar-color: var(--line-strong) transparent;
}

.inspector-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 2px 2px 7px;
}

.inspector-head span,
.inspector-head strong {
  display: block;
}

.inspector-head span {
  color: var(--muted);
  font-size: 12px;
}

.inspector-head strong {
  margin-top: 2px;
  font-size: 13px;
}

.inspector-head .lucide {
  width: 17px;
  height: 17px;
  color: var(--muted);
}

.panel,
.result-card {
  min-width: 0;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}

.panel-heading,
.section-heading {
  display: flex;
  align-items: center;
  gap: 10px;
}

.panel-icon {
  width: 32px;
  height: 32px;
  flex: 0 0 auto;
}

.panel-heading > div:last-child,
.section-heading > div:last-child {
  min-width: 0;
}

.panel-heading span {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.panel-title {
  color: var(--ink);
  font-size: 12px;
  font-weight: 750;
}

.scope-list {
  margin-top: 12px;
}

.scope-list span,
.tag {
  padding: 5px 8px;
  border-radius: 999px;
  font-size: 12px;
}

.scope-list span {
  border: 1px solid #cfe2dc;
  color: #176f60;
  background: var(--teal-soft);
}

.compact-list {
  list-style: none;
  padding: 0;
  margin: 10px 0 0;
  display: grid;
  gap: 7px;
}

.compact-list li {
  position: relative;
  padding-left: 16px;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.55;
}

.compact-list li::before {
  position: absolute;
  top: 7px;
  left: 1px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  content: "";
  background: #d3a935;
}

.compact-list.tools li::before {
  background: var(--teal);
}

.compact-list.rules li::before {
  border-radius: 2px;
  background: var(--blue);
}

.context-panel > summary,
.side-disclosure > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.context-panel[open] > summary,
.side-disclosure[open] > summary {
  padding-bottom: 9px;
  border-bottom: 1px solid var(--line);
}

.empty-state {
  min-height: 152px;
  display: grid;
  place-content: center;
  justify-items: center;
  padding: 12px;
  color: var(--muted);
  text-align: center;
}

.empty-icon {
  width: 36px;
  height: 36px;
  margin-bottom: 9px;
  color: var(--blue);
  background: var(--blue-soft);
}

.empty-state h3 {
  margin: 0;
  color: var(--ink);
  font-size: 13px;
}

.empty-state p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.result-card h3 {
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
}

.tag-row {
  margin: 10px 0;
}

.tag {
  color: var(--teal);
  background: var(--teal-soft);
}

.tag.warn {
  color: var(--amber);
  background: var(--amber-soft);
}

.tag.danger {
  color: var(--red);
  background: var(--red-soft);
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin: 10px 0;
}

.metric {
  min-width: 0;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.metric span,
.metric strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.metric span {
  color: var(--muted);
  font-size: 12px;
}

.metric strong {
  margin-top: 4px;
  font-size: 16px;
}

.result-table {
  width: 100%;
  display: block;
  margin: 10px 0;
  overflow-x: auto;
  border-collapse: collapse;
  font-size: 12px;
}

.result-table thead,
.result-table tbody {
  display: table;
  width: 100%;
}

.result-table th,
.result-table td {
  padding: 7px 5px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  white-space: nowrap;
}

.result-table th {
  color: var(--muted);
  font-weight: 650;
}

.action-box {
  padding: 9px 10px;
  border: 1px solid #cfe3d6;
  border-radius: 7px;
  color: #28553a;
  background: var(--green-soft);
  font-size: 12px;
  line-height: 1.55;
}

.trace-list,
.audit-log {
  max-height: 260px;
  display: grid;
  gap: 7px;
  overflow: auto;
  font-size: 12px;
}

.feishu-card {
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #dce3ef;
  border-radius: 7px;
  background: #f6f8fc;
}

.feishu-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.feishu-head span {
  color: #315ba8;
  font-size: 13px;
  font-weight: 700;
}

.feishu-head small,
.feishu-card p {
  color: var(--muted);
  font-size: 12px;
}

.feishu-card p {
  margin: 0;
  line-height: 1.55;
}

.audit-item,
.sync-item {
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
}

.audit-item strong,
.audit-item span,
.sync-item strong,
.sync-item span {
  display: block;
}

.audit-item strong,
.sync-item strong {
  color: var(--ink);
}

.audit-item span,
.sync-item span {
  margin-top: 3px;
  color: var(--muted);
  line-height: 1.45;
}

.muted-empty {
  padding: 14px 0;
  color: var(--muted-light);
  text-align: center;
  font-size: 12px;
}

/* Admin */
.admin-layout {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(560px, 1fr) 300px;
  gap: 24px;
  padding: 28px;
  overflow: auto;
  align-items: start;
}

.admin-layout:not([data-target="matrix"]) {
  grid-template-columns: minmax(0, 1fr);
}

.admin-main,
.admin-side {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 20px;
}

.admin-side {
  position: sticky;
  top: 0;
}

.admin-overview {
  min-width: 0;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: 6px 2px 4px;
}

.admin-layout[data-target="provision"] .admin-overview {
  display: none;
}

.admin-overview-copy {
  min-width: 0;
}

.admin-overview .eyebrow {
  color: var(--blue);
}

.admin-overview h3 {
  margin: 7px 0 5px;
  font-size: 23px;
  line-height: 1.25;
}

.admin-overview p {
  max-width: 660px;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.admin-stats {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(74px, auto));
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: var(--surface);
}

.admin-stat {
  min-width: 76px;
  padding: 9px 11px;
  border-right: 1px solid var(--line);
}

.admin-stat:last-child {
  border-right: 0;
}

.admin-stat small,
.admin-stat b {
  display: block;
  white-space: nowrap;
}

.admin-stat small {
  color: var(--muted);
  font-size: 12px;
}

.system-overview-panel {
  overflow: hidden;
}

.system-overview-heading {
  min-height: 76px;
  padding: 18px 22px;
  border-bottom: 1px solid var(--line);
}

.system-overview-heading .panel-title {
  font-size: 17px;
}

.system-overview-heading p {
  margin-top: 4px;
  font-size: 13px;
}

.system-status-band {
  min-height: 116px;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 22px;
  border-bottom: 1px solid var(--line);
  background: #f5f7f4;
}

.system-status-band.ready {
  background: #edf7f3;
}

.system-status-band.attention {
  background: #fff7e7;
}

.system-status-mark {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  color: #996613;
  background: #ffedc8;
}

.system-status-band.ready .system-status-mark {
  color: #08755f;
  background: #d8eee6;
}

.system-status-mark .lucide {
  width: 24px;
  height: 24px;
}

.system-status-band > div:nth-child(2) {
  min-width: 0;
}

.system-status-band > div:nth-child(2) > span,
.system-status-band strong,
.system-status-band p {
  display: block;
}

.system-status-band > div:nth-child(2) > span {
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.system-status-band strong {
  color: var(--ink);
  font-size: 21px;
  line-height: 1.3;
}

.system-status-band p {
  margin: 6px 0 0;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.6;
}

.system-overview-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--line);
}

.system-overview-metrics > div {
  min-width: 0;
  padding: 18px 22px;
  border-right: 1px solid var(--line);
}

.system-overview-metrics > div:last-child {
  border-right: 0;
}

.system-overview-metrics span,
.system-overview-metrics strong,
.system-overview-metrics small {
  display: block;
}

.system-overview-metrics span {
  color: var(--muted);
  font-size: 13px;
}

.system-overview-metrics strong {
  margin: 7px 0 4px;
  color: var(--ink);
  font-size: 25px;
  line-height: 1;
}

.system-overview-metrics small {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.system-overview-columns {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
  border-bottom: 1px solid var(--line);
}

.system-overview-section {
  min-width: 0;
  padding: 22px;
}

.system-overview-columns .system-overview-section + .system-overview-section {
  border-left: 1px solid var(--line);
}

.system-overview-section > header {
  min-height: 44px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.system-overview-section > header strong,
.system-overview-section > header span {
  display: block;
}

.system-overview-section > header strong {
  color: var(--ink);
  font-size: 16px;
}

.system-overview-section > header span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.system-priority-list,
.system-capability-list {
  display: grid;
}

.system-priority-item {
  min-width: 0;
  min-height: 62px;
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 11px 0;
  border-top: 1px solid var(--line);
}

.system-priority-item:first-child {
  border-top: 0;
}

.system-priority-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #d49625;
}

.system-priority-item.high .system-priority-dot {
  background: #c94b3c;
}

.system-priority-item div,
.system-priority-item strong,
.system-priority-item span {
  min-width: 0;
}

.system-priority-item strong,
.system-priority-item span {
  display: block;
}

.system-priority-item strong {
  color: var(--ink);
  font-size: 14px;
}

.system-priority-item span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.text-button {
  padding: 5px 0;
  border: 0;
  color: #176f86;
  background: transparent;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}

.text-button:hover {
  color: #0b5368;
}

.system-capability-item {
  min-height: 58px;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 11px;
  padding: 10px 0;
  border-top: 1px solid var(--line);
}

.system-capability-item:first-child {
  border-top: 0;
}

.system-capability-item > .lucide {
  width: 20px;
  height: 20px;
  color: #b97916;
}

.system-capability-item.passed > .lucide {
  color: #08755f;
}

.system-capability-item strong,
.system-capability-item span {
  display: block;
}

.system-capability-item strong {
  font-size: 14px;
}

.system-capability-item span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.platform-health-section {
  border-bottom: 1px solid var(--line);
}

.system-platform-health {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
}

.system-platform-row {
  min-width: 0;
  min-height: 76px;
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 13px 14px;
  border-bottom: 1px solid var(--line);
}

.system-platform-row:nth-child(odd) {
  border-right: 1px solid var(--line);
}

.system-platform-indicator {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #a9b2ad;
}

.system-platform-row.healthy .system-platform-indicator {
  background: #139476;
}

.system-platform-row.stale .system-platform-indicator,
.system-platform-row.auth_required .system-platform-indicator {
  background: #d49625;
}

.system-platform-row.failed .system-platform-indicator {
  background: #c94b3c;
}

.system-platform-row > div {
  min-width: 0;
}

.system-platform-row strong,
.system-platform-row span,
.system-platform-row b,
.system-platform-row small {
  display: block;
}

.system-platform-row strong {
  font-size: 14px;
}

.system-platform-row span,
.system-platform-row small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.system-platform-row > div:last-child {
  text-align: right;
}

.system-platform-row b {
  color: var(--ink-soft);
  font-size: 13px;
}

.system-quick-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.system-quick-actions button {
  min-width: 0;
  min-height: 66px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 12px;
  border: 0;
  border-right: 1px solid var(--line);
  color: var(--ink-soft);
  background: var(--surface);
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

.system-quick-actions button:last-child {
  border-right: 0;
}

.system-quick-actions button:hover {
  color: var(--teal);
  background: #f3f8f5;
}

.system-quick-actions .lucide {
  width: 18px;
  height: 18px;
}

.system-overview-empty {
  min-height: 112px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  color: var(--muted);
  font-size: 13px;
  text-align: center;
}

.system-overview-empty .lucide {
  width: 24px;
  height: 24px;
  color: var(--teal);
}

.sync-center-tabs {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 10px 18px;
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
  background: #f7f8f6;
}

.sync-center-tabs button {
  flex: 0 0 auto;
  min-height: 34px;
  padding: 7px 12px;
  border: 0;
  border-radius: 5px;
  color: var(--muted);
  background: transparent;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.sync-center-tabs button:hover {
  color: var(--ink);
  background: #edf0ec;
}

.sync-center-tabs button.active {
  color: #ffffff;
  background: #252823;
}

.admin-stat b {
  margin-top: 3px;
  font-size: 14px;
}

.admin-stat.source b {
  color: var(--teal);
}

.provision-panel,
.matrix-panel {
  padding: 22px;
}

.provision-panel.is-platform-detail .provision-hub-toolbar {
  display: none;
}

.admin-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 20px;
}

.section-icon {
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
}

.section-heading .panel-title {
  font-size: 16px;
}

.admin-toolbar p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}

.safety-badge {
  min-height: 32px;
  padding: 0 11px;
  border: 1px solid #eed4ae;
  border-radius: 999px;
  color: var(--amber);
  background: var(--amber-soft);
  font-size: 13px;
}

.safety-badge .lucide {
  width: 13px;
  height: 13px;
}

.provision-hub-actions,
.provision-platform-card-open,
.provision-platform-card-title,
.provision-platform-card-metrics,
.provision-platform-card-footer,
.platform-write-switch,
.provision-support-details > summary,
.provision-platform-context {
  display: flex;
  align-items: center;
}

.provision-hub-actions {
  gap: 12px;
}

.provision-hub-actions .primary-button {
  min-height: 38px;
  padding: 0 16px;
}

.provision-hub-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--surface-soft);
}

.provision-hub-summary > div {
  min-width: 0;
  padding: 14px 16px;
  border-right: 1px solid var(--line);
}

.provision-hub-summary > div:last-child {
  border-right: 0;
}

.provision-hub-summary span,
.provision-hub-summary strong {
  display: block;
}

.provision-hub-summary span {
  color: var(--muted);
  font-size: 13px;
}

.provision-hub-summary strong {
  margin-top: 4px;
  color: var(--ink);
  font-size: 19px;
}

.provision-platform-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}

.provision-platform-card {
  width: 100%;
  min-width: 0;
  min-height: 154px;
  display: flex;
  align-items: stretch;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--ink);
  background: var(--surface);
  text-align: left;
  box-shadow: var(--shadow-sm);
}

.provision-platform-card:hover,
.provision-platform-card:focus-within {
  border-color: var(--line-strong);
}

.provision-platform-card-open {
  width: 100%;
  min-width: 0;
  flex: 1;
  gap: 14px;
  padding: 16px;
  border: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.provision-platform-card-open:hover {
  background: var(--surface-soft);
}

.provision-platform-card-open:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: -2px;
}

.provision-platform-card-open > .lucide {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
  color: var(--muted-light);
}

.provision-platform-card-icon,
.provision-platform-detail-icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 7px;
}

.provision-platform-card-icon {
  width: 44px;
  height: 44px;
}

.provision-platform-card-icon .lucide,
.provision-platform-detail-icon .lucide {
  width: 19px;
  height: 19px;
}

.provision-platform-card-icon.blue,
.provision-platform-detail-icon.blue {
  color: var(--blue);
  background: var(--blue-soft);
}

.provision-platform-card-icon.teal,
.provision-platform-detail-icon.teal {
  color: var(--teal);
  background: var(--teal-soft);
}

.provision-platform-card-icon.amber,
.provision-platform-detail-icon.amber {
  color: var(--amber);
  background: var(--amber-soft);
}

.provision-platform-card-icon.green,
.provision-platform-detail-icon.green {
  color: var(--green);
  background: var(--green-soft);
}

.provision-platform-card-icon.rose,
.provision-platform-detail-icon.rose {
  color: var(--coral);
  background: var(--coral-soft);
}

.provision-platform-card-icon.gray,
.provision-platform-detail-icon.gray {
  color: var(--ink-soft);
  background: var(--surface-strong);
}

.provision-platform-card-copy {
  min-width: 0;
  flex: 1;
  display: block;
}

.provision-platform-card-title {
  min-width: 0;
  justify-content: space-between;
  gap: 8px;
}

.provision-platform-card-copy strong,
.provision-platform-card-copy > span,
.provision-platform-card-copy > small {
  display: block;
}

.provision-platform-card-copy strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.provision-platform-card-copy > span:not(.provision-platform-card-title) {
  margin-top: 6px;
  color: var(--ink-soft);
  font-size: 13px;
}

.provision-platform-card-copy > small {
  margin-top: 6px;
  overflow: hidden;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.platform-open-status {
  flex: 0 0 auto;
  padding: 5px 9px;
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface-strong);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

.platform-open-status.connected {
  color: var(--teal);
  background: var(--teal-soft);
}

.platform-open-status.running {
  color: var(--blue);
  background: var(--blue-soft);
}

.platform-open-status.attention {
  color: var(--red);
  background: var(--red-soft);
}

.platform-open-status.pending {
  color: var(--amber);
  background: var(--amber-soft);
}

.provision-platform-card-metrics {
  min-width: 0;
  flex: 1;
  gap: 12px;
  color: var(--muted);
  font-size: 13px;
  white-space: nowrap;
}

.provision-platform-card-metrics b {
  color: var(--ink);
  font-size: 13px;
}

.provision-platform-card-footer {
  min-height: 48px;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 14px;
  border-top: 1px solid var(--line);
  background: #fafbfa;
}

.provision-platform-write-actions {
  min-width: 0;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 9px;
}

.provision-card-open-button {
  width: 32px;
  height: 32px;
}

.provision-card-open-button .lucide {
  width: 16px;
  height: 16px;
}

.platform-write-config-button,
.platform-sync-config-button {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0 10px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--ink-soft);
  background: var(--surface);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.platform-write-config-button:hover,
.platform-sync-config-button:hover {
  border-color: var(--teal);
  color: var(--teal);
}

.platform-sync-config-button {
  border-color: var(--teal);
  color: var(--teal);
  background: var(--teal-soft);
}

.platform-write-config-button .lucide,
.platform-sync-config-button .lucide {
  width: 14px;
  height: 14px;
}

.platform-write-switch {
  position: relative;
  min-height: 28px;
  flex: 0 0 auto;
  gap: 8px;
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  user-select: none;
}

.platform-write-switch input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.platform-write-switch-track {
  position: relative;
  width: 36px;
  height: 20px;
  flex: 0 0 auto;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--surface-strong);
  transition: border-color 160ms ease, background 160ms ease;
}

.platform-write-switch-track::after {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgb(28 35 30 / 22%);
  content: "";
  transition: transform 160ms ease;
}

.platform-write-switch input:checked + .platform-write-switch-track {
  border-color: var(--teal);
  background: var(--teal);
}

.platform-write-switch input:checked + .platform-write-switch-track::after {
  transform: translateX(16px);
}

.platform-write-switch input:focus-visible + .platform-write-switch-track {
  outline: 3px solid var(--teal-soft);
  outline-offset: 2px;
}

.platform-write-switch.unavailable {
  color: var(--muted-light);
  cursor: not-allowed;
}

.platform-write-switch.unavailable .platform-write-switch-track {
  opacity: 0.55;
}

.platform-write-switch-message {
  min-height: 36px;
  display: flex;
  align-items: center;
  margin-top: 10px;
  padding: 7px 10px;
  border-radius: 6px;
  color: var(--ink-soft);
  background: var(--surface-soft);
  font-size: 12px;
}

.platform-write-switch-message.loading {
  color: var(--blue);
  background: var(--blue-soft);
}

.platform-write-switch-message.success {
  color: var(--teal);
  background: var(--teal-soft);
}

.platform-write-switch-message.error {
  color: var(--red);
  background: var(--red-soft);
}

.provision-support-details {
  margin-top: 20px;
  border-top: 1px solid var(--line);
}

.provision-support-details > summary {
  justify-content: space-between;
  gap: 12px;
  min-height: 48px;
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 700;
  list-style: none;
}

.provision-support-details > summary::-webkit-details-marker {
  display: none;
}

.provision-support-details > summary > span:first-child {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.provision-support-details > summary .lucide {
  width: 14px;
  height: 14px;
  color: var(--muted);
}

.provision-support-summary {
  color: var(--muted);
  font-size: 13px;
  font-weight: 500;
}

.provision-support-body {
  padding-bottom: 4px;
  border-top: 1px solid var(--line);
}

.provision-support-body .test-subject-lab {
  margin: 0;
  padding-top: 13px;
  border-top: 0;
}

.provision-support-body .workbench-users-section {
  margin-top: 0;
}

.provision-platform-context {
  min-width: 0;
  min-height: 48px;
  gap: 10px;
  padding: 0 0 10px;
  border-bottom: 1px solid var(--line);
}

.provision-back-button {
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  justify-content: center;
}

.provision-platform-detail-icon {
  width: 36px;
  height: 36px;
}

.provision-platform-detail-copy {
  min-width: 0;
  flex: 1;
}

.provision-platform-detail-copy strong {
  display: block;
}

.provision-platform-detail-copy strong {
  color: var(--ink);
  font-size: 15px;
}

.provision-detail-tabs {
  display: flex;
  gap: 6px;
  margin-top: 8px;
  border-bottom: 1px solid var(--line);
}

.provision-detail-tabs button {
  min-width: 190px;
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 14px;
  border: 0;
  border-bottom: 3px solid transparent;
  color: var(--muted);
  background: transparent;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
}

.provision-detail-tabs button:hover {
  color: var(--ink-soft);
  background: var(--surface-soft);
}

.provision-detail-tabs button[aria-selected="true"] {
  border-bottom-color: var(--teal);
  color: var(--teal);
  background: #f4faf7;
}

.provision-detail-tabs button .lucide {
  width: 17px;
  height: 17px;
}

.provision-detail-tabs button small {
  margin-left: auto;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.provision-context-details {
  margin-top: 2px;
  border-bottom: 1px solid var(--line);
  background: #fafbfa;
}

.provision-context-details > summary {
  min-height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 9px 14px;
  color: var(--ink-soft);
  list-style: none;
}

.provision-context-details > summary::-webkit-details-marker {
  display: none;
}

.provision-context-details > summary:hover {
  background: #f3f6f4;
}

.provision-context-summary-copy {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.provision-context-summary-copy > .lucide {
  width: 17px;
  height: 17px;
  color: var(--blue);
}

.provision-context-summary-copy > span,
.provision-context-summary-copy strong,
.provision-context-summary-copy small {
  min-width: 0;
  display: block;
}

.provision-context-summary-copy strong {
  color: var(--ink-soft);
  font-size: 14px;
}

.provision-context-summary-copy small {
  margin-top: 3px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.provision-context-chevron {
  width: 17px;
  height: 17px;
  color: var(--muted);
  transition: transform 160ms ease;
}

.provision-context-details[open] .provision-context-chevron {
  transform: rotate(90deg);
}

.provision-context-body {
  padding: 0 42px 14px;
}

.provision-context-body p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.65;
}

.platform-account-catalog {
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.platform-account-catalog-tools,
.platform-account-filter-group,
.platform-account-status-filters,
.platform-account-source-filter,
.platform-account-search,
.platform-account-catalog-foot,
.platform-account-catalog-foot > div {
  display: flex;
  align-items: center;
}

.platform-account-catalog-tools {
  justify-content: space-between;
  gap: 18px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
}

.platform-account-filter-group {
  gap: 10px;
}

.platform-account-status-filters {
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
}

.platform-account-status-filters button {
  min-width: 66px;
  height: 34px;
  padding: 0 12px;
  border: 0;
  border-radius: 4px;
  color: var(--muted);
  background: transparent;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

.platform-account-status-filters button:hover {
  color: var(--ink);
}

.platform-account-status-filters button[aria-selected="true"] {
  color: var(--teal);
  background: var(--surface);
  box-shadow: 0 1px 3px rgb(19 36 31 / 12%);
}

.platform-account-source-filter select {
  height: 42px;
  min-width: 132px;
  padding: 0 34px 0 12px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  outline: none;
  color: var(--ink-soft);
  background: var(--surface);
  font: inherit;
  font-size: 14px;
  font-weight: 650;
}

.platform-account-source-filter select:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(8, 127, 106, 0.1);
}

.platform-account-search {
  position: relative;
  width: min(420px, 48%);
}

.platform-account-search .lucide {
  position: absolute;
  left: 13px;
  width: 17px;
  height: 17px;
  color: var(--muted-light);
  pointer-events: none;
}

.platform-account-search input {
  width: 100%;
  height: 42px;
  padding: 0 14px 0 40px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  outline: none;
  color: var(--ink);
  background: var(--surface);
  font: inherit;
  font-size: 14px;
}

.platform-account-search input:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(8, 127, 106, 0.1);
}

.platform-account-summary {
  min-height: 42px;
  padding: 11px 18px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  background: #fafbfa;
  font-size: 13px;
  line-height: 1.5;
}

.platform-account-list {
  overflow-x: auto;
}

.platform-account-list-head,
.platform-account-row {
  min-width: 860px;
  display: grid;
  grid-template-columns: minmax(230px, 1.15fr) minmax(180px, 0.9fr) minmax(260px, 1.3fr) 150px;
  gap: 18px;
  align-items: center;
}

.platform-account-list-head {
  min-height: 36px;
  padding: 0 18px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 12px;
  font-weight: 700;
}

.platform-account-row {
  min-height: 72px;
  padding: 11px 18px;
  border-bottom: 1px solid var(--line);
}

.platform-account-row:last-child {
  border-bottom: 0;
}

.platform-account-row:hover {
  background: #fbfcfb;
}

.platform-account-row.assistant-selected {
  box-shadow: inset 3px 0 0 var(--teal);
  background: #f3faf7;
}

.platform-account-person,
.platform-account-person strong,
.platform-account-person span {
  min-width: 0;
}

.platform-account-person strong,
.platform-account-person span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.platform-account-person strong {
  color: var(--ink);
  font-size: 14px;
}

.platform-account-person span {
  margin-top: 5px;
  color: var(--muted);
  font-size: 13px;
}

.platform-account-roles,
.platform-account-organizations {
  overflow: hidden;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.55;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.platform-account-organizations {
  color: var(--muted);
}

.platform-account-no-role {
  color: var(--amber);
}

.platform-account-state {
  display: flex;
  align-items: center;
  flex-flow: row wrap;
  gap: 6px;
}

.platform-account-source-pill,
.platform-account-state-pill {
  min-width: 58px;
  padding: 4px 8px;
  border-radius: 999px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
}

.platform-account-source-pill.crm_sync {
  color: #3d5f8f;
  background: #edf3ff;
}

.platform-account-source-pill.manual {
  color: #9b6711;
  background: #fff4dd;
}

.platform-account-source-pill.unknown {
  color: var(--muted);
  background: var(--surface-strong);
}

.platform-account-state-pill.enabled {
  color: var(--teal);
  background: var(--teal-soft);
}

.platform-account-state-pill.disabled {
  color: var(--muted);
  background: var(--surface-strong);
}

.platform-account-state small {
  color: var(--amber);
  font-size: 12px;
  white-space: nowrap;
}

.platform-account-agent-button {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--teal);
  background: var(--surface);
  cursor: pointer;
}

.platform-account-agent-button:hover {
  border-color: var(--teal);
  background: var(--teal-soft);
}

.platform-account-agent-button .lucide {
  width: 16px;
  height: 16px;
}

.platform-account-catalog-foot {
  min-height: 50px;
  justify-content: space-between;
  gap: 16px;
  padding: 8px 18px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  background: #fafbfa;
  font-size: 13px;
}

.platform-account-catalog-foot > div {
  gap: 12px;
}

.provision-platform-detail .crm-automation {
  margin: 20px 0 0;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.provision-platform-detail .crm-role-catalog {
  margin-top: 20px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.crm-role-catalog-head,
.crm-role-catalog-title,
.crm-role-search,
.crm-role-catalog-foot {
  display: flex;
  align-items: center;
}

.crm-role-catalog-head {
  justify-content: flex-end;
  gap: 12px;
  padding: 10px 20px;
  border-bottom: 1px solid var(--line);
}

.crm-role-catalog-title {
  min-width: 0;
  gap: 12px;
}

.crm-role-catalog-title .section-icon {
  width: 42px;
  height: 42px;
  color: #397452;
  background: #e8f4ec;
}

.crm-role-catalog-title > div {
  min-width: 0;
}

.crm-role-catalog-title strong,
.crm-role-catalog-title span {
  display: block;
}

.crm-role-catalog-title strong {
  color: var(--ink);
  font-size: 16px;
}

.crm-role-catalog-title span {
  margin-top: 4px;
  overflow: hidden;
  color: var(--muted);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.crm-role-search {
  position: relative;
  width: min(320px, 38%);
  flex: 0 0 auto;
}

.crm-role-search .lucide {
  position: absolute;
  left: 13px;
  width: 17px;
  height: 17px;
  color: var(--muted-light);
  pointer-events: none;
}

.crm-role-search input {
  width: 100%;
  height: 42px;
  padding: 0 13px 0 40px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  outline: none;
  color: var(--ink);
  background: var(--surface);
  font: inherit;
  font-size: 14px;
}

.crm-role-search input:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(8, 127, 106, 0.1);
}

.crm-role-catalog-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-bottom: 1px solid var(--line);
  background: #fafbfa;
}

.crm-role-catalog-metrics > div {
  min-width: 0;
  padding: 14px 18px;
  border-right: 1px solid var(--line);
}

.crm-role-catalog-metrics > div:last-child {
  border-right: 0;
}

.crm-role-catalog-metrics strong,
.crm-role-catalog-metrics span {
  display: block;
}

.crm-role-catalog-metrics strong {
  color: var(--ink);
  font-size: 18px;
}

.crm-role-catalog-metrics span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
}

.crm-role-departments {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  overflow-x: auto;
  padding: 12px 18px;
  border-bottom: 1px solid var(--line);
  scrollbar-width: thin;
}

.crm-role-departments button {
  min-height: 34px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 11px;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--muted);
  background: transparent;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}

.crm-role-departments button:hover {
  color: var(--ink-soft);
  background: var(--surface-soft);
}

.crm-role-departments button[aria-selected="true"] {
  border-color: #bcdad2;
  color: var(--teal);
  background: var(--teal-soft);
  font-weight: 700;
}

.crm-role-departments b {
  min-width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: inherit;
  background: rgb(255 255 255 / 70%);
  font-size: 12px;
}

.crm-role-list {
  overflow: hidden;
}

.crm-role-list-head,
.crm-role-row {
  min-width: 720px;
  display: grid;
  grid-template-columns: minmax(180px, 1.1fr) minmax(150px, 0.9fr) minmax(280px, 1.8fr) 86px;
  gap: 14px;
  align-items: center;
}

.crm-role-list-head {
  position: sticky;
  z-index: 1;
  top: 0;
  min-height: 30px;
  padding: 0 14px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  background: #fafbfa;
  font-size: 12px;
  font-weight: 700;
}

.crm-role-row {
  min-height: 52px;
  padding: 8px 14px;
  border-bottom: 1px solid var(--line);
}

.crm-role-row:last-child {
  border-bottom: 0;
}

.crm-role-row:hover {
  background: #fbfcfb;
}

.crm-role-name,
.crm-role-name strong,
.crm-role-name span {
  min-width: 0;
}

.crm-role-name strong,
.crm-role-name span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.crm-role-name strong {
  color: var(--ink);
  font-size: 12px;
}

.crm-role-name span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.crm-role-department-label {
  overflow: hidden;
  color: var(--ink-soft);
  font-size: 12px;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.crm-role-scope {
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.crm-role-scope small {
  margin-left: 5px;
  color: var(--teal);
  font-size: 12px;
}

.crm-role-account-count {
  text-align: right;
  white-space: nowrap;
}

.crm-role-account-count strong {
  color: var(--teal);
  font-size: 13px;
}

.crm-role-account-count small {
  color: var(--muted);
  font-size: 12px;
}

.crm-role-catalog-foot {
  justify-content: space-between;
  gap: 12px;
  min-height: 44px;
  padding: 0 18px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  background: #fafbfa;
  font-size: 13px;
}

.crm-permission-browser {
  height: clamp(600px, 66vh, 780px);
  display: grid;
  grid-template-columns: minmax(190px, 0.64fr) minmax(275px, 0.92fr) minmax(360px, 1.7fr);
  background: var(--surface);
}

.crm-campus-pane,
.crm-person-pane,
.crm-person-detail {
  min-width: 0;
  min-height: 0;
}

.crm-campus-pane,
.crm-person-pane {
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--line);
  background: #fbfcfb;
}

.crm-person-pane {
  background: var(--surface);
}

.crm-pane-heading {
  min-height: 50px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 16px;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
}

.crm-pane-heading strong {
  font-size: 15px;
}

.crm-pane-heading span {
  color: var(--muted);
  font-size: 13px;
}

.crm-campus-options,
.crm-person-options,
.crm-person-detail {
  overflow: auto;
}

.crm-campus-options button,
.crm-person-button {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--line);
  color: var(--ink-soft);
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.crm-campus-options button {
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 16px;
  font-size: 14px;
}

.crm-campus-options button:hover,
.crm-person-button:hover {
  background: #f3f7f5;
}

.crm-campus-options button[aria-pressed="true"] {
  color: var(--teal);
  background: var(--teal-soft);
  font-weight: 700;
}

.crm-campus-options b {
  min-width: 30px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
  text-align: right;
}

.crm-campus-filter-label {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.crm-campus-status-dot {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #d19120;
}

.crm-campus-options button.is-status-filter {
  background: #fffaf0;
}

.crm-campus-options button.is-disabled-no-role {
  background: #fbf5f5;
}

.crm-campus-options button.is-disabled-no-role .crm-campus-status-dot {
  background: #a85a5a;
}

.crm-campus-options button.is-enabled-no-role[aria-pressed="true"] {
  color: #94620d;
  background: #fff2d8;
}

.crm-campus-options button.is-disabled-no-role[aria-pressed="true"] {
  color: #9a4747;
  background: #fae8e8;
}

.crm-person-button {
  min-height: 76px;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 11px 14px;
}

.crm-person-button[aria-pressed="true"] {
  box-shadow: inset 3px 0 0 var(--teal);
  background: #eef8f4;
}

.crm-person-avatar,
.crm-person-detail-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #176b59;
  background: #dff1ea;
  font-weight: 800;
}

.crm-person-avatar {
  width: 40px;
  height: 40px;
  border-radius: 6px;
  font-size: 15px;
}

.crm-person-button-copy,
.crm-person-button-copy strong,
.crm-person-button-copy small {
  min-width: 0;
  display: block;
}

.crm-person-button-copy strong,
.crm-person-button-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.crm-person-button-copy strong {
  color: var(--ink);
  font-size: 14px;
}

.crm-person-button-copy small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 13px;
}

.crm-person-role-count {
  min-width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: var(--teal);
  background: var(--teal-soft);
  font-size: 13px;
  font-weight: 800;
}

.crm-person-role-count.is-empty {
  color: #94620d;
  background: #fff0cf;
}

.crm-person-role-count.is-disabled {
  color: #a34848;
  background: #fbecec;
}

.crm-person-button.is-disabled .crm-person-avatar {
  color: #7c7777;
  background: #ece9e9;
}

.crm-pane-empty,
.crm-person-detail-empty {
  color: var(--muted);
  font-size: 14px;
}

.crm-pane-empty {
  padding: 20px 12px;
  text-align: center;
}

.crm-person-detail {
  background: var(--surface);
}

.crm-person-detail-head {
  position: sticky;
  z-index: 3;
  top: 0;
  min-height: 92px;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 17px 20px;
  border-bottom: 1px solid var(--line);
  background: rgb(255 255 255 / 96%);
  backdrop-filter: blur(8px);
}

.crm-person-detail-avatar {
  width: 52px;
  height: 52px;
  border-radius: 7px;
  font-size: 18px;
}

.crm-person-detail-head > div,
.crm-person-detail-head strong,
.crm-person-detail-head div span {
  min-width: 0;
  display: block;
}

.crm-person-detail-head strong {
  color: var(--ink);
  font-size: 18px;
}

.crm-person-detail-head div span {
  margin-top: 5px;
  color: var(--muted);
  font-size: 13px;
}

.crm-person-state {
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
}

.crm-person-state.active {
  color: var(--teal);
  background: var(--teal-soft);
}

.crm-person-state.disabled {
  color: #a34848;
  background: #fbecec;
}

.crm-person-detail-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-bottom: 1px solid var(--line);
  background: #fafbfa;
}

.crm-person-detail-meta > div {
  min-width: 0;
  padding: 13px 16px;
  border-right: 1px solid var(--line);
}

.crm-person-detail-meta > div:last-child {
  border-right: 0;
}

.crm-person-detail-meta span,
.crm-person-detail-meta strong {
  display: block;
}

.crm-person-detail-meta span {
  color: var(--muted);
  font-size: 12px;
}

.crm-person-detail-meta strong {
  margin-top: 5px;
  overflow: hidden;
  color: var(--ink-soft);
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.crm-person-permissions {
  padding: 0 20px 24px;
}

.crm-person-permissions-heading,
.crm-person-role-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.crm-person-permissions-heading {
  min-height: 62px;
  color: var(--ink);
}

.crm-person-permissions-heading strong {
  font-size: 16px;
}

.crm-person-permissions-heading span {
  color: var(--muted);
  font-size: 13px;
}

.crm-person-permission-tree {
  border-top: 1px solid var(--line);
}

.crm-permission-department-group {
  border-left: 2px solid #d9dfdc;
}

.crm-permission-department-group > summary,
.crm-permission-campus-group > summary {
  list-style: none;
  cursor: pointer;
  user-select: none;
}

.crm-permission-department-group > summary::-webkit-details-marker,
.crm-permission-campus-group > summary::-webkit-details-marker {
  display: none;
}

.crm-permission-department-group + .crm-permission-department-group {
  margin-top: 18px;
}

.crm-permission-department-group.is-current-department {
  border-left-color: var(--teal);
}

.crm-permission-department-head {
  min-height: 56px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto 18px;
  gap: 11px;
  align-items: center;
  padding: 10px 13px;
  background: #f5f7f6;
}

.crm-permission-department-head:hover,
.crm-permission-campus-head:hover {
  background: #eef4f1;
}

.crm-permission-department-head > span {
  padding: 4px 8px;
  border-radius: 4px;
  color: #53615d;
  background: #e7ebe9;
  font-size: 11px;
  font-weight: 700;
}

.crm-permission-department-group.is-current-department .crm-permission-department-head > span {
  color: var(--teal);
  background: var(--teal-soft);
}

.crm-permission-department-head strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.crm-permission-department-head small {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

.crm-permission-campus-tree {
  margin-left: 21px;
  padding-left: 18px;
  border-left: 1px solid #dfe4e1;
}

.crm-permission-department-group[open] > .crm-permission-campus-tree,
.crm-permission-campus-group[open] > .crm-permission-role-list {
  animation: crm-permission-fold-open 160ms ease-out;
}

.crm-permission-campus-group {
  position: relative;
  border-bottom: 1px solid var(--line);
}

.crm-permission-campus-group::before {
  position: absolute;
  top: 29px;
  left: -22px;
  width: 7px;
  height: 7px;
  border: 2px solid #aeb9b5;
  border-radius: 50%;
  background: var(--surface);
  content: "";
}

.crm-permission-campus-group.is-current-campus::before {
  border-color: var(--teal);
  background: var(--teal);
}

.crm-permission-campus-head {
  min-height: 58px;
  display: grid;
  grid-template-columns: 0 minmax(0, 1fr) auto 18px;
  gap: 0 11px;
  align-items: center;
  padding: 10px 11px;
}

.crm-fold-icon {
  width: 16px;
  height: 16px;
  color: #7a8581;
  transition: transform 160ms ease;
}

.crm-permission-department-group[open] > .crm-permission-department-head > .crm-fold-icon,
.crm-permission-campus-group[open] > .crm-permission-campus-head > .crm-fold-icon {
  transform: rotate(90deg);
}

@keyframes crm-permission-fold-open {
  from {
    opacity: 0;
    transform: translateY(-3px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.crm-permission-campus-head > div,
.crm-permission-campus-head strong,
.crm-permission-campus-head div span {
  min-width: 0;
  display: block;
}

.crm-permission-campus-head strong {
  color: var(--ink-soft);
  font-size: 14px;
}

.crm-permission-campus-head div span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.crm-permission-campus-head em {
  padding: 4px 8px;
  border-radius: 999px;
  color: #6d7774;
  background: #eef1f0;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}

.crm-permission-campus-group.is-current-campus {
  background: #f3faf7;
}

.crm-permission-campus-group.is-current-campus .crm-permission-campus-head em {
  color: #087f6a;
  background: #dcefe8;
}

.crm-permission-campus-group.is-current-campus .crm-permission-campus-head strong {
  color: #116f5d;
}

.crm-permission-campus-group.is-other-campus .crm-permission-role-list {
  background: #fcfdfc;
}

.crm-person-role-row {
  min-height: 68px;
  padding: 12px 11px;
  border-top: 1px solid var(--line);
}

.crm-person-role-row.is-current-campus {
  box-shadow: inset 3px 0 0 #60ad99;
  background: #f7fcfa;
}

.crm-person-role-row > div:first-child {
  min-width: 140px;
  flex: 0 1 40%;
}

.crm-person-role-row strong,
.crm-person-role-row div:first-child span {
  display: block;
}

.crm-person-role-row strong {
  color: var(--ink);
  font-size: 14px;
}

.crm-person-role-row div:first-child span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}

.crm-person-scope-list {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 7px;
}

.crm-person-scope-list > span {
  padding: 5px 9px;
  border: 1px solid #d7e8e1;
  border-radius: 5px;
  color: #246c5d;
  background: #f3faf7;
  font-size: 12px;
}

.crm-person-scope-list > span.is-current-scope {
  border-color: #91c9b9;
  color: #076c5a;
  background: #dff2eb;
  font-weight: 700;
}

.crm-person-scope-list > small {
  color: var(--muted);
  font-size: 12px;
}

.crm-person-detail-empty {
  min-height: 260px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  padding: 24px;
  text-align: center;
}

.crm-person-detail-empty strong,
.crm-person-detail-empty span {
  display: block;
}

.crm-person-detail-empty strong {
  color: var(--ink-soft);
  font-size: 14px;
}

.crm-person-detail-empty.compact {
  min-height: 150px;
  border-top: 1px solid var(--line);
}

.crm-campus-options button:focus-visible,
.crm-person-button:focus-visible {
  position: relative;
  z-index: 1;
  outline: 2px solid var(--teal);
  outline-offset: -2px;
}

.test-subject-lab {
  margin-bottom: 16px;
  padding: 12px 0 4px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.test-subject-lab-head,
.test-subject-row-main,
.test-subject-actions,
.test-platform-chips {
  display: flex;
  align-items: center;
}

.test-subject-lab-head {
  justify-content: space-between;
  gap: 12px;
  padding: 0 2px 11px;
}

.test-subject-lab-head strong,
.test-subject-lab-head span,
.test-subject-copy strong,
.test-subject-copy span,
.test-platform-detail-row strong,
.test-platform-detail-row span {
  display: block;
}

.test-subject-lab-head strong {
  color: var(--ink);
  font-size: 13px;
}

.test-subject-lab-head span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.test-subject-list {
  display: grid;
}

.test-subject-row {
  min-width: 0;
  padding: 10px 2px;
  border-top: 1px solid var(--line);
}

.test-subject-row-main {
  min-width: 0;
  gap: 9px;
}

.test-subject-avatar {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 6px;
  color: #315ba8;
  background: var(--blue-soft);
  font-size: 13px;
  font-weight: 750;
}

.test-subject-row.expired .test-subject-avatar,
.test-subject-row.revoked .test-subject-avatar {
  color: var(--muted);
  background: var(--surface-soft);
}

.test-subject-copy {
  min-width: 0;
  flex: 1;
}

.test-subject-copy strong,
.test-subject-copy span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.test-subject-copy strong {
  color: var(--ink);
  font-size: 12px;
}

.test-subject-copy span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.test-subject-progress {
  flex: 0 0 auto;
  color: var(--teal);
  font-size: 12px;
  font-weight: 700;
}

.test-subject-actions {
  flex: 0 0 auto;
  gap: 4px;
}

.test-subject-actions .icon-button {
  width: 29px;
  height: 29px;
}

.test-platform-chips {
  flex-wrap: wrap;
  gap: 5px;
  margin: 8px 0 0 39px;
}

.test-platform-chip {
  min-height: 22px;
  display: inline-flex;
  align-items: center;
  padding: 0 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 12px;
}

.test-platform-chip.completed {
  border-color: #bcdad2;
  color: var(--teal);
  background: var(--teal-soft);
}

.test-platform-chip.failed {
  border-color: #efc8c1;
  color: var(--red);
  background: var(--red-soft);
}

.test-platform-chip.pending {
  border-color: #eed4ae;
  color: var(--amber);
  background: var(--amber-soft);
}

.test-subject-detail {
  margin: 7px 0 0 39px;
}

.test-subject-detail > summary {
  color: var(--muted);
  font-size: 12px;
  cursor: pointer;
}

.test-platform-detail-list {
  display: grid;
  gap: 7px;
  margin-top: 8px;
  padding: 9px 10px;
  border-left: 2px solid var(--line-strong);
  background: var(--surface-soft);
}

.test-platform-detail-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(180px, 0.8fr) minmax(220px, 1.2fr);
  gap: 12px;
}

.test-platform-detail-row strong {
  color: var(--ink-soft);
  font-size: 12px;
}

.test-platform-detail-row span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.test-subject-dialog {
  width: min(720px, calc(100vw - 32px));
}

.test-subject-dialog-copy {
  margin: -3px 0 2px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.test-subject-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
}

.test-subject-platform-fieldset {
  grid-column: auto;
  margin-top: 2px;
}

.test-subject-confirmation {
  min-height: 38px;
  display: flex !important;
  align-items: center;
  flex-direction: row !important;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid #eed4ae;
  border-radius: 6px;
  color: var(--amber);
  background: var(--amber-soft);
}

.test-subject-confirmation input {
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
  margin: 0;
  accent-color: var(--amber);
}

.test-subject-confirmation span {
  font-size: 12px;
  font-weight: 650;
}

.crm-automation {
  margin: 0 -18px 16px;
  padding: 15px 18px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: #f8faf9;
}

.crm-automation-head,
.crm-automation-title,
.crm-automation-actions,
.automation-recent > summary {
  display: flex;
  align-items: center;
}

.crm-automation-head {
  gap: 11px;
}

.crm-automation-title {
  min-width: 0;
  flex: 1;
  gap: 9px;
}

.crm-automation-title > div {
  min-width: 0;
}

.crm-automation-title strong,
.crm-automation-title span {
  display: block;
}

.crm-automation-title strong {
  color: var(--ink);
  font-size: 12px;
}

.crm-automation-title span {
  margin-top: 2px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.automation-state {
  min-width: 58px;
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface);
  font-size: 12px;
  font-weight: 700;
  text-align: center;
}

.automation-state.ready,
.automation-state.succeeded {
  border-color: #b9d9ce;
  color: var(--teal);
  background: var(--teal-soft);
}

.automation-state.failed,
.automation-state.partial {
  border-color: #efc3bd;
  color: var(--red);
  background: var(--red-soft);
}

.automation-state.running,
.automation-state.waiting {
  border-color: #ebd3a4;
  color: var(--amber);
  background: var(--amber-soft);
}

.crm-automation-actions {
  flex: 0 0 auto;
  gap: 7px;
}

.crm-automation-actions .automation-settings-button {
  border-color: var(--line-strong);
  color: var(--ink-soft);
  background: var(--surface);
}

.crm-automation-actions .automation-settings-button:hover {
  border-color: #aeb6af;
  color: var(--ink);
  background: var(--surface-soft);
}

.crm-automation-actions .needs-setup:not(:disabled) {
  border-color: #d8b86b;
  color: #855d0b;
  background: var(--surface);
}

.crm-automation-actions .needs-setup:not(:disabled):hover {
  background: var(--amber-soft);
}

.automation-readiness {
  margin-top: 10px;
  padding: 8px 10px;
  border-left: 3px solid var(--teal);
  color: var(--ink-soft);
  background: #eef5f2;
  font-size: 12px;
  line-height: 1.5;
}

.automation-readiness.blocked {
  border-left-color: var(--amber);
  background: var(--amber-soft);
}

.automation-remediation {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  padding: 9px 10px;
  border: 1px solid #e4c173;
  border-radius: 7px;
  color: #6f4e08;
  background: #fff9e9;
  font-size: 12px;
  line-height: 1.5;
}

.automation-remediation > span {
  min-width: 0;
  flex: 1;
}

.automation-remediation > a {
  flex: 0 0 auto;
  color: #6f4e08;
  text-decoration: none;
}

.automation-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 11px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.automation-metrics > div {
  min-width: 0;
  padding: 9px 11px;
  border-right: 1px solid var(--line);
}

.automation-metrics > div:last-child {
  border-right: 0;
}

.automation-metrics strong,
.automation-metrics span {
  display: block;
}

.automation-metrics strong {
  color: var(--ink);
  font-size: 15px;
}

.automation-metrics span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.automation-item-list {
  display: grid;
  margin-top: 10px;
  border-top: 1px solid var(--line);
}

.automation-item-header {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(170px, 1.05fr) minmax(190px, 0.95fr) minmax(250px, 1.45fr) 74px;
  gap: 12px;
  padding: 7px 2px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0;
}

.automation-item-header span:last-child {
  text-align: center;
}

.automation-item {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(170px, 1.05fr) minmax(190px, 0.95fr) minmax(250px, 1.45fr) 74px;
  align-items: center;
  gap: 12px;
  padding: 9px 2px;
  border-bottom: 1px solid var(--line);
}

.automation-item > div,
.automation-item strong,
.automation-item span {
  min-width: 0;
}

.automation-item strong,
.automation-item span {
  display: block;
}

.automation-item strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.automation-item-approval {
  display: grid;
  gap: 3px;
}

.automation-item .automation-item-approval > span {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 0;
}

.automation-item-approval b,
.automation-recent-facts b {
  flex: 0 0 48px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
}

.automation-approval-status,
.automation-completion-status {
  width: max-content;
  max-width: 100%;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  margin-top: 2px !important;
  padding: 3px 7px;
  border-radius: 999px;
  font-size: 12px !important;
  font-weight: 700;
  line-height: 1.35 !important;
}

.automation-approval-status.approved {
  color: var(--teal) !important;
  background: var(--teal-soft);
}

.automation-approval-status.unapproved {
  color: var(--amber) !important;
  background: var(--amber-soft);
}

.automation-item span {
  margin-top: 2px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.automation-item-status {
  min-width: 66px;
  margin: 0 !important;
  padding: 4px 7px;
  border-radius: 999px;
  color: var(--muted) !important;
  background: var(--surface-soft);
  font-size: 12px !important;
  font-weight: 700;
  text-align: center;
}

.automation-item.succeeded .automation-item-status,
.automation-item.satisfied .automation-item-status,
.automation-item.ready .automation-item-status {
  color: var(--teal) !important;
  background: var(--teal-soft);
}

.automation-item.failed .automation-item-status,
.automation-item.manual_review .automation-item-status {
  color: var(--red) !important;
  background: var(--red-soft);
}

.automation-item.source-update-pending .automation-item-status {
  color: var(--amber) !important;
  background: var(--amber-soft);
}

.automation-item.blocked .automation-item-status {
  color: var(--amber) !important;
  background: var(--amber-soft);
}

.automation-recent {
  margin-top: 11px;
  border-top: 1px solid var(--line);
}

.automation-recent > summary {
  justify-content: space-between;
  min-height: 38px;
  color: var(--ink-soft);
  cursor: pointer;
  font-size: 12px;
  font-weight: 650;
  list-style: none;
}

.automation-recent > summary::-webkit-details-marker {
  display: none;
}

.automation-recent > summary > span:first-child {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.automation-recent > summary .lucide {
  width: 14px;
  height: 14px;
}

.automation-recent[open] > summary .automation-summary-meta > .lucide {
  transform: rotate(180deg);
}

.automation-summary-meta {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
}

.automation-summary-meta small {
  overflow: hidden;
  font-size: 12px;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.automation-recent-list {
  display: grid;
  border-top: 1px solid var(--line);
}

.automation-recent-item {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(180px, 1.2fr) minmax(165px, 0.8fr) auto;
  align-items: center;
  gap: 14px;
  padding: 9px 2px;
  border-bottom: 1px solid var(--line);
}

.automation-recent-item > div,
.automation-recent-item strong,
.automation-recent-item span,
.automation-recent-item small {
  min-width: 0;
}

.automation-recent-item strong,
.automation-recent-item span,
.automation-recent-item small,
.automation-recent-item time {
  display: block;
}

.automation-recent-item strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.automation-recent-item div > span,
.automation-recent-item small,
.automation-recent-item time {
  margin-top: 2px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.automation-recent-facts {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.automation-recent-facts > span,
.automation-recent-facts > time {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 0 !important;
}

.automation-recent-state {
  min-width: 100px;
  display: grid;
  justify-items: end;
  gap: 4px;
  text-align: right;
}

.automation-recent-state > span {
  display: inline-block;
  margin-top: 4px;
  padding: 4px 7px;
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 12px;
  font-weight: 700;
}

.automation-recent-state > .automation-approval-status.approved {
  color: var(--teal) !important;
  background: var(--teal-soft);
}

.automation-recent-state > .automation-approval-status.unapproved {
  color: var(--amber) !important;
  background: var(--amber-soft);
}

.automation-recent-state > .automation-completion-status.completed {
  color: var(--teal) !important;
  background: var(--teal-soft);
}

.automation-recent-state > .automation-completion-status.pending {
  color: var(--muted) !important;
  background: var(--surface-soft);
}

.automation-settings-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.automation-source-link,
.automation-table-choice {
  grid-column: 1 / -1;
}

.automation-source-link-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.automation-source-link-control button {
  height: 36px;
  min-height: 36px;
  padding: 0 12px;
  white-space: nowrap;
}

.automation-settings-grid label,
.automation-activation {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 5px;
}

.automation-settings-grid label > span,
.automation-activation > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}

.automation-settings-grid input,
.automation-settings-grid select,
.automation-activation input {
  width: 100%;
  min-width: 0;
  height: 36px;
  padding: 0 10px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--ink);
  background: var(--surface);
  font: inherit;
  font-size: 12px;
  outline: none;
}

.automation-confirmations {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.automation-confirmations label {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--ink-soft);
  background: var(--surface);
  font-size: 12px;
}

.automation-confirmations input {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: var(--teal);
}

.automation-activation {
  max-width: 320px;
  margin-top: 10px;
}

.provision-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 11px;
}

.provision-form input,
.provision-form select {
  padding: 0 11px;
}

.platform-fieldset {
  min-width: 0;
  grid-column: 1 / -1;
  margin: 5px 0 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fbfcfb;
}

.platform-fieldset legend {
  padding: 0 5px;
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 700;
}

.platform-checks {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.provision-dialog .platform-checks {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.platform-check {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink-soft);
  background: var(--surface-soft);
  font-size: 12px;
  font-weight: 500;
}

.platform-check:has(input:checked) {
  border-color: #bcdad2;
  color: var(--teal);
  background: var(--teal-soft);
}

.platform-check input {
  width: 13px;
  height: 13px;
  margin: 0;
  accent-color: var(--teal);
}

.provision-form label.platform-check {
  position: relative;
  min-width: 0;
  min-height: 54px;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 9px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--ink-soft);
  background: var(--surface);
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.provision-form label.platform-check:hover {
  border-color: var(--line-strong);
  background: #f8faf9;
}

.provision-form label.platform-check:focus-within {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(8, 127, 106, 0.1);
}

.provision-form label.platform-check:has(input:checked) {
  border-color: #bcdad2;
  color: var(--teal);
  background: #f3faf8;
  box-shadow: inset 3px 0 0 var(--teal);
}

.provision-form .platform-check input {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.platform-check-icon {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  color: #35526f;
  background: #edf3fa;
}

.platform-check-icon .lucide {
  width: 17px;
  height: 17px;
}

.platform-check.teal .platform-check-icon {
  color: #087f6a;
  background: #e6f5f1;
}

.platform-check.amber .platform-check-icon {
  color: #a96708;
  background: #fff1d8;
}

.platform-check.green .platform-check-icon {
  color: #397452;
  background: #e8f4ec;
}

.platform-check.rose .platform-check-icon {
  color: #9b4c61;
  background: #f8e9ed;
}

.platform-check.gray .platform-check-icon {
  color: #58615d;
  background: #edf0ee;
}

.platform-check strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.platform-check-mark {
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  color: transparent;
  background: var(--surface);
}

.platform-check-mark .lucide {
  width: 12px;
  height: 12px;
  stroke-width: 3;
}

.platform-check:has(input:checked) .platform-check-mark {
  border-color: var(--teal);
  color: #fff;
  background: var(--teal);
}

.provision-actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 8px;
}

.provision-actions button {
  padding: 0 13px;
  font-size: 13px;
}

.provision-actions .lucide {
  width: 15px;
  height: 15px;
}

.provision-result {
  min-height: 44px;
  margin-top: 13px;
  padding: 11px;
  border: 1px dashed var(--line-strong);
  border-radius: 7px;
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 13px;
  line-height: 1.55;
}

.workbench-users-section {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.workbench-users-heading,
.workbench-user,
.workbench-user-main,
.workbench-user-actions {
  display: flex;
  align-items: center;
}

.workbench-users-heading {
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 9px;
}

.workbench-users-heading strong,
.workbench-users-heading span {
  display: block;
}

.workbench-users-heading strong {
  color: var(--ink);
  font-size: 13px;
}

.workbench-users-heading span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.workbench-user-list {
  display: grid;
  gap: 7px;
}

.workbench-user {
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
}

.workbench-user-main {
  min-width: 0;
  gap: 9px;
}

.workbench-user-avatar {
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 6px;
  color: var(--teal);
  background: var(--teal-soft);
  font-size: 13px;
  font-weight: 750;
}

.workbench-user-copy {
  min-width: 0;
}

.workbench-user-copy strong,
.workbench-user-copy span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workbench-role-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 5px;
}

.workbench-user-copy .workbench-role-chip {
  display: inline-flex;
  align-items: center;
  width: auto;
  min-height: 21px;
  margin: 0;
  padding: 0 7px;
  border: 1px solid #c6dfd7;
  border-radius: 10px;
  color: var(--teal);
  background: var(--teal-soft);
  font-size: 11px;
  line-height: 1;
}

.workbench-user-copy .workbench-role-chip.admin {
  border-color: #d7c7a3;
  color: #8b641b;
  background: var(--amber-soft);
}

.workbench-user-copy .workbench-role-chip.warning {
  border-color: #e7c8c4;
  color: var(--red);
  background: var(--red-soft);
}

.workbench-user-copy strong {
  color: var(--ink);
  font-size: 12px;
}

.workbench-user-copy span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.workbench-user-actions {
  flex: 0 0 auto;
  gap: 6px;
}

.workbench-user-actions button {
  min-height: 27px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 5px;
  color: var(--ink-soft);
  background: var(--surface-soft);
  font-size: 12px;
  cursor: pointer;
}

.workbench-user-actions button[data-user-status="active"] {
  color: var(--teal);
}

.temporary-password {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 9px;
  padding: 10px;
  border: 1px solid #bcdad2;
  border-radius: 6px;
  color: var(--ink);
  background: var(--teal-soft);
}

.temporary-password code {
  overflow-wrap: anywhere;
  font-size: 13px;
  font-weight: 750;
}

.temporary-password button {
  flex: 0 0 auto;
}

.provision-message {
  margin-bottom: 9px;
  padding: 8px 9px;
  border: 1px solid #cddaf8;
  border-radius: 6px;
  color: #345cae;
  background: var(--blue-soft);
}

.provision-message.warning {
  border-color: #efc8c1;
  color: var(--red);
  background: var(--red-soft);
}

.provision-summary {
  display: grid;
  gap: 9px;
  margin-bottom: 10px;
}

.provision-summary.friendly {
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}

.provision-summary strong,
.provision-summary span {
  display: block;
}

.provision-summary strong {
  color: var(--ink);
  font-size: 12px;
}

.provision-summary span,
.next-action {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.plan-overview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.plan-card {
  padding: 9px;
  border-right: 1px solid var(--line);
  background: var(--surface);
}

.plan-card:last-child {
  border-right: 0;
}

.plan-card strong {
  font-size: 18px;
}

.plan-card.need {
  color: var(--amber);
  background: var(--amber-soft);
}

.plan-card.ok {
  color: var(--teal);
  background: var(--teal-soft);
}

.provision-steps {
  display: grid;
  gap: 7px;
}

.provision-step {
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-left-width: 3px;
  border-radius: 6px;
  background: var(--surface);
}

.provision-step.need {
  border-left-color: var(--blue);
}

.provision-step.warn {
  border-left-color: var(--amber);
}

.provision-step.ok {
  border-left-color: var(--teal);
}

.step-main {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.step-main strong,
.step-main span,
.step-detail span {
  display: block;
}

.step-main strong {
  color: var(--ink);
  font-size: 13px;
}

.step-main span,
.step-detail span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.action-chip {
  flex: 0 0 auto;
  margin: 0 !important;
  padding: 4px 7px;
  border-radius: 999px;
  color: var(--blue) !important;
  background: var(--blue-soft);
}

.action-chip.warn {
  color: var(--amber) !important;
  background: var(--amber-soft);
}

.action-chip.ok {
  color: var(--teal) !important;
  background: var(--teal-soft);
}

.step-detail,
.permission-detail {
  margin-top: 7px;
}

.step-detail summary,
.permission-detail summary {
  color: var(--muted);
  font-size: 12px;
}

.matrix-toolbar {
  align-items: center;
}

.admin-search-shell {
  width: min(330px, 42%);
}

.admin-search {
  padding: 0 11px 0 36px;
}

.permission-matrix {
  display: grid;
  gap: 8px;
}

.matrix-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 12px;
}

.matrix-note strong {
  flex: 0 0 auto;
  color: var(--ink);
}

.permission-user {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.permission-user-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 12px;
  border-bottom: 1px solid var(--line);
}

.permission-user-head strong,
.permission-user-head span {
  display: block;
}

.permission-user-head strong {
  font-size: 12px;
}

.permission-user-head > div > span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.permission-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 9px 12px 3px;
}

.permission-chip {
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted-light);
  background: var(--surface-soft);
  font-size: 12px;
}

.permission-chip.enabled {
  border-color: #cce2db;
  color: var(--teal);
  background: var(--teal-soft);
}

.permission-detail {
  padding: 0 12px 11px;
}

.permission-platforms {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 8px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--line);
}

.permission-platform {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 7px;
  padding: 10px;
  background: var(--surface-soft);
}

.platform-name,
.platform-scope {
  color: var(--muted);
  font-size: 12px;
}

.platform-role {
  min-height: 30px;
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.platform-scope {
  min-height: 39px;
  line-height: 1.45;
}

.platform-status {
  width: fit-content;
  padding: 4px 6px;
  border-radius: 999px;
  color: var(--red);
  background: var(--red-soft);
  font-size: 12px;
}

.platform-status.enabled {
  color: var(--teal);
  background: var(--teal-soft);
}

.permission-action {
  width: 100%;
  min-height: 30px;
  padding: 0 8px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--ink-soft);
  background: var(--surface);
  font-size: 12px;
}

.permission-action:hover {
  border-color: var(--teal);
  color: var(--teal);
}

.admin-side-title {
  padding: 6px 2px 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.admin-side .panel {
  box-shadow: none;
}

.sync-log {
  display: grid;
  gap: 7px;
  margin-top: 9px;
}

.admin-audit-log {
  max-height: 300px;
  overflow: auto;
  scrollbar-width: thin;
}

.admin-audit-log .sync-item {
  border-left: 3px solid var(--line-strong);
}

.admin-audit-log .audit-status-success {
  border-left-color: var(--green);
}

.admin-audit-log .audit-status-failed,
.admin-audit-log .audit-status-blocked,
.admin-audit-log .audit-status-denied {
  border-left-color: var(--coral);
}

.impact-panel .panel-heading {
  margin-bottom: 10px;
}

.impact-box {
  padding: 9px;
  border: 1px dashed var(--line-strong);
  border-radius: 6px;
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 12px;
  line-height: 1.55;
}

.operations-panel {
  padding: 16px;
}

.operations-heading {
  margin-bottom: 14px;
}

.operations-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-radius: 6px;
  overflow: hidden;
}

.operations-stats > div {
  min-width: 0;
  min-height: 68px;
  display: grid;
  align-content: center;
  gap: 5px;
  padding: 11px 14px;
  border-right: 1px solid var(--line);
  background: var(--surface);
}

.operations-stats > div:last-child {
  border-right: 0;
}

.operations-stats small {
  color: var(--muted);
  font-size: 12px;
}

.operations-stats strong {
  font-size: 22px;
  line-height: 1;
}

.operations-stats .high strong {
  color: var(--coral);
}

.operations-stats .medium strong {
  color: #a56a13;
}

.operations-section {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.operations-section-heading {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 10px;
}

.operations-section-heading > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.operations-section-heading strong {
  font-size: 12px;
}

.operations-section-heading span:not(.reset-status) {
  color: var(--muted);
  font-size: 12px;
}

.operations-alert-list,
.operations-audit-list {
  display: grid;
}

.operations-alert-row {
  min-width: 0;
  display: grid;
  grid-template-columns: 5px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid var(--line);
}

.operations-alert-row:last-child,
.operations-audit-row:last-child {
  border-bottom: 0;
}

.operations-alert-mark {
  width: 5px;
  height: 34px;
  border-radius: 3px;
  background: var(--line-strong);
}

.operations-alert-row.severity-high .operations-alert-mark {
  background: var(--coral);
}

.operations-alert-row.severity-medium .operations-alert-mark {
  background: var(--amber);
}

.operations-alert-row.severity-low .operations-alert-mark {
  background: var(--blue);
}

.operations-alert-row > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.operations-alert-row strong,
.operations-audit-row strong {
  font-size: 13px;
}

.operations-alert-row span,
.operations-alert-row small,
.operations-audit-row span,
.operations-audit-row small {
  min-width: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.operations-empty {
  min-height: 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--green);
}

.operations-empty .lucide {
  width: 18px;
  height: 18px;
}

.audit-filter-toolbar {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) repeat(3, minmax(112px, auto)) 34px;
  gap: 7px;
  margin-bottom: 10px;
}

.audit-filter-toolbar select {
  min-width: 0;
  height: 34px;
  padding: 0 28px 0 9px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--ink-soft);
  background: var(--surface);
  font-size: 12px;
}

.audit-search-shell {
  height: 34px;
}

.audit-filter-toolbar .icon-button {
  width: 34px;
  height: 34px;
}

.operations-audit-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 10px 9px;
  border-bottom: 1px solid var(--line);
  border-left: 3px solid var(--line-strong);
}

.operations-audit-row > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.operations-audit-row > div:last-child {
  justify-items: end;
}

.operations-audit-row.audit-status-failed,
.operations-audit-row.audit-status-blocked,
.operations-audit-row.audit-status-denied {
  border-left-color: var(--coral);
}

.operations-audit-row.audit-status-success {
  border-left-color: var(--green);
}

.operations-audit-row .audit-state {
  color: var(--ink-soft);
  font-weight: 700;
}

.operations-load-more {
  width: 100%;
  margin-top: 10px;
}

/* Platform synchronization center */
.sync-center-panel {
  padding: 16px;
}

.sync-center-actions,
.scheduler-switch,
.sync-enable-control,
.sync-time-control {
  display: flex;
  align-items: center;
}

.sync-center-actions {
  gap: 9px;
}

.scheduler-switch {
  min-height: 32px;
  gap: 7px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink-soft);
  background: var(--surface-soft);
  font-size: 12px;
}

.scheduler-switch input,
.sync-enable-control input {
  accent-color: var(--teal);
}

.sync-center-message {
  min-height: 34px;
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  padding: 7px 10px;
  border-radius: 6px;
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 12px;
  line-height: 1.45;
}

.sync-center-message.success {
  color: var(--green);
  background: var(--green-soft);
}

.sync-center-message.warning {
  color: var(--amber);
  background: var(--amber-soft);
}

.sync-center-message.loading {
  color: var(--blue);
  background: var(--blue-soft);
}

.sync-center-message.error {
  color: var(--red);
  background: var(--red-soft);
}

.readiness-panel {
  margin: 10px 0;
  padding: 9px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.readiness-panel > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 700;
}

.readiness-panel[open] > summary i {
  transform: rotate(180deg);
}

.readiness-gates {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px 12px;
  margin-top: 9px;
}

.readiness-gate {
  min-width: 0;
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr);
  align-items: start;
  gap: 7px;
}

.readiness-dot {
  width: 7px;
  height: 7px;
  margin-top: 3px;
  border-radius: 50%;
  background: var(--line-strong);
}

.readiness-gate.passed .readiness-dot {
  background: var(--green);
}

.readiness-gate.blocked .readiness-dot {
  background: var(--coral);
}

.readiness-gate.optional .readiness-dot {
  background: var(--amber);
}

.readiness-gate strong,
.readiness-gate small {
  display: block;
}

.readiness-gate strong {
  color: var(--ink);
  font-size: 12px;
}

.readiness-gate small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.pilot-candidate-section {
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid var(--line);
}

.model-config-band {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.model-config-main,
.model-config-actions {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.model-config-main > div:last-child {
  min-width: 0;
}

.model-config-main strong,
.model-config-main span {
  display: block;
}

.model-config-main strong {
  color: var(--ink);
  font-size: 12px;
}

.model-config-main span {
  max-width: 460px;
  margin-top: 2px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.model-config-actions {
  flex: 0 0 auto;
}

.pilot-candidate-heading strong,
.pilot-candidate-heading span {
  display: block;
}

.pilot-candidate-heading strong {
  color: var(--ink);
  font-size: 12px;
}

.pilot-candidate-heading span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.pilot-candidate-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 8px;
}

.pilot-candidate {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  padding: 8px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--green);
  border-radius: 6px;
  background: var(--surface-soft);
}

.pilot-candidate.needs-confirmation {
  border-left-color: var(--amber);
}

.pilot-candidate > div {
  min-width: 0;
}

.pilot-candidate strong,
.pilot-candidate span,
.pilot-candidate small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pilot-candidate strong {
  color: var(--ink);
  font-size: 12px;
}

.pilot-candidate span,
.pilot-candidate small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.pilot-candidate button {
  flex: 0 0 auto;
}

.pilot-candidate-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 5px;
}

.pilot-roster-panel > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.pilot-roster-panel > summary b {
  font-size: inherit;
}

.pilot-roster-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 9px;
}

.pilot-roster-toolbar > span {
  min-width: 0;
  color: var(--muted);
  font-size: 12px;
}

.pilot-roster-toolbar > div,
.pilot-roster-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.pilot-roster-list {
  display: grid;
  gap: 7px;
  margin-top: 8px;
}

.pilot-roster-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0 8px;
  padding: 9px 8px 9px 10px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--amber);
  border-radius: 6px;
  background: var(--surface-soft);
}

.pilot-roster-row.ready {
  border-left-color: var(--green);
}

.pilot-roster-main {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.pilot-roster-main > div {
  min-width: 0;
}

.pilot-roster-main strong,
.pilot-roster-main span,
.pilot-roster-main small {
  display: block;
}

.pilot-roster-main strong {
  color: var(--ink);
  font-size: 12px;
}

.pilot-roster-main > div > span,
.pilot-roster-main small {
  margin-top: 2px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pilot-roster-actions {
  grid-column: 2;
  grid-row: 1 / span 2;
  flex-direction: column;
  gap: 3px;
}

.pilot-roster-actions .icon-button {
  width: 27px;
  height: 27px;
}

.pilot-roster-actions .icon-button.danger {
  color: var(--red);
}

.pilot-check-details {
  grid-column: 1;
  margin-top: 7px;
  border-top: 1px solid var(--line);
  padding-top: 6px;
}

.pilot-check-details > summary {
  color: var(--muted);
  font-size: 12px;
}

.pilot-check-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 10px;
  margin-top: 7px;
}

.pilot-check {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 6px;
}

.pilot-check > .lucide {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  color: var(--amber);
}

.pilot-check.passed > .lucide {
  color: var(--green);
}

.pilot-check strong,
.pilot-check span {
  display: block;
}

.pilot-check strong {
  color: var(--ink-soft);
  font-size: 12px;
}

.pilot-check span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.pilot-member-dialog {
  width: min(720px, calc(100vw - 28px));
}

.pilot-member-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.pilot-member-fields label > span {
  display: block;
  margin-bottom: 6px;
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 700;
}

.pilot-member-options {
  min-width: 0;
  margin: 0;
  padding: 9px 10px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.pilot-member-options legend {
  padding: 0 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.pilot-member-options > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.pilot-member-options.tool-options > div {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pilot-member-options label,
.pilot-confirmations label {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--ink-soft);
  font-size: 12px;
}

.pilot-member-options label {
  min-height: 32px;
  padding: 5px 7px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: var(--surface-soft);
}

.pilot-member-options label:has(input:checked) {
  border-color: #bcdad2;
  color: var(--teal);
  background: var(--teal-soft);
}

.connection-form .pilot-member-options input,
.connection-form .pilot-confirmations input {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  padding: 0;
  border: 0;
  accent-color: var(--teal);
}

.pilot-confirmations {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
}

.sync-platform-list {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.sync-platform-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 11px 12px;
  border-bottom: 1px solid var(--line);
}

.sync-platform-row:last-child {
  border-bottom: 0;
}

.sync-platform-row.auth_required,
.sync-platform-row.failed {
  background: #fffaf4;
}

.sync-platform-row.not_configured {
  background: var(--surface-soft);
}

.sync-platform-main {
  min-width: 0;
}

.sync-platform-title {
  display: flex;
  align-items: center;
  gap: 8px;
}

.sync-platform-title strong {
  font-size: 12px;
}

.sync-status {
  padding: 4px 7px;
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface-strong);
  font-size: 12px;
}

.sync-status.success {
  color: var(--teal);
  background: var(--teal-soft);
}

.sync-status.running {
  color: var(--blue);
  background: var(--blue-soft);
}

.sync-status.auth_required,
.sync-status.failed {
  color: var(--amber);
  background: var(--amber-soft);
}

.sync-status.not_configured {
  color: var(--muted);
  background: var(--surface-strong);
}

.sync-platform-main > span,
.sync-platform-main > small,
.sync-last-message {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sync-platform-main > span {
  margin-top: 4px;
  color: var(--ink-soft);
  font-size: 12px;
}

.sync-platform-main > small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.sync-last-message {
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
}

.sync-platform-row.auth_required .sync-last-message,
.sync-platform-row.failed .sync-last-message {
  color: var(--amber);
}

.sync-platform-controls {
  display: grid;
  grid-template-columns: auto 116px auto auto;
  align-items: center;
  gap: 7px;
}

.sync-platform-controls > small {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 12px;
  text-align: right;
}

.sync-enable-control {
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
}

.sync-time-control {
  width: 132px;
  height: 36px;
  gap: 6px;
  padding: 0 8px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--muted);
  background: var(--surface);
  font-size: 12px;
}

.sync-time-control:focus-within {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px var(--teal-soft);
}

.sync-time-control input {
  min-width: 0;
  width: 76px;
  height: 32px;
  padding: 0;
  border: 0;
  outline: none;
  color: var(--ink-soft);
  background: transparent;
  font-size: 12px;
}

.sync-history {
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid var(--line);
}

.sync-history > summary {
  color: var(--muted);
  font-size: 12px;
}

.model-usage-panel > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
}

.model-usage-panel > summary span:last-child {
  min-width: 0;
  overflow: hidden;
  color: var(--ink-soft);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.model-usage-list {
  display: grid;
  gap: 6px;
  margin-top: 9px;
}

.model-usage-policy,
.model-usage-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 9px;
  border-left: 3px solid var(--line-strong);
  background: var(--surface-soft);
}

.model-usage-policy {
  border-left-color: var(--teal);
  color: var(--muted);
  font-size: 12px;
}

.model-usage-row > div {
  min-width: 0;
}

.model-usage-row strong,
.model-usage-row span {
  display: block;
}

.model-usage-row strong {
  color: var(--ink);
  font-size: 12px;
}

.model-usage-row span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.model-usage-values {
  flex: 0 0 auto;
  text-align: right;
}

.agent-run-list {
  display: grid;
  gap: 6px;
  margin-top: 9px;
}

.tool-usage-list {
  display: grid;
  gap: 6px;
  margin-top: 9px;
}

.agent-run-row {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 9px;
  border-left: 3px solid var(--teal);
  background: var(--surface-soft);
}

.tool-usage-row.circuit {
  border-left-color: var(--amber);
  background: var(--amber-soft);
}

.agent-run-row > div {
  min-width: 0;
}

.agent-run-row strong,
.agent-run-row span {
  display: block;
}

.write-control-body {
  display: grid;
  gap: 12px;
  margin-top: 10px;
}

.write-control-policy,
.write-control-section-head,
.write-control-row {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.write-control-policy {
  padding: 10px 11px;
  border-left: 3px solid var(--amber);
  background: var(--amber-soft);
}

.write-control-policy > div,
.write-control-main {
  min-width: 0;
}

.write-control-policy strong,
.write-control-policy span,
.write-control-main strong,
.write-control-main span,
.write-control-main small {
  display: block;
}

.write-control-policy strong,
.write-control-section-head strong {
  color: var(--ink);
  font-size: 13px;
}

.write-control-policy > div > span,
.write-control-section-head span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.write-control-section {
  display: grid;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.write-authorization-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.write-authorization-form > label {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.write-authorization-form > label > span,
.write-action-options legend {
  color: var(--muted);
  font-size: 12px;
}

.write-authorization-form input,
.write-authorization-form select {
  width: 100%;
  min-width: 0;
  height: 34px;
  padding: 0 8px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  outline: none;
  color: var(--ink-soft);
  background: var(--surface);
  font-size: 12px;
}

.write-action-options {
  grid-column: span 2;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.write-action-options label,
.write-test-confirmation {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--ink-soft);
  font-size: 12px;
}

.write-action-options input,
.write-test-confirmation input {
  width: 14px;
  height: 14px;
  padding: 0;
}

.write-reason-field {
  grid-column: span 2;
}

.write-test-confirmation {
  grid-column: span 3;
  align-self: center;
}

.write-authorization-form > button {
  align-self: end;
  justify-content: center;
}

.write-authorization-form > .connection-form-message {
  grid-column: 1 / -1;
}

.write-control-list {
  display: grid;
  gap: 6px;
}

.write-control-row {
  padding: 9px 10px;
  border-left: 3px solid var(--amber);
  background: var(--surface-soft);
}

.write-control-row.authorization {
  border-left-color: var(--teal);
}

.write-control-row.revoked,
.write-control-row.expired {
  border-left-color: var(--line-strong);
  opacity: 0.72;
}

.write-control-main strong {
  color: var(--ink);
  font-size: 12px;
}

.write-control-main span,
.write-control-main small {
  margin-top: 3px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.write-control-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 6px;
}

.text-danger-button {
  min-height: 30px;
  padding: 5px 9px;
  border: 1px solid #d9a9a0;
  border-radius: 6px;
  color: #a23d2d;
  background: #fff8f6;
  font-size: 12px;
}

.write-control-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.agent-run-row strong {
  color: var(--ink);
  font-size: 12px;
}

.agent-run-row span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.agent-run-values {
  flex: 0 0 auto;
  text-align: right;
}

.maintenance-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 9px;
}

.maintenance-row > div {
  min-width: 0;
}

.maintenance-row strong,
.maintenance-row span {
  display: block;
}

.maintenance-row strong {
  color: var(--ink);
  font-size: 12px;
}

.maintenance-row span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.maintenance-message {
  margin-top: 8px;
}

.sync-run-log {
  display: grid;
  gap: 5px;
  margin-top: 8px;
}

.sync-run-item {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 7px 8px;
  border-left: 3px solid var(--line-strong);
  background: var(--surface-soft);
}

.sync-run-item.success {
  border-left-color: var(--teal);
}

.sync-run-item.failed,
.sync-run-item.auth_required {
  border-left-color: var(--amber);
}

.sync-run-item > div {
  min-width: 0;
}

.sync-run-item strong,
.sync-run-item span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sync-run-item strong {
  font-size: 12px;
}

.sync-run-item span,
.sync-run-item > small {
  color: var(--muted);
  font-size: 12px;
}

.sync-run-item span {
  margin-top: 2px;
}

.sync-run-item > small {
  flex: 0 0 auto;
}

.admin-reset-history > summary span {
  min-width: 18px;
  display: inline-flex;
  justify-content: center;
  margin-left: 5px;
  padding: 2px 5px;
  border-radius: 999px;
  color: var(--amber);
  background: var(--amber-soft);
  font-size: 12px;
}

.admin-reset-list,
.my-reset-list {
  display: grid;
  gap: 6px;
  margin-top: 8px;
}

.admin-reset-row,
.my-reset-row {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border-left: 3px solid var(--line-strong);
  background: var(--surface-soft);
}

.admin-reset-row > div,
.my-reset-row > div {
  min-width: 0;
}

.admin-reset-row > div:first-child,
.my-reset-row > div:first-child {
  flex: 1;
}

.admin-reset-row strong,
.admin-reset-row span,
.my-reset-row strong,
.my-reset-row span {
  display: block;
}

.admin-reset-row strong,
.my-reset-row strong {
  font-size: 13px;
}

.admin-reset-row span,
.my-reset-row span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
}

.admin-reset-row small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
}

.admin-reset-row .request-approval-state,
.my-reset-row .request-approval-state {
  color: var(--teal);
  font-size: 12px;
  line-height: 1.55;
}

.request-timeline {
  width: min(680px, 100%);
  margin-top: 8px;
  border-top: 1px solid var(--line);
}

.request-timeline > summary {
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  color: var(--ink);
  cursor: pointer;
  list-style: none;
}

.request-timeline > summary::-webkit-details-marker {
  display: none;
}

.request-timeline > summary::before {
  content: "›";
  flex: none;
  color: var(--muted);
  font-size: 20px;
  line-height: 1;
  transform: rotate(0deg);
  transition: transform 160ms ease;
}

.request-timeline[open] > summary::before {
  transform: rotate(90deg);
}

.request-timeline > summary span,
.request-timeline > summary small {
  display: inline;
  margin: 0;
}

.request-timeline > summary span {
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.request-timeline > summary small {
  color: var(--muted);
  font-size: 11px;
}

.request-timeline-list {
  margin: 0 0 10px 5px;
  padding: 2px 0 0 16px;
  border-left: 1px solid var(--line-strong);
  list-style: none;
}

.request-timeline-item {
  position: relative;
  min-height: 48px;
  padding: 0 0 12px 12px;
}

.request-timeline-marker {
  position: absolute;
  top: 4px;
  left: -21px;
  width: 9px;
  height: 9px;
  border: 2px solid var(--surface);
  border-radius: 50%;
  background: var(--line-strong);
  box-shadow: 0 0 0 1px var(--line-strong);
}

.request-timeline-item.completed .request-timeline-marker {
  background: var(--teal);
  box-shadow: 0 0 0 1px var(--teal);
}

.request-timeline-item.current .request-timeline-marker {
  background: var(--amber);
  box-shadow: 0 0 0 3px var(--amber-soft);
}

.request-timeline-item.blocked .request-timeline-marker,
.request-timeline-item.rejected .request-timeline-marker {
  background: var(--red);
  box-shadow: 0 0 0 3px var(--red-soft);
}

.request-timeline-item.cancelled {
  opacity: 0.62;
}

.request-timeline-item strong,
.request-timeline-item p,
.request-timeline-item small {
  display: block;
  margin: 0;
  line-height: 1.45;
}

.request-timeline-item strong {
  color: var(--ink);
  font-size: 12px;
}

.request-timeline-item p {
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}

.request-timeline-item small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.organization-approval-panel {
  border-top: 1px solid var(--line);
}

.organization-approval-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 16px 2px 12px;
}

.organization-approval-toolbar > div {
  min-width: 0;
}

.organization-approval-actions {
  display: flex;
  flex: none;
  align-items: center;
  gap: 8px;
}

.organization-schedule-toggle,
.organization-schedule-time {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  gap: 7px;
  color: var(--ink-soft);
  font-size: 13px;
  white-space: nowrap;
}

.organization-schedule-time {
  padding-left: 8px;
  border-left: 1px solid var(--line);
}

.organization-schedule-time input {
  width: 90px;
  height: 36px;
  padding: 0 8px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--ink);
  background: var(--surface);
  font: inherit;
}

.organization-approval-toolbar strong,
.organization-approval-toolbar span {
  display: block;
}

.organization-approval-toolbar strong {
  color: var(--ink);
  font-size: 14px;
}

.organization-approval-toolbar span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}

.organization-approval-actions span {
  display: inline;
  margin: 0;
  color: inherit;
  font-size: inherit;
  line-height: 1.2;
}

.organization-approval-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-block: 1px solid var(--line);
}

.organization-approval-stats > div {
  min-width: 0;
  padding: 13px 14px;
}

.organization-approval-stats > div + div {
  border-left: 1px solid var(--line);
}

.organization-approval-stats strong,
.organization-approval-stats span {
  display: block;
}

.organization-approval-stats strong {
  color: var(--ink);
  font-size: 18px;
}

.organization-approval-stats span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.organization-quality-panel {
  border-bottom: 1px solid var(--line);
}

.organization-quality-panel > summary {
  min-height: 48px;
}

.organization-quality-summary {
  padding: 12px 2px;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.6;
}

.organization-quality-counts {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding-bottom: 12px;
}

.organization-quality-counts span {
  padding: 5px 8px;
  border-radius: 6px;
  color: var(--ink-soft);
  background: var(--surface-muted);
  font-size: 12px;
}

.organization-quality-counts span.critical {
  color: var(--red);
  background: var(--red-soft);
}

.organization-quality-list {
  padding: 0 2px 12px;
}

.organization-quality-row {
  display: grid;
  grid-template-columns: minmax(200px, 0.8fr) minmax(280px, 1.2fr);
  gap: 18px;
  padding: 12px 10px;
  border-left: 3px solid var(--amber);
  border-top: 1px solid var(--line);
}

.organization-quality-row.critical {
  border-left-color: var(--red);
}

.organization-quality-row strong,
.organization-quality-row b,
.organization-quality-row span {
  display: block;
}

.organization-quality-row strong,
.organization-quality-row b {
  color: var(--ink);
  font-size: 13px;
}

.organization-quality-row span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.organization-policy-list {
  display: grid;
  margin-top: 6px;
}

.organization-policy-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(180px, 1.2fr) minmax(190px, 1fr) 130px auto auto;
  align-items: end;
  gap: 12px;
  padding: 14px 2px;
  border-bottom: 1px solid var(--line);
}

.organization-policy-name,
.organization-policy-row label {
  min-width: 0;
}

.organization-policy-name strong,
.organization-policy-name span,
.organization-policy-row label > span {
  display: block;
}

.organization-policy-name strong {
  color: var(--ink);
  font-size: 14px;
}

.organization-policy-name span {
  margin-top: 4px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.organization-policy-row label > span {
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 12px;
}

.organization-policy-row select {
  width: 100%;
  height: 36px;
  padding: 0 9px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--ink);
  background: var(--surface);
  font: inherit;
  font-size: 13px;
}

.organization-policy-row .organization-auto-execute {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  gap: 7px;
  padding: 0 4px;
  white-space: nowrap;
}

.organization-policy-row .organization-auto-execute > span {
  margin: 0;
  color: var(--ink-soft);
}

.organization-dictionary-body {
  padding: 14px 2px 4px;
}

.organization-dictionary-form {
  display: grid;
  grid-template-columns: 150px 130px minmax(180px, 1fr) minmax(180px, 1fr) auto auto;
  align-items: end;
  gap: 10px;
}

.organization-dictionary-form label {
  min-width: 0;
}

.organization-dictionary-form label > span {
  display: block;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 12px;
}

.organization-dictionary-form input,
.organization-dictionary-form select {
  width: 100%;
  height: 38px;
  padding: 0 10px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--ink);
  background: var(--surface);
  font: inherit;
  font-size: 13px;
}

.organization-dictionary-form input:focus,
.organization-dictionary-form select:focus {
  border-color: var(--teal);
  outline: 2px solid var(--teal-soft);
}

.organization-dictionary-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 14px;
  padding-block: 12px;
  border-top: 1px solid var(--line);
}

.organization-dictionary-toolbar .search-box {
  width: min(360px, 100%);
}

.organization-dictionary-toolbar > span {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

.organization-dictionary-list {
  border-top: 1px solid var(--line);
}

.organization-dictionary-row {
  display: grid;
  grid-template-columns: minmax(160px, 0.9fr) 24px minmax(160px, 1fr) minmax(160px, 0.8fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 58px;
  padding: 9px 10px;
  border-bottom: 1px solid var(--line);
}

.organization-dictionary-row:hover {
  background: var(--surface-muted);
}

.organization-dictionary-row strong,
.organization-dictionary-row span,
.organization-dictionary-row small {
  min-width: 0;
}

.organization-dictionary-row strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.organization-dictionary-row > i {
  width: 17px;
  height: 17px;
  color: var(--muted);
}

.organization-dictionary-row span {
  overflow: hidden;
  color: var(--ink-soft);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.organization-dictionary-row small {
  color: var(--muted);
  font-size: 12px;
}

.organization-dictionary-actions {
  display: inline-flex;
  justify-content: flex-end;
  gap: 4px;
}

.organization-dictionary-actions button {
  width: 32px;
  height: 32px;
}

.my-approval-section {
  margin-top: 18px;
  padding-block: 18px 4px;
  border-top: 1px solid var(--line);
}

.my-approval-section .panel-title span {
  display: inline-flex;
  min-width: 22px;
  justify-content: center;
  margin-left: 6px;
  padding: 2px 6px;
  border-radius: 999px;
  color: var(--teal);
  background: var(--teal-soft);
  font-size: 12px;
}

.my-approval-list {
  display: grid;
  margin-top: 12px;
}

.my-approval-row {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 14px 2px;
  border-bottom: 1px solid var(--line);
}

.my-approval-row > div:first-child {
  min-width: 0;
}

.my-approval-row strong,
.my-approval-row span,
.my-approval-row small {
  display: block;
}

.my-approval-row strong {
  color: var(--ink);
  font-size: 14px;
}

.my-approval-row span,
.my-approval-row small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.my-approval-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
}

.admin-reset-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 7px;
}

.admin-claim-review {
  max-width: 180px;
  color: var(--amber) !important;
  font-size: 11px !important;
  text-align: right;
}

.admin-reset-row select {
  width: 132px;
  height: 32px;
  flex: 0 0 auto;
  padding: 0 7px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--ink-soft);
  background: var(--surface);
  font-size: 12px;
}

.account-self-view {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  background: var(--canvas);
}

.account-self-main {
  width: min(980px, calc(100% - 44px));
  margin: 0 auto;
  padding: 28px 0 46px;
}

.account-self-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  padding: 4px 2px 18px;
  border-bottom: 1px solid var(--line);
}

.account-self-title {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.account-back-button {
  flex: 0 0 auto;
  margin-top: 1px;
}

.account-back-button .lucide {
  width: 16px;
  height: 16px;
}

.account-self-hero h3 {
  margin-top: 7px;
  font-size: 22px;
}

.account-self-hero p,
.my-reset-section .section-heading p {
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
}

.account-onboarding-banner {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  margin: 16px 0 12px;
  padding: 16px;
  border: 1px solid #cddaf8;
  border-radius: 7px;
  background: #f5f8ff;
}

.account-onboarding-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  color: #315ea8;
  background: #e5edff;
}

.account-onboarding-icon svg {
  width: 20px;
  height: 20px;
}

.account-onboarding-copy {
  min-width: 0;
}

.account-onboarding-copy h4 {
  margin-top: 3px;
  font-size: 16px;
}

.account-onboarding-copy p {
  max-width: 660px;
  margin-top: 5px;
  color: var(--ink-soft);
  font-size: 12px;
  line-height: 1.65;
}

.account-onboarding-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 9px;
  color: var(--muted);
  font-size: 11px;
}

.account-onboarding-metrics span {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
}

.account-onboarding-metrics b {
  color: var(--ink);
  font-size: 13px;
}

.account-onboarding-actions {
  display: flex;
  align-items: center;
  gap: 7px;
}

.has-account-attention {
  position: relative;
}

.has-account-attention::after {
  position: absolute;
  top: 7px;
  right: 7px;
  width: 7px;
  height: 7px;
  border: 2px solid var(--surface);
  border-radius: 50%;
  background: var(--amber);
  content: "";
}

.account-security-note {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 16px 0;
  padding: 11px 12px;
  border: 1px solid #cce8df;
  border-radius: 7px;
  color: var(--teal);
  background: var(--teal-soft);
}

.feishu-binding-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  padding: 11px 12px;
  border: 1px solid #cddaf8;
  border-radius: 7px;
  background: var(--blue-soft);
}

.feishu-binding-card strong,
.feishu-binding-card span {
  display: block;
}

.feishu-binding-card strong {
  color: var(--ink);
  font-size: 13px;
}

.feishu-binding-card span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.account-security-note svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}

.account-security-note strong,
.account-security-note span {
  display: block;
}

.account-security-note strong {
  font-size: 13px;
}

.account-security-note span {
  margin-top: 2px;
  color: var(--ink-soft);
  font-size: 12px;
}

.external-agent-access {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  margin-bottom: 16px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.external-agent-access-copy {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
}

.external-agent-access-icon {
  width: 40px;
  height: 40px;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 7px;
  color: #315ea8;
  background: #eaf0ff;
}

.external-agent-access-icon svg {
  width: 20px;
  height: 20px;
}

.external-agent-access-copy strong,
.external-agent-access-copy span {
  display: block;
}

.external-agent-access-copy strong {
  color: var(--ink);
  font-size: 15px;
}

.external-agent-access-copy span {
  max-width: 720px;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.external-agent-grant-list {
  grid-column: 1 / -1;
  overflow: hidden;
  border-top: 1px solid var(--line);
}

.external-agent-grant,
.external-agent-grant-empty {
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0 0;
}

.external-agent-grant + .external-agent-grant {
  margin-top: 12px;
  border-top: 1px solid var(--line);
}

.external-agent-grant > div:first-child {
  min-width: 0;
}

.external-agent-grant strong,
.external-agent-grant span,
.external-agent-grant small {
  display: block;
}

.external-agent-grant strong {
  color: var(--ink);
  font-size: 13px;
}

.external-agent-grant span,
.external-agent-grant small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
}

.external-agent-grant-state {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
}

.external-agent-status {
  margin-top: 0 !important;
  padding: 4px 8px;
  border-radius: 999px;
  font-weight: 700;
}

.external-agent-status.active {
  color: var(--teal);
  background: var(--teal-soft);
}

.external-agent-status.expired,
.external-agent-status.revoked {
  color: var(--muted);
  background: var(--surface-strong);
}

.external-agent-grant-empty {
  min-height: 48px;
  color: var(--muted);
  font-size: 12px;
}

.external-agent-grant-empty code {
  max-width: 48%;
  overflow: hidden;
  color: var(--ink-soft);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.connector-request-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 14px;
  padding: 14px 16px;
  border: 1px dashed #bfcac5;
  border-radius: 7px;
  background: #fbfcfb;
}

.connector-request-card > div {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
}

.connector-request-card > div > svg {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  color: var(--teal);
}

.connector-request-card strong,
.connector-request-card span {
  display: block;
}

.connector-request-card strong {
  color: var(--ink);
  font-size: 13px;
}

.connector-request-card span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.external-agent-secret {
  display: grid;
  gap: 12px;
}

.external-agent-secret-warning {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 11px;
  border: 1px solid #eed59b;
  border-radius: 7px;
  color: #8b5b00;
  background: #fff8e8;
  font-size: 12px;
}

.external-agent-secret-warning svg {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
}

.copy-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px;
  gap: 8px;
}

.copy-field .icon-button {
  width: 42px;
  height: 42px;
}

.external-agent-secret-meta {
  color: var(--muted);
  font-size: 12px;
}

.my-platform-account-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.my-platform-account {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.my-platform-account > summary {
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 11px 12px;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  list-style: none;
}

.my-platform-account > summary::-webkit-details-marker {
  display: none;
}

.my-platform-account:not([open]) > summary {
  border-bottom-color: transparent;
}

.my-platform-account.attention > summary {
  box-shadow: inset 3px 0 0 var(--amber);
}

.my-platform-account > summary > div {
  min-width: 0;
}

.my-platform-account > summary strong,
.my-platform-account > summary span {
  display: block;
}

.my-platform-account > summary strong {
  font-size: 13px;
}

.my-platform-account > summary > div > span {
  margin-top: 3px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.my-platform-summary-state {
  min-width: 0;
  display: flex !important;
  align-items: center;
  gap: 8px;
}

.my-platform-summary-state em {
  max-width: 160px;
  overflow: hidden;
  color: var(--muted-light);
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.my-platform-summary-state svg {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  color: var(--muted);
  transition: transform 160ms ease;
}

.my-platform-account[open] .my-platform-summary-state svg {
  transform: rotate(180deg);
}

.my-account-row {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 12px;
  border-bottom: 1px solid var(--line);
}

.my-account-row:last-child {
  border-bottom: 0;
}

.my-account-row > div:first-child {
  min-width: 0;
}

.my-account-row strong,
.my-account-row span,
.my-account-row small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.my-account-row strong {
  font-size: 13px;
}

.my-account-row span,
.my-account-row small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.my-account-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 6px;
}

.my-account-actions .lucide {
  width: 13px;
  height: 13px;
}

.my-account-empty {
  min-height: 74px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 12px;
  color: var(--muted);
  font-size: 12px;
}

.my-account-empty > div:first-child {
  min-width: 0;
}

.my-account-empty strong,
.my-account-empty span {
  display: block;
}

.my-account-empty strong {
  color: var(--ink-soft);
  font-size: 12px;
}

.my-account-empty span {
  margin-top: 4px;
  overflow: hidden;
  color: var(--muted-light);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-claim-candidates {
  border-bottom: 1px solid var(--line);
  background: #f7fbf9;
}

.account-claim-candidates > header {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 12px;
  border-bottom: 1px solid #dfe8e4;
}

.account-claim-candidates > header strong,
.account-claim-candidates > header span {
  display: block;
}

.account-claim-candidates > header strong {
  color: var(--ink);
  font-size: 13px;
}

.account-claim-candidates > header div span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.account-claim-candidates > header > span {
  color: var(--teal);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.account-claim-row {
  min-width: 0;
  display: grid;
  gap: 12px;
  padding: 16px 12px;
  border-bottom: 1px solid #dfe8e4;
}

.account-claim-row:last-child {
  border-bottom: 0;
}

.account-claim-copy {
  flex: 1;
  min-width: 0;
}

.account-claim-copy > strong {
  display: block;
}

.account-claim-copy > strong {
  color: var(--ink);
  font-size: 14px;
}

.account-claim-login {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 9px;
}

.account-claim-login > span {
  flex: none;
  color: var(--muted);
  font-size: 12px;
}

.account-claim-login code {
  flex: 1 1 180px;
  min-width: 0;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--ink);
  background: var(--surface);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.account-claim-login em {
  color: var(--teal);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.account-claim-login .text-button {
  min-height: 28px;
  padding: 0;
  border: 0;
  color: var(--teal);
  background: transparent;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.account-claim-login .text-button:hover {
  text-decoration: underline;
}

.account-claim-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  margin-top: 7px;
}

.account-claim-meta span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.account-claim-evidence {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 7px;
}

.account-claim-evidence em {
  padding: 3px 6px;
  border: 1px solid #cfe3db;
  border-radius: 4px;
  color: var(--teal);
  background: #eff8f4;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
}

.account-claim-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}

.my-reset-section {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.reset-status {
  flex: 0 0 auto;
  padding: 4px 7px;
  border-radius: 999px;
  background: var(--surface-strong);
}

.reset-status.pending,
.reset-status.processing {
  color: var(--amber);
  background: var(--amber-soft);
}

.reset-status.completed {
  color: var(--teal);
  background: var(--teal-soft);
}

.reset-status.failed {
  color: var(--red);
  background: var(--red-soft);
}

.connection-dialog {
  width: min(500px, calc(100vw - 28px));
  max-height: calc(100vh - 40px);
  padding: 0;
  overflow: auto;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  color: var(--ink);
  background: var(--surface);
  box-shadow: 0 24px 70px rgb(0 0 0 / 22%);
}

.connection-dialog::backdrop {
  background: rgb(20 22 20 / 42%);
  backdrop-filter: blur(2px);
}

.connection-dialog.crm-automation-settings-dialog {
  width: min(840px, calc(100vw - 28px));
}

.connection-dialog.provision-dialog {
  width: min(920px, calc(100vw - 28px));
}

.connection-dialog.role-assignment-dialog {
  width: min(640px, calc(100vw - 28px));
}

.connection-dialog.model-preference-dialog {
  width: min(560px, calc(100vw - 28px));
}

.model-preference-note {
  margin: -4px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}

.model-token-summary {
  display: grid;
  gap: 10px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.model-token-heading,
.model-token-values {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.model-token-heading span,
.model-token-values {
  color: var(--muted);
  font-size: 12px;
}

.model-token-heading strong {
  color: var(--ink);
  font-size: 14px;
}

.model-token-meter {
  height: 6px;
  overflow: hidden;
  border-radius: 3px;
  background: var(--line);
}

.model-token-meter span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: var(--teal);
  transition: width 0.2s ease;
}

.model-token-values b {
  color: var(--ink-soft);
  font-weight: 700;
}

.role-assignment-user {
  margin: -3px 0 0;
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 700;
}

.role-assignment-options {
  display: grid;
  gap: 7px;
}

.role-assignment-option {
  position: relative;
  min-width: 0;
  min-height: 66px;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
  cursor: pointer;
}

.role-assignment-option:hover {
  border-color: var(--line-strong);
}

.role-assignment-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.role-assignment-check {
  width: 21px;
  height: 21px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 5px;
  color: transparent;
  background: var(--surface);
}

.role-assignment-check .lucide {
  width: 14px;
  height: 14px;
}

.role-assignment-option input:checked + .role-assignment-check {
  border-color: var(--teal);
  color: #ffffff;
  background: var(--teal);
}

.role-assignment-option input:focus-visible + .role-assignment-check {
  box-shadow: 0 0 0 3px var(--teal-soft);
}

.role-assignment-option > span:nth-of-type(2) {
  min-width: 0;
}

.role-assignment-option strong,
.role-assignment-option small {
  display: block;
}

.role-assignment-option strong {
  color: var(--ink);
  font-size: 14px;
}

.role-assignment-option small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.role-assignment-option em {
  padding: 4px 7px;
  border-radius: 10px;
  color: var(--teal);
  background: var(--teal-soft);
  font-size: 11px;
  font-style: normal;
  white-space: nowrap;
}

.role-assignment-option.admin em {
  color: #8b641b;
  background: var(--amber-soft);
}

.provision-dialog-form {
  gap: 13px;
}

.provision-dialog-copy {
  margin: -4px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.provision-dialog .provision-result {
  max-height: min(360px, 42vh);
  overflow: auto;
}

.connection-form > footer.provision-dialog-actions {
  grid-template-columns: auto minmax(12px, 1fr) auto auto auto;
}

.provision-form label.platform-check.locked {
  border-color: #bcdad2;
  color: var(--teal);
  background: var(--teal-soft);
  cursor: default;
}

.provision-form .platform-check.locked input {
  opacity: 0;
  cursor: default;
}

.crm-automation-settings-form {
  gap: 16px;
}

.thread-history-dialog {
  width: min(460px, calc(100vw - 28px));
  max-height: min(720px, calc(100vh - 32px));
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  color: var(--ink);
  background: var(--surface);
  box-shadow: 0 24px 70px rgb(0 0 0 / 22%);
}

.thread-history-dialog::backdrop {
  background: rgb(20 22 20 / 42%);
  backdrop-filter: blur(2px);
}

.thread-history-sheet {
  min-height: 0;
  display: grid;
  grid-template-rows: auto auto auto minmax(120px, 1fr) auto;
  gap: 12px;
  padding: 16px;
}

.thread-history-sheet > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.thread-history-sheet > header > div {
  display: grid;
  gap: 2px;
}

.thread-history-sheet > header span {
  color: var(--teal);
  font-size: 12px;
}

.thread-history-sheet > header strong {
  font-size: 16px;
}

.mobile-thread-tabs {
  width: 100%;
  border-color: var(--line);
}

.mobile-thread-tabs button {
  height: 34px;
  color: var(--muted);
  background: var(--surface);
}

.mobile-thread-tabs button.active {
  color: var(--teal);
  background: var(--teal-soft);
}

.mobile-thread-search {
  width: 100%;
  background: var(--surface-soft);
}

.mobile-thread-search input {
  color: var(--ink);
  border-color: var(--line);
  background: var(--surface-soft);
}

.mobile-thread-search input:focus {
  border-color: var(--teal);
}

.mobile-thread-list {
  max-height: 52vh;
  scrollbar-color: var(--line-strong) transparent;
}

.mobile-thread-list .thread-row:hover,
.mobile-thread-list .thread-row.active {
  border-color: var(--line);
  background: var(--surface-soft);
}

.mobile-thread-list .thread-item {
  color: var(--ink-soft);
}

.mobile-thread-list .thread-item.active {
  color: var(--ink);
}

.mobile-thread-list .thread-item span,
.mobile-thread-list .thread-empty {
  color: var(--muted);
}

.mobile-thread-list .thread-menu-button {
  color: var(--muted);
  opacity: 1;
}

.thread-history-sheet > .thread-load-more {
  color: var(--muted);
  border-color: var(--line);
}

.connection-form {
  display: grid;
  gap: 14px;
  padding: 20px;
}

.connection-form > header,
.connection-form > footer {
  display: flex;
  align-items: center;
  gap: 10px;
}

.password-dialog-copy {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
}

.password-dialog .connection-form > header > .lucide {
  width: 24px;
  height: 24px;
  color: var(--teal);
}

.password-dialog .password-dialog-actions {
  grid-template-columns: auto 1fr auto auto;
}

.connection-form > header {
  justify-content: space-between;
  padding-bottom: 13px;
  border-bottom: 1px solid var(--line);
}

.connection-form h3 {
  margin-top: 5px;
  font-size: 17px;
}

.connection-form > label > span {
  display: block;
  margin-bottom: 6px;
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 700;
}

.connection-form > label > .password-input-shell {
  display: flex;
  margin-bottom: 0;
}

.connection-form input,
.connection-form select,
.connection-form textarea {
  width: 100%;
  padding: 0 11px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  outline: none;
  color: var(--ink);
  background: var(--surface);
}

.connection-form input,
.connection-form select {
  height: 40px;
}

.connection-form textarea {
  min-height: 76px;
  padding-top: 10px;
  padding-bottom: 10px;
  resize: vertical;
  font: inherit;
  line-height: 1.5;
}

.connection-form input:focus,
.connection-form select:focus,
.connection-form textarea:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px var(--teal-soft);
}

.connection-captcha-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 116px 40px;
  gap: 8px;
  align-items: center;
}

.connection-captcha-control img {
  width: 116px;
  height: 40px;
  object-fit: contain;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
}

.connection-captcha-control .icon-button {
  width: 40px;
  height: 40px;
}

.connection-vault-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 9px 10px;
  border-radius: 6px;
  color: var(--ink-soft);
  background: var(--surface-soft);
  font-size: 12px;
  line-height: 1.45;
}

.connection-vault-note svg {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  color: var(--teal);
}

.connection-form-message {
  min-height: 16px;
  color: var(--muted);
  font-size: 12px;
}

.connection-form-message.error {
  color: var(--red);
}

.connection-form-message.success {
  color: var(--teal);
}

.connection-form-message.warning {
  color: var(--amber);
}

.connection-form-message.loading {
  color: var(--blue);
}

.connection-form > footer {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  padding-top: 4px;
}

.connection-form > footer.crm-automation-settings-actions {
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.crm-automation-settings-form .automation-confirmations input[type="checkbox"] {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  padding: 0;
}

.danger-text-button {
  border: 0;
  color: var(--red);
  background: transparent;
  font-size: 12px;
  cursor: pointer;
}

/* Cross-platform account identity */
.identity-panel {
  padding: 16px;
}

.compact-button {
  min-height: 36px;
  padding: 0 12px;
  font-size: 12px;
}

.compact-button .lucide {
  width: 16px;
  height: 16px;
}

.identity-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 14px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.identity-stats > div {
  min-width: 0;
  padding: 11px 12px;
  border-right: 1px solid var(--line);
}

.identity-stats > div:last-child {
  border-right: 0;
}

.identity-stats small,
.identity-stats strong {
  display: block;
}

.identity-stats small {
  color: var(--muted);
  font-size: 12px;
}

.identity-stats strong {
  margin-top: 3px;
  font-size: 19px;
}

.identity-stats .attention {
  color: var(--amber);
  background: var(--amber-soft);
}

.identity-link-form {
  display: grid;
  grid-template-columns: minmax(120px, 0.8fr) minmax(120px, 0.9fr) minmax(130px, 0.8fr) minmax(180px, 1.2fr) auto;
  align-items: end;
  gap: 9px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.identity-link-form input,
.identity-link-form select,
.identity-toolbar select {
  width: 100%;
  min-width: 0;
  height: 40px;
  padding: 0 10px;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  outline: none;
  color: var(--ink);
  background: var(--surface);
}

.identity-link-form input:focus,
.identity-link-form select:focus,
.identity-toolbar select:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(8, 127, 106, 0.1);
}

.identity-link-button {
  min-width: 98px;
  height: 40px;
  min-height: 40px;
  padding: 0 12px;
  font-size: 12px;
}

.identity-link-button .lucide {
  width: 14px;
  height: 14px;
}

.identity-message {
  min-height: 34px;
  display: flex;
  align-items: center;
  margin-top: 8px;
  padding: 7px 9px;
  border-radius: 6px;
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 12px;
  line-height: 1.45;
}

.identity-message.success {
  color: var(--green);
  background: var(--green-soft);
}

.identity-message.error {
  color: var(--red);
  background: var(--red-soft);
}

.identity-message.loading {
  color: var(--blue);
  background: var(--blue-soft);
}

.identity-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  margin: 14px 0 9px;
}

.identity-search-shell {
  width: min(420px, 58%);
}

.identity-toolbar select {
  width: 150px;
}

.identity-bulk-bar {
  display: grid;
  grid-template-columns: auto auto minmax(100px, 0.7fr) minmax(140px, 1fr) 120px auto auto 34px;
  align-items: center;
  gap: 7px;
  margin-bottom: 9px;
  padding: 8px;
  border: 1px solid #cde3dd;
  border-radius: 7px;
  background: var(--teal-soft);
}

.identity-select-visible {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--ink-soft);
  font-size: 12px;
  white-space: nowrap;
}

.identity-bulk-bar input[type="checkbox"],
.identity-row-select input {
  accent-color: var(--teal);
}

.identity-bulk-bar > strong {
  color: var(--teal);
  font-size: 12px;
  white-space: nowrap;
}

.identity-bulk-bar > input:not([type="checkbox"]),
.identity-bulk-bar > select {
  width: 100%;
  min-width: 0;
  height: 32px;
  padding: 0 8px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  outline: none;
  color: var(--ink);
  background: var(--surface);
  font-size: 12px;
}

.identity-bulk-bar > input:focus,
.identity-bulk-bar > select:focus {
  border-color: var(--teal);
}

.identity-bulk-bar > .icon-button {
  width: 32px;
  height: 32px;
}

.identity-list {
  display: grid;
  gap: 8px;
}

.identity-note {
  margin-bottom: 1px;
}

.identity-person,
.identity-unlinked {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.identity-person-head {
  min-width: 0;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px 11px;
  border-bottom: 1px solid var(--line);
}

.identity-avatar {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #ffffff;
  background: var(--teal);
  font-size: 12px;
  font-weight: 750;
}

.identity-person.single .identity-avatar {
  background: var(--blue);
}

.identity-person.empty .identity-avatar {
  color: var(--muted);
  background: var(--surface-strong);
}

.identity-person.lifecycle-inactive {
  border-left: 3px solid var(--coral);
}

.identity-person.lifecycle-inactive .identity-avatar {
  background: var(--coral);
}

.identity-person-copy {
  min-width: 0;
}

.identity-person-copy strong,
.identity-person-copy span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.identity-person-copy strong {
  font-size: 12px;
}

.identity-person-copy span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.identity-status,
.platform-badge {
  width: fit-content;
  padding: 4px 7px;
  border-radius: 999px;
  white-space: nowrap;
  font-size: 12px;
}

.identity-status.linked {
  color: var(--teal);
  background: var(--teal-soft);
}

.identity-status.single {
  color: var(--blue);
  background: var(--blue-soft);
}

.identity-status.empty {
  color: var(--muted);
  background: var(--surface-strong);
}

.identity-account-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 9px 11px;
}

.identity-account-chip {
  min-width: 116px;
  display: grid;
  gap: 2px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--ink-soft);
  background: var(--surface-soft);
}

.identity-account-chip small,
.identity-account-chip strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.identity-account-chip small {
  color: var(--muted);
  font-size: 12px;
}

.identity-account-chip strong {
  font-size: 12px;
}

.identity-account-chip.crm {
  border-color: #d3dcf4;
  background: var(--blue-soft);
}

.identity-account-chip.hmykt {
  border-color: #efd8b4;
  background: var(--amber-soft);
}

.identity-account-chip.zhjyy {
  border-color: #cce2db;
  background: var(--teal-soft);
}

.identity-account-chip.hlais {
  border-color: #efcbc5;
  background: var(--coral-soft);
}

.identity-empty-chip {
  color: var(--muted-light);
  font-size: 12px;
}

.identity-detail {
  padding: 0 11px 9px;
}

.identity-detail summary {
  color: var(--muted);
  font-size: 12px;
}

.identity-account-rows {
  display: grid;
  gap: 5px;
  margin-top: 7px;
}

.identity-account-row {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
}

.identity-account-row > div {
  min-width: 0;
}

.identity-account-row strong,
.identity-account-row span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.identity-account-row strong {
  font-size: 12px;
}

.identity-account-row span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.identity-account-row button {
  flex: 0 0 auto;
  padding: 4px 7px;
  border: 1px solid #efc8c1;
  border-radius: 5px;
  color: var(--red);
  background: var(--red-soft);
  font-size: 12px;
}

.identity-managed-label {
  flex: 0 0 auto;
  color: var(--blue);
  font-size: 12px;
  white-space: nowrap;
}

.permission-protected {
  flex: 0 0 auto;
  color: var(--amber);
  font-size: 12px;
  white-space: nowrap;
}

.identity-unlinked {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px 11px;
  border-left: 3px solid var(--amber);
}

.identity-unlinked.reviewing {
  border-left-color: var(--teal);
}

.identity-unlinked.deferred {
  border-left-color: var(--muted-light);
}

.identity-row-select {
  width: 24px;
  height: 32px;
  display: grid;
  place-items: center;
}

.identity-row-select input {
  width: 15px;
  height: 15px;
}

.identity-unlinked.conflict {
  border-left-color: var(--red);
}

.identity-unlinked-main {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 9px;
}

.platform-badge {
  color: var(--blue);
  background: var(--blue-soft);
}

.identity-unlinked-main > div {
  min-width: 0;
}

.identity-unlinked-main strong,
.identity-unlinked-main span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.identity-unlinked-main strong {
  font-size: 13px;
}

.identity-unlinked-main span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.identity-unlinked-action {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
}

.identity-attention-copy {
  min-width: 0;
  display: grid;
  justify-items: end;
  gap: 3px;
}

.identity-triage-meta {
  padding: 2px 6px;
  border-radius: 5px;
  color: var(--teal);
  background: var(--teal-soft);
  font-size: 12px;
  line-height: 1.4;
}

.identity-triage-meta.deferred {
  color: var(--muted);
  background: var(--surface-strong);
}

.identity-attention-text {
  max-width: 220px;
  color: var(--amber);
  font-size: 12px;
  line-height: 1.4;
  text-align: right;
}

.identity-unlinked.conflict .identity-attention-text {
  color: var(--red);
}

/* Responsive */
.offboarding-panel {
  display: grid;
  gap: 16px;
}

.offboarding-heading {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.offboarding-lookup {
  display: grid;
  grid-template-columns: minmax(180px, 0.7fr) minmax(220px, 1fr) auto;
  align-items: end;
  gap: 10px;
}

.offboarding-lookup label,
.offboarding-fields label {
  min-width: 0;
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.offboarding-lookup input,
.offboarding-fields input {
  width: 100%;
  min-width: 0;
  height: 36px;
  padding: 0 10px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--ink);
  background: var(--surface);
}

.offboarding-lookup .primary-button {
  min-width: 96px;
  height: 36px;
}

.offboarding-person {
  display: grid;
  grid-template-columns: minmax(0, 1fr) repeat(3, auto);
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.offboarding-person strong,
.offboarding-person span {
  display: block;
}

.offboarding-person strong {
  font-size: 12px;
}

.offboarding-person span,
.offboarding-person small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.offboarding-metric {
  min-width: 62px;
  text-align: right;
}

.offboarding-metric b {
  display: block;
  color: var(--ink);
  font-size: 13px;
}

.offboarding-targets {
  display: grid;
  gap: 7px;
  margin-top: 10px;
}

.offboarding-target {
  min-width: 0;
  display: grid;
  grid-template-columns: 22px minmax(130px, 0.8fr) minmax(180px, 1.2fr) auto;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
}

.offboarding-target.ready {
  border-left: 3px solid var(--teal);
}

.offboarding-target.blocked,
.offboarding-target.identity_review,
.offboarding-target.connector_unavailable {
  border-left: 3px solid var(--amber);
}

.offboarding-target.already_disabled {
  border-left: 3px solid var(--green);
}

.offboarding-target.not_found {
  color: var(--muted);
}

.offboarding-target > div {
  min-width: 0;
}

.offboarding-target strong,
.offboarding-target span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.offboarding-target strong {
  color: var(--ink);
  font-size: 12px;
}

.offboarding-target span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.offboarding-target-state {
  justify-self: end;
  padding: 3px 7px;
  border-radius: 999px;
  color: var(--ink-soft);
  background: var(--surface-strong);
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
}

.offboarding-target.ready .offboarding-target-state {
  color: var(--teal);
  background: var(--teal-soft);
}

.offboarding-target.already_disabled .offboarding-target-state {
  color: var(--green);
  background: var(--green-soft);
}

.offboarding-target.blocked .offboarding-target-state,
.offboarding-target.identity_review .offboarding-target-state,
.offboarding-target.connector_unavailable .offboarding-target-state {
  color: var(--amber);
  background: var(--amber-soft);
}

.offboarding-execution {
  display: grid;
  gap: 12px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.offboarding-fields {
  display: grid;
  grid-template-columns: minmax(220px, 1.2fr) minmax(220px, 1fr) minmax(150px, 0.55fr);
  gap: 10px;
}

.offboarding-confirmations {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.offboarding-confirmations label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 700;
}

.offboarding-execution .danger-button {
  width: fit-content;
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 13px;
  border: 1px solid #9f1d16;
  border-radius: 6px;
  color: #ffffff;
  background: var(--red);
  font-weight: 750;
}

.offboarding-execution .danger-button:hover {
  background: #951c15;
}

.offboarding-execution-result {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--ink-soft);
  background: var(--surface-soft);
  font-size: 12px;
}

.offboarding-history-disclosure {
  padding-top: 11px;
  border-top: 1px solid var(--line);
}

.offboarding-history-disclosure > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 750;
}

.offboarding-history {
  display: grid;
  gap: 6px;
  margin-top: 9px;
}

.offboarding-history-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
}

.offboarding-history-row strong,
.offboarding-history-row span {
  display: block;
}

.offboarding-history-row strong {
  font-size: 12px;
}

.offboarding-history-row span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.offboarding-history-row time {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

@media (max-width: 1240px) {
  .app-shell {
    grid-template-columns: 52px 238px minmax(0, 1fr);
  }

  .chat-layout {
    grid-template-columns: minmax(0, 1fr) 300px;
  }

  .admin-layout {
    grid-template-columns: 1fr;
  }

  .admin-side {
    position: static;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .admin-side-title {
    grid-column: 1 / -1;
  }

  .identity-link-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .identity-link-button {
    width: fit-content;
  }

  .sync-platform-row {
    grid-template-columns: 1fr;
  }

  .sync-platform-controls {
    justify-content: start;
  }

  .sync-platform-controls > small {
    text-align: left;
  }
}

@media (max-width: 1180px) {
  .admin-layout {
    padding: 22px;
  }

  .provision-panel,
  .matrix-panel {
    padding: 18px;
  }

  .crm-permission-browser {
    height: auto;
    grid-template-columns: minmax(210px, 0.72fr) minmax(300px, 1fr);
  }

  .crm-campus-pane,
  .crm-person-pane {
    height: 420px;
  }

  .crm-person-detail {
    grid-column: 1 / -1;
    min-height: 580px;
    max-height: 680px;
    border-top: 1px solid var(--line);
  }
}

@media (max-width: 1020px) {
  .app-shell {
    grid-template-columns: 52px minmax(0, 1fr);
  }

  .thread-sidebar {
    display: none;
  }

  .admin-overview {
    align-items: flex-start;
    flex-direction: column;
  }

  .admin-stats {
    width: 100%;
  }

  .admin-stat {
    min-width: 0;
  }

  .write-authorization-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .write-test-confirmation {
    grid-column: span 1;
  }
}

@media (max-width: 780px) {
  .organization-approval-toolbar,
  .my-approval-row {
    align-items: stretch;
    flex-direction: column;
  }

  .organization-approval-actions {
    flex-wrap: wrap;
  }

  .organization-approval-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .organization-approval-stats > div:nth-child(3) {
    border-left: 0;
    border-top: 1px solid var(--line);
  }

  .organization-approval-stats > div:nth-child(4) {
    border-top: 1px solid var(--line);
  }

  .organization-policy-row {
    grid-template-columns: 1fr 1fr;
    align-items: end;
  }

  .organization-quality-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .organization-policy-name {
    grid-column: 1 / -1;
  }

  .organization-dictionary-form {
    grid-template-columns: 1fr 1fr;
  }

  .organization-dictionary-form label:nth-of-type(3),
  .organization-dictionary-form label:nth-of-type(4) {
    grid-column: 1 / -1;
  }

  .organization-dictionary-row {
    grid-template-columns: minmax(110px, 0.9fr) 20px minmax(110px, 1fr) auto;
  }

  .organization-dictionary-row > small {
    display: none;
  }

  .my-approval-actions {
    justify-content: flex-end;
  }

  .login-view {
    padding: 20px;
  }

  .login-shell {
    min-height: auto;
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .login-story {
    min-height: auto;
    padding: 0;
  }

  .login-copy {
    padding: 42px 0 10px;
  }

  .login-copy h1 {
    margin: 13px 0 14px;
    font-size: 38px;
  }

  .login-copy p {
    font-size: 14px;
  }

  .platform-ribbon {
    display: none;
  }

  .login-panel {
    padding: 24px;
  }

  .app-shell {
    grid-template-columns: 1fr;
  }

  .activity-rail,
  .inspector {
    display: none;
  }

  .workspace {
    grid-template-rows: auto auto minmax(0, 1fr);
  }

  .app-shell[data-entry="admin"] .workspace {
    grid-template-rows: 52px minmax(0, 1fr);
  }

  .workspace-header {
    min-height: 62px;
    padding: 10px 14px;
  }

  .workspace-header h2 {
    display: -webkit-box;
    overflow: hidden;
    overflow-wrap: anywhere;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .workspace-header p,
  .status-pill,
  .model-pill {
    display: none;
  }

  .workspace-kicker {
    display: none;
  }

  .header-actions {
    gap: 5px;
  }

  .mobile-thread-button {
    display: grid;
  }

  .thread-history-dialog {
    width: 100%;
    max-width: none;
    max-height: 78vh;
    margin: auto 0 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: 8px 8px 0 0;
  }

  .mobile-nav {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    border-bottom: 1px solid var(--line);
    background: var(--surface);
  }

  .app-shell[data-entry="user"] .mobile-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .app-shell[data-entry="admin"] .mobile-nav {
    display: flex;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  .app-shell[data-entry="admin"] .mobile-nav::-webkit-scrollbar {
    display: none;
  }

  .app-shell[data-entry="admin"] .mobile-nav button {
    min-width: 70px;
    min-height: 52px;
    flex: 0 0 70px;
  }

  .mobile-nav button {
    min-width: 0;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 0;
    border-bottom: 2px solid transparent;
    color: var(--muted);
    background: transparent;
    font-size: 13px;
  }

  .mobile-nav button.active {
    border-bottom-color: var(--teal);
    color: var(--teal);
  }

  .mobile-nav .lucide {
    width: 15px;
    height: 15px;
  }

  .offboarding-lookup,
  .offboarding-fields {
    grid-template-columns: 1fr;
  }

  .offboarding-lookup .primary-button,
  .offboarding-execution .danger-button {
    width: 100%;
  }

  .offboarding-person {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .offboarding-person > div:first-child {
    grid-column: 1 / -1;
  }

  .offboarding-metric {
    text-align: left;
  }

  .offboarding-target {
    grid-template-columns: 22px minmax(0, 1fr) auto;
  }

  .offboarding-target > div:nth-child(3) {
    grid-column: 2 / -1;
  }

  .account-self-main {
    width: calc(100% - 28px);
    padding: 18px 0 34px;
  }

  .account-self-hero {
    align-items: flex-start;
    flex-direction: column;
  }

  .account-self-title {
    width: 100%;
  }

  .account-self-hero h3 {
    font-size: 19px;
  }

  .account-onboarding-banner {
    grid-template-columns: 36px minmax(0, 1fr);
    align-items: start;
    padding: 14px;
  }

  .account-onboarding-icon {
    width: 36px;
    height: 36px;
  }

  .account-onboarding-actions {
    grid-column: 1 / -1;
    justify-content: stretch;
  }

  .account-onboarding-actions button {
    flex: 1 1 0;
    justify-content: center;
  }

  .external-agent-access {
    grid-template-columns: 1fr;
  }

  .external-agent-access > button {
    width: 100%;
  }

  .external-agent-grant-list {
    grid-column: 1;
  }

  .external-agent-grant,
  .external-agent-grant-empty,
  .connector-request-card {
    align-items: stretch;
    flex-direction: column;
  }

  .external-agent-grant-state {
    justify-content: space-between;
  }

  .external-agent-grant-empty code {
    max-width: 100%;
  }

  .connector-request-card > button {
    width: 100%;
  }

  .my-platform-account-list {
    grid-template-columns: 1fr;
  }

  .my-account-row {
    align-items: stretch;
    flex-direction: column;
  }

  .my-account-empty {
    align-items: stretch;
    flex-direction: column;
  }

  .my-account-actions,
  .my-account-actions a,
  .my-account-actions button {
    width: 100%;
  }

  .my-account-actions a,
  .my-account-actions button {
    justify-content: center;
  }

  .admin-reset-row,
  .my-reset-row {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-reset-actions,
  .account-claim-row {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-claim-review {
    max-width: none;
    text-align: left;
  }

  .account-claim-actions {
    width: 100%;
    justify-content: flex-end;
  }

  .account-claim-actions button {
    flex: 1;
    justify-content: center;
  }

  .account-claim-login {
    flex-wrap: wrap;
  }

  .admin-reset-row select {
    width: 100%;
  }

  .chat-layout {
    grid-template-columns: 1fr;
  }

  .chat-window {
    padding: 22px 16px 18px;
  }

  .codex-empty {
    padding-top: 22px;
  }

  .codex-empty h3 {
    font-size: 22px;
  }

  .quick-prompts {
    width: calc(100% - 32px);
    grid-template-columns: 1fr;
    max-height: 144px;
    overflow: auto;
  }

  .pilot-access-banner {
    width: calc(100% - 32px);
  }

  .quick-prompts button {
    min-height: 62px;
  }

  .composer {
    width: calc(100% - 24px);
    margin-bottom: 10px;
  }

  .composer-status,
  .tool-toggle {
    display: none;
  }

  .message,
  .message.user {
    grid-template-columns: 1fr;
  }

  .avatar-small {
    display: none;
  }

  .message.user .message-body {
    grid-column: 1;
  }

  .message-actions {
    opacity: 1;
  }

  .admin-layout {
    padding: 14px;
  }

  .provision-panel,
  .matrix-panel {
    padding: 16px;
  }

  .admin-overview h3 {
    font-size: 20px;
  }

  .admin-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-stat:nth-child(2) {
    border-right: 0;
  }

  .admin-stat:nth-child(-n + 2) {
    border-bottom: 1px solid var(--line);
  }

  .admin-toolbar,
  .matrix-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .operations-heading .icon-button {
    align-self: flex-end;
    margin-top: -42px;
  }

  .operations-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .operations-stats > div:nth-child(2) {
    border-right: 0;
  }

  .operations-stats > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--line);
  }

  .audit-filter-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .audit-search-shell {
    grid-column: 1 / -1;
  }

  .operations-alert-row {
    grid-template-columns: 5px minmax(0, 1fr);
    align-items: start;
  }

  .operations-alert-row > button {
    grid-column: 2;
    justify-self: start;
  }

  .safety-badge {
    align-self: flex-start;
  }

  .provision-hub-actions {
    width: 100%;
    justify-content: space-between;
  }

  .provision-platform-grid {
    grid-template-columns: 1fr;
  }

  .provision-hub-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .provision-hub-summary > div:nth-child(2) {
    border-right: 0;
  }

  .provision-hub-summary > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--line);
  }

  .provision-detail-tabs button {
    min-width: 0;
    flex: 1;
    justify-content: center;
  }

  .provision-detail-tabs button small {
    display: none;
  }

  .provision-context-details > summary {
    padding-inline: 12px;
  }

  .provision-context-body {
    padding: 0 39px 14px;
  }

  .platform-account-catalog-tools {
    align-items: stretch;
    flex-direction: column;
  }

  .platform-account-status-filters,
  .platform-account-filter-group,
  .platform-account-source-filter,
  .platform-account-source-filter select,
  .platform-account-search {
    width: 100%;
  }

  .platform-account-filter-group {
    align-items: stretch;
    flex-direction: column;
  }

  .platform-account-status-filters button {
    min-width: 0;
    flex: 1;
  }

  .platform-account-catalog-foot {
    align-items: flex-start;
    flex-direction: column;
  }

  .platform-account-catalog-foot > div {
    width: 100%;
    justify-content: space-between;
  }

  .connection-form > footer.provision-dialog-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .provision-dialog-actions > span {
    display: none;
  }

  .provision-dialog-actions button {
    width: 100%;
    justify-content: center;
  }

  .provision-form {
    grid-template-columns: 1fr;
  }

  .provision-dialog .platform-checks {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .crm-role-catalog-head {
    align-items: stretch;
    flex-direction: column;
  }

  .crm-role-search {
    width: 100%;
  }

  .crm-permission-browser {
    height: auto;
    max-height: none;
    grid-template-columns: 1fr;
  }

  .crm-campus-pane,
  .crm-person-pane {
    height: auto;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .crm-campus-pane {
    max-height: 180px;
  }

  .crm-campus-options {
    display: flex;
    overflow-x: auto;
  }

  .crm-campus-options button {
    width: auto;
    min-width: max-content;
    border-right: 1px solid var(--line);
    border-bottom: 0;
  }

  .crm-person-options {
    max-height: 270px;
  }

  .crm-person-detail {
    min-height: 0;
    max-height: 620px;
  }

  .crm-automation-head {
    align-items: stretch;
    flex-wrap: wrap;
  }

  .crm-automation-title {
    flex: 1 1 calc(100% - 72px);
  }

  .crm-automation-actions {
    width: 100%;
  }

  .crm-automation-actions button {
    flex: 1;
    justify-content: center;
  }

  .crm-automation-actions .automation-settings-button {
    flex: 0 0 38px;
  }

  .automation-remediation {
    align-items: stretch;
    flex-direction: column;
  }

  .automation-remediation > a {
    justify-content: center;
  }

  .automation-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .automation-metrics > div:nth-child(2) {
    border-right: 0;
  }

  .automation-metrics > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--line);
  }

  .automation-item {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .automation-item-header {
    display: none;
  }

  .automation-item > div:nth-child(2),
  .automation-item > div:nth-child(3) {
    grid-column: 1 / -1;
  }

  .automation-item-status {
    grid-column: 2;
    grid-row: 1;
  }

  .automation-item-approval {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .automation-item-approval .automation-approval-status {
    grid-column: 1 / -1;
  }

  .automation-recent-item {
    align-items: start;
    grid-template-columns: minmax(0, 1fr) 88px;
    gap: 8px;
  }

  .automation-recent-facts {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .automation-recent-state {
    grid-column: 2;
    grid-row: 1;
  }

  .automation-summary-meta small {
    max-width: 180px;
  }

  .automation-settings-grid {
    grid-template-columns: 1fr;
  }

  .admin-search-shell {
    width: 100%;
  }

  .identity-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sync-center-heading,
  .sync-center-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .sync-center-actions {
    display: flex;
    width: 100%;
  }

  .scheduler-switch,
  .sync-center-actions button {
    width: 100%;
    justify-content: center;
  }

  .sync-platform-controls {
    grid-template-columns: 1fr;
  }

  .sync-time-control,
  .sync-platform-controls button {
    width: 100%;
  }

  .sync-time-control {
    justify-content: center;
  }

  .sync-run-item {
    align-items: flex-start;
    flex-direction: column;
  }

  .model-usage-panel > summary,
  .model-usage-policy,
  .model-usage-row,
  .agent-run-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .model-usage-panel > summary span:last-child {
    width: 100%;
    white-space: normal;
  }

  .model-usage-values,
  .agent-run-values {
    text-align: left;
  }

  .readiness-gates {
    grid-template-columns: 1fr;
  }

  .pilot-candidate-list {
    grid-template-columns: 1fr;
  }

  .pilot-candidate {
    align-items: stretch;
    flex-direction: column;
  }

  .model-config-band,
  .model-config-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .model-config-actions,
  .model-config-actions button {
    width: 100%;
  }

  .model-config-actions button {
    justify-content: center;
  }

  .model-config-main span {
    max-width: none;
    white-space: normal;
  }

  .pilot-candidate-actions,
  .pilot-candidate-actions button,
  .pilot-roster-toolbar,
  .pilot-roster-toolbar > div,
  .pilot-roster-toolbar button {
    width: 100%;
  }

  .pilot-candidate-actions button,
  .pilot-roster-toolbar button {
    justify-content: center;
  }

  .pilot-roster-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .pilot-member-fields,
  .pilot-member-options > div,
  .pilot-member-options.tool-options > div,
  .pilot-check-list {
    grid-template-columns: 1fr;
  }

  .maintenance-row {
    align-items: stretch;
    flex-direction: column;
  }

  .maintenance-row button {
    width: 100%;
    justify-content: center;
  }

  .identity-stats > div:nth-child(2) {
    border-right: 0;
  }

  .identity-stats > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--line);
  }

  .identity-link-form {
    grid-template-columns: 1fr;
  }

  .identity-link-button {
    width: 100%;
  }

  .identity-toolbar,
  .identity-unlinked,
  .identity-unlinked-action {
    align-items: stretch;
    flex-direction: column;
  }

  .identity-toolbar {
    display: flex;
  }

  .identity-search-shell,
  .identity-toolbar select {
    width: 100%;
  }

  .identity-bulk-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .identity-bulk-bar > input:not([type="checkbox"]),
  .identity-bulk-bar > select,
  .identity-bulk-bar > button:not(.icon-button) {
    width: 100%;
  }

  .identity-unlinked {
    display: flex;
  }

  .identity-unlinked-action {
    display: flex;
  }

  .identity-attention-text {
    max-width: none;
    text-align: left;
  }

  .identity-attention-copy {
    justify-items: start;
  }

  .matrix-note {
    align-items: flex-start;
    flex-direction: column;
  }

  .permission-platforms,
  .admin-side {
    grid-template-columns: 1fr;
  }

  .admin-side-title {
    grid-column: auto;
  }

  .write-control-policy,
  .write-control-section-head,
  .write-control-row {
    align-items: stretch;
    flex-direction: column;
  }

  .write-authorization-form {
    grid-template-columns: 1fr;
  }

  .write-action-options,
  .write-reason-field,
  .write-test-confirmation {
    grid-column: auto;
  }

  .write-action-options {
    align-items: flex-start;
    flex-direction: column;
  }

  .write-control-actions,
  .write-control-actions button {
    width: 100%;
  }

  .write-control-actions button {
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .login-view {
    padding: 16px;
  }

  .login-copy {
    padding-top: 30px;
  }

  .login-copy h1 {
    font-size: 31px;
  }

  .login-copy p {
    line-height: 1.6;
  }

  .login-panel {
    padding: 20px;
  }

  .login-panel h2 {
    font-size: 24px;
  }

  .composer-foot {
    min-height: 27px;
  }

  .provision-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .provision-actions button {
    width: 100%;
  }

  .provision-dialog .platform-checks {
    grid-template-columns: 1fr;
  }

  .crm-person-detail-meta {
    grid-template-columns: 1fr;
  }

  .crm-person-detail-meta > div {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .crm-person-detail-meta > div:last-child {
    border-bottom: 0;
  }

  .crm-person-role-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .crm-person-role-row > div:first-child {
    min-width: 0;
    flex-basis: auto;
  }

  .crm-person-scope-list {
    justify-content: flex-start;
  }

  .provision-hub-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .provision-hub-actions .primary-button {
    justify-content: center;
  }

  .provision-platform-card {
    min-height: 124px;
  }

  .provision-platform-card-open {
    gap: 9px;
    padding: 10px;
  }

  .provision-platform-card-metrics {
    display: none;
  }

  .provision-platform-card-footer {
    justify-content: flex-end;
  }

  .provision-support-details > summary {
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
  }

  .test-subject-lab-head,
  .test-subject-row-main {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .test-subject-lab-head button {
    width: 100%;
    justify-content: center;
  }

  .test-subject-copy {
    min-width: calc(100% - 42px);
  }

  .test-subject-progress {
    margin-left: 39px;
  }

  .test-subject-actions {
    margin-left: auto;
  }

  .test-platform-chips,
  .test-subject-detail {
    margin-left: 0;
  }

  .test-platform-detail-row,
  .test-subject-form-grid {
    grid-template-columns: 1fr;
  }

  .identity-bulk-bar {
    grid-template-columns: 1fr;
  }

  .identity-bulk-bar > .icon-button {
    width: 100%;
  }

  .mobile-nav button {
    gap: 4px;
    font-size: 12px;
  }

  .audit-filter-toolbar {
    grid-template-columns: 1fr;
  }

  .audit-search-shell {
    grid-column: auto;
  }

  .audit-filter-toolbar .icon-button {
    width: 100%;
  }

  .operations-audit-row {
    grid-template-columns: 1fr;
  }

  .operations-audit-row > div:last-child {
    justify-items: start;
  }

  .workbench-user {
    align-items: flex-start;
    flex-direction: column;
  }

  .workbench-user-actions {
    width: 100%;
  }

  .workbench-user-actions button {
    flex: 1;
  }

  .plan-overview {
    grid-template-columns: 1fr;
  }

  .plan-card {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .plan-card:last-child {
    border-bottom: 0;
  }

  .connection-form {
    padding: 16px;
  }

  .connection-form > footer {
    grid-template-columns: 1fr 1fr;
  }

  .connection-form > footer.crm-automation-settings-actions {
    grid-template-columns: 1fr 1fr;
  }

  .connection-form > footer > span {
    display: none;
  }

  .danger-text-button {
    grid-column: 1 / -1;
    justify-self: start;
  }
}

.ai-assistant-launcher {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 90;
  width: 68px;
  height: 68px;
  padding: 3px;
  overflow: visible;
  border: 1px solid #c9d3cc;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(23, 35, 29, 0.2);
  transition: transform 160ms ease, box-shadow 160ms ease, opacity 120ms ease;
}

.ai-assistant-launcher:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgba(23, 35, 29, 0.24);
}

.ai-assistant-launcher:focus-visible {
  outline: 3px solid rgba(8, 127, 106, 0.28);
  outline-offset: 3px;
}

.ai-assistant-launcher[aria-expanded="true"] {
  pointer-events: none;
  opacity: 0;
}

.ai-assistant-launcher img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ai-assistant-presence {
  position: absolute;
  right: 3px;
  bottom: 5px;
  width: 13px;
  height: 13px;
  border: 3px solid #ffffff;
  border-radius: 50%;
  background: #16a078;
}

.ai-assistant-launcher.is-busy img {
  animation: ai-assistant-breathe 1.2s ease-in-out infinite;
}

.ai-assistant-launcher.has-error .ai-assistant-presence {
  background: var(--red);
}

@keyframes ai-assistant-breathe {
  50% { transform: scale(0.94); }
}

.ai-assistant-drawer {
  position: fixed;
  inset: 0 0 0 auto;
  z-index: 80;
  width: min(520px, calc(100vw - 48px));
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto auto;
  border-left: 1px solid var(--line-strong);
  background: #fbfcfa;
  box-shadow: -18px 0 44px rgba(23, 35, 29, 0.16);
  transform: translateX(102%);
  visibility: hidden;
  pointer-events: none;
  transition: transform 200ms ease, visibility 200ms ease;
}

.ai-assistant-drawer.is-open {
  transform: translateX(0);
  visibility: visible;
  pointer-events: auto;
}

.ai-assistant-header {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) 38px;
  align-items: center;
  gap: 12px;
  min-height: 78px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  background: #ffffff;
}

.ai-assistant-header > img {
  width: 52px;
  height: 52px;
  object-fit: contain;
}

.ai-assistant-header > div {
  min-width: 0;
}

.ai-assistant-header strong,
.ai-assistant-header span {
  display: block;
}

.ai-assistant-header strong {
  color: var(--ink);
  font-size: 17px;
}

.ai-assistant-header span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 13px;
}

.ai-assistant-context {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 8px 16px;
  border-bottom: 1px solid var(--line);
  color: #126f61;
  background: #eef7f4;
  font-size: 13px;
}

.ai-assistant-context svg {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
}

.ai-assistant-context span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ai-assistant-messages {
  min-height: 0;
  overflow: auto;
  padding: 22px 20px 26px;
  overscroll-behavior: contain;
}

.ai-assistant-empty {
  padding: 22px 10px;
  color: var(--muted);
  text-align: center;
}

.ai-assistant-empty img {
  width: 88px;
  height: 88px;
  object-fit: contain;
}

.ai-assistant-empty strong,
.ai-assistant-empty span {
  display: block;
}

.ai-assistant-empty strong {
  margin-top: 10px;
  color: var(--ink);
  font-size: 16px;
}

.ai-assistant-empty span {
  max-width: 300px;
  margin: 6px auto 0;
  font-size: 13px;
  line-height: 1.65;
}

.ai-assistant-message + .ai-assistant-message {
  margin-top: 18px;
}

.ai-assistant-message-label {
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 13px;
}

.ai-assistant-message.user {
  display: grid;
  justify-items: end;
}

.ai-assistant-message.user .ai-assistant-message-label {
  display: none;
}

.ai-assistant-bubble {
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.75;
  overflow-wrap: anywhere;
  white-space: normal;
}

.ai-assistant-message.user .ai-assistant-bubble {
  max-width: 86%;
  padding: 9px 12px;
  border-radius: 8px 8px 2px 8px;
  color: #ffffff;
  background: #252823;
  white-space: pre-wrap;
}

.ai-assistant-message.assistant .ai-assistant-bubble {
  padding-left: 14px;
  border-left: 3px solid #89c5b7;
}

.ai-assistant-message.error .ai-assistant-bubble {
  border-left-color: var(--red);
  color: var(--red);
}

.ai-assistant-message .execution-details {
  margin-top: 14px;
}

.ai-assistant-answer p {
  margin: 0;
}

.ai-assistant-answer p + p,
.ai-assistant-answer p + ul,
.ai-assistant-answer ul + p {
  margin-top: 9px;
}

.ai-assistant-answer .answer-lead {
  color: var(--ink);
  font-weight: 620;
}

.ai-assistant-answer .answer-labeled {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
}

.ai-assistant-answer .answer-labeled strong {
  color: var(--ink);
}

.ai-assistant-answer ul {
  display: grid;
  gap: 6px;
  margin: 9px 0 0;
  padding-left: 20px;
}

.ai-assistant-progress {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fcfdfc;
  box-shadow: 0 8px 24px rgba(25, 42, 35, 0.04);
}

.ai-assistant-progress-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.ai-assistant-progress-head > div {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ai-assistant-progress-head strong {
  color: var(--ink);
  font-size: 14px;
}

.ai-assistant-progress-head span {
  color: var(--muted);
  font-size: 12px;
}

.progress-live-dot {
  position: relative;
  width: 8px;
  height: 8px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #a5b0aa;
}

.progress-live-dot.is-live {
  background: #168a75;
}

.progress-live-dot.is-live::after {
  position: absolute;
  inset: -4px;
  border: 1px solid rgba(22, 138, 117, 0.45);
  border-radius: inherit;
  content: "";
  animation: ai-assistant-live-ring 1.4s ease-out infinite;
}

.progress-segments {
  display: flex;
  gap: 5px;
  height: 3px;
  margin-top: 11px;
}

.progress-segments i {
  position: relative;
  min-width: 18px;
  flex: 1 1 0;
  overflow: hidden;
  border-radius: 3px;
  background: #dfe5e1;
}

.progress-segments i.success {
  background: #168a75;
}

.progress-segments i.running::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -45%;
  width: 45%;
  border-radius: inherit;
  background: #37a892;
  content: "";
  animation: ai-assistant-progress-sweep 1.25s ease-in-out infinite;
}

.progress-segments i.blocked,
.progress-segments i.failed,
.progress-segments i.denied,
.progress-segments i.unavailable {
  background: #d0a23c;
}

.ai-assistant-progress ol {
  display: grid;
  gap: 2px;
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
}

.ai-assistant-progress li {
  position: relative;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 44px;
  padding: 7px 8px;
  border-radius: 6px;
  color: var(--muted);
  animation: ai-assistant-step-arrive 220ms ease-out both;
}

.ai-assistant-progress li.running {
  background: #f1f8f5;
  box-shadow: inset 3px 0 #168a75;
}

.ai-assistant-progress li.success {
  min-height: 38px;
}

.ai-assistant-progress li:not(:last-child)::before {
  position: absolute;
  top: 34px;
  bottom: -7px;
  left: 19px;
  width: 1px;
  background: #d9e0dc;
  content: "";
}

.ai-assistant-progress li.success:not(:last-child)::before {
  background: #8bc5b7;
}

.ai-assistant-progress .progress-marker {
  position: relative;
  z-index: 1;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: #fcfdfc;
  font-size: 12px;
}

.ai-assistant-progress li.running .progress-marker {
  border-color: #75b8a8;
  background: #ffffff;
  box-shadow: 0 0 0 4px rgba(22, 138, 117, 0.08);
}

.ai-assistant-progress li.running .progress-marker::after {
  width: 10px;
  height: 10px;
  border: 2px solid rgba(22, 138, 117, 0.22);
  border-top-color: #168a75;
  border-radius: 50%;
  content: "";
  animation: ai-assistant-progress-spin 700ms linear infinite;
}

.ai-assistant-progress li.success .progress-marker {
  border-color: #75b8a8;
  color: #ffffff;
  background: #168a75;
}

.ai-assistant-progress li.blocked .progress-marker,
.ai-assistant-progress li.failed .progress-marker,
.ai-assistant-progress li.denied .progress-marker,
.ai-assistant-progress li.unavailable .progress-marker {
  border-color: #d6b66d;
  color: #9a6500;
  background: #fff8e8;
}

.ai-assistant-progress .progress-step-copy strong,
.ai-assistant-progress .progress-step-copy small {
  display: block;
}

.ai-assistant-progress .progress-step-copy strong {
  color: var(--ink-soft);
  font-size: 13px;
}

.ai-assistant-progress .progress-step-copy small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.progress-step-time {
  align-self: center;
  color: #8b9690;
  font-size: 11px;
  white-space: nowrap;
}

.progress-step-time.is-live {
  color: #0f7564;
  font-variant-numeric: tabular-nums;
}

.progress-thinking-dots {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-left: 6px;
  vertical-align: middle;
}

.progress-thinking-dots i {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #168a75;
  animation: ai-assistant-thinking-dot 1s ease-in-out infinite;
}

.progress-thinking-dots i:nth-child(2) { animation-delay: 120ms; }
.progress-thinking-dots i:nth-child(3) { animation-delay: 240ms; }

@keyframes ai-assistant-live-ring {
  from { opacity: 0.8; transform: scale(0.65); }
  to { opacity: 0; transform: scale(1.35); }
}

@keyframes ai-assistant-progress-sweep {
  0% { transform: translateX(0); }
  100% { transform: translateX(325%); }
}

@keyframes ai-assistant-progress-spin {
  to { transform: rotate(360deg); }
}

@keyframes ai-assistant-step-arrive {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes ai-assistant-thinking-dot {
  0%, 60%, 100% { opacity: 0.35; transform: translateY(0); }
  30% { opacity: 1; transform: translateY(-2px); }
}

@media (prefers-reduced-motion: reduce) {
  .progress-live-dot.is-live::after,
  .progress-segments i.running::after,
  .ai-assistant-progress li,
  .ai-assistant-progress li.running .progress-marker::after,
  .progress-thinking-dots i {
    animation: none;
  }
}

/* Codex-aligned user agent workspace */
.app-shell[data-entry="user"] .thread-sidebar {
  gap: 10px;
}

.app-shell[data-entry="user"] .sidebar-head {
  order: 0;
}

.app-shell[data-entry="user"] .thread-sidebar > .search-box {
  order: 1;
}

.app-shell[data-entry="user"] .sidebar-section.grow {
  order: 2;
}

.app-shell[data-entry="user"] .user-account-menu {
  order: 3;
}

.app-shell[data-entry="user"] .account-section {
  order: 4;
  padding: 8px;
}

.app-shell[data-entry="user"] .account-section > .section-title,
.app-shell[data-entry="user"] .account-switch > span {
  display: none;
}

.app-shell[data-entry="user"] .account-switch {
  justify-content: flex-end;
  padding-top: 6px;
}

.app-shell[data-entry="user"] .sidebar-footer {
  order: 5;
}

.thread-item strong {
  position: relative;
  padding-right: 16px;
}

.thread-running-dot {
  position: absolute;
  top: 50%;
  right: 0;
  width: 8px;
  height: 8px;
  border: 2px solid rgba(255, 255, 255, 0.22);
  border-top-color: #73c8ae;
  border-radius: 50%;
  animation: ai-assistant-progress-spin 700ms linear infinite;
}

.app-shell[data-entry="user"] .conversation-panel {
  position: relative;
}

.scroll-to-latest {
  position: absolute;
  z-index: 8;
  right: max(22px, calc((100% - 920px) / 2));
  bottom: 154px;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  color: var(--ink-soft);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 6px 20px rgba(25, 32, 28, 0.12);
}

.scroll-to-latest:hover {
  color: var(--ink);
  background: #ffffff;
}

.scroll-to-latest .lucide {
  width: 17px;
  height: 17px;
}

.live-agent-turn {
  max-width: 780px;
}

.live-progress-slot {
  margin-bottom: 16px;
}

.live-answer-slot:empty {
  display: none;
}

.live-answer-slot:not(:empty) {
  display: block;
  animation: ai-assistant-step-arrive 160ms ease-out both;
}

.pending-agent-message.has-streaming-answer .live-progress-slot {
  margin-bottom: 12px;
}

.pending-agent-message.has-streaming-answer .live-answer-slot::after {
  width: 2px;
  height: 1.1em;
  display: inline-block;
  margin-left: 2px;
  border-radius: 1px;
  background: var(--teal);
  content: "";
  vertical-align: -0.14em;
  animation: streaming-caret 820ms steps(1) infinite;
}

.pending-agent-message.streaming-answer-complete .live-answer-slot::after {
  display: none;
}

@keyframes streaming-caret {
  50% {
    opacity: 0;
  }
}

.main-agent-progress {
  padding: 0;
  overflow: hidden;
}

.main-agent-progress > summary {
  min-height: 44px;
  padding: 0 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  cursor: pointer;
  list-style: none;
}

.main-agent-progress > summary::-webkit-details-marker {
  display: none;
}

.main-agent-progress > summary > div {
  display: flex;
  align-items: center;
  gap: 9px;
}

.main-agent-progress > summary strong {
  color: var(--ink-soft);
  font-size: 13px;
}

.main-agent-progress > summary > span {
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.main-agent-progress .ai-assistant-progress-head {
  padding: 0 13px;
}

.main-agent-progress .progress-segments {
  margin-right: 13px;
  margin-left: 13px;
}

.main-agent-progress > ol {
  padding: 0 6px 8px;
}

.app-shell[data-entry="user"] .ai-assistant-answer h3,
.app-shell[data-entry="user"] .ai-assistant-answer h4,
.app-shell[data-entry="user"] .ai-assistant-answer h5 {
  margin: 18px 0 8px;
  color: var(--ink);
  font-size: 15px;
  line-height: 1.5;
}

.app-shell[data-entry="user"] .ai-assistant-answer ol {
  margin: 10px 0 0;
  padding-left: 22px;
}

.app-shell[data-entry="user"] .ai-assistant-answer li + li {
  margin-top: 6px;
}

.app-shell[data-entry="user"] .ai-assistant-answer code {
  padding: 2px 5px;
  border: 1px solid #dde2de;
  border-radius: 4px;
  color: #2a3731;
  background: #f1f3f0;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 0.9em;
}

.app-shell[data-entry="user"] .ai-assistant-answer pre {
  max-width: 100%;
  margin: 12px 0;
  padding: 13px 15px;
  overflow: auto;
  border: 1px solid #343933;
  border-radius: 7px;
  color: #f1f3ef;
  background: #20231f;
  font-size: 13px;
  line-height: 1.65;
}

.app-shell[data-entry="user"] .ai-assistant-answer pre code {
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
}

.execution-details summary span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.execution-details summary span .lucide {
  width: 15px;
  height: 15px;
  color: var(--teal);
}

.app-shell[data-entry="user"] .message-actions button {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  padding: 0;
}

.app-shell[data-entry="user"] .message-actions .lucide {
  width: 14px;
  height: 14px;
}

.app-shell[data-entry="user"] .composer-tools > .tool-toggle {
  display: none;
}

@media (max-width: 780px) {
  .scroll-to-latest {
    right: 16px;
    bottom: 142px;
  }

  .main-agent-progress > summary {
    min-height: 42px;
  }

  .main-agent-progress .progress-step-time {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .thread-running-dot,
  .pending-agent-message.has-streaming-answer .live-answer-slot::after {
    animation: none;
  }
}

/* AI usage administration */
.ai-usage-admin-panel {
  padding: 0;
  overflow: hidden;
}

.ai-usage-heading {
  padding: 22px 24px;
  border-bottom: 1px solid var(--line);
}

.ai-usage-actions,
.ai-usage-actions .segmented-control {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ai-usage-actions .segmented-control {
  padding: 3px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: #f5f7f5;
}

.ai-usage-actions .segmented-control button {
  min-width: 58px;
  height: 34px;
  padding: 0 12px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--text-muted);
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

.ai-usage-actions .segmented-control button.active {
  background: #ffffff;
  color: var(--text);
  box-shadow: 0 1px 4px rgba(26, 35, 30, 0.12);
}

.ai-usage-review-notice {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding: 0 24px;
  border-bottom: 1px solid #d6e5df;
  background: #eef8f4;
  color: #296151;
  font-size: 14px;
}

.ai-usage-review-notice .lucide {
  width: 18px;
  height: 18px;
  color: #087f68;
}

.ai-usage-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--line);
}

.ai-usage-stats > span {
  min-height: 82px;
  padding: 16px 22px;
  border-right: 1px solid var(--line);
}

.ai-usage-stats > span:last-child {
  border-right: 0;
}

.ai-usage-stats small,
.ai-usage-stats b {
  display: block;
}

.ai-usage-stats small {
  margin-bottom: 7px;
  color: var(--text-muted);
  font-size: 13px;
}

.ai-usage-stats b {
  color: var(--text);
  font-size: 24px;
  line-height: 1;
}

.ai-usage-browser {
  display: grid;
  grid-template-columns: minmax(250px, 0.72fr) minmax(300px, 0.9fr) minmax(420px, 1.55fr);
  min-height: 570px;
  height: calc(100dvh - 355px);
  max-height: 760px;
}

.ai-usage-pane {
  min-width: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  border-right: 1px solid var(--line);
  background: #ffffff;
}

.ai-usage-pane:last-child {
  border-right: 0;
}

.ai-usage-users-pane {
  grid-template-rows: auto auto minmax(0, 1fr);
  background: #f8faf8;
}

.ai-usage-pane-head {
  min-height: 70px;
  padding: 15px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid var(--line);
}

.ai-usage-pane-head > div {
  min-width: 0;
}

.ai-usage-pane-head strong,
.ai-usage-pane-head span {
  display: block;
}

.ai-usage-pane-head strong {
  margin-bottom: 4px;
  color: var(--text);
  font-size: 17px;
}

.ai-usage-pane-head span {
  overflow: hidden;
  color: var(--text-muted);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ai-usage-search {
  height: 42px;
  margin: 12px 14px;
  padding: 0 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: #ffffff;
}

.ai-usage-search .lucide {
  width: 17px;
  height: 17px;
  color: var(--text-muted);
}

.ai-usage-search input {
  min-width: 0;
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 14px;
}

.ai-usage-user-list,
.ai-usage-conversation-list,
.ai-usage-message-list {
  min-height: 0;
  overflow: auto;
}

.ai-usage-user-row,
.ai-usage-conversation-row {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.ai-usage-user-row {
  min-height: 86px;
  padding: 15px 14px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
}

.ai-usage-user-row:hover,
.ai-usage-conversation-row:hover {
  background: #f1f6f3;
}

.ai-usage-user-row.active,
.ai-usage-conversation-row.active {
  background: #e8f5f0;
  box-shadow: inset 4px 0 #0a8a70;
}

.ai-usage-avatar {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 6px;
  background: #dcefe8;
  color: #08755f;
  font-size: 18px;
  font-weight: 800;
}

.ai-usage-user-copy,
.ai-usage-user-values {
  min-width: 0;
}

.ai-usage-user-copy strong,
.ai-usage-user-copy small,
.ai-usage-user-values strong,
.ai-usage-user-values small {
  display: block;
}

.ai-usage-user-copy strong {
  overflow: hidden;
  margin-bottom: 5px;
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ai-usage-user-copy small,
.ai-usage-user-values small {
  color: var(--text-muted);
  font-size: 12px;
}

.ai-usage-user-values {
  text-align: right;
}

.ai-usage-user-values strong {
  margin-bottom: 5px;
  color: #08755f;
  font-size: 13px;
}

.ai-usage-conversation-row {
  min-height: 118px;
  padding: 16px 18px;
}

.ai-usage-conversation-title,
.ai-usage-conversation-title strong,
.ai-usage-conversation-title small,
.ai-usage-conversation-preview,
.ai-usage-conversation-meta {
  display: block;
}

.ai-usage-conversation-title strong {
  overflow: hidden;
  margin-bottom: 4px;
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ai-usage-conversation-title small,
.ai-usage-conversation-preview,
.ai-usage-conversation-meta {
  color: var(--text-muted);
  font-size: 12px;
}

.ai-usage-conversation-preview {
  height: 36px;
  margin: 10px 0;
  overflow: hidden;
  line-height: 18px;
}

.ai-usage-conversation-meta {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.ai-usage-conversation-meta b {
  color: #08755f;
}

.ai-usage-detail-tokens {
  flex: 0 0 auto;
  max-width: 240px;
  padding: 7px 9px;
  border: 1px solid #cfe4dc;
  border-radius: 5px;
  background: #f3faf7;
  color: #08755f !important;
  font-size: 12px !important;
}

.ai-usage-message-list {
  padding: 22px 24px 36px;
  background: #fbfcfb;
}

.ai-usage-message {
  margin-bottom: 26px;
}

.ai-usage-message > header {
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.ai-usage-message > header strong {
  color: var(--text);
  font-size: 14px;
}

.ai-usage-message > header span {
  color: var(--text-muted);
  font-size: 12px;
}

.ai-usage-message-content {
  max-width: 92%;
  color: #28312d;
  font-size: 15px;
  line-height: 1.72;
}

.ai-usage-message-content p {
  margin: 0 0 8px;
}

.ai-usage-message.user {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.ai-usage-message.user > header {
  flex-direction: row-reverse;
}

.ai-usage-message.user .ai-usage-message-content {
  padding: 12px 15px;
  border-radius: 6px;
  background: #202521;
  color: #ffffff;
}

.ai-usage-message.assistant .ai-usage-message-content {
  padding-left: 15px;
  border-left: 3px solid #72bea9;
}

.ai-usage-message footer {
  max-width: 92%;
  margin-top: 8px;
  padding-left: 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ai-usage-message footer span {
  padding: 4px 7px;
  border-radius: 4px;
  background: #eef2ef;
  color: var(--text-muted);
  font-size: 11px;
}

.ai-usage-empty-state {
  min-height: 100%;
  padding: 36px 20px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 12px;
  color: var(--text-muted);
  text-align: center;
}

.ai-usage-empty-state .lucide {
  width: 28px;
  height: 28px;
  color: #9aa8a1;
}

@media (max-width: 1350px) {
  .ai-usage-browser {
    grid-template-columns: 240px 290px minmax(380px, 1fr);
  }
}

@media (max-width: 1020px) {
  .ai-usage-browser {
    height: auto;
    max-height: none;
    grid-template-columns: 1fr;
  }

  .ai-usage-pane {
    min-height: 360px;
    max-height: 520px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .ai-usage-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ai-usage-stats > span:nth-child(2) {
    border-right: 0;
  }
}

.ai-assistant-message .agent-action-card {
  margin-top: 12px;
}

.ai-assistant-typing {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 20px;
}

.ai-assistant-typing i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #6b7d74;
  animation: ai-assistant-dot 1s ease-in-out infinite;
}

.ai-assistant-typing i:nth-child(2) { animation-delay: 120ms; }
.ai-assistant-typing i:nth-child(3) { animation-delay: 240ms; }

@keyframes ai-assistant-dot {
  50% { opacity: 0.35; transform: translateY(-2px); }
}

.ai-assistant-suggestions {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding: 10px 16px;
  border-top: 1px solid var(--line);
  background: #ffffff;
}

.ai-assistant-suggestions button {
  flex: 0 0 auto;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--ink-soft);
  background: var(--surface);
  font-size: 12px;
}

.ai-assistant-suggestions button:hover {
  border-color: #78a99d;
  color: #126f61;
}

.ai-assistant-composer {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 38px;
  gap: 8px;
  padding: 12px 16px 14px;
  border-top: 1px solid var(--line);
  background: #ffffff;
}

.ai-assistant-composer textarea {
  width: 100%;
  min-height: 42px;
  max-height: 132px;
  resize: none;
  padding: 10px 12px;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  color: var(--ink);
  background: #ffffff;
  font: inherit;
  font-size: 14px;
  line-height: 1.45;
}

.ai-assistant-composer textarea:focus {
  border-color: var(--teal);
  outline: 3px solid rgba(8, 127, 106, 0.1);
}

.ai-assistant-composer > button {
  align-self: end;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  color: #ffffff;
  background: #252823;
}

.ai-assistant-composer > button:disabled {
  cursor: wait;
  opacity: 0.45;
}

.ai-assistant-composer > button svg {
  width: 18px;
  height: 18px;
}

.ai-assistant-composer > p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

/* User Agent workspace */
@media (min-width: 1021px) {
  .app-shell[data-entry="user"] {
    grid-template-columns: 264px minmax(0, 1fr);
  }

  .app-shell[data-entry="user"] .activity-rail {
    display: none;
  }
}

.app-shell[data-entry="user"] .workspace {
  grid-template-rows: 58px minmax(0, 1fr);
  background: #fbfcfa;
}

.app-shell[data-entry="user"] .workspace-header {
  padding: 0 18px 0 22px;
  background: rgba(255, 255, 255, 0.94);
}

.app-shell[data-entry="user"] .workspace-kicker,
.app-shell[data-entry="user"] .workspace-header p,
.app-shell[data-entry="user"] .status-pill {
  display: none;
}

.app-shell[data-entry="user"] .workspace-header h2 {
  max-width: min(54vw, 720px);
  font-size: 15px;
  font-weight: 680;
}

.app-shell[data-entry="user"] .model-pill {
  max-width: 280px;
  overflow: hidden;
  border-color: var(--line);
  color: var(--muted);
  background: #f6f7f4;
  text-overflow: ellipsis;
}

.app-shell[data-entry="user"] .model-pill span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.app-shell[data-entry="user"] .chat-layout {
  position: relative;
  grid-template-columns: minmax(0, 1fr);
  background: #fbfcfa;
}

.app-shell[data-entry="user"] .chat-layout.inspector-open {
  grid-template-columns: minmax(0, 1fr) 342px;
}

.app-shell[data-entry="user"] .codex-inspector {
  display: none;
}

.app-shell[data-entry="user"] .chat-layout.inspector-open .codex-inspector {
  display: grid;
}

.app-shell[data-entry="user"] .conversation-panel {
  background: #fbfcfa;
}

.app-shell[data-entry="user"] .chat-window {
  padding: 42px max(30px, calc((100% - 920px) / 2)) 30px;
  scroll-padding-bottom: 180px;
}

.app-shell[data-entry="user"] .message {
  width: min(920px, 100%);
  margin-bottom: 30px;
  gap: 13px;
}

.app-shell[data-entry="user"] .message-head {
  margin-bottom: 8px;
}

.app-shell[data-entry="user"] .message-head strong {
  font-size: 13px;
}

.app-shell[data-entry="user"] .bubble {
  color: #303733;
  font-size: 15px;
  line-height: 1.78;
}

.app-shell[data-entry="user"] .message.user .bubble {
  width: fit-content;
  max-width: 100%;
  padding: 12px 15px;
  overflow-wrap: break-word;
  border-radius: 8px;
  color: #ffffff;
  background: #242722;
  font-size: 15px;
  line-height: 1.62;
  white-space: pre-wrap;
  word-break: normal;
}

.app-shell[data-entry="user"] .avatar-small {
  width: 32px;
  height: 32px;
}

.app-shell[data-entry="user"] .ai-assistant-answer p {
  margin: 0;
}

.app-shell[data-entry="user"] .ai-assistant-answer p + p,
.app-shell[data-entry="user"] .ai-assistant-answer p + ul,
.app-shell[data-entry="user"] .ai-assistant-answer ul + p {
  margin-top: 10px;
}

.app-shell[data-entry="user"] .ai-assistant-answer ul {
  margin: 10px 0 0;
  padding-left: 20px;
}

.app-shell[data-entry="user"] .ai-assistant-answer li + li {
  margin-top: 5px;
}

.app-shell[data-entry="user"] .execution-details {
  margin-top: 16px;
  border-color: #d8ddd8;
  background: #ffffff;
}

.app-shell[data-entry="user"] .composer {
  width: min(920px, calc(100% - 60px));
  margin-bottom: 20px;
  padding: 9px;
  border-color: #bdc5bf;
  border-radius: 8px;
  box-shadow: 0 14px 38px rgba(25, 32, 28, 0.12);
}

.app-shell[data-entry="user"] .composer-box {
  align-items: flex-end;
}

.app-shell[data-entry="user"] .composer textarea {
  min-height: 54px;
  max-height: 180px;
  padding: 13px 10px 11px;
  scrollbar-width: none;
  font-size: 15px;
}

.app-shell[data-entry="user"] .composer textarea::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.composer-attach,
.composer-voice {
  margin-bottom: 6px !important;
}

.composer-voice.is-listening {
  border-color: #f0b9b4;
  color: #b42318;
  background: #fff0ee;
  animation: voice-pulse 1.4s ease-in-out infinite;
}

@keyframes voice-pulse {
  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(180, 35, 24, 0);
  }
  50% {
    box-shadow: 0 0 0 5px rgba(180, 35, 24, 0.1);
  }
}

.composer-notice {
  min-height: 30px;
  display: flex;
  align-items: center;
  margin: 0 2px 7px;
  padding: 6px 9px;
  border-left: 3px solid #7890aa;
  color: #52606d;
  background: #f4f7fa;
  font-size: 12px;
  line-height: 1.45;
}

.composer-notice.success {
  border-left-color: var(--teal);
  color: #166b5f;
  background: #eef8f5;
}

.composer-notice.error {
  border-left-color: #b42318;
  color: #9d241a;
  background: #fff1ef;
}

.composer-notice.listening {
  border-left-color: #2f6fca;
  color: #245ba8;
  background: #eef4ff;
}

.send-button.is-stop {
  color: #ffffff;
  background: #b42318;
}

.send-button.is-stop:hover {
  background: #941d14;
}

.attachment-tray {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding: 2px 2px 8px;
}

.attachment-chip,
.message-attachments > span {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--ink-soft);
  background: #f6f7f4;
}

.attachment-chip {
  max-width: 280px;
  min-height: 38px;
  padding: 5px 6px 5px 9px;
}

.attachment-chip.image {
  padding-left: 5px;
}

.attachment-chip > img {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border: 1px solid #d4d9d5;
  border-radius: 5px;
  object-fit: cover;
  background: #ffffff;
}

.attachment-chip > .lucide,
.message-attachments .lucide {
  width: 15px;
  height: 15px;
  color: var(--teal);
}

.attachment-chip > span {
  min-width: 0;
}

.attachment-chip strong,
.attachment-chip small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.attachment-chip strong {
  font-size: 12px;
}

.attachment-chip small {
  color: var(--muted);
  font-size: 11px;
}

.attachment-chip button {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 5px;
  color: var(--muted);
  background: transparent;
}

.attachment-chip button:hover {
  color: var(--ink);
  background: #e9ece8;
}

.attachment-chip button .lucide {
  width: 14px;
  height: 14px;
}

.message-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 9px;
}

.message-attachments > span {
  min-height: 32px;
  padding: 5px 9px;
  font-size: 12px;
}

.message-attachments > span.image {
  padding: 5px;
}

.message-attachments img {
  width: 52px;
  height: 52px;
  border: 1px solid #d4d9d5;
  border-radius: 5px;
  object-fit: cover;
  background: #ffffff;
}

.message-attachments small {
  color: var(--muted);
  font-size: 11px;
}

.main-agent-progress {
  max-width: 760px;
  margin: 0;
  border-color: #d8ddd8;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: none;
}

.pending-agent-message .message-actions {
  display: none;
}

.app-shell[data-entry="user"] .codex-empty {
  align-content: end;
  min-height: min(54vh, 520px);
  padding-bottom: 44px;
}

.app-shell[data-entry="user"] .codex-empty::before {
  display: none;
}

.app-shell[data-entry="user"] .codex-empty h3 {
  font-size: 28px;
  letter-spacing: 0;
}

.app-shell[data-entry="user"] .codex-empty p {
  font-size: 15px;
}

.app-shell[data-entry="user"] .quick-prompts {
  width: min(920px, calc(100% - 60px));
}

.app-shell[data-entry="user"] .quick-prompts button {
  min-height: 62px;
  box-shadow: none;
}

.app-shell[data-entry="user"] .inspector {
  padding: 14px 12px;
  background: #f4f5f2;
}

.app-shell[data-entry="user"] .inspector-head {
  min-height: 42px;
  padding: 0 2px 8px;
}

.app-shell[data-entry="user"] .inspector-head .icon-button {
  width: 32px;
  height: 32px;
  border-color: var(--line);
  background: #ffffff;
}

@media (max-width: 1180px) and (min-width: 781px) {
  .app-shell[data-entry="user"] .chat-layout.inspector-open {
    grid-template-columns: minmax(0, 1fr) 310px;
  }
}

@media (max-width: 780px) {
  .app-shell[data-entry="user"] .workspace {
    grid-template-rows: 58px 44px minmax(0, 1fr);
  }

  .app-shell[data-entry="user"] .workspace-header [data-open-password-dialog] {
    display: none;
  }

  .app-shell[data-entry="user"] .workspace-header h2 {
    max-width: min(52vw, 220px);
    -webkit-line-clamp: 1;
  }

  .app-shell[data-entry="user"] .chat-window {
    padding: 24px 16px 18px;
  }

  .app-shell[data-entry="user"] .composer {
    width: calc(100% - 20px);
    margin-bottom: 8px;
  }

  .app-shell[data-entry="user"] .composer-foot {
    gap: 6px;
  }

  .composer-box {
    gap: 4px;
  }

  .composer-attach,
  .composer-voice {
    width: 36px;
    min-width: 36px;
    height: 36px;
  }

  .attachment-chip {
    max-width: min(260px, calc(100vw - 52px));
  }

  .app-shell[data-entry="user"] .security-lock {
    display: none;
  }

  .app-shell[data-entry="user"] .chat-layout.inspector-open {
    grid-template-columns: 1fr;
  }

  .app-shell[data-entry="user"] .chat-layout.inspector-open .codex-inspector {
    position: absolute;
    z-index: 20;
    inset: 0 0 0 auto;
    width: min(92vw, 360px);
    display: grid;
    box-shadow: -16px 0 44px rgba(21, 28, 24, 0.18);
  }

  .app-shell[data-entry="user"] .bubble {
    font-size: 15px;
  }

  .app-shell[data-entry="user"] .message.user .bubble {
    max-width: 100%;
  }

  .app-shell[data-entry="user"] .main-agent-progress {
    max-width: 100%;
  }
}

@media (max-width: 780px) {
  .ai-assistant-launcher {
    right: 16px;
    bottom: 76px;
    width: 60px;
    height: 60px;
  }

  .ai-assistant-drawer {
    inset: auto 0 0;
    width: 100%;
    height: min(78dvh, 720px);
    border-top: 1px solid var(--line-strong);
    border-left: 0;
    border-radius: 8px 8px 0 0;
    box-shadow: 0 -18px 44px rgba(23, 35, 29, 0.18);
    transform: translateY(102%);
  }

  .ai-assistant-drawer.is-open {
    transform: translateY(0);
  }

  .ai-assistant-header {
    min-height: 68px;
    grid-template-columns: 44px minmax(0, 1fr) 38px;
  }

  .ai-assistant-header > img {
    width: 44px;
    height: 44px;
  }
}

@media (max-width: 1050px) {
  .system-overview-columns {
    grid-template-columns: 1fr;
  }

  .system-overview-columns .system-overview-section + .system-overview-section {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .system-overview-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .system-overview-metrics > div:nth-child(2) {
    border-right: 0;
  }

  .system-overview-metrics > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--line);
  }
}

@media (max-width: 680px) {
  .system-overview-section {
    padding-right: 16px;
    padding-left: 16px;
  }

  .system-overview-heading {
    align-items: center;
    flex-direction: row;
    padding-right: 16px;
    padding-left: 16px;
  }

  .system-overview-heading .icon-button {
    margin-left: auto;
  }

  .system-status-band {
    grid-template-columns: 42px minmax(0, 1fr);
    padding: 18px 16px;
  }

  .system-status-mark {
    width: 42px;
    height: 42px;
  }

  .system-status-band > .reset-status {
    grid-column: 2;
    justify-self: start;
  }

  .system-status-band strong {
    font-size: 18px;
  }

  .system-overview-metrics,
  .system-platform-health,
  .system-quick-actions {
    grid-template-columns: 1fr;
  }

  .system-overview-metrics > div,
  .system-platform-row,
  .system-quick-actions button {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .system-overview-metrics > div:last-child,
  .system-platform-row:last-child,
  .system-quick-actions button:last-child {
    border-bottom: 0;
  }

  .system-priority-item {
    grid-template-columns: 10px minmax(0, 1fr);
  }

  .system-priority-item .text-button {
    grid-column: 2;
    justify-self: start;
  }

  .sync-center-tabs {
    padding-right: 12px;
    padding-left: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}