html,body,#root{height:100%;margin:0}body{background:var(--brand-panel);color:var(--foreground);-webkit-font-smoothing:antialiased;overflow:hidden}.studio{grid-template-rows:auto minmax(0,1fr);height:100%;display:grid}.modes{border-block-end:1px solid var(--border);background:var(--card);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.mode{text-align:start;color:var(--muted-foreground);border:0;border-inline-end:1px solid var(--border);font:inherit;cursor:pointer;background:0 0;row-gap:2px;padding:14px 20px 16px;transition:color .2s,background-color .2s;display:grid;position:relative}.mode:last-child{border-inline-end:0}.mode:hover{color:var(--foreground)}.mode:focus-visible{outline:2px solid var(--ring);outline-offset:-2px}.mode{grid-template-columns:36px minmax(0,1fr) auto;align-items:center;column-gap:12px}.mode-t{gap:2px;min-width:0;display:grid}.mode b{font-size:14px;font-weight:600}.mode-t span{font-size:12.5px}.mode-ic{border:1px solid var(--border);width:36px;height:36px;color:var(--muted-foreground);border-radius:10px;place-items:center;transition:background-color .25s,color .25s,border-color .25s;display:grid}.mode[aria-selected=true] .mode-ic{background:var(--brand-mint);color:#1b1519;border-color:#0000}.mode-ask[aria-selected=true] .mode-ic{background:linear-gradient(135deg,#9a7690,#dcc6d4)}.mode-apps{gap:4px;display:flex}.mode-apps img{box-sizing:content-box;background:#fff;border-radius:6px;padding:3px}.mode[aria-selected=true]{animation:1.1s cubic-bezier(.22,1,.36,1) mode-on}.mode[aria-selected=true] .mode-ic{animation:1.1s cubic-bezier(.22,1,.36,1) mode-ic-on}@keyframes mode-on{0%{background-color:color-mix(in oklab, var(--brand-mint) 26%, transparent)}}@keyframes mode-ic-on{0%{box-shadow:0 0 0 0 color-mix(in oklab, var(--brand-mint) 70%, transparent);transform:scale(.85)}40%{transform:scale(1.08)}to{transform:none;box-shadow:0 0 0 12px #0000}}.mode-or{inset-inline-start:0;z-index:2;border:1px solid var(--border);background:var(--card);color:var(--muted-foreground);font:600 11px var(--font-sans);letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:2px 9px;font-style:normal;position:absolute;top:50%;translate:-50% -50%}.mode[aria-selected=true]{color:var(--foreground);background:color-mix(in oklab, var(--brand-surface-2) 70%, transparent)}.mode[aria-selected=true] span{color:var(--muted-foreground)}.mode i{background:var(--accent);transform-origin:0;height:2px;transform:scaleX(var(--p,0));transition:transform .6s cubic-bezier(.2,.7,.2,1);position:absolute;inset-block-end:-1px;inset-inline:0}[dir=rtl] .mode i{transform-origin:100%}.stage{overflow-anchor:none;grid-template-columns:340px minmax(0,1fr);min-height:0;display:grid;overflow:hidden}.canvas-col{grid-template-rows:48px minmax(0,1fr);min-width:0;min-height:0;display:grid;position:relative}.lib{border-inline-end:1px solid var(--border);background:var(--card);flex-direction:column;min-height:0;display:flex}.lib-head{border-block-end:1px solid var(--border);gap:10px;padding:14px 14px 10px;display:grid}.lib-search{border:1px solid var(--input);height:36px;color:var(--muted-foreground);border-radius:8px;align-items:center;gap:8px;padding:0 10px;font-size:13px;display:flex}.lib-body{flex:1;min-height:0;padding:8px 6px;overflow:hidden}.lib-cat{letter-spacing:.08em;text-transform:uppercase;color:var(--muted-foreground);padding:10px 8px 4px;font-size:11px;font-weight:600}.lib-body ul{margin:0;padding:0;list-style:none}.lib-body li button.is-hot{background:color-mix(in oklab, var(--brand-surface-2) 80%, transparent)}.chat{border-inline-end:1px solid var(--border);background:var(--card);flex-direction:column;min-height:0;display:flex}.chat-head{border-block-end:1px solid var(--border);align-items:center;gap:10px;padding:12px 16px;display:flex}.chat-head img{width:22px;height:22px}.chat-title{font-size:14px;font-weight:600}.chat-sub{color:var(--muted-foreground);font-size:12px}.chat-log{overflow-anchor:none;flex-direction:column;flex:1;gap:10px;min-height:0;padding:16px;display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(#0000,#000 40px);mask-image:linear-gradient(#0000,#000 40px)}.chat-log>:first-child{margin-block-start:auto}.msg{border-radius:12px;max-width:94%;padding:10px 12px;font-size:13.5px;line-height:1.5;animation:.35s ease-out backwards rise}.msg.you{background:var(--brand-surface-2);border-end-end-radius:4px;align-self:flex-end}.msg.ai{border:1px solid var(--border);border-end-start-radius:4px;align-self:flex-start}.tool{max-width:100%;font-family:var(--font-numeric);color:var(--brand-mint);background:color-mix(in oklab, var(--brand-mint) 8%, transparent);border:1px solid color-mix(in oklab, var(--brand-mint) 28%, transparent);border-radius:999px;align-self:flex-start;align-items:center;gap:8px;padding:5px 10px;font-size:12px;font-weight:500;animation:.3s ease-out backwards rise;display:inline-flex}.tool.tool-other{color:var(--foreground);background:var(--brand-surface-2);border-color:var(--border)}.tool img{border-radius:4px;width:16px;height:16px}.tool-detail{color:var(--muted-foreground);font-family:var(--font-sans);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.tool .spin{border:2px solid;border-inline-end-color:#0000;border-radius:50%;width:11px;height:11px;animation:.7s linear infinite spin}.msg-card{align-self:stretch;animation:.35s ease-out backwards rise}.divider{color:var(--muted-foreground);align-items:center;gap:10px;font-size:12px;font-weight:500;animation:.3s ease-out backwards rise;display:flex}.divider:before,.divider:after{content:"";background:var(--border);flex:1;height:1px}.typing{align-self:flex-start;gap:4px;padding:12px;display:inline-flex}.typing i{background:var(--muted-foreground);border-radius:50%;width:6px;height:6px;animation:1s infinite blink}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}.hand{z-index:40;pointer-events:none;transform:translate(var(--x,-40px), var(--y,-40px));transition:transform var(--t,.75s) cubic-bezier(.45, 0, .2, 1), opacity .3s;opacity:var(--o,0);position:absolute;inset-block-start:0;inset-inline-start:0}.hand svg{filter:drop-shadow(0 2px 4px #00000080);width:20px;height:20px;transition:transform .15s;display:block}.hand.down svg{transform:scale(.86)}.hand-tag{background:var(--foreground);color:var(--background);white-space:nowrap;border-radius:999px;padding:2px 8px;font-size:11.5px;font-weight:600;position:absolute;inset-block-start:16px;inset-inline-start:16px}.carry{border:1px solid var(--border);background:var(--card);width:220px;box-shadow:var(--shadow-lift);border-radius:12px;align-items:center;gap:10px;padding:8px 10px;font-size:13px;font-weight:500;animation:.2s ease-out backwards rise;display:flex;position:absolute;inset-block-start:22px;inset-inline-start:10px}.pull{z-index:30;pointer-events:none;position:absolute;inset:0;overflow:visible}.pull path{fill:none;stroke:var(--accent);stroke-width:2px;stroke-dasharray:var(--len);stroke-dashoffset:var(--len);animation:.75s cubic-bezier(.45,0,.2,1) forwards pull}.rate-pop{z-index:35;border:1px solid var(--border);background:var(--card);box-shadow:var(--shadow-lift);white-space:nowrap;border-radius:12px;align-items:center;gap:8px;padding:8px 10px;font-size:12.5px;animation:.2s ease-out backwards rise;display:flex;position:absolute;transform:translate(-50%,calc(-100% - 14px))}.rate-pop .field{border:1px solid var(--ring);min-width:64px;height:30px;font-family:var(--font-numeric);color:var(--foreground);border-radius:8px;align-items:center;padding:0 8px;display:inline-flex}.rate-pop .caret{background:var(--foreground);width:1px;height:14px;margin-inline-start:1px;animation:1s step-end infinite blink}.drawn-by-ai .react-flow__node.is-new{outline:2px solid var(--accent);outline-offset:4px;border-radius:18px}.by-ai{z-index:20;border:1px solid var(--border);background:var(--card);color:var(--muted-foreground);border-radius:999px;align-items:center;gap:8px;padding:6px 10px;font-size:12px;animation:.3s ease-out backwards rise;display:inline-flex;position:absolute;inset-block-start:60px;inset-inline-end:16px}.by-ai i{width:8px;height:8px;box-shadow:0 0 0 2px var(--accent);border-radius:50%}.ai-done{z-index:25;border:1px solid color-mix(in oklab, var(--success) 45%, transparent);background:color-mix(in oklab, var(--card) 92%, transparent);color:var(--muted-foreground);white-space:nowrap;border-radius:999px;align-items:center;gap:12px;padding:10px 18px 10px 10px;font-size:14px;animation:.45s cubic-bezier(.22,1,.36,1) both done-in;display:inline-flex;position:absolute;bottom:28px;left:50%;translate:-50%;box-shadow:0 18px 40px -18px #000000b3}.ai-done b{color:var(--foreground);font-weight:600}.ai-done-check{background:var(--success);color:#0b2a1f;border-radius:50%;place-items:center;width:30px;height:30px;animation:.5s cubic-bezier(.34,1.56,.64,1) .1s both done-pop;display:grid}@keyframes done-in{0%{opacity:0;translate:-50% 10px}}@keyframes done-pop{0%{transform:scale(.3)}}@keyframes pull{to{stroke-dashoffset:0}}@keyframes blink{0%,to{opacity:.25}50%{opacity:1}}@keyframes rise{0%{opacity:0;transform:translateY(6px)}}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:1023px){.stage{grid-template-columns:290px minmax(0,1fr)}.mode{padding:12px 14px 14px}}@media (max-width:767px){.stage{grid-template-rows:minmax(0,1fr) 300px;grid-template-columns:minmax(0,1fr)}.stage>.lib,.stage>.chat{border-inline-end:0;border-block-start:1px solid var(--border);order:2}.mode{grid-template-columns:30px minmax(0,1fr);column-gap:8px;padding:10px 10px 12px}.mode-ic{width:30px;height:30px}.mode-t span,.mode-apps{display:none}.mode b{font-size:13px}.carry{width:180px}}@media (prefers-reduced-motion:reduce){.hand,.mode i{transition:none}.mode[aria-selected=true],.mode[aria-selected=true] .mode-ic{animation:none}}.mode[aria-selected=true] b{color:var(--foreground)}.mode+.mode{padding-inline-start:34px}@media (max-width:767px){.mode+.mode{padding-inline-start:26px}}