.ai-studio{width:100%;max-width:min(100%,440px);border-radius:22px;border:1px solid rgba(255,255,255,.1);background:linear-gradient(180deg,rgba(22,16,36,.96),rgba(10,8,18,.98));box-shadow:0 28px 70px rgba(0,0,0,.45);padding:16px 16px 14px;box-sizing:border-box;display:flex;flex-direction:column;min-width:0;overflow:visible}.ai-studio-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:12px}.ai-studio-kicker{margin:0 0 3px;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(196,181,253,.9)}.ai-studio-title{margin:0;font-family:var(--font-display),var(--font-manrope),sans-serif;font-size:clamp(15px,1.8vw,18px);font-weight:650;letter-spacing:-.02em;color:#fff;line-height:1.3;overflow-wrap:anywhere}.ai-studio-chip{display:inline-flex;align-items:center;gap:5px;flex-shrink:0;padding:5px 9px;border-radius:999px;border:1px solid rgba(34,211,238,.35);background:rgba(34,211,238,.1);color:#67e8f9;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}.ai-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}.ai-tab{padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);color:rgba(255,255,255,.55);font-size:10px;font-weight:650;cursor:pointer;transition:all .2s ease;max-width:100%;white-space:nowrap}.ai-tab:hover{color:#fff;border-color:rgba(167,139,250,.35)}.ai-tab.is-active{color:#fff;border-color:rgba(167,139,250,.55);background:rgba(139,92,246,.18)}.ai-prompt{border-radius:14px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);padding:10px 12px;margin-bottom:10px;min-width:0}.ai-prompt-label{display:block;margin-bottom:6px;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.4)}.ai-prompt p{margin:0;font-size:13px;line-height:1.45;color:rgba(255,255,255,.88);overflow-wrap:break-word;word-break:break-word}.ai-flow{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:10px}.ai-flow-item{min-width:0}.ai-flow-item,.ai-step{display:inline-flex;align-items:center;gap:6px}.ai-step{padding:7px 10px;border-radius:11px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);color:rgba(255,255,255,.45);transition:border-color .25s ease,background .25s ease,color .25s ease}.ai-step strong{font-size:11px;font-weight:650;white-space:nowrap}.ai-step--done{border-color:rgba(167,139,250,.35);background:rgba(139,92,246,.12);color:#ddd6fe}.ai-step--active{border-color:rgba(34,211,238,.5);background:rgba(34,211,238,.12);color:#a5f3fc;box-shadow:0 0 0 3px rgba(34,211,238,.1)}.ai-flow-line{width:12px;height:2px;border-radius:2px;background:rgba(255,255,255,.12);flex-shrink:0}.ai-flow-line.is-on{background:linear-gradient(90deg,#a78bfa,#22d3ee)}.ai-output{border-radius:14px;border:1px solid rgba(167,139,250,.28);background:linear-gradient(160deg,rgba(139,92,246,.12),rgba(255,255,255,.02));padding:11px 12px;margin-bottom:10px;min-height:108px;min-width:0}.ai-output-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;min-width:0}.ai-output-top span{font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(196,181,253,.85);flex-shrink:0}.ai-output-top em{font-style:normal;font-family:var(--font-mono),ui-monospace,monospace;font-size:10px;color:rgba(255,255,255,.45);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ai-output p{margin:0;font-size:13px;line-height:1.5;color:rgba(255,255,255,.86);overflow-wrap:break-word;word-break:break-word}.ai-thinking{display:inline-flex;align-items:center;gap:6px;color:rgba(255,255,255,.5);padding-top:8px}.ai-thinking span{width:6px;height:6px;border-radius:50%;background:#a78bfa;animation:ai-bounce 1s ease-in-out infinite;flex-shrink:0}.ai-thinking span:nth-child(2){animation-delay:.15s;background:#e879f9}.ai-thinking span:nth-child(3){animation-delay:.3s;background:#22d3ee}.ai-thinking em{font-style:normal;font-size:12px;margin-left:4px}.ai-caps{display:flex;flex-wrap:wrap;gap:6px}.ai-cap{padding:4px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);font-family:var(--font-mono),ui-monospace,monospace;font-size:10px;color:rgba(255,255,255,.55);cursor:pointer;transition:all .2s ease}.ai-cap:hover{color:#fff;border-color:rgba(167,139,250,.4)}.ai-cap.is-active{color:#fff;border-color:rgba(34,211,238,.5);background:rgba(34,211,238,.12)}.ai-caret{display:inline-block;width:2px;height:.9em;margin-left:2px;vertical-align:-.1em;background:#22d3ee;animation:ai-blink .8s step-end infinite}@keyframes ai-blink{50%{opacity:0}}@keyframes ai-bounce{0%,80%,to{transform:translateY(0);opacity:.5}40%{transform:translateY(-4px);opacity:1}}@media (max-width:1023px){.ai-studio{max-width:100%}}@media (max-width:639px){.ai-studio{padding:14px 12px 12px}.ai-flow-line,.ai-studio-chip{display:none}.ai-output{min-height:100px}.ai-output p,.ai-prompt p{font-size:12.5px}}@media (min-width:1024px) and (max-height:820px){.ai-studio{padding:12px 14px 10px}.ai-prompt{margin-bottom:8px;padding:8px 10px}.ai-output{min-height:96px;padding:9px 10px}.ai-flow,.ai-output,.ai-tabs{margin-bottom:8px}.ai-studio-title{font-size:15px}}@media (prefers-reduced-motion:reduce){.ai-caret,.ai-thinking span{animation:none}}