collabmd 0.1.41 → 0.1.42

package/src/client/styles/features/backlinks.css

@@ -28,7 +28,7 @@
   flex-direction: column-reverse;
   overflow: hidden;
   border: 1px solid var(--color-divider);
-  border-radius: var(--radius-xl-plus);
+  border-radius: var(--radius-lg);
   background: var(--surface-overlay);
   box-shadow: var(--shadow-floating-soft);
   backdrop-filter: blur(16px);
@@ -37,8 +37,7 @@
 }
 
 .backlinks-panel-dock:hover {
-  transform: translateY(-1px);
-  box-shadow: var(--shadow-floating-hover);
+  box-shadow: var(--shadow-floating-soft);
 }
 
 .backlinks-panel-header .backlinks-header {
@@ -91,7 +90,7 @@
 }
 
 .backlinks-panel-dock .backlinks-header {
-  padding: 11px 14px;
+  padding: var(--space-3) var(--space-4);
   background: var(--surface-overlay-header);
 }
 
@@ -159,7 +158,7 @@
   width: min(320px, calc(100vw - var(--space-8)));
   max-height: none;
   border: 1px solid var(--border-accent-muted);
-  border-radius: var(--radius-xl);
+  border-radius: var(--radius-lg);
   background: var(--surface-overlay-strong);
   box-shadow: var(--shadow-floating-soft);
   opacity: 0;
