/* Generated from legacy styles.css: left navigation, workspace tree, and skills tree. */



.sidebar-toggle-button {
  width: 40px;
  height: 40px;
  border-radius: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  color: #5a6e81;
  background: transparent;
  pointer-events: auto;
  cursor: pointer;
  transition:
    background 160ms ease,
    color 160ms ease,
    transform 160ms ease,
    box-shadow 160ms ease;
}

.sidebar-toggle-button svg {
  width: var(--sidebar-toggle-icon-size);
  height: var(--sidebar-toggle-icon-size);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.sidebar-toggle-button.is-rail {
  width: var(--section-toolbar-control-size);
  height: var(--section-toolbar-control-size);
  margin: calc((var(--section-toolbar-height) - var(--section-toolbar-control-size)) / 2) 0;
  border-radius: 8px;
  color: #5a6e81;
  box-shadow: none;
}

.sidebar-toggle-button.is-rail svg {
  width: var(--section-toolbar-icon-size);
  height: var(--section-toolbar-icon-size);
  stroke-width: 2;
}

.sidebar-toggle-button.is-rail:hover,
.sidebar-toggle-button.is-rail:focus-visible {
  background: rgba(84, 96, 109, 0.14);
  color: #22303d;
  box-shadow: none;
  transform: none;
}

.sidebar-toggle-button.is-rail.is-active {
  background: transparent;
  color: #22303d;
  box-shadow: none;
  transform: none;
}

.sidebar-toggle-button.is-rail.is-active:hover,
.sidebar-toggle-button.is-rail.is-active:focus-visible {
  background: rgba(84, 96, 109, 0.14);
}

.sidebar-toggle-button.is-rail:focus-visible {
  outline: var(--focus-outline-width) solid var(--focus-outline-color);
  outline-offset: var(--focus-outline-offset);
}

.sidebar {
  --left-sidebar-button-radius: 8px;
  --left-sidebar-button-surface: transparent;
  --left-sidebar-button-surface-hover: var(--semantic-sidebar-tree-row-surface-hover);
  --left-sidebar-button-surface-active: var(--semantic-sidebar-tree-row-surface-active);
  --left-sidebar-button-text: var(--semantic-sidebar-tree-row-text);
  --left-sidebar-button-text-hover: var(--semantic-sidebar-tree-row-text-hover);
  --left-sidebar-button-text-active: var(--semantic-sidebar-tree-row-text-active);
  grid-column: 2;
  min-height: 0;
  min-width: 0;
  padding: 0;
  background: var(--seg-sidebar);
  border-right: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  animation: rise-in 420ms ease;
}

.sidebar.is-right {
  grid-column: 6;
  border-left: 0;
  background: transparent;
  container-type: inline-size;
}

.sidebar-resizer {
  --sidebar-resizer-top-surface: var(--seg-pane-tab-bar-surface);
  grid-column: 3;
  position: relative;
  z-index: 4;
  width: 11px;
  justify-self: center;
  min-height: 0;
  cursor: col-resize;
  touch-action: none;
  background-color: transparent;
  background-image: linear-gradient(var(--sidebar-resizer-top-surface), var(--sidebar-resizer-top-surface));
  background-position: top;
  background-size: 100% var(--section-toolbar-height);
  background-repeat: no-repeat;
}

.sidebar-resizer.is-right {
  grid-column: 5;
}

.sidebar-resizer::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  background: #d4dde8;
  transform: translateX(-50%);
  transition:
    background 160ms ease,
    box-shadow 160ms ease;
}

.sidebar-resizer::after {
  content: "";
  position: absolute;
  left: 50%;
  top: calc(var(--section-toolbar-height) - 1px);
  width: 1px;
  height: 1px;
  background: var(--seg-border);
  transform: translateX(-50%);
  pointer-events: none;
}

.sidebar-resizer.is-right::before {
  left: 50%;
  right: auto;
}

.sidebar-resizer:hover::before,
.sidebar-resizer:focus-visible::before,
.sidebar-resizer.is-active::before,
body.is-resizing-sidebar .sidebar-resizer::before {
  background: var(--seg-accent);
  box-shadow: 0 0 0 3px var(--mix-seg-accent-14-transparent-86);
}

