/* Studio shell on the Creative Engine kit (engine.css): settings sidebar on the left, the asset workspace
   on the right, native-dialog adapters for the kit's login page. Shared by every Riverflow customer studio;
   each app's own app.css holds only its workflow layout. Load after riverflow-tokens.css and engine.css. */
.full { width:100%; }
button:disabled { cursor:not-allowed; }

/* shell: sidebar + workspace */
.studio-shell { display:grid; grid-template-columns:296px minmax(0,1fr); min-height:100dvh; }
.studio-sidebar { display:flex; flex-direction:column; height:100dvh; position:sticky; top:0; overflow-y:auto; background:var(--rf-grey-50); }
.editor-controls { display:flex; flex-direction:column; gap:28px; padding:24px; }
.control-section { display:flex; flex-direction:column; gap:12px; min-width:0; }
.control-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.control-heading .muted { font-size:12px; }
.control-help { font-size:12px; line-height:1.5; color:var(--rf-grey-500); }
.studio-tools { display:grid; gap:10px; font-size:13px; }
.studio-tools a { color:var(--rf-grey-600); text-decoration:none; }
.studio-tools a:hover { text-decoration:underline; }
.generate-actions { display:grid; gap:10px; }
.generate-actions .rf-button { min-height:44px; }
.rf-button.busy { opacity:1; pointer-events:none; background:var(--rf-grey-100); }
.sidebar-footer { margin-top:auto; display:flex; flex-direction:column; padding:8px 8px 16px; gap:4px; }
.engine-status { display:flex; align-items:center; gap:8px; padding:0 8px 8px; font-size:13px; color:var(--rf-grey-500); }
.engine-status::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--rf-grey-300); }
.engine-status.live::before { background:#3f8a55; }
.riverflow-link { text-align:left; }

.studio-main { height:100dvh; min-width:0; }
.studio-topbar { padding-inline:24px; border-bottom:1px solid var(--border); flex:none; }
.toolbar-actions { display:flex; gap:8px; }
.asset-content { padding:20px 24px 48px; }
.empty-library h2 { font-size:28px; }

/* native dialogs */
dialog { margin:auto; color:var(--foreground); background:white; max-width:none; max-height:none; }
dialog::backdrop { background:rgb(22 23 9 / 55%); backdrop-filter:blur(9px); -webkit-backdrop-filter:blur(9px); }
dialog:not([open]) { display:none!important; }
.access-dialog { width:100vw; height:100dvh; padding:0; border:0; }
.access-dialog::backdrop { background:var(--rf-grey-50); }
[data-slot="input"] { width:100%; padding:0 12px; }
.engine-toast[hidden] { display:none; }

@media(max-width:800px) {
  .studio-shell { display:block; }
  .studio-sidebar { position:static; height:auto; overflow:visible; }
  .side-brand { padding:12px 20px!important; display:flex; align-items:center; justify-content:space-between; }
  .side-sub { padding-top:0; }
  .editor-controls { padding:8px 20px 20px; gap:20px; }
  .sidebar-footer { flex-direction:row; flex-wrap:wrap; align-items:center; padding:0 12px 8px; }
  .sidebar-footer .riverflow-link { width:auto; font-size:13px; }
  .engine-status { padding:0 8px; margin-right:auto; }
  .studio-main { height:auto; min-height:50dvh; }
  .asset-workspace,.asset-content { height:auto; overflow:visible; }
  .studio-topbar { padding:12px 20px; min-height:64px; height:auto; }
  .asset-content { padding:16px 20px 40px; }
  .studio-topbar .surface-title { font-size:24px; }
}
@media(max-width:600px) { .studio-topbar { flex-wrap:wrap; gap:12px; }.toolbar-actions { margin-left:auto; } }