@@ -196,18 +195,18 @@
 }
 
 .backlinks-panel-dock .backlinks-list {
-  padding: 10px;
+  padding: var(--space-2) var(--space-3);
 }
 
 .backlinks-panel-header .backlinks-list {
-  padding: 10px;
+  padding: var(--space-2) var(--space-3);
 }
 
 .backlink-item {
   display: block;
   width: 100%;
   padding: var(--space-3);
-  border: 1px solid var(--color-divider);
+  border: 1px solid transparent;
   border-radius: var(--radius-md);
   background: var(--color-surface);
   text-align: left;
@@ -216,13 +215,14 @@
 }
 
 .backlinks-panel-dock .backlink-item {
-  border-radius: var(--radius-lg);
-  background: var(--surface-overlay-soft);
+  border-radius: var(--radius-md);
+  background: transparent;
 }
 
 .backlink-item:hover {
-  border-color: var(--color-primary);
-  background: oklch(from var(--color-primary) l c h / 0.04);
+  border-color: transparent;
+  background: var(--color-surface-offset);
+  box-shadow: inset 3px 0 0 var(--color-primary);
 }
 
 .backlink-item:focus-visible {

package/src/client/styles/features/collaboration-chat.css

@@ -44,7 +44,7 @@
   gap: var(--space-3);
   width: min(360px, calc(100vw - var(--space-6)));
   max-height: min(70vh, 520px);
-  padding: var(--space-3);
+  padding: var(--space-4);
   border: 1px solid var(--color-border);
   border-radius: var(--radius-lg);
   background: oklch(from var(--color-surface) l c h / 0.98);
@@ -106,16 +106,15 @@
 }
 
 .chat-notification-action.is-blocked {
-  color: var(--color-warning);
+  border-color: var(--color-divider);
+  color: var(--color-text-faint);
 }
 
 .chat-empty-state {
-  padding: var(--space-4);
-  border: 1px dashed var(--color-border);
-  border-radius: var(--radius-md);
-  background: var(--color-surface-2);
+  padding: var(--space-3) var(--space-1);
   color: var(--color-text-muted);
   font-size: var(--text-label);
+  line-height: 1.45;
 }
 
 .chat-messages {
@@ -197,9 +196,9 @@
   width: fit-content;
   max-width: 78%;
   margin: 0;
-  padding: 10px 12px;
+  padding: 8px 12px;
   border: 1px solid var(--color-divider);
-  border-radius: var(--radius-md);
+  border-radius: var(--radius-lg);
   background: var(--color-surface-2);
   color: var(--color-text);
   font-size: var(--text-ui-sm);

package/src/client/styles/features/collaboration-dialogs.css

@@ -46,7 +46,7 @@
 .app-dialog-form {
   display: grid;
   gap: var(--space-4);
-  padding: var(--space-5);
+  padding: var(--space-6);
 }
 
 .app-dialog-header {
@@ -56,7 +56,8 @@
 
 .app-dialog-title {
   font-size: var(--text-base);
-  font-weight: 600;
+  font-weight: 650;
+  letter-spacing: -0.01em;
 }
 
 .app-dialog-copy {
@@ -71,9 +72,9 @@
 
 .app-dialog-label {
   color: var(--color-text-muted);
-  font-size: var(--text-xs);
-  font-weight: 600;
-  letter-spacing: 0.08em;
+  font-size: var(--text-meta);
+  font-weight: 700;
+  letter-spacing: 0.06em;
   text-transform: uppercase;
 }
 

package/src/client/styles/features/collaboration-presence.css

@@ -137,9 +137,9 @@
   z-index: 30;
   display: flex;
   flex-direction: column;
-  gap: var(--space-3);
-  width: min(420px, calc(100vw - var(--space-6)));
-  max-height: min(72vh, 540px);
+  gap: var(--space-2);
+  width: min(360px, calc(100vw - var(--space-6)));
+  max-height: min(72vh, 480px);
   padding: var(--space-3);
   border: 1px solid var(--color-border);
   border-radius: var(--radius-lg);
@@ -170,7 +170,7 @@
 .presence-panel-list {
   display: flex;
   flex-direction: column;
-  gap: var(--space-2);
+  gap: var(--space-1);
   overflow-y: auto;
   min-height: 0;
   padding-right: var(--space-1);
@@ -193,7 +193,7 @@
   padding: 2px;
   border-radius: var(--radius-md);
   border: 1px solid transparent;
-  background: var(--surface-fill-subtle);
+  background: transparent;
 }
 
 .presence-panel-user.is-following {
@@ -208,8 +208,8 @@
   gap: var(--space-3);
   width: 100%;
   min-width: 0;
-  padding: 10px 12px;
-  border-radius: calc(var(--radius-md) - 2px);
+  padding: 9px 10px;
+  border-radius: var(--radius-sm);
   color: inherit;
   text-align: left;
   transition: background var(--transition-interactive), transform var(--transition-interactive);

package/src/client/styles/features/comment-card.css

@@ -13,9 +13,9 @@
   max-height: min(78vh, 720px);
   overflow: hidden;
   padding: var(--space-4);
-  border: 1px solid var(--border-comment-strong);
-  border-radius: var(--radius-xl-plus);
-  background: var(--surface-comment-card);
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-xl);
+  background: var(--color-surface);
   box-shadow: var(--shadow-card-strong);
   animation: comment-card-in 140ms cubic-bezier(0.16, 1, 0.3, 1);
 }
@@ -75,9 +75,10 @@
 .comment-card-quote,
 .comment-thread-card-excerpt {
   padding: var(--space-2) var(--space-3);
-  border: 1px solid var(--border-comment-muted);
-  border-radius: var(--radius-md);
-  background: var(--surface-comment-offset);
+  border: 0;
+  border-left: 2px solid var(--border-comment-active);
+  border-radius: 0;
+  background: var(--color-surface-offset);
   color: var(--color-text-muted);
   font-size: var(--text-label);
 }
@@ -156,10 +157,11 @@
 }
 
 .comment-message-card {
-  padding: var(--space-2) var(--space-3);
-  border: 1px solid var(--border-comment-soft);
-  border-radius: var(--radius-md);
-  background: var(--surface-comment-subtle-strong);
+  padding: var(--space-3) 0 0;
+  border: 0;
+  border-top: 1px solid var(--color-divider);
+  border-radius: 0;
+  background: transparent;
 }
 
 .comment-message-card-body {

package/src/client/styles/features/comment-overview.css

@@ -2,19 +2,16 @@
   flex: 1;
   overflow-x: hidden;
   overflow-y: auto;
-  padding: 6px;
+  padding: var(--space-2);
   background: var(--color-surface);
 }
 
 .comment-overview-empty {
-  padding: var(--space-5) var(--space-3);
-  color: var(--color-text-faint);
-  text-align: center;
-  font-size: var(--text-xs);
+  min-height: 160px;
 }
 
 .comment-overview-file {
-  padding: 9px 0 10px;
+  padding: var(--space-2) 0;
   border-bottom: 1px solid color-mix(in oklab, var(--color-divider) 80%, transparent);
 }
 
@@ -77,10 +74,10 @@
   width: 100%;
   gap: 6px;
   margin: 0 0 4px;
-  padding: 8px;
-  border: 1px solid color-mix(in oklab, var(--color-border) 58%, transparent);
-  border-radius: var(--radius-sm);
-  background: color-mix(in oklab, var(--color-surface-2) 88%, var(--color-surface) 12%);
+  padding: var(--space-2);
+  border: 1px solid transparent;
+  border-radius: var(--radius-md);
+  background: transparent;
   color: var(--color-text);
   text-align: left;
   cursor: pointer;
@@ -92,9 +89,9 @@
 
 .comment-overview-thread:hover,
 .comment-overview-thread:focus-visible {
-  border-color: color-mix(in oklab, var(--color-comment) 36%, var(--color-border));
+  border-color: transparent;
   background: var(--color-surface-offset);
-  box-shadow: inset 2px 0 0 color-mix(in oklab, var(--color-comment) 88%, transparent);
+  box-shadow: inset 3px 0 0 var(--color-comment);
   outline: none;
 }
 
@@ -119,7 +116,7 @@
   color: var(--color-comment);
   text-overflow: ellipsis;
   white-space: nowrap;
-  font-size: 10px;
+  font-size: var(--text-caption);
   font-weight: 700;
   line-height: 1.2;
 }