.sidebar-resizer:focus-visible {
  outline: none;
}

.sidebar-view {
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.left-sidebar-top-menu {
  position: relative;
  min-height: 40px;
  margin: 0;
  padding-left: 12px;
  padding-right: 12px;
  align-items: stretch;
  gap: 0;
  background: var(--seg-left-sidebar-top-menu-surface);
  isolation: isolate;
}

.left-sidebar-top-menu::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: var(--mix-seg-border-76-transparent-24);
  pointer-events: none;
}

.left-sidebar-top-menu .shell-top-menu-content,
.left-sidebar-top-menu .shell-top-menu-trailing {
  min-width: 0;
  min-height: 40px;
  align-items: center;
  position: relative;
  z-index: 1;
}

.left-sidebar-top-menu-content {
  min-width: 0;
  min-height: 40px;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}

.left-sidebar-top-menu-content::-webkit-scrollbar {
  display: none;
}

.left-sidebar-top-menu-buttons {
  min-width: 0;
  flex-wrap: nowrap;
  justify-content: flex-start;
  -webkit-app-region: no-drag;
}

.left-sidebar-top-menu-trailing {
  justify-content: flex-end;
}

.sidebar-view-host {
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  padding: 16px 14px 18px;
}

.view-toolbar,
.sidebar-actions {
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  gap: 12px;
}

.sidebar-actions-buttons {
  margin-left: auto;
  justify-self: end;
}

.sidebar-action,
.sidebar-toggle-button.is-sidebar {
  width: 34px;
  height: 34px;
  background: transparent;
  color: #5a6e81;
  box-shadow: none;
}

.sidebar-toggle-button.is-top-menu {
  width: var(--section-toolbar-control-size);
  height: var(--section-toolbar-control-size);
}

.sidebar-settings,
.row-action {
  width: 30px;
  height: 30px;
  color: #617181;
  background: transparent;
}

.sidebar-action:hover,
.sidebar-toggle-button.is-sidebar:focus-visible,
.sidebar-toggle-button.is-sidebar:hover,
.sidebar-toggle-button.is-sidebar.is-active,
.sidebar-settings:hover,
.row-action:hover {
  color: #1d2a35;
  background: var(--mix-seg-accent-soft-72-transparent-28);
  box-shadow: none;
}

.sidebar-action svg,
.sidebar-toggle-button.is-sidebar svg,
.sidebar-settings svg,
.row-action svg,
.project-row-leading svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.sidebar-projects {
  min-height: 0;
  overflow: auto;
  scrollbar-width: none;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.sidebar-projects::-webkit-scrollbar {
  display: none;
}

.project-block {
  display: grid;
  gap: 4px;
}

.session-row-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px;
}

.project-row-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px;
}

.project-row,
.session-row {
  width: 100%;
  min-width: 0;
  border: 0;
  border-radius: 8px;
  box-shadow: none;
  text-align: left;
  background: transparent;
  color: #617181;
  cursor: pointer;
  transition:
    background 160ms ease,
    color 160ms ease;
}

.project-row:hover,
.project-row:focus-visible,
.session-row:hover,
.session-row:focus-visible {
  border-color: transparent;
  background: rgba(84, 96, 109, 0.08);
  color: #20303e;
  box-shadow: none;
  outline: none;
}

.session-row:focus-within,
.project-row:hover,
.session-row:hover,
.project-row:focus-visible,
.session-row:focus-within {
  border-color: transparent;
  background: rgba(84, 96, 109, 0.08);
  color: #20303e;
  box-shadow: none;
  outline: none;
}

.project-row {
  min-height: 36px;
  padding: 0 8px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.project-row-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 2px;
}

.sidebar-toggle-button.is-sidebar:focus-visible {
  outline: none;
}

.project-row-action {
  width: 28px;
  height: 28px;
  min-width: 28px;
  padding: 0;
  flex: 0 0 28px;
}

.project-row-leading {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 24px;
}

.project-row-label {
  min-width: 0;
  max-width: 55%;
  flex: 0 0 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 500;
}

.project-row-text {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  align-items: baseline;
  gap: 10px;
  overflow: hidden;
}

