:root {
  --tblr-primary: #13795b;
  --tblr-primary-rgb: 19, 121, 91;
  --tblr-primary-lt: #e7f3ef;
  --tblr-body-color: #202423;
  --tblr-secondary: #626b73;
  --tblr-border-color: #e1e5e3;
  --tblr-body-bg: #f5f6f6;
  --tblr-font-sans-serif: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC',
    'Microsoft YaHei', sans-serif;
}

:root[data-bs-theme="dark"] {
  --tblr-body-color: #e3e9e6;
  --tblr-secondary: #aab7b1;
  --tblr-secondary-color: #aab7b1;
  --tblr-body-bg: #101815;
  --tblr-bg-surface: #1a2520;
  --tblr-bg-surface-secondary: #24332b;
  --tblr-border-color: #3c4e44;
  --tblr-primary: #68d4a8;
  --tblr-primary-rgb: 104, 212, 168;
  --tblr-primary-lt: #203d30;
}
[data-bs-theme="dark"] .workspace-sidebar,
[data-bs-theme="dark"] .workspace-header { background: var(--tblr-bg-surface); }

body {
  letter-spacing: 0;
}

/* Recovery is an operational list, not an unbounded stream of cards. */
#taskRecoveryCard .card-header { justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
#taskRecoveryCard .card-header > div { flex: 1 1 20rem; min-width: 0; }
#taskRecoveryCard .card-subtitle { line-height: 1.6; }
#taskRecoveryList { max-height: 30rem; overflow-y: auto; overflow-wrap: anywhere; }
#taskRecoveryList p { margin: 0; }
[data-bs-theme="dark"] #taskRecoveryCard {
  --tblr-body-color: #d7dcda;
  --tblr-secondary: #a6b1ba;
  --tblr-border-color: #394550;
  color: var(--tblr-body-color);
}
[data-bs-theme="dark"] #taskRecoveryCard .btn { color: #d7dcda; background: transparent; border-color: #52636a; }
[data-bs-theme="dark"] #taskRecoveryCard .btn-outline-primary { color: #69deb1; border-color: #438c70; }

.login-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 2rem;
  background:
    radial-gradient(circle at 18% 18%, rgba(var(--tblr-primary-rgb), 0.1), transparent 32rem),
    var(--tblr-body-bg);
}

.login-panel {
  width: min(100%, 27rem);
  padding: 2.5rem;
  border: 1px solid var(--tblr-border-color);
  border-radius: 12px;
  background: #fff;
}

.login-brand {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin-bottom: 3rem;
}

.ouuuo-brand-mark {
  display: block;
  width: 2rem;
  height: 2rem;
  flex: 0 0 2rem;
  color: var(--tblr-primary);
}

.login-brand strong {
  font-size: 1.35rem;
  letter-spacing: -0.055em;
}

.login-brand strong span,
.login-eyebrow {
  color: var(--tblr-primary);
}

.login-brand small,
.login-copy p,
.login-footnote {
  color: var(--tblr-secondary);
}

.login-eyebrow {
  margin-bottom: 0.55rem;
  font-size: 0.75rem;
  font-weight: 650;
}

.login-copy h1 {
  margin: 0;
  font-size: 1.75rem;
  letter-spacing: -0.025em;
}

.login-copy p {
  margin: 0.65rem 0 1.75rem;
  line-height: 1.7;
}

.login-form {
  display: grid;
  gap: 0.55rem;
}

.login-confirm {
  display: grid;
  gap: 0.55rem;
}

.login-confirm[hidden] {
  display: none;
}

.login-form .btn {
  margin-top: 0.7rem;
  min-height: 2.75rem;
}

.login-error {
  min-height: 1.25rem;
  color: var(--tblr-danger);
  font-size: 0.8125rem;
}

.login-footnote {
  margin: 1.5rem 0 0;
  font-size: 0.75rem;
  text-align: center;
}

.card {
  border-radius: 8px;
  box-shadow: none;
}

.workspace-sidebar {
  background: #fff;
  border-right: 1px solid var(--tblr-border-color);
  box-shadow: none;
}

.workspace-sidebar .navbar-brand {
  align-items: center;
  justify-content: flex-start !important;
  gap: 0.75rem;
  min-height: 4.5rem;
  width: 100%;
  color: var(--tblr-body-color);
}

.workspace-sidebar .ouuuo-brand-mark {
  width: 2rem;
  height: 2rem;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 6px;
  background: var(--tblr-primary);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
}

.brand-copy {
  display: grid;
  gap: 0.1rem;
  line-height: 1.1;
}

.brand-copy strong {
  font-size: 1.125rem;
  letter-spacing: -0.055em;
}

.brand-copy strong span {
  color: var(--tblr-primary);
}

.brand-copy small {
  color: var(--tblr-secondary);
  font-size: 0.6875rem;
  font-weight: 500;
}

.navbar-vertical .nav-link {
  width: 100%;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
  color: var(--tblr-secondary);
}

.navbar-vertical .nav-link:hover,
.navbar-vertical .nav-link.active {
  background: var(--tblr-primary-lt);
  color: var(--tblr-primary);
}

.navbar-vertical .nav-link.active {
  font-weight: 600;
}

.navbar-vertical .nav-link:focus:not(:focus-visible) {
  box-shadow: none;
  outline: 0;
}

.workspace-header {
  min-height: 4.5rem;
  background: #fff;
  border-bottom: 1px solid var(--tblr-border-color);
}

.workspace-header-inner {
  min-height: 4.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.workspace-status {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.connection-state {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: var(--tblr-secondary);
  font-size: 0.8125rem;
}

.connection-dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: var(--tblr-yellow);
}

.connection-state.connected .connection-dot {
  background: var(--tblr-green);
}

.connection-state.failed .connection-dot {
  background: var(--tblr-red);
}

.connection-state.update-available {
  color: var(--tblr-blue);
}

.connection-state.update-available .connection-dot {
  background: var(--tblr-blue);
}

#refresh.has-update {
  color: var(--tblr-blue);
  background: var(--tblr-blue-lt);
}

.metric-strip {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  overflow: hidden;
}

.overview-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 0.2rem 0;
}

.overview-eyebrow {
  margin-bottom: 0.35rem;
  color: var(--tblr-primary);
  font-size: 0.75rem;
  font-weight: 650;
}

.overview-heading h3 {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 650;
}

.overview-heading p {
  margin: 0.35rem 0 0;
  color: var(--tblr-secondary);
  font-size: 0.8125rem;
}

.overview-heading-actions {
  display: grid;
  justify-items: end;
  gap: 0.55rem;
}

.overview-heading-actions > div {
  display: flex;
  gap: 0.5rem;
}

.overview-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.metric-item {
  min-width: 0;
  padding: 1.15rem 1.25rem;
  border-right: 1px solid var(--tblr-border-color);
}

.metric-item:last-child {
  border-right: 0;
}

