clay-server 3.6.0-beta.1 → 3.6.0

package/lib/public/app.js

@@ -31,12 +31,11 @@ import { initContextSources, updateTerminalList, updateBrowserTabList, handleCon
 import { initStickyNotes, handleNotesList, handleNoteCreated, handleNoteUpdated, handleNoteDeleted, openArchive, closeArchive, isArchiveOpen, hideNotes, showNotes, isNotesVisible, createNote } from './modules/sticky-notes.js';
 import { initTheme, getThemeColor, getComputedVar, onThemeChange, getCurrentTheme, getChatLayout } from './modules/theme.js';
 import { initTools, resetToolState, saveToolState, restoreToolState, renderAskUserQuestion, markAskUserAnswered, renderPermissionRequest, markPermissionResolved, markPermissionCancelled, renderElicitationRequest, markElicitationResolved, renderPlanBanner, renderPlanCard, handleTodoWrite, handleTaskCreate, handleTaskUpdate, startThinking, appendThinking, stopThinking, resetThinkingGroup, createToolItem, updateToolExecuting, updateToolResult, markAllToolsDone, addTurnMeta, resetTurnMetaCost, enableMainInput, getTools, getPlanContent, setPlanContent, isPlanFilePath, getTodoTools, updateSubagentActivity, addSubagentToolEntry, markSubagentDone, updateSubagentProgress, initSubagentStop, closeToolGroup, removeToolFromGroup } from './modules/tools.js';
-import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDaemonConfig, handleSetPinResult, handleKeepAwakeChanged, handleAutoContinueChanged, handleRestartResult, handleShutdownResult, handleSharedEnv, handleSharedEnvSaved, handleGlobalClaudeMdRead, handleGlobalClaudeMdWrite } from './modules/server-settings.js';
+import { initServerSettings, updateSettingsStats, updateDaemonConfig, handleSetPinResult, handleKeepAwakeChanged, handleAutoContinueChanged, handleRestartResult, handleShutdownResult, handleSharedEnv, handleSharedEnvSaved, handleGlobalClaudeMdRead, handleGlobalClaudeMdWrite } from './modules/server-settings.js';
 import { initProjectSettings, handleInstructionsRead, handleInstructionsWrite, handleProjectEnv, handleProjectEnvSaved, isProjectSettingsOpen, handleProjectSharedEnv, handleProjectSharedEnvSaved, handleProjectOwnerChanged } from './modules/project-settings.js';
 import { initSkills, handleSkillInstalled, handleSkillUninstalled } from './modules/skills.js';
 import { initMcp } from './modules/mcp-ui.js';
 import { initScheduler, resetScheduler, handleLoopRegistryUpdated, handleScheduleRunStarted, handleScheduleRunFinished, handleLoopScheduled, openSchedulerToTab, isSchedulerOpen, closeScheduler, enterCraftingMode, exitCraftingMode, handleLoopRegistryFiles, getUpcomingSchedules } from './modules/scheduler.js';
-import { initAsciiLogo, startLogoAnimation, stopLogoAnimation } from './modules/ascii-logo.js';
 import { initPlaybook, openPlaybook, getPlaybooks, getPlaybookForTip, isCompleted as isPlaybookCompleted } from './modules/playbook.js';
 import { initSTT } from './modules/stt.js';
 import { initProfile, getProfileLang } from './modules/profile.js';
@@ -58,7 +57,7 @@ import { getWs as _getWsRef, setWs as _setWsRef } from './modules/ws-ref.js';
 import { initHomeHub, showHomeHub as _hubShowHomeHub, hideHomeHub as _hubHideHomeHub, handleHubSchedules as _hubHandleHubSchedules, renderHomeHub as _hubRenderHomeHub, isHomeHubVisible } from './modules/app-home-hub.js';
 import { initRateLimit, handleRateLimitEvent as _rlHandleRateLimitEvent, updateRateLimitUsage as _rlUpdateRateLimitUsage, addScheduledMessageBubble as _rlAddScheduledMessageBubble, removeScheduledMessageBubble as _rlRemoveScheduledMessageBubble, handleFastModeState as _rlHandleFastModeState, getScheduledMsgEl, resetRateLimitState } from './modules/app-rate-limit.js';
 import { initCursors, handleRemoteCursorMove as _curHandleRemoteCursorMove, handleRemoteCursorLeave as _curHandleRemoteCursorLeave, handleRemoteSelection as _curHandleRemoteSelection, clearRemoteCursors as _curClearRemoteCursors, initCursorToggle } from './modules/app-cursors.js';
