.agent-studio{--studio-blue:#2548ed;--studio-blue-soft:#e9eeff;--studio-ink:#182752;--studio-peach:#ffc5ab;max-width:1400px;margin:auto}
.studio-header{display:flex;align-items:center;gap:20px;padding:8px 0 30px;border-bottom:1px solid var(--border);margin-bottom:28px}
.studio-header h2{font:700 clamp(21px,2.2vw,30px)/1.18 'Trebuchet MS','Segoe UI',sans-serif;letter-spacing:-.7px;max-width:600px}
.studio-header p{color:var(--text-2);margin:10px 0 0;max-width:64ch}
.studio-agent-avatar{width:64px;height:72px;flex-shrink:0;display:grid;place-items:center;background:var(--studio-blue);color:white;font:700 36px/1 'Trebuchet MS',sans-serif;border-radius:26px 26px 12px 12px;position:relative}
.studio-agent-avatar span{position:absolute;bottom:7px;right:-4px;width:16px;height:16px;border-radius:50%;background:var(--studio-peach);border:3px solid var(--surface)}
.studio-header-actions{display:flex;flex-wrap:wrap;gap:10px;margin-left:auto;justify-content:flex-end}
.studio-layout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:30px;align-items:start}
.studio-tabs{position:sticky;top:20px;display:flex;flex-direction:column;gap:5px}
.studio-tabs button{display:block;position:relative;border:0;border-left:3px solid transparent;text-align:left;padding:15px 28px 15px 15px;background:transparent;color:var(--text-2);font:inherit;cursor:pointer;border-radius:0 7px 7px 0}
.studio-tabs button span{display:block;font-size:15px;font-weight:650}.studio-tabs button small{display:block;margin-top:3px;font-size:12px}
.studio-tabs button.is-current{background:var(--accent-soft);border-left-color:var(--studio-blue);color:var(--accent)}
.studio-tabs em{position:absolute;right:10px;top:17px;font-style:normal;font-size:11px;font-weight:700}
.studio-tabs>p{font-size:12px;color:var(--text-2);padding:15px;line-height:1.7;max-width:28ch}
.studio-editor{min-width:0}.studio-editor .card{padding:28px;box-shadow:none}.studio-editor .card-head{margin-bottom:26px}.studio-editor .card h2,.studio-section-heading h2{font-size:21px;letter-spacing:-.4px}.studio-editor .form-grid{gap:20px}.studio-editor label{line-height:1.5}.studio-editor .hint{color:var(--text-2);font-size:12px;font-weight:400}.studio-editor textarea{line-height:1.6}
.studio-preset{display:flex;flex-wrap:wrap;align-items:end;gap:14px;background:var(--accent-soft);padding:20px;border-radius:8px;margin-bottom:28px}.studio-preset label{flex:1;min-width:180px}.studio-preset p{width:100%;font-size:12px;margin:0;color:var(--text-2)}
.studio-savebar{position:sticky;bottom:0;z-index:3;border:1px solid var(--border);padding:16px;background:var(--surface);box-shadow:0 -4px 12px #00000005;align-items:center;margin-top:12px}.studio-savebar>span{margin-right:auto;font-size:12px;color:var(--text-2)}
.studio-guide{border:1px solid var(--border);background:var(--surface);padding:28px;margin-bottom:30px;border-radius:12px}.studio-guide h3{font-size:20px}.studio-guide p{color:var(--text-2);font-size:13px;max-width:70ch}.studio-guide-steps{list-style:none;padding:0;margin:26px 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.studio-guide-steps li{display:flex;gap:12px}.studio-step{flex-shrink:0;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);font-size:12px;color:var(--text-2)}.studio-step.is-done{background:var(--accent-soft);color:var(--accent)}.studio-guide-steps strong{font-size:14px}.studio-guide-steps p{margin:8px 0}.studio-guide-steps a,.studio-guide-steps button{font-size:12px;display:inline-block;margin:2px 6px 0 0}
.studio-guide-example{background:var(--studio-blue);padding:22px;border-radius:10px;display:flex;align-items:center;gap:20px;color:white;font-size:13px}.studio-example-customer,.studio-example-agent{padding:13px 17px;border-radius:12px;max-width:290px}.studio-example-customer{background:var(--studio-peach);color:var(--studio-ink);border-bottom-right-radius:2px}.studio-example-agent{background:white;color:var(--studio-ink);border-bottom-left-radius:2px}.studio-example-result{max-width:220px}
.studio-section-heading{display:flex;align-items:start;justify-content:space-between;gap:20px;margin:0 0 24px}.studio-section-heading p{max-width:62ch;color:var(--text-2);margin:12px 0 0;line-height:1.65}.studio-section-heading .btn{white-space:normal;flex-shrink:0;max-width:190px}
.studio-note{background:var(--accent-soft);border-left:3px solid var(--accent);padding:16px 18px;color:var(--text-2);line-height:1.7;font-size:13px;margin:18px 0 24px}
.studio-service,.studio-learning{padding:22px 0;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--border)}.studio-service h3,.studio-learning h3{font-size:17px;margin:10px 0 6px}.studio-service p,.studio-learning p{color:var(--text-2);margin:8px 0;line-height:1.65;max-width:70ch}.studio-service .toolbar,.studio-learning .toolbar{justify-content:flex-end;flex-wrap:wrap;min-width:135px}.studio-service .status-label,.studio-learning .status-label{font-size:11px}.studio-learning{align-items:start}.studio-learning small{color:var(--text-2);font-size:11px}.studio-learning.is-paused{opacity:.7}
.studio-toggle{flex-direction:row;align-items:start;gap:12px;background:var(--surface);padding:22px;border:1px solid var(--border);border-radius:8px;color:var(--text)}.studio-toggle input{width:18px;height:18px;margin-top:4px}.studio-toggle strong{display:block;font-size:15px}.studio-toggle small{display:block;font-size:12px;font-weight:400;color:var(--text-2);margin-top:5px;max-width:70ch}
.studio-learning-status{display:flex;gap:20px;flex-wrap:wrap;font-size:12px;color:var(--text-2);margin:22px 0}.studio-learning-status strong{color:var(--text)}.studio-empty{padding:35px 24px;border:1px dashed var(--border);border-radius:8px;margin-top:20px}.studio-empty h3{font-size:18px}.studio-empty p{max-width:65ch;color:var(--text-2);line-height:1.7}
.studio-question{display:grid;grid-template-columns:1fr 1fr;gap:14px;border-bottom:1px solid var(--border);padding:22px 0}.studio-question .full{grid-column:1/-1}.studio-question textarea{min-height:70px}.studio-question>button{justify-self:end}.studio-response{padding:20px 0;border-bottom:1px solid var(--border)}.studio-response h3{font-size:16px}.studio-response p{color:var(--text-2);font-size:12px}.studio-response dt{font-weight:600;margin-top:12px}.studio-response dd{margin:4px 0 12px;color:var(--text-2);white-space:pre-wrap}.studio-source{border-left:3px solid var(--accent);padding:12px 18px;margin:20px 0;background:var(--surface-2)}.studio-source p{white-space:pre-wrap;line-height:1.6}.studio-source small{color:var(--text-2)}
@media(max-width:1150px){.studio-header{flex-wrap:wrap}.studio-header-actions{margin-left:84px;justify-content:flex-start}.studio-layout{grid-template-columns:180px minmax(0,1fr);gap:20px}.studio-guide-steps{grid-template-columns:1fr 1fr}.studio-guide-example{flex-wrap:wrap}.studio-section-heading{flex-direction:column}.studio-service,.studio-learning{flex-direction:column;align-items:start}.studio-service .toolbar,.studio-learning .toolbar{justify-content:flex-start}}
@media(max-width:760px){.studio-header{gap:14px}.studio-header h2{font-size:22px;max-width:250px}.studio-header p{font-size:12px}.studio-header-actions{margin:0;width:100%}.studio-agent-avatar{width:48px;height:58px;font-size:28px}.studio-layout{grid-template-columns:1fr;gap:16px}.studio-tabs{position:static;display:flex;flex-direction:row;overflow-x:auto;gap:4px;padding-bottom:8px}.studio-tabs button{flex-shrink:0;padding:12px 15px;border-left:0;border-bottom:3px solid transparent;border-radius:6px 6px 0 0}.studio-tabs button.is-current{border-bottom-color:var(--studio-blue)}.studio-tabs button small,.studio-tabs em,.studio-tabs>p{display:none}.studio-tabs button span{font-size:13px}.studio-editor .card{padding:20px}.studio-editor .form-grid{grid-template-columns:1fr;gap:18px}.studio-savebar{position:static;justify-content:stretch;padding:14px}.studio-savebar>span{width:100%}.studio-savebar .btn{flex:1;font-size:12px;white-space:normal}.studio-guide{padding:20px}.studio-guide-steps{grid-template-columns:1fr}.studio-guide-example{padding:16px;gap:12px}.studio-example-result{max-width:none}.studio-preset{padding:16px}.studio-preset .btn{width:100%}.studio-question{grid-template-columns:1fr}.studio-section-heading h2{font-size:22px}.studio-learning-status{gap:12px}.studio-learning-status span{width:100%}}
@media(prefers-reduced-motion:no-preference){.studio-tabs button{transition:background .15s,border-color .15s}}