.metric-label {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.metric-value {
  margin-top: 0.35rem;
  font-size: 1.625rem;
  font-weight: 650;
  line-height: 1;
}

.metric-meta {
  margin-top: 0.45rem;
  overflow: hidden;
  color: var(--tblr-secondary);
  font-size: 0.75rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.overview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  align-items: start;
}

.overview-actions-card,
.overview-projects-card {
  min-width: 0;
}

.overview-action-list {
  display: grid;
  align-content: start;
}

.overview-action {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  min-height: 4.15rem;
  padding: 0.75rem 1.25rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.overview-action:last-child {
  border-bottom: 0;
}

.overview-action-icon {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: var(--tblr-gray-100);
  color: var(--tblr-secondary);
  font-size: 1rem;
}

.overview-action.danger .overview-action-icon {
  background: var(--tblr-red-lt);
  color: var(--tblr-red);
}

.overview-action.warning .overview-action-icon {
  background: var(--tblr-yellow-lt);
  color: var(--tblr-yellow);
}

.overview-action.ok .overview-action-icon {
  background: var(--tblr-green-lt);
  color: var(--tblr-green);
}

.overview-action-copy {
  display: grid;
  min-width: 0;
  gap: 0.15rem;
}

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

.overview-action-copy strong {
  font-size: 0.8125rem;
}

.overview-action-copy span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.overview-project-list {
  display: grid;
}

.overview-project {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.45rem 1rem;
  padding: 0.8rem 1.25rem;
  border: 0;
  border-bottom: 1px solid var(--tblr-border-color);
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.overview-project:last-child {
  border-bottom: 0;
}

.overview-project:hover,
.overview-project:focus-visible {
  background: var(--tblr-bg-surface-secondary);
  outline: none;
}

.overview-project-main {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 0.5rem;
}

.overview-project-main strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.overview-project-meta,
.overview-project-counts {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.overview-project-meta {
  grid-column: 1;
}

.overview-project-counts {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  text-align: right;
  white-space: nowrap;
}

.overview-recent-table {
  min-width: 52rem;
}

.token-input {
  width: 240px;
}

.settings-body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
}

.settings-control {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.settings-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1rem;
}

.settings-page-heading h2 {
  margin: 0.15rem 0 0.25rem;
  font-size: 1.5rem;
}

.settings-page-heading p,
.settings-panel-heading p {
  margin: 0;
  color: var(--tblr-secondary);
}

.settings-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.settings-status-card {
  display: grid;
  gap: 0.25rem;
  padding: 1rem 1.15rem;
}

.settings-status-card > span,
.settings-status-card > small {
  color: var(--tblr-secondary);
}

.settings-status-card > strong {
  overflow: hidden;
  font-size: 1.15rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-status-card.success {
  border-color: color-mix(in srgb, var(--tblr-green) 36%, var(--tblr-border-color));
  background: color-mix(in srgb, var(--tblr-green) 5%, var(--tblr-bg-surface));
}

.settings-status-card.success > strong {
  color: var(--tblr-green);
}

.settings-workspace-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.settings-panel-card {
  padding: 1.2rem 1.25rem;
}

.settings-panel-heading {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.75rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.settings-panel-heading h3 {
  margin: 0 0 0.2rem;
  font-size: 1rem;
}

.settings-panel-heading p {
  font-size: 0.8125rem;
}

.settings-panel-icon {
  display: grid;
  width: 2.25rem;
  height: 2.25rem;
  place-items: center;
  border-radius: 50%;
  background: var(--tblr-primary-lt);
  color: var(--tblr-primary);
  font-size: 1.1rem;
}

.settings-facts {
  display: grid;
  margin: 0;
}

.settings-facts > div {
  display: grid;
  grid-template-columns: 7rem minmax(0, 1fr);
  gap: 1rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--tblr-border-color);
}

.settings-facts dt {
  color: var(--tblr-secondary);
  font-weight: 400;
}

.settings-facts dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  text-align: right;
  font-weight: 600;
}

.settings-panel-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding-top: 1rem;
}

.settings-permission-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding-top: 0.9rem;
}

.settings-permission-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.3rem 0.55rem;
  border-radius: 999px;
  background: var(--tblr-gray-100);
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.settings-permission-tag.enabled {
  background: var(--tblr-green-lt);
  color: var(--tblr-green);
}

.settings-password-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  padding-top: 1rem;
}

.settings-password-form label {
  display: grid;
  gap: 0.35rem;
}

.settings-password-form label > span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.settings-password-submit {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
}

.settings-boundary-list {
  display: grid;
  gap: 0.8rem;
  padding-top: 1rem;
}

.settings-boundary-list > div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.6rem;
  align-items: start;
}

.settings-boundary-list > div > i {
  margin-top: 0.15rem;
  color: var(--tblr-green);
}

.settings-boundary-list span {
  color: var(--tblr-secondary);
}

.settings-boundary-list strong {
  color: var(--tblr-body-color);
}

.relay-manager-body {
  display: grid;
  gap: 1rem;
}

.relay-connections-list {
  display: grid;
  gap: 0.65rem;
}

.relay-connection {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.8rem 0.9rem;
  border: 1px solid var(--tblr-border-color);
  border-radius: 6px;
  background: #fff;
}

.relay-connection-copy {
  min-width: 0;
}

.relay-connection-actions {
  display: grid;
  grid-template-columns: auto minmax(10rem, 14rem) auto auto;
  align-items: center;
  gap: 0.45rem;
}

.relay-create-bar {
  display: grid;
  grid-template-columns: minmax(10rem, 0.8fr) minmax(16rem, 1.4fr) minmax(13rem, 1fr) auto;
  gap: 0.65rem;
  padding-top: 1rem;
  border-top: 1px solid var(--tblr-border-color);
}

.project-create-bar {
  display: grid;
  grid-template-columns: minmax(15rem, 28rem) auto minmax(0, 1fr);
  align-items: center;
  gap: 0.65rem;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.project-name {
  min-width: 10rem;
}

.project-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1rem;
}

.project-page-heading h3 {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 650;
}

.project-page-heading p {
  max-width: 50rem;
  margin: 0.35rem 0 0;
  color: var(--tblr-secondary);
  font-size: 0.8125rem;
}

.project-summary-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--tblr-border-color);
}

.project-summary-item {
  display: grid;
  gap: 0.25rem;
  padding: 1rem 1.25rem;
  border-right: 1px solid var(--tblr-border-color);
}

.project-summary-item:last-child {
  border-right: 0;
}

.project-summary-item span,
.project-workspace-metrics span,
.project-workspace-settings label > span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.project-summary-item strong {
  font-size: 1.35rem;
  line-height: 1.1;
}

.project-workspace-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.project-workspace {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--tblr-border-color);
  border-radius: 8px;
  background: #fff;
}

.project-workspace-header,
.project-workspace-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.9rem 1rem;
}

.project-workspace-header {
  border-bottom: 1px solid var(--tblr-border-color);
}

.project-workspace-title {
  display: grid;
  min-width: 0;
  gap: 0.3rem;
}

.project-workspace-title strong {
  font-size: 1rem;
}

.project-workspace-title > span {
  overflow: hidden;
  color: var(--tblr-secondary);
  font-size: 0.72rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-workspace-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  padding: 0.95rem 1rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.project-workspace-metrics > div {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
  padding: 0 0.55rem;
  border-right: 1px solid var(--tblr-border-color);
}

.project-workspace-metrics > div:first-child {
  padding-left: 0;
}

.project-workspace-metrics > div:last-child {
  padding-right: 0;
  border-right: 0;
}

.project-workspace-metrics strong {
  font-size: 1rem;
}

.project-workspace-metrics .has-risk strong {
  color: var(--tblr-red);
}

.project-workspace-metrics .has-warning strong {
  color: var(--tblr-yellow);
}

.project-workspace-settings {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(9rem, 0.8fr);
  gap: 0.75rem;
  padding: 0.9rem 1rem;
}

.project-workspace-settings label {
  display: grid;
  min-width: 0;
  gap: 0.35rem;
  margin: 0;
}

.project-workspace-footer {
  min-height: 3.6rem;
  border-top: 1px solid var(--tblr-border-color);
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.project-workspace-footer > div {
  display: flex;
  gap: 0.35rem;
}

.project-empty {
  display: grid;
  justify-items: center;
  gap: 0.5rem;
  padding: 2.5rem 1rem;
  color: var(--tblr-secondary);
  text-align: center;
}

.project-empty i {
  font-size: 1.5rem;
}

.project-empty strong {
  color: var(--tblr-body-color);
}

.project-relay-card {
  margin-top: 1rem;
}

.relay-empty {
  padding: 1rem !important;
  border: 1px dashed var(--tblr-border-color);
  border-radius: 6px;
}

.member-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.member-page-heading h2,
.member-page-heading p {
  margin: 0;
}

.member-page-heading p {
  margin-top: 0.3rem;
  color: var(--tblr-secondary);
}

.member-summary-card {
  margin-bottom: 1rem;
}

.member-summary-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.member-summary-strip > div {
  display: grid;
  gap: 0.25rem;
  padding: 1rem 1.25rem;
  border-right: 1px solid var(--tblr-border-color);
}

.member-summary-strip > div:last-child {
  border-right: 0;
}

.member-summary-strip span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.member-summary-strip strong {
  font-size: 1.45rem;
  line-height: 1.1;
}

.member-create-panel {
  margin-bottom: 1rem;
  overflow: hidden;
}

.member-create-panel > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.25rem;
  cursor: pointer;
  list-style: none;
}

.member-create-panel > summary::-webkit-details-marker {
  display: none;
}

.member-create-panel > summary > div {
  display: grid;
  gap: 0.2rem;
}

.member-create-panel > summary strong {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.member-create-panel > summary span {
  color: var(--tblr-secondary);
  font-size: 0.8125rem;
}

.member-create-panel[open] .member-create-chevron {
  transform: rotate(180deg);
}

.member-create-chevron {
  transition: transform 160ms ease;
}

.member-create-bar {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  padding: 1.1rem 1.25rem 1.25rem;
  border-top: 1px solid var(--tblr-border-color);
  background: var(--tblr-bg-surface-secondary);
}

.member-create-bar > label,
.member-control-grid > label {
  display: grid;
  align-content: start;
  gap: 0.4rem;
  margin: 0;
}

.member-create-bar > label > span,
.member-control-grid > label > span,
.member-create-scope > span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
  font-weight: 600;
}

.member-create-scope {
  display: grid;
  grid-column: 1 / -1;
  gap: 0.5rem;
}

.member-create-guidance {
  display: grid;
  grid-column: 1 / span 2;
  gap: 0.2rem;
  align-content: center;
  min-height: 3rem;
  padding: 0.65rem 0.8rem;
  border-left: 3px solid var(--tblr-primary);
  background: var(--tblr-primary-lt);
}

.member-create-guidance span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.member-create-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
}