-import { initFavicon, updateFavicon as _favUpdateFavicon, setSendBtnMode as _favSetSendBtnMode, blinkIO as _favBlinkIO, blinkSessionDot as _favBlinkSessionDot, updateCrossProjectBlink as _favUpdateCrossProjectBlink, startUrgentBlink as _favStartUrgentBlink, stopUrgentBlink as _favStopUrgentBlink, setActivity as _favSetActivity, drawFaviconAnimFrame as _favDrawFaviconAnimFrame } from './modules/app-favicon.js';
+import { initFavicon, updateFavicon as _favUpdateFavicon, setSendBtnMode as _favSetSendBtnMode, blinkIO as _favBlinkIO, blinkSessionDot as _favBlinkSessionDot, updateCrossProjectBlink as _favUpdateCrossProjectBlink, startUrgentBlink as _favStartUrgentBlink, stopUrgentBlink as _favStopUrgentBlink, setActivity as _favSetActivity } from './modules/app-favicon.js';
 import { initHeader, closeSessionInfoPopover as _hdrCloseSessionInfoPopover, updateHistorySentinel as _hdrUpdateHistorySentinel, requestMoreHistory as _hdrRequestMoreHistory, prependOlderHistory as _hdrPrependOlderHistory } from './modules/app-header.js';
 import { initSessionActions } from './modules/session-actions.js';
 import { initMisc, flushPendingExtMessages, showImageModal as _miscShowImageModal, closeImageModal as _miscCloseImageModal, showPasteModal as _miscShowPasteModal, closePasteModal as _miscClosePasteModal, showConfirm as _miscShowConfirm, hideConfirm as _miscHideConfirm, showForceChangePinOverlay as _miscShowForceChangePinOverlay, sendExtensionCommand as _miscSendExtensionCommand, handleExtensionResult as _miscHandleExtensionResult } from './modules/app-misc.js';
@@ -504,13 +503,6 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
   initSplitView();
   initPaneBridge();
 
-  // --- Connect overlay (animated ASCII logo) ---
-  var asciiLogoCanvas = $("ascii-logo-canvas");
-  initAsciiLogo(asciiLogoCanvas);
-  startLogoAnimation();
-  function startVerbCycle() { startLogoAnimation(); }
-  function stopVerbCycle() { stopLogoAnimation(); }
-
   // --- Favicon, IO blink, status/activity -> modules/app-favicon.js
   function startPixelAnim() {}
   function stopPixelAnim() {}

package/lib/public/clay-studio-wordmark.svg

