/* The independent Layout Controls panel is shared by phone and desktop. */
 .mobile-layout-heading,.mobile-control-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;background:var(--panel);border-bottom:1px solid var(--line);font-size:13px}
 .mobile-layout-heading{flex-wrap:wrap;order:0!important}
 .mobile-layout-heading label,.mobile-control-size{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);margin:0}
 .mobile-layout-heading input{width:110px;min-height:32px}
 .mobile-layout-heading output,.mobile-control-size output{min-width:40px;font-variant-numeric:tabular-nums}
 .mobile-stage-control-panel{order:3;grid-column:1/-1;min-width:0;border:1px solid var(--line);border-radius:8px;background:var(--panel);overflow:hidden;color:var(--ink)}
 .custom-workspace-mode .mobile-stage-control-panel{order:0}
 .mobile-stage-control-panel[hidden]{display:none!important}
 .mobile-control-heading{touch-action:none}
 .mobile-control-heading button{min-height:40px;font-size:12px}
 .mobile-control-size{padding:8px 12px;border-bottom:1px solid var(--line)}
 .mobile-control-size input{flex:1;min-width:0;min-height:32px}
 .mobile-control-body{height:var(--mobile-controls-height,420px);overflow:auto;overscroll-behavior:contain;display:flex;flex-direction:column;min-height:0}
 .mobile-control-body>*{flex-shrink:0;order:initial!important}
 .mobile-control-body .mobile-under-layout{order:-4!important}
 .mobile-control-body .playback-bar{order:-3!important}
 .mobile-control-body .compact-timeline{order:-2!important}
 .mobile-control-body .layout-tools{order:-1!important}
 .mobile-control-body .view-bottom.layout-tools{position:static!important;inset:auto!important;display:block;background:var(--panel);padding:10px 12px;border-top:1px solid var(--line);letter-spacing:0}
 .mobile-control-body .view-actions{width:100%;display:flex;flex-wrap:wrap}
 .mobile-control-body .zoom-controls{display:flex;flex-wrap:wrap;width:100%;gap:6px}
 .mobile-control-body .zoom-controls>*{min-width:0;font-size:12px;min-height:44px}
 .mobile-control-body .layout-spacing{display:flex;gap:8px;align-items:center;flex-wrap:wrap;width:100%;padding:8px 0}
 .mobile-control-body .selection-tools{display:flex!important;flex-wrap:wrap}
 .mobile-control-body .stage-tools{border-top:1px solid var(--line)}
 /* Layout Controls: one row for the layout buttons, a second row for export, sessions, autosave and recordings. */
 .mobile-control-body .layout-files{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;width:100%;align-items:stretch}
 .mobile-control-body .layout-files button{min-width:0;white-space:normal;padding:8px 4px;font-size:12px;line-height:1.2;min-height:44px}
 .mobile-control-body .layout-files #export-vista{grid-column:1}
 .mobile-control-body .layout-files #export-grandma{grid-column:2}
 .mobile-stage-control-panel.is-floating{position:fixed;left:8px;top:80px;width:calc(100vw - 16px);max-width:600px;max-height:calc(100dvh - 100px);display:flex;flex-direction:column;box-shadow:0 10px 40px #0008}
 .mobile-stage-control-panel.is-floating .mobile-control-body{flex:1}
 .mobile-stage-control-panel.is-floating .mobile-control-heading{cursor:grab}
 .mobile-stage-control-panel.controls-minimized{height:auto!important;min-height:0!important}
 .mobile-stage-control-panel.controls-minimized>:not(.layout-mini-transport){display:none!important}
 .layout-mini-transport{display:none;grid-template-columns:minmax(58px,1fr) 40px minmax(64px,100px) 40px 40px;align-items:center;gap:6px;padding:6px 10px;min-height:56px;touch-action:none}
 .controls-minimized>.layout-mini-transport{display:grid}
 .layout-mini-transport>span{font-size:12px;font-weight:700;overflow:hidden;text-overflow:ellipsis}
 .layout-mini-transport button{min-width:0;width:100%;min-height:40px;padding:4px;font-size:14px}
 .layout-mini-transport [data-play-proxy=play]{background:var(--accent);color:#fff;border-color:var(--accent)}
 [data-theme=dark] .layout-mini-transport [data-play-proxy=play]{color:#161616}
 .mobile-control-heading>strong{flex:1}
 .mobile-control-heading [data-controls-min]{min-width:40px}
 .layout-selection-actions{display:inline-flex;gap:6px;align-items:center;flex-shrink:0}
 body.workspace-focus-mode>.mobile-stage-control-panel.is-floating{display:flex!important;z-index:900!important}
@media(min-width:701px){
 .workspace-card .workspace-grip{text-align:left;justify-content:flex-start}
 .controls-minimized .layout-mini-transport>span{text-align:left}
 .mobile-control-heading>strong,.mobile-layout-heading>strong{text-align:left}
 .mobile-control-size{display:none}
 .workspace-editing .mobile-control-size{display:flex}
 .workspace-editing .mobile-control-size input{flex:0 1 100px;min-height:36px}
 .mobile-stage-control-panel{height:var(--mobile-controls-height,340px);display:flex;flex-direction:column}
 .mobile-stage-control-panel>.mobile-control-heading,.mobile-stage-control-panel>.mobile-control-size{flex-shrink:0}
 .mobile-stage-control-panel>.mobile-control-body{height:auto;flex:1}
 .mobile-layout-heading{flex:none}
 .custom-workspace-mode .mobile-layout-heading{display:none}
 body:not(.custom-workspace-mode) .mobile-layout-view #viewport{height:var(--mobile-view-height,440px);min-height:260px}
 .mobile-control-body .playback-bar{display:flex;flex-wrap:wrap}
 .mobile-control-body .playback-bar .transport{display:flex;flex-wrap:wrap;width:100%}
 .mobile-control-body .compact-timeline{display:flex;min-height:44px}
 .mobile-control-body .mobile-under-layout{display:none!important}
 .mobile-control-body .view-actions{display:grid;grid-template-columns:minmax(0,1fr) auto}
 .mobile-stage-control-panel{margin-bottom:12px}
 .custom-workspace-mode .mobile-stage-control-panel{margin-bottom:0}
 .mobile-stage-control-panel.is-floating{left:auto;right:24px;width:min(600px,calc(100vw - 48px))}
}
@media(max-width:700px){
 .layout-selection-actions{display:contents}
 html{scroll-padding-top:8px!important;scroll-padding-bottom:90px!important}
 .mobile-layout-view #viewport,#workspace-focus .mobile-layout-view #viewport{height:var(--mobile-view-height,420px)!important;min-height:260px!important;flex:none!important}
 body.custom-workspace-mode #custom-workspace .mobile-layout-card{height:auto!important;min-height:0!important}
 body.custom-workspace-mode #custom-workspace .mobile-layout-card .workspace-card-content{height:auto!important;overflow:visible}
 body.custom-workspace-mode #custom-workspace .mobile-layout-card .stage-live{height:auto!important}
 .mobile-control-body .zoom-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
 #layout-quick-undo{display:flex!important;align-items:center;justify-content:center;grid-column:span 2}
 .mobile-control-body .zoom-controls .rotate-tools{display:contents}
 .mobile-control-body .zoom-controls #layout-rotate-readout{grid-column:span 2}
 /* Give every collapsed title its own centered row. Variable-width summaries
    remain available underneath instead of shifting the title sideways. */
 .workspace-card.workspace-minimized .workspace-card-head{display:grid!important;grid-template-columns:44px minmax(0,1fr) 44px;gap:0 4px;padding:0 6px;min-height:48px}
 .workspace-card.workspace-minimized .workspace-grip{grid-row:1;grid-column:2;text-align:center;justify-content:center;min-height:48px;padding:6px 0;font-size:13px;font-weight:700;line-height:1.25;width:100%}
 .workspace-card.workspace-minimized .workspace-minimize{grid-row:1;grid-column:3;min-height:44px;width:44px}
 .workspace-card.workspace-minimized .minimized-summary{grid-row:2;grid-column:1/-1;justify-content:center!important;align-items:center;flex-wrap:wrap;max-width:none;padding:0 4px 6px}
 .workspace-card.workspace-minimized .minimized-summary:empty{display:none}
 .workspace-card.workspace-minimized .workspace-card-actions{grid-row:3;grid-column:1/-1;justify-content:center}
 body:not(.custom-workspace-mode) .simulator>.mobile-layout-view{order:0!important}
 body:not(.custom-workspace-mode) .simulator>.mobile-stage-control-panel:not(.mobile-ma-panel){order:1!important}
}