.member-directory-card {
  overflow: hidden;
}

.member-toolbar {
  display: grid;
  grid-template-columns: minmax(15rem, 1fr) 10rem 9rem auto;
  gap: 0.65rem;
  align-items: center;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.member-search-wrap {
  position: relative;
}

.member-search-wrap i {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 0.75rem;
  color: var(--tblr-secondary);
  transform: translateY(-50%);
}

.member-search-wrap input {
  padding-left: 2.25rem;
}

.member-page-status {
  min-height: 0;
  padding: 0 1.25rem;
  color: var(--tblr-primary);
  font-size: 0.75rem;
}

.member-page-status:not(:empty) {
  padding-top: 0.75rem;
}

.member-list {
  display: grid;
  gap: 0.75rem;
  padding: 1rem 1.25rem 1.25rem;
}

.member-card {
  overflow: hidden;
  border: 1px solid var(--tblr-border-color);
  border-radius: 7px;
  background: var(--tblr-bg-surface);
}

.member-card.is-disabled {
  background: var(--tblr-bg-surface-secondary);
}

.member-card-header {
  display: grid;
  grid-template-columns: auto minmax(12rem, 1fr) auto;
  gap: 0.8rem;
  align-items: center;
  padding: 0.9rem 1rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.member-avatar {
  display: grid;
  width: 2.35rem;
  height: 2.35rem;
  place-items: center;
  border-radius: 50%;
  background: var(--tblr-primary-lt);
  color: var(--tblr-primary);
  font-weight: 700;
}

.member-identity,
.member-identity > div {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.member-identity {
  align-items: flex-start;
  flex-direction: column;
  gap: 0.2rem;
}

.member-identity > span {
  overflow: hidden;
  color: var(--tblr-secondary);
  font-size: 0.75rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.member-card-body {
  display: grid;
  grid-template-columns: minmax(14rem, 0.85fr) minmax(16rem, 1.15fr) minmax(17rem, 1fr);
}

.member-control-section {
  min-width: 0;
  padding: 1rem;
  border-right: 1px solid var(--tblr-border-color);
}

.member-control-section:last-child {
  border-right: 0;
}

.member-control-section h4 {
  margin: 0 0 0.75rem;
  font-size: 0.8125rem;
}

.member-control-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
}

.member-role-explanation {
  display: grid;
  gap: 0.15rem;
  margin-top: 0.65rem;
}

.member-role-explanation strong,
.member-role-explanation span,
.member-scope-hint {
  font-size: 0.72rem;
}

.member-role-explanation span,
.member-scope-hint {
  color: var(--tblr-secondary);
}

.member-project-options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.member-project-option {
  position: relative;
  margin: 0;
  cursor: pointer;
}

.member-project-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.member-project-option span,
.member-project-inherited,
.member-inherited-access {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  min-height: 2rem;
  padding: 0.35rem 0.65rem;
  border: 1px solid var(--tblr-border-color);
  border-radius: 5px;
  background: var(--tblr-bg-surface);
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.member-project-option input:checked + span {
  border-color: color-mix(in srgb, var(--tblr-primary) 45%, var(--tblr-border-color));
  background: var(--tblr-primary-lt);
  color: var(--tblr-primary);
}

.member-project-option input:disabled + span {
  cursor: default;
  opacity: 0.7;
}

.member-project-empty,
.member-scope-hint {
  display: block;
  padding: 0.35rem 0;
}

.member-inherited-access {
  display: grid;
  grid-template-columns: auto auto 1fr;
  width: 100%;
  border-color: color-mix(in srgb, var(--tblr-primary) 28%, var(--tblr-border-color));
  background: var(--tblr-primary-lt);
  color: var(--tblr-primary);
}

.member-inherited-access span {
  color: var(--tblr-secondary);
  text-align: right;
}

.member-usage-numbers {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
}

.member-usage-numbers > div {
  display: grid;
  gap: 0.1rem;
}

.member-usage-numbers span,
.member-quota-readonly,
.member-unlimited {
  color: var(--tblr-secondary);
  font-size: 0.72rem;
}

.member-usage-progress {
  height: 0.35rem;
  margin: 0.8rem 0;
  overflow: hidden;
  border-radius: 99px;
  background: var(--tblr-gray-200);
}

.member-usage-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--tblr-primary);
}

.member-usage-progress.active i {
  background: var(--tblr-yellow);
}

.member-usage-progress.danger i {
  background: var(--tblr-danger);
}

.member-unlimited {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  min-height: 2rem;
  margin: 0.45rem 0;
}

.member-password-dialog {
  width: min(92vw, 31rem);
  padding: 0;
  border: 0;
  border-radius: 10px;
  box-shadow: 0 1.5rem 4rem rgba(24, 36, 32, 0.18);
}

.member-password-dialog::backdrop {
  background: rgba(20, 26, 24, 0.45);
}

.member-password-card {
  display: grid;
  gap: 0.7rem;
  padding: 1.5rem;
}

.member-password-card header,
.member-password-card footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.member-password-card header {
  margin-bottom: 0.5rem;
}

.member-password-card header h3,
.member-password-card header p {
  margin: 0;
}

.member-password-card header p {
  margin-top: 0.25rem;
  color: var(--tblr-secondary);
  font-size: 0.8125rem;
}

.member-password-card footer {
  justify-content: flex-end;
  margin-top: 0.5rem;
}

.token-notice {
  display: grid;
  gap: 0.75rem;
  margin: 0.9rem 1.25rem 0;
  padding: 0.75rem 0.9rem;
  border-left: 3px solid var(--tblr-primary);
  background: var(--tblr-primary-lt);
  color: var(--tblr-secondary);
  font-size: 0.8125rem;
}

.token-notice-main {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.token-notice-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.token-notice code {
  padding: 0.25rem 0.45rem;
  border-radius: 4px;
  background: #fff;
  color: var(--tblr-body-color);
  user-select: all;
}

.member-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.25rem;
  white-space: nowrap;
}

.member-quota-control {
  display: grid;
  grid-template-columns: minmax(7.5rem, 1fr) minmax(5rem, 0.8fr);
  gap: 0.4rem;
}

.member-quota-control .member-quota[hidden] {
  display: none;
}

.member-readonly-note {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.member-empty {
  display: grid;
  justify-items: center;
  gap: 0.35rem;
  padding: 3rem 1rem;
  color: var(--tblr-secondary);
  text-align: center;
}

.member-empty i {
  font-size: 1.6rem;
}

.member-empty strong {
  color: var(--tblr-body-color);
}

.billing-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1rem;
}

.billing-page-heading h2 {
  margin: 0.15rem 0 0.25rem;
  font-size: 1.5rem;
}

.billing-page-heading p,
.billing-control-copy p {
  margin: 0;
  color: var(--tblr-secondary);
}

.billing-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.billing-summary-card {
  display: grid;
  gap: 0.25rem;
  padding: 1.1rem 1.25rem;
}

.billing-summary-card span,
.billing-summary-card small {
  color: var(--tblr-secondary);
}

.billing-summary-card strong {
  font-size: 1.65rem;
  line-height: 1.2;
}

.billing-summary-card.primary {
  border-color: color-mix(in srgb, var(--tblr-primary) 38%, var(--tblr-border-color));
  background: color-mix(in srgb, var(--tblr-primary) 5%, var(--tblr-bg-surface));
}

.billing-attention-card,
.billing-reconciliation-card,
.billing-ledger-card,
.billing-control-grid {
  margin-bottom: 1rem;
}

.billing-attention-card.is-clear .card-header {
  border-bottom: 0;
}

.billing-attention-list {
  display: grid;
  gap: 0.65rem;
  padding: 0.85rem 1.25rem 1.1rem;
}

.billing-attention-card.is-clear .billing-attention-list {
  padding-top: 0;
}

.billing-attention-item,
.billing-attention-clear {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.75rem;
}

.billing-attention-item {
  padding: 0.75rem;
  border: 1px solid var(--tblr-border-color);
  border-radius: var(--tblr-border-radius);
  background: var(--tblr-bg-surface-secondary);
}

.billing-attention-item.danger {
  border-color: color-mix(in srgb, var(--tblr-red) 35%, var(--tblr-border-color));
}

.billing-attention-icon,
.billing-attention-clear > i {
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border-radius: 50%;
  background: var(--tblr-yellow-lt);
  color: var(--tblr-yellow);
  font-size: 1rem;
}

.billing-attention-item.danger .billing-attention-icon {
  background: var(--tblr-red-lt);
  color: var(--tblr-red);
}

.billing-attention-clear > i {
  background: var(--tblr-green-lt);
  color: var(--tblr-green);
}

.billing-attention-item div,
.billing-attention-clear div {
  display: grid;
  gap: 0.1rem;
}

.billing-attention-item span,
.billing-attention-clear span {
  color: var(--tblr-secondary);
  font-size: 0.8125rem;
}

.billing-control-grid {
  display: grid;
  grid-template-columns: minmax(17rem, 0.8fr) minmax(34rem, 1.7fr);
  gap: 1rem;
}

.billing-control-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 1.25rem;
}

.billing-control-copy h3,
.billing-adjust-heading h3 {
  margin: 0.15rem 0 0.35rem;
  font-size: 1rem;
}

.billing-mode-switch {
  flex: 0 0 auto;
  margin: 0;
}

.billing-adjust-card {
  padding: 1.1rem 1.25rem;
}

.billing-adjust-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.8rem;
}

