:root{--bg:#0b0d10;--panel:#101318;--panel-2:#14181f;--panel-3:#1a2028;--border:#252c36;--border-strong:#343d49;--text:#edf1f5;--muted:#8f9aa8;--faint:#65707f;--accent:#6ee7b7;--accent-strong:#34d399;--accent-bg:#34d3991f;--danger:#fb7185;--danger-bg:#fb71851a;--blue:#7dd3fc;--yellow:#fcd34d}*{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;color:var(--text);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,textarea,select{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline-offset:2px;outline:2px solid #6ee7b7a6}.workspace{background:radial-gradient(circle at 85% 0%, #34d3990f, transparent 28%), var(--bg);min-height:100vh}.topbar{border-bottom:1px solid var(--border);z-index:20;background:#0b0d10f5;grid-template-columns:260px minmax(0,1fr) auto;align-items:center;height:62px;padding:0 14px 0 16px;display:grid;position:sticky;top:0}.brand{align-items:center;gap:10px;display:flex}.brand-mark{width:34px;height:34px;color:var(--accent);background:linear-gradient(145deg,#1f2937,#0f1720);border:1px solid #36404c;border-radius:10px;place-items:center;display:grid}.brand>div:last-child{flex-direction:column;line-height:1.1;display:flex}.brand strong{letter-spacing:.01em;font-size:15px}.brand span{color:var(--muted);text-transform:uppercase;letter-spacing:.12em;margin-top:4px;font-size:10px}.repo-strip{color:#b8c1cc;border:1px solid var(--border);background:#101318;border-radius:999px;justify-self:center;align-items:center;gap:8px;min-width:0;padding:7px 11px;font-size:12px;display:flex}.repo-strip span:first-of-type{text-overflow:ellipsis;white-space:nowrap;max-width:280px;overflow:hidden}.top-actions{align-items:center;gap:8px;min-width:0;display:flex}.status-dot{background:var(--accent-strong);border-radius:50%;width:7px;height:7px;box-shadow:0 0 10px #34d3998c}.status-dot.danger{background:var(--danger);box-shadow:0 0 10px #fb718573}.status-copy{text-overflow:ellipsis;white-space:nowrap;max-width:240px;color:var(--muted);font-size:11px;overflow:hidden}.icon-button{border:1px solid var(--border);background:var(--panel-2);cursor:pointer;border-radius:9px;place-items:center;width:34px;height:34px;display:grid}.icon-button:hover{border-color:var(--border-strong);background:var(--panel-3)}.icon-button.small{border-radius:8px;width:29px;height:29px}button:disabled{cursor:not-allowed;opacity:.45}.error-banner{background:var(--danger-bg);color:#fecdd3;border-bottom:1px solid #fb718540;justify-content:center;align-items:center;gap:10px;min-height:38px;padding:7px 16px;font-size:12px;display:flex}.error-banner button{cursor:pointer;background:0 0;border:0;place-items:center;display:grid}.ide-grid{grid-template-columns:246px minmax(430px,1fr) 390px;min-height:calc(100vh - 62px);display:grid}.sidebar,.review-panel,.editor-panel{min-width:0}.sidebar{background:var(--panel);border-right:1px solid var(--border);flex-direction:column;min-height:calc(100vh - 62px);display:flex}.panel-heading{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:8px;min-height:55px;padding:11px 12px;display:flex}.panel-heading>div:first-child{flex-direction:column;gap:3px;min-width:0;display:flex}.panel-heading strong{font-size:13px}.eyebrow{color:var(--faint);letter-spacing:.16em;font-size:9px;font-weight:700}.repo-quick{border-bottom:1px solid var(--border);gap:7px;padding:10px;display:grid}.repo-quick input,.search-box input,.preview-url-row input,.settings-modal input,.settings-modal select{border:1px solid var(--border);width:100%;color:var(--text);background:#0c0f13;border-radius:8px;min-width:0;padding:9px 10px;font-size:12px}.repo-quick-row{grid-template-columns:minmax(0,1fr) auto;gap:7px;display:grid}.repo-quick-row button{background:var(--accent-bg);color:#b7f7dc;cursor:pointer;border:1px solid #2c5b4c;border-radius:8px;align-items:center;gap:6px;padding:0 10px;font-size:11px;font-weight:700;display:inline-flex}.search-box{border:1px solid var(--border);color:var(--faint);background:#0c0f13;border-radius:8px;align-items:center;gap:7px;margin:9px 10px 5px;padding-left:9px;display:flex}.search-box input{background:0 0;border:0;outline:none;padding-left:0}.file-area{flex:1;min-height:0;padding:4px 6px 12px;overflow:auto}.tree-list{font-size:11px}.tree-row{color:#aeb7c2;cursor:pointer;text-align:left;background:0 0;border:0;border-radius:6px;align-items:center;gap:6px;width:100%;min-width:0;min-height:28px;display:flex}.tree-row span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.tree-row:hover{color:#e6edf3;background:#171c23}.tree-row.active{color:#d1fae5;background:#34d3991c}.tree-folder{color:#c3ccd7;font-weight:600}.sidebar-foot{border-top:1px solid var(--border);min-height:34px;color:var(--faint);justify-content:space-between;align-items:center;padding:0 10px;font-size:9px;display:flex}.editor-panel{background:#0d1014;flex-direction:column;min-height:calc(100vh - 62px);display:flex}.editor-head{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;min-height:55px;padding:8px 10px 8px 14px;display:flex}.file-identity{color:#cbd5df;align-items:center;gap:7px;min-width:0;font-size:12px;display:flex}.file-identity>span:first-of-type{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.dirty-pill{color:var(--yellow);background:#fcd34d14;border:1px solid #fcd34d40;border-radius:999px;padding:3px 6px;font-size:9px}.editor-actions,.ai-foot,.modal-actions{align-items:center;gap:7px;display:flex}.editor-actions{flex-wrap:wrap;justify-content:flex-end}.pr-link{color:#bae6fd;background:#7dd3fc0f;border:1px solid #7dd3fc3d;border-radius:8px;align-items:center;min-height:31px;padding:0 9px;font-size:10px;font-weight:700;text-decoration:none;display:inline-flex}.segmented{border:1px solid var(--border);background:#0b0e12;border-radius:8px;padding:2px;display:inline-flex}.segmented button{min-height:27px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:6px;align-items:center;gap:5px;padding:0 8px;font-size:10px;display:inline-flex}.segmented button.active{background:var(--panel-3);color:var(--text)}.segmented.mini button{min-height:25px;padding:0 7px}.ghost-button,.primary-button,.ai-button{cursor:pointer;border-radius:8px;justify-content:center;align-items:center;gap:6px;min-height:31px;padding:0 10px;font-size:10px;font-weight:700;display:inline-flex}.ghost-button{border:1px solid var(--border);background:var(--panel-2);color:#c0c9d3}.primary-button{color:#edfff8;background:#1e6b55;border:1px solid #316c59}.primary-button:hover,.ai-button:hover{filter:brightness(1.08)}.compact-button{white-space:nowrap;min-height:28px;padding:0 9px}.editor-body{flex:1;min-height:0;position:relative}.code-shell,.review-shell{height:calc(100vh - 117px);min-height:540px}.code-shell{flex-direction:column;display:flex}.code-meta{min-height:29px;color:var(--faint);border-bottom:1px solid #1d232b;align-items:center;gap:12px;padding:0 12px;font-size:9px;display:flex}.code-editor{resize:none;color:#d6dde6;tab-size:2;white-space:pre;background:linear-gradient(90deg,#0a0d11 0 44px,#0000 44px),#0d1014;border:0;outline:0;flex:1;width:100%;padding:14px 18px 40px 58px;font:12px/1.65 SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;overflow:auto}.welcome-state,.empty-state{text-align:center;height:100%;min-height:420px;color:var(--muted);flex-direction:column;justify-content:center;align-items:center;padding:28px;display:flex}.welcome-state{max-width:650px;margin:auto}.welcome-icon{width:64px;height:64px;color:var(--accent);background:#34d39914;border:1px solid #34d3992e;border-radius:18px;place-items:center;margin-bottom:17px;display:grid}.welcome-state h1{color:#eef4f8;letter-spacing:-.03em;max-width:560px;margin:0;font-size:clamp(22px,3vw,34px);line-height:1.1}.welcome-state p{max-width:590px;color:var(--muted);font-size:13px;line-height:1.65}.feature-row{flex-wrap:wrap;justify-content:center;gap:8px;margin-top:5px;display:flex}.feature-row span{border:1px solid var(--border);background:var(--panel);color:#aeb8c3;border-radius:999px;align-items:center;gap:6px;padding:7px 10px;font-size:10px;display:inline-flex}.empty-state.compact{min-height:170px;padding:12px;font-size:11px}.empty-state.compact p{margin:10px 0 4px}.empty-state.compact span{color:var(--faint);font-size:9px}.review-shell{overflow:auto}.ai-summary{color:#c8f7e5;background:#34d3990e;border:1px solid #34d39938;border-radius:10px;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;min-height:61px;margin:10px;padding:10px;display:grid}.ai-summary>svg{color:var(--accent)}.ai-summary strong{font-size:11px}.ai-summary p{color:#9dc7b7;margin:3px 0 0;font-size:10px;line-height:1.45}.diff-head{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:#10141a;grid-template-columns:1fr 1fr;display:grid}.diff-head span{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;padding:7px 10px;font-size:9px;font-weight:700}.diff-head span+span{border-left:1px solid var(--border)}.diff-grid{grid-template-columns:1fr 1fr;min-width:760px;display:grid}.diff-grid pre{margin:0;font:10px/1.55 SFMono-Regular,Consolas,monospace;overflow:visible}.diff-grid pre+pre{border-left:1px solid var(--border)}.diff-line{grid-template-columns:35px minmax(0,1fr);min-height:20px;display:grid}.diff-line>span{color:#485361;text-align:right;-webkit-user-select:none;user-select:none;background:#090c0f;padding:2px 7px 2px 0}.diff-line code{white-space:pre;color:#aeb7c2;padding:2px 7px}.changed-old{background:#fb718512}.changed-old code{color:#fecdd3}.changed-new{background:#34d39913}.changed-new code{color:#bbf7d0}.review-panel{border-left:1px solid var(--border);background:var(--panel);flex-direction:column;min-height:calc(100vh - 62px);display:flex;overflow:auto}.preview-card{border-bottom:1px solid var(--border);padding-bottom:13px}.preview-heading{border-bottom:0}.preview-controls{justify-content:space-between;align-items:center;gap:7px;padding:0 12px 8px;display:flex}.preview-controls select{border:1px solid var(--border);color:#c3ccd6;background:#0b0e12;border-radius:8px;flex:1;min-width:0;min-height:30px;padding:0 8px;font-size:10px}.preview-url-row{padding:0 12px 8px}.device-label{color:var(--faint);justify-content:center;align-items:center;gap:5px;margin:1px 0 8px;font-size:9px;display:flex}.phone-frame{background:#090b0e;border:6px solid #252b33;border-radius:26px;width:min(270px,100% - 30px);max-height:480px;margin:0 auto;position:relative;overflow:hidden;box-shadow:0 16px 44px #00000052}.phone-frame iframe{background:#fff;border:0;width:100%;height:100%}.phone-speaker{z-index:2;pointer-events:none;background:#232a32;border-radius:999px;width:42px;height:5px;position:absolute;top:6px;left:50%;transform:translate(-50%)}.phone-empty{text-align:center;height:100%;min-height:330px;color:var(--faint);flex-direction:column;justify-content:center;align-items:center;padding:22px;display:flex}.phone-empty strong{color:#c9d1d9;margin:9px 0 4px;font-size:12px}.phone-empty span{max-width:190px;font-size:9px;line-height:1.45}.ai-card{padding-bottom:12px}.provider-chip{color:#bae6fd;background:#7dd3fc0f;border:1px solid #7dd3fc38;border-radius:999px;padding:4px 7px;font-size:9px}.ai-target{color:var(--faint);align-items:center;gap:6px;min-width:0;margin:0 12px 8px;font-size:9px;display:flex}.ai-target span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.prompt-box{resize:vertical;color:#d7dee6;border:1px solid var(--border);background:#0b0e12;border-radius:10px;outline:0;width:calc(100% - 24px);min-height:105px;max-height:230px;margin:0 12px;padding:10px;font-size:11px;line-height:1.5}.prompt-box:focus{border-color:#3b685a}.ai-foot{justify-content:space-between;margin:8px 12px 0}.ai-button{color:#edfff8;background:linear-gradient(135deg,#187357,#2b8b69);border:1px solid #34745f;flex:1}.privacy-note{color:var(--faint);margin:8px 12px 0;font-size:8.5px;line-height:1.4}.modal-backdrop{z-index:100;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000a1;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.settings-modal{background:#11151a;border:1px solid #313944;border-radius:16px;width:min(520px,100%);max-height:calc(100vh - 40px);overflow:auto;box-shadow:0 24px 80px #0000007a}.phone-preview-trigger{min-width:96px}.phone-preview-modal{width:min(500px,100%)}.phone-preview-body{padding:18px}.phone-preview-body>p{color:#8d99a6;text-align:center;max-width:390px;margin:0 auto 16px;font-size:11px;line-height:1.55}.phone-preview-qr-shell{aspect-ratio:1;background:#f8fafc;border:1px solid #3b4652;border-radius:20px;place-items:center;width:min(290px,82vw);margin:0 auto 16px;padding:14px;display:grid;box-shadow:0 18px 50px #0000004d,inset 0 0 0 8px #171b20}.phone-preview-qr-shell img{width:100%;height:100%;image-rendering:pixelated;border-radius:8px;display:block}.phone-preview-loading{color:#4b5563;text-align:center;align-content:center;place-items:center;gap:10px;min-height:180px;font-size:11px;display:grid}.phone-preview-loading.error{color:#9f4c5d}.phone-preview-link{background:#0c1014;border:1px solid #262f38;border-radius:10px;gap:5px;max-width:420px;margin:0 auto;padding:10px 11px;display:grid}.phone-preview-link span{color:#72808d;text-transform:uppercase;letter-spacing:.09em;font-size:9px;font-weight:700}.phone-preview-link code{text-overflow:ellipsis;white-space:nowrap;color:#b9c5d1;font:10px/1.45 SFMono-Regular,Consolas,monospace;overflow:hidden}.phone-preview-actions{flex-wrap:wrap;justify-content:center;gap:8px;margin-top:12px;display:flex}.phone-preview-actions a{text-decoration:none}.phone-preview-error{color:#fda4af;text-align:center;margin:9px auto 0;font-size:10px}.phone-preview-note{color:#80918d;background:#34d3990b;border:1px solid #34d39924;border-radius:10px;align-items:flex-start;gap:8px;max-width:420px;margin:14px auto 0;padding:10px;font-size:9px;line-height:1.5;display:flex}.phone-preview-note svg{color:#34d399;flex:none}@media (max-width:680px){.phone-preview-trigger{min-width:0}.phone-preview-modal{max-height:calc(100vh - 24px)}.phone-preview-body{padding:14px}}.modal-head{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:16px 16px 13px;display:flex}.modal-head h2{margin:4px 0 0;font-size:18px}.settings-group{padding:13px 16px 2px}.settings-title{color:#d8e0e8;align-items:center;gap:7px;margin-bottom:10px;font-size:12px;display:flex}.settings-group label{color:#aab4c0;gap:5px;margin-bottom:9px;font-size:10px;display:grid}.settings-group label span{color:var(--faint)}.security-callout{color:#8895a3;background:#0d1116;border:1px solid #34404b;border-radius:10px;align-items:flex-start;gap:8px;margin:11px 16px;padding:10px;display:flex}.security-callout svg{color:var(--blue);flex:none}.security-callout p{margin:0;font-size:9px;line-height:1.55}.modal-actions{border-top:1px solid var(--border);justify-content:flex-end;margin-top:13px;padding:12px 16px 16px}.spin{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:1180px){.ide-grid{grid-template-columns:220px minmax(420px,1fr) 330px}.status-copy{display:none}}@media (max-width:930px){.topbar{grid-template-columns:1fr auto}.repo-strip{display:none}.ide-grid{grid-template-columns:210px minmax(0,1fr)}.review-panel{border-left:0;border-top:1px solid var(--border);grid-column:1/-1;grid-template-columns:1fr 1fr;min-height:auto;display:grid}.preview-card{border-bottom:0;border-right:1px solid var(--border)}.phone-frame{max-height:520px}}@media (max-width:680px){.topbar{height:56px;padding:0 10px}.brand span{display:none}.ide-grid{min-height:calc(100vh - 56px);display:block}.sidebar{border-right:0;border-bottom:1px solid var(--border);min-height:auto}.file-area{max-height:220px}.editor-panel{min-height:620px}.editor-head{flex-direction:column;align-items:flex-start}.editor-actions{flex-wrap:wrap;width:100%}.editor-actions .segmented{margin-right:auto}.code-shell,.review-shell{height:560px;min-height:560px}.review-panel{display:block}.preview-card{border-right:0;border-bottom:1px solid var(--border)}.diff-grid{min-width:640px}}.ai-scope-row{justify-content:flex-start;padding:0 12px 8px;display:flex}.project-agent-result{border:1px solid var(--border);background:#0c1014;border-radius:10px;margin:9px 12px 0;overflow:hidden}.project-agent-summary{border-bottom:1px solid var(--border);background:#34d3990b;padding:10px}.project-agent-summary strong{color:#d7f9eb;margin-bottom:4px;font-size:10px;display:block}.project-agent-summary p{color:#a9b6c3;margin:0;font-size:9.5px;line-height:1.45}.project-agent-summary span{color:var(--faint);margin-top:5px;font-size:8.5px;line-height:1.4;display:block}.project-file-list{display:grid}.project-file-list button{color:#c7d0da;cursor:pointer;text-align:left;background:0 0;border:0;border-top:1px solid #1c232b;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;width:100%;padding:9px 10px;display:grid}.project-file-list button:first-child{border-top:0}.project-file-list button:hover{background:#151b22}.project-file-list button>span{min-width:0}.project-file-list strong,.project-file-list small{text-overflow:ellipsis;display:block;overflow:hidden}.project-file-list strong{white-space:nowrap;color:#dce4ec;font-size:9.5px}.project-file-list small{color:var(--faint);white-space:normal;margin-top:3px;font-size:8.5px;line-height:1.35}.runtime-console{border:1px solid var(--border);background:#090d11;border-radius:10px;margin:10px 12px 0;overflow:hidden}.runtime-console-head{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:8px;min-height:34px;padding:7px 9px;display:flex}.runtime-console-head strong{color:#d9e2eb;font-size:9.5px}.runtime-console-head span{color:var(--faint);text-overflow:ellipsis;white-space:nowrap;font-size:8.5px;overflow:hidden}.runtime-console pre{white-space:pre-wrap;color:#a9b7c6;max-height:180px;margin:0;padding:9px;font:8.5px/1.45 SFMono-Regular,Consolas,monospace;overflow:auto}.runtime-console details{border-top:1px solid #1a222a}.runtime-console summary{cursor:pointer;color:var(--muted);padding:7px 9px;font-size:8.5px}.account-connect-card,.other-provider-box{border:1px solid var(--border);background:#0c1014;border-radius:10px;margin-bottom:10px;padding:10px}.account-connect-card>div:first-child{justify-content:space-between;align-items:center;gap:8px;display:flex}.account-connect-card strong{font-size:11px}.connection-state{border:1px solid var(--border);color:var(--muted);border-radius:999px;padding:3px 7px;font-size:8.5px}.connection-state.connected{color:#b8f7dc;background:#34d39912;border-color:#34d39947}.connection-state.waiting{color:#fde68a;background:#fcd34d0f;border-color:#fcd34d40}.account-connect-card p,.settings-hint{color:var(--faint);font-size:9px;line-height:1.45}.account-connect-card code{color:#eaf0f5;border:1px solid var(--border);background:#151b22;border-radius:5px;padding:2px 5px}.account-connect-card a{color:#bae6fd;margin-bottom:8px;font-size:9px;display:inline-block}.account-actions{gap:7px;display:flex}.other-provider-box summary{cursor:pointer;color:#cbd5df;margin-bottom:8px;font-size:10px;font-weight:700}.toggle-label{border:1px solid var(--border);background:#0c1014;border-radius:8px;align-items:center;min-height:34px;padding:7px 9px;grid-template-columns:unset!important;gap:8px!important;display:flex!important}.toggle-label input{accent-color:#34d399;width:auto!important;padding:0!important}@media (max-width:1180px){.editor-actions{gap:5px}.editor-actions .ghost-button,.editor-actions .primary-button{padding:0 7px}}.preview-view-toggle{border:1px solid var(--border);background:#0b0e12;border-radius:999px;margin-left:8px;padding:2px;display:inline-flex}.preview-view-toggle button{color:var(--faint);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:3px 6px;font-size:7.5px}.preview-view-toggle button.active{color:#dffcf1;background:#34d3991f}.replay-image{object-fit:cover;background:#fff;width:100%;height:100%;display:block}.replay-controls{grid-template-columns:32px 1fr 32px;align-items:center;gap:6px;width:min(270px,100% - 30px);margin:8px auto 0;display:grid}.replay-controls button{border:1px solid var(--border);background:var(--panel-2);height:28px;color:var(--text);cursor:pointer;border-radius:8px}.replay-controls span{text-align:center;color:var(--muted);font-size:8.5px}.playtest-result{border:1px solid var(--border);background:#0b0f13;border-radius:10px;margin:9px 12px 0;padding:9px}.playtest-result strong{color:#d9f9ec;font-size:10px}.playtest-result p{color:#aebac6;white-space:pre-wrap;margin:6px 0 0;font-size:9px;line-height:1.5}.playtest-result pre{white-space:pre-wrap;color:#8492a1;max-height:140px;margin:7px 0 0;font:8px/1.45 SFMono-Regular,Consolas,monospace;overflow:auto}.live-test-status{color:#a9c8bc;background:#34d3990e;border:1px solid #34d39938;border-radius:9px;align-items:center;gap:6px;width:min(270px,100% - 30px);min-height:30px;margin:8px auto 0;padding:6px 8px;font-size:8.5px;display:flex}.live-test-status strong{color:#d7faec}.live-test-status>span:last-child{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.live-dot{background:#34d399;border-radius:50%;flex:none;width:7px;height:7px;animation:1.1s ease-in-out infinite livePulse;box-shadow:0 0 9px #34d399a6}@keyframes livePulse{0%,to{opacity:.45;transform:scale(.85)}50%{opacity:1;transform:scale(1.05)}}.builder-grid{background:#0b0d10;grid-template-columns:232px minmax(520px,1fr) 390px;min-height:calc(100vh - 62px);transition:grid-template-columns .18s;display:grid}.builder-grid.right-closed{grid-template-columns:232px minmax(520px,1fr) 0}.project-sidebar{border-right:1px solid var(--border);background:#0f1216;flex-direction:column;min-width:0;min-height:calc(100vh - 62px);display:flex;overflow:hidden}.project-nav{gap:4px;padding:8px 9px 3px;display:grid}.project-nav button{color:#8f9aa8;cursor:pointer;text-align:left;background:0 0;border:0;border-radius:8px;align-items:center;gap:8px;min-height:34px;padding:0 10px;font-size:11px;font-weight:650;display:flex}.project-nav button:hover{color:#d7e0e8;background:#171c22}.project-nav button.active{color:#c8fae7;background:#34d3991a}.builder-main{background:radial-gradient(circle at 50% 12%,#34d3990e,#0000 30%),#0b0e12;flex-direction:column;min-width:0;min-height:calc(100vh - 62px);display:flex}.builder-toolbar{border-bottom:1px solid var(--border);z-index:12;background:#0e1115f0;justify-content:space-between;align-items:center;gap:10px;min-height:54px;padding:7px 10px 7px 12px;display:flex;position:sticky;top:62px}.view-tabs{border:1px solid var(--border);background:#090c0f;border-radius:10px;align-items:center;gap:2px;padding:3px;display:inline-flex}.view-tabs button{color:#788492;cursor:pointer;background:0 0;border:0;border-radius:7px;align-items:center;gap:6px;min-height:30px;padding:0 10px;font-size:10px;font-weight:700;display:inline-flex}.view-tabs button.active{color:#eef4f8;background:#1a2027;box-shadow:inset 0 0 0 1px #29313b}.builder-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:6px;display:flex}.run-button{color:#effff9;cursor:pointer;background:linear-gradient(135deg,#187356,#2b8b68);border:1px solid #2c765d;border-radius:8px;justify-content:center;align-items:center;gap:6px;min-height:32px;padding:0 11px;font-size:10px;font-weight:800;display:inline-flex}.run-button.large{min-height:38px;margin-top:14px;padding:0 14px;font-size:11px}.drawer-control{margin-left:2px}.builder-stage{flex:1;min-height:0;overflow:auto}.preview-workbench,.editor-workbench,.changes-workbench{min-height:calc(100vh - 116px)}.preview-workbench{flex-direction:column;padding:18px 24px 26px;display:flex}.preview-workbench-head,.editor-workbench-head,.changes-head{justify-content:space-between;align-items:center;gap:12px;min-height:46px;margin-bottom:10px;display:flex}.preview-workbench-head>div:first-child,.changes-head>div:first-child{flex-direction:column;gap:4px;display:flex}.preview-workbench-head strong,.changes-head strong{color:#dce4ec;font-size:13px}.stage-kicker{color:#647180;letter-spacing:.15em;font-size:8.5px;font-weight:800}.preview-head-actions{align-items:center;gap:7px;display:flex}.preview-head-actions select{border:1px solid var(--border);color:#b9c3ce;background:#0d1115;border-radius:8px;min-height:31px;padding:0 9px;font-size:10px}.preview-canvas{background:linear-gradient(#ffffff05,#fff0),#090c10;border:1px solid #202831;border-radius:18px;flex:1;place-items:center;min-height:650px;padding:24px;display:grid;position:relative;overflow:hidden}.preview-canvas:before{content:"";pointer-events:none;background-image:linear-gradient(#ffffff05 1px,#0000 1px),linear-gradient(90deg,#ffffff05 1px,#0000 1px);background-size:28px 28px;position:absolute;inset:0}.preview-background-glow{filter:blur(8px);pointer-events:none;background:radial-gradient(circle,#34d3991c,#0000 62%);border-radius:50%;width:560px;height:560px;position:absolute}.phone-frame.builder-phone{z-index:2;border-width:9px;border-radius:38px;width:min(440px,100% - 60px);max-height:none;margin:0;box-shadow:0 28px 80px #0000007a,0 0 0 1px #ffffff09}.phone-frame.builder-phone .phone-empty{min-height:520px}.builder-empty{background:radial-gradient(circle at 50% 35%,#34d39912,#0000 34%),#0a0d10}.builder-empty strong{font-size:14px}.builder-empty span{max-width:250px;font-size:10px}.preview-statusbar{color:#73808d;background:#0d1115;border:1px solid #1e252d;border-radius:10px;justify-content:center;align-items:center;gap:18px;min-height:38px;margin-top:9px;padding:6px 10px;font-size:9px;display:flex}.preview-statusbar>div{align-items:center;gap:6px;display:inline-flex}.runtime-dot{background:#4b5563;border-radius:50%;width:7px;height:7px}.runtime-dot.on{background:#34d399;box-shadow:0 0 9px #34d399a6}.preview-advanced{color:#74808c;background:#0c1014;border:1px solid #1d242c;border-radius:10px;width:min(560px,100%);margin:10px auto 0}.preview-advanced summary{cursor:pointer;padding:8px 10px;font-size:9px}.preview-advanced .preview-url-row{padding:0 9px 9px}.live-test-status.wide,.replay-controls.wide,.playtest-result.wide{width:min(680px,100%);margin-left:auto;margin-right:auto}.editor-workbench,.changes-workbench{flex-direction:column;padding:12px;display:flex}.editor-workbench-head,.changes-head{margin:0;padding:0 4px 10px}.builder-code-shell{border:1px solid var(--border);background:#0d1014;border-radius:12px;flex:1;height:auto;min-height:620px;overflow:hidden}.builder-code-shell .code-editor{min-height:580px}.builder-no-file{background:#0b0f13;border:1px dashed #26303a;border-radius:14px;flex:1;min-height:520px}.builder-no-file p{color:#d3dbe3;margin:10px 0 4px}.builder-no-file span{color:#6f7c89;font-size:10px}.changes-summary{margin:0 0 10px}.builder-review-shell{border:1px solid var(--border);background:#0c0f13;border-radius:12px;height:auto;min-height:640px;overflow:auto}.ai-drawer{border-left:1px solid var(--border);background:#101318;flex-direction:column;min-width:0;min-height:calc(100vh - 62px);display:flex;overflow:hidden}.ai-drawer-head{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:10px;min-height:58px;padding:10px 11px 10px 14px;display:flex}.ai-drawer-head>div:first-child{flex-direction:column;gap:4px;min-width:0;display:flex}.ai-drawer-head strong{color:#edf3f7;font-size:13px}.ai-drawer-scroll{min-height:0;padding-bottom:18px;overflow-y:auto}.provider-row{justify-content:space-between;align-items:center;gap:7px;padding:11px 12px 4px;display:flex}.text-button{color:#8fa0ae;cursor:pointer;background:0 0;border:0;align-items:center;gap:5px;min-height:28px;font-size:9px;display:inline-flex}.text-button:hover{color:#d8e2ea}.drawer-scope{padding-top:6px}.builder-target{margin-top:2px;padding:0 12px}.prompt-composer{padding:4px 12px 0}.builder-prompt{background:linear-gradient(#ffffff05,#0000),#0a0e12;border-color:#29333d;border-radius:14px;width:100%;min-height:180px;max-height:360px;margin:0;font-size:11px;line-height:1.55}.builder-send{border-radius:10px;width:100%;min-height:39px;margin-top:8px}.drawer-results,.drawer-console{margin-left:12px;margin-right:12px}.quick-actions-card{border:1px solid var(--border);background:#0c1014;border-radius:11px;margin:10px 12px 0;padding:10px}.quick-actions-grid{grid-template-columns:1fr 1fr;gap:6px;margin-top:8px;display:grid}.quick-actions-grid button{color:#9da9b5;cursor:pointer;background:#12171d;border:1px solid #242d36;border-radius:8px;align-items:center;gap:6px;min-height:34px;padding:0 8px;font-size:9px;font-weight:700;display:flex}.quick-actions-grid button:hover{color:#e1e8ee;border-color:#33414e}.drawer-note{margin:12px}.ai-drawer-reopen{z-index:30;color:#b9f7df;cursor:pointer;background:#11181df5;border:1px solid #335e50;border-radius:10px;align-items:center;gap:7px;min-height:38px;padding:0 10px;font-size:10px;font-weight:800;display:flex;position:fixed;top:128px;right:12px;box-shadow:0 12px 35px #00000047}@media (max-width:1280px){.builder-grid{grid-template-columns:208px minmax(470px,1fr) 350px}.builder-grid.right-closed{grid-template-columns:208px minmax(470px,1fr) 0}.phone-frame.builder-phone{width:min(390px,100% - 44px)}.preview-canvas{min-height:610px}.builder-actions .ghost-button{padding:0 7px}}@media (max-width:1020px){.builder-grid,.builder-grid.right-closed{grid-template-columns:188px minmax(0,1fr)}.ai-drawer{z-index:40;width:min(390px,100vw - 44px);position:fixed;top:62px;bottom:0;right:0;box-shadow:-18px 0 50px #00000075}.builder-toolbar{top:62px}.preview-workbench{padding:14px}.preview-canvas{min-height:580px}}@media (max-width:720px){.builder-grid,.builder-grid.right-closed{display:block}.project-sidebar{border-right:0;border-bottom:1px solid var(--border);min-height:auto;max-height:250px}.project-nav{grid-template-columns:repeat(3,1fr)}.project-nav button{justify-content:center}.file-area{max-height:120px}.builder-toolbar{flex-direction:column;align-items:stretch;padding:7px;top:56px}.view-tabs{width:100%}.view-tabs button{flex:1;justify-content:center}.builder-actions{justify-content:flex-start}.preview-workbench{padding:8px}.preview-workbench-head{padding:0 4px}.preview-canvas{border-radius:12px;min-height:550px;padding:12px}.phone-frame.builder-phone{width:min(370px,100% - 12px)}.ai-drawer{width:min(94vw,390px);top:56px}}.github-connect-button{color:#d9e2ea;cursor:pointer;background:#12171d;border:1px solid #2f3a45;border-radius:9px;justify-content:center;align-items:center;gap:7px;min-height:36px;font-size:10px;font-weight:800;display:flex}.github-connect-button:hover{color:#c8fae7;background:#151c20;border-color:#426050}.github-account-mini{border:1px solid var(--border);background:#0c1014;border-radius:9px;grid-template-columns:28px minmax(0,1fr) 29px;align-items:center;gap:7px;min-height:42px;padding:6px 7px;display:grid}.github-account-mini img,.github-account-card img{object-fit:cover;background:#182029;border-radius:50%;width:28px;height:28px}.github-account-mini>div{flex-direction:column;gap:2px;min-width:0;display:flex}.github-account-mini strong{color:#e2e9ef;text-overflow:ellipsis;white-space:nowrap;font-size:10px;overflow:hidden}.github-account-mini span{color:var(--faint);text-overflow:ellipsis;white-space:nowrap;font-size:8px;overflow:hidden}.repo-select-label{color:#768492;gap:5px;font-size:8.5px;font-weight:700;display:grid}.repo-quick select{border:1px solid var(--border);width:100%;min-width:0;min-height:36px;color:var(--text);background:#0c0f13;border-radius:8px;padding:0 9px;font-size:10px}.github-account-card{background:#34d3990b;border:1px solid #34d39930;border-radius:10px;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:9px;min-height:54px;margin-bottom:10px;padding:8px;display:grid}.github-account-card img{width:34px;height:34px}.github-account-card>div{flex-direction:column;gap:3px;min-width:0;display:flex}.github-account-card strong{color:#e8f7f1;font-size:11px}.github-account-card span{color:#7e918c;font-size:8.5px}.github-login-action{width:100%;margin-bottom:10px}.codex-device-card{background:linear-gradient(145deg,#14352ee6,#0d1a1ff0);border:1px solid #45d3a647;border-radius:14px;gap:10px;padding:14px;display:grid}.codex-device-card>span:not(.eyebrow){color:#91a6aa;font-size:12px;line-height:1.45}.codex-device-code{color:#baf9df;letter-spacing:.12em;background:#071411;border:1px solid #60e2b559;border-radius:10px;width:fit-content;padding:8px 12px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:20px}.codex-device-card .primary-button{text-decoration:none}.codex-auth-detail{background:#0b1519;border:1px solid #263a40;border-radius:10px;overflow:hidden}.codex-auth-detail summary{cursor:pointer;color:#7f989f;padding:9px 11px;font-size:11px}.codex-auth-detail pre{white-space:pre-wrap;color:#8ca5aa;max-height:150px;margin:0;padding:10px 11px;font-size:10px;line-height:1.45;overflow:auto}.ai-progress-card,.ai-usage-card{background:linear-gradient(#0e171cfa,#0a1115fa);border:1px solid #23383d;border-radius:11px;margin:10px 12px 0;padding:11px}.ai-progress-card{border-color:#3ec99d3d}.ai-progress-card.complete{border-color:#4cd6a66b}.ai-progress-head,.ai-usage-head,.usage-meter-row>div:first-child{justify-content:space-between;align-items:center;gap:8px;display:flex}.ai-progress-head>div{align-items:center;gap:8px;display:flex}.ai-progress-head strong{color:#b8f5df;font-size:11px}.ai-progress-head>span{color:#8da0a7;text-align:right;max-width:58%;font-size:8px}.ai-progress-track,.usage-meter{background:#172329;border-radius:999px;width:100%;height:7px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff06}.ai-progress-track{margin-top:9px}.ai-progress-track i,.usage-meter i{border-radius:inherit;background:linear-gradient(90deg,#2f9f7d,#52d4a8);height:100%;transition:width .36s;display:block}.ai-progress-card.complete .ai-progress-track i{background:linear-gradient(90deg,#42b88f,#79edbd)}.ai-progress-card>small,.usage-meter-row>small,.usage-token-note{color:#687d84;margin-top:6px;font-size:7.5px;line-height:1.4;display:block}.ai-run-usage{flex-wrap:wrap;gap:5px;margin-top:8px;display:flex}.ai-run-usage span{color:#718990;background:#0c1519;border:1px solid #23383d;border-radius:6px;padding:4px 6px;font-size:7px;font-weight:700}.ai-usage-card{border-color:#d9b45b2e;margin-top:8px}.ai-usage-head{margin-bottom:9px}.ai-usage-head .text-button{min-height:22px;font-size:7px}.usage-meter-row{gap:5px;margin-top:8px;display:grid}.usage-meter-row+.usage-meter-row{border-top:1px solid #1c2b30;padding-top:8px}.usage-meter-row strong{color:#d8e3e0;font-size:8px}.usage-meter-row span{color:#c7aa68;font-size:8px;font-weight:800}.usage-meter-row.secondary span{color:#80bdac}.usage-meter{height:6px}.usage-meter i{background:linear-gradient(90deg,#b98b45,#d4b35f)}.usage-meter-row.secondary .usage-meter i{background:linear-gradient(90deg,#3f8c77,#64b99f)}.codex-usage-refresh{justify-content:center;width:100%;margin-top:7px}@media (max-width:720px){.ai-progress-card,.ai-usage-card{margin-left:8px;margin-right:8px}}.codex-model-card{background:linear-gradient(#0f181ffa,#0a1115fa);border:1px solid #589ed633;border-radius:11px;gap:9px;margin:8px 12px 0;padding:11px;display:grid}.codex-model-card-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.codex-model-card-head .text-button{min-height:22px;font-size:7px}.codex-model-card label,.codex-settings-model label{color:#74868d;gap:5px;font-size:7.5px;font-weight:700;display:grid}.codex-model-card select,.codex-settings-model select{color:#d8e5e2;background:#0b1216;border:1px solid #26363d;border-radius:8px;outline:none;width:100%;min-height:32px;padding:0 8px;font-size:9px}.codex-model-card select:focus,.codex-settings-model select:focus{border-color:#52d4a88c;box-shadow:0 0 0 2px #52d4a814}.codex-settings-model{grid-template-columns:minmax(0,1fr) 132px;gap:8px;margin:10px 0;display:grid}@media (max-width:720px){.codex-model-card{margin-left:8px;margin-right:8px}.codex-settings-model{grid-template-columns:1fr}}.agent-heartbeat{color:#7d969d;background:#122f286b;border:1px solid #4fcda32e;border-radius:8px;align-items:center;gap:7px;margin-top:8px;padding:7px 8px;font-size:7.5px;display:flex}.agent-heartbeat strong{color:#b9ead8;font-size:7.5px}.agent-heartbeat>span:last-child{color:#8fc9b5;margin-left:auto;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-weight:800}.heartbeat-dot{background:#54d6a8;border-radius:999px;width:7px;height:7px;animation:1.45s infinite heartbeatPulse;box-shadow:0 0 #54d6a880}@keyframes heartbeatPulse{0%{opacity:1;box-shadow:0 0 #54d6a86b}70%{opacity:.75;box-shadow:0 0 0 6px #54d6a800}to{opacity:1;box-shadow:0 0 #54d6a800}}.agent-cancel-button{color:#e8a1a1;cursor:pointer;background:#571f1f57;border:1px solid #e170703d;border-radius:8px;width:100%;min-height:30px;margin-top:8px;font-size:8px;font-weight:800}.agent-cancel-button:hover{background:#6925256b;border-color:#e170706b}.reference-images-card{background:linear-gradient(#0e161cfa,#090f13fa);border:1px solid #558ec933;border-radius:11px;margin:9px 12px 0;padding:10px}.reference-images-head,.reference-image-title,.reference-image-controls,.reference-images-actions{align-items:center;display:flex}.reference-images-head{justify-content:space-between;gap:8px}.reference-images-head>div:first-child{gap:3px;min-width:0;display:grid}.reference-images-head strong{color:#dfe8ed;font-size:10px}.reference-images-actions{flex-wrap:wrap;flex-shrink:0;justify-content:flex-end;gap:5px}.reference-upload-button{color:#aee8d4;cursor:pointer;background:#28765c38;border:1px solid #4ccfa540;border-radius:7px;align-items:center;gap:5px;min-height:27px;padding:0 8px;font-size:7.5px;font-weight:800;display:inline-flex}.reference-upload-button:hover{background:#28765c52;border-color:#4ccfa575}.reference-dropzone{color:#68818a;text-align:center;background:#0b1318c2;border:1px dashed #2b424b;border-radius:9px;flex-direction:column;justify-content:center;align-items:center;gap:5px;min-height:70px;margin-top:8px;padding:11px;transition:all .16s;display:flex}.reference-dropzone.compact{text-align:left;flex-flow:wrap;justify-content:flex-start;min-height:48px}.reference-dropzone.dragging{color:#b8efdc;background:#236b5433;border-color:#55d2aa;transform:translateY(-1px)}.reference-dropzone>span{color:#90a6ad;font-size:8px;font-weight:700}.reference-dropzone>small{color:#536970;font-size:7px}.reference-image-list{scrollbar-width:thin;gap:7px;max-height:490px;margin-top:8px;padding-right:2px;display:grid;overflow:auto}.reference-image-item{opacity:.64;background:#0a1115;border:1px solid #202f35;border-radius:9px;grid-template-columns:58px minmax(0,1fr);gap:8px;min-width:0;padding:7px;display:grid}.reference-image-item.active{opacity:1;background:#0d1f1bb3;border-color:#51caa345}.reference-thumb{cursor:zoom-in;background:#111a1f;border:1px solid #27383e;border-radius:8px;width:58px;height:58px;padding:0;overflow:hidden}.reference-thumb img{object-fit:cover;width:100%;height:100%;display:block}.reference-image-meta{gap:5px;min-width:0;display:grid}.reference-image-title{justify-content:space-between;gap:6px;min-width:0}.reference-image-title strong{white-space:nowrap;text-overflow:ellipsis;color:#d4dfdf;min-width:0;font-size:8px;overflow:hidden}.reference-image-title span{color:#63757b;flex-shrink:0;font-size:6.5px}.reference-image-controls{flex-wrap:wrap;gap:5px;min-width:0}.reference-identity-row{grid-template-columns:72px minmax(0,1fr);gap:5px;display:grid}.reference-id-input,.reference-title-input{color:#b9c9cd;background:#0b1317;border:1px solid #223239;border-radius:6px;outline:none;min-width:0;height:27px;padding:0 7px;font-size:7px}.reference-id-input{color:#83e5c2;letter-spacing:.25px;font-weight:900}.reference-id-input:focus,.reference-title-input:focus{border-color:#4dc99f73}.reference-image-controls select{color:#aab9bd;background:#0c1519;border:1px solid #26373d;border-radius:6px;flex:1;min-width:0;height:26px;padding:0 5px;font-size:7px}.reference-toggle{color:#7fae9e;border:1px solid #26373d;border-radius:6px;align-items:center;gap:4px;height:26px;padding:0 6px;font-size:7px;font-weight:800;display:inline-flex}.reference-toggle input{accent-color:#46c89c;width:11px;height:11px}.reference-order-button{color:#8aa1a8;cursor:pointer;background:#0c1519;border:1px solid #26373d;border-radius:6px;place-items:center;width:26px;height:26px;padding:0;font-size:10px;font-weight:900;display:grid}.reference-order-button:hover:not(:disabled){color:#cce6df;border-color:#4dc99f66}.reference-order-button:disabled{opacity:.28;cursor:default}.reference-delete{color:#b77575;cursor:pointer;background:#591f1f38;border:1px solid #d964642e;border-radius:6px;place-items:center;width:26px;height:26px;padding:0;display:grid}.reference-delete:hover{color:#f0a0a0;border-color:#d9646461}.reference-note{color:#aebec1;background:#0b1317;border:1px solid #223239;border-radius:6px;outline:none;width:100%;min-width:0;height:27px;padding:0 7px;font-size:7px}.reference-note:focus{border-color:#4dc99f73}@media (max-width:720px){.reference-images-card{margin-left:8px;margin-right:8px}.reference-images-head{align-items:flex-start}.reference-image-item{grid-template-columns:52px minmax(0,1fr)}.reference-thumb{width:52px;height:52px}}.visual-loop-action{color:#c7c4ff!important;background:linear-gradient(#4f49b047,#24205c47)!important;border-color:#7974ff57!important}.visual-loop-action:hover:not(:disabled){background:linear-gradient(#5c56ca61,#2c277061)!important;border-color:#8d89ff94!important}.visual-loop-mini-status{background:#2d27672e;border:1px solid #756dee38;border-radius:8px;grid-template-columns:auto 1fr;align-items:center;gap:3px 7px;margin-top:8px;padding:8px 9px;display:grid}.visual-loop-mini-status .live-dot{grid-row:1/span 2}.visual-loop-mini-status strong{color:#d6d3ff;font-size:8px}.visual-loop-mini-status span:last-child{color:#7e8797;font-size:7px;line-height:1.35}.visual-review-pre{white-space:pre-wrap;word-break:break-word;max-height:360px;font:inherit;color:#b7c5c9;margin:8px 0 0;font-size:8px;line-height:1.55;overflow:auto}