body .studio .canvas-mobile-selection,
body .studio .canvas-mobile-delete-receipt { display: none; }
.canvas-mobile-menu:not([open]) { display: none; }
@media (max-width: 760px), (hover: none) and (pointer: coarse) {
  /* The single Add menu owns these actions on touch devices. */
  body .studio .left-toolbar, body .studio .right-toolbar,
  body .studio .canvas-mobile-toolbar-toggle.is-right { display: none !important; }
  body .studio .canvas-mobile-menu {
    box-sizing: border-box; position: fixed; inset: auto 0 0; margin: auto auto 0;
    width: min(100%, 520px); max-width: 100%; max-height: min(80dvh, 640px);
    overflow-y: auto; overscroll-behavior: contain; touch-action: pan-y;
    padding: 16px 16px max(16px, env(safe-area-inset-bottom));
    border: 1px solid #dce4df; border-radius: 22px 22px 0 0; background: #f8fbf9; color: #243c30;
    box-shadow: 0 -12px 45px #18352722; font: 14px/1.5 system-ui, sans-serif;
  }
  body .studio .canvas-mobile-menu::backdrop { background: #12261e66; }
  .canvas-mobile-menu header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .canvas-mobile-menu h2 { font-size: 17px; margin: 0; }
  .canvas-mobile-menu h3 { font-size: 12px; margin: 16px 0 8px; opacity: .7; }
  .canvas-mobile-menu-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  body .studio .canvas-mobile-menu button { min-height: 48px; padding: 8px; border: 1px solid #dae5df; border-radius: 12px; background: #fff; color: inherit; font: inherit; touch-action: manipulation; }
  .canvas-mobile-menu header button { min-width: 56px; }
  body .studio .canvas-mobile-confirm { inset: 0; margin: auto; width: calc(100% - 32px); max-width: 380px; border-radius: 18px; }
  .canvas-mobile-confirm footer { display: flex; justify-content: flex-end; gap: 8px; }
  body .studio .canvas-mobile-menu button.danger { color: #aa302b; background: #fcebe9; }
  .canvas-mobile-menu-hint { margin: 16px 0 0; font-size: 12px; opacity: .7; }
  body .studio .canvas-mobile-selection, body .studio .canvas-mobile-delete-receipt {
    display: flex; align-items: center; justify-content: space-between; gap: 4px;
    position: absolute; z-index: 110; bottom: calc(max(10px, env(safe-area-inset-bottom)) + 62px);
    left: 8px; right: 8px; width: auto; max-width: 480px; margin: auto; box-sizing: border-box;
    padding: 6px 8px; border: 1px solid #d9e6dd; border-radius: 16px; background: #fcfefdf5;
    color: #284a38; box-shadow: 0 5px 24px #183b2426; font: 13px/1.4 system-ui, sans-serif;
  }
  body .studio .canvas-mobile-delete-receipt { z-index: 112; }
  .canvas-mobile-selection-title { white-space: nowrap; padding: 0 4px; font-size: 12px; }
  body .studio .canvas-mobile-selection button, body .studio .canvas-mobile-delete-receipt button {
    min-height: 44px; min-width: 44px; padding: 0 8px; border: 0; border-radius: 10px;
    background: #eaf3ee; color: inherit; font: 600 13px/1.3 system-ui, sans-serif; touch-action: manipulation;
  }
  body .studio .canvas-mobile-selection button.danger { color: #aa302b; background: #fcebe9; }
  .canvas-mobile-delete-receipt button:disabled { opacity: .5; }
  body .studio.dark .canvas-mobile-menu, body .studio.dark .canvas-mobile-selection,
  body .studio.dark .canvas-mobile-delete-receipt { background: #242d29; color: #eef5f0; border-color: #42554a; }
  body .studio.dark .canvas-mobile-menu button, body .studio.dark .canvas-mobile-selection button,
  body .studio.dark .canvas-mobile-delete-receipt button { background: #34473c; border-color: #476151; color: #eef5f0; }
  body .studio.dark .canvas-mobile-selection button.danger { background: #57302e; color: #ffcbc6; }
  body .studio :is(.canvas-mobile-menu,.canvas-mobile-selection,.canvas-mobile-delete-receipt) button:focus-visible { outline: 2px solid #2e9470; outline-offset: 2px; }
}