@@ -0,0 +1,20 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4611 1531" role="img" aria-label="Clay Studio">
+  <title>Clay Studio</title>
+  <style>
+    g { fill: #171717; }
+    @media (prefers-color-scheme: dark) { g { fill: #f2f2ef; } }
+  </style>
+  <metadata>Source Serif 4 v4.005, weight 400, optical size 60, tracking -0.01em, word gap 0.18em. Converted to outlines.</metadata>
+  <g fill="#171717" transform="translate(90 1116) scale(1 -1)">
+    <path d="M343 -16Q278 -16 224.0 8.5Q170 33 130.0 79.0Q90 125 68.5 190.0Q47 255 47 336Q47 416 69.5 480.5Q92 545 132.5 591.0Q173 637 227.0 661.5Q281 686 344 686Q379 686 423.0 677.5Q467 669 510 639L520 484H504L445 651L491 642L495 616Q455 646 419.5 655.5Q384 665 348 665Q288 665 237.5 626.5Q187 588 157.0 514.0Q127 440 127 334Q127 228 155.5 154.5Q184 81 233.0 43.0Q282 5 345 5Q378 5 418.5 14.0Q459 23 499 55V28L453 20L511 188H528L518 32Q475 4 431.5 -6.0Q388 -16 343 -16Z" transform="translate(0 0)"/>
+    <path d="M35 0V16L131 28H150L245 16V0ZM105 0Q107 23 107.5 61.0Q108 99 108.5 139.5Q109 180 109 212V677L31 694V708L172 744L180 736L176 563V212Q176 180 176.5 139.5Q177 99 178.0 61.0Q179 23 180 0Z" transform="translate(562 0)"/>
+    <path d="M156 -12Q107 -12 73.0 16.5Q39 45 39 100Q39 128 50.0 153.0Q61 178 92.0 200.5Q123 223 184 243Q199 248 219.0 254.0Q239 260 266.5 267.5Q294 275 329 283V267Q278 252 247.5 242.0Q217 232 203 226Q161 208 141.5 189.0Q122 170 116.0 152.0Q110 134 110 117Q110 74 131.5 55.5Q153 37 185 37Q207 37 226.0 42.0Q245 47 267.0 61.5Q289 76 319 106L327 68H297Q276 40 253.5 22.0Q231 4 206.5 -4.0Q182 -12 156 -12ZM369 -8Q331 -8 311.5 13.5Q292 35 291 75V77V308Q291 357 281.5 385.5Q272 414 252.0 426.0Q232 438 200 438Q181 438 163.0 433.5Q145 429 125 422L153 441L134 361Q130 341 119.0 330.0Q108 319 91 319Q74 319 66.0 329.0Q58 339 56 356Q67 405 114.0 434.5Q161 464 225 464Q271 464 300.5 447.5Q330 431 344.5 396.0Q359 361 359 306V83Q359 52 367.5 40.5Q376 29 390 29Q403 29 412.0 35.0Q421 41 434 55L444 47Q434 23 416.0 7.5Q398 -8 369 -8Z" transform="translate(825 0)"/>
+    <path d="M57 -259Q42 -259 27.0 -254.5Q12 -250 1.0 -241.0Q-10 -232 -15 -218Q-13 -201 0.5 -191.5Q14 -182 33 -182Q50 -182 63.5 -188.5Q77 -195 91 -206L115 -224L106 -228L85 -234Q112 -219 132.0 -192.5Q152 -166 170.0 -127.5Q188 -89 207 -40L236 35L237 39L313 246L389 452H417L232 -40Q208 -105 182.5 -154.5Q157 -204 127.0 -231.5Q97 -259 57 -259ZM225 -6 44 452H123L266 70L241 25ZM4 436V452H211V437L111 424H91ZM309 437V452H461V436L397 428H385Z" transform="translate(1245 0)"/>
+    <path d="M216 -16Q163 -16 117.5 -1.0Q72 14 40 36L48 188H64L105 12L61 36V52Q90 35 113.0 24.5Q136 14 160.5 9.5Q185 5 216 5Q260 5 294.0 20.0Q328 35 347.5 68.0Q367 101 367 155Q367 194 350.0 220.5Q333 247 304.5 266.0Q276 285 243 300L207 317Q169 336 133.0 359.5Q97 383 74.5 418.5Q52 454 52 508Q52 566 78.5 605.5Q105 645 150.0 665.5Q195 686 249 686Q299 686 336.0 673.5Q373 661 401 638L397 494H381L337 659L384 639L388 613Q354 648 320.5 656.5Q287 665 249 665Q212 665 180.5 652.0Q149 639 129.5 608.5Q110 578 110 527Q110 489 127.0 462.5Q144 436 172.5 417.0Q201 398 234 382L269 365Q309 346 345.5 322.5Q382 299 405.5 263.5Q429 228 429 172Q429 114 404.0 71.5Q379 29 331.5 6.5Q284 -16 216 -16Z" transform="translate(1890 0)"/>
+    <path d="M121 428V452H276V428ZM185 -12Q138 -12 110.0 13.5Q82 39 82 89Q82 117 82.0 140.5Q82 164 82 198L84 428H8V444L119 462L83 440L133 604H155L151 440V436V97Q151 58 166.0 41.5Q181 25 207 25Q227 25 244.0 33.5Q261 42 275 58L286 49Q276 30 262.5 16.5Q249 3 230.5 -4.5Q212 -12 185 -12Z" transform="translate(2339 0)"/>
+    <path d="M213 -12Q156 -12 124.5 21.5Q93 55 93 129V429L114 399L24 418V432L156 464L164 456L160 330V147Q160 82 179.5 59.5Q199 37 242 37Q266 37 289.0 45.5Q312 54 336.0 71.0Q360 88 385 111L393 95H389Q370 70 342.5 45.0Q315 20 282.5 4.0Q250 -12 213 -12ZM379 -10V90V93V403L306 418V432L442 464L450 456L446 330V25L513 16V0Z" transform="translate(2627 0)"/>
+    <path d="M225 -12Q176 -12 135.0 13.5Q94 39 69.0 89.5Q44 140 44 216Q44 295 70.5 350.5Q97 406 141.0 435.0Q185 464 237 464Q264 464 289.5 455.0Q315 446 337.5 426.0Q360 406 378 372H392L385 347Q348 391 318.5 408.5Q289 426 248 426Q212 426 181.5 403.5Q151 381 133.0 335.0Q115 289 115 220Q115 153 132.0 110.0Q149 67 179.5 46.0Q210 25 248 25Q289 25 321.0 51.0Q353 77 381 118L387 89H374Q359 61 337.0 38.0Q315 15 287.0 1.5Q259 -12 225 -12ZM365 -10V85V88V376V384V677L290 694V708L428 744L436 736L432 540V25L501 16V0Z" transform="translate(3153 0)"/>
+    <path d="M35 0V16L131 28H150L245 16V0ZM105 0Q107 23 107.5 61.0Q108 99 108.5 139.5Q109 180 109 212V258Q109 300 108.5 329.0Q108 358 106 389L31 406V420L172 464L180 456L176 330V212Q176 180 176.5 139.5Q177 99 178.0 61.0Q179 23 180 0ZM140 569Q118 569 102.5 583.0Q87 597 87 622Q87 646 102.5 660.0Q118 674 140 674Q163 674 178.0 660.0Q193 646 193 622Q193 597 178.0 583.0Q163 569 140 569Z" transform="translate(3672 0)"/>
+    <path d="M251 -12Q196 -12 149.0 14.5Q102 41 73.0 93.5Q44 146 44 224Q44 302 73.0 355.5Q102 409 149.0 436.5Q196 464 251 464Q306 464 353.0 437.5Q400 411 429.0 359.0Q458 307 458 228Q458 151 429.0 97.0Q400 43 353.0 15.5Q306 -12 251 -12ZM251 9Q292 9 322.0 34.5Q352 60 368.0 109.0Q384 158 384 228Q384 298 368.0 345.5Q352 393 322.0 418.0Q292 443 251 443Q210 443 179.5 417.5Q149 392 133.0 343.0Q117 294 117 224Q117 155 133.0 107.0Q149 59 179.5 34.0Q210 9 251 9Z" transform="translate(3930 0)"/>
+  </g>
+</svg>

package/lib/public/css/base.css

@@ -91,73 +91,155 @@ img.emoji {
 }
 
 :root {
-  --bg: #282a36;
-  --bg-alt: #363447;
-  --text: #f0f1f4;
-  --text-secondary: #f8f8f2;
-  --text-muted: #9ea8c7;
-  --text-dimmer: #6272a4;
-  --accent: #ffb86c;
-  --accent-hover: #ffc17e;
-  --accent-bg: rgba(255, 184, 108, 0.12);
-  --code-bg: #22242e;
-  --border: #44475a;
-  --border-subtle: #333644;
-  --input-bg: #3d3e51;
-  --user-bubble: #404154;
-  --error: #ff5555;
-  --success: #50fa7b;
-  --warning: #f1fa8c;
-  --accent-8: rgba(255, 184, 108, 0.08);
-  --accent-12: rgba(255, 184, 108, 0.12);
-  --accent-15: rgba(255, 184, 108, 0.15);
-  --accent-20: rgba(255, 184, 108, 0.20);
-  --accent-25: rgba(255, 184, 108, 0.25);
-  --accent-30: rgba(255, 184, 108, 0.30);
-  --accent2: #80bfff;
-  --accent2-hover: #8fc7ff;
-  --accent2-bg: rgba(128, 191, 255, 0.12);
-  --accent2-8: rgba(128, 191, 255, 0.08);
-  --accent2-12: rgba(128, 191, 255, 0.12);
-  --accent2-15: rgba(128, 191, 255, 0.15);
-  --accent2-20: rgba(128, 191, 255, 0.20);
-  --accent2-25: rgba(128, 191, 255, 0.25);
-  --accent2-30: rgba(128, 191, 255, 0.30);
-  --error-8: rgba(255, 85, 85, 0.08);
-  --error-12: rgba(255, 85, 85, 0.12);
-  --error-15: rgba(255, 85, 85, 0.15);
-  --error-25: rgba(255, 85, 85, 0.25);
-  --success-8: rgba(80, 250, 123, 0.08);
-  --success-12: rgba(80, 250, 123, 0.12);
-  --success-15: rgba(80, 250, 123, 0.15);
-  --success-25: rgba(80, 250, 123, 0.25);
-  --warning-bg: rgba(241, 250, 140, 0.12);
+  --brand-ink: #171717;
+  --brand-paper: #f2f2ef;
+  --brand-indigo: #5857fc;
+  --brand-green: #07e5a3;
+  --font-weight-body: 400;
+  --font-weight-ui: 500;
+  --font-weight-heading: 600;
+  --font-weight-emphasis: 700;
+  --bg: #171715;
+  --bg-alt: #20201d;
+  --text: #e8e8e2;
+  --text-secondary: #d1d1ca;
+  --text-muted: #a0a098;
+  --text-dimmer: #686861;
+  --accent: #7776ff;
+  --accent-hover: #8786ff;
+  --accent-bg: rgba(119, 118, 255, 0.12);
+  --link: #7f7ec8;
+  --link-hover: #8c8bd0;
+  --code-bg: #141412;
+  --border: #393934;
+  --border-subtle: #252521;
+  --input-bg: #2d2d29;
+  --ask-mate-bg: #20201d;
+  --user-bubble: #32322d;
+  --error: #ff7479;
+  --success: #07e5a3;
+  --warning: #e0b45b;
+  --accent-8: rgba(119, 118, 255, 0.08);
+  --accent-12: rgba(119, 118, 255, 0.12);
+  --accent-15: rgba(119, 118, 255, 0.15);
+  --accent-20: rgba(119, 118, 255, 0.20);
+  --accent-25: rgba(119, 118, 255, 0.25);
+  --accent-30: rgba(119, 118, 255, 0.30);
+  --accent2: #07e5a3;
+  --accent2-hover: #25e8ae;
+  --accent2-bg: rgba(7, 229, 163, 0.12);
+  --accent2-8: rgba(7, 229, 163, 0.08);
+  --accent2-12: rgba(7, 229, 163, 0.12);
+  --accent2-15: rgba(7, 229, 163, 0.15);
+  --accent2-20: rgba(7, 229, 163, 0.20);
+  --accent2-25: rgba(7, 229, 163, 0.25);
+  --accent2-30: rgba(7, 229, 163, 0.30);
+  --error-8: rgba(255, 116, 121, 0.08);
+  --error-12: rgba(255, 116, 121, 0.12);
+  --error-15: rgba(255, 116, 121, 0.15);
+  --error-25: rgba(255, 116, 121, 0.25);
+  --success-8: rgba(7, 229, 163, 0.08);
+  --success-12: rgba(7, 229, 163, 0.12);
+  --success-15: rgba(7, 229, 163, 0.15);
+  --success-25: rgba(7, 229, 163, 0.25);
+  --warning-bg: rgba(224, 180, 91, 0.12);
   --overlay-rgb: 255,255,255;
   --shadow-rgb: 0,0,0;
-  --hl-comment: #6272a4;
-  --hl-keyword: #ff79c6;
-  --hl-string: #50fa7b;
-  --hl-number: #ffb86c;
-  --hl-function: #80bfff;
-  --hl-variable: #ff5555;
-  --hl-type: #f1fa8c;
-  --hl-constant: #ffb86c;
-  --hl-tag: #ff5555;
-  --hl-attr: #80bfff;
-  --hl-regexp: #8be9fd;
-  --hl-meta: #bd93f9;
-  --hl-builtin: #ffb86c;
-  --hl-symbol: #bd93f9;
-  --hl-addition: #50fa7b;
-  --hl-deletion: #ff5555;
-  --sidebar-bg: #242631;
-  --sidebar-hover: #2f2f3f;
-  --sidebar-active: #3d3e51;
+  --hl-comment: #686861;
+  --hl-keyword: #c39af3;
+  --hl-string: #07e5a3;
+  --hl-number: #7776ff;
+  --hl-function: #8aa7ff;
+  --hl-variable: #ff7479;
+  --hl-type: #e0b45b;
+  --hl-constant: #7776ff;
+  --hl-tag: #ff7479;
+  --hl-attr: #8aa7ff;
+  --hl-regexp: #5fd2c0;
+  --hl-meta: #d69a7d;
+  --hl-builtin: #7776ff;
+  --hl-symbol: #d69a7d;
+  --hl-addition: #07e5a3;
+  --hl-deletion: #ff7479;
+  --sidebar-bg: #151513;
+  --sidebar-hover: #1c1c19;
+  --sidebar-active: #2d2d29;
+  --filebrowser-bg: #20201e;
+  --filebrowser-border: #282825;
   --safe-top: env(safe-area-inset-top, 0px);
   --safe-bottom: env(safe-area-inset-bottom, 0px);
   --content-width: 760px;
 }
 
+:root.light-theme {
+  --bg: #f7f7f3;
+  --bg-alt: #eeeeea;
+  --text: #252522;
+  --text-secondary: #44443f;
+  --text-muted: #73736c;
+  --text-dimmer: #a2a29b;
+  --accent: #5857fc;
+  --accent-hover: #4d4dde;
+  --accent-bg: rgba(88, 87, 252, 0.12);
+  --link: #4948b8;
+  --link-hover: #4241a6;
+  --code-bg: #f0f0ec;
+  --border: #d7d7d0;
+  --border-subtle: #eaeae5;
+  --input-bg: #edede9;
+  --ask-mate-bg: #f8f8f6;
+  --user-bubble: #e7e7e3;
+  --error: #c84b50;
+  --success: #087b59;
+  --warning: #956a19;
+  --sidebar-bg: #f2f2ee;
+  --sidebar-hover: #e8e8e4;
+  --sidebar-active: #e2e2de;
+  --filebrowser-bg: #f7f7f3;
+  --filebrowser-border: #e3e3e0;
+  --accent-8: rgba(88, 87, 252, 0.08);
+  --accent-12: rgba(88, 87, 252, 0.12);
+  --accent-15: rgba(88, 87, 252, 0.15);
+  --accent-20: rgba(88, 87, 252, 0.20);
+  --accent-25: rgba(88, 87, 252, 0.25);
+  --accent-30: rgba(88, 87, 252, 0.30);
+  --accent2: #07e5a3;
+  --accent2-hover: #06ca8f;
+  --accent2-bg: rgba(7, 229, 163, 0.12);
+  --accent2-8: rgba(7, 229, 163, 0.08);
+  --accent2-12: rgba(7, 229, 163, 0.12);
+  --accent2-15: rgba(7, 229, 163, 0.15);
+  --accent2-20: rgba(7, 229, 163, 0.20);
+  --accent2-25: rgba(7, 229, 163, 0.25);
+  --accent2-30: rgba(7, 229, 163, 0.30);
+  --error-8: rgba(200, 75, 80, 0.08);
+  --error-12: rgba(200, 75, 80, 0.12);
+  --error-15: rgba(200, 75, 80, 0.15);
+  --error-25: rgba(200, 75, 80, 0.25);
+  --success-8: rgba(8, 123, 89, 0.08);
+  --success-12: rgba(8, 123, 89, 0.12);
+  --success-15: rgba(8, 123, 89, 0.15);
+  --success-25: rgba(8, 123, 89, 0.25);
+  --warning-bg: rgba(149, 106, 25, 0.12);
+  --overlay-rgb: 0,0,0;
+  --hl-comment: #a2a29b;
+  --hl-keyword: #7a52a8;
+  --hl-string: #087b59;
+  --hl-number: #5857fc;
+  --hl-function: #3f62b4;
+  --hl-variable: #c84b50;
+  --hl-type: #956a19;
+  --hl-constant: #5857fc;
+  --hl-tag: #c84b50;
+  --hl-attr: #3f62b4;
+  --hl-regexp: #187a7c;
+  --hl-meta: #9a5a46;
+  --hl-builtin: #5857fc;
+  --hl-symbol: #9a5a46;
+  --hl-addition: #087b59;
+  --hl-deletion: #c84b50;
+}
+
 /* PWA standalone: home indicator safe area still applies on notched devices */
 
 ::selection {
@@ -170,6 +252,7 @@ html, body {
   color: var(--text);
   font-family: "Pretendard", "Twemoji", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
   font-size: 15px;
+  font-weight: var(--font-weight-body);
   line-height: 1.6;
   overflow: hidden;
   overscroll-behavior: none;
@@ -283,4 +366,3 @@ html, body {
   border-color: var(--warning);
   color: var(--warning);
 }
-

package/lib/public/css/filebrowser.css

@@ -960,13 +960,22 @@
     width: 50%;
     max-width: 720px;
     min-width: 360px;
-    border-left: 1px solid var(--border);
+    height: calc(100% - 16px);
+    align-self: center;
+    margin: 8px 8px 8px 10px;
+    border: 1px solid var(--border);
+    border-radius: 12px;
     background: var(--bg);
     display: flex;
     flex-direction: column;
     overflow: hidden;
     flex-shrink: 0;
-    transition: max-width 0.2s ease, width 0.2s ease;
+    box-shadow:
+      4px 8px 18px rgba(var(--shadow-rgb), 0.14),
+      2px 2px 4px rgba(var(--shadow-rgb), 0.08),
+      inset 0 1px 0 rgba(255, 255, 255, 0.04);
+    animation: workbench-panel-in 0.18s cubic-bezier(0.2, 0.8, 0.2, 1);
+    transition: max-width 0.2s ease, width 0.2s ease, box-shadow 0.2s ease;
   }
   #file-viewer.hidden { display: none; }
   #file-viewer.file-viewer-wide {
@@ -980,13 +989,21 @@
     height: 100dvh;
     max-width: none;
     min-width: 0;
+    margin: 0;
     z-index: 10000;
     border: 0;
+    border-radius: 0;
     background: var(--bg);
     box-shadow: none;
+    animation: none;
   }
 }
 
+@keyframes workbench-panel-in {
+  from { opacity: 0; transform: translateX(10px) scale(0.995); }
+  to { opacity: 1; transform: translateX(0) scale(1); }
+}
+
 /* Narrow screens: full overlay */
 @media (max-width: 1023px) {
   #file-viewer {
@@ -1034,22 +1051,29 @@
 .file-viewer-tab:hover .file-viewer-tab-close, .file-viewer-tab.active .file-viewer-tab-close { opacity: 1; }
 .file-viewer-tab-close:hover { background: var(--bg-hover); color: var(--text); }
 
+.file-viewer-window-actions {
+  display: flex;
+  align-items: center;
+  gap: 1px;
+  flex: 0 0 auto;
+  padding: 0 4px 0 2px;
+}
+
 .file-viewer-toolbar {
   display: flex;
   align-items: center;
   flex: 0 0 auto;
   gap: 1px;
-  padding: 0 6px;
-  background: var(--bg-deep);
-  border-left: 1px solid var(--border-subtle);
+  margin-left: auto;
+  padding: 0 0 0 8px;
 }
 
 .file-viewer-breadcrumbs {
   display: flex;
   align-items: center;
   gap: 10px;
-  min-height: 30px;
-  padding: 0 10px;
+  min-height: 34px;
+  padding: 0 6px 0 10px;
   border-bottom: 1px solid var(--border-subtle);
   background: var(--bg);
 }
@@ -1862,19 +1886,41 @@
     width: 50%;
     max-width: 720px;
     min-width: 360px;
+    height: calc(100% - 16px);
     min-height: 0;
-    border-left: 1px solid var(--border);
+    align-self: center;
+    margin: 8px 8px 8px 10px;
+    border: 1px solid var(--border);
+    border-radius: 12px;
     background: var(--bg);
     display: flex;
     flex-direction: column;
     overflow: hidden;
     flex-shrink: 0;
+    box-shadow:
+      4px 8px 18px rgba(var(--shadow-rgb), 0.14),
+      2px 2px 4px rgba(var(--shadow-rgb), 0.08),
+      inset 0 1px 0 rgba(255, 255, 255, 0.04);
+    animation: workbench-panel-in 0.18s cubic-bezier(0.2, 0.8, 0.2, 1);
   }
   #terminal-container.hidden { display: none; }
   #terminal-container.panel-fullscreen {
     width: 100%;
     max-width: none;
     min-width: 0;
+    height: 100%;
+    margin: 0;
+    border: 0;
+    border-radius: 0;
+    box-shadow: none;
+    animation: none;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  #file-viewer,
+  #terminal-container {
+    animation: none;
   }
 }
 

