:root{color-scheme:dark;--bg:#090c11;--surface:#11161e;--line:#252d39;--text:#f5f7fb;--muted:#9aa5b6;--accent:#a99fff;--good:#42d49a;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-size:14px}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.6}a{color:inherit}button:focus-visible,a:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}
.topbar{height:76px;padding:0 30px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{text-decoration:none;font-size:21px;font-weight:750;letter-spacing:-.7px}.brand span{color:var(--accent);margin-left:4px}.mode{font-size:12px;color:var(--muted)}
.workspace{display:grid;grid-template-columns:235px minmax(350px,1fr) minmax(280px,.85fr);min-height:calc(100dvh - 76px);max-width:1800px;margin:auto}.project{padding:32px 24px;display:flex;flex-direction:column;border-right:1px solid var(--line)}.section-label{font-size:10px;letter-spacing:1.6px;font-weight:750;color:var(--muted)}h1{font-size:24px;line-height:1.22;letter-spacing:-.7px;margin:12px 0 16px}h2{font-size:17px;font-weight:650;letter-spacing:-.3px;margin:0}h3{font-size:16px}.subtle{font-size:13px;color:var(--muted);line-height:1.7;margin:0 0 25px}.site-link{display:flex;justify-content:space-between;text-decoration:none;color:var(--accent);padding:10px 0;border-bottom:1px solid var(--line);font-size:13px;font-weight:600}.permission{margin-top:34px}.permission h2{margin-top:12px;font-size:14px}.permission ul{padding:0;list-style:none;margin:15px 0}.permission li{padding:6px 0;font-size:12px;line-height:1.5;color:#b7c1d0}.permission li:before{content:"✓";color:var(--good);margin-right:8px}.limit{font-size:12px;color:var(--muted);line-height:1.7}.project-footer{margin-top:auto;padding-top:40px}.project-footer p{font-size:12px;line-height:1.7;color:var(--muted)}.text-button{padding:7px 0;color:var(--muted);border:0;background:none;font-size:12px;line-height:1.4}.text-button:hover{color:var(--text)}
.conversation{padding:30px 30px 22px;display:flex;flex-direction:column;min-width:0}.chat-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-bottom:22px;border-bottom:1px solid var(--line)}.chat-heading p{color:var(--muted);font-size:12px;line-height:1.6;margin:8px 0 0}.chat-heading>div{min-width:0}.connection{flex-shrink:0;white-space:nowrap;font-size:10px;color:var(--good);line-height:1.6;max-width:95px;text-align:right}.timeline{flex:1;padding:24px 0;overflow-wrap:anywhere}.job{margin:0 0 26px}.user-message{background:#1a2030;padding:15px 17px;border-radius:12px 12px 3px 12px;white-space:pre-wrap;line-height:1.65;margin-left:28px}.reply{margin-top:16px;line-height:1.7;white-space:pre-wrap;font-size:13px;color:#d7dfed}.reply-author{color:var(--accent);font-size:11px;font-weight:700;letter-spacing:.3px;margin:16px 0 6px}.job-meta{display:flex;gap:12px;align-items:center;margin-top:9px;font-size:11px;color:var(--muted)}.job-meta a{color:var(--good);text-decoration:none}.job-state.running{color:var(--good)}.job-state.failed,.job-state.blocked{color:#ff9bb0}.cancel{border:0;background:none;padding:4px 0;color:#ff9bb0;font-size:11px}.examples{padding:20px 0 26px}.examples p{font-size:12px;color:var(--muted);margin:0 0 14px}.example{display:block;width:100%;border:0;border-top:1px solid var(--line);text-align:left;background:none;color:#c3cbd9;font-size:12px;line-height:1.6;padding:14px 0}.example:hover{color:var(--text)}
.composer{margin-top:12px;position:sticky;bottom:16px;background:var(--surface);border:1px solid #343d50;border-radius:14px;box-shadow:0 6px 35px #0003}.composer textarea{display:block;resize:vertical;min-height:95px;max-height:300px;width:100%;border:0;background:transparent;color:var(--text);padding:18px 18px 8px;font-size:14px;line-height:1.65;border-radius:14px}.composer textarea::placeholder{color:#8995a8}.composer textarea:focus{outline:0}.composer:focus-within{border-color:var(--accent)}.composer-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px}.composer-bottom>span{font-size:10px;color:var(--muted);line-height:1.5}.primary{background:#a99fff;color:#121023;font-size:12px;font-weight:750;border:0;border-radius:8px;padding:11px 14px;white-space:nowrap}.primary:hover{background:#bfb7ff}.primary span{margin-left:12px}.error{color:#ff9bb0;font-size:12px;line-height:1.6;padding:0 16px}.error:empty{display:none}
.preview{border-left:1px solid var(--line);display:flex;flex-direction:column;padding:30px 20px 22px;min-width:0;background:#0c1017}.preview-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.preview-heading h2{font-size:14px}.preview-empty{display:flex;flex:1;justify-content:center;align-items:center;flex-direction:column;min-height:400px;text-align:center;padding:24px}.preview-empty>span{font-size:40px;color:#424b60;font-weight:300}.preview-empty h3{font-weight:550;margin:20px 0 8px}.preview-empty p{color:var(--muted);font-size:12px;line-height:1.8;max-width:220px}.preview iframe{border:1px solid var(--line);border-radius:10px;min-height:600px;flex:1;width:100%;background:white}.welcome{max-width:470px;margin:15vh auto;padding:24px}.welcome h1{font-size:38px;letter-spacing:-1.5px}.welcome p{color:var(--muted);line-height:1.8}.mark{font-size:28px;font-weight:700;color:var(--accent)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@media(min-width:1450px){.conversation{padding-left:45px;padding-right:45px}}@media(max-width:1150px){.workspace{grid-template-columns:210px minmax(350px,1fr)}.preview{grid-column:1/-1;border-top:1px solid var(--line);border-left:0;min-height:500px}.preview iframe{min-height:650px}.project{padding:28px 20px}.preview-empty{min-height:250px}}
@media(max-width:650px){.topbar{height:64px;padding:0 18px}.brand{font-size:19px}.mode{font-size:10px}.workspace{display:flex;flex-direction:column;min-height:calc(100dvh - 64px)}.project{padding:22px 20px;border-right:0;border-bottom:1px solid var(--line);display:block}.project h1{font-size:22px;margin:8px 0 12px}.project .subtle,.project-footer{display:none}.site-link{border:0;padding:6px 0}.permission{margin-top:18px;border-top:1px solid var(--line);padding-top:16px}.permission ul{margin:8px 0}.permission li{display:inline;font-size:11px;margin-right:10px;line-height:2}.permission h2{font-size:12px;display:inline;margin-left:10px}.permission .section-label{display:inline}.limit{font-size:10px;margin:10px 0 0}.conversation{padding:24px 20px}.chat-heading{gap:8px}.chat-heading h2{font-size:20px}.timeline{padding:22px 0}.composer{position:relative;bottom:auto}.composer textarea{font-size:16px;min-height:100px}.composer-bottom{align-items:center}.composer-bottom>span{max-width:110px;font-size:9px}.primary{padding:12px 10px;font-size:11px}.user-message{margin-left:15px;font-size:13px}.preview{padding:24px 20px}.preview iframe{min-height:650px}.preview-empty{min-height:250px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}