/* Moderate scene-workspace density: reclaim chrome, not text or touch targets.
   Keep mobile's tested composer/keyboard layout intact. */
@media (min-width: 901px) {
  #sceneLayout.composer .pivot-strip { padding: 8px 20px; gap: 7px; }
  #sceneLayout.composer .pivot-thumb,
  #sceneLayout.composer .pivot-add { width: 52px; height: 52px; }
  #sceneLayout.composer #timelineSection { padding: 6px 20px 4px; }
  #sceneLayout.composer #timelineSection.collapsed { padding-bottom: 4px; }
  #sceneLayout.composer .canvas-area { padding: 10px 18px; scrollbar-gutter: stable both-edges; }
  #sceneLayout.composer .feed-wrap { gap: 10px; padding-left: var(--cmp-left-balance, 0px); }
  #sceneLayout.composer .scene-feed { gap: 18px; }
  /* Version navigation is a small pill, not a second frame. Keep it below the
     initial scrollport instead of exposing a sliver above the composer. */
  #sceneLayout.composer .scene-feed:has(> .scene-card img.fit) > .branch-chip {
    width: max-content; min-width: 0; max-width: 100%; margin: 0;
  }
  #sceneLayout.composer .cmp { width: clamp(640px, 68%, 1120px); margin: 4px auto; }
  #sceneLayout.composer .cmp > .cmp-foot { margin-top: 6px; }
  #sceneLayout.composer .cmp-attach { margin-bottom: 4px; }
  #sceneLayout.composer .cmp-chips { margin-top: 4px; }
  #sceneLayout.composer .cmp.basic .cmp-step { padding-block: 8px; }
  #sceneLayout.composer .cmp.basic .cmp-step-h { margin-bottom: 6px; }
  #sceneLayout.composer .cmp.basic .cmp-step-b { row-gap: 3px; }
}
/* Wide cards do not need the extra blank heading line reserved for wrapping.
   Keep the two-line description slots so Change/Choose stay aligned. */
@media (min-width: 1400px) {
  #sceneLayout.composer .cmp.basic .cmp-step-h { min-height: 18px; }
}
@media (hover: hover) and (min-width: 1200px) {
  #sceneLayout.composer .scene-card-actions { left: calc(100% + 10px); gap: 5px; }
}
/* Lighter shadows keep the newly recovered space visually open in light mode. */
[data-theme="light"] #sceneLayout.composer .scene-card > img {
  box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
}
[data-theme="light"] #sceneLayout.composer .scene-card.live > img {
  box-shadow: 0 0 0 2px var(--accent), 0 8px 24px rgba(0, 0, 0, .16);
}
[data-theme="light"] #sceneLayout.composer .cmp {
  box-shadow: 0 6px 20px rgba(0, 0, 0, .15);
}