package/lib/public/css/icon-strip.css

@@ -36,29 +36,32 @@
   position: absolute;
   width: 38px;
   height: 38px;
+  box-sizing: border-box;
   border-radius: 12px;
   background: var(--bg-alt);
-  transition: background 0.2s ease;
+  box-shadow: 0 1px 2px rgba(var(--shadow-rgb), 0.08);
+  transition: background 0.2s ease, box-shadow 0.2s ease;
   z-index: -1;
 }
 
 .icon-strip-home:hover::before {
-  background: var(--accent);
+  background: var(--bg);
+  box-shadow: 0 2px 6px rgba(var(--shadow-rgb), 0.14);
 }
 
 .icon-strip-home .icon-strip-logo {
   width: 38px;
   height: 38px;
-  border-radius: 12px;
-  object-fit: cover;
+  object-fit: contain;
 }
 
 .icon-strip-home:hover .icon-strip-logo {
-  opacity: 0.8;
+  opacity: 1;
 }
 
 .icon-strip-home.active::before {
-  background: var(--accent);
+  background: var(--bg);
+  box-shadow: 0 1px 3px rgba(var(--shadow-rgb), 0.14);
 }
 
 /* First separator aligns with title bar border (48px line) */
@@ -185,26 +188,32 @@
   position: absolute;
   width: 38px;
   height: 38px;
