.preview-placeholder{display:grid;place-content:center;text-align:center;color:#19334d;background:radial-gradient(circle at 50% 10%,#d9ecff,#f8fbff 58%);padding:24px}.preview-placeholder b{width:52px;height:52px;margin:auto;display:grid;place-items:center;border-radius:15px;background:#1679e8;color:white;font-size:20px;box-shadow:0 12px 34px #1679e844}.preview-placeholder h3{margin:15px 0 6px}.preview-placeholder p{margin:0;color:#607489;font-size:11px}
.workspace-shell{background:#fff!important;border-color:#dfe5ee!important}.project-pane,.chat-pane,.preview-pane{background:#fff!important;color:#172033!important}.chat-pane{background:#f8fafc!important}.chat-toolbar,.preview-toolbar,.change-strip{border-color:#e4e7ec!important}.file-tree{color:#64748b!important}.file-tree strong{color:#172033!important}.message p{background:#fff!important;color:#334155!important;border-color:#dfe5ee!important}.message.user p{background:#eef4ff!important}.composer{background:white!important;border-color:#cbd5e1!important}.composer textarea{color:#172033!important}.icon-button,.device{background:#fff!important;color:#526178!important;border-color:#dfe5ee!important}.device.active{color:#1d5bb7!important;border-color:#7ca7ee!important;background:#eef5ff!important}.browser-frame.mobile-device{width:min(390px,calc(100% - 28px));justify-self:center;box-shadow:0 10px 35px #1d2c491a}.pane-resizer{background:#eef1f5!important;border-color:#dfe5ee!important}.project-connection{border-color:#e4e7ec!important}
@media(max-width:900px){.workspace-shell{display:grid!important;grid-template-columns:1fr!important;height:calc(100vh - 150px)!important;min-height:640px!important}.chat-pane{height:52vh!important;min-height:390px}.preview-pane{height:48vh!important;min-height:390px}.browser-frame{min-height:300px}.page-heading:has(+ .content .workspace-shell){display:none}.content:has(.workspace-shell){padding-top:10px}}
.in-workspace{overflow:hidden}.in-workspace .page-heading{display:none}.in-workspace .content{max-width:none;padding:0}.in-workspace .topbar{position:relative}.workspace-shell{--chat-width:560px;height:calc(100vh - 66px)!important;min-height:0!important;display:grid!important;grid-template-columns:var(--chat-width) 7px minmax(420px,1fr)!important;border:0!important;border-radius:0!important}.chat-pane{height:auto!important;border:0!important}.chat-stream{padding:24px 28px!important}.composer{margin:14px 18px 18px!important;box-shadow:0 8px 30px #1d2c4914}.preview-pane{height:auto!important}.preview-toolbar{height:58px!important;background:#f8fafc}.preview-modes{display:flex;gap:6px}.preview-modes a.device{text-decoration:none}.browser-frame{margin:10px 12px!important}.change-strip{background:white}.mobile-workspace-tabs{display:none}
.chat-release-actions{display:flex;gap:10px;align-items:center;margin:24px 0 6px 42px;flex-wrap:wrap}.publishing-panel{height:calc(100% - 58px);overflow:auto;padding:34px clamp(22px,5vw,68px) 42px;background:#fff;color:#172033}.publishing-panel>p{max-width:720px;color:#64748b}.publishing-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;border-bottom:1px solid #e4e7ec;padding-bottom:20px;margin-bottom:20px}.publishing-head h2{margin:4px 0 0;font-size:clamp(24px,3vw,36px)}.publishing-head .icon{width:38px;height:38px;border:1px solid #dfe5ee;border-radius:10px;background:#fff;color:#526178;font-size:25px;cursor:pointer}.share-link{display:inline-flex;margin:0 0 12px;color:#1769d2;font-weight:750;text-decoration:none}.publishing-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:24px 0}.publishing-actions button{display:flex;justify-content:space-between;padding:17px;text-align:left}.publish-summary{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px 20px;margin:20px 0 30px;padding:20px;border:1px solid #e4e7ec;border-radius:14px;background:#f8fafc}.publish-summary span:not(.tag){color:#64748b}.publish-history{border:1px solid #e4e7ec;border-radius:14px;overflow:hidden}.publish-history>div{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;border-bottom:1px solid #e4e7ec}.publish-history>div:last-child{border-bottom:0}.publish-history span:first-child{display:grid;gap:4px}.publish-history small,.muted{color:#7a8798}.publishing-footer{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}.shutdown-link{display:block;margin:32px auto 0;border:0;background:transparent;color:#b42318;text-decoration:underline;cursor:pointer}.workspace-fullscreen .publishing-panel{height:calc(100% - 58px)}
@media(max-width:900px){.in-workspace{overflow:auto}.in-workspace .content{padding:0!important}.workspace-shell{height:calc(100vh - 106px)!important;min-height:0!important;display:block!important}.workspace-shell .pane-resizer{display:none!important}.mobile-workspace-tabs{height:48px;display:flex;align-items:center;justify-content:center;gap:4px;border-bottom:1px solid #e4e7ec;background:white}.mobile-workspace-tabs button{border:0;border-radius:999px;background:transparent;padding:8px 22px;color:#64748b;font-weight:750}.mobile-workspace-tabs button.active{background:#eaf2ff;color:#174f9f}.workspace-shell .chat-pane,.workspace-shell .preview-pane{height:100%!important;min-height:0!important}.workspace-shell.show-chat .preview-pane,.workspace-shell.show-preview .chat-pane{display:none!important}.chat-stream{padding:18px!important}.chat-release-actions{margin-left:0}.preview-toolbar{padding:8px 10px!important}.preview-modes .workspace-action{display:none}.browser-frame{min-height:0!important;height:calc(100% - 136px)}.change-strip{min-height:70px}.publishing-panel{height:calc(100% - 58px);padding:22px 16px 34px}.publishing-actions{grid-template-columns:1fr}.publishing-footer{display:grid}.publishing-footer button{width:100%}}
.browser-bar{display:flex;align-items:center}.browser-bar span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.refresh-preview{margin-left:auto;border:0;background:transparent;color:#64748b;font-size:18px;cursor:pointer}.project-preview{display:block;width:100%;height:100%;border:0;background:white}.preview-placeholder .primary{display:inline-flex;margin:18px auto 0;text-decoration:none}.code-panel{height:calc(100% - 58px);overflow:auto;background:#fff;padding:30px;color:#172033}.code-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;border-bottom:1px solid #e4e7ec;padding-bottom:20px}.code-head h2{font-size:32px;margin:4px 0}.code-head p{margin:0;color:#64748b}.source-layout{display:grid;grid-template-columns:220px 1fr;min-height:420px;border:1px solid #e4e7ec;border-radius:14px;overflow:hidden;margin-top:22px}.source-layout aside{display:flex;flex-direction:column;gap:5px;padding:17px;background:#f8fafc;border-right:1px solid #e4e7ec}.source-layout aside>strong{padding:5px 8px 12px}.source-file{border:0;background:transparent;text-align:left;padding:10px;border-radius:8px;color:#536177;cursor:pointer}.source-file.active,.source-file:hover{background:#eaf2ff;color:#174f9f}.source-overview{padding:24px;display:grid;align-content:start;gap:0}.source-overview>div{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid #edf0f4}.source-overview span{color:#64748b}.source-overview .primary{justify-self:start;margin-top:22px}.source-overview p{max-width:670px;line-height:1.6;margin-top:20px}@media(max-width:900px){.preview-modes{overflow-x:auto}.publishing-panel,.code-panel{height:calc(100% - 58px);padding:22px 16px 34px}.source-layout{grid-template-columns:1fr}.source-layout aside{border-right:0;border-bottom:1px solid #e4e7ec}.source-overview>div{grid-template-columns:1fr;gap:5px}}
html[data-theme="dark"] .workspace-shell,html[data-theme="dark"] .chat-pane,html[data-theme="dark"] .preview-pane,html[data-theme="dark"] .preview-toolbar,html[data-theme="dark"] .chat-toolbar,html[data-theme="dark"] .composer,html[data-theme="dark"] .change-strip,html[data-theme="dark"] .publishing-panel,html[data-theme="dark"] .code-panel{background:#111823!important;color:#e8edf5!important;border-color:#303a49!important}html[data-theme="dark"] .message p,html[data-theme="dark"] .source-layout aside,html[data-theme="dark"] .publish-summary{background:#18212e!important;color:#dce4ef!important;border-color:#303a49!important}html[data-theme="dark"] .source-layout,html[data-theme="dark"] .publish-history,html[data-theme="dark"] .source-overview>div,html[data-theme="dark"] .publishing-head,html[data-theme="dark"] .code-head{border-color:#303a49!important}@media(prefers-color-scheme:dark){html[data-theme="system"] .workspace-shell,html[data-theme="system"] .chat-pane,html[data-theme="system"] .preview-pane,html[data-theme="system"] .preview-toolbar,html[data-theme="system"] .chat-toolbar,html[data-theme="system"] .composer,html[data-theme="system"] .change-strip,html[data-theme="system"] .publishing-panel,html[data-theme="system"] .code-panel{background:#111823!important;color:#e8edf5!important;border-color:#303a49!important}}

/* Workspace viewport containment: long agent output scrolls without hiding the composer or preview footer. */
body.in-workspace{height:100dvh;overflow:hidden}.in-workspace .shell{height:100dvh;min-height:0;display:grid;grid-template-rows:66px minmax(0,1fr);overflow:hidden}.in-workspace main{height:auto;min-height:0;overflow:hidden}.in-workspace .content{height:100%;min-height:0;overflow:hidden}.in-workspace .workspace-shell{height:100%!important}.chat-pane,.preview-pane{min-height:0!important;overflow:hidden}.chat-pane{grid-template-rows:auto minmax(0,1fr) auto!important}.chat-stream{min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;scrollbar-gutter:stable}.message{min-width:0}.message-body{min-width:0;max-width:100%;margin:0;padding:11px 13px;border:1px solid #dfe5ee;border-radius:4px 13px 13px 13px;background:#fff;color:#334155;font-size:12px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}.message.user .message-body{background:#eef4ff}.composer{min-height:0;max-height:min(38dvh,260px);display:flex;flex-direction:column;flex-shrink:0}.composer textarea{min-height:52px;max-height:124px;overflow-y:auto}.composer-actions{flex:none}.composer textarea:disabled{opacity:.7}.composer button:disabled{cursor:wait;opacity:.75}.preview-pane{grid-template-rows:auto minmax(0,1fr) auto!important}.browser-frame{height:auto!important;min-height:0!important}.agent-progress{display:flex;align-items:center;gap:11px;margin:0 0 18px 36px;padding:11px 13px;border:1px solid #cddcf1;border-radius:12px;background:#f3f7fd;color:#334155}.agent-progress strong,.agent-progress small{display:block}.agent-progress small{margin-top:3px;color:#64748b;font-size:10px}.thinking-dots{display:flex;gap:4px}.thinking-dots i{width:6px;height:6px;border-radius:50%;background:#2774d8;animation:thinking-pulse 1.1s infinite ease-in-out}.thinking-dots i:nth-child(2){animation-delay:.16s}.thinking-dots i:nth-child(3){animation-delay:.32s}@keyframes thinking-pulse{0%,70%,100%{opacity:.28;transform:translateY(0)}35%{opacity:1;transform:translateY(-3px)}}html[data-theme="dark"] .message-body{background:#18212e;color:#dce4ef;border-color:#303a49}html[data-theme="dark"] .message.user .message-body{background:#202b3b}html[data-theme="dark"] .agent-progress{background:#18212e;color:#dce4ef;border-color:#303a49}
@media(max-width:900px){body.in-workspace{overflow:hidden!important}.in-workspace .shell{grid-template-rows:66px minmax(0,1fr)}.in-workspace main,.in-workspace .content{height:100%!important}.in-workspace .content{display:grid!important;grid-template-rows:48px minmax(0,1fr)!important}.mobile-workspace-tabs{height:48px!important}.workspace-shell{height:100%!important;display:grid!important;grid-template-columns:1fr!important;grid-template-rows:minmax(0,1fr)!important;overflow:hidden!important}.workspace-shell .chat-pane,.workspace-shell .preview-pane{height:auto!important;min-height:0!important}.chat-stream{padding:16px!important}.composer{margin:8px 10px max(10px,env(safe-area-inset-bottom))!important;max-height:min(42dvh,250px)}.preview-toolbar{height:auto!important;min-height:58px}.change-strip{min-height:70px;max-height:96px;overflow:auto}.agent-progress{margin-left:36px;margin-right:0}}@media(max-width:600px){.in-workspace .shell{grid-template-rows:58px minmax(0,1fr)}.composer-actions{gap:8px}.composer-actions>div{min-width:0;gap:5px}.composer-mode{padding:6px 8px}}
.composer-mode{border:1px solid #d7deea;border-radius:8px;background:#fff;color:#526178;padding:6px 9px;font-size:10px;font-weight:800;cursor:pointer}.composer-mode.active{border-color:#78a8ee;background:#eaf2ff;color:#174f9f}.attachment-tray{display:flex;gap:6px;overflow-x:auto;padding:8px 10px 0}.attachment-tray>span{display:inline-flex;align-items:center;gap:5px;max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:1px solid #dbe4ef;border-radius:999px;background:#f5f8fc;color:#475569;padding:5px 8px;font-size:10px}.remove-attachment{border:0;background:transparent;color:#64748b;cursor:pointer;padding:0 2px;font-size:14px}html[data-theme="dark"] .composer-mode,html[data-theme="dark"] .attachment-tray>span{background:#18212e;color:#dce4ef;border-color:#303a49}html[data-theme="dark"] .composer-mode.active{background:#173354;border-color:#4d82c7}
.project-card-shell{position:relative;min-width:0}.project-card-shell>.project-card{width:100%}.project-card-tools{position:absolute;top:12px;right:12px;z-index:2;display:flex;gap:6px}.project-card-tools button{border:1px solid #d9e1ec;border-radius:8px;background:#fffffff2;color:#46566e;padding:6px 8px;font-size:10px;font-weight:750;cursor:pointer;box-shadow:0 5px 18px #17203316}.project-card-tools button:hover{border-color:#8aa9d2;color:#174f9f}.project-card-tools .delete-project:hover{border-color:#e1a29d;color:#a6342a;background:#fff7f6}html[data-theme="dark"] .project-card-tools button{background:#18212ef2;color:#dce4ef;border-color:#39485d}@media(max-width:600px){.project-card-tools{top:9px;right:9px}.project-card-tools button{padding:6px;font-size:9px}}
.message{align-items:start}.message .message-body{width:fit-content;max-width:min(92%,760px)}.message.user{grid-template-columns:minmax(0,1fr) 28px}.message.user>span{grid-column:2;grid-row:1}.message.user .message-body{grid-column:1;grid-row:1;justify-self:end;border-radius:13px 4px 13px 13px;text-align:left}.message.assistant .message-body{justify-self:start}
.message p{white-space:pre-wrap}
.home-starter{max-width:900px;margin:0 auto 34px;padding:30px;border:1px solid #dbe3ef;border-radius:20px;background:linear-gradient(135deg,#fff,#f3f7ff);box-shadow:0 18px 60px #21467112}.home-starter h2{margin:5px 0 8px;font-size:clamp(24px,4vw,38px)}.home-starter>p:not(.eyebrow){margin:0;color:var(--muted);max-width:720px}.home-prompt{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end;margin-top:22px;padding:10px;border:1px solid #cbd7e8;border-radius:16px;background:#fff}.home-prompt textarea{width:100%;min-height:74px;resize:vertical;border:0;outline:0;padding:9px 10px;background:transparent;color:inherit;font:inherit}.home-prompt .primary{min-height:44px}.project-list-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin:0 0 16px}.project-list-head h2,.project-list-head p{margin:0}.project-list-head p{margin-top:5px;color:var(--muted)}html[data-theme="dark"] .home-starter,html[data-theme="dark"] .home-prompt{background:#171e2a;color:#e8edf5;border-color:#303a49}@media(max-width:600px){.home-starter{padding:20px 16px;margin-bottom:26px}.home-prompt{grid-template-columns:1fr}.home-prompt .primary{width:100%}.project-list-head{align-items:start}.project-list-head .ghost{white-space:nowrap}}

/* Workspace owns the second row inside main. The previous rule put the only
   shell child (main) in a fixed 66px row, leaving the workspace present in the
   accessibility tree but visually clipped below the header. */
body.in-workspace .shell{display:block}
body.in-workspace main{height:100dvh!important;display:grid!important;grid-template-rows:66px minmax(0,1fr)!important}
body.in-workspace .content{width:100%!important;margin:0!important}
body.in-workspace .workspace-shell{width:100%!important;grid-template-columns:var(--chat-width) 12px minmax(320px,1fr)!important}
body.in-workspace .pane-resizer{width:12px!important;background:#e2e8f0!important;border-color:#cbd5e1!important}
body.in-workspace .pane-resizer:after{inset:0 4px!important;background:#3b82f6!important;opacity:.55!important;border-radius:999px}
body.in-workspace .pane-resizer:hover:after,body.in-workspace .pane-resizer:focus-visible:after,body.in-workspace .workspace-shell.is-resizing .pane-resizer:after{opacity:1!important;background:#0b67d1!important}
@media(max-width:600px){body.in-workspace main{grid-template-rows:58px minmax(0,1fr)!important}}
.message-body p{margin:0 0 10px}.message-body p:last-child{margin-bottom:0}.message-body h3,.message-body h4,.message-body h5{margin:16px 0 8px;color:inherit}.message-body ol,.message-body ul{margin:8px 0 12px;padding-left:22px}.message-body li{margin:6px 0}.message-body code{padding:2px 5px;border-radius:5px;background:#eef2f7;font-size:.92em}.agent-choices{display:grid;gap:8px;margin:16px 0 2px;padding:12px;border:1px solid #d7e0eb;border-radius:12px}.agent-choices legend{padding:0 6px;color:#64748b;font-size:11px;font-weight:800}.agent-choice{display:grid;grid-template-columns:28px minmax(0,1fr);gap:3px 9px;width:100%;padding:11px;border:1px solid #d7e0eb;border-radius:10px;background:#fff;color:#26364b;text-align:left;cursor:pointer}.agent-choice>span{grid-row:1/3;width:25px;height:25px;border:2px solid #9aabc0;border-radius:50%;display:grid;place-items:center;font-size:10px;font-weight:850}.agent-choice strong{align-self:center}.agent-choice small{color:#64748b}.agent-choice:hover,.agent-choice.selected{border-color:#3478d4;background:#edf5ff}.agent-choice.selected>span{border-color:#1769d2;background:#1769d2;color:#fff}html[data-theme="dark"] .agent-choice{background:#18212e;color:#e8edf5;border-color:#3a4657}html[data-theme="dark"] .agent-choice:hover,html[data-theme="dark"] .agent-choice.selected{background:#20324a;border-color:#5a9bea}html[data-theme="dark"] .message-body code{background:#263244}

/* Advanced preview messages: project-scoped, bounded, and secret-free. */
.preview-pane:has(.preview-message-dock){grid-template-rows:auto minmax(0,1fr) auto auto!important}.preview-message-dock{border-top:1px solid #dfe5ee;background:#f8fafc;color:#334155}.preview-message-dock>button{width:100%;height:36px;display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:0 14px;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;font-size:11px;font-weight:800}.preview-message-dock>button small{justify-self:start;color:#64748b;font-weight:600}.preview-message-dock>button b{font-size:14px}.preview-message-list{max-height:190px;overflow:auto;border-top:1px solid #dfe5ee;background:#101722;color:#d7e0ed;font:11px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace}.preview-message{display:grid;grid-template-columns:70px minmax(140px,.65fr) minmax(180px,1fr);gap:12px;padding:8px 14px;border-bottom:1px solid #263141}.preview-message time{color:#7f8da0}.preview-message span{font-weight:700}.preview-message small{color:#aeb9c8;overflow-wrap:anywhere}.preview-message.success span{color:#67d69a}.preview-message.failed span{color:#ff8b8b}.preview-message.info span{color:#8ec5ff}.preview-message-empty{padding:18px;color:#93a2b7;text-align:center}html[data-theme="dark"] .preview-message-dock{background:#111823;color:#e8edf5;border-color:#303a49}html[data-theme="dark"] .preview-message-dock>button small{color:#9aa8ba}@media(max-width:600px){.preview-message-list{max-height:150px}.preview-message{grid-template-columns:58px 1fr;gap:4px 8px}.preview-message small{grid-column:2}.preview-message-dock.open~.change-strip{max-height:76px}.preview-message-dock.open+.change-strip small{display:none}}

.preview-message:has(.ask-agent-fix){grid-template-columns:70px minmax(140px,.65fr) minmax(180px,1fr) auto;align-items:center}.ask-agent-fix{border:1px solid #53677f;border-radius:7px;background:#1a2636;color:#dce8f6;padding:6px 9px;white-space:nowrap;cursor:pointer;font:700 10px/1.2 system-ui,sans-serif}.ask-agent-fix:hover{border-color:#78adf0;background:#22354e}@media(max-width:600px){.preview-message:has(.ask-agent-fix){grid-template-columns:58px minmax(0,1fr) auto}.preview-message:has(.ask-agent-fix) small{grid-column:2/4}.ask-agent-fix{grid-column:3;grid-row:1}}