@@ -188,7 +185,7 @@
   min-width: 16px;
   height: 16px;
   margin-left: auto;
-  font-size: 10px;
+  font-size: var(--text-caption);
 }
 
 .file-tree-file.has-comments .file-tree-name {

package/src/client/styles/features/comments-drawer.css

@@ -4,17 +4,16 @@
   width: var(--preview-floating-comments-width, var(--panel-comments-width));
   min-width: var(--panel-comments-min-width);
   border-left: 1px solid var(--color-divider);
-  background: var(--surface-comment-shell);
+  background: var(--color-surface);
   display: flex;
   flex-direction: column;
   min-height: 0;
-  box-shadow: inset 1px 0 0 oklch(from var(--color-comment) l c h / 0.06);
 }
 
 .comments-drawer-header {
   padding: var(--space-3);
   border-bottom: 1px solid var(--color-divider);
-  background: var(--surface-comment-shell-header);
+  background: var(--color-surface);
 }
 
 .comments-drawer-title {
@@ -26,9 +25,7 @@
 }
 
 .comments-drawer-empty {
-  padding: var(--space-4);
-  color: var(--color-text-muted);
-  font-size: var(--text-label);
+  margin: auto 0;
 }
 
 .comments-drawer-list {
@@ -43,15 +40,13 @@
   --ui-record-padding: calc(var(--space-2) + 2px);
   --ui-record-gap: var(--space-1);
   --ui-record-radius: var(--radius-lg);
-  --ui-record-border: var(--border-comment-soft);
-  --ui-record-bg: var(--surface-comment-record);
-  --ui-record-border-hover: oklch(from var(--color-comment) l c h / 0.18);
-  --ui-record-bg-hover: var(--surface-comment-record-hover);
-  --ui-record-shadow-hover: var(--shadow-md);
+  --ui-record-border: transparent;
+  --ui-record-bg: transparent;
+  --ui-record-border-hover: transparent;
+  --ui-record-bg-hover: var(--color-surface-offset);
   --ui-record-border-active: var(--border-comment-active);
-  --ui-record-bg-active: var(--surface-comment-record-active);
-  --ui-record-shadow-active: var(--shadow-comment-outline);
-  --ui-record-hover-transform: translateY(-1px);
+  --ui-record-bg-active: var(--color-surface-offset);
+  --ui-record-shadow-active: inset 3px 0 0 var(--color-comment);
 }
 
 .comments-drawer-item-header {
@@ -80,10 +75,11 @@
   margin: 0;
   overflow: auto;
   overflow-wrap: anywhere;
-  padding: 6px 10px;
-  border: 1px solid var(--border-comment-soft);
-  border-radius: var(--radius-sm);
-  background: var(--surface-comment-offset);
+  padding: var(--space-2) var(--space-3);
+  border: 0;
+  border-left: 2px solid var(--border-comment-active);
+  border-radius: 0;
+  background: transparent;
   color: var(--color-text-muted);
   white-space: pre-wrap;
   word-break: break-word;

package/src/client/styles/features/diagram-preview.css

@@ -7,7 +7,7 @@
   overflow: hidden;
   margin: var(--space-4) 0;
   border: 1px solid var(--color-border);
-  border-radius: var(--radius-md);
+  border-radius: var(--radius-lg);
   background: var(--color-surface);
 }
 
