/* PMP Create Pro v179 — compact command access
 * The desktop header intentionally reduces chrome below 1050 px. Keep every
 * production route available in the scrollable command rail at those widths.
 */

@media (min-width: 621px) and (max-width: 1050px) {
  .tool-rail {
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scrollbar-color: rgba(22, 125, 120, .58) rgba(255, 255, 255, .34);
    scrollbar-width: thin;
    scroll-snap-type: x proximity;
  }

  .tool-rail .mobile-command {
    display: flex;
    flex: 0 0 auto;
    scroll-snap-align: start;
  }

  .tool-rail #mobileSaveButton { order: -8; }
  .tool-rail #mobileProjectsButton { order: -7; }
  .tool-rail #mobileResizeButton { order: -6; }
  .tool-rail #mobileUndoButton { order: -5; }
  .tool-rail #mobileRedoButton {
    order: -4;
    margin-right: 8px;
    border-right-color: rgba(201, 111, 70, .55);
  }

  .tool-rail #mobileSaveButton {
    border-color: rgba(201, 111, 70, .55);
    background: #fff0e7;
    color: #74391f;
  }

  .tool-rail #mobileProjectsButton,
  .tool-rail #mobileResizeButton {
    border-color: rgba(22, 125, 120, .42);
    background: #edf7f5;
    color: #155e59;
  }

  .tool-rail #mobileProofButton,
  .tool-rail #mobileOutputButton,
  .tool-rail #mobileSendButton {
    order: 20;
    border-color: rgba(101, 80, 173, .42);
    background: #f0ecf8;
    color: #44327c;
  }

  .tool-rail #mobileSendButton {
    margin-right: 8px;
    background: linear-gradient(145deg, #e8f5f2, #eee9f8);
    color: #244c62;
  }

  .tool-rail::after {
    content: "";
    flex: 0 0 2px;
    order: 30;
  }
}

@media (prefers-contrast: more) and (min-width: 621px) and (max-width: 1050px) {
  .tool-rail .mobile-command { border-width: 2px; }
}