.credit-adjust-form {
  display: grid;
  grid-template-columns: 7rem 8rem minmax(13rem, 1fr) auto;
  align-items: end;
  gap: 0.65rem;
}

.credit-adjust-form label {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
}

.credit-adjust-form label > span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.credit-adjust-form .btn,
.credit-adjust-form .form-control,
.credit-adjust-form .form-select {
  height: 2.5rem;
}

.reconciliation-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(8rem, 0.75fr)) repeat(2, minmax(14rem, 1.25fr));
  background: var(--tblr-body-bg);
}

.reconciliation-metric {
  min-width: 0;
  padding: 0.9rem 1.25rem;
  border-right: 1px solid var(--tblr-border-color);
}

.reconciliation-metric:last-child {
  border-right: 0;
}

.reconciliation-metric span,
.reconciliation-metric strong {
  display: block;
}

.reconciliation-metric span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.reconciliation-metric strong {
  margin-top: 0.3rem;
  font-size: 1.125rem;
  font-weight: 650;
}

.reconciliation-table {
  max-height: 25rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.reconciliation-table td:first-child strong {
  display: block;
  max-width: 15rem;
  overflow: hidden;
  font-family: var(--tblr-font-monospace);
  font-size: 0.75rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.billing-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.9rem 1.25rem;
  border-top: 1px solid var(--tblr-border-color);
  border-bottom: 1px solid var(--tblr-border-color);
  cursor: pointer;
  font-weight: 650;
  list-style-position: inside;
}

.billing-details-note {
  padding: 0.7rem 1.25rem;
  border-bottom: 1px solid var(--tblr-border-color);
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.audit-table {
  max-height: 31rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.audit-table td:first-child strong {
  white-space: nowrap;
}

.ledger-toolbar {
  display: grid;
  grid-template-columns: 11rem 13rem minmax(16rem, 1fr);
  align-items: center;
  gap: 0.65rem;
  padding: 0.8rem 1.25rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.asset-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1rem;
}

.asset-page-heading h3 {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 650;
}

.asset-page-heading p {
  max-width: 52rem;
  margin: 0.35rem 0 0;
  color: var(--tblr-secondary);
  font-size: 0.8125rem;
}

.asset-toolbar {
  display: grid;
  grid-template-columns: minmax(12rem, 0.8fr) minmax(18rem, 1.6fr) minmax(10rem, 0.7fr);
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.asset-toolbar label {
  display: grid;
  min-width: 0;
  gap: 0.35rem;
  margin: 0;
}

.asset-toolbar label > span,
.asset-summary-strip span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

#assetProjectFilter {
  width: 100%;
}

#assetsCount {
  min-width: max-content;
  white-space: nowrap;
}

.asset-summary-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.asset-summary-strip > div {
  display: grid;
  gap: 0.25rem;
  padding: 1rem 1.25rem;
  border-right: 1px solid var(--tblr-border-color);
}

.asset-summary-strip > div:last-child {
  border-right: 0;
}

.asset-summary-strip strong {
  font-size: 1.35rem;
  line-height: 1.1;
}

.asset-review-status {
  padding: 0.65rem 1.25rem;
  border-bottom: 1px solid var(--tblr-border-color);
  background: var(--tblr-primary-lt);
  color: var(--tblr-primary);
  font-size: 0.8125rem;
}

.asset-review-status:empty {
  display: none;
}

.asset-review-list {
  display: grid;
}

.asset-review-item {
  display: grid;
  grid-template-columns: minmax(15rem, 0.9fr) minmax(16rem, 1.5fr) auto;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.asset-review-item:last-child {
  border-bottom: 0;
}

.asset-review-compare {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 0.5rem;
}

.asset-review-preview {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--tblr-secondary);
  font-size: 0.7rem;
  text-align: left;
  cursor: zoom-in;
}

.asset-review-preview.is-empty {
  cursor: default;
}

.asset-review-media {
  display: grid;
  place-items: center;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 1px solid var(--tblr-border-color);
  border-radius: 6px;
  background: var(--tblr-body-bg);
}

.asset-review-preview.candidate .asset-review-media {
  border-color: color-mix(in srgb, var(--tblr-primary) 45%, var(--tblr-border-color));
}

.asset-review-media img,
.asset-review-media video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #f8f9fa;
}

.asset-review-media small {
  font-size: 0.65rem;
}

.asset-review-arrow {
  color: var(--tblr-secondary);
}

.asset-review-copy {
  display: grid;
  min-width: 0;
  gap: 0.25rem;
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.asset-review-heading {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.asset-review-heading strong {
  color: var(--tblr-body-color);
  font-size: 0.95rem;
}

.asset-review-copy p {
  margin: 0.35rem 0 0;
}

.asset-review-prompt {
  display: -webkit-box;
  overflow: hidden;
  color: var(--tblr-body-color);
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.asset-review-actions {
  display: grid;
  gap: 0.5rem;
  min-width: 9rem;
}

.asset-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  align-items: stretch;
  gap: 1rem;
  padding: 1rem;
  background: var(--tblr-bg-surface);
  border-top: 1px solid var(--tblr-border-color);
}

.asset-item {
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  padding: 0.85rem;
  border: 1px solid var(--tblr-border-color);
  border-radius: 7px;
  background: var(--tblr-bg-surface);
}

.asset-preview {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 1px solid var(--tblr-border-color);
  border-radius: 6px;
  background: var(--tblr-body-bg);
  color: var(--tblr-secondary);
  font-size: 1.75rem;
}

.asset-preview[data-asset-ready='true'] {
  cursor: zoom-in;
}

.asset-open {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 5px;
  background: rgba(20, 24, 23, 0.72);
  color: #fff;
  opacity: 0;
  transition: opacity 120ms ease;
}

.asset-preview:hover .asset-open,
.asset-preview:focus-within .asset-open {
  opacity: 1;
}

.asset-preview img,
.asset-preview video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #f8f9fa;
}

.asset-audio {
  width: 100%;
  height: 100%;
  display: grid;
  place-content: center;
  gap: 0.75rem;
  color: var(--tblr-secondary);
  text-align: center;
}

.asset-audio i {
  font-size: 2rem;
}

.asset-audio audio {
  width: min(100%, 17rem);
}

.asset-copy {
  display: grid;
  flex: 1;
  gap: 0.2rem;
  padding-top: 0.65rem;
}

.asset-title-line {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
}

.asset-title-line strong {
  flex: 1;
  min-width: 0;
}

.asset-prompt {
  display: -webkit-box;
  overflow: hidden;
  min-height: 2.7em;
  margin: 0.3rem 0 0;
  color: var(--tblr-secondary);
  font-size: 0.75rem;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.asset-candidate {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-top: 0.45rem;
  padding: 0.5rem;
  border: 1px solid var(--tblr-border-color);
  border-radius: 5px;
  background: var(--tblr-bg-surface-secondary);
}

.asset-candidate > div {
  display: grid;
  min-width: 0;
}

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

.asset-copy span,
.asset-copy small {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.asset-details-open {
  align-self: end;
  justify-self: start;
  margin-top: auto;
  padding-left: 0;
  padding-right: 0;
  font-size: 0.75rem;
}

.asset-empty {
  grid-column: 1 / -1;
  background: var(--tblr-bg-surface);
}

.asset-viewer {
  width: 100vw;
  max-width: none;
  height: 100vh;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff;
}

.asset-viewer::backdrop {
  background: rgba(8, 10, 10, 0.92);
}

.asset-viewer-shell {
  position: relative;
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  background: rgba(8, 10, 10, 0.96);
}

.asset-viewer-header {
  min-width: 0;
  height: 4rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0 1.25rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

.asset-viewer-header strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.asset-viewer-content {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(22rem, 1fr);
}

.asset-viewer-stage {
  position: relative;
  min-width: 0;
  min-height: 0;
  display: grid;
  border-right: 1px solid rgba(255, 255, 255, 0.14);
}

.asset-viewer-media {
  min-width: 0;
  min-height: 0;
  display: grid;
  place-items: center;
  padding: 1.5rem 5rem;
}

.asset-viewer-media img,
.asset-viewer-media video {
  width: auto;
  height: auto;
  max-width: calc(65vw - 6rem);
  max-height: calc(100vh - 7rem);
  object-fit: contain;
}

.asset-viewer-media audio {
  width: min(32rem, calc(65vw - 6rem));
}

.asset-viewer-unavailable {
  max-width: 24rem;
  padding: 1.25rem;
  border: 1px dashed rgba(255, 255, 255, 0.2);
  border-radius: 8px;
  color: rgba(255, 255, 255, 0.66);
  text-align: center;
}

.asset-viewer-details {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  padding: 1.5rem;
  background: #f8faf9;
  color: #202423;
}

.asset-detail-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.asset-detail-heading h2 {
  margin: 0.25rem 0 0;
  font-size: 1.35rem;
  line-height: 1.3;
}

.asset-detail-eyebrow {
  color: var(--tblr-primary);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.asset-detail-reference {
  flex: 0 0 auto;
  padding: 0.3rem 0.55rem;
  border-radius: 999px;
  background: var(--tblr-primary-lt);
  color: var(--tblr-primary);
  font-size: 0.75rem;
  font-weight: 600;
}

.asset-detail-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.9rem;
}

.asset-detail-badges span {
  padding: 0.25rem 0.5rem;
  border: 1px solid #dfe5e2;
  border-radius: 5px;
  color: #52605a;
  font-size: 0.72rem;
}

.asset-detail-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem 1rem;
  margin: 1.25rem 0;
  padding: 1rem;
  border: 1px solid #e1e5e3;
  border-radius: 8px;
  background: #fff;
}

.asset-detail-meta div {
  min-width: 0;
}

.asset-detail-meta dt {
  color: #737d78;
  font-size: 0.7rem;
}

.asset-detail-meta dd {
  overflow-wrap: anywhere;
  margin: 0.25rem 0 0;
  font-size: 0.82rem;
  font-weight: 600;
}

.asset-detail-section {
  margin-top: 1rem;
}

.asset-detail-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.45rem;
}

.asset-detail-section-head h3 {
  margin: 0;
  font-size: 0.86rem;
}

.asset-detail-copy {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--tblr-primary);
  font-size: 0.72rem;
  cursor: pointer;
}

.asset-detail-text {
  max-height: 18rem;
  overflow: auto;
  margin: 0;
  padding: 0.85rem;
  border: 1px solid #e1e5e3;
  border-radius: 7px;
  background: #fff;
  color: #303735;
  font-family: inherit;
  font-size: 0.8rem;
  line-height: 1.65;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.asset-detail-text.is-empty {
  color: #8b9490;
  font-style: italic;
}

.asset-version-history .asset-detail-section-head > span {
  color: #737d78;
  font-size: 0.7rem;
}

.asset-version-list {
  display: grid;
  overflow: hidden;
  border: 1px solid #e1e5e3;
  border-radius: 7px;
  background: #fff;
}

.asset-version-row {
  display: grid;
  gap: 0.3rem;
  padding: 0.75rem 0.85rem;
  border-bottom: 1px solid #e8ecea;
}

.asset-version-row:last-child {
  border-bottom: 0;
}

.asset-version-row > div {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.asset-version-row > span {
  color: #737d78;
  font-size: 0.7rem;
}

.asset-version-row p {
  margin: 0;
  color: #52605a;
  font-size: 0.75rem;
  line-height: 1.5;
}

.asset-version-empty {
  padding: 0.85rem;
  color: #8b9490;
  font-size: 0.75rem;
}

.asset-viewer-nav {
  position: absolute;
  z-index: 2;
  top: 50%;
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 3.5rem;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  font-size: 1.5rem;
  transform: translateY(-50%);
}

.asset-viewer-nav:hover {
  background: rgba(255, 255, 255, 0.16);
}

.asset-viewer-nav.previous {
  left: 1rem;
}

.asset-viewer-nav.next {
  right: 1rem;
}

.view {
  display: none;
}

.view.active {
  display: block;
}

.capability-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1rem;
}

.capability-page-heading h2,
.capability-page-heading p,
.capability-section-heading h3,
.capability-section-heading p {
  margin: 0;
}

.capability-page-heading h2 {
  margin-top: 0.2rem;
  font-size: 1.4rem;
}

.capability-page-heading p,
.capability-section-heading p,
.capability-boundary-card p {
  margin-top: 0.3rem;
  color: var(--tblr-secondary);
}

.capability-page-eyebrow,
.section-kicker {
  color: var(--tblr-primary);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.capability-heading-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex: 0 0 auto;
}

.capability-summary-card,
.capability-section-card {
  margin-bottom: 1rem;
}

.capability-summary-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.capability-summary-strip > div {
  display: grid;
  gap: 0.25rem;
  padding: 1rem 1.25rem;
  border-right: 1px solid var(--tblr-border-color);
}

.capability-summary-strip > div:last-child {
  border-right: 0;
}

.capability-summary-strip span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.capability-summary-strip strong {
  font-size: 1.15rem;
}

.capability-boundary-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 1rem 1.25rem;
  border: 1px solid color-mix(in srgb, var(--tblr-primary) 28%, var(--tblr-border-color));
  border-radius: var(--tblr-border-radius-lg);
  background: color-mix(in srgb, var(--tblr-primary) 5%, var(--tblr-bg-surface));
}

.capability-boundary-card p {
  margin-bottom: 0;
}

.capability-boundary-icon,
.channel-capability-icon {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.7rem;
  background: color-mix(in srgb, var(--tblr-primary) 12%, transparent);
  color: var(--tblr-primary);
  font-size: 1.2rem;
}

.capability-section-heading {
  padding: 1.1rem 1.25rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.capability-section-heading h3 {
  margin-top: 0.15rem;
  font-size: 1.05rem;
}

.channel-capability-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  padding: 1rem;
}

.channel-capability-card,
.model-capability-card {
  border: 1px solid var(--tblr-border-color);
  border-radius: var(--tblr-border-radius-lg);
  background: var(--tblr-bg-surface);
  transition: border-color 120ms ease, box-shadow 120ms ease;
}

.channel-capability-card.is-enabled,
.model-capability-card.is-enabled {
  border-color: color-mix(in srgb, var(--tblr-primary) 36%, var(--tblr-border-color));
}

.channel-capability-card {
  padding: 1rem;
}

.channel-capability-card > p {
  min-height: 2.5rem;
  margin: 0.9rem 0;
  color: var(--tblr-secondary);
  font-size: 0.8125rem;
}

.channel-capability-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
}

.channel-capability-head > div {
  display: grid;
}

.channel-capability-head span:not(.channel-capability-icon):not(.runtime-state) {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.runtime-state {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.6rem;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  white-space: nowrap;
}

.runtime-state.success {
  background: var(--tblr-success-lt);
  color: var(--tblr-success);
}

.runtime-state.muted {
  background: var(--tblr-secondary-lt);
  color: var(--tblr-secondary);
}

.channel-capability-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 2rem;
  color: var(--tblr-secondary);
  font-size: 0.78rem;
}

.runtime-advanced {
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--tblr-border-color);
}

