:root{--sidebar-width:224px;--sidebar-expanded:224px}
.sidebar{width:var(--sidebar-width);padding:22px 14px 16px;transition:width .16s,transform .16s}
.main{margin-left:var(--sidebar-width);width:calc(100% - var(--sidebar-width));min-width:0}
.shell-controls{display:flex;justify-content:flex-end;gap:6px;margin:-7px 0 20px}
.shell-controls button{display:grid;place-items:center;width:28px;height:26px;color:#b3c6d1;background:#ffffff0a;border:1px solid #ffffff1e;border-radius:6px;cursor:pointer;font-size:17px}
.shell-controls button:hover{background:#ffffff22;color:#fff}
#nav button{min-height:44px;font-size:13px;white-space:nowrap}#nav button>span:first-child{font-size:19px;min-width:21px;text-align:center}
#nav button .nav-label{overflow:hidden;text-overflow:ellipsis;font-size:13px}
.shell-resizer{position:absolute;width:7px;right:-3px;top:0;bottom:0;cursor:col-resize;touch-action:none;z-index:50}
.shell-resizer:focus-visible,.shell-resizer:hover{background:#92b7a76b;outline:none}
.shell-resizing,.shell-resizing *{cursor:col-resize!important;user-select:none!important}.shell-resizing iframe{pointer-events:none}
body[data-sidebar="compact"] .sidebar{padding:20px 8px}body[data-sidebar="compact"] .brand{padding:0 5px 18px}
body[data-sidebar="compact"] .brand>div:not(.brand-mark),body[data-sidebar="compact"] .nav-label,body[data-sidebar="compact"] .sidebar-bottom,body[data-sidebar="compact"] #shell-hide,body[data-sidebar="compact"] .shell-resizer{display:none}
body[data-sidebar="compact"] #nav button{justify-content:center;padding:11px 5px}body[data-sidebar="compact"] .shell-controls{justify-content:center;margin:0 0 18px}
body[data-sidebar="hidden"] .sidebar{transform:translateX(-100%);width:var(--sidebar-expanded);pointer-events:none}
#shell-show{position:fixed;top:18px;left:14px;z-index:60;background:#173c2f;color:#fff;padding:8px 12px;border:1px solid #325c49;border-radius:8px;box-shadow:0 3px 12px #203c2f22;cursor:pointer;font-size:12px}
#shell-show[hidden]{display:none}body.auth-pending #shell-show{display:none}
body[data-sidebar="hidden"] .topbar>div:first-child{padding-left:75px}
.content-active .topbar{height:72px;padding:12px 24px;background:#fff;backdrop-filter:none;position:relative;gap:10px}
.content-active .topbar h1{font-size:18px}.content-active .topbar p{font-size:11px;margin-top:4px}
.content-active .top-actions .btn{font-size:11px;padding:7px 9px}.content-active #auth-actions span{font-size:12px}
.content-active #subnav{display:none}.content-active #page-content-studio{padding:0;height:calc(100dvh - 72px);overflow:hidden;background:#f6f8f5}
#studio-frame{width:100%;height:100%;border:0;display:block;background:#f6f8f5}
@media(max-width:900px){.content-active .top-actions>button{display:none}.content-active #auth-actions .btn{font-size:10px;padding:6px}.content-active .topbar{padding:10px 14px}.content-active .topbar p{max-width:200px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}}
@media(max-width:680px){.sidebar{width:var(--sidebar-width);inset:0 auto 0 0;position:fixed;display:flex}.main{margin-left:var(--sidebar-width);width:calc(100% - var(--sidebar-width))}.content-active .topbar{height:88px;align-content:center}.content-active #page-content-studio{height:calc(100dvh - 88px)}.content-active #auth-actions span{display:none}.content-active .topbar p{display:none}.content-active .top-actions{gap:3px}}
