.studio-preview{container-type:inline-size}.studio-demo{--s: .75px;display:flex;flex-direction:column;min-height:520px;width:100%;min-width:0;container-type:inline-size;aspect-ratio:4 / 3;overflow:hidden;border-radius:.65rem;font-family:Arial,sans-serif;font-weight:400;line-height:1.3;pointer-events:none;user-select:none}.studio-demo svg:not([role=img]){width:calc(16 * var(--s));height:calc(16 * var(--s));flex-shrink:0}.studio-demo button{cursor:default;padding:0;border:0}.studio-demo .border{border-width:var(--s)}.studio-demo .border-b{border-bottom-width:var(--s)}.studio-title{display:flex;align-items:center;height:calc(32 * var(--s));flex-shrink:0;padding:0 calc(12 * var(--s));gap:calc(16 * var(--s));font-size:calc(12 * var(--s))}.studio-app-mark{display:flex;align-items:center;justify-content:center;width:calc(20 * var(--s));height:calc(20 * var(--s));border-radius:calc(2 * var(--s));margin-right:calc(16 * var(--s))}.studio-app-mark img{width:calc(16 * var(--s));filter:brightness(0) invert(1)}.studio-title>svg{width:calc(13 * var(--s));height:calc(13 * var(--s))}.studio-title>svg:last-of-type{width:calc(10 * var(--s));margin-left:calc(-12 * var(--s))}.studio-window-actions{margin-left:auto;display:flex;align-items:center;gap:calc(32 * var(--s))}.studio-window-actions svg{width:calc(12 * var(--s))!important;height:calc(12 * var(--s))!important}.studio-body{display:flex;flex:1;min-height:0}.studio-rail{width:calc(48 * var(--s));flex-shrink:0;display:flex;align-items:center;flex-direction:column;gap:calc(16 * var(--s));padding:calc(8 * var(--s)) 0}.studio-icon{display:inline-flex;align-items:center;justify-content:center;width:calc(32 * var(--s));height:calc(32 * var(--s));border-radius:calc(4 * var(--s));flex-shrink:0}.studio-rail .studio-icon svg{width:calc(20 * var(--s));height:calc(20 * var(--s));stroke-width:1.4}.studio-rail-bottom{margin-top:auto;display:flex;flex-direction:column;gap:calc(12 * var(--s))}.studio-chat{width:clamp(210px,30%,301px);flex-shrink:0;display:flex;flex-direction:column;min-height:0}.studio-chat-heading{height:calc(66 * var(--s));flex-shrink:0;padding:calc(4 * var(--s)) calc(16 * var(--s)) calc(12 * var(--s))}.studio-chat-heading>div{display:flex;align-items:center;gap:calc(9 * var(--s));height:calc(32 * var(--s))}.studio-chat-heading strong{font-size:calc(18 * var(--s));font-weight:600}.studio-chat-heading>div>svg:not(.ml-auto){width:calc(10 * var(--s));height:calc(10 * var(--s))}.studio-chat-heading>div>svg.ml-auto{margin-right:calc(14 * var(--s))}.studio-panel-toggle{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:calc(32 * var(--s));height:calc(32 * var(--s));border-radius:calc(6 * var(--s))}.studio-chat-heading p{display:flex;align-items:center;gap:calc(7 * var(--s));font-size:calc(12 * var(--s));margin-top:calc(4 * var(--s))}.studio-chat-heading p svg{width:calc(12 * var(--s));height:calc(12 * var(--s))}.studio-transcript{display:flex;flex-direction:column;justify-content:flex-end;position:relative;flex:1;overflow:clip;min-height:0;padding:calc(26 * var(--s)) calc(28 * var(--s)) 0;font-size:calc(13 * var(--s));line-height:calc(20 * var(--s))}.studio-transcript-content{flex-shrink:0}.studio-scroll-up{position:absolute;top:calc(8 * var(--s));left:50%;transform:translate(-50%);padding:calc(4 * var(--s));border-radius:calc(6 * var(--s))}.studio-transcript:after{content:"";position:absolute;right:calc(3 * var(--s));top:77%;width:calc(3 * var(--s));height:calc(30 * var(--s));border-radius:calc(3 * var(--s));background:currentColor;opacity:.18}.studio-transcript h3{font-size:calc(20 * var(--s));line-height:calc(28 * var(--s));font-weight:600;margin:calc(24 * var(--s)) 0 calc(12 * var(--s))}.studio-transcript ul{padding-left:calc(18 * var(--s));list-style:disc}.studio-transcript li{padding-left:0;margin:calc(8 * var(--s)) 0}.studio-transcript b{font-weight:500}.studio-caveat{margin-top:calc(22 * var(--s))}.studio-chat-footer{position:relative;flex-shrink:0;padding:calc(6 * var(--s)) calc(12 * var(--s)) calc(16 * var(--s))}.studio-scroll-down{position:absolute;top:calc(-39 * var(--s));left:50%;transform:translate(-50%);padding:calc(8 * var(--s));border-radius:calc(6 * var(--s))}.studio-model-line{justify-content:flex-start;overflow:clip;display:flex;align-items:center;gap:calc(12 * var(--s));min-height:calc(24 * var(--s));flex-wrap:wrap;padding:0 calc(12 * var(--s));border-inline:var(--s) solid transparent;font-size:calc(10 * var(--s));margin-bottom:calc(8 * var(--s));white-space:nowrap}.studio-model-line svg{width:calc(11 * var(--s))!important;height:calc(11 * var(--s))!important}.studio-model-line span{display:inline-flex;align-items:center;gap:calc(3 * var(--s));white-space:nowrap}.studio-composer{container:studio-composer / inline-size;height:calc(140 * var(--s));border-radius:calc(8 * var(--s));padding:calc(16 * var(--s)) calc(12 * var(--s)) calc(12 * var(--s));display:flex;flex-direction:column}.studio-composer>div{display:flex;align-items:center;gap:calc(16 * var(--s))}.studio-composer>div:first-child{justify-content:space-between;padding:0 calc(6 * var(--s))}.studio-composer>div:last-child{margin-top:auto}.studio-composer p{font-size:calc(12 * var(--s));margin-top:calc(20 * var(--s))}.studio-composer span{display:flex;align-items:center;font-size:calc(10 * var(--s));gap:calc(3 * var(--s))}.studio-composer span svg{width:calc(12 * var(--s));height:calc(12 * var(--s))}.studio-composer .studio-send{margin-left:auto;border-radius:calc(6 * var(--s));width:calc(32 * var(--s))!important;height:calc(32 * var(--s))!important;padding:calc(8 * var(--s))}.studio-workspace{flex:1;min-width:0;display:flex;flex-direction:column}.studio-tabs{height:calc(56 * var(--s));flex-shrink:0;display:flex;align-items:flex-end;justify-content:space-between;padding:0 calc(12 * var(--s));gap:calc(12 * var(--s))}.studio-tabs>span{width:max-content;gap:calc(12 * var(--s));height:calc(35 * var(--s));display:flex;align-items:center;justify-content:space-between;font-size:calc(12 * var(--s));padding:0 calc(12 * var(--s));border-radius:calc(4 * var(--s)) calc(4 * var(--s)) 0 0;white-space:nowrap}.studio-tabs>span svg{width:calc(10 * var(--s));height:calc(10 * var(--s))}.studio-tabs>div{display:flex;gap:calc(16 * var(--s));padding-bottom:calc(14 * var(--s))}.studio-canvas{container:studio-canvas / inline-size;overflow:hidden;position:relative;flex:1;min-height:0;display:flex}.studio-model{position:relative;flex:1;min-width:0}.studio-markup{width:max-content;position:absolute;top:calc(8 * var(--s));left:50%;transform:translate(-50%);display:flex;align-items:center;gap:calc(4 * var(--s));padding:calc(4 * var(--s)) calc(6 * var(--s));border-radius:calc(6 * var(--s));z-index:1}.studio-mode{position:absolute;right:calc(12 * var(--s));top:calc(8 * var(--s));display:flex;align-items:center;padding:calc(4 * var(--s));gap:calc(4 * var(--s));border-radius:calc(8 * var(--s));font-size:calc(12 * var(--s));z-index:1}.studio-mode button{width:calc(32 * var(--s));height:calc(32 * var(--s));border-radius:calc(4 * var(--s))}.studio-model-image{position:absolute;inset:calc(67 * var(--s)) calc(16 * var(--s)) calc(58 * var(--s))}.studio-attach{position:absolute;bottom:calc(12 * var(--s));left:calc(12 * var(--s));width:calc(96 * var(--s));height:calc(122 * var(--s));display:flex;flex-direction:column;padding:calc(4 * var(--s)) calc(12 * var(--s));border-radius:calc(8 * var(--s));font-size:calc(12 * var(--s));font-weight:600}.studio-attach span{display:flex;align-items:center;gap:calc(6 * var(--s));height:calc(30 * var(--s));flex-shrink:0}.studio-attach>svg{align-self:center;width:calc(12 * var(--s))!important;height:calc(12 * var(--s))!important;margin-top:calc(7 * var(--s))}.studio-tools{width:calc(430 * var(--s));justify-content:space-between;position:absolute;bottom:calc(12 * var(--s));left:50%;transform:translate(-50%);display:flex;align-items:center;gap:calc(4 * var(--s));padding:calc(4 * var(--s)) calc(6 * var(--s));border-radius:calc(6 * var(--s));white-space:nowrap}.studio-tools>span.text-ploy-studio-blue{width:calc(40 * var(--s));text-align:center;font-size:calc(12 * var(--s))}.studio-drawing{position:absolute;bottom:calc(64 * var(--s));right:calc(12 * var(--s));width:clamp(72px,28%,192px);aspect-ratio:256 / 332;padding:calc(8 * var(--s));border-radius:calc(6 * var(--s));display:flex;align-items:center}.studio-drawing svg{height:100%}.studio-shape,.studio-split{display:flex;align-items:center;border-radius:calc(4 * var(--s))}.studio-demo .studio-shape{height:calc(32 * var(--s));padding:0 calc(4 * var(--s));gap:calc(4 * var(--s))}.studio-split{height:calc(32 * var(--s));flex-shrink:0;overflow:hidden}.studio-control-active{box-shadow:0 0 0 var(--s) #5999ff59}.studio-split-action{display:flex;align-items:center;justify-content:center;width:calc(32 * var(--s));height:calc(32 * var(--s));flex-shrink:0}.studio-split-menu{position:relative;display:flex;align-items:center;justify-content:center;width:calc(12 * var(--s));height:calc(32 * var(--s));flex-shrink:0}.studio-split-menu:before{content:"";position:absolute;left:calc(-4 * var(--s));top:50%;transform:translateY(-50%);height:calc(12 * var(--s));width:var(--s);background:#ffffff26}.studio-demo .studio-split-menu svg{width:calc(12 * var(--s));height:calc(12 * var(--s));transform:translate(calc(-2 * var(--s)))}.studio-shape svg:first-child{width:calc(20 * var(--s));height:calc(20 * var(--s))}.studio-shape svg:last-child{width:calc(12 * var(--s))!important;height:calc(12 * var(--s))!important}.studio-palette{position:relative;display:flex;line-height:0}.studio-palette>span:last-child{position:absolute;bottom:calc(4 * var(--s));right:calc(3 * var(--s));width:calc(8 * var(--s));height:calc(8 * var(--s));border-radius:50%}.studio-disabled{display:flex;gap:calc(4 * var(--s));opacity:.3}.studio-divider{width:1px;height:calc(20 * var(--s));margin:0 calc(2 * var(--s));flex-shrink:0}.studio-status{height:calc(40 * var(--s));flex-shrink:0;display:flex;align-items:center;justify-content:flex-end;gap:calc(4 * var(--s));padding-right:calc(16 * var(--s));font-size:calc(10 * var(--s))}.studio-status svg{width:calc(12 * var(--s))!important;height:calc(12 * var(--s))!important}@container (max-width: 700px){.studio-chat{width:clamp(140px,30%,210px);overflow:hidden}.studio-chat-heading{padding-inline:8px}.studio-chat-heading>div{gap:4px}.studio-chat-heading>div>svg.ml-auto{margin-right:2px}.studio-transcript{padding-inline:14px}}@container studio-canvas (max-width: 536px){.studio-mode{display:none}}@container studio-canvas (max-width: 501px){.studio-attach{display:none}}.studio-composer>div:last-child{gap:clamp(6px,calc((100cqw - 108px)/5),12px)}.studio-credits{flex-shrink:0}@container studio-composer (max-width: 150px){.studio-composer .studio-credit-count{display:none}}@container studio-composer (max-width: 115px){.studio-composer-secondary{display:none}}