.runtime-advanced summary {
  color: var(--tblr-secondary);
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 600;
}

.runtime-advanced-body,
.model-advanced-grid {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.75rem;
}

.runtime-advanced-body label,
.model-advanced-grid label,
.model-primary-grid label {
  display: grid;
  grid-template-rows: 1rem minmax(2.4rem, auto);
  gap: 0.4rem;
  margin: 0;
}

.runtime-advanced-body label > span,
.model-advanced-grid label > span,
.model-primary-grid label > span:first-child {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.model-capability-list {
  display: grid;
  gap: 1rem;
  padding: 1rem;
}

.model-capability-card {
  padding: 1.1rem;
}

.model-capability-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.model-capability-head h4 {
  margin: 0.15rem 0 0;
  font-size: 1rem;
}

.model-family {
  color: var(--tblr-primary);
  font-size: 0.72rem;
  font-weight: 700;
}

.model-capability-state {
  display: flex;
  align-items: center;
  gap: 0.9rem;
}

.model-primary-grid {
  display: grid;
  grid-template-columns: minmax(11rem, 1fr) minmax(11rem, 1fr) minmax(14rem, 1.2fr);
  gap: 0.85rem;
  margin-top: 1rem;
}

.runtime-radio {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-height: 2.4rem;
  padding: 0 0.75rem;
  border: 1px solid var(--tblr-border-color);
  border-radius: var(--tblr-border-radius);
  font-size: 0.78rem;
}

.model-role-fieldset {
  margin: 1rem 0 0;
  padding: 0;
  border: 0;
}

.model-role-fieldset legend {
  margin-bottom: 0.45rem;
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.model-role-options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.model-role-options label {
  cursor: pointer;
}

.model-role-options input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.model-role-options span,
.model-spec-row span {
  display: inline-flex;
  align-items: center;
  min-height: 1.75rem;
  padding: 0.2rem 0.6rem;
  border: 1px solid var(--tblr-border-color);
  border-radius: 999px;
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.model-role-options input:checked + span {
  border-color: color-mix(in srgb, var(--tblr-primary) 45%, var(--tblr-border-color));
  background: color-mix(in srgb, var(--tblr-primary) 9%, transparent);
  color: var(--tblr-primary);
  font-weight: 650;
}

.model-role-options input:focus-visible + span {
  outline: 2px solid var(--tblr-primary);
  outline-offset: 2px;
}

.model-spec-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.9rem;
}

.model-advanced-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.model-advanced-grid .wide {
  grid-column: span 2;
}

.channel-capability-grid.read-only :disabled,
.model-capability-list.read-only :disabled {
  cursor: default;
  opacity: 0.72;
}

.jobs-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1rem;
}

.jobs-page-heading h2,
.jobs-page-heading p {
  margin: 0;
}

.jobs-page-heading h2 {
  margin-top: 0.2rem;
  font-size: 1.4rem;
}

.jobs-page-heading p {
  margin-top: 0.3rem;
  color: var(--tblr-secondary);
}

.jobs-page-eyebrow {
  color: var(--tblr-primary);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.production-task-create-card,
.production-task-board {
  margin-bottom: 1rem;
}

.production-task-create-form {
  display: grid;
  grid-template-columns: minmax(10rem, 0.8fr) minmax(10rem, 0.8fr) minmax(16rem, 1.4fr) auto;
  gap: 0.85rem;
  padding: 1rem;
}

.production-task-create-form label {
  display: grid;
  grid-template-rows: 1rem minmax(2.5rem, auto);
  gap: 0.4rem;
  margin: 0;
}

.production-task-create-form label > span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.production-task-brief {
  grid-column: 1 / -2;
}

.production-task-create-actions {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 0.75rem;
  min-width: 10rem;
}

.production-task-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border-bottom: 1px solid var(--tblr-border-color);
}

.production-task-summary > div {
  display: grid;
  gap: 0.2rem;
  padding: 0.8rem 1rem;
  border-right: 1px solid var(--tblr-border-color);
}

.production-task-summary > div:last-child {
  border-right: 0;
}

.production-task-summary span,
.production-task-meta,
.production-task-heading > div > span,
.production-task-action-note {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.production-task-summary strong {
  font-size: 1.2rem;
}

.production-task-list {
  display: grid;
}

.production-task-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(12rem, auto);
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.production-task-item:last-child {
  border-bottom: 0;
}

.production-task-main,
.production-task-heading > div {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
}

.production-task-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.production-task-heading strong {
  font-size: 0.92rem;
}

.production-task-main > p {
  max-width: 72rem;
  margin: 0.25rem 0;
  color: #424b47;
  font-size: 0.8125rem;
  line-height: 1.55;
  white-space: pre-wrap;
}

.production-task-meta,
.production-task-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.production-task-review {
  display: grid;
  gap: 0.15rem;
  padding: 0.65rem 0.75rem;
  border-left: 3px solid var(--tblr-danger);
  background: var(--tblr-red-lt);
  color: #713136;
  font-size: 0.78rem;
}

.production-task-actions {
  justify-content: flex-end;
}

.production-task-job {
  width: min(23rem, 34vw);
}

.production-task-empty {
  display: grid;
  justify-items: center;
  gap: 0.35rem;
  padding: 2rem 1rem;
  color: var(--tblr-secondary);
  text-align: center;
}

.production-task-empty i {
  font-size: 1.4rem;
}

.production-task-empty strong {
  color: var(--tblr-body-color);
}

.jobs-scope-card,
.jobs-attention-section,
.jobs-active-section {
  margin-bottom: 1rem;
}

.jobs-toolbar {
  display: grid;
  grid-template-columns: minmax(10rem, 0.8fr) minmax(10rem, 0.8fr) minmax(9rem, 0.7fr) minmax(16rem, 1.7fr);
  gap: 0.75rem;
  padding: 1rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.jobs-toolbar label {
  display: grid;
  grid-template-rows: 1rem 2.5rem;
  gap: 0.4rem;
  margin: 0;
}

.jobs-toolbar label > span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.jobs-toolbar .form-control,
.jobs-toolbar .form-select {
  min-height: 2.5rem;
}

.jobs-summary-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.jobs-summary-strip > div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
  padding: 0.85rem 1rem;
  border-right: 1px solid var(--tblr-border-color);
}

.jobs-summary-strip > div:last-child {
  border-right: 0;
}

.jobs-summary-strip span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.jobs-summary-strip strong {
  font-size: 1.35rem;
}

.jobs-attention-list {
  display: grid;
}

.job-attention-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.job-attention-item:last-child {
  border-bottom: 0;
}

.job-attention-icon {
  display: grid;
  width: 2.4rem;
  height: 2.4rem;
  place-items: center;
  border-radius: 0.65rem;
  background: var(--tblr-red-lt);
  color: var(--tblr-danger);
  font-size: 1.15rem;
}

.job-attention-copy {
  display: grid;
  gap: 0.28rem;
  min-width: 0;
}

.job-attention-heading {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.job-attention-heading strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.job-attention-copy > span,
.job-attention-copy small {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.job-attention-copy p {
  margin: 0.2rem 0 0;
  color: var(--tblr-danger);
}

.jobs-active-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  padding: 1rem;
}

.job-active-item {
  display: grid;
  gap: 0.55rem;
  min-width: 0;
  padding: 1rem;
  border: 1px solid var(--tblr-border-color);
  border-radius: 0.65rem;
  background: var(--tblr-bg-surface);
}

.job-active-heading,
.job-active-footer,
.job-active-progress {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.job-active-heading strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.job-active-item > span,
.job-active-footer > span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.job-active-item p {
  margin: 0;
  color: var(--tblr-secondary);
  font-size: 0.8125rem;
}

.job-active-progress .progress {
  width: auto;
  flex: 1;
}

.jobs-table th:last-child,
.jobs-table td:last-child {
  width: 1%;
  white-space: nowrap;
}

.job-error-summary {
  overflow: hidden;
  max-width: 32rem;
  margin-top: 0.35rem;
  color: var(--tblr-danger);
  font-size: 0.75rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.job-detail-dialog {
  width: min(52rem, calc(100vw - 2rem));
  max-height: calc(100vh - 2rem);
  padding: 0;
  border: 0;
  border-radius: 0.85rem;
  box-shadow: 0 1.5rem 5rem rgba(15, 23, 42, 0.22);
}

.job-detail-dialog::backdrop {
  background: rgba(15, 23, 42, 0.48);
}

.job-detail-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  max-height: calc(100vh - 2rem);
  background: var(--tblr-bg-surface);
}

.job-detail-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--tblr-border-color);
}

.job-detail-header > div {
  display: grid;
  min-width: 0;
}

.job-detail-header span {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
}

.job-detail-header strong {
  overflow: hidden;
  font-size: 1.1rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.job-detail-body {
  overflow: auto;
  padding: 1.25rem;
}

.job-detail-status {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--tblr-border-color);
  border-radius: 0.65rem;
}

.job-detail-status > div {
  display: grid;
  gap: 0.3rem;
  min-width: 0;
  padding: 0.85rem;
  border-right: 1px solid var(--tblr-border-color);
}

.job-detail-status > div:last-child {
  border-right: 0;
}

.job-detail-status span,
.job-detail-grid dt {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
  font-weight: 400;
}

.job-detail-status strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.job-detail-alert {
  margin-top: 1rem;
  padding: 0.9rem 1rem;
  border: 1px solid color-mix(in srgb, var(--tblr-danger) 28%, transparent);
  border-radius: 0.65rem;
  background: var(--tblr-red-lt);
}

.job-detail-alert p {
  margin: 0.35rem 0;
  color: var(--tblr-danger);
}

.job-detail-alert span {
  color: var(--tblr-secondary);
  font-size: 0.8rem;
}

.job-detail-section {
  margin-top: 1.25rem;
}

.job-detail-section h3 {
  margin: 0 0 0.65rem;
  font-size: 0.9rem;
}

.job-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  border: 1px solid var(--tblr-border-color);
  border-radius: 0.65rem;
}

.job-detail-grid > div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
  padding: 0.75rem 0.85rem;
  border-right: 1px solid var(--tblr-border-color);
  border-bottom: 1px solid var(--tblr-border-color);
}

