@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Inter:wght@400;500;600;700&display=swap";:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#15171a;background:#f8f9fb;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #15171a;--muted: #69707d;--faint: #9299a6;--line: #e5e8ed;--surface: #fff;--blue: #2f78e5;--blue-wash: #eaf3ff;--green: #16845b;--green-wash: #e8f7f0;--shadow: 0 1px 2px rgb(16 24 40 / 4%), 0 7px 24px rgb(16 24 40 / 5%)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:#f8f9fb}button,textarea{font:inherit}button{cursor:pointer}button:focus-visible,textarea:focus-visible{outline:3px solid rgb(47 120 229 / 28%);outline-offset:2px}.app-shell{min-height:100vh}.topbar{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 28px;border-bottom:1px solid var(--line);background:#ffffffd9;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);position:sticky;top:0;z-index:5}.brand{display:inline-flex;align-items:center;gap:9px;color:var(--ink);text-decoration:none;font-size:14px;font-weight:700;letter-spacing:-.02em}.brand-mark{display:grid;place-items:center;width:25px;height:25px;color:#fff;background:var(--ink);border-radius:7px}.topbar-center{display:inline-flex;align-items:center;gap:7px;color:var(--muted);font-size:12px}.status-dot,.saved-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px var(--green-wash)}.topbar-actions{display:flex;align-items:center;gap:10px}.icon-button{display:grid;place-items:center;width:31px;height:31px;color:var(--muted);background:transparent;border:1px solid transparent;border-radius:7px}.icon-button:hover{color:var(--ink);background:#f1f3f6;border-color:var(--line)}.on-dark{color:#a6afbf}.on-dark:hover{color:#fff;background:#303946;border-color:#424d5e}.avatar,.mini-avatar{display:grid;place-items:center;border:0;border-radius:50%;background:#e9e1d3;color:#705d48;font-weight:600}.avatar{width:28px;height:28px;font-size:11px}.workspace{display:grid;grid-template-columns:minmax(285px,355px) minmax(0,1fr);min-height:645px;border-bottom:1px solid var(--line)}.builder-panel{display:flex;flex-direction:column;gap:20px;padding:32px 25px 22px;color:#e9edf4;background:#202630;border-right:1px solid #303946}.panel-heading{display:flex;justify-content:space-between;gap:12px}.eyebrow{margin:0 0 9px;color:#8c97a9;font-size:10px;font-weight:700;letter-spacing:.14em}.eyebrow.blue{color:var(--blue)}.panel-heading h1{max-width:235px;margin:0;color:#fff;font-size:21px;line-height:1.25;letter-spacing:-.035em}.builder-intro{margin:-7px 0 0;color:#a6afbf;font-size:12px;line-height:1.65}.prompt-card{overflow:hidden;background:#2b333f;border:1px solid #424d5e;border-radius:10px;box-shadow:0 8px 24px #0000001f}.prompt-card textarea{display:block;width:100%;min-height:114px;padding:14px 15px;color:#f5f7fa;background:transparent;border:0;outline:0;resize:vertical;font-size:12px;line-height:1.65}.prompt-card textarea::placeholder{color:#828d9d}.prompt-footer{display:flex;align-items:center;justify-content:space-between;padding:10px 11px 10px 14px;border-top:1px solid #424d5e}.prompt-hint{display:inline-flex;align-items:center;gap:6px;color:#95a1b2;font-size:10px}.send-button{display:grid;place-items:center;width:29px;height:29px;color:#fff;background:var(--blue);border:0;border-radius:7px;transition:transform .15s,opacity .15s}.send-button:hover:not(:disabled){transform:translateY(-1px)}.send-button:disabled{cursor:not-allowed;opacity:.35}.error-message{display:flex;gap:7px;align-items:center;margin-top:-10px;color:#f3a2a2;font-size:11px;line-height:1.4}.suggestions,.agent-log{display:flex;flex-direction:column;gap:8px}.section-label{display:flex;align-items:center;justify-content:space-between;color:#8793a5;font-size:9px;font-weight:700;letter-spacing:.13em}.section-label svg{color:var(--blue)}.suggestion{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;color:#c0c7d2;text-align:left;background:transparent;border:0;border-bottom:1px solid #333d4b;font-size:11px;line-height:1.4}.suggestion:hover{color:#fff}.suggestion svg{flex:0 0 auto;color:#718097}.live-badge{padding:3px 5px;color:#68ca9d;background:#16845b24;border-radius:3px;font-size:8px;letter-spacing:.08em}.empty-log{display:flex;align-items:center;gap:9px;padding:14px 0;color:#7f8a9b;font-size:11px}.agent-step{display:flex;gap:10px;align-items:flex-start;padding:5px 0;color:#8e99a9}.agent-step strong,.agent-step small{display:block}.agent-step strong{font-size:11px;font-weight:500}.agent-step small{margin-top:2px;color:#778295;font-size:10px}.agent-step.done{color:#dce4ed}.agent-step.done .step-icon{color:#5bc295;background:#5bc29524}.agent-step.running{color:#eef3f9}.agent-step.running .step-icon{color:#6ca3f4;background:#6ca3f424}.step-icon{display:grid;place-items:center;width:20px;height:20px;color:#697689;background:#303946;border-radius:50%}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.builder-foot{display:flex;gap:14px;margin-top:auto;padding-top:17px;color:#718096;border-top:1px solid #333d4b;font-size:10px}.builder-foot span{display:inline-flex;align-items:center;gap:5px}.preview-panel{min-width:0;padding:0 28px 28px;background:linear-gradient(#f0f6ff 0,#f8f9fb 185px)}.preview-toolbar{display:flex;align-items:center;gap:15px;height:64px;border-bottom:1px solid rgb(207 216 228 / 75%)}.breadcrumbs{display:flex;align-items:center;gap:8px;min-width:0;color:#8992a0;font-size:11px}.breadcrumbs strong{overflow:hidden;color:#303640;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.breadcrumbs svg{color:#acb5c1}.view-switcher{display:flex;align-items:center;gap:2px;margin-left:auto;padding:3px;background:#ffffffbf;border:1px solid var(--line);border-radius:7px}.view-switcher button{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;color:#8a93a0;background:transparent;border:0;border-radius:5px;font-size:10px}.view-switcher button.active{color:var(--ink);background:#fff;box-shadow:0 1px 3px #10182814}.product-frame{max-width:855px;min-height:510px;margin:27px auto 0;overflow:hidden;background:#fff;border:1px solid #e4e8ee;border-radius:12px;box-shadow:var(--shadow)}.product-topbar{display:flex;justify-content:space-between;align-items:center;height:54px;padding:0 23px;border-bottom:1px solid #eef0f3}.product-brand,.product-meta,.saved-label,.product-footer div{display:flex;align-items:center;gap:9px}.product-brand{color:#252a31;font-size:12px;font-weight:600}.product-logo{display:grid;place-items:center;width:25px;height:25px;color:#fff;border-radius:7px}.product-meta{gap:15px}.saved-label{color:#9aa1ac;font-size:10px}.saved-dot{width:5px;height:5px;box-shadow:none}.product-more{display:grid;place-items:center;color:#949ca7;background:transparent;border:0}.product-content{padding:35px 45px 28px}.product-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.product-hero h2{max-width:470px;margin:0;color:#1c2026;font-size:clamp(23px,3vw,31px);line-height:1.15;letter-spacing:-.055em}.product-hero p:not(.eyebrow){max-width:460px;margin:12px 0 0;color:#737c88;font-size:12px;line-height:1.65}.progress-ring{display:flex;flex-direction:column;align-items:center;justify-content:center;width:77px;height:77px;flex:0 0 auto;border-radius:50%;background:conic-gradient(var(--blue) var(--progress),#e9eef5 0);position:relative}.progress-ring:before{content:"";position:absolute;inset:6px;background:#fff;border-radius:50%}.progress-ring strong,.progress-ring span{position:relative;z-index:1}.progress-ring strong{color:#2c3440;font-family:DM Mono,monospace;font-size:16px;font-weight:500}.progress-ring span{margin-top:1px;color:#9aa3b0;font-size:8px}.product-tabs{display:flex;gap:22px;margin-top:33px;border-bottom:1px solid #edf0f4}.product-tabs button{padding:0 0 11px;color:#9aa1ac;background:transparent;border:0;font-size:11px}.product-tabs button.selected{color:#2e3744;border-bottom:2px solid var(--blue);font-weight:600}.product-tabs span{margin-left:3px;color:#b5bdc8;font-family:DM Mono,monospace;font-size:10px}.task-toolbar{display:flex;align-items:center;justify-content:space-between;margin-top:22px;color:#4a535f;font-size:11px;font-weight:600}.muted{color:#a2aab5;font-weight:400}.add-task,.primary-button,.secondary-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:6px;font-size:11px;font-weight:600}.add-task{padding:7px 10px;color:#fff;background:var(--ink);border:0}.task-list{margin-top:10px;border-top:1px solid #edf0f4}.task-row{display:flex;align-items:center;gap:12px;min-height:61px;border-bottom:1px solid #edf0f4}.task-check{display:grid;place-items:center;width:18px;height:18px;flex:0 0 auto;color:#fff;background:#fff;border:1px solid #c9d0da;border-radius:5px}.task-row.complete .task-check{background:var(--green);border-color:var(--green)}.task-copy{min-width:0;flex:1}.task-copy strong,.task-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.task-copy strong{color:#343b46;font-size:11px;font-weight:600}.task-row.complete .task-copy strong{color:#9ca5b0;text-decoration:line-through}.task-copy span{margin-top:4px;color:#9ca5af;font-size:10px}.priority{padding:4px 7px;border-radius:4px;font-size:9px;font-weight:600;text-transform:capitalize}.priority.high{color:#bb5a52;background:#fff0ef}.priority.medium{color:#a87625;background:#fff6e5}.priority.low{color:#6485a7;background:#eef5fc}.focus-button,.delete-button{display:grid;place-items:center;width:25px;height:25px;color:#a8b0ba;background:transparent;border:0;border-radius:5px}.focus-button:hover{color:var(--blue);background:var(--blue-wash)}.delete-button:hover{color:#cb625e;background:#fff0ef}.no-tasks{padding:25px 0;color:#8d97a4;font-size:11px;text-align:center}.product-footer{display:flex;align-items:center;justify-content:space-between;margin-top:27px;color:#a2aab5;font-size:10px}.mini-avatar{width:19px;height:19px;font-size:8px}.code-view{max-width:855px;min-height:510px;margin:27px auto 0;padding-bottom:28px;overflow:hidden;color:#dce5f0;background:#202630;border:1px solid #303946;border-radius:12px;box-shadow:var(--shadow)}.code-header{display:flex;align-items:center;gap:6px;height:48px;padding:0 18px;border-bottom:1px solid #303946}.window-dot{width:8px;height:8px;border-radius:50%}.window-dot.red{background:#e57d73}.window-dot.yellow{background:#e3bb67}.window-dot.green{background:#6fc08f}.code-file{margin-left:8px;color:#8996a8;font-family:DM Mono,monospace;font-size:10px}.code-view pre{margin:0;padding:35px 40px;color:#b7cdf0;font-family:DM Mono,monospace;font-size:12px;line-height:2;white-space:pre-wrap}.code-note{display:flex;gap:10px;margin:15px 40px 0;padding:13px 15px;color:#a2afc0;background:#2b333f;border:1px solid #424d5e;border-radius:7px;font-size:11px;line-height:1.55}.code-note svg{flex:0 0 auto;color:#6ca3f4}.history-strip{display:flex;gap:30px;align-items:center;padding:24px 28px 28px;background:#fff}.history-title{min-width:145px}.history-title .eyebrow{margin-bottom:4px;color:#59616e}.history-title span:last-child{color:#9ba3ad;font-size:10px}.history-list{display:flex;gap:10px;overflow-x:auto}.history-card{display:flex;align-items:center;gap:9px;min-width:190px;padding:10px 11px;color:#303741;text-align:left;background:#fff;border:1px solid var(--line);border-radius:8px}.history-card:hover,.history-card.selected{border-color:#b9d0f1;box-shadow:0 2px 7px #2f78e514}.history-accent{width:4px;height:27px;border-radius:4px}.history-copy{min-width:0;flex:1}.history-copy strong,.history-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.history-copy strong{font-size:10px}.history-copy small{margin-top:4px;color:#9aa3af;font-size:9px}.history-delete{color:#aab2bd}.history-delete:hover{color:#cb625e}.modal-backdrop{display:grid;place-items:center;padding:20px;background:#0f151e85;position:fixed;inset:0;z-index:10}.focus-modal{width:min(100%,370px);padding:30px;text-align:center;background:#fff;border-radius:15px;box-shadow:0 18px 60px #0003;position:relative}.modal-close{display:grid;place-items:center;width:30px;height:30px;color:#8993a1;background:transparent;border:0;border-radius:6px;position:absolute;top:14px;right:14px}.modal-close:hover{color:var(--ink);background:#f1f3f6}.focus-icon{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 18px;color:var(--blue);background:var(--blue-wash);border-radius:14px}.focus-modal .eyebrow{margin-bottom:8px}.focus-modal h2{margin:0;color:#242a33;font-size:20px;letter-spacing:-.035em}.focus-modal p:not(.eyebrow){margin:10px auto 0;color:#7b8591;font-size:11px;line-height:1.6}.timer{margin:22px 0;color:#232a34;font-family:DM Mono,monospace;font-size:48px;letter-spacing:-.08em}.timer-actions{display:flex;gap:8px;justify-content:center}.primary-button{min-width:115px;padding:10px 14px;color:#fff;background:var(--ink);border:0}.secondary-button{min-width:70px;padding:10px 14px;color:#47505d;background:#f0f2f5;border:0}.focus-caption{display:inline-flex;align-items:center;gap:5px;margin-top:20px;color:#a0a9b4;font-size:10px}@media(max-width:850px){.workspace{grid-template-columns:1fr}.builder-panel{border-right:0;border-bottom:1px solid #303946}.preview-panel{padding:0 16px 22px}.history-strip{align-items:flex-start;flex-direction:column;gap:12px;padding:20px 16px 24px}.history-list{width:100%}}@media(max-width:560px){.topbar{padding:0 16px}.topbar-center{display:none}.builder-panel{padding:25px 18px 20px}.preview-toolbar{gap:8px}.breadcrumbs span,.view-switcher button svg{display:none}.product-content{padding:27px 20px 22px}.product-hero{align-items:flex-start}.progress-ring{width:63px;height:63px}.progress-ring strong{font-size:13px}.product-tabs{gap:15px}.product-tabs button{font-size:10px}.task-row{gap:8px}.priority{display:none}.code-view pre{padding:25px 20px}.code-note{margin:10px 20px 0}.product-footer{align-items:flex-start;flex-direction:column;gap:8px}}