Phase 6: design polish — accept confetti + distraction-free mode

- Accept confetti: CSS-only 4-dot burst spawned at the accepted card,
  trajectory via inline --dx/--dy, auto-cleared after 720ms.
- Distraction-free mode: editor focus collapses the doc-list sidebar
  (width→0 slide), canvas re-centers full-width; Escape or a click
  outside the canvas (header/gutter/status bar) restores it.

Claude-Session: https://claude.ai/code/session_016Yr6jELuRc7hyzYLccQKZd

web/src/index.css

@@ -136,6 +136,45 @@ button, a, input {
   animation: petal-suggestion-in 200ms ease both;
 }
 
+/* --- Accept confetti --------------------------------------------------------
+   A tiny CSS-only burst played where a suggestion is accepted: four colored
+   dots spray up-and-out, then fade. No JS animation — each dot reads its
+   direction from --dx/--dy custom properties set inline. (Spec → Signature.) */
+.petal-confetti {
+  width: 0;
+  height: 0;
+}
+.petal-confetti-dot {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 7px;
+  height: 7px;
+  border-radius: var(--radius-pill);
+  animation: petal-confetti 680ms cubic-bezier(0.2, 0.7, 0.3, 1) forwards;
+}
+@keyframes petal-confetti {
+  0%   { transform: translate(0, 0) scale(0.3); opacity: 0; }
+  18%  { opacity: 1; }
+  100% { transform: translate(var(--dx), var(--dy)) scale(1); opacity: 0; }
+}
+
+/* --- Distraction-free mode ---------------------------------------------------
+   The doc-list sidebar slides left and collapses to zero width; the editor
+   canvas (centered, max-width) re-centers into the full pane. Width + transform
+   animate together for a smooth slide. (Spec → Distraction-free mode.) */
+.petal-sidebar {
+  width: 260px;
+  overflow: hidden;
+  transition: width 280ms ease, transform 280ms ease, opacity 200ms ease;
+}
+.petal-sidebar-hidden {
+  width: 0;
+  transform: translateX(-24px);
+  opacity: 0;
+  pointer-events: none;
+}
+
 /* Blinking caret in the Ask Petal bubble while awaiting the first token. */
 .petal-chat-caret {
   animation: petal-breathe 1s ease-in-out infinite;