+  box-sizing: border-box;
   border-radius: 12px;
-  background: var(--bg-alt);
-  transition: background 0.2s ease;
+  background: var(--bg);
+  box-shadow: 0 1px 2px rgba(var(--shadow-rgb), 0.1);
+  transition: background 0.2s ease, box-shadow 0.2s ease;
   z-index: -1;
 }
 
 .icon-strip-item:hover::before {
-  background: var(--accent);
+  background: var(--bg-alt);
+  box-shadow: 0 2px 6px rgba(var(--shadow-rgb), 0.14);
 }
 
 .icon-strip-item:hover {
-  color: #fff;
+  color: var(--text);
 }
 
 .icon-strip-item.active::before {
-  background: var(--accent);
+  background: var(--bg);
+  box-shadow:
+    0 0 0 1px color-mix(in srgb, var(--link) 62%, var(--border)),
+    0 1px 3px rgba(var(--shadow-rgb), 0.16);
 }
 
 .icon-strip-item.active {
-  color: #fff;
+  color: var(--text);
 }
 
 /* --- Socket status indicator on icon (top-left dot) --- */
@@ -486,6 +495,8 @@
 .icon-strip-item .project-emoji {
   width: 22px;
   height: 22px;
+  position: relative;
+  z-index: 1;
   pointer-events: none;
 }
 
