.studio-surface{--dashboard-sidebar-panel-width:288px;border:1.5px solid var(--border-strong);border-radius:var(--radius-md);background:var(--background);width:100%;min-width:0;min-height:min(920px,100vh - 72px);color:var(--foreground);flex-direction:column;display:flex;overflow:clip visible}.studio-surface__instrument{flex:none}.studio-surface__identity{gap:3px;min-width:0;display:grid}.studio-surface__kicker,.studio-surface__connected-label,.studio-surface__connected-meta{font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;font-size:9px;font-weight:700}.studio-surface__kicker{color:color-mix(in srgb, currentColor 58%, transparent)}.studio-surface__title{color:inherit;font-family:var(--font-display);text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;margin:0;font-size:24px;line-height:1;overflow:hidden}.studio-surface__instrument-spacer{flex:auto}.studio-surface__status,.studio-surface__actions{flex:none;align-items:center;gap:8px;display:inline-flex}.studio-surface__workspace{flex:auto;min-height:auto;display:grid}.studio-surface__rail{background:var(--paper);min-width:0;padding:15px;overflow:visible}.studio-surface__rail.is-left{border-right:1.5px solid var(--border-strong)}.studio-surface__rail.is-right{border-left:1.5px solid var(--border-strong)}.studio-surface__stage{min-width:0;padding:16px;overflow:visible}.studio-surface--pane{height:100%;min-height:0;overflow:hidden}.studio-surface--pane .studio-surface__workspace{min-height:0}.studio-surface--pane .studio-surface__stage{flex-direction:column;min-height:0;display:flex;overflow:hidden}.studio-surface--pane .studio-surface__rail{overscroll-behavior-y:contain;scrollbar-color:var(--border-strong) transparent;scrollbar-width:thin;min-height:0;overflow-y:auto}.studio-surface__connected{z-index:40;bottom:0;right:0;left:var(--dashboard-sidebar-panel-width,288px);box-sizing:border-box;min-height:calc(46px + env(safe-area-inset-bottom));padding-bottom:calc(7px + env(safe-area-inset-bottom));flex:none;position:fixed}.studio-surface:has(.studio-surface__connected){padding-bottom:calc(46px + env(safe-area-inset-bottom))}.dashboard-shell.app .dashboard-view-frame--studio-canvas:has(>.studio-surface__connected){padding-bottom:calc(46px + env(safe-area-inset-bottom))!important}.studio-surface__connected-label{color:color-mix(in srgb, var(--connected-ink,#f0edef) 50%, transparent);flex:none;align-items:center;gap:7px;display:inline-flex}.studio-surface__connected-dot{border-radius:var(--radius-pill);background:var(--brand-green);width:7px;height:7px}.studio-surface__connected-meta{color:color-mix(in srgb, var(--connected-ink,#f0edef) 45%, transparent);letter-spacing:.04em}@media (max-width:820px){.studio-surface{min-height:0;overflow:visible}.studio-surface--pane{height:100%;min-height:0;overflow:hidden}.studio-surface--pane .studio-surface__workspace{overscroll-behavior-y:contain;overflow-y:auto}.studio-surface--pane .studio-surface__stage{flex:none;height:100%}.studio-surface--pane .studio-surface__rail{flex:none;overflow:visible}.studio-surface__instrument{flex-wrap:wrap}.studio-surface__status{order:4}.studio-surface__actions{width:100%;padding-top:2px;overflow-x:auto}.studio-surface__rail,.studio-surface__stage{overflow:visible}.studio-surface__rail.is-left,.studio-surface__rail.is-right{border:0;border-bottom:1.5px solid var(--border-strong)}}@media (max-width:768px){.studio-surface__connected{display:none}.studio-surface:has(.studio-surface__connected){padding-bottom:0}}@media (prefers-reduced-motion:reduce){.studio-surface *,.studio-surface :before,.studio-surface :after{scroll-behavior:auto;transition-duration:.01ms}}