.job-detail-grid > div:nth-child(even) {
  border-right: 0;
}

.job-detail-grid > div:nth-last-child(-n + 2) {
  border-bottom: 0;
}

.job-detail-grid dd {
  overflow-wrap: anywhere;
  margin: 0;
}

.job-detail-copy {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--tblr-primary);
  font-size: 0.72rem;
}

.job-detail-message,
.job-detail-prompt {
  overflow-wrap: anywhere;
  margin: 0;
  padding: 0.85rem;
  border-radius: 0.65rem;
  background: var(--tblr-bg-surface-secondary);
  color: var(--tblr-body-color);
  font: inherit;
  line-height: 1.6;
  white-space: pre-wrap;
}

.job-detail-message.is-error {
  background: var(--tblr-red-lt);
  color: var(--tblr-danger);
}

.job-title {
  font-weight: 600;
  max-width: 32rem;
}

.job-sub {
  color: var(--tblr-secondary);
  font-size: 0.75rem;
  margin-top: 0.25rem;
}

.error {
  color: var(--tblr-danger);
  margin-top: 0.375rem;
  max-width: 34rem;
}

.progress {
  width: 6rem;
  height: 0.45rem;
  overflow: hidden;
  background: var(--tblr-border-color);
  border-radius: 999px;
}