@@ -1230,22 +1241,25 @@
   width: 30px;
   height: 30px;
   border-radius: 8px;
-  background: var(--bg-alt);
-  opacity: 0.7;
-  transition: opacity 0.15s, background 0.15s;
+  background: var(--bg);
+  box-shadow: 0 1px 2px rgba(var(--shadow-rgb), 0.1);
+  transition: background 0.15s, box-shadow 0.15s;
 }
 
 .icon-strip-wt-item:hover::before {
-  opacity: 1;
+  background: var(--bg-alt);
+  box-shadow: 0 2px 5px rgba(var(--shadow-rgb), 0.14);
 }
 
 .icon-strip-wt-item.active::before {
-  background: var(--accent);
-  opacity: 1;
+  background: var(--bg);
+  box-shadow:
+    0 0 0 1px color-mix(in srgb, var(--link) 58%, var(--border)),
+    0 1px 3px rgba(var(--shadow-rgb), 0.16);
 }
 
 .icon-strip-wt-item.active {
-  color: #fff;
+  color: var(--text);
 }
 
 .icon-strip-wt-item .wt-branch-abbrev {

package/lib/public/css/input.css

@@ -401,7 +401,7 @@
 
 .context-picker-section-label {
   font-size: 10px;
-  font-weight: 600;
+  font-weight: var(--font-weight-ui);
   color: var(--text-dimmer);
   text-transform: uppercase;
   letter-spacing: 0.5px;
@@ -535,7 +535,7 @@
 .email-setup-title {
   margin: 0 0 16px;
   font-size: 16px;
-  font-weight: 600;
+  font-weight: var(--font-weight-heading);
   color: var(--text);
 }
 .email-setup-field {
@@ -628,7 +628,7 @@
   border: none;
   background: var(--accent);
   color: #fff;
-  font-weight: 600;
+  font-weight: var(--font-weight-ui);
 }
 .email-setup-btn-primary:hover {
   background: var(--accent-hover);
@@ -718,11 +718,21 @@
   border: none;
   border-radius: 8px;
   padding: 7px;
-  transition: box-shadow 0.2s;
+  transition: box-shadow 0.18s ease, transform 0.18s ease, background 0.18s ease;
 }
 
 #input-row:focus-within {
-  box-shadow: 0 0 0 1px var(--border);
+  background: color-mix(in srgb, var(--input-bg) 96%, white);
+  box-shadow:
+    0 0 0 1px color-mix(in srgb, var(--accent) 22%, var(--border)),
+    0 8px 22px rgba(var(--shadow-rgb), 0.14),
+    0 2px 6px rgba(var(--shadow-rgb), 0.08);
+  transform: translateY(-1px);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  #input-row { transition: box-shadow 0.01ms; }
+  #input-row:focus-within { transform: none; }
 }
 
 #input-textarea-wrap {