/* Compact screens retain every editing control; desktop styles live in styles.css. */
@media (max-width: 760px) {
  html { -webkit-text-size-adjust: 100%; }
  body { overscroll-behavior-y: none; }
  button, input, textarea, select { font-size: 16px; touch-action: manipulation; }
  .app-shell { height: auto; min-height: 100vh; min-height: 100dvh; }
  .topbar { height: auto; min-height: 70px; flex: 0 0 auto; flex-wrap: wrap; padding: calc(12px + env(safe-area-inset-top)) calc(14px + env(safe-area-inset-right)) 12px calc(14px + env(safe-area-inset-left)); gap: 10px; }
  .top-actions { width: 100%; margin: 0; justify-content: space-between; gap: 6px; }
  .top-actions .button-subtle { display: inline-block; }
  .top-actions .button { padding: 0 8px; font-size: 11px; }
  .brand-copy strong { font-size: 12px; }
  .layout { display: flex; flex-direction: column; overflow: visible; }
  .sidebar, .inspector { display: flex; position: static; width: auto; box-shadow: none; min-height: 0; }
  .sidebar-scroll, .inspector-body { overflow: visible; }
  .sidebar-scroll { padding: 20px 16px; }
  .sidebar-bottom { padding: 14px 16px; }
  .add-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .add-tile { min-height: 72px; padding: 8px 6px; }
  .add-tile small { display: none; }
  .workspace { padding-right: 0; min-width: 0; min-height: 0; }
  .workspace-top { min-height: 86px; padding: 18px 16px 11px; }
  .stage-toolbar { margin: 0 16px; }
  .stage-space { padding: 16px; overflow: visible; }
  .stage-frame { width: 100%; }
  .paper-wrap { padding: 6px; }
  .workspace-footer { min-height: 54px; height: auto; flex: 0 0 auto; padding: 8px 16px; }
  .inspector-heading { padding: 22px 16px 16px; }
  .inspector-body { padding: 18px 16px; }
  .inspector-bottom { padding: 16px; }
  .modal-backdrop { align-items: flex-start; overflow-y: auto; padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }
  .modal-card, .preview-card { max-height: none; }
}