:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#edf2f4;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#090b0f;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:linear-gradient(#090b0feb,#090b0f),repeating-linear-gradient(90deg,#ffffff06 0 1px,#0000 1px 72px);min-width:320px;min-height:100vh;margin:0}button,textarea,input,select{font:inherit}button{color:#edf2f4;cursor:pointer;background:#171b21;border:1px solid #edf2f424;border-radius:7px;min-height:38px}button:hover:not(:disabled),a:hover{border-color:#7bd3ea99}button:disabled{cursor:not-allowed;opacity:.52}a{color:inherit}.chatApp{grid-template-rows:auto 1fr;min-height:100vh;display:grid}.chatApp.active{height:100vh;overflow:hidden}.chatHeader{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#090b0fe6;border-bottom:1px solid #edf2f417;justify-content:space-between;align-items:center;gap:16px;height:56px;padding:0 24px;display:flex}.brandMark{color:#edf2f4;font-size:16px;font-weight:760;text-decoration:none}.chatHeader>span{color:#94a3ad;font-size:13px}.headerActions,.authControls{align-items:center;gap:8px;display:flex}.billingControls{align-items:center;gap:8px;min-width:fit-content;display:flex}.billingControls span{color:#c9d3db;white-space:nowrap;font-size:12px}.billingControls button{color:#101419;background:#f3d56b;border-color:#f3d56b;grid-auto-flow:column;place-items:center;gap:7px;min-height:32px;padding:0 10px;display:inline-grid}.authControls{min-width:fit-content}.authControls .authAction{color:#c3cbd2;background:#171b21d6;min-height:32px;padding:0 11px}.authControls .authAction.primary{color:#101419;background:#7bd3ea;border-color:#7bd3ea}.authControls.disabled{color:#7f8a94;font-size:12px}.landingChat{align-content:center;gap:20px;width:min(860px,100% - 32px);min-height:calc(100vh - 56px);margin:0 auto;padding:32px 0 84px;display:grid}.landingTitle{text-align:center;justify-items:center;gap:12px;display:grid}.landingTitle svg{color:#f3d56b}.landingTitle h1{letter-spacing:0;margin:0;font-size:clamp(34px,7vw,68px);line-height:1}.composer{background:#10141a;border:1px solid #edf2f424;border-radius:8px;gap:10px;padding:10px;display:grid;box-shadow:0 18px 60px #0000003d}.composer.compact{box-shadow:none}.modelSelector{gap:8px;min-width:0;padding:0 2px;display:grid}.modelInputRow,.modelCatalogRow{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;min-width:0;display:grid}.modelSelector label{color:#94a3ad;font-size:12px}.modelSelector input,.modelSelector select{color:#edf2f4;background:#0c1015;border:1px solid #edf2f41f;border-radius:7px;outline:0;min-width:0;height:34px;padding:0 10px}.modelSelector input:focus,.modelSelector select:focus{border-color:#7bd3ea9e}.modelSelector span{color:#7bd3ea;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:12px;overflow:hidden}.modelChips{scrollbar-width:none;gap:6px;min-width:0;display:flex;overflow-x:auto}.modelChips::-webkit-scrollbar{display:none}.modelChips button{color:#c3cbd2;text-overflow:ellipsis;white-space:nowrap;background:#171b21d6;flex:none;max-width:150px;min-height:28px;padding:0 10px;overflow:hidden}.modelChips button.selected{color:#101419;background:#7bd3ea;border-color:#7bd3ea}.reasoningSelector{grid-template-columns:auto minmax(0,180px) auto;align-items:center;gap:8px;min-width:0;padding:0 2px;display:grid}.reasoningSelector label{color:#94a3ad;font-size:12px}.reasoningSelector select{color:#edf2f4;background:#0c1015;border:1px solid #edf2f41f;border-radius:7px;outline:0;min-width:0;height:32px;padding:0 9px}.reasoningSelector span{color:#f3d56b;font-size:12px}.composerInput{grid-template-columns:1fr auto;gap:10px;display:grid}.composer textarea{resize:vertical;color:#edf2f4;background:0 0;border:0;outline:0;width:100%;min-height:112px;max-height:260px;padding:8px;line-height:1.5}.composer.compact textarea{min-height:52px;max-height:150px}.composer button{color:#101419;background:#7bd3ea;border-color:#7bd3ea;align-self:end;place-items:center;width:44px;height:44px;padding:0;display:inline-grid}.composer .modelChips button{color:#c3cbd2;background:#171b21d6;border-color:#edf2f424;width:auto;height:28px;min-height:28px;padding:0 10px}.composer .modelChips button.selected{color:#101419;background:#7bd3ea;border-color:#7bd3ea}.promptChips{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.promptChips button{color:#c3cbd2;background:#171b21d6;min-height:34px;padding:0 12px}.chatShell{grid-template-rows:1fr auto auto;min-height:0;display:grid}.transcript,.shareTranscript{flex-direction:column;gap:22px;width:min(1040px,100%);min-height:0;margin:0 auto;padding:28px 18px;display:flex;overflow-y:auto}.shareTranscript{overflow:visible}.message{display:flex}.message.user{justify-content:flex-end}.message.assistant{justify-content:flex-start}.textBubble,.statusBubble,.shaderBubble{border-radius:8px}.textBubble{background:#1a2028;border:1px solid #edf2f41a;width:fit-content;max-width:min(680px,88%);padding:12px 14px;line-height:1.5}.statusBubble{color:#cbd4dc;background:#11161d;border:1px solid #edf2f41a;align-items:center;gap:10px;min-height:42px;padding:11px 13px;display:inline-flex}.statusBubble.failed{color:#ffb5b5;background:#631c1c42;border-color:#ff9f9f59;align-items:flex-start}.statusBubble strong{margin-bottom:6px;display:block}.shaderMessage{width:100%}.shaderBubble{background:#10141a;border:1px solid #edf2f41f;width:min(920px,100%);overflow:hidden}.shaderMeta{color:#aeb8c0;border-bottom:1px solid #edf2f41a;justify-content:space-between;align-items:center;gap:12px;height:42px;padding:0 12px;font-size:13px;display:flex}.shaderModel{color:#c7d0d7;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-weight:650;overflow:hidden}.shaderActions{flex:none;align-items:center;gap:6px;display:flex}.shaderActions button,.shaderActions a,.forkButton{background:#171b21;border:1px solid #edf2f424;border-radius:7px;place-items:center;width:34px;height:34px;padding:0;text-decoration:none;display:inline-grid}.forkButton{grid-auto-flow:column;gap:8px;width:auto;padding:0 12px}.canvasShell{background:#05070a;height:clamp(360px,58vh,640px);position:relative}.shaderCanvas{touch-action:none;width:100%;height:100%;display:block}.canvasError{color:#ff9f9f;text-align:center;place-items:center;display:grid;position:absolute;inset:16px}.sourceDetails{border-top:1px solid #edf2f41a}.sourceDetails summary{color:#aeb8c0;cursor:pointer;align-items:center;gap:8px;min-height:38px;padding:0 12px;display:flex}pre{white-space:pre-wrap;word-break:break-word;color:#e6edf3;margin:0;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:12px;line-height:1.45;overflow:auto}.sourceDetails pre{background:#0d1117;max-height:280px;padding:12px}.statusBubble pre{max-width:min(760px,80vw)}.composerDock{background:#090b0feb;border-top:1px solid #edf2f417;padding:14px 18px 18px}.composerDock .composer{width:min(1040px,100%);margin:0 auto}.errorBanner{color:#ffb5b5;background:#631c1c42;border:1px solid #ff9f9f59;border-radius:8px;width:min(1040px,100% - 36px);margin:0 auto 12px;padding:10px 12px}.loading{color:#aab4bd;width:min(1040px,100% - 36px);margin:32px auto}.compilerStage{opacity:0;pointer-events:none;width:64px;height:64px;position:fixed;top:0;left:-10000px;overflow:hidden}.compilerStage .canvasShell{width:64px;height:64px;min-height:0}.spin{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=720px){.chatHeader{padding:0 14px}.chatHeader>span,.billingControls span{display:none}.modelInputRow{grid-template-columns:auto minmax(0,1fr)}.modelInputRow span{display:none}.modelCatalogRow{grid-template-columns:auto minmax(0,1fr)}.modelCatalogRow span{display:none}.reasoningSelector{grid-template-columns:auto minmax(0,1fr)}.reasoningSelector span{display:none}.landingChat{width:min(100% - 24px,860px);padding-bottom:42px}.landingTitle h1{font-size:36px}.transcript,.shareTranscript{padding:18px 12px}.composerDock{padding:10px 10px 12px}.canvasShell{height:360px}.textBubble{max-width:92%}}
