:root{--bot-muted:var(--text-muted,#85858f);--bot-line:var(--border,#36363e);--bot-surface:var(--surface,#1b1b21);--bot-radius:12px;--bot-backdrop:rgba(0,0,0,.65)}
body{grid-template-rows:auto auto minmax(0,1fr);cursor:default}
html:not([data-bot-ready=true]) body,html:not([data-bot-ready=true]) body *{visibility:hidden}
.demo-header .process-nav select{max-width:440px}.demo-header .process-nav{flex:1;min-width:0}.demo-header .bot-intro{width:100%}.demo-header .bot-intro label{flex:1}.demo-header .bot-intro select{flex:1}.demo-header .demo-actions{width:100%;justify-content:flex-end}#bot-controls{display:none}
.bot-intro{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:0}
.bot-intro label{display:flex;align-items:center;gap:8px;font-size:14px;min-width:0}
.bot-intro select,.bot-intro button,.bot-dialog button,.bot-dialog input{font:inherit;color:inherit;border:1px solid var(--bot-line);border-radius:8px;background:transparent;padding:8px 12px;cursor:pointer}
.bot-intro select{max-width:460px;min-width:200px;white-space:normal}
.bot-intro option{background:var(--bot-surface);color:var(--demo-text)}
.bot-summary{display:flex;justify-content:space-between;align-items:center;gap:8px 16px;flex-wrap:wrap;padding:10px 28px;border-bottom:1px solid var(--bot-line);font-size:13px;line-height:1.5}
.bot-summary .shape-legend{position:static;pointer-events:auto;padding:0;margin-left:auto;gap:12px;background:transparent}
.bot-summary p{margin:0;max-width:1000px}.bot-summary>span{color:var(--bot-muted);white-space:nowrap}
.process-nav{flex-wrap:wrap;gap:12px}.shape-legend{flex-wrap:wrap}
.bot-dialog{width:min(760px,calc(100% - 32px));max-height:85dvh;background:var(--bot-surface);color:var(--demo-text);border:1px solid var(--bot-line);border-radius:var(--bot-radius);padding:24px;overflow:auto}
.bot-dialog::backdrop{background:var(--bot-backdrop)}
.bot-dialog-top{display:flex;justify-content:space-between;gap:20px;align-items:center}.bot-dialog-top h2{font-size:24px;line-height:1.25;margin:0}.bot-dialog-top button{font-size:24px}
.bot-dialog-body{line-height:1.6;font-size:15px}.bot-dialog-body h3{font-size:17px;margin:24px 0 8px}.bot-dialog-body p{margin:0 0 12px}.bot-dialog input{width:100%;margin:18px 0 12px;box-sizing:border-box;cursor:text}
.bot-step{display:flex;flex-direction:column;text-align:left;width:100%;gap:8px;margin:10px 0;line-height:1.5}@media(hover:hover){.bot-step:hover{border-color:var(--demo-text)}}.bot-step span{font-size:14px;color:var(--bot-muted)}
.bot-evidence{border-top:1px solid var(--bot-line);margin-top:24px;padding-top:8px}.bot-evidence p{overflow-wrap:anywhere}.bot-evidence small{color:var(--bot-muted)}
html[data-theme=light]{--bot-surface:#fff;--bot-line:#dedee5;--bot-muted:#62626b;--text:#17171b}
@media(width < 760px){.bot-summary .shape-legend{display:none}.demo-header .bot-intro label{flex:0 0 100%;width:100%}.demo-header .bot-intro select{font-size:16px}.bot-dialog input{font-size:16px}}
@media(width < 760px){#bot-controls{display:block}.demo-header .demo-actions{display:none}.bot-controls-open .demo-header .demo-actions{display:flex}.demo-header{align-items:flex-start}.demo-header>div:first-child{width:100%}.bot-intro{gap:8px;width:100%}.bot-intro label{width:100%;flex-wrap:wrap}.bot-intro select{max-width:100%;width:100%;min-width:0}.bot-summary{padding:8px 14px;align-items:flex-start;flex-direction:column;gap:2px}.bot-summary p{font-size:12px}.bot-summary>span{font-size:11px}.shape-legend{display:none}.process-nav{padding:8px 14px}.demo-actions{flex-wrap:wrap}.demo-footer #help{display:none}.demo-footer{gap:4px}.bot-dialog{padding:16px}.bot-dialog-top h2{font-size:20px}.bot-intro button{min-height:40px}.demo-footer .demo-zoom{justify-content:center;gap:4px}.demo-zoom button{padding-inline:10px}.demo-zoom #focus{display:none}}

.bot-intro :is(button,select):focus-visible,.bot-dialog :is(button,input):focus-visible{outline:2px solid var(--demo-focus);outline-offset:3px}::selection{background:var(--studio-accent);color:var(--demo-bg)}