.project-row-meta {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: 6px;
  padding-inline: 2px 4px;
  font-size: 11px;
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: #7b8b99;
}

.project-row-meta-label {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-row-status {
  flex: 0 0 auto;
  padding: 2px 6px;
  font-size: 10px;
  line-height: 1.2;
  letter-spacing: 0;
}

.project-row-status.is-missing {
  background: #f6dede;
  color: #9b2d30;
}

.project-row:hover .project-row-meta,
.project-row:focus-visible .project-row-meta {
  color: #567086;
}

.ui-context-menu {
  --context-menu-surface: var(--semantic-dropdown-menu-surface, var(--seg-dropdown-menu-surface, var(--surface-elevated, #ffffff)));
  --context-menu-border: var(--seg-border, var(--border-default, rgba(17, 24, 39, 0.12)));
  --context-menu-text: var(--seg-text-1, var(--text-primary, #1f2937));
  --context-menu-muted: var(--seg-text-2, var(--text-secondary, #6b7280));
  --context-menu-hover: var(--semantic-sidebar-tree-row-surface-hover, rgba(17, 24, 39, 0.06));
  --context-menu-hover-text: var(--semantic-sidebar-tree-row-text-hover, var(--context-menu-text));
  --context-menu-danger-text: var(--semantic-error-text, var(--seg-danger-text, #b42318));
  --context-menu-danger-hover: var(--semantic-error-surface, var(--seg-danger-surface, rgba(180, 35, 24, 0.08)));
  --context-menu-radius: var(--semantic-dropdown-menu-radius, var(--seg-radius-md, calc(var(--seg-radius-xs, 6px) + 2px)));
  --context-menu-focus: var(--focus-outline-color, rgba(212, 107, 99, 0.32));
  --context-menu-shadow: var(--ui-shadow-md, var(--shadow-md, 0 14px 34px rgba(17, 24, 39, 0.14)));

  position: fixed;
  z-index: 1000;
  min-width: 184px;
  max-width: min(320px, calc(100vw - 16px));
  max-height: min(360px, calc(100dvh - 16px));
  overflow: hidden;
  display: grid;
  gap: 2px;
  padding: 6px;
  border: 1px solid var(--context-menu-border);
  border-radius: var(--context-menu-radius);
  background: var(--context-menu-surface);
  color: var(--context-menu-text);
  box-shadow: var(--context-menu-shadow);
  transform-origin: top left;
  animation: ui-context-menu-in 120ms ease;
}

.ui-context-menu__item {
  width: 100%;
  min-height: 32px;
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 0 10px;
  border: 0;
  border-radius: max(4px, calc(var(--context-menu-radius) - 2px));
  background: transparent;
  color: inherit;
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  text-align: left;
}

.ui-context-menu__item:hover,
.ui-context-menu__item:focus-visible {
  background: var(--context-menu-hover);
  color: var(--context-menu-hover-text);
  outline: none;
}

.ui-context-menu__item:focus-visible {
  box-shadow: inset 0 0 0 1px var(--context-menu-focus);
}

.ui-context-menu__item:disabled,
.ui-context-menu__item[aria-disabled="true"] {
  opacity: 0.48;
  cursor: default;
}

.ui-context-menu__item:disabled:hover,
.ui-context-menu__item:disabled:focus-visible,
.ui-context-menu__item[aria-disabled="true"]:hover,
.ui-context-menu__item[aria-disabled="true"]:focus-visible {
  background: transparent;
  color: inherit;
  box-shadow: none;
}

.ui-context-menu__item[data-variant="danger"] {
  color: var(--context-menu-danger-text);
}

.ui-context-menu__item[data-variant="danger"]:hover,
.ui-context-menu__item[data-variant="danger"]:focus-visible {
  background: var(--context-menu-danger-hover);
  color: var(--context-menu-danger-text);
}

.ui-context-menu__icon {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: currentColor;
}

.ui-context-menu__icon svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ui-context-menu__label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-context-menu__divider {
  height: 1px;
  margin: 4px 6px;
  background: var(--context-menu-border);
}

@keyframes ui-context-menu-in {
  from {
    opacity: 0;
    transform: scale(0.98) translateY(-2px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.session-row {
  min-height: 32px;
  padding: 0 8px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.session-row-copy {
  min-width: 0;
  flex: 1 1 auto;
  display: inline-flex;
  align-items: center;
}

@keyframes session-row-status-spin {
  to {
    transform: rotate(360deg);
  }
}

.session-row-status-icon {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 16px;
  color: var(--seg-text-3);
}

.session-row-status-icon svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.session-row-status-icon.is-running {
  color: var(--brand-accent-active);
  animation: session-row-status-spin 900ms linear infinite;
}

.session-row-status-icon.is-unread {
  color: var(--seg-success);
}

.session-row-status-dot {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: currentColor;
  box-shadow: 0 0 0 3px var(--mix-seg-success-10-transparent-90);
}

@media (prefers-reduced-motion: reduce) {
  .ui-context-menu {
    animation: none;
  }

  .session-row-status-icon.is-running {
    animation: none;
  }
}

.project-row-shell .row-action,
.session-row-shell .row-action,
.skill-tree-row-shell .row-action {
  opacity: 0;
  pointer-events: none;
}

.project-row-shell:hover .row-action,
.project-row-shell:focus-within .row-action,
.session-row-shell:hover .row-action,
.session-row-trailing .row-action:focus-visible,
.skill-tree-row-shell:hover .row-action,
.skill-tree-row-shell:focus-within .row-action {
  opacity: 1;
  pointer-events: auto;
}

.session-row-trailing {
  width: 48px;
  min-width: 48px;
  height: 30px;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
}

.session-row-created-at {
  max-width: 48px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 450;
  line-height: 1;
  color: var(--seg-text-3);
}

.session-row-trailing .row-action {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.session-row-trailing .row-action:hover,
.session-row-trailing .row-action:focus-visible,
.session-row-trailing .row-action:disabled {
  transform: translateY(-50%);
}

.session-row-shell:hover .session-row-created-at,
.session-row-trailing:has(.row-action:focus-visible) .session-row-created-at {
  opacity: 0;
}

.session-row-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 500;
}

.session-row:hover .session-row-label,
.session-row:focus-visible .session-row-label {
  color: #243647;
}

.session-row.is-active {
  border-color: transparent;
  color: var(--seg-accent-strong);
  background: var(--mix-seg-accent-soft-84-transparent-16);
  box-shadow: none;
}

.session-row.is-active .session-row-label {
  color: inherit;
}

.session-tree {
  display: grid;
  gap: 2px;
  padding-left: 0;
}

.sidebar-path-copy small {
  color: #718599;
  font-size: 11px;
  line-height: 1.4;
  word-break: break-all;
}

.skills-tree-root {
  min-height: 0;
  display: grid;
  grid-auto-rows: max-content;
  align-content: start;
  align-items: start;
  gap: 4px;
  overflow: auto;
  scrollbar-gutter: stable;
  padding-right: 4px;
}

.skills-tree-search-row {
  position: sticky;
  top: 0;
  z-index: 2;
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 10px;
  border: 1px solid var(--seg-border);
  border-radius: var(--seg-radius-xs);
  background: rgba(255, 255, 255, 0.88);
}

.skills-tree-search-row svg {
  width: 15px;
  height: 15px;
  color: var(--seg-text-3);
  stroke-width: 2;
}

.skills-tree-search-row input {
  width: 100%;
  min-width: 0;
  height: 36px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--seg-text-1);
  font: inherit;
  font-size: 13px;
  outline: none;
}

.skills-tree-search-row input::placeholder {
  color: var(--seg-text-3);
}

.skills-tree-search-row input::-webkit-search-cancel-button {
  display: none;
}

.skills-tree-search-row:focus-within {
  border-color: var(--mix-seg-accent-42-seg-border-58);
  box-shadow: 0 0 0 3px var(--mix-seg-accent-12-transparent-88);
}

.skills-tree-search-row button {
  width: 28px;
  min-width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--seg-text-3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.skills-tree-search-row button:hover,
.skills-tree-search-row button:focus-visible {
  background: var(--semantic-sidebar-tree-row-surface-hover);
  color: var(--semantic-sidebar-tree-row-text-hover);
  outline: none;
}

.skills-create-form {
  display: grid;
  gap: 8px;
  padding: 0 0 10px;
}

.skills-create-input {
  width: 100%;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid rgba(166, 186, 208, 0.5);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.94);
  color: #1f2f3d;
  outline: none;
}

.skills-create-input:focus-visible {
  border-color: var(--mix-seg-accent-42-seg-border-58);
  box-shadow: 0 0 0 3px var(--mix-seg-accent-12-transparent-88);
}

.skills-create-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.skills-create-actions button {
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid rgba(166, 186, 208, 0.5);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.94);
  color: #20303e;
  font-size: 12px;
  font-weight: 600;
}

.skills-create-actions button[type="submit"] {
  border-color: var(--mix-seg-accent-34-seg-border-66);
  background: var(--mix-seg-accent-soft-82-transparent-18);
  color: var(--seg-accent-strong);
}

.skills-create-actions button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.skills-tree-empty {
  margin: 0;
  color: #5f7488;
  line-height: 1.5;
}

.skill-tree-item {
  display: grid;
  align-content: start;
  gap: 4px;
}

.skill-tree-row-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px;
}

.skill-tree-children {
  display: grid;
  grid-auto-rows: max-content;
  align-content: start;
  gap: 4px;
  padding-left: 18px;
}

.skill-tree-row {
  width: 100%;
  min-height: 32px;
  padding: 0 8px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #50657a;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-align: left;
}

.skill-tree-row:hover,
.skill-tree-row:focus-visible {
  background: rgba(84, 96, 109, 0.08);
  color: #20303e;
  outline: none;
}

.skill-tree-row.is-active {
  background: var(--mix-seg-accent-soft-84-transparent-16);
  color: var(--seg-accent-strong);
}

.skill-tree-leading {
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 18px;
}

.skill-tree-role-icon {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 16px;
  color: var(--seg-text-3);
}

.skill-tree-role-icon.is-folder {
  color: #5f7488;
}

.skill-tree-role-icon.is-skill {
  color: var(--seg-accent-strong);
}

.skill-tree-leading svg,
.skill-tree-role-icon svg,
.skill-tree-row-action svg {
  width: 15px;
  height: 15px;
  stroke-width: 2;
}

.skill-tree-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 500;
}

.skill-tree-row-action {
  width: 28px;
  height: 28px;
  min-width: 28px;
  padding: 0;
  flex: 0 0 28px;
}

.skill-tree-row-action.is-open {
  background: var(--mix-seg-accent-soft-68-seg-panel-32);
  color: var(--seg-accent-strong);
}

.skill-tree-menu-shell {
  position: relative;
  display: inline-flex;
}

.skill-tree-row-menu {
  left: auto;
  right: 0;
  min-width: 184px;
}

.skill-tree-rename-form {
  min-height: 32px;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 0 8px;
  border-radius: 8px;
  background: var(--mix-seg-accent-soft-72-transparent-28);
}

.skill-tree-rename-input {
  width: 100%;
  min-width: 0;
  min-height: 28px;
  padding: 0 8px;
  border: 1px solid var(--mix-seg-accent-24-seg-border-76);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.96);
  color: var(--seg-accent-strong);
  outline: none;
}

.skill-tree-rename-input:focus-visible {
  border-color: var(--mix-seg-accent-42-seg-border-58);
  box-shadow: 0 0 0 3px var(--mix-seg-accent-12-transparent-88);
}

.sidebar-settings {
  margin-top: auto;
}

.sidebar-settings.is-active {
  background: var(--mix-seg-accent-soft-84-transparent-16);
  color: var(--seg-accent-strong);
}

.sidebar-toggle-button.is-top-menu svg {
  width: var(--section-toolbar-icon-size);
  height: var(--section-toolbar-icon-size);
  stroke-width: 2;
}

.sidebar-footer {
  margin-top: auto;
  padding-top: 4px;
}

.sidebar-toggle-button.is-top-menu:focus-visible {
  outline: var(--focus-outline-width) solid var(--focus-outline-color);
  outline-offset: var(--focus-outline-offset);
}

/* Keep workspace tree row sizing aligned with the simpler skills tree affordance. */

.project-row-shell,
.session-row-shell,
.skill-tree-row-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px;
}

.project-row,
.session-row,
.skill-tree-row {
  width: 100%;
  min-width: 0;
  border: 0;
  border-radius: 8px;
  box-shadow: none;
}

.session-row.is-active .session-row-label {
  color: inherit;
}

/* Sage / Teal & Slate theme overrides */

.sidebar-action,
.sidebar-toggle-button.is-sidebar,
.sidebar-toggle-button.is-rail,
.sidebar-settings,
.row-action,
.project-row-action,
.skill-tree-row-action {
  background: transparent;
  color: var(--seg-text-2);
}

.sidebar-action:hover,
.sidebar-action:focus-visible,
.sidebar-toggle-button.is-sidebar:hover,
.sidebar-toggle-button.is-sidebar:focus-visible,
.sidebar-toggle-button.is-sidebar.is-active,
.sidebar-toggle-button.is-rail:hover,
.sidebar-toggle-button.is-rail:focus-visible,
.sidebar-toggle-button.is-rail.is-active,
.sidebar-toggle-button.is-rail.is-active:hover,
.sidebar-toggle-button.is-rail.is-active:focus-visible,
.sidebar-settings:hover,
.sidebar-settings:focus-visible,
.row-action:hover,
.row-action:focus-visible,
.project-row-action:hover,
.project-row-action:focus-visible,
.skill-tree-row-action:hover,
.skill-tree-row-action:focus-visible {
  background: var(--mix-seg-accent-soft-68-seg-panel-32);
  color: var(--seg-accent-strong);
  box-shadow: none;
}

.project-row,
.session-row,
.skill-tree-row {
  background: transparent;
  color: var(--semantic-sidebar-tree-row-text);
}

.project-row:hover,
.project-row:focus-visible,
.session-row:hover,
.session-row:focus-visible,
.skill-tree-row:hover,
.skill-tree-row:focus-visible {
  background: var(--semantic-sidebar-tree-row-surface-hover);
  color: var(--semantic-sidebar-tree-row-text-hover);
}

.session-row.is-active,
.skill-tree-row.is-active {
  background: var(--semantic-sidebar-tree-row-surface-active);
  border: 0;
  color: var(--semantic-sidebar-tree-row-text-active);
  box-shadow: none;
}

.skill-tree-row.is-active .skill-tree-leading {
  color: var(--semantic-sidebar-tree-row-leading-active);
}

.skill-tree-row.is-active .skill-tree-label {
  color: inherit;
  font-weight: 650;
}

.skill-tree-row.has-leading-disclosure {
  position: relative;
  background: transparent;
}

.skill-tree-row.has-leading-disclosure::before {
  content: "";
  position: absolute;
  inset: 0 0 0 34px;
  border-radius: 8px;
  opacity: 0;
  pointer-events: none;
}

.skill-tree-row.has-leading-disclosure > * {
  position: relative;
  z-index: 1;
}

.skill-tree-row.has-leading-disclosure:hover,
.skill-tree-row.has-leading-disclosure:focus-visible {
  background: transparent;
}

.skill-tree-row.has-leading-disclosure:hover::before,
.skill-tree-row.has-leading-disclosure:focus-visible::before {
  background: var(--semantic-sidebar-tree-row-surface-hover);
  opacity: 1;
}

.project-row-meta,
.session-row-meta,
.skill-tree-row-meta {
  color: var(--seg-text-3);
}

.sidebar .sidebar-view-host .global-skills-open-folder-button,
.sidebar .sidebar-view-host .global-skills-install-button {
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid transparent;
  border-radius: var(--left-sidebar-button-radius);
  background: var(--left-sidebar-button-surface);
  box-shadow: none;
  color: var(--left-sidebar-button-text);
  transform: none;
}

.sidebar .sidebar-view-host .global-skills-new-button,
.sidebar .sidebar-view-host .mcp-servers-new-button,
.sidebar .sidebar-view-host .skills-tree-search-row button {
  min-height: 32px;
  border: 1px solid transparent;
  border-radius: var(--left-sidebar-button-radius);
  background: var(--left-sidebar-button-surface);
  box-shadow: none;
  color: var(--left-sidebar-button-text);
  transform: none;
}

.sidebar .sidebar-view-host .skill-tree-row,
.sidebar .sidebar-view-host .mcp-server-sidebar-row,
.sidebar .sidebar-view-host .sidebar-view-tools .tools-category-item {
  min-height: 32px;
  padding: 0 8px;
  border: 1px solid transparent;
  border-radius: var(--left-sidebar-button-radius);
  background: var(--left-sidebar-button-surface);
  box-shadow: none;
  color: var(--left-sidebar-button-text);
  transform: none;
}

.sidebar .sidebar-view-host .global-skills-open-folder-button:hover,
.sidebar .sidebar-view-host .global-skills-open-folder-button:focus-visible,
.sidebar .sidebar-view-host .global-skills-install-button:hover,
.sidebar .sidebar-view-host .global-skills-install-button:focus-visible,
.sidebar .sidebar-view-host .global-skills-install-button.is-open,
.sidebar .sidebar-view-host .global-skills-new-button:hover,
.sidebar .sidebar-view-host .global-skills-new-button:focus-visible,
.sidebar .sidebar-view-host .global-skills-new-button.is-open,
.sidebar .sidebar-view-host .mcp-servers-new-button:hover,
.sidebar .sidebar-view-host .mcp-servers-new-button:focus-visible,
.sidebar .sidebar-view-host .skills-tree-search-row button:hover,
.sidebar .sidebar-view-host .skills-tree-search-row button:focus-visible,
.sidebar .sidebar-view-host .skill-tree-row:hover,
.sidebar .sidebar-view-host .skill-tree-row:focus-visible,
.sidebar .sidebar-view-host .mcp-server-sidebar-row:hover,
.sidebar .sidebar-view-host .mcp-server-sidebar-row:focus-visible,
.sidebar .sidebar-view-host .sidebar-view-tools .tools-category-item:hover,
.sidebar .sidebar-view-host .sidebar-view-tools .tools-category-item:focus-visible {
  border-color: transparent;
  background: var(--left-sidebar-button-surface-hover);
  box-shadow: none;
  color: var(--left-sidebar-button-text-hover);
  transform: none;
}

.sidebar .sidebar-view-host .global-skills-new-button.is-active,
.sidebar .sidebar-view-host .mcp-servers-new-button.is-active,
.sidebar .sidebar-view-host .skill-tree-row.is-active,
.sidebar .sidebar-view-host .mcp-server-sidebar-row.is-active,
.sidebar .sidebar-view-host .sidebar-view-tools .tools-category-item.is-active {
  border-color: transparent;
  background: var(--left-sidebar-button-surface-active);
  box-shadow: none;
  color: var(--left-sidebar-button-text-active);
  transform: none;
}

.sidebar .sidebar-view-host .mcp-server-sidebar-name,
.sidebar .sidebar-view-host .mcp-server-sidebar-row:hover .mcp-server-sidebar-name,
.sidebar .sidebar-view-host .mcp-server-sidebar-row:focus-visible .mcp-server-sidebar-name,
.sidebar .sidebar-view-host .mcp-server-sidebar-row.is-active .mcp-server-sidebar-name {
  color: inherit;
}

.sidebar .sidebar-view-host .global-skills-open-folder-button:focus-visible,
.sidebar .sidebar-view-host .global-skills-install-button:focus-visible,
.sidebar .sidebar-view-host .global-skills-new-button:focus-visible,
.sidebar .sidebar-view-host .mcp-servers-new-button:focus-visible,
.sidebar .sidebar-view-host .skills-tree-search-row button:focus-visible,
.sidebar .sidebar-view-host .skill-tree-row:focus-visible,
.sidebar .sidebar-view-host .mcp-server-sidebar-row:focus-visible,
.sidebar .sidebar-view-host .sidebar-view-tools .tools-category-item:focus-visible {
  outline: var(--focus-outline-width) solid var(--focus-outline-color);
  outline-offset: -1px;
}

.sidebar .sidebar-view-host .global-skills-open-folder-button:disabled,
.sidebar .sidebar-view-host .global-skills-install-button:disabled,
.sidebar .sidebar-view-host .global-skills-new-button:disabled,
.sidebar .sidebar-view-host .mcp-servers-new-button:disabled,
.sidebar .sidebar-view-host .skills-tree-search-row button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