.progress i {
  display: block;
  height: 100%;
  background: var(--tblr-primary);
}

.badge.ok {
  background: var(--tblr-green-lt);
  color: var(--tblr-green);
}

.badge.bad {
  background: var(--tblr-red-lt);
  color: var(--tblr-red);
}

.badge.run {
  background: var(--tblr-purple-lt);
  color: var(--tblr-purple);
}

.badge.idle {
  background: var(--tblr-gray-100);
  color: var(--tblr-secondary);
}

.empty {
  color: var(--tblr-secondary);
  padding: 2rem !important;
  text-align: center;
}

.table td.empty {
  display: table-cell !important;
  height: 7rem;
  text-align: center;
  vertical-align: middle;
}

@media (max-width: 991.98px) {
  .workspace-sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .workspace-sidebar > .container-fluid {
    min-height: 4.5rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
  }

  .workspace-sidebar .navbar-brand {
    width: auto;
    min-height: 4.5rem;
    margin-right: auto;
  }

  .workspace-sidebar .navbar-collapse {
    flex-basis: 100%;
  }

  .metric-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .billing-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .billing-control-grid {
    grid-template-columns: 1fr;
  }

  .settings-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .settings-workspace-grid {
    grid-template-columns: 1fr;
  }

  .overview-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .overview-metrics .metric-item {
    border-right: 1px solid var(--tblr-border-color);
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .overview-metrics .metric-item:nth-child(even) {
    border-right: 0;
  }

  .overview-metrics .metric-item:nth-last-child(-n + 2) {
    border-bottom: 0;
  }

  .overview-grid {
    grid-template-columns: 1fr;
  }

  .metric-item:nth-child(3) {
    border-right: 0;
  }

  .metric-item:nth-child(-n + 3) {
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .token-input {
    width: 160px;
  }

  .model-grid {
    grid-template-columns: 1fr;
  }

  .channel-capability-grid {
    grid-template-columns: 1fr;
  }

  .model-primary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .model-default-control {
    grid-column: 1 / -1;
  }

  .model-advanced-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .member-create-bar {
    grid-template-columns: 1fr 1fr;
  }

  .member-create-guidance {
    grid-column: 1 / -1;
  }

  .member-create-actions {
    grid-column: 1 / -1;
  }

  .member-toolbar {
    grid-template-columns: minmax(14rem, 1fr) 10rem 9rem;
  }

  .member-toolbar > span {
    grid-column: 1 / -1;
  }

  .member-card-body {
    grid-template-columns: 1fr;
  }

  .member-control-section {
    border-right: 0;
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .member-control-section:last-child {
    border-bottom: 0;
  }

  .project-create-bar {
    grid-template-columns: minmax(12rem, 1fr) auto;
  }

  .project-workspace-list {
    grid-template-columns: 1fr;
  }

  .asset-review-item {
    grid-template-columns: minmax(14rem, 0.9fr) minmax(16rem, 1.2fr);
  }

  .asset-review-actions {
    display: flex;
    grid-column: 1 / -1;
    justify-content: flex-end;
  }

  .jobs-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .jobs-search {
    grid-column: auto;
  }

  .jobs-active-list {
    grid-template-columns: 1fr;
  }

  .job-detail-status {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .job-detail-status > div:nth-child(even) {
    border-right: 0;
  }

  .job-detail-status > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .project-create-bar span {
    grid-column: 1 / -1;
  }

  .relay-create-bar {
    grid-template-columns: 1fr 1fr;
  }

  .relay-connection {
    align-items: stretch;
    flex-direction: column;
  }

  .credit-adjust-bar {
    grid-template-columns: 1fr 8rem minmax(12rem, 1fr) auto;
  }

  .audit-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .reconciliation-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .reconciliation-metric:nth-child(2) {
    border-right: 0;
  }

  .reconciliation-metric:nth-child(-n + 2) {
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .model-grid .wide {
    grid-column: auto;
  }

  .asset-viewer-content {
    overflow: auto;
    grid-template-columns: 1fr;
    grid-template-rows: minmax(52vh, 1fr) auto;
  }

  .asset-viewer-stage {
    min-height: 52vh;
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  }

  .asset-viewer-details {
    overflow: visible;
  }

  .asset-viewer-media img,
  .asset-viewer-media video {
    max-width: calc(100vw - 7rem);
    max-height: 48vh;
  }

  .asset-viewer-media audio {
    width: min(32rem, calc(100vw - 7rem));
  }
}

@media (max-width: 575.98px) {
  .login-shell {
    align-items: stretch;
    padding: 0;
    background: #fff;
  }

  .login-panel {
    width: 100%;
    padding: 2rem 1.4rem;
    border: 0;
    border-radius: 0;
  }

  .login-brand {
    margin-bottom: 4rem;
  }

  .overview-heading {
    align-items: stretch;
    flex-direction: column;
    gap: 0.85rem;
  }

  .overview-heading-actions {
    justify-items: stretch;
  }

  .overview-heading-actions > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .overview-heading-actions .btn {
    width: 100%;
  }

  .workspace-header-inner,
  .settings-body {
    align-items: stretch;
    flex-direction: column;
  }

  .workspace-header-inner {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }

  .workspace-status {
    justify-content: space-between;
  }

  .metric-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .metric-item,
  .metric-item:nth-child(3) {
    border-right: 1px solid var(--tblr-border-color);
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .metric-item:nth-child(even) {
    border-right: 0;
  }

  .metric-item:nth-last-child(-n + 2) {
    border-bottom: 0;
  }

  .overview-action {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .overview-action .btn {
    grid-column: 2;
    justify-self: start;
  }

  .overview-action-copy strong,
  .overview-action-copy span {
    white-space: normal;
  }

  .overview-project {
    grid-template-columns: minmax(0, 1fr);
  }

  .overview-project-meta,
  .overview-project-counts {
    grid-column: 1;
  }

  .overview-project-counts {
    grid-row: auto;
    text-align: left;
  }

  .settings-control {
    align-items: stretch;
    flex-direction: column;
  }

  .token-input {
    width: 100%;
  }

  .member-create-bar {
    grid-template-columns: 1fr;
  }

  .member-page-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .capability-page-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .capability-heading-actions {
    width: 100%;
    justify-content: space-between;
  }

  .capability-summary-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .capability-summary-strip > div:nth-child(even) {
    border-right: 0;
  }

  .capability-summary-strip > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .capability-boundary-card {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .capability-boundary-card .btn {
    grid-column: 2;
    justify-self: start;
  }

  .model-primary-grid,
  .model-advanced-grid {
    grid-template-columns: 1fr;
  }

  .model-default-control,
  .model-advanced-grid .wide {
    grid-column: auto;
  }

  .model-capability-head,
  .model-capability-state {
    align-items: flex-start;
    flex-direction: column;
  }

  .member-summary-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .member-summary-strip > div:nth-child(even) {
    border-right: 0;
  }

  .member-summary-strip > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .member-toolbar {
    grid-template-columns: 1fr;
  }

  .member-toolbar > span {
    grid-column: auto;
  }

  .member-card-header {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .member-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .member-control-grid {
    grid-template-columns: 1fr;
  }

  .project-create-bar {
    grid-template-columns: 1fr;
  }

  .project-page-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.5rem;
  }

  .asset-page-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.5rem;
  }

  .jobs-page-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.5rem;
  }

  .billing-page-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.5rem;
  }

  .settings-page-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.75rem;
  }

  .settings-page-heading .btn {
    width: 100%;
  }

  .settings-status-grid {
    grid-template-columns: 1fr;
  }

  .settings-password-form {
    grid-template-columns: 1fr;
  }

  .settings-password-submit,
  .settings-panel-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .settings-password-submit .btn,
  .settings-panel-actions .btn {
    width: 100%;
  }

  .settings-facts > div {
    grid-template-columns: 1fr;
    gap: 0.2rem;
  }

  .settings-facts dd {
    text-align: left;
  }

  .billing-summary-grid {
    grid-template-columns: 1fr;
  }

  .billing-control-card,
  .billing-adjust-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .credit-adjust-form,
  .ledger-toolbar {
    grid-template-columns: 1fr;
  }

  .credit-adjust-form .btn {
    width: 100%;
  }

  .jobs-toolbar {
    grid-template-columns: 1fr;
  }

  .jobs-summary-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .jobs-summary-strip > div:nth-child(even) {
    border-right: 0;
  }

  .jobs-summary-strip > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .job-attention-item {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
  }

  .job-attention-item > .btn {
    grid-column: 2;
    justify-self: start;
  }

  .job-attention-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .job-attention-heading strong {
    white-space: normal;
  }

  .job-active-footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .job-detail-dialog {
    width: 100vw;
    max-width: none;
    max-height: 100vh;
    margin: 0;
    border-radius: 0;
  }

  .job-detail-shell {
    max-height: 100vh;
    min-height: 100vh;
  }

  .job-detail-status,
  .job-detail-grid {
    grid-template-columns: 1fr;
  }

  .job-detail-status > div,
  .job-detail-status > div:nth-child(even),
  .job-detail-grid > div,
  .job-detail-grid > div:nth-child(even) {
    border-right: 0;
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .job-detail-status > div:last-child,
  .job-detail-grid > div:last-child {
    border-bottom: 0;
  }

  .asset-toolbar {
    grid-template-columns: 1fr;
  }

  .asset-summary-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .asset-summary-strip > div:nth-child(even) {
    border-right: 0;
  }

  .asset-summary-strip > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .asset-review-item {
    grid-template-columns: 1fr;
  }

  .asset-review-actions {
    grid-column: auto;
  }

  .asset-review-actions .btn {
    flex: 1;
  }

  .project-summary-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .project-summary-item:nth-child(even) {
    border-right: 0;
  }

  .project-summary-item:nth-child(-n + 2) {
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .project-workspace-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    row-gap: 0.85rem;
  }

  .project-workspace-metrics > div:nth-child(3) {
    padding-right: 0;
    border-right: 0;
  }

  .project-workspace-metrics > div:nth-child(4) {
    padding-left: 0;
  }

  .project-workspace-settings {
    grid-template-columns: 1fr;
  }

  .project-workspace-footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .project-workspace-footer > div {
    width: 100%;
  }

  .project-workspace-footer .btn {
    flex: 1;
  }

  .project-create-bar span {
    grid-column: auto;
  }

  .relay-create-bar,
  .relay-connection-actions {
    grid-template-columns: 1fr;
  }

  .credit-adjust-bar {
    grid-template-columns: 1fr;
  }

  .billing-mode-bar {
    align-items: flex-start;
    flex-direction: column;
  }

  .reconciliation-strip {
    grid-template-columns: 1fr;
  }

  .reconciliation-metric,
  .reconciliation-metric:nth-child(2) {
    border-right: 0;
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .reconciliation-metric:last-child {
    border-bottom: 0;
  }

  .asset-viewer-media {
    padding: 1rem;
  }

  .asset-viewer-media img,
  .asset-viewer-media video {
    max-width: calc(100vw - 2rem);
  }

  .asset-viewer-media audio {
    width: calc(100vw - 2rem);
  }

  .asset-viewer-details {
    padding: 1rem;
  }

  .asset-detail-meta {
    grid-template-columns: 1fr;
  }

  .asset-viewer-nav.previous {
    left: 0.5rem;
  }

  .asset-viewer-nav.next {
    right: 0.5rem;
  }
}

@media (max-width: 991.98px) {
  .production-task-create-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .production-task-brief {
    grid-column: 1 / -1;
  }

  .production-task-create-actions {
    grid-column: 1 / -1;
  }

  .production-task-item {
    grid-template-columns: 1fr;
  }

  .production-task-actions {
    justify-content: flex-start;
  }

  .production-task-job {
    width: min(28rem, 100%);
  }
}

@media (max-width: 575.98px) {
  .production-task-create-form {
    grid-template-columns: 1fr;
  }

  .production-task-brief,
  .production-task-create-actions {
    grid-column: auto;
  }

  .production-task-create-actions,
  .production-task-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .production-task-create-actions .btn,
  .production-task-actions .btn,
  .production-task-job {
    width: 100%;
  }

  .production-task-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .production-task-summary > div {
    border-bottom: 1px solid var(--tblr-border-color);
  }

  .production-task-summary > div:nth-child(even) {
    border-right: 0;
  }

  .production-task-summary > div:last-child {
    grid-column: 1 / -1;
    border-bottom: 0;
  }
}
/* A single project context, shared by assets, production, deliveries and budget. */
#projectContext { margin-bottom: 24px; }
#projectContext > nav:first-child { margin-bottom: 12px; color: var(--tblr-secondary-color); }
.project-context-heading { display:flex; align-items:center; gap:16px; }
.project-context-heading h2 { margin:0 0 16px; }
.project-tabbar { display:flex; gap:8px; overflow-x:auto; border-bottom:1px solid var(--tblr-border-color); }
.project-tabbar a { padding:12px 16px; white-space:nowrap; color:var(--tblr-body-color); text-decoration:none; border-bottom:3px solid transparent; }
.project-tabbar a[aria-current] { border-color:var(--tblr-primary); color:var(--tblr-primary); font-weight:600; }
.project-tabbar a:focus-visible, .workspace-pending:focus-visible { outline:2px solid var(--tblr-primary); outline-offset:-2px; }
.project-entry { padding:24px; gap:20px; align-items:stretch; }
.project-entry h3 { margin:0 0 8px; overflow-wrap:anywhere; }
.project-entry > .btn { align-self:flex-start; }
.workspace-card { padding:24px; margin-bottom:20px; gap:16px; }
.workspace-card h3, .workspace-card h4, .workspace-card p { margin:0; }
.workspace-card label { display:grid; gap:8px; }
.workspace-card > button { align-self:flex-start; }
.workspace-card video { display:block; width:100%; max-height:60vh; background:#111; border-radius:8px; }
.workspace-card details > video { margin-top:12px; }
.workspace-card summary { padding:12px 0; cursor:pointer; }
.workspace-metrics { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:16px; }
.workspace-metrics > div { display:grid; gap:8px; }
.workspace-metrics span { color:var(--tblr-secondary-color); }
.workspace-metrics strong { font-size:24px; font-weight:600; }
.workspace-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.workspace-form-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.workspace-pending { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 0; border-bottom:1px solid var(--tblr-border-color); color:var(--tblr-body-color); text-decoration:none; }
.workspace-pending span { color:var(--tblr-secondary-color); }
.workspace-prewrap { white-space:pre-wrap; overflow-wrap:anywhere; }
.project-technical-records { margin-top:24px; }
.project-technical-records > summary { padding:16px; cursor:pointer; }
#workspaceBudget td input { min-width:120px; max-width:220px; }
@media (max-width:767px) {
  .workspace-card, .project-entry { padding:16px; }
  .workspace-form-row { grid-template-columns:1fr; }
  .workspace-pending { align-items:flex-start; flex-direction:column; gap:6px; }
  .project-tabbar a { padding:12px; }
}