/* Application shell measured from the authenticated Replit reference. */
.workspace-body .workspace { --ink:var(--repl-text); --muted:var(--repl-muted); --line:var(--repl-border); --blue:var(--repl-blue); --blue-soft:#e6f2ff; --paper:var(--repl-bg); --white:var(--repl-panel); --chat-width:450px; background:var(--repl-bg); color:var(--repl-text); font-family:var(--repl-font); }
:is(.workspace-body,.dashboard-body) .client-navigation { width:240px; height:100dvh; flex:none; display:flex; flex-direction:column; align-items:stretch; position:relative; gap:0; padding:0 6px 8px; background:var(--repl-sidebar); border:0; border-right:1px solid #d7d5ce; overflow:hidden auto; color:var(--repl-text); z-index:12; }
:is(.workspace-body,.dashboard-body) .client-nav-brand { display:flex; align-items:center; justify-content:space-between; height:48px; min-height:48px; padding:0 6px; }
:is(.workspace-body,.dashboard-body) .client-nav-brand .brand { display:flex; gap:7px; align-items:center; color:var(--repl-text); font-size:17px; letter-spacing:-.4px; }
:is(.workspace-body,.dashboard-body) .client-nav-brand .brand-mark { width:24px; height:24px; font-size:22px; margin:0; }
:is(.workspace-body,.dashboard-body) .client-navigation nav { display:flex; flex-direction:column; gap:2px; width:100%; padding:0; }
:is(.workspace-body,.dashboard-body) .client-navigation :is(nav>a,nav>button,.client-nav-bottom>a) { display:flex; align-items:center; text-align:left; gap:8px; width:100%; min-width:0; min-height:32px; padding:6px 10px; color:var(--repl-secondary); font:400 14px/20px var(--repl-font); border:0; border-radius:6px; background:transparent; white-space:nowrap; }
:is(.workspace-body,.dashboard-body) .client-navigation nav>a>span { overflow:hidden; text-overflow:ellipsis; }
:is(.workspace-body,.dashboard-body) .client-navigation :is(nav>a,nav>button,.client-nav-bottom>a):hover { background:var(--repl-hover); color:var(--repl-text); }
:is(.workspace-body,.dashboard-body) .client-navigation nav [aria-current] { background:var(--repl-control); color:var(--repl-text); font-weight:400; }
:is(.workspace-body,.dashboard-body) .client-navigation nav .client-new { background:var(--repl-selected); margin-bottom:6px; }
:is(.workspace-body,.dashboard-body) .client-navigation :is(nav svg,.client-nav-bottom svg) { width:16px; height:16px; flex:none; }
:is(.workspace-body,.dashboard-body) .client-nav-section { color:var(--repl-muted); font-size:12px; padding:20px 10px 8px; }
:is(.workspace-body,.dashboard-body) .client-nav-empty { color:var(--repl-muted); font-size:12px; line-height:1.5; padding:6px 10px; }
:is(.workspace-body,.dashboard-body) .client-nav-bottom { margin-top:auto; padding-top:24px; }
:is(.workspace-body,.dashboard-body) .client-account { width:100%; display:flex; align-items:center; gap:9px; padding:10px 8px 2px; text-align:left; border-top:1px solid var(--repl-border); margin-top:10px; color:var(--repl-text); }
:is(.workspace-body,.dashboard-body) .client-account>span:nth-child(2) { flex:1; min-width:0; }
:is(.workspace-body,.dashboard-body) .client-account strong { display:block; font-size:13px; font-weight:400; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
:is(.workspace-body,.dashboard-body) .client-account small { color:var(--repl-muted); font-size:11px; }
:is(.workspace-body,.dashboard-body) .client-account .user-dot { width:28px; height:28px; font-size:12px; flex:none; }
:is(.workspace-body,.dashboard-body) .client-navigation .icon-button { width:32px; height:32px; color:var(--repl-muted); }
:is(.workspace-body,.dashboard-body) .client-navigation .icon-button:hover { background:var(--repl-hover); }
:is(.workspace-body,.dashboard-body)[data-nav-open=false] .client-navigation { display:none; }
.client-nav-backdrop[hidden] { display:none; }
.client-nav-backdrop { position:fixed; inset:0; background:rgb(24 25 27 / 25%); z-index:11; border:0; border-radius:0; }
.dashboard-body .studio-shell { display:flex; margin:0; max-width:none; min-height:100dvh; }
.dashboard-body .client-navigation { position:sticky; top:0; }
.dashboard-body .client-library-main { flex:1; min-width:0; }
.dashboard-body .client-library-header { height:48px; display:flex; align-items:center; gap:10px; padding:0 16px; color:var(--repl-secondary); font-size:14px; }
.dashboard-body .client-library-header>[data-account] { margin-left:auto; display:flex; align-items:center; gap:6px; font-size:13px; min-height:32px; }
.workspace-body .work-main { min-width:0; flex:1; overflow:hidden; }
.workspace-body .work-header { height:48px; min-height:48px; padding:0 6px; border:0; background:var(--repl-bg); display:grid; grid-template-columns:32px minmax(90px,calc(var(--chat-width) - 48px)) minmax(0,1fr) auto; gap:6px; }
.workspace-body .work-header .mobile-back { display:none!important; }
.workspace-body .work-header .project-heading { min-width:0; }
.workspace-body .project-heading h1 { max-width:100%; font:400 14px/18px var(--repl-font); letter-spacing:0; margin:0; }
.workspace-body .revision-status { font-size:10px; color:var(--repl-muted); line-height:14px; }
.workspace-body .revision-status i { background:#8e9298; box-shadow:none; }
.workspace-body .work-header .header-actions { display:flex; align-items:center; gap:4px; margin:0; }
.workspace-body .work-header .primary { background:var(--repl-blue); color:#f7fbff; min-height:32px; height:32px; padding:0 8px; font-size:13.333px; font-weight:400; border-radius:6px; }
.workspace-body .work-header .primary:hover { background:var(--repl-blue-hover); }
.workspace-body .work-header :is(.icon-button,.subtle) { height:32px; min-height:32px; color:var(--repl-secondary); border-radius:6px; font-size:13px; }
.workspace-body .work-header .icon-button { width:32px; flex:none; }
.workspace-body .work-header :is(.icon-button,.subtle):hover { background:var(--repl-hover); color:var(--repl-text); }
.workspace-body .work-header .stage-tabs { overflow-x:auto; scrollbar-width:none; white-space:nowrap; height:38px; min-height:38px; justify-content:flex-start; gap:2px; border:0; padding:0; align-self:end; }
.workspace-body .work-header .stage-tabs button { padding:0 8px; flex:none; font-size:13px; height:34px; min-height:34px; border-radius:6px 6px 0 0; }
.workspace-body .work-header .stage-tabs button.active { background:var(--repl-sidebar); }
.workspace-body .work-grid { grid-template-columns:var(--chat-width) 2px minmax(0,1fr); min-height:0; }
.workspace-body .split-handle { background:var(--repl-border); }
.workspace-body .split-handle:before { background:#aaa9a5; left:0; }
.workspace-body .split-handle:after { background:transparent; }
.workspace-body .split-handle:is(:hover,:focus-visible) { background:var(--repl-blue); }
.workspace-body .project-stage-layout { padding:0 6px 6px 0; gap:6px; }
.workspace-body .mobile-work-tabs { background:var(--repl-bg); border-color:var(--repl-border); }
.workspace-body .mobile-work-tabs button { color:var(--repl-muted); }
.workspace-body .mobile-work-tabs button.active { background:var(--repl-selected); color:var(--repl-text); }
@media(max-width:1250px) { .workspace-body .workspace { --chat-width:340px; } .workspace-body .history-label { display:none; } }
@media(max-width:900px) {
 :is(.workspace-body,.dashboard-body) .client-navigation { position:fixed; inset:0 auto 0 0; width:240px; box-shadow:8px 0 30px rgb(24 25 27 / 12%); }
 :is(.workspace-body,.dashboard-body) .client-navigation :is(nav>a,nav>button,.client-nav-bottom>a) { min-height:38px; }
 .workspace-body .work-header { grid-template-columns:32px minmax(90px,1fr) minmax(0,1.5fr) auto; }
 .workspace-body .history-toggle { display:none; }
 .workspace-body .work-header .stage-tabs button { font-size:12px; padding-inline:6px; }
 .workspace-body .work-header .stage-tabs svg { width:14px; height:14px; }
}
@media(max-width:640px) {
 .workspace-body .work-header { height:48px; min-height:48px; display:flex; gap:6px; padding:0 6px; }
 .workspace-body .work-header .project-heading { flex:1; min-width:0; }
 .workspace-body .project-heading h1 { font-size:12px; }
 .workspace-body .work-header .stage-tabs { display:none; }
 .workspace-body .work-header .header-actions { gap:1px; }
 .workspace-body .work-header .primary { min-height:36px; height:36px; padding:0 8px; font-size:12px; }
 .workspace-body .work-header .primary svg { display:none; }
 .workspace-body .work-header .icon-button { width:36px; height:36px; min-height:36px; }
 .workspace-body .work-grid { display:block; padding-bottom:51px; }
 .workspace-body .project-stage-layout { padding:0 4px; gap:0; }
 .workspace-body .split-handle { display:none; }
 .workspace-body .mobile-work-tabs { height:51px; }
 .dashboard-body .client-library-header { padding-inline:12px; }
 :is(.workspace-body,.dashboard-body) .client-navigation .icon-button { min-height:36px; min-width:36px; }
}
.workspace-body .workspace:not([data-stage=preview]) .stage-toolbar { display:none; }
.workspace-body .chat-input-shell textarea:focus-visible { outline:0; }