@adea-ai/ui 0.10.8

package/src/styles/conventional-workspace.css

@@ -0,0 +1,2846 @@
+.workspace-frame {
+  --workspace-rail-width: 4rem;
+  position: fixed;
+  inset: 0;
+  display: grid;
+  grid-template-columns: 4rem minmax(0, 1fr);
+  min-width: 20rem;
+  height: 100svh;
+  overflow: clip;
+  background: var(--background);
+  color: var(--foreground);
+}
+
+.workspace-frame__surface {
+  position: relative;
+  min-width: 0;
+  min-height: 0;
+  overflow: hidden;
+}
+
+.global-rail {
+  position: relative;
+  z-index: 110;
+  display: grid;
+  grid-template-rows: auto auto auto auto minmax(0, 1fr) auto;
+  justify-items: center;
+  gap: 0.5rem;
+  min-width: 0;
+  padding: max(0.75rem, env(safe-area-inset-top)) 0.45rem max(0.75rem, env(safe-area-inset-bottom));
+  border-right: 1px solid var(--border);
+  background: var(--card);
+  color: var(--card-foreground);
+}
+
+.global-rail__views,
+.global-rail__footer {
+  display: grid;
+  justify-items: center;
+  gap: 0.25rem;
+}
+
+.global-rail__workspace-trigger {
+  box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary-foreground) 18%, transparent);
+}
+
+.global-rail__workspace {
+  position: relative;
+}
+
+.global-rail__workspace-menu {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  z-index: 130;
+  display: grid;
+  gap: 0.2rem;
+  width: 15rem;
+  padding: 0.35rem;
+  border: 1px solid var(--border);
+  border-radius: 0.65rem;
+  background: var(--popover);
+  color: var(--popover-foreground);
+  box-shadow: 0 0.8rem 2rem rgb(0 0 0 / 0.18);
+}
+
+.global-rail__workspace-menu > button {
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr);
+  gap: 0.55rem;
+  align-items: center;
+  width: 100%;
+  min-height: 2.4rem;
+  padding: 0.4rem 0.5rem;
+  border: 0;
+  border-radius: 0.4rem;
+  color: inherit;
+  background: transparent;
+  font: inherit;
+  text-align: left;
+  cursor: pointer;
+}
+
+.global-rail__workspace-menu > button:hover,
+.global-rail__workspace-menu > button:focus-visible,
+.global-rail__workspace-menu > button[aria-checked="true"] {
+  background: var(--accent);
+  color: var(--accent-foreground);
+  outline: none;
+}
+
+.global-rail__workspace-name {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.global-rail__button {
+  position: relative;
+}
+
+.global-rail__button svg,
+.global-rail__workspace-trigger svg {
+  width: 1.5rem;
+  height: 1.5rem;
+}
+
+.global-rail__button[aria-pressed="true"]::after {
+  position: absolute;
+  top: 0.45rem;
+  right: -0.46rem;
+  bottom: 0.45rem;
+  width: 2px;
+  border-radius: 999px;
+  background: var(--foreground);
+  content: "";
+}
+
+.global-rail__search {
+  display: grid;
+  justify-items: center;
+  gap: 0.35rem;
+}
+
+.global-rail__search kbd {
+  color: var(--muted-foreground);
+  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
+  font-size: 0.55rem;
+  letter-spacing: 0.02em;
+  line-height: 1;
+  word-spacing: 0.2rem;
+}
+
+.global-rail__separator {
+  width: 2rem;
+  margin: 0.15rem 0;
+}
+
+.global-rail__footer {
+  grid-row: 6;
+}
+
+.global-account-menu {
+  min-width: 15rem;
+  padding: 0.4rem;
+  border-radius: 0.75rem;
+}
+
+.global-account-menu [data-slot="dropdown-menu-item"] {
+  min-height: 2.25rem;
+  gap: 0.65rem;
+  padding: 0.45rem 0.55rem;
+  font-size: 0.86rem;
+}
+
+.global-account-menu [data-slot="dropdown-menu-item"] svg {
+  width: 1.05rem;
+  height: 1.05rem;
+  color: var(--muted-foreground);
+}
+
+.global-account-menu [data-slot="dropdown-menu-item"]:not([data-disabled]):hover svg,
+.global-account-menu [data-slot="dropdown-menu-item"]:focus svg {
+  color: currentColor;
+}
+
+.conventional-workspace,
+.conventional-dialog {
+  --cw-bg: var(--background);
+  --cw-surface: var(--card);
+  --cw-surface-muted: var(--muted);
+  --cw-sidebar: var(--card);
+  --cw-sidebar-hover: var(--muted);
+  /* The conversation surface sits a step away from the sidebar/card tone so
+     the chat area reads as its own region. */
+  --cw-main: oklch(0.985 0 0);
+  --cw-text: var(--foreground);
+  --cw-muted: var(--muted-foreground);
+  --cw-border: var(--border);
+  --cw-accent: var(--primary);
+  --cw-accent-strong: var(--primary);
+  --cw-accent-soft: var(--secondary);
+  --cw-accent-contrast: var(--primary-foreground);
+  --cw-danger: var(--destructive);
+  --cw-focus: var(--ring);
+}
+
+.conventional-workspace {
+  position: relative;
+  display: grid;
+  grid-template: minmax(0, 1fr) / var(--conventional-sidebar-width, 17rem) minmax(0, 1fr);
+  min-width: 0;
+  width: 100%;
+  height: 100svh;
+  overflow: clip;
+  background: var(--cw-bg);
+  color: var(--cw-text);
+  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
+}
+
+.conventional-workspace *,
+.conventional-workspace *::before,
+.conventional-workspace *::after {
+  box-sizing: border-box;
+}
+.conventional-workspace button,
+.conventional-workspace input,
+.conventional-workspace select,
+.conventional-workspace textarea {
+  font: inherit;
+}
+.conventional-workspace button:not([data-slot]) {
+  color: inherit;
+}
+.conventional-workspace button:not(:disabled),
+.conventional-workspace select:not(:disabled) {
+  cursor: pointer;
+}
+.conventional-workspace button:disabled {
+  cursor: not-allowed;
+  opacity: 0.55;
+}
+.conventional-workspace :focus-visible {
+  outline: 3px solid var(--cw-focus);
+  outline-offset: 2px;
+}
+.conventional-workspace svg {
+  width: 1.1rem;
+  height: 1.1rem;
+  flex: none;
+}
+.conventional-workspace h1,
+.conventional-workspace h2,
+.conventional-workspace p {
+  margin: 0;
+}
+
+.conventional-skip-link {
+  position: fixed;
+  z-index: 100;
+  top: 0.5rem;
+  left: 0.5rem;
+  padding: 0.7rem 1rem;
+  transform: translateY(-160%);
+  border-radius: 0.4rem;
+  background: var(--cw-surface);
+  color: var(--cw-text);
+}
+.conventional-skip-link:focus {
+  transform: none;
+}
+.conventional-topbar {
+  grid-column: 1 / -1;
+  display: grid;
+  grid-template-columns: 17rem minmax(0, 1fr) auto auto;
+  align-items: center;
+  border-bottom: 1px solid var(--cw-border);
+  background: var(--cw-sidebar);
+  color: var(--cw-text);
+}
+.conventional-brand,
+.conventional-topbar__context,
+.conventional-account-button {
+  display: flex;
+  align-items: center;
+  gap: 0.65rem;
+  min-height: 2.75rem;
+}
+.conventional-brand {
+  align-self: stretch;
+  padding: 0 1rem;
+  color: inherit;
+  text-decoration: none;
+  letter-spacing: -0.02em;
+}
+.conventional-brand > span {
+  display: grid;
+  width: 2rem;
+  height: 2rem;
+  place-items: center;
+  border-radius: 0.45rem;
+  background: var(--cw-accent);
+  color: var(--cw-accent-contrast);
+  font-size: 0.72rem;
+  font-weight: 800;
+}
+.conventional-topbar__context {
+  padding: 0 1rem;
+  color: var(--cw-muted);
+  font-size: 0.85rem;
+}
+.conventional-account-button {
+  margin-right: 0.65rem;
+  padding: 0 0.8rem;
+  border: 0;
+  border-radius: 0.4rem;
+  background: transparent;
+}
+.conventional-account-button:hover {
+  background: var(--cw-sidebar-hover);
+}
+.conventional-topbar__view {
+  display: flex;
+  padding: 0 0.25rem;
+}
+
+.conventional-sidebar {
+  position: relative;
+  grid-row: 1;
+  display: grid;
+  grid-template-rows: auto auto minmax(0, 1fr);
+  min-width: 0;
+  overflow: hidden;
+  background: var(--cw-sidebar);
+  color: var(--cw-text);
+}
+.conventional-sidebar__resize {
+  position: absolute;
+  z-index: 6;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  width: 0.5rem;
+  padding: 0;
+  border: 0;
+  cursor: col-resize;
+  background: transparent;
+  touch-action: none;
+}
+.conventional-sidebar__resize:hover,
+.conventional-sidebar__resize:focus-visible {
+  background: var(--cw-accent-soft);
+}
+.conventional-sidebar__resize:focus-visible {
+  outline: 2px solid var(--cw-focus);
+  outline-offset: -2px;
+}
+.conventional-sidebar__close {
+  display: none;
+}
+.conventional-sidebar__title {
+  padding: 0.9rem 1.25rem 0.5rem;
+}
+.conventional-sidebar__title h1 {
+  overflow: hidden;
+  color: var(--cw-muted);
+  font-size: 0.72rem;
+  letter-spacing: 0.08em;
+  text-overflow: ellipsis;
+  text-transform: uppercase;
+  white-space: nowrap;
+}
+.conventional-sidebar__quick-actions {
+  display: grid;
+  gap: 0.15rem;
+  padding: 0.25rem 0.6rem 0.75rem;
+  border-bottom: 1px solid var(--cw-border);
+}
+.conventional-sidebar button:not([data-slot]) {
+  border: 0;
+  background: transparent;
+}
+.conventional-sidebar__quick-actions button,
+.conventional-sidebar__settings {
+  display: flex;
+  align-items: center;
+  gap: 0.7rem;
+  min-height: 2.5rem;
+  padding: 0 0.65rem;
+  border-radius: 0.4rem;
+  text-align: left;
+}
+.conventional-sidebar__quick-actions button:hover,
+.conventional-sidebar__settings:hover {
+  background: var(--cw-sidebar-hover);
+}
+.conventional-sidebar__quick-actions kbd {
+  margin-left: auto;
+  color: var(--cw-muted);
+  font-size: 0.7rem;
+}
+.conventional-sidebar__scroll {
+  overflow: auto;
+  padding: 0.65rem 0.55rem;
+  scrollbar-gutter: stable;
+}
+.conventional-sidebar-section + .conventional-sidebar-section {
+  margin-top: 1.25rem;
+}
+.conventional-sidebar-section__heading {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 0.45rem 0.35rem;
+}
+.conventional-sidebar-section__heading h2 {
+  color: var(--cw-muted);
+  font-size: 0.72rem;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+.conventional-sidebar-section__heading button {
+  display: grid;
+  width: 2rem;
+  height: 2rem;
+  place-items: center;
+  border-radius: 0.35rem;
+}
+.conventional-sidebar-section__heading button:hover {
+  background: var(--cw-sidebar-hover);
+}
+.conventional-room-list,
+.conventional-channel-list {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+.conventional-room-row {
+  display: flex;
+  align-items: center;
+  gap: 0.15rem;
+}
+.conventional-room-toggle {
+  display: grid;
+  width: 2rem;
+  height: 2.45rem;
+  flex-shrink: 0;
+  place-items: center;
+  border-radius: 0.35rem;
+  color: var(--cw-muted);
+}
+.conventional-room-toggle:hover {
+  background: var(--cw-sidebar-hover);
+  color: var(--cw-text);
+}
+.conventional-room-toggle svg {
+  width: 0.9rem;
+}
+.conventional-room-select,
+.conventional-channel-list button {
+  display: flex;
+  min-width: 0;
+  min-height: 2.45rem;
+  align-items: center;
+  gap: 0.5rem;
+  border-radius: 0.35rem;
+}
+.conventional-unread-badge {
+  min-width: 1.35rem;
+  margin-left: auto;
+  padding: 0.1rem 0.35rem;
+  border-radius: 999px;
+  background: var(--cw-accent);
+  color: var(--cw-accent-contrast) !important;
+  font-size: 0.68rem !important;
+  font-weight: 800;
+  line-height: 1.1;
+  text-align: center;
+}
+.conventional-room-select {
+  flex: 1;
+  justify-content: flex-start;
+  padding: 0 0.55rem;
+  text-align: left;
+}
+.conventional-room-select > svg {
+  width: 1rem;
+  height: 1rem;
+  flex-shrink: 0;
+  color: var(--cw-muted);
+}
+.conventional-room-name,
+.conventional-channel-list button > span {
+  overflow: hidden;
+  min-width: 0;
+  flex: 1;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.conventional-room-actions,
+.conventional-channel-actions {
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  gap: 0.1rem;
+  opacity: 0;
+}
+.conventional-room-row:hover .conventional-room-actions,
+.conventional-room-row:focus-within .conventional-room-actions,
+.conventional-channel-row:hover .conventional-channel-actions,
+.conventional-channel-row:focus-within .conventional-channel-actions {
+  opacity: 1;
+}
+.conventional-room-actions button {
+  display: grid;
+  width: 2rem;
+  height: 2.45rem;
+  flex-shrink: 0;
+  place-items: center;
+  border-radius: 0.35rem;
+  color: var(--cw-muted);
+}
+.conventional-room-actions button:hover {
+  background: var(--cw-sidebar-hover);
+  color: var(--cw-text);
+}
+.conventional-room-row:hover .conventional-room-select {
+  background: var(--cw-sidebar-hover);
+  color: var(--cw-text);
+}
+.conventional-room-row:hover .conventional-room-actions button,
+.conventional-room-row:hover .conventional-room-toggle {
+  background: var(--cw-sidebar-hover);
+}
+.conventional-room-row:hover .conventional-room-actions button:hover,
+.conventional-room-row:hover .conventional-room-toggle:hover {
+  background: color-mix(in srgb, var(--cw-sidebar-hover) 70%, var(--cw-text));
+}
+.conventional-channel-actions button {
+  width: 2rem;
+  height: 2rem;
+  flex-shrink: 0;
+}
+.conventional-channel-actions [data-slot="dropdown-menu-trigger"],
+.conventional-room-actions [data-slot="dropdown-menu-trigger"] {
+  background: var(--cw-sidebar-hover);
+}
+.conventional-channel-actions [data-slot="dropdown-menu-trigger"]:hover,
+.conventional-room-actions [data-slot="dropdown-menu-trigger"]:hover {
+  background: color-mix(in srgb, var(--cw-sidebar-hover) 70%, var(--cw-text));
+}
+.conventional-room-actions button svg,
+.conventional-channel-actions button svg {
+  width: 0.9rem;
+  height: 0.9rem;
+}
+.conventional-channel-row {
+  display: flex;
+  align-items: center;
+  gap: 0.15rem;
+}
+.conventional-channel-row > button:first-child {
+  min-width: 0;
+  flex: 1;
+}
+.conventional-room-select:hover,
+.conventional-room-select[aria-current="page"],
+.conventional-channel-list > li > button:hover,
+.conventional-channel-list > li > button[aria-current="page"] {
+  background: var(--cw-sidebar-hover);
+  color: var(--cw-text);
+}
+.conventional-channel-list {
+  margin-left: 0;
+}
+.conventional-channel-list--standalone {
+  margin-left: 0;
+}
+.conventional-channel-list > li > button {
+  width: 100%;
+  padding: 0 0.55rem;
+  color: var(--cw-muted);
+  text-align: left;
+}
+.conventional-sidebar-error {
+  margin: 0 0.55rem 0.5rem;
+  padding: 0.5rem 0.6rem;
+  border-radius: 0.4rem;
+  background: color-mix(in srgb, var(--cw-danger) 10%, transparent);
+  color: var(--cw-danger);
+  font-size: 0.78rem;
+  line-height: 1.4;
+}
+.conventional-sidebar-empty {
+  padding: 0.5rem;
+  color: var(--cw-muted);
+  font-size: 0.8rem;
+  line-height: 1.45;
+}
+.conventional-sidebar-empty-action {
+  display: flex;
+  width: 100%;
+  min-height: 2.5rem;
+  align-items: center;
+  gap: 0.5rem;
+  padding: 0 0.55rem;
+  border-radius: 0.35rem;
+  color: var(--cw-muted);
+}
+.conventional-sidebar__settings {
+  margin: 0.5rem 0.6rem 0.75rem;
+}
+.conventional-mobile-menu,
+.conventional-sidebar-scrim {
+  display: none;
+}
+
+.conventional-main {
+  grid-column: 2;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  min-height: 0;
+  overflow: hidden;
+  background: var(--cw-main);
+}
+.conventional-main > :not(.conventional-session-notice) {
+  flex: 1;
+  min-width: 0;
+  min-height: 0;
+}
+.conventional-session-notice {
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr) auto;
+  align-items: start;
+  gap: 0.65rem;
+  flex: none;
+  padding: 0.65rem 1rem;
+  border-bottom: 1px solid color-mix(in srgb, #d97706 45%, transparent);
+  background: color-mix(in srgb, #d97706 12%, var(--cw-main));
+  color: var(--cw-text);
+}
+.conventional-session-notice > svg {
+  width: 1.1rem;
+  height: 1.1rem;
+  margin-top: 0.15rem;
+  color: #d97706;
+  flex: none;
+}
+.conventional-session-notice h2 {
+  font-size: 0.85rem;
+  font-weight: 700;
+}
+.conventional-session-notice p {
+  color: var(--cw-muted);
+  font-size: 0.8rem;
+  line-height: 1.45;
+}
+.conventional-session-notice button {
+  display: grid;
+  width: 2rem;
+  height: 2rem;
+  place-items: center;
+  border: 0;
+  border-radius: 0.35rem;
+  background: transparent;
+  color: var(--cw-muted);
+  cursor: pointer;
+}
+.conventional-session-notice button:hover {
+  background: color-mix(in srgb, #d97706 18%, transparent);
+  color: var(--cw-text);
+}
+.conventional-session-notice button svg {
+  width: 1rem;
+  height: 1rem;
+}
+.conventional-workspace--loading {
+  grid-template: 1fr / 1fr;
+  place-items: center;
+}
+.conventional-conversation {
+  position: relative;
+  display: grid;
+  grid-template: auto minmax(0, 1fr) auto / minmax(0, 1fr);
+  height: 100%;
+}
+.conventional-conversation--thread-open {
+  grid-template-columns: minmax(24rem, 1fr) minmax(20rem, 26rem);
+}
+.conventional-conversation__header {
+  grid-column: 1;
+  display: grid;
+  gap: 0.35rem;
+  padding: 0.65rem 1.2rem 0.55rem;
+  border-bottom: 1px solid var(--cw-border);
+  background: var(--cw-surface);
+}
+.conventional-conversation__header-top {
+  display: flex;
+  min-height: 4.4rem;
+  align-items: center;
+  gap: 0.75rem;
+}
+.conventional-conversation__identity {
+  min-width: 0;
+  flex: 1;
+}
+.conventional-conversation__identity > span,
+.conventional-surface-header span {
+  color: var(--cw-muted);
+  font-size: 0.72rem;
+  font-weight: 700;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+}
+.conventional-conversation__identity h1 {
+  overflow: hidden;
+  font-size: 1.15rem;
+  font-weight: 750;
+  letter-spacing: -0.02em;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.conventional-conversation__header button,
+.conventional-header-menu {
+  display: grid;
+  width: 2.75rem;
+  height: 2.75rem;
+  place-items: center;
+  border: 0;
+  border-radius: 0.4rem;
+  background: transparent;
+}
+.conventional-conversation__header button:hover {
+  background: var(--cw-surface-muted);
+}
+.conventional-conversation__actions {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 0.45rem;
+}
+.conventional-conversation__actions .conventional-status-chip {
+  width: 0.55rem;
+  min-height: 0.55rem;
+  padding: 0;
+  border: 0;
+  border-radius: 999px;
+  background: var(--cw-accent);
+  color: transparent;
+  font-size: 0;
+}
+.conventional-conversation__people {
+  min-width: 0;
+  overflow: hidden;
+  padding-top: 0.15rem;
+}
+.conventional-conversation__people ul {
+  display: flex;
+  justify-content: center;
+  gap: 0.6rem;
+  margin: 0;
+  padding: 0.1rem 0 0.25rem;
+  list-style: none;
+}
+.conventional-conversation__people li {
+  position: relative;
+  display: grid;
+  width: 2.25rem;
+  height: 2.25rem;
+  place-items: center;
+  flex: 0 0 auto;
+}
+.conventional-conversation__person-avatar {
+  display: grid;
+  width: 1.95rem;
+  height: 1.95rem;
+  place-items: center;
+  overflow: hidden;
+  border: 2px solid var(--cw-surface);
+  border-radius: 999px;
+  background: var(--cw-accent-soft);
+  color: var(--cw-accent-strong);
+  font-size: 0.61rem;
+  font-weight: 800;
+  letter-spacing: 0.02em;
+}
+.conventional-conversation__person-avatar img,
+.conventional-conversation__person-avatar svg {
+  width: 100%;
+  height: 100%;
+}
+.conventional-conversation__person-avatar img {
+  object-fit: cover;
+}
+.conventional-conversation__person-avatar svg {
+  width: 1rem;
+  height: 1rem;
+}
+.conventional-conversation__person-avatar--user {
+  background: var(--cw-surface-muted);
+  color: var(--cw-muted);
+}
+.conventional-conversation__person--active .conventional-conversation__person-avatar {
+  box-shadow:
+    0 0 0 2px var(--cw-surface),
+    0 0 0 3px var(--cw-accent-strong);
+}
+.conventional-conversation__person-presence {
+  position: absolute;
+  right: 0.12rem;
+  bottom: 0.08rem;
+  width: 0.58rem;
+  height: 0.58rem;
+  border: 2px solid var(--cw-surface);
+  border-radius: 999px;
+  background: var(--cw-accent);
+}
+.conventional-header-menu {
+  display: none !important;
+}
+.conventional-transcript {
+  grid-column: 1;
+  min-height: 0;
+  overflow-y: auto;
+  padding: 1.35rem clamp(0.8rem, 3vw, 2.5rem) 1.1rem;
+  overscroll-behavior: contain;
+  scrollbar-gutter: stable;
+}
+.conventional-date-divider {
+  display: flex;
+  max-width: 50rem;
+  align-items: center;
+  gap: 0.7rem;
+  margin: 1.1rem auto 0.55rem;
+  color: var(--cw-muted);
+  font-size: 0.68rem;
+  font-weight: 700;
+}
+.conventional-date-divider::before,
+.conventional-date-divider::after {
+  height: 1px;
+  flex: 1;
+  background: var(--cw-border);
+  content: "";
+}
+.conventional-date-divider span {
+  padding: 0.22rem 0.65rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 999px;
+  background: var(--cw-surface);
+  white-space: nowrap;
+}
+.conventional-message {
+  display: grid;
+  grid-template-columns: 1.9rem minmax(0, 1fr);
+  gap: 0.55rem;
+  max-width: 50rem;
+  margin: 0 auto;
+  padding: 0.35rem 0.25rem;
+  content-visibility: auto;
+  contain-intrinsic-size: 7rem;
+  border-radius: 0.75rem;
+}
+.conventional-message:hover {
+  background: color-mix(in srgb, var(--cw-surface-muted) 45%, transparent);
+}
+.conventional-message--highlighted {
+  background: var(--cw-accent-soft);
+  box-shadow: inset 3px 0 var(--cw-accent-strong);
+}
+.conventional-message__avatar {
+  display: grid;
+  width: 1.9rem;
+  height: 1.9rem;
+  margin-top: 0.2rem;
+  place-items: center;
+  overflow: hidden;
+  border-radius: 999px;
+  background: var(--cw-accent-soft);
+  color: var(--cw-accent-strong);
+  font-size: 0.59rem;
+  font-weight: 800;
+  letter-spacing: 0.02em;
+}
+.conventional-message__avatar img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+.conventional-message--system .conventional-message__avatar {
+  background: var(--cw-surface-muted);
+  color: var(--cw-muted);
+}
+.conventional-message--user {
+  grid-template-columns: minmax(0, 1fr) 2.05rem;
+  margin-right: 0;
+}
+.conventional-message--user .conventional-message__avatar {
+  order: 2;
+  width: 2.05rem;
+  height: 2.05rem;
+}
+.conventional-message--user .conventional-message__content {
+  order: 1;
+  min-width: 0;
+}
+.conventional-message--agent {
+  margin-left: 0;
+}
+.conventional-message--user .conventional-message__actions {
+  justify-content: flex-end;
+}
+.conventional-message__avatar > span {
+  display: grid;
+  width: 100%;
+  height: 100%;
+  place-items: center;
+}
+.conventional-message__avatar svg {
+  width: 1.05rem;
+  height: 1.05rem;
+}
+.conventional-message__content {
+  min-width: 0;
+}
+.conventional-message__bubble {
+  position: relative;
+  width: fit-content;
+  max-width: min(100%, 38rem);
+  min-width: 4rem;
+  padding: 0.62rem 0.82rem 0.46rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.2rem 1rem 1rem 1rem;
+  background: var(--cw-surface);
+  box-shadow: 0 0.15rem 0.4rem rgb(0 0 0 / 0.04);
+}
+.conventional-message--user .conventional-message__bubble {
+  margin-left: auto;
+  border-color: transparent;
+  border-radius: 1rem 0.2rem 1rem 1rem;
+  background: var(--cw-accent-soft);
+  box-shadow: none;
+}
+.conventional-message--system .conventional-message__bubble {
+  max-width: 100%;
+  border-style: dashed;
+  border-radius: 0.85rem;
+  background: transparent;
+  box-shadow: none;
+}
+.conventional-message__body {
+  line-height: 1.45;
+  overflow-wrap: anywhere;
+}
+.conventional-message__body p {
+  white-space: pre-wrap;
+}
+.conventional-message__body p + p {
+  margin-top: 0.45rem;
+}
+.conventional-message__meta {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 0.35rem;
+  min-height: 0.75rem;
+  margin-top: 0.28rem;
+  color: var(--cw-muted);
+  font-size: 0.64rem;
+  line-height: 1;
+}
+.conventional-message__receipt {
+  display: inline-flex;
+  color: var(--cw-accent-strong);
+}
+.conventional-message__receipt svg {
+  width: 0.8rem;
+  height: 0.8rem;
+  stroke-width: 2.5;
+}
+.conventional-principal-badge {
+  padding: 0.1rem 0.35rem;
+  border-radius: 999px;
+  background: var(--cw-accent-soft);
+  color: var(--cw-accent-strong) !important;
+  font-weight: 700;
+}
+.conventional-message__body pre {
+  max-width: 100%;
+  overflow: auto;
+  margin: 0.4rem 0 0;
+  padding: 0.7rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.55rem;
+  background: var(--cw-bg);
+  font-size: 0.78rem;
+}
+.conventional-message__deleted {
+  color: var(--cw-muted);
+  font-style: italic;
+}
+.conventional-message__actions {
+  display: flex;
+  min-height: 1.55rem;
+  gap: 0.25rem;
+  margin-top: 0.22rem;
+  opacity: 0;
+}
+.conventional-message:hover .conventional-message__actions,
+.conventional-message:focus-within .conventional-message__actions {
+  opacity: 1;
+}
+.conventional-message__actions button,
+.conventional-task-link {
+  display: inline-flex;
+  min-height: 1.8rem;
+  align-items: center;
+  gap: 0.3rem;
+  padding: 0 0.42rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 999px;
+  background: var(--cw-surface);
+  font-size: 0.7rem;
+}
+.conventional-message__actions svg {
+  width: 0.75rem;
+}
+.conventional-task-link {
+  margin-top: 0.55rem;
+  border-color: transparent;
+  background: var(--cw-surface-muted);
+  color: var(--cw-text);
+}
+.conventional-private-content,
+.conventional-artifact-card {
+  display: flex;
+  align-items: center;
+  gap: 0.6rem;
+  margin-top: 0.55rem;
+  padding: 0.6rem 0.7rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.65rem;
+  background: var(--cw-bg);
+}
+.conventional-private-content div,
+.conventional-artifact-card div {
+  display: grid;
+  min-width: 0;
+  gap: 0.12rem;
+}
+.conventional-private-content span,
+.conventional-artifact-card span {
+  color: var(--cw-muted);
+  font-size: 0.7rem;
+}
+.conventional-message__artifacts {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.4rem;
+  margin-top: 0.55rem;
+}
+.conventional-message__artifacts .conventional-artifact-card {
+  display: grid;
+  width: 6.5rem;
+  min-height: 5.5rem;
+  align-content: space-between;
+  align-items: start;
+  margin-top: 0;
+  padding: 0.6rem;
+  border: 0;
+  background: var(--cw-accent-soft);
+}
+.conventional-message__artifacts .conventional-artifact-card > svg {
+  width: 1.1rem;
+  height: 1.1rem;
+  color: var(--cw-accent-strong);
+}
+.conventional-message__artifacts .conventional-artifact-card strong,
+.conventional-message__artifacts .conventional-artifact-card span {
+  display: block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.conventional-load-more {
+  display: block;
+  min-height: 2.5rem;
+  margin: 0.75rem auto;
+  padding: 0 0.8rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.4rem;
+  background: var(--cw-surface);
+}
+
+.conventional-composer {
+  position: relative;
+  grid-column: 1;
+  margin: 0 clamp(0.8rem, 3vw, 2.5rem) 1.15rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 1.35rem;
+  background: var(--cw-surface);
+  box-shadow: 0 0.35rem 1.2rem rgb(0 0 0 / 0.07);
+}
+.conventional-composer__context {
+  padding: 0.45rem 0.9rem;
+  border-bottom: 1px solid var(--cw-border);
+  color: var(--cw-muted);
+  font-size: 0.72rem;
+}
+.conventional-composer__editor {
+  position: relative;
+}
+.conventional-composer textarea {
+  display: block;
+  width: 100%;
+  min-height: 4.1rem;
+  max-height: 12rem;
+  resize: vertical;
+  padding: 0.9rem 3.4rem 0.85rem;
+  border: 0;
+  border-radius: inherit;
+  outline: 0;
+  background: transparent;
+  color: var(--cw-text);
+  line-height: 1.45;
+}
+.conventional-composer textarea:focus,
+.conventional-composer textarea:focus-visible {
+  outline: none;
+  box-shadow: none;
+}
+.conventional-composer:has(textarea:focus) {
+  outline: 3px solid var(--cw-focus);
+  outline-offset: 2px;
+}
+.conventional-composer__toolbar {
+  position: relative;
+  display: block;
+  height: 0;
+  min-height: 0;
+  padding: 0;
+  border: 0;
+}
+.conventional-composer__toolbar > div {
+  position: absolute;
+  bottom: 0.65rem;
+  display: flex;
+  align-items: center;
+  gap: 0.15rem;
+}
+.conventional-composer__attachment-control {
+  left: 0.55rem;
+  position: absolute !important;
+}
+.conventional-composer__voice-control {
+  right: 0.55rem;
+}
+.conventional-composer__toolbar > div > button {
+  display: grid;
+  width: 2.3rem;
+  height: 2.3rem;
+  place-items: center;
+  border: 0;
+  border-radius: 999px;
+  background: transparent;
+}
+.conventional-composer__toolbar > div > button:hover {
+  background: var(--cw-surface-muted);
+}
+.conventional-composer__toolbar > p {
+  flex: 1;
+  color: var(--cw-muted);
+  font-size: 0.7rem;
+}
+.conventional-send-button,
+.conventional-primary-button {
+  display: inline-flex;
+  min-height: 2.4rem;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  gap: 0.4rem;
+  padding: 0 0.75rem;
+  border: 0;
+  border-radius: 0.4rem;
+  background: var(--cw-accent-strong);
+  color: var(--cw-accent-contrast) !important;
+  font-weight: 700;
+  white-space: nowrap;
+}
+.conventional-composer .conventional-send-button {
+  position: absolute;
+  right: 0.55rem;
+  bottom: 0.65rem;
+  display: grid;
+  width: 2.3rem;
+  height: 2.3rem;
+  min-height: 0;
+  padding: 0;
+  border-radius: 999px;
+  opacity: 1;
+  transition: opacity 0.15s ease;
+}
+.conventional-composer .conventional-send-button:disabled {
+  opacity: 0;
+  pointer-events: none;
+}
+.conventional-composer:has(.conventional-send-button:not(:disabled))
+  .conventional-composer__voice-control {
+  right: 3.05rem;
+}
+.conventional-send-button svg,
+.conventional-primary-button svg {
+  width: 1rem;
+  height: 1rem;
+  flex-shrink: 0;
+}
+.conventional-composer__attachments {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem;
+  padding: 0.45rem;
+  border-bottom: 1px solid var(--cw-border);
+}
+.conventional-composer__attachments > span {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.35rem;
+  padding: 0.3rem 0.45rem;
+  border-radius: 0.35rem;
+  background: var(--cw-accent-soft);
+  font-size: 0.75rem;
+}
+.conventional-composer__attachments button {
+  display: grid;
+  width: 1.3rem;
+  height: 1.3rem;
+  place-items: center;
+  border: 0;
+  background: transparent;
+}
+.conventional-mention-menu,
+.conventional-attachment-menu {
+  position: absolute;
+  z-index: 8;
+  bottom: calc(100% + 0.25rem);
+  left: 0;
+  min-width: 15rem;
+  max-height: 14rem;
+  overflow: auto;
+  padding: 0.35rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.5rem;
+  background: var(--cw-surface);
+  box-shadow: 0 12px 30px rgb(0 0 0 / 0.18);
+}
+.conventional-mention-menu button {
+  display: flex;
+  width: 100%;
+  min-height: 2.5rem;
+  align-items: center;
+  gap: 0.5rem;
+  padding: 0 0.55rem;
+  border: 0;
+  border-radius: 0.35rem;
+  background: transparent;
+  text-align: left;
+}
+.conventional-mention-menu button:hover {
+  background: var(--cw-surface-muted);
+}
+.conventional-attachment-menu {
+  bottom: calc(100% + 0.35rem);
+  display: grid;
+  gap: 0.2rem;
+}
+.conventional-attachment-menu label {
+  display: grid;
+  grid-template-columns: auto 1fr auto;
+  gap: 0.5rem;
+  align-items: center;
+  min-height: 2.5rem;
+  padding: 0 0.4rem;
+}
+.conventional-attachment-menu small {
+  color: var(--cw-muted);
+}
+.conventional-composer__status {
+  min-height: 0;
+}
+.conventional-composer__status p {
+  padding: 0.35rem 0.65rem;
+  color: var(--cw-danger);
+  font-size: 0.75rem;
+}
+.conventional-composer__status p.conventional-composer__status--muted {
+  color: var(--cw-muted);
+}
+
+.conventional-thread {
+  grid-column: 2;
+  grid-row: 1 / -1;
+  display: grid;
+  grid-template-rows: auto minmax(0, 1fr) auto;
+  min-width: 0;
+  border-left: 1px solid var(--cw-border);
+  background: var(--cw-main);
+}
+.conventional-thread__header {
+  display: flex;
+  min-height: 3.7rem;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0.55rem 0.8rem;
+  border-bottom: 1px solid var(--cw-border);
+  background: var(--cw-surface);
+}
+.conventional-thread__header > div:first-child > span {
+  color: var(--cw-muted);
+  font-size: 0.68rem;
+}
+.conventional-thread__header h2 {
+  font-size: 1rem;
+}
+.conventional-thread__header button {
+  display: grid;
+  width: 2.75rem;
+  height: 2.75rem;
+  place-items: center;
+  border: 0;
+  border-radius: 0.4rem;
+  background: transparent;
+}
+.conventional-thread__header > div:last-child {
+  display: flex;
+  gap: 0.15rem;
+}
+.conventional-thread__transcript {
+  min-height: 0;
+  overflow: auto;
+  padding: 0.75rem clamp(0.5rem, 2vw, 1rem);
+}
+.conventional-thread .conventional-composer {
+  margin: 0.5rem;
+}
+.conventional-thread__divider {
+  margin: 0.7rem 0.5rem;
+  color: var(--cw-muted);
+  font-size: 0.72rem;
+}
+.conventional-thread--missing {
+  place-items: center;
+  align-content: center;
+  gap: 0.5rem;
+  padding: 1rem;
+  text-align: center;
+}
+
+.conventional-directory {
+  height: 100%;
+  overflow: auto;
+  padding: clamp(1rem, 3vw, 2.5rem);
+}
+.conventional-tasks {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  min-height: 0;
+  overflow: hidden;
+  padding: clamp(1rem, 3vw, 2.5rem);
+}
+.conventional-surface-header {
+  display: flex;
+  max-width: 78rem;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 1rem;
+  margin: 0 auto 1.5rem;
+}
+.conventional-surface-header h1 {
+  font-size: clamp(1.5rem, 3vw, 2.1rem);
+}
+.conventional-surface-header p {
+  margin-top: 0.3rem;
+  color: var(--cw-muted);
+}
+.conventional-agent-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
+  gap: 0.8rem;
+  max-width: 78rem;
+  margin: auto;
+}
+.conventional-agent-card {
+  display: grid;
+  grid-template-columns: auto 1fr;
+  gap: 0.8rem;
+  padding: 1rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.65rem;
+  background: var(--cw-surface);
+}
+.conventional-agent-card__avatar {
+  display: grid;
+  width: 2.6rem;
+  height: 2.6rem;
+  place-items: center;
+  border-radius: 0.55rem;
+  background: var(--cw-accent-soft);
+  color: var(--cw-accent-strong);
+}
+.conventional-agent-card__identity {
+  display: grid;
+  gap: 0.25rem;
+}
+.conventional-agent-card__identity > span {
+  color: var(--cw-muted);
+  font-size: 0.78rem;
+}
+.conventional-agent-card__status {
+  grid-column: 1 / -1;
+}
+.conventional-agent-card > p {
+  grid-column: 1 / -1;
+  margin: 0;
+}
+.conventional-agent-status--compact .conventional-status-chip {
+  white-space: nowrap;
+}
+.conventional-agent-card__metadata {
+  grid-column: 1 / -1;
+  display: grid;
+  gap: 0.45rem;
+  padding-top: 0.7rem;
+  border-top: 1px solid var(--cw-border);
+}
+.conventional-agent-card__metadata p {
+  display: flex;
+  justify-content: space-between;
+  gap: 1rem;
+  font-size: 0.8rem;
+}
+.conventional-agent-card__metadata span {
+  color: var(--cw-muted);
+}
+.conventional-agent-card button {
+  display: inline-flex;
+  grid-column: 1 / -1;
+  min-height: 2.5rem;
+  align-items: center;
+  justify-content: center;
+  gap: 0.45rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.4rem;
+  background: var(--cw-surface-muted);
+}
+.conventional-agent-card button svg {
+  width: 1rem;
+  height: 1rem;
+  flex-shrink: 0;
+}
+
+.conventional-task-board {
+  display: grid;
+  flex: 1;
+  grid-template-columns: repeat(6, minmax(15rem, 1fr));
+  gap: 0.8rem;
+  width: 100%;
+  max-width: 94rem;
+  min-height: 0;
+  margin: auto;
+  overflow: auto;
+}
+.conventional-task-board > section {
+  display: flex;
+  flex-direction: column;
+  min-width: 15rem;
+  min-height: 0;
+}
+.conventional-task-board > section > header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0.5rem 0.25rem;
+}
+.conventional-task-board > section > header h2 {
+  font-size: 0.85rem;
+}
+.conventional-task-board > section > header span {
+  color: var(--cw-muted);
+  font-size: 0.75rem;
+}
+.conventional-task-column {
+  display: grid;
+  flex: 1;
+  align-content: start;
+  gap: 0.55rem;
+  min-height: 0;
+  overflow-y: auto;
+  padding: 0.55rem;
+  border-radius: 0.55rem;
+  background: var(--cw-surface-muted);
+}
+.conventional-task-card {
+  display: grid;
+  gap: 0.45rem;
+  width: 100%;
+  padding: 0.8rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.5rem;
+  background: var(--cw-surface);
+  color: inherit;
+  cursor: pointer;
+  font: inherit;
+  text-align: left;
+}
+.conventional-task-card:focus-visible {
+  outline: 2px solid var(--cw-accent-strong);
+  outline-offset: 2px;
+}
+.conventional-task-card--dragging {
+  opacity: 0.5;
+}
+.conventional-task-column--drop-target {
+  outline: 2px dashed var(--cw-accent-strong);
+  outline-offset: -2px;
+}
+.conventional-task-card__footer-action {
+  margin-left: auto;
+}
+.conventional-task-card__kind {
+  display: inline-flex;
+  flex-shrink: 0;
+  align-items: center;
+  margin-top: 0.1rem;
+  color: var(--cw-muted);
+}
+.conventional-task-card__kind svg {
+  width: 0.9rem;
+  height: 0.9rem;
+}
+.conventional-task-board__error {
+  max-width: 94rem;
+  margin: 0 auto;
+  color: var(--cw-danger);
+  font-size: 0.8rem;
+}
+.conventional-task-card p {
+  display: -webkit-box;
+  overflow: hidden;
+  color: var(--cw-muted);
+  font-size: 0.8rem;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+}
+.conventional-task-card footer {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem;
+  color: var(--cw-muted);
+  font-size: 0.68rem;
+}
+.conventional-task-card footer span {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+  padding: 0.15rem 0.3rem;
+  border-radius: 0.25rem;
+  background: var(--cw-surface-muted);
+}
+.conventional-task-card footer span svg {
+  width: 0.75rem;
+  height: 0.75rem;
+  flex: none;
+}
+.conventional-task-card__header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 0.5rem;
+}
+.conventional-task-card__header strong {
+  min-width: 0;
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.conventional-dependency-results {
+  display: grid;
+  gap: 0.15rem;
+  max-height: 12rem;
+  overflow-y: auto;
+  margin: 0.5rem 0 0;
+  padding: 0;
+  list-style: none;
+}
+.conventional-dependency-results button {
+  display: flex;
+  width: 100%;
+  align-items: center;
+  gap: 0.5rem;
+  padding: 0.45rem 0.55rem;
+  border: 1px solid transparent;
+  border-radius: 0.4rem;
+  background: transparent;
+  color: var(--cw-text);
+  font-size: 0.82rem;
+  text-align: left;
+}
+.conventional-dependency-results button:hover {
+  background: var(--cw-surface-muted);
+}
+.conventional-dependency-results button[aria-pressed="true"] {
+  border-color: var(--cw-accent);
+  background: var(--cw-accent-soft);
+  color: var(--cw-accent-strong);
+}
+.conventional-dependency-results button svg {
+  width: 0.9rem;
+  height: 0.9rem;
+  flex: none;
+}
+.conventional-dependency-results button span {
+  overflow: hidden;
+  min-width: 0;
+  flex: 1;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.conventional-dependency-results__empty {
+  padding: 0.45rem 0.55rem;
+  color: var(--cw-muted);
+  font-size: 0.82rem;
+}
+.conventional-priority {
+  display: inline-flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  padding: 0.3rem;
+  border-radius: 999px;
+  background: var(--cw-surface-muted);
+  color: var(--cw-muted);
+}
+.conventional-priority svg {
+  width: 0.75rem;
+  height: 0.75rem;
+}
+.conventional-priority--low {
+  background: var(--cw-surface-muted);
+  color: var(--cw-muted);
+}
+.conventional-priority--normal {
+  background: var(--cw-accent-soft);
+  color: var(--cw-accent-strong);
+}
+.conventional-priority--urgent {
+  background: color-mix(in srgb, var(--cw-danger) 12%, transparent);
+  color: var(--cw-danger);
+}
+.conventional-priority--high {
+  background: color-mix(in srgb, #a34f00 12%, transparent);
+  color: #a34f00;
+}
+/* Dark mode recesses the conversation surface below the elevated sidebars. */
+.dark .conventional-workspace,
+.dark .conventional-dialog {
+  --cw-main: oklch(0.145 0 0);
+}
+.dark .conventional-priority--high {
+  color: #ffb86b;
+}
+
+.conventional-detail-panel {
+  height: 100%;
+  overflow-y: auto;
+  padding: 1.2rem;
+  background: var(--cw-surface);
+}
+.conventional-detail-panel > header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.75rem;
+  padding-bottom: 0.8rem;
+  border-bottom: 1px solid var(--cw-border);
+}
+.conventional-detail-panel__close {
+  display: grid;
+  width: 2rem;
+  height: 2rem;
+  flex: none;
+  place-items: center;
+  border-radius: 0.35rem;
+  color: var(--cw-muted);
+}
+.conventional-detail-panel__close:hover {
+  background: var(--cw-surface-muted);
+  color: var(--cw-text);
+}
+.conventional-detail-panel__close svg {
+  width: 1rem;
+  height: 1rem;
+}
+.conventional-detail-panel__divider {
+  height: 1px;
+  min-height: 1px;
+  margin: 1rem 0 0;
+  border: 0;
+  background: var(--border, var(--cw-border));
+}
+.conventional-detail-panel input:focus-visible,
+.conventional-detail-panel textarea:focus-visible,
+.conventional-detail-panel select:focus-visible,
+.conventional-detail-panel button:focus-visible {
+  outline: 2px solid var(--cw-focus);
+  outline-offset: 1px;
+}
+.conventional-detail-panel label,
+.conventional-inline-form label,
+.conventional-dialog-form label {
+  display: grid;
+  gap: 0.35rem;
+  margin-top: 1rem;
+  color: var(--cw-muted);
+  font-size: 0.78rem;
+  font-weight: 700;
+}
+.conventional-detail-panel fieldset {
+  display: grid;
+  gap: 0.15rem;
+  margin-top: 1rem;
+  padding: 0.8rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.45rem;
+}
+.conventional-detail-panel__grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 0.8rem;
+  margin-top: 1rem;
+}
+.conventional-detail-panel__grid > label,
+.conventional-detail-panel__grid > .conventional-detail-panel__field {
+  min-width: 0;
+  margin-top: 0;
+}
+.conventional-detail-panel fieldset legend {
+  padding: 0;
+  color: var(--cw-muted);
+  font-size: 0.78rem;
+  font-weight: 700;
+}
+.conventional-detail-panel fieldset label {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  margin-top: 0.45rem;
+  font-weight: 400;
+  color: var(--cw-text);
+  font-size: 0.82rem;
+}
+.conventional-detail-panel input[type="checkbox"] {
+  width: 1rem;
+  height: 1rem;
+  min-height: 0;
+  flex: none;
+  padding: 0;
+  accent-color: var(--cw-accent-strong);
+}
+.conventional-detail-panel__field {
+  display: grid;
+  gap: 0.35rem;
+  margin-top: 1rem;
+}
+.conventional-detail-panel__label {
+  color: var(--cw-muted);
+  font-size: 0.78rem;
+  font-weight: 700;
+}
+.conventional-room-picker {
+  display: inline-flex;
+  width: 100%;
+  justify-content: flex-start;
+  gap: 0.5rem;
+}
+.conventional-room-picker svg {
+  width: 1rem;
+  height: 1rem;
+}
+.conventional-room-picker span {
+  min-width: 0;
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  text-align: left;
+}
+.conventional-detail-panel textarea {
+  width: 100%;
+  min-height: 6rem;
+  padding: 0.55rem 0.65rem;
+  border: 1px solid var(--border, var(--cw-border));
+  border-radius: 0.4rem;
+  background: var(--cw-surface);
+  color: var(--cw-text);
+  resize: vertical;
+}
+.conventional-detail-panel input:not([type="checkbox"]),
+.conventional-inline-form input,
+.conventional-inline-form textarea,
+.conventional-inline-form select,
+.conventional-dialog-form input,
+.conventional-search-field {
+  width: 100%;
+  min-height: 2.75rem;
+  padding: 0.55rem 0.65rem;
+  border: 1px solid var(--border, var(--cw-border));
+  border-radius: 0.4rem;
+  background: var(--cw-surface);
+  color: var(--cw-text);
+}
+.conventional-search-field {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+.conventional-search-field input {
+  min-width: 0;
+  flex: 1;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: inherit;
+}
+.conventional-detail-panel__actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.45rem;
+  margin-top: 1rem;
+}
+.conventional-detail-panel__actions button,
+.conventional-secondary-button {
+  display: inline-flex;
+  min-height: 2.5rem;
+  align-items: center;
+  gap: 0.35rem;
+  padding: 0 0.65rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.4rem;
+  background: var(--cw-surface);
+}
+.conventional-detail-panel__status {
+  min-height: 1.5rem;
+  margin-top: 0.5rem;
+  color: var(--cw-muted);
+  font-size: 0.75rem;
+}
+.conventional-inline-form {
+  max-width: 38rem;
+  margin: 0 auto 1rem;
+  padding: 1rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.65rem;
+  background: var(--cw-surface);
+}
+.conventional-inline-form__header {
+  display: flex;
+  justify-content: space-between;
+}
+.conventional-inline-form__header button {
+  border: 0;
+  background: transparent;
+}
+
+.conventional-dialog {
+  width: min(34rem, calc(100% - 2rem));
+  max-height: calc(100svh - 2rem);
+  overflow: auto;
+  padding: 0;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.7rem;
+  background: var(--cw-surface);
+  color: var(--cw-text);
+  box-shadow: 0 24px 70px rgb(0 0 0 / 0.28);
+}
+.conventional-dialog > .conventional-dialog__header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 1rem;
+  padding: 1.1rem;
+  border-bottom: 1px solid var(--cw-border);
+}
+.conventional-dialog__heading {
+  display: flex;
+  min-width: 0;
+  align-items: flex-start;
+  gap: 0.75rem;
+}
+.conventional-dialog__heading > div:last-child {
+  min-width: 0;
+}
+.conventional-settings-logo {
+  display: block;
+  flex: 0 0 auto;
+  width: 2.5rem;
+  height: 2.5rem;
+  border-radius: 0.75rem;
+}
+.conventional-dialog > .conventional-dialog__header [data-slot="dialog-description"] {
+  margin-top: 0.25rem;
+  color: var(--cw-muted);
+  font-size: 0.82rem;
+}
+.conventional-dialog > :not(.conventional-dialog__header) {
+  padding: 1.1rem;
+}
+.conventional-dialog-form {
+  display: grid;
+}
+.conventional-template-options,
+.conventional-search-results,
+.conventional-settings-list {
+  display: grid;
+  gap: 0.45rem;
+}
+.conventional-template-options button,
+.conventional-search-results button {
+  display: grid;
+  min-height: 3.2rem;
+  gap: 0.15rem;
+  padding: 0.55rem 0.7rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.45rem;
+  background: var(--cw-surface);
+  text-align: left;
+}
+.conventional-template-options {
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+}
+.conventional-template-options button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.5rem;
+}
+.conventional-template-options button svg {
+  width: 1.25rem;
+  height: 1.25rem;
+  flex: none;
+  color: var(--cw-muted);
+}
+.conventional-template-options button:hover,
+.conventional-search-results button:hover,
+.conventional-search-results button[aria-selected="true"] {
+  background: var(--cw-surface-muted);
+  outline: 2px solid var(--cw-focus);
+  outline-offset: -2px;
+}
+.conventional-template-options span,
+.conventional-search-results span,
+.conventional-settings-list span {
+  color: var(--cw-muted);
+  font-size: 0.75rem;
+}
+.conventional-dialog-empty {
+  padding: 1rem;
+  color: var(--cw-muted);
+  text-align: center;
+}
+.conventional-artifact-detail {
+  display: grid;
+  grid-template-rows: auto 1fr;
+  height: 100%;
+}
+.conventional-artifact-detail__body {
+  display: grid;
+  width: min(38rem, calc(100% - 2rem));
+  align-content: start;
+  gap: 0.8rem;
+  margin: 2rem auto;
+  padding: 1.5rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.6rem;
+  background: var(--cw-surface);
+}
+.conventional-artifact-detail__body > svg {
+  width: 2rem;
+  height: 2rem;
+  color: var(--cw-accent-strong);
+}
+.conventional-search-hint {
+  padding: 0.35rem 1rem 0.9rem;
+  color: var(--cw-muted);
+  font-size: 0.75rem;
+  text-align: right;
+}
+.conventional-conversation-details,
+.conventional-settings-list {
+  display: grid;
+  gap: 0.7rem;
+}
+.conventional-conversation-details p,
+.conventional-settings-list > div {
+  display: flex;
+  justify-content: space-between;
+  gap: 1rem;
+  padding-bottom: 0.7rem;
+  border-bottom: 1px solid var(--cw-border);
+}
+.conventional-conversation-details span {
+  color: var(--cw-muted);
+}
+
+.conventional-settings-dialog {
+  width: min(58rem, calc(100% - 2rem));
+  /* The shared dialog shell caps content at max-w-2xl; the settings dialog
+     needs its full intended width for the two-column layout. */
+  max-width: min(58rem, calc(100% - 2rem));
+  max-height: min(42rem, calc(100svh - 2rem));
+}
+
+.conventional-about-dialog {
+  width: min(22.5rem, calc(100% - 2rem));
+}
+.conventional-about-dialog > .conventional-dialog__header {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  overflow: hidden;
+  border: 0;
+  clip: rect(0 0 0 0);
+  white-space: nowrap;
+}
+.conventional-about-dialog__body {
+  display: grid;
+  gap: 0;
+  padding: 0 !important;
+}
+.conventional-about-dialog__identity {
+  display: grid;
+  justify-items: center;
+  gap: 0.5rem;
+  padding: 2.6rem 1.5rem 1.7rem;
+  text-align: center;
+}
+.conventional-about-dialog__identity h3 {
+  margin: 0 0 0.25rem;
+  font-size: 1.05rem;
+}
+.conventional-about-dialog__identity p {
+  margin: 0;
+  color: var(--cw-muted);
+  font-size: 0.82rem;
+}
+.conventional-about-dialog__identity small {
+  margin-top: 0.75rem;
+  color: var(--cw-muted);
+  font-size: 0.72rem;
+}
+.conventional-about-dialog__brand {
+  display: grid;
+  width: 4rem;
+  height: 4rem;
+  overflow: hidden;
+  border-radius: 1rem;
+}
+.conventional-about-dialog__brand svg {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+.conventional-about-dialog__footer {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.5rem;
+  padding: 0 1rem 1.75rem;
+}
+
+.plugins-dialog {
+  display: grid;
+  grid-template-rows: auto minmax(0, 1fr);
+  width: min(70rem, calc(100% - 2rem));
+  max-width: 70rem;
+  height: min(44rem, calc(100svh - 2rem));
+  overflow: hidden;
+}
+.plugins-dialog > :not(.conventional-dialog__header) {
+  min-height: 0;
+  padding: 0;
+}
+.plugins-browser {
+  display: grid;
+  grid-template: auto auto minmax(0, 1fr) / minmax(0, 1fr);
+  gap: 0;
+  min-height: 0;
+}
+.plugins-browser__tabs {
+  align-self: end;
+  margin: 0.5rem 1.25rem 0;
+}
+.plugins-browser__bar {
+  display: flex;
+  align-items: center;
+  gap: 0.65rem;
+  padding: 0.8rem 1.25rem;
+  border-bottom: 1px solid var(--cw-border);
+}
+.plugins-browser__search {
+  position: relative;
+  display: flex;
+  flex: 1;
+  align-items: center;
+}
+.plugins-browser__search > svg {
+  position: absolute;
+  left: 0.75rem;
+  width: 1rem;
+  height: 1rem;
+  color: var(--cw-muted);
+  pointer-events: none;
+}
+.plugins-browser__search input {
+  padding-left: 2.25rem;
+}
+.plugins-browser__count {
+  min-width: 4.5rem;
+  color: var(--cw-muted);
+  font-size: 0.75rem;
+  text-align: right;
+}
+.plugins-filter {
+  width: 12rem;
+}
+.plugins-filter__dot {
+  width: 0.4rem;
+  height: 0.4rem;
+  border-radius: 50%;
+  background: var(--cw-accent-strong);
+}
+.plugins-browser__list {
+  min-height: 0;
+  overflow: auto;
+  padding: 0.8rem 1.25rem 1.25rem;
+}
+.plugins-browser[data-filter-open="true"] .plugins-browser__list {
+  pointer-events: none;
+}
+.plugins-browser__group + .plugins-browser__group {
+  margin-top: 1.15rem;
+}
+.plugins-browser__group-heading {
+  position: sticky;
+  z-index: 1;
+  top: -0.8rem;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin: 0 -0.15rem 0.45rem;
+  padding: 0.65rem 0.15rem 0.4rem;
+  background: var(--cw-surface);
+  color: var(--cw-muted);
+}
+.plugins-browser__group-heading h3 {
+  margin: 0;
+  color: var(--cw-text);
+  font-size: 0.75rem;
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+.plugins-browser__group-heading span {
+  font-size: 0.72rem;
+  font-variant-numeric: tabular-nums;
+}
+.plugins-browser__grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 0.4rem;
+}
+.plugins-browser__row {
+  display: grid;
+  grid-template-columns: 2.75rem minmax(0, 1fr) auto;
+  align-items: center;
+  width: 100%;
+  gap: 0.75rem;
+  padding: 0.7rem;
+  border: 0;
+  border-radius: 0.75rem;
+  background: color-mix(in srgb, var(--cw-text) 4%, transparent);
+  color: var(--cw-text);
+  text-align: left;
+}
+.plugins-browser__more {
+  margin-top: 0.35rem;
+  color: var(--cw-muted);
+}
+.plugins-browser__row:hover,
+.plugins-browser__row:focus-visible {
+  background: color-mix(in srgb, var(--cw-text) 8%, transparent);
+}
+.plugins-browser__row-copy {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  gap: 0.1rem;
+}
+.plugins-browser__row-title {
+  display: flex;
+  align-items: center;
+  gap: 0.45rem;
+}
+.plugins-browser__row small {
+  overflow: hidden;
+  color: var(--cw-muted);
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.plugins-browser__row-meta {
+  color: var(--cw-muted);
+  font-size: 0.7rem;
+}
+.plugin-logo {
+  display: flex;
+  width: 2.75rem;
+  height: 2.75rem;
+  flex: 0 0 2.75rem;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.65rem;
+  background: var(--cw-surface-muted);
+  color: var(--plugin-brand, var(--cw-text));
+  font-size: 0.78rem;
+  font-weight: 800;
+  letter-spacing: -0.03em;
+}
+.plugin-logo img,
+.plugin-logo svg {
+  width: 1.65rem;
+  height: 1.65rem;
+  object-fit: contain;
+}
+.plugins-browser__skeleton {
+  display: grid;
+  gap: 0.35rem;
+}
+.plugins-browser__skeleton > div {
+  display: grid;
+  grid-template-columns: 2.75rem minmax(0, 1fr);
+  align-items: center;
+  gap: 0.75rem;
+  padding: 0.7rem;
+}
+.plugins-browser__skeleton > div > span {
+  display: grid;
+  gap: 0.45rem;
+}
+.plugins-browser__skeleton-mark {
+  width: 2.75rem;
+  height: 2.75rem;
+}
+.plugins-browser__skeleton-title {
+  width: 9rem;
+  height: 0.85rem;
+}
+.plugins-browser__skeleton-copy {
+  width: min(24rem, 70%);
+  height: 0.7rem;
+}
+.plugins-detail {
+  display: flex;
+  flex-direction: column;
+  align-content: start;
+  gap: 1rem;
+  overflow: auto;
+  padding: 1.5rem !important;
+}
+.plugins-detail > button:first-child {
+  align-self: flex-start;
+}
+.plugins-detail__hero {
+  display: flex;
+  align-items: flex-start;
+  gap: 1rem;
+  max-width: 40rem;
+}
+.plugins-detail__hero .plugin-logo {
+  width: 4rem;
+  height: 4rem;
+  flex-basis: 4rem;
+}
+.plugins-detail__hero .plugin-logo img,
+.plugins-detail__hero .plugin-logo svg {
+  width: 2.4rem;
+  height: 2.4rem;
+}
+.plugins-detail__eyebrow,
+.plugins-detail__actions,
+.plugins-detail__actions > span,
+.plugins-detail__section p {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+.plugins-detail h3 {
+  margin: 0.45rem 0 0.35rem;
+  font-size: 1.45rem;
+}
+.plugins-detail p,
+.plugins-detail small {
+  color: var(--cw-muted);
+}
+.plugins-detail__actions > span {
+  color: var(--cw-muted);
+  font-size: 0.78rem;
+}
+.plugins-detail__actions svg,
+.plugins-detail__section svg {
+  width: 0.95rem;
+  height: 0.95rem;
+}
+.plugins-detail__section {
+  max-width: 40rem;
+  padding: 1rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.65rem;
+  background: var(--cw-surface-muted);
+}
+.plugins-detail__section h4 {
+  margin: 0 0 0.65rem;
+  font-size: 0.82rem;
+}
+.plugins-detail__section ul {
+  display: grid;
+  gap: 0.45rem;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+.plugins-detail__section li {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  color: var(--cw-muted);
+  font-size: 0.82rem;
+}
+.plugins-detail__section small {
+  display: block;
+  margin-top: 0.55rem;
+  line-height: 1.5;
+}
+.conventional-settings-shell {
+  display: grid;
+  grid-template-columns: 13rem minmax(0, 1fr);
+  min-height: 32rem;
+  padding: 0 !important;
+}
+.conventional-settings-nav {
+  display: grid;
+  align-content: start;
+  gap: 0.2rem;
+  padding: 0.8rem;
+  border-right: 1px solid var(--cw-border);
+  background: var(--cw-surface-muted);
+}
+.conventional-settings-nav__group {
+  display: grid;
+  gap: 0.15rem;
+}
+.conventional-settings-nav__label {
+  margin: 0.45rem 0.7rem 0.2rem;
+  color: var(--cw-muted);
+  font-size: 0.68rem;
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+.conventional-settings-nav button {
+  min-height: 2.5rem;
+  padding: 0.55rem 0.7rem;
+  border: 0;
+  border-radius: 0.4rem;
+  background: transparent;
+  display: flex;
+  align-items: center;
+  gap: 0.6rem;
+  text-align: left;
+}
+.conventional-settings-nav button svg {
+  width: 1.05rem;
+  height: 1.05rem;
+  color: var(--cw-muted);
+}
+.conventional-settings-nav button:hover,
+.conventional-settings-nav button[aria-selected="true"] {
+  background: var(--cw-surface);
+  color: var(--cw-accent-strong);
+  font-weight: 700;
+}
+.conventional-settings-nav button[aria-selected="true"] svg {
+  color: var(--cw-accent-strong);
+}
+.conventional-settings-panel {
+  min-width: 0;
+  padding: 1.2rem;
+}
+.conventional-settings-panel > header {
+  display: flex;
+  align-items: flex-start;
+  gap: 0.7rem;
+  margin-bottom: 1rem;
+}
+.conventional-settings-panel > header > svg {
+  width: 1.4rem;
+  height: 1.4rem;
+  margin-top: 0.15rem;
+  color: var(--cw-accent-strong);
+}
+.conventional-settings-panel > header p,
+.conventional-settings-row p,
+.conventional-settings-note {
+  color: var(--cw-muted);
+  font-size: 0.8rem;
+  line-height: 1.45;
+}
+.conventional-settings-row {
+  display: flex;
+  min-height: 4.15rem;
+  align-items: center;
+  justify-content: space-between;
+  gap: 1rem;
+  padding: 0.75rem 0;
+  border-bottom: 1px solid var(--cw-border);
+}
+.conventional-settings-row > div {
+  min-width: 0;
+}
+.conventional-settings-row h4 {
+  margin: 0 0 0.2rem;
+  font-size: 0.9rem;
+}
+.conventional-settings-row input:not([type="checkbox"]) {
+  width: min(13rem, 44%);
+  min-height: 2.4rem;
+  padding: 0 0.65rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.4rem;
+  background: var(--cw-surface);
+  color: var(--cw-text);
+}
+.conventional-settings-row input[type="checkbox"] {
+  width: 1.1rem;
+  height: 1.1rem;
+  accent-color: var(--cw-accent-strong);
+}
+.conventional-settings-row button,
+.conventional-settings-row a {
+  min-height: 2.35rem;
+  padding: 0.45rem 0.7rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.4rem;
+  background: var(--cw-surface);
+  color: var(--cw-text);
+  text-decoration: none;
+  white-space: nowrap;
+}
+.conventional-settings-note {
+  display: flex;
+  align-items: flex-start;
+  gap: 0.5rem;
+  margin-top: 1rem !important;
+  padding: 0.75rem;
+  border-radius: 0.45rem;
+  background: var(--cw-surface-muted);
+}
+.conventional-spin {
+  animation: conventional-spin 0.8s linear infinite;
+}
+.conventional-agent-status {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem;
+}
+.conventional-agent-status--compact {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem;
+}
+.conventional-status-chip {
+  display: inline-flex;
+  min-height: 1.45rem;
+  align-items: center;
+  padding: 0.15rem 0.45rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 999px;
+  color: var(--cw-muted);
+  font-size: 0.7rem;
+  font-weight: 700;
+}
+.conventional-status-chip--ready {
+  border-color: var(--cw-accent);
+  color: var(--cw-accent-strong);
+  background: var(--cw-accent-soft);
+}
+.conventional-status-chip--warning {
+  border-color: #b7791f;
+  color: #8a4b08;
+  background: #fff4d6;
+}
+.dark .conventional-status-chip--warning {
+  color: #ffd28a;
+  background: #3a2b14;
+}
+.conventional-agent-customization {
+  max-width: 52rem;
+}
+.conventional-agent-customization .conventional-inline-form__header p,
+.conventional-agent-delete-note {
+  color: var(--cw-muted);
+  font-size: 0.75rem;
+}
+.conventional-form-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 0.8rem;
+  margin-top: 1rem;
+}
+.conventional-form-grid label {
+  display: grid;
+  gap: 0.35rem;
+  color: var(--cw-muted);
+  font-size: 0.78rem;
+  font-weight: 700;
+}
+.conventional-form-grid input,
+.conventional-form-grid select,
+.conventional-form-grid textarea {
+  min-width: 0;
+  min-height: 2.45rem;
+  padding: 0.55rem 0.65rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.4rem;
+  background: var(--cw-surface);
+  color: var(--cw-text);
+}
+.conventional-form-grid__wide {
+  grid-column: 1 / -1;
+}
+.conventional-agent-customization__actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.7rem;
+  align-items: center;
+  margin-top: 1rem;
+}
+.conventional-danger-button {
+  min-height: 2.5rem;
+  padding: 0 0.8rem;
+  border: 1px solid var(--cw-danger);
+  border-radius: 0.4rem;
+  background: transparent;
+  color: var(--cw-danger) !important;
+}
+.conventional-destructive-confirmation {
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr) auto auto;
+  align-items: center;
+  gap: 0.55rem;
+  width: 100%;
+  padding: 0.7rem;
+  border: 1px solid var(--cw-danger);
+  border-radius: 0.45rem;
+  color: var(--cw-danger);
+}
+.conventional-agent-delete-note {
+  margin-top: 0.8rem !important;
+}
+@keyframes conventional-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@media (max-width: 44rem) {
+  .plugins-dialog {
+    width: calc(100% - 1rem);
+    height: calc(100svh - 1rem);
+  }
+  .plugins-browser__bar {
+    display: grid;
+    grid-template-columns: auto minmax(0, 1fr);
+    padding-inline: 0.85rem;
+  }
+  .plugins-browser__count {
+    grid-column: 1 / -1;
+    text-align: left;
+  }
+  .plugins-browser__list {
+    padding-inline: 0.85rem;
+  }
+  .plugins-browser__row {
+    grid-template-columns: 2.5rem minmax(0, 1fr) auto;
+    padding-inline: 0.45rem;
+  }
+  .plugins-browser__grid {
+    grid-template-columns: minmax(0, 1fr);
+  }
+  .plugin-logo {
+    width: 2.5rem;
+    height: 2.5rem;
+    flex-basis: 2.5rem;
+  }
+  .plugins-detail {
+    padding: 1rem !important;
+  }
+  .plugins-detail__hero {
+    flex-direction: column;
+  }
+  .conventional-settings-shell {
+    grid-template-columns: 1fr;
+  }
+  .conventional-settings-nav {
+    display: flex;
+    align-items: flex-start;
+    gap: 0.75rem;
+    overflow-x: auto;
+    border-right: 0;
+    border-bottom: 1px solid var(--cw-border);
+  }
+  .conventional-settings-nav__group {
+    min-width: max-content;
+  }
+  .conventional-settings-panel {
+    min-height: 27rem;
+  }
+  .conventional-settings-row {
+    align-items: flex-start;
+  }
+  .conventional-settings-row input:not([type="checkbox"]) {
+    width: 9rem;
+    flex: none;
+  }
+  .conventional-form-grid {
+    grid-template-columns: 1fr;
+  }
+  .conventional-form-grid__wide {
+    grid-column: auto;
+  }
+  .conventional-destructive-confirmation {
+    grid-template-columns: auto 1fr;
+  }
+}
+
+.conventional-empty,
+.conventional-error,
+.conventional-skeleton {
+  display: grid;
+  max-width: 30rem;
+  min-height: 14rem;
+  align-content: center;
+  justify-items: center;
+  gap: 0.65rem;
+  margin: auto;
+  padding: 2rem;
+  color: var(--cw-muted);
+  text-align: center;
+}
+.conventional-empty h2,
+.conventional-error h2 {
+  color: var(--cw-text);
+}
+.conventional-empty svg,
+.conventional-error svg {
+  width: 2rem;
+  height: 2rem;
+}
+.conventional-error button {
+  min-height: 2.5rem;
+  padding: 0 0.8rem;
+  border: 1px solid var(--cw-border);
+  border-radius: 0.4rem;
+  background: var(--cw-surface);
+}
+.conventional-skeleton > div {
+  width: min(26rem, 75vw);
+  height: 0.8rem;
+  border-radius: 999px;
+  background: var(--cw-surface-muted);
+  animation: conventional-pulse 1.5s ease-in-out infinite;
+}
+.conventional-skeleton > div:nth-child(2) {
+  width: min(20rem, 60vw);
+}
+.conventional-skeleton > div:nth-child(3) {
+  width: min(23rem, 68vw);
+}
+.visually-hidden {
+  position: absolute !important;
+  width: 1px !important;
+  height: 1px !important;
+  overflow: hidden !important;
+  clip: rect(0 0 0 0) !important;
+  white-space: nowrap !important;
+  clip-path: inset(50%) !important;
+}
+
+@keyframes conventional-pulse {
+  50% {
+    opacity: 0.45;
+  }
+}
+
+@media (max-width: 64rem) {
+  .conventional-workspace {
+    grid-template-columns: 15rem minmax(0, 1fr);
+  }
+  .conventional-topbar {
+    grid-template-columns: 15rem minmax(0, 1fr) auto auto;
+  }
+  .conventional-conversation--thread-open {
+    grid-template-columns: minmax(20rem, 1fr) minmax(18rem, 22rem);
+  }
+}
+
+@media (max-width: 48rem) {
+  .conventional-workspace {
+    grid-template-columns: minmax(0, 1fr);
+  }
+  .conventional-topbar {
+    grid-template-columns: 1fr auto auto;
+  }
+  .conventional-topbar__context {
+    display: none;
+  }
+  .conventional-sidebar {
+    position: fixed;
+    z-index: 40;
+    top: 0;
+    bottom: 0;
+    left: 4rem;
+    width: min(19rem, calc(100% - 7rem));
+    transform: translateX(-105%);
+    transition: transform 0.18s ease;
+    box-shadow: 12px 0 38px rgb(0 0 0 / 0.25);
+    grid-template-rows: auto auto minmax(0, 1fr);
+  }
+  .conventional-sidebar__resize {
+    display: none;
+  }
+  .conventional-sidebar--open {
+    transform: none;
+  }
+  .conventional-sidebar__close {
+    display: grid;
+    justify-self: end;
+    width: 2.5rem;
+    height: 2.5rem;
+    margin: 0.5rem 0.5rem 0;
+    place-items: center;
+    border-radius: 0.4rem;
+  }
+  .conventional-sidebar-scrim {
+    position: fixed;
+    z-index: 39;
+    inset: 0 0 0 4rem;
+    display: block;
+    border: 0;
+    background: rgb(0 0 0 / 0.58);
+  }
+  .conventional-main {
+    grid-column: 1;
+  }
+  .conventional-conversation__header {
+    padding-left: 4.2rem;
+  }
+  .conventional-mobile-menu {
+    position: fixed;
+    z-index: 12;
+    top: 0.65rem;
+    left: 4.65rem;
+    display: grid;
+    width: 2.75rem;
+    height: 2.75rem;
+    place-items: center;
+    border: 1px solid var(--cw-border);
+    border-radius: 0.4rem;
+    background: var(--cw-surface);
+    color: var(--cw-text);
+  }
+  .conventional-header-menu {
+    display: grid !important;
+  }
+  .conventional-conversation--thread-open {
+    grid-template-columns: minmax(0, 1fr);
+  }
+  .conventional-conversation--thread-open > .conventional-conversation__header,
+  .conventional-conversation--thread-open > .conventional-transcript,
+  .conventional-conversation--thread-open > .conventional-composer {
+    visibility: hidden;
+  }
+  .conventional-thread {
+    position: absolute;
+    z-index: 15;
+    inset: 0;
+    grid-column: 1;
+    border-left: 0;
+  }
+  .conventional-message__actions {
+    opacity: 1;
+  }
+  .conventional-task-board {
+    grid-template-columns: repeat(6, minmax(14rem, 75vw));
+  }
+  .conventional-surface-header {
+    flex-direction: column;
+  }
+}
+
+@media (max-width: 30rem) {
+  .conventional-account-button span {
+    display: none;
+  }
+  .conventional-transcript {
+    padding-inline: 0.4rem;
+  }
+  .conventional-composer {
+    margin-inline: 0.5rem;
+  }
+  .conventional-composer__toolbar > p {
+    display: none;
+  }
+  .conventional-message {
+    grid-template-columns: 1.75rem minmax(0, 1fr);
+    gap: 0.45rem;
+  }
+  .conventional-message--user {
+    grid-template-columns: minmax(0, 1fr) 1.9rem;
+  }
+  .conventional-message--user .conventional-message__avatar {
+    width: 1.9rem;
+    height: 1.9rem;
+  }
+  .conventional-message__avatar {
+    width: 1.75rem;
+    height: 1.75rem;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .conventional-workspace *,
+  .conventional-workspace *::before,
+  .conventional-workspace *::after {
+    scroll-behavior: auto !important;
+    transition-duration: 0.01ms !important;
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+  }
+}