/* Two-sidebar workspace: icon rail + client/dashboard tree */
.app-shell{--rail-w:68px;--tree-w:268px}
.app-shell{display:flex;min-height:100vh;background:var(--app)}
.app-rail{width:var(--rail-w);flex:0 0 var(--rail-w);position:fixed;inset:0 auto 0 0;z-index:40;display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 0 12px;background:var(--panel);border-right:1px solid var(--border)}
.app-rail .rail-brand{width:40px;height:40px;display:grid;place-items:center;border-radius:8px;background:var(--purple);color:#fff;font-weight:700;font-size:18px;text-decoration:none;margin-bottom:8px}
.app-rail .rail-brand:focus-visible{outline:2px solid #fff;outline-offset:2px}
.app-rail .rail-toggle,.app-rail .rail-link{width:44px;height:44px;border:0;border-radius:10px;background:transparent;color:var(--subtext);display:grid;place-items:center;cursor:pointer;text-decoration:none;position:relative;font:inherit}
.app-rail .rail-link .rail-icon,.app-rail .rail-toggle .rail-icon{font-size:18px;line-height:1}
.app-rail .rail-link:hover,.app-rail .rail-toggle:hover{background:rgba(255,255,255,.06);color:#fff}
.app-rail .rail-link.active{background:rgba(169,49,255,.18);color:#fff;box-shadow:inset 0 0 0 1px rgba(169,49,255,.55)}
.app-rail .rail-link:focus-visible,.app-rail .rail-toggle:focus-visible{outline:2px solid var(--purple);outline-offset:2px}
.app-rail .rail-spacer{flex:1}
.app-rail .rail-tip{position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%);background:#11161a;color:#fff;border:1px solid var(--border);border-radius:6px;padding:6px 10px;font-size:12px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s;z-index:50}
.app-rail .rail-link:hover .rail-tip,.app-rail .rail-link:focus-visible .rail-tip,.app-rail .rail-toggle:hover .rail-tip{opacity:1}
.app-shell:not(.nav-collapsed) .app-rail{width:196px;flex-basis:196px;align-items:stretch;padding:10px 10px 12px}
.app-shell:not(.nav-collapsed) .app-rail .rail-brand{width:auto;justify-content:flex-start;gap:10px;padding:0 8px;grid-auto-flow:column;background:transparent;color:#fff}
.app-shell:not(.nav-collapsed) .app-rail .rail-brand .brand-mark{width:36px;height:36px;display:grid;place-items:center;border-radius:8px;background:var(--purple)}
.app-shell:not(.nav-collapsed) .app-rail .rail-brand .brand-copy{display:flex;flex-direction:column;line-height:1.2}
.app-shell:not(.nav-collapsed) .app-rail .rail-brand .brand-copy strong{font-size:12px}
.app-shell:not(.nav-collapsed) .app-rail .rail-brand .brand-copy small{font-size:10px;color:var(--muted)}
.app-shell:not(.nav-collapsed) .app-rail .rail-link,.app-shell:not(.nav-collapsed) .app-rail .rail-toggle{width:auto;height:40px;grid-auto-flow:column;justify-content:start;gap:10px;padding:0 10px}
.app-shell:not(.nav-collapsed) .app-rail .rail-label{display:inline}
.app-shell.nav-collapsed .app-rail .rail-label,.app-shell.nav-collapsed .app-rail .brand-copy{display:none}
.app-shell:not(.nav-collapsed) .app-rail .rail-tip{display:none}

.client-tree{position:fixed;top:0;bottom:0;left:var(--rail-w);z-index:35;width:var(--tree-w);background:#1a2126;border-right:1px solid var(--border);display:flex;flex-direction:column;transition:transform .15s,width .15s}
.app-shell:not(.nav-collapsed) .client-tree{left:196px}
.app-shell.tree-collapsed .client-tree{transform:translateX(-105%);pointer-events:none}
.client-tree-head{display:flex;align-items:center;gap:8px;padding:12px 12px 8px;border-bottom:1px solid var(--border)}
.client-tree-head strong{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);flex:1}
.client-tree-tools{display:flex;gap:6px;padding:8px 12px;border-bottom:1px solid var(--border)}
.client-tree-tools input[type=search]{flex:1;min-width:0;height:34px;border:1px solid var(--border);border-radius:6px;background:var(--elevated);color:#fff;padding:0 10px;font:inherit;font-size:13px}
.client-tree-tools button{height:34px;min-width:34px;border:1px solid var(--border);border-radius:6px;background:var(--elevated);color:#fff;cursor:pointer}
.client-tree-tools button:hover{border-color:var(--border-hover)}
.client-tree-body{flex:1;overflow:auto;padding:8px 8px 16px;scrollbar-width:thin}
.tree-client{margin:4px 0}
.tree-client-btn{width:100%;display:flex;align-items:center;gap:8px;border:0;background:transparent;color:#fff;text-align:left;padding:8px 8px;border-radius:8px;cursor:pointer;font:inherit;font-size:13px;font-weight:600}
.tree-client-btn:hover,.tree-dash:hover{background:rgba(255,255,255,.05)}
.tree-client-btn:focus-visible,.tree-dash:focus-visible{outline:2px solid var(--purple);outline-offset:1px}
.tree-chevron{width:14px;color:var(--muted);font-size:10px}
.tree-dashes{padding:0 0 4px 14px;display:none}
.tree-client.open .tree-dashes{display:block}
.tree-dash{width:100%;display:flex;align-items:center;gap:8px;border:0;background:transparent;color:var(--subtext);text-align:left;padding:7px 8px;border-radius:8px;cursor:pointer;font:inherit;font-size:13px}
.tree-dash.active{background:rgba(169,49,255,.16);color:#fff;box-shadow:inset 0 0 0 1px rgba(169,49,255,.45)}
.tree-dash-actions{margin-left:auto;display:none;gap:2px}
.tree-dash:hover .tree-dash-actions,.tree-dash:focus-within .tree-dash-actions{display:flex}
.tree-dash-actions button{border:0;background:transparent;color:var(--muted);cursor:pointer;padding:2px 4px;border-radius:4px;font-size:12px}
.tree-dash-actions button:hover{color:#fff;background:rgba(255,255,255,.08)}
.tree-empty{padding:10px 12px;color:var(--muted);font-size:12px;line-height:1.4}
.tree-footer{padding:10px 12px;border-top:1px solid var(--border);display:flex;gap:8px}
.tree-footer button{flex:1}

.shell-content{flex:1;margin-left:calc(var(--rail-w) + var(--tree-w)) !important;width:auto !important;min-width:0;display:flex;flex-direction:column;min-height:100vh;transition:margin-left .15s}
.app-shell:not(.nav-collapsed) .shell-content{margin-left:calc(196px + var(--tree-w)) !important}
.app-shell.tree-collapsed .shell-content{margin-left:var(--rail-w) !important}
.app-shell:not(.nav-collapsed).tree-collapsed .shell-content{margin-left:196px !important}
.app-shell.nav-collapsed .shell-content{margin-left:calc(var(--rail-w) + var(--tree-w)) !important;width:auto !important}
.app-shell.nav-collapsed.tree-collapsed .shell-content{margin-left:var(--rail-w) !important}
.shell-header.workspace-header{display:flex;align-items:center;gap:16px;padding:10px 16px;border-bottom:1px solid var(--border);background:var(--panel);min-height:56px;position:sticky;top:0;z-index:20}
.workspace-header .ws-titles{min-width:0;flex:1}
.workspace-header .ws-titles strong{display:block;font-size:15px;line-height:1.2}
.workspace-header .ws-titles small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.workspace-modes{display:flex;flex-wrap:wrap;gap:6px}
.workspace-modes button{height:34px;border:1px solid var(--border);border-radius:999px;background:transparent;color:var(--subtext);padding:0 12px;font:inherit;font-size:12px;font-weight:500;cursor:pointer}
.workspace-modes button:hover{color:#fff;border-color:var(--border-hover)}
.workspace-modes button.active{background:rgba(169,49,255,.16);border-color:rgba(169,49,255,.55);color:#fff}
.workspace-header .dev{margin-left:auto;font-size:10px;letter-spacing:.06em;color:var(--muted);white-space:nowrap}
.shell-content > .workspace{flex:1;margin:0;padding:0;border:0;min-height:0;display:flex;flex-direction:column}
.shell-content > .workspace[hidden]{display:none !important}
#view-builder,#view-assistant,#view-preview,#view-sources,#view-settings{padding:0}
#view-sources .workspace-card,#view-settings .workspace-card{margin:16px;max-width:none}
#view-preview .preview-workspace{padding:16px}
.ai-dash-select{display:none !important}
.shell-footer{padding:8px 16px;border-top:1px solid var(--border);color:var(--muted);font-size:11px;display:flex;justify-content:space-between;gap:12px}

@media (max-width:1100px){
  .app-shell{--tree-w:240px}
  .workspace-header .dev{display:none}
}
@media (max-width:900px){
  .client-tree{transform:translateX(-105%);pointer-events:none}
  .app-shell.tree-open-mobile .client-tree{transform:none;pointer-events:auto;box-shadow:8px 0 24px rgba(0,0,0,.35)}
  .shell-content,.app-shell:not(.nav-collapsed) .shell-content,.app-shell.tree-collapsed .shell-content{margin-left:var(--rail-w)}
  .app-shell:not(.nav-collapsed) .shell-content{margin-left:196px}
}
@media (max-width:780px){
  .app-shell{--rail-w:56px}
  .workspace-modes{width:100%;order:3}
  .shell-header.workspace-header{flex-wrap:wrap}
}
.sources-page{display:flex;flex-direction:column;gap:12px}
.sources-page h1{margin:0;font-size:20px;font-weight:600}
.source-heading{margin:0;color:var(--subtext);font-size:13px;font-weight:500}
.source-list{border:1px solid var(--border);border-radius:8px;background:var(--panel)}
.source-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto auto 32px;align-items:center;gap:12px;min-height:56px;padding:8px 12px}
.source-row + .source-row{border-top:1px solid var(--border)}
.source-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:6px;background:var(--elevated);color:var(--subtext)}
.source-copy{min-width:0}
.source-copy h2{margin:0;font-size:14px;font-weight:600}
.source-copy p{margin:2px 0 0;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.source-badge{height:22px;display:inline-flex;align-items:center;padding:0 8px;border-radius:99px;background:var(--elevated);color:var(--subtext);font-size:11px;font-weight:600}
.source-badge.ready{color:var(--success)}
.source-badge.warn{color:var(--warning)}
.sources-page .source-action{min-height:32px;height:32px;padding:0 12px;font-size:13px}
.source-more{width:32px;height:32px;min-height:32px;padding:0;border:1px solid var(--border);border-radius:6px;background:transparent;color:#fff;font-size:18px;line-height:1;cursor:pointer}
.source-more:hover{background:var(--elevated)}
.source-menu-wrap{position:relative}
.source-menu{position:absolute;right:0;top:36px;z-index:30;min-width:196px;padding:4px;border:1px solid var(--border);border-radius:8px;background:#21282D;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.source-menu button{display:block;width:100%;height:32px;min-height:32px;padding:0 10px;border:0;border-radius:4px;background:transparent;color:#fff;font:inherit;font-size:13px;text-align:left;cursor:pointer}
.source-menu button:hover{background:var(--elevated)}
.source-detail{padding:10px 12px;border:1px solid var(--border);border-radius:8px;color:var(--subtext);font-size:13px;white-space:pre-wrap}
.source-note{margin:0;color:var(--muted);font-size:12px}
.source-dialog{width:min(440px,calc(100vw - 32px));padding:16px;border:1px solid var(--border);border-radius:8px;background:#21282D;color:#fff}
.source-dialog::backdrop{background:rgba(0,0,0,.55)}
.source-dialog h2{margin:0 0 8px;font-size:16px}
.source-dialog p{margin:0 0 12px;color:var(--muted);font-size:13px}
.source-dialog label{display:block;margin:10px 0 6px;font-size:12px}
.source-dialog input,.source-dialog select{width:100%;min-height:32px;margin:0}
.source-dialog-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.source-dialog-actions .secondary,.source-dialog-actions .source-action{min-height:32px;height:32px;padding:0 12px}
#sheetDialogUpload{width:100%;margin-bottom:4px}
.validation-box{margin-top:8px}
@media (max-width:900px){
  .source-row{grid-template-columns:32px minmax(0,1fr) auto 32px}
  .source-badge{display:none}
}