@@ -60,8 +60,8 @@
   scrollbar-width: thin;
   -webkit-overflow-scrolling: touch;
   padding: var(--space-2) var(--space-3);
-  border-bottom: 1px solid var(--color-border);
-  background: var(--color-surface-raised);
+  border-bottom: 1px solid var(--color-divider);
+  background: var(--color-surface-2);
   color: var(--color-text-muted);
   font-size: var(--text-xs);
   user-select: none;
@@ -162,7 +162,7 @@
   max-width: none;
   overflow: hidden;
   border: 1px solid var(--color-border);
-  border-radius: var(--radius-md);
+  border-radius: var(--radius-lg);
   background: var(--color-surface);
 }
 

package/src/client/styles/features/diff-commit.css

@@ -6,7 +6,7 @@
   gap: var(--space-2);
   padding: var(--space-4);
   border-bottom: 1px solid var(--color-divider);
-  background: linear-gradient(180deg, var(--surface-accent-subtle), var(--color-surface));
+  background: var(--color-surface);
 }
 
 .diff-commit-subject {
@@ -49,9 +49,8 @@
   overflow: hidden;
   padding: 8px;
   border: 1px solid var(--color-divider);
-  border-radius: calc(var(--radius-lg) + 2px);
-  background: var(--surface-overlay-raised);
-  box-shadow: var(--shadow-elevated-soft);
+  border-radius: var(--radius-lg);
+  background: var(--color-surface);
 }
 
 .diff-commit-index-header {
@@ -75,13 +74,13 @@
 .diff-index-item {
   --ui-record-padding: 8px 9px;
   --ui-record-gap: 4px;
-  --ui-record-border: var(--color-border);
-  --ui-record-bg: var(--surface-overlay-offset);
-  --ui-record-border-hover: var(--color-border);
-  --ui-record-bg-hover: var(--surface-fill-strong);
-  --ui-record-border-active: var(--border-accent-strong);
-  --ui-record-bg-active: var(--surface-accent-subtle);
-  --ui-record-shadow-active: var(--shadow-accent-inset);
+  --ui-record-border: transparent;
+  --ui-record-bg: transparent;
+  --ui-record-border-hover: transparent;
+  --ui-record-bg-hover: var(--color-surface-offset);
+  --ui-record-border-active: transparent;
+  --ui-record-bg-active: var(--color-surface-offset);
+  --ui-record-shadow-active: inset 3px 0 0 var(--color-primary);
 }
 
 .diff-index-item-top,
@@ -116,13 +115,13 @@
 .diff-commit-section {
   overflow: hidden;
   border: 1px solid var(--color-divider);
-  border-radius: calc(var(--radius-lg) + 2px);
-  background: var(--surface-overlay-raised);
+  border-radius: var(--radius-lg);
+  background: var(--color-surface);
 }
 
 .diff-commit-section.active {
   border-color: var(--border-accent-strong);
-  box-shadow: var(--shadow-accent-outline);
+  box-shadow: inset 3px 0 0 var(--color-primary);
 }
 
 .diff-commit-section-header {
@@ -132,7 +131,7 @@
   gap: var(--space-3);
   width: 100%;
   padding: 10px 14px;
-  background: var(--surface-overlay-offset);
+  background: var(--color-surface);
   text-align: left;
 }
 
@@ -201,7 +200,7 @@
 .diff-commit-shell-focused .diff-commit-main .diff-file-block {
   overflow: hidden;
   border: 1px solid var(--color-divider);
-  border-radius: calc(var(--radius-lg) + 2px);
+  border-radius: var(--radius-lg);
 }
 
 .diff-file-block {

package/src/client/styles/features/diff-toolbar.css

@@ -6,7 +6,7 @@
   justify-content: space-between;
   gap: var(--space-3);
   padding: var(--space-2) var(--space-4);
-  background: var(--color-surface-2);
+  background: var(--color-surface);
   border-bottom: 1px solid var(--color-divider);
 }
 
@@ -31,10 +31,9 @@
 
 .diff-toolbar-actions-group-git {
   padding: var(--space-1);
-  border: 1px solid var(--color-divider);
-  border-radius: var(--radius-lg);
-  background: var(--surface-overlay);
-  box-shadow: var(--shadow-sheet-inset);
+  border: 0;
+  border-radius: var(--radius-md);
+  background: var(--color-surface-offset);
 }
 
 .diff-toolbar-actions-divider {

package/src/client/styles/features/git-branch.css

@@ -109,7 +109,7 @@
 .ui-segmented-control.git-panel-mode-switch .git-panel-mode-btn {
   min-width: 0;
   min-height: 28px;
-  padding: 0 12px;
+  padding: 0 var(--space-3);
   border-radius: var(--radius-full);
   color: var(--color-text-muted);
   font-size: var(--text-meta);

package/src/client/styles/features/git-files.css

@@ -47,8 +47,8 @@
 }
 
 .git-file-item {
-  padding: 5px var(--space-2) 5px calc(var(--space-2) + 10px);
-  border-radius: calc(var(--radius-md) - 2px);
+  padding: var(--space-1) var(--space-2) var(--space-1) calc(var(--space-2) + 10px);
+  border-radius: var(--radius-sm);
   background: transparent;
   color: var(--color-text-muted);
   text-align: left;

package/src/client/styles/features/git-history.css

@@ -8,15 +8,15 @@
 }
 
 .git-history-row {
-  --ui-record-padding: 10px 11px;
+  --ui-record-padding: var(--space-2) var(--space-3);
   --ui-record-gap: 4px;
-  --ui-record-border: var(--color-border);
-  --ui-record-bg: var(--surface-overlay-raised);
-  --ui-record-border-hover: var(--border-accent-muted);
-  --ui-record-bg-hover: var(--surface-fill-subtle);
-  --ui-record-border-active: var(--border-accent-stronger);
-  --ui-record-bg-active: var(--surface-accent-subtle);
-  --ui-record-shadow-active: var(--shadow-accent-inset);
+  --ui-record-border: transparent;
+  --ui-record-bg: transparent;
+  --ui-record-border-hover: transparent;
+  --ui-record-bg-hover: var(--color-surface-offset);
+  --ui-record-border-active: transparent;
+  --ui-record-bg-active: var(--color-surface-offset);
+  --ui-record-shadow-active: inset 3px 0 0 var(--color-primary);
 }
 
 .git-history-subject {
@@ -91,9 +91,8 @@
   overflow: hidden;
   padding: var(--space-3);
   border: 1px solid var(--color-divider);
-  border-radius: var(--radius-xl);
-  background: var(--surface-overlay-raised);
-  box-shadow: var(--shadow-elevated-soft);
+  border-radius: var(--radius-lg);
+  background: var(--color-surface);
 }
 
 .file-history-sidebar-header {
@@ -147,13 +146,13 @@
 .file-history-item {
   --ui-record-padding: var(--space-3);
   --ui-record-gap: var(--space-2);
-  --ui-record-border: var(--color-border);
-  --ui-record-bg: var(--surface-overlay-offset);
-  --ui-record-border-hover: var(--color-border);
-  --ui-record-bg-hover: var(--surface-fill-strong);
-  --ui-record-border-active: var(--border-accent-strong);
-  --ui-record-bg-active: var(--surface-accent-subtle);
-  --ui-record-shadow-active: var(--shadow-accent-inset);
+  --ui-record-border: transparent;
+  --ui-record-bg: transparent;
+  --ui-record-border-hover: transparent;
+  --ui-record-bg-hover: var(--color-surface-offset);
+  --ui-record-border-active: transparent;
+  --ui-record-bg-active: var(--color-surface-offset);
+  --ui-record-shadow-active: inset 3px 0 0 var(--color-primary);
   box-sizing: border-box;
   display: block;
   max-width: 100%;
@@ -162,13 +161,11 @@
 }
 
 .file-history-item.active {
-  border-color: var(--border-accent-strong);
-  box-shadow: var(--shadow-accent-outline);
+  border-color: transparent;
 }
 
 .file-history-item-local {
-  --ui-record-border: color-mix(in srgb, var(--color-primary) 20%, var(--color-divider));
-  --ui-record-bg: color-mix(in srgb, var(--surface-accent-subtle) 58%, var(--surface-overlay-offset));
+  --ui-record-bg: var(--surface-accent-subtle);
 }
 
 .file-history-item-top,
@@ -239,8 +236,8 @@
   gap: var(--space-3) var(--space-4);
   padding: var(--space-4);
   border: 1px solid var(--color-divider);
-  border-radius: var(--radius-xl);
-  background: linear-gradient(180deg, var(--surface-accent-subtle), var(--color-surface));
+  border-radius: var(--radius-lg);
+  background: var(--color-surface);
   overflow: hidden;
 }
 
@@ -284,8 +281,8 @@
 
 .file-history-detail-body {
   border: 1px solid var(--color-divider);
-  border-radius: var(--radius-xl);
-  background: var(--surface-overlay-raised);
+  border-radius: var(--radius-lg);
+  background: var(--color-surface);
   min-height: auto;
   min-width: 0;
   overflow-x: auto;

package/src/client/styles/features/media-lightbox.css

@@ -44,7 +44,7 @@
 .image-lightbox-title {
   min-width: 0;
   overflow: hidden;
-  padding: 8px 12px;
+  padding: var(--space-2) var(--space-3);
   border-radius: var(--radius-full);
   background: var(--surface-inverse-glass);
   color: var(--color-text-on-dark);
@@ -68,9 +68,9 @@
 
 .image-lightbox-btn {
   min-width: 0;
-  min-height: 40px;
-  min-width: 40px;
-  padding: 8px 12px;
+  min-height: var(--control-target-min);
+  min-width: var(--control-target-min);
+  padding: var(--space-2) var(--space-3);
   border: none;
   border-radius: var(--radius-full);
   background: var(--surface-inverse-glass);
@@ -93,7 +93,7 @@
 
 .image-lightbox-zoom-label {
   min-width: 58px;
-  padding: 8px 12px;
+  padding: var(--space-2) var(--space-3);
   border-radius: var(--radius-full);
   background: var(--surface-inverse-glass);
   color: var(--color-text-on-dark);