:root[data-demo=true]{--demo-notice-height:76px;--demo-controls-height:54px;--demo-height:calc(var(--demo-notice-height) + var(--demo-controls-height));--demo-sidebar:272px}:root[data-demo-compact=true]{--demo-controls-height:36px}[data-demo=true] .app-shell{height:calc(100dvh - var(--demo-height));margin-top:var(--demo-height);position:relative}.demo-public-notice{height:var(--demo-notice-height);z-index:51;background:var(--sidebar);border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:20px;padding:12px 22px;display:flex;position:fixed;inset:0 0 auto}.demo-public-notice strong{font-size:14px;font-weight:600}.demo-public-notice p{color:var(--muted);margin:3px 0 0;font-size:12px}.demo-newsletter-link{background:var(--ink);min-height:40px;color:var(--bg);white-space:nowrap;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:8px 13px;font-size:13px;font-weight:500;text-decoration:none;display:inline-flex}.demo-newsletter-link:hover{background:var(--strong-hover)}.demo-toolbar{inset:var(--demo-notice-height) 0 auto;z-index:50;height:var(--demo-controls-height);background:var(--bg);border-bottom:1px solid var(--line);align-items:center;gap:18px;padding:0 20px;font-size:12px;display:flex;position:fixed}.demo-toolbar button,.demo-toolbar select{border-radius:6px;height:32px;min-height:32px;padding:4px 9px;font-size:12px}.demo-toolbar select{width:auto;max-width:240px}.demo-label{white-space:nowrap;align-items:center;gap:7px;font-weight:600;display:inline-flex}.demo-label>span:first-child{background:#b17622;border-radius:50%;width:7px;height:7px}.demo-fiction{color:var(--muted);font-weight:400}.demo-playback,.demo-utilities{align-items:center;gap:6px;display:flex}.demo-utilities{margin-left:auto}.demo-collapse{background:0 0;border:0}.compact .demo-collapse{margin-left:auto}.demo-notice{background:var(--sidebar);position:absolute;top:calc(100% + 8px);right:12px;height:auto!important}.demo-panel{inset:76px 0 0 var(--demo-sidebar);overscroll-behavior:contain;scrollbar-gutter:stable;background:var(--bg);z-index:5;position:absolute;overflow-y:auto}.demo-panel .dialog-head{max-width:990px;margin:auto;padding:23px 36px 20px}.demo-panel .dialog-head h2{letter-spacing:-.7px;font-size:25px}.demo-panel .dialog-content{max-width:990px;margin:auto;padding:26px 36px 80px}.demo-panel:not(.wide) .dialog-head,.demo-panel:not(.wide) .dialog-content{max-width:820px}.demo-panel .content-day{padding:20px 0}.demo-panel .goal-section{padding:26px 0}.demo-panel .goal-section:first-of-type{padding-top:8px}.demo-panel .agent-list button{padding:18px 10px}.demo-panel .agent-list .avatar{width:44px;height:44px}.demo-panel .agent-list strong{font-size:17px}.demo-panel .agent-list small{margin-top:3px;font-size:13px}[data-demo=true] .message-scroll{scroll-behavior:auto}[data-demo=true] .sidebar{transition:none}[data-demo=true] .prose{line-height:1.8}@media (width>=1600px){:root[data-demo=true]{--demo-sidebar:294px}}@media (width<=1000px){:root[data-demo=true]{--demo-sidebar:244px}.demo-toolbar{gap:10px;padding:0 12px}}@media (width<=760px){:root[data-demo=true]{--demo-notice-height:136px;--demo-controls-height:88px;--demo-sidebar:0px}:root[data-demo-compact=true]{--demo-controls-height:36px}.demo-public-notice{flex-direction:column;justify-content:center;align-items:flex-start;gap:8px;padding:10px 14px}.demo-public-notice strong{font-size:13px}.demo-public-notice p{line-height:1.45}.demo-public-notice .demo-newsletter-link{min-height:34px;padding:6px 11px;font-size:12px}.demo-toolbar{grid-template-columns:1fr auto auto;gap:4px 8px;padding:6px 10px;display:grid}.demo-toolbar>select{grid-area:2/1;width:100%;max-width:100%}.demo-label{grid-area:1/1;gap:4px;font-size:11px}.demo-playback{grid-area:2/2}.demo-playback button span{display:none}.demo-playback select{max-width:75px}.demo-utilities{grid-area:1/2;justify-self:end;margin:0}.demo-utilities button:first-child span{display:none}.demo-collapse{grid-area:1/3}.demo-toolbar.compact{padding-block:0;display:flex}.demo-panel{top:67px}.demo-panel .dialog-head{padding:18px 20px 15px}.demo-panel .dialog-content{padding:20px 20px 65px}.demo-panel .dialog-head h2{font-size:23px}[data-demo=true] .sidebar,[data-demo=true] .sidebar-shade{top:var(--demo-height)}.demo-panel .agent-list small{font-size:12px}}
