/* Product controls and creation workspaces. */
:root{--ui-surface:#19191D;--ui-hover:#2A292F;--ui-border:#34323C}
button,input,textarea{font:inherit}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
svg{stroke-width:1.65}
.app-top{height:64px;background:#101014f5;gap:24px;padding:0 24px}
.app-top .main-logo{width:168px;max-height:34px}
.product-nav{gap:5px!important;margin-right:auto}
.product-nav>a{display:flex;align-items:center;gap:7px;padding:9px 11px;border-radius:7px;font-size:12px;color:#A4A0AE}
.product-nav svg{width:15px;height:15px}
.product-nav>a.active{background:#D8C0F812;color:#E4CDFC}
.product-nav>a:hover{background:#ffffff08;color:white}
.credit-chip{display:flex;gap:6px;align-items:center;color:#E4E0EA;font-size:12px;white-space:nowrap}
.credit-chip svg{width:14px;height:14px;color:var(--accent)}
.credit-chip>span:last-child{color:#9994A3}
.account-button{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:#26242D;color:#C8C1D2}
.account-button svg{width:17px;height:17px}
.upgrade-link{min-height:33px;padding:8px 12px;font-size:11px}
.sidebar{background:#101014;padding:14px 10px;top:64px;border-color:#27252E}
.workspace-switch{margin-bottom:16px;position:relative;flex-shrink:0}
.workspace-switch summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:10px;padding:10px 9px;border-radius:8px;border:1px solid transparent}
.workspace-switch summary::-webkit-details-marker{display:none}
.workspace-switch summary:hover,.workspace-switch[open] summary{background:#202026;border-color:#37323F}
.workspace-emblem{height:31px;width:31px;display:grid;place-items:center;border-radius:7px;background:#D8C0F812;border:1px solid #D8C0F833;color:var(--accent);flex:none}
.workspace-emblem svg{width:17px;height:17px}
.workspace-switch strong{font-size:12px;font-weight:600;display:block;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.workspace-switch small{font-size:10px;color:#87828F;display:block;margin-top:3px}
.workspace-switch summary>svg{width:13px;height:13px;margin-left:auto;color:#9B94A6}
.workspace-menu{position:absolute;top:100%;left:0;width:236px;max-width:calc(100vw - 32px);z-index:65;background:#222127;border:1px solid #3D3848;box-shadow:0 12px 40px #0008;border-radius:10px;padding:7px}
.workspace-menu a{display:flex;align-items:center;gap:10px;font-size:12px;padding:11px;border-radius:6px}
.workspace-menu a:hover{background:#ffffff0c}
.workspace-menu svg{width:16px;height:16px;color:#BAAFC9}
.menu-caption{display:block;font-size:10px;color:#918B9C;padding:7px 11px;text-transform:uppercase;letter-spacing:.1em}
.menu-divider{height:1px;background:#3A3543;margin:5px}
.side-nav a{font-size:12px;padding:10px 12px;gap:10px;border-radius:7px;color:#9994A3}
.side-nav a svg{width:17px;height:17px;flex:none}
.side-nav a.active{color:#EDDFFF;background:#D8C0F815;box-shadow:inset 2px 0 0 #CFA9F4}
.navgroup{font-size:9px;letter-spacing:.12em;color:#6E6878;margin-top:22px;margin-bottom:7px;padding-left:12px}
.side-bottom{border-top:1px solid #28242E;padding:10px 4px 0;margin-top:auto}
.sidebar-help{display:flex;align-items:center;gap:9px;color:#A19AAE;font-size:11px;padding:11px 8px}
.sidebar-help svg{width:15px;height:15px}.sidebar-help svg:last-child{margin-left:auto;width:12px}
.sidebar-plan{display:grid;grid-template-columns:1fr auto;gap:8px;background:#1A1820;border:1px solid #312B3B;border-radius:8px;padding:12px;font-size:10px;color:#AAA2B8}
.sidebar-plan strong{display:flex;align-items:center;gap:5px;font-size:12px;color:#E4D0FA}.sidebar-plan svg{width:12px;height:12px}.sidebar-plan small{display:flex;align-items:center;justify-content:space-between;grid-column:1/-1;color:#7F778B;font-size:10px}
.workspace{padding:27px 28px;min-width:0}
.workspace h1{font-size:27px;letter-spacing:-.8px}.pagehead{margin-bottom:24px}.pagehead p{font-size:12px;color:#96909F;margin-top:7px}
.custom-field{position:relative;min-width:0}.custom-field>select[hidden]{display:none!important}
.select-trigger{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;text-align:left;min-height:43px;padding:10px 12px;background:#202025;border:1px solid #37333E;border-radius:8px;color:#E9E4EE;font-size:12px;cursor:pointer;transition:background .15s,border-color .15s}
.select-trigger:hover{background:#29272F;border-color:#52485F}.select-trigger[aria-expanded=true]{border-color:#A18CB6;background:#29252F}
.select-trigger>svg{width:13px;height:13px;color:#9C92AA;flex:none}
.select-current{display:flex;align-items:center;gap:8px;min-width:0}.select-current>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.control-popover{position:fixed;z-index:200;background:#25242B;border:1px solid #49414F;border-radius:11px;padding:6px;box-shadow:0 18px 55px #0009,0 2px 7px #0005;overflow:auto;overscroll-behavior:contain;animation:popover-in .14s ease-out}
@keyframes popover-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.popover-label{font-size:10px;color:#9E96A9;padding:9px 10px;letter-spacing:.02em}
.select-option{width:100%;display:flex;align-items:center;gap:10px;padding:10px;min-height:40px;text-align:left;color:#DDD7E6;border:0;border-radius:6px;background:transparent;cursor:pointer;font-size:12px}
.select-option:hover,.select-option:focus-visible{background:#39343F;outline:none}
.select-option.selected{background:#D8C0F80F;color:#F1E7FC}
.option-check{margin-left:auto;width:17px;height:17px;flex:none;opacity:0;color:#D8C0F8}.option-check svg{width:17px;height:17px}.selected .option-check{opacity:1}
.option-copy{display:flex;flex-direction:column;gap:5px}.option-copy strong{font-size:12px;font-weight:550}.option-copy small{font-size:10px;color:#9F97AA}
.model-mark{display:grid;place-items:center;flex:none;width:32px;height:32px;border:1px solid #ffffff0c;background:#353039;border-radius:7px;color:#D8C0F8;font-weight:650;font-size:17px}
.model-mark.google{color:#E4D2F7}.model-mark.flux{font-style:italic;color:#E8E4EB}.model-mark.openai{color:#C3D9CA}
.select-current .model-mark{width:23px;height:23px;font-size:14px;border-radius:5px}
.model-popover .select-option{padding:10px 9px;min-height:60px}.model-search{display:flex;align-items:center;gap:9px;border-bottom:1px solid #433B4A;padding:7px 8px 12px}.model-search svg{width:17px;height:17px;color:#9B91A6}.model-search input{background:none;border:0;outline:none;color:#F3EDF9;width:100%;font-size:12px;padding:5px}
.model-no-results{color:#A49AAC;font-size:12px;padding:10px}
.ratio-option-icon{display:grid;place-items:center;width:26px;height:25px}.ratio-outline{display:inline-block;border:1.4px solid currentColor;border-radius:3px;color:#C9B9D8;flex:none}.ratio-mini{width:20px;height:20px;display:grid;place-items:center}.ratio-mini .ratio-outline{transform:scale(.7)}
.quantity-stepper{display:flex;align-items:center;justify-content:space-between;gap:7px;border:1px solid #37333E;border-radius:8px;background:#202025;min-height:43px;padding:4px}
.quantity-stepper button{background:transparent;border:0;border-radius:5px;color:#D4C9E0;width:30px;height:31px;cursor:pointer;font-size:18px}.quantity-stepper button:hover{background:#ffffff09}.quantity-stepper button:disabled{opacity:.25;cursor:default}.quantity-stepper output{font-size:12px;white-space:nowrap}.quantity-stepper output span{color:#746C80;font-size:10px;margin-left:3px}
.creation-layout{display:flex;flex-direction:column;min-height:calc(100vh - 166px);gap:28px;max-width:1400px}
.creation-content{min-width:0;order:0;border:1px solid #28252F;border-radius:14px;padding:14px 22px 24px;background:#111115}
.creation-tabs{display:flex;gap:5px;align-items:center;border-bottom:1px solid #26222D;padding-bottom:12px}.creation-tabs button{display:flex;align-items:center;gap:6px;background:transparent;border:0;padding:8px 10px;font-size:11px;color:#8E859B;border-radius:6px;cursor:pointer}.creation-tabs button.active{background:#25212C;color:#E5D7F0}.creation-tabs svg{width:14px;height:14px}.creation-tabs a{margin-left:auto;font-size:10px;color:#8B8299;display:flex;align-items:center;gap:6px}
.creation-intro{text-align:center;padding:28px 0 25px}.creation-intro .eyebrow{font-size:9px;color:#A88EC2}.creation-intro h2{font-size:30px;letter-spacing:-1px;margin:10px 0}.creation-intro p{font-size:12px;color:#8E8699;margin:0}
.studio-inspiration{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:890px;margin:0 auto}
.inspiration-tile{padding:0;border:1px solid #322B3B;border-radius:9px;background:#1A161F;text-align:left;cursor:pointer;overflow:hidden;position:relative;color:#F0E7F7}
.inspiration-tile img{width:100%;height:168px;object-fit:cover;transition:transform .5s;opacity:.85}.inspiration-tile:hover img{transform:scale(1.035);opacity:1}
.inspiration-tile>span{display:flex;align-items:center;gap:10px;padding:12px;position:relative;background:#1A161F}.inspiration-tile strong{font-size:11px;font-weight:500}.inspiration-tile small{display:flex;align-items:center;gap:4px;margin-left:auto;font-size:9px;color:#A28BAC;white-space:nowrap}.inspiration-tile small svg{width:12px;height:12px}
.creation-composer{order:1;background:#202025;border:1px solid #39323F;box-shadow:0 0 0 4px #1C192250,0 15px 45px #0002;border-radius:14px;padding:15px 16px;max-width:100%;margin-top:auto}
.composer-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:13px;font-size:10px;color:#ADA0B9}.composer-top>span,.composer-top>a{display:flex;align-items:center;gap:6px}.composer-top svg{width:13px;height:13px}.composer-top>a{color:#81758F;font-size:9px}
.composer-prompt{display:block}.composer-prompt>span{display:none}.composer-prompt textarea{width:100%;min-height:76px;resize:vertical;background:none;border:0;padding:4px 2px;outline:none;color:#F0E9F7;font-size:13px;line-height:1.7}.composer-prompt textarea::placeholder{color:#8A8196}
.reference-tools{display:flex;gap:8px;margin:6px 0 15px}.reference-chip{display:flex;align-items:center;gap:6px;padding:6px 9px;border-radius:6px;border:1px solid #49404F;background:#29242F;color:#C2B4CE;font-size:10px;cursor:pointer;position:relative}.reference-chip svg{width:13px;height:13px}
.composer-controls{display:grid;grid-template-columns:1.65fr 1.45fr 1fr .8fr;gap:9px}.composer-controls .field{margin-bottom:0}.composer-controls .field>span{font-size:9px;color:#8D819B;margin-bottom:6px}.composer-controls .select-trigger{min-height:39px;font-size:11px;padding:7px 9px;background:#2A262F;border-color:#3E3549}.composer-controls .quantity-stepper{min-height:39px;background:#2A262F}.composer-controls .quantity-stepper button{height:28px;width:24px}
.composer-bottom{display:flex;justify-content:space-between;align-items:center;gap:15px;padding-top:15px}.composer-balance{color:#7E728C;font-size:10px}.generate-button{min-width:160px;min-height:41px;display:flex;gap:7px;justify-content:center;font-size:12px}.generate-button svg{width:13px;height:13px}.generate-button strong{font-size:11px;font-weight:600}
.video-creation{display:grid;grid-template-columns:300px minmax(0,1fr);align-items:start}.video-creation .creation-composer{order:0;margin:0;position:sticky;top:86px;padding:14px}.video-creation .creation-content{order:1;min-height:650px}.video-creation .composer-controls{grid-template-columns:1fr 1fr}.video-creation .custom-field[data-control-kind=model]{grid-column:1/-1}.video-creation .composer-bottom{display:block}.video-creation .composer-balance{display:block;margin:7px 0 12px}.video-creation .generate-button{width:100%}.video-creation .creation-intro{padding:40px 0 28px}.video-creation .studio-inspiration{grid-template-columns:1fr;gap:12px}.video-creation .inspiration-tile{display:flex;align-items:center}.video-creation .inspiration-tile img{width:115px;height:105px}.video-creation .inspiration-tile>span{flex:1;display:block}.video-creation .inspiration-tile small{margin-top:12px}.video-reference{display:flex;flex-direction:column;align-items:center;gap:8px;background:#28242E;border:1px dashed #4C4059;border-radius:9px;padding:25px 12px;margin-bottom:15px;position:relative;cursor:pointer}.video-reference>svg{width:24px;height:24px;color:#D8C0F8}.video-reference strong{font-size:11px;font-weight:500}.video-reference>span{font-size:9px;color:#887A98}.video-creation .composer-prompt>span{display:block;font-size:10px;color:#AE9DBC;margin:10px 0}.video-creation .composer-prompt textarea{min-height:100px;font-size:12px}
.upload-preview{max-height:90px;object-fit:contain;border-radius:5px}.reference-chip .upload-preview{width:30px;height:30px}.video-reference .upload-preview{max-width:100%;max-height:140px}
[hidden]{display:none!important}
@media(max-width:1100px){.product-nav>a{padding:8px;font-size:11px}.product-nav>a svg{display:none}.app-top{gap:16px}.app-top .main-logo{width:150px}.app-top .topright{gap:12px}.studio-inspiration{gap:8px}.inspiration-tile>span{display:block}.inspiration-tile small{margin-top:7px}.video-creation{grid-template-columns:270px minmax(0,1fr);gap:16px}.workspace{padding:24px 20px}.video-creation .inspiration-tile img{width:90px}}
@media(max-width:900px){.app-top>.product-nav{display:none}.creation-content{padding:12px 15px 18px}.creation-intro h2{font-size:26px}.inspiration-tile img{height:140px}.video-creation{grid-template-columns:1fr}.video-creation .creation-composer{position:static;order:1}.video-creation .creation-content{min-height:0;order:0}.video-creation .studio-inspiration{grid-template-columns:repeat(3,1fr)}.video-creation .inspiration-tile{display:block}.video-creation .inspiration-tile img{width:100%;height:120px}.video-creation .composer-bottom{display:flex}.video-creation .generate-button{width:auto}.video-creation .composer-controls{grid-template-columns:repeat(3,1fr)}.video-creation .custom-field[data-control-kind=model]{grid-column:auto}.video-reference{padding:15px}.creation-layout{min-height:0}}
@media(max-width:650px){.app-top{height:62px;padding:0 16px;gap:12px}.app-top .main-logo{width:137px}.app-top .credit-chip{font-size:10px;gap:4px}.credit-chip>span:last-child{display:none}.app-top .upgrade-link,.app-top .account-button{display:none}.app-top .topright{gap:13px}.sidebar{top:62px}.workspace{padding:22px 16px 40px}.workspace h1{font-size:25px}.pagehead{gap:12px;flex-wrap:wrap}.pagehead p{font-size:11px}.pagehead .btn{font-size:10px;min-height:32px;padding:8px 10px}.creation-layout{gap:20px}.creation-content{padding:10px 12px 14px}.creation-intro{padding:24px 0 20px}.creation-intro h2{font-size:24px}.creation-intro p{font-size:11px;line-height:1.65}.studio-inspiration{grid-template-columns:1fr}.inspiration-tile{display:flex;align-items:center}.inspiration-tile img{width:100px;height:95px}.inspiration-tile>span{flex:1}.inspiration-tile small{margin-top:9px}.creation-composer{padding:13px;border-radius:12px}.composer-controls,.video-creation .composer-controls{grid-template-columns:1fr 1fr}.composer-controls .custom-field[data-control-kind=model]{grid-column:1/-1}.composer-prompt textarea{min-height:100px;font-size:12px}.composer-top>a{font-size:8px}.composer-top{gap:8px}.reference-chip{font-size:9px;padding:7px}.composer-balance{font-size:9px}.generate-button{min-width:138px}.video-creation .studio-inspiration{grid-template-columns:1fr}.video-creation .inspiration-tile{display:flex}.video-creation .inspiration-tile img{width:100px;height:95px}.video-creation .creation-intro{padding:25px 0 20px}.video-creation .composer-bottom{display:flex}.video-creation .composer-balance{margin:0}.workspace-switch strong{max-width:140px}.select-trigger{font-size:12px}.control-popover{max-width:calc(100vw - 24px)}}
@media(prefers-reduced-motion:reduce){.control-popover{animation:none}.inspiration-tile img{transition:none}}
@media(min-width:901px){
 body[data-page="image-studio"] .workspace{height:calc(100dvh - 64px);display:flex;flex-direction:column;overflow:hidden;padding-top:22px;padding-bottom:20px}
 body[data-page="image-studio"] .pagehead{flex:none;margin-bottom:18px}
 .image-creation{flex:1;min-height:0;gap:18px}
 .image-creation .creation-content{flex:1;min-height:180px;overflow:auto;padding:12px 18px 16px}
 .image-creation .creation-intro{padding:15px 0 17px}
 .image-creation .creation-intro h2{font-size:25px;margin:6px 0}
 .image-creation .creation-intro .eyebrow{font-size:8px}
 .image-creation .studio-inspiration{max-width:780px}
 .image-creation .inspiration-tile img{height:120px}
 .image-creation .inspiration-tile>span{padding:10px}
 .image-creation .creation-composer{flex:none;margin:0;padding:12px 15px}
 .image-creation .composer-top{padding-bottom:9px}
 .image-creation .composer-prompt textarea{min-height:46px;max-height:100px;font-size:12px}
 .image-creation .reference-tools{margin:2px 0 11px}
 .image-creation .composer-bottom{padding-top:11px}
}
@media(min-width:901px) and (max-height:850px){.image-creation .creation-intro{padding:10px 0 12px}.image-creation .creation-intro .eyebrow{display:none}.image-creation .creation-intro h2{font-size:22px}.image-creation .creation-intro p{font-size:11px}.image-creation .inspiration-tile img{height:90px}.image-creation .inspiration-tile>span{padding:9px 10px}.image-creation .creation-tabs{padding-bottom:8px}.image-creation .creation-content{padding-top:10px}}
@media(min-width:901px){
 .video-creation .creation-composer{height:calc(100dvh - 166px);min-height:420px;display:flex;flex-direction:column}
 .video-creation .composer-body{min-height:0;overflow:auto;flex:1;padding-right:4px;scrollbar-width:thin}
 .video-creation .composer-top,.video-creation .composer-bottom{flex:none}
 .video-creation .composer-bottom{border-top:1px solid #39313F;margin-top:10px;padding-top:9px}
 .video-creation .creation-content{height:calc(100dvh - 166px);min-height:420px;overflow:auto}
 .video-creation .creation-intro{padding:24px 0}
}

.model-mark.openai{font-size:10px;letter-spacing:-.4px}.select-current .model-mark.openai{font-size:8px}
/* Reference-led working surfaces: neutral controls, open stages, distinct app shells. */
@font-face{font-family:InterUI;src:url('assets/fonts/inter-ui.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}
.select-caption{display:none}
body:has(.workspace){font-family:InterUI,Inter,Arial,sans-serif;background:#101213;color:#F2F3F3;--panel:#1C1F20;--raised:#282B2C;--line:#2B2E2F;--muted:#919596}
body:has(.workspace) h1,body:has(.workspace) h2,body:has(.workspace) h3{font-family:InterUI,Inter,Arial,sans-serif}
.app-top{height:56px;padding:0 18px;gap:22px;background:#101213;border-bottom:1px solid #ffffff06;backdrop-filter:none;z-index:60}
.app-top .main-logo{width:158px;height:auto;max-height:31px}
.app-top>.product-nav{display:flex!important;gap:3px!important;min-width:0;white-space:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 auto 0 0}
.product-nav::-webkit-scrollbar{display:none}.product-nav>a{padding:9px 10px;font-size:12px;font-weight:500;color:#8C9294;background:none!important;border-radius:0;flex:none}
.product-nav>a.active{color:#E5CFFD}.product-nav>a:hover{color:#F6F6F6}.product-nav svg{display:none!important}
.app-top .topright{gap:14px;flex:none}.credit-chip{font-size:11px}.credit-chip svg{width:13px}.upgrade-link{font-size:11px;padding:6px 11px;min-height:29px;border-radius:7px}
.account-menu{position:relative}.account-menu summary{list-style:none;display:grid;place-items:center;width:30px;height:30px;color:#ABB0B1;background:#242728;border-radius:7px;cursor:pointer}.account-menu summary::-webkit-details-marker{display:none}.account-menu summary svg{width:17px;height:17px}
.account-menu-panel{position:absolute;right:0;top:calc(100% + 10px);width:215px;background:#222526;border:1px solid #343839;border-radius:11px;box-shadow:0 12px 40px #0008;padding:6px;z-index:110}.account-menu-panel a{display:flex;align-items:center;gap:10px;padding:10px;border-radius:6px;font-size:12px;color:#D7DADB}.account-menu-panel a:hover{background:#ffffff0a}.account-menu-panel svg{width:15px;height:15px;color:#999FA0}.account-menu-panel .menu-caption{color:#818889}
.sidebar{top:56px;background:#111314;border-color:#242728}.side-nav a{color:#949B9E}.side-nav a.active{color:#F1F3F3;background:#252829;box-shadow:none}.side-nav a:hover{background:#202324}.navgroup{color:#697174}.workspace-switch summary:hover,.workspace-switch[open] summary{background:#202324;border-color:transparent}.workspace-emblem{background:#26292B;border-color:#ffffff0a;color:#D0D6D8}.sidebar-plan{background:#1B1E20;border-color:#2B3032}.side-bottom{border-color:#292D2E}.workspace{min-height:calc(100vh - 56px)}
.tool-workspace .workspace{margin-left:0;max-width:none;padding:12px 16px;min-height:calc(100dvh - 56px)}
.studio-document-title{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.creation-layout{max-width:none;gap:12px;min-height:calc(100dvh - 80px)}
.creation-composer{background:#141718;border:1px solid #242829;border-radius:16px;box-shadow:none}
.composer-top{font-size:12px;color:#F0F2F3;padding:0 2px 13px;border-bottom:1px solid #ffffff06;margin-bottom:10px}.composer-top>a{font-size:10px;color:#8B9497}.composer-top>span{font-weight:500}
.composer-top svg{width:12px;height:12px}
.composer-prompt{background:#202324;border-radius:12px;padding:12px}.composer-prompt>span,.video-creation .composer-prompt>span{font-size:12px;display:block;color:#EFF0F0;margin:0 0 6px}
.composer-prompt textarea,.video-creation .composer-prompt textarea{font-size:12px;line-height:1.6;color:#ECEFF0;padding:0;min-height:95px}.composer-prompt textarea::placeholder{color:#858D90}
.composer-controls{gap:8px}.composer-controls .custom-field>span{display:none}
.composer-controls .select-trigger{background:#202324;border:0;border-radius:12px;min-height:54px;padding:8px 12px;display:grid;grid-template-columns:minmax(0,1fr) auto;row-gap:3px;column-gap:8px;font-size:13px}
.composer-controls .select-trigger:hover{background:#292D2E}.composer-controls .select-trigger[aria-expanded=true]{background:#2B2F30}
.composer-controls .select-caption{display:block;grid-column:1;grid-row:1;font-size:11px;color:#91989A;line-height:1.2}
.composer-controls .select-current{grid-column:1;grid-row:2;line-height:1.25;gap:6px;min-width:0}
.composer-controls .select-trigger>svg{grid-column:2;grid-row:1/span 2;color:#90999D;width:12px;height:12px;transform:rotate(-90deg)}
.composer-controls .select-current .model-mark{width:17px;height:17px;background:none;border:0;font-size:14px;color:#CFB2EC}.composer-controls .select-current .model-mark.openai{font-size:7px}
.composer-bottom{border-color:#272C2D!important}.composer-balance{color:#727B7F}.generate-button{border-radius:12px;min-height:46px;font-size:13px;box-shadow:inset 0 1px 0 #fff8,0 3px 0 #80659A!important;border-color:#F0DAFF66!important}
.creation-content{background:#101213;border-color:#232728;border-radius:16px;padding:14px 20px;box-shadow:none}
.creation-tabs{padding-bottom:0;border:0;gap:4px;font-size:11px}.creation-tabs button{font-size:11px;border-radius:6px;padding:8px 10px;color:#858F93}.creation-tabs button.active{background:#25292B;color:#E6EAEA}.creation-tabs button svg{width:13px;height:13px}.creation-tabs a{color:#778388}
.video-creation{grid-template-columns:320px minmax(0,1fr);align-items:stretch}
.video-creation .creation-composer,.video-creation .creation-content{height:calc(100dvh - 80px);min-height:470px;position:static}
.video-creation .creation-composer{padding:12px 10px}.video-creation .composer-body{padding-right:2px;display:flex;flex-direction:column;gap:8px}
.video-reference{margin:0;padding:22px 12px;background:#202324;border:1px dashed #ffffff10;border-radius:12px;gap:7px;min-height:125px;justify-content:center}
.video-reference strong{font-size:12px;font-weight:500}.video-reference>span{font-size:10px;color:#7F8A8E}.reference-symbols{display:flex;align-items:center;gap:0}.reference-symbols svg{width:27px;height:27px;padding:6px;border-radius:50%;background:#303638;border:1px solid #485155;color:#B1BBBE}.reference-symbols svg+svg{margin-left:-4px}
.video-creation .composer-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.video-creation .custom-field[data-control-kind=model]{grid-column:1/-1}
.video-creation .composer-controls .custom-field:has(select[name=duration]){grid-row:2;grid-column:1}.video-creation .composer-controls .custom-field:has(select[name=format]){grid-row:2;grid-column:2}.video-creation .composer-controls .custom-field:has(select[name=quality]){grid-row:3;grid-column:1/-1}
.video-creation .composer-bottom{padding:9px 0 2px;margin-top:8px}.video-creation .composer-balance{display:none}.video-creation .generate-button{width:100%;margin-bottom:2px}
.studio-welcome{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100%;padding:30px 20px 22px;max-width:1100px;margin:auto}
.welcome-copy{text-align:center;max-width:650px;margin:0 auto 38px}.welcome-copy h2{font-size:31px;letter-spacing:-1.1px;font-weight:650;line-height:1.15;margin:0 0 12px}.welcome-copy>p{font-size:12px;color:#818C91;line-height:1.6;margin:0}
.video-guide{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;width:100%;max-width:900px}
.guide-step{min-width:0}.guide-art{height:150px;display:flex;align-items:center;justify-content:center;position:relative;margin-bottom:20px;overflow:hidden}
.guide-art img{object-fit:cover;width:100%;height:100%;border-radius:9px;filter:saturate(.8)}
.guide-upload{transform:rotate(-4deg);padding:9px 18px}.guide-upload img{height:138px;border:2px solid #BEB2CC;box-shadow:0 6px 20px #0006}.guide-upload>span{position:absolute;bottom:7px;right:8px;display:grid;place-items:center;width:30px;height:30px;background:#E1C5FA;border-radius:50%;color:#241A2C}.guide-upload>span svg{width:16px;height:16px}
.guide-prompt{align-items:stretch;flex-direction:column;background:#252A2C;border:1px solid #3B4245;border-radius:10px;padding:15px;transform:rotate(2deg)}
.guide-prompt>span{display:flex;align-items:center;gap:6px;font-size:10px;color:#BBC4C9}.guide-prompt svg{width:12px;height:12px}.guide-prompt>p{font-size:13px;line-height:1.6;color:#EBEDF0;margin:15px 0 0}
.guide-result{padding:9px 0;transform:rotate(-2deg)}.guide-result img{border:2px solid #B5C4CE}.guide-result>span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;border-radius:50%;width:33px;height:33px;background:#0F161AAC;border:1px solid #DDEAF380;color:white}.guide-result svg{width:15px;height:15px}
.guide-step h3{font-size:14px;font-weight:600;letter-spacing:-.2px;margin:0 0 9px}.guide-step>p{font-size:11px;color:#7D898F;line-height:1.65;margin:0}
.starter-prompts{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin:34px auto 0}.starter-prompts>span{width:100%;text-align:center;color:#667479;font-size:10px;margin-bottom:5px}.starter-prompts button{display:flex;align-items:center;gap:8px;background:#1C2225;border:1px solid #2D363B;border-radius:6px;color:#9EADB4;padding:8px 10px;font-size:10px;cursor:pointer}.starter-prompts button:hover{background:#2A3338;color:#E5EEF4}.starter-prompts svg{width:12px;height:12px}
.image-creation{display:flex;min-height:0}.image-creation .creation-content{border:0;background:none;flex:1;display:flex;flex-direction:column;padding:0;overflow:auto}
.image-creation .studio-welcome{flex:1;min-height:330px;padding:22px 16px}.image-creation .welcome-copy{margin-bottom:0}.image-welcome .welcome-copy h2{font-size:29px}
.welcome-collage{display:flex;justify-content:center;align-items:center;margin:0 auto 27px;isolation:isolate;padding:6px 10px}
.welcome-collage img{width:102px;height:112px;object-fit:cover;border-radius:10px;border:3px solid #353B3E;box-shadow:0 5px 18px #0006;transform:rotate(-9deg);margin-right:-9px}.welcome-collage img:nth-child(2){z-index:2;transform:rotate(3deg);height:129px;width:110px}.welcome-collage img:nth-child(3){transform:rotate(10deg);margin:0}
.image-welcome .starter-prompts{margin-top:22px}
.image-creation .creation-composer{max-width:1050px;width:calc(100% - 40px);margin:0 auto 6px;display:grid;grid-template-columns:minmax(0,1fr) 120px;gap:12px;align-items:end;padding:12px;border-radius:15px;background:#232729;border:1px solid #343A3D;box-shadow:0 0 0 4px #1A1F2150}
.image-creation .composer-top{display:none}.image-creation .composer-body{display:flex;align-items:center;flex-wrap:wrap;gap:7px;min-width:0}.image-creation .composer-prompt{background:none;padding:3px 2px 6px;flex:1 1 100%;border-radius:0}.image-creation .composer-prompt>span{display:none}.image-creation .composer-prompt textarea{min-height:53px;max-height:95px;font-size:12px;padding:0}
.image-creation .reference-tools{margin:0;gap:5px}.image-creation .reference-chip{font-size:0;gap:0;padding:8px;min-height:33px;background:#2D3336;border:0;border-radius:6px;color:#CBD4D9}.image-creation .reference-chip svg{width:15px;height:15px}
.image-creation .composer-controls{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}.image-creation .composer-controls .custom-field{flex:none}.image-creation .composer-controls .custom-field>span,.image-creation .composer-controls .select-caption,.image-creation .quantity-field>span{display:none}
.image-creation .composer-controls .select-trigger{display:flex;min-height:33px;background:#2D3336;border:0;border-radius:6px;padding:6px 8px;font-size:11px;gap:9px}.image-creation .composer-controls .select-trigger>svg{width:10px;transform:none}.image-creation .select-current .model-mark{width:15px;height:15px}.image-creation .composer-controls .ratio-mini{width:14px;height:14px}.image-creation .ratio-mini .ratio-outline{transform:scale(.58)}
.image-creation .quantity-stepper{min-height:33px;background:#2D3336;border:0;border-radius:6px;padding:2px;gap:2px}.image-creation .quantity-stepper button{height:27px;width:22px}.image-creation .quantity-stepper output{font-size:11px}
.image-creation .composer-bottom{padding:0;display:flex;align-items:stretch;margin:0;border:0;align-self:stretch}.image-creation .composer-balance{display:none}.image-creation .generate-button{min-width:0;min-height:78px;width:100%;display:flex;justify-content:center;align-content:center;flex-wrap:wrap;font-size:12px;border-radius:11px;margin-bottom:3px;padding:12px}.image-creation .generate-button strong{font-size:11px}
.tool-workspace .editor-panel{background:#15191B;border-color:#292F32;border-radius:14px;box-shadow:none}.tool-workspace .field input,.tool-workspace .field textarea{background:#202628;border-color:transparent;border-radius:10px;color:#E9EDF0}.tool-workspace .field>span{color:#8E9AA2}.tool-workspace .editor-panel h3{font-size:15px}.tool-workspace .select-trigger{background:#22292C;border:0;min-height:43px}.tool-workspace .steps{justify-content:flex-start}.tool-workspace .light-block{background:#E0E0DC;color:#191C1B}
.control-popover{background:#232728;border-color:#303638;border-radius:13px;box-shadow:0 12px 35px #0006;padding:7px;color:#E1E6E9;font-family:InterUI,Inter,Arial,sans-serif}.popover-label{color:#929CA0;font-size:11px;padding:10px 9px}.select-option{font-size:13px;min-height:40px;color:#E5EAED;padding:10px;border-radius:8px}.select-option.selected{background:#33393C;color:#F1F4F6}.select-option:hover,.select-option:focus-visible{background:#303639}.option-check{color:#E9D7FA}.ratio-outline{color:#ACB8BE}.model-mark{background:#303638;border-color:#3C454B;color:#CCD9E2}.model-search{border-color:#3A4246}.option-copy small{color:#89969D}.option-copy strong{font-size:12px;font-weight:500}
.announcement{min-height:44px;display:flex;align-items:center;justify-content:center;gap:12px;padding:8px 45px;background:var(--brand-gradient);color:#281B36;position:sticky;top:0;z-index:70;font-size:12px;font-weight:550;box-shadow:0 5px 20px #D8C0F811;text-align:center}.announcement>svg{width:15px;height:15px}.announcement>a{color:#21172B;background:#FBF8FF;border-radius:6px;padding:7px 13px;font-size:11px;box-shadow:0 2px 5px #46296620;white-space:nowrap}.announcement-close{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:25px;height:25px;border:0;background:none;color:#3C2A4B;cursor:pointer;display:grid;place-items:center}.announcement-close svg{width:16px;height:16px}.has-announcement .topbar{top:44px}
@media(min-width:901px){body[data-page=image-studio] .workspace{height:calc(100dvh - 56px);padding:12px 24px 16px}.image-creation{height:100%;min-height:0;gap:14px}.image-creation .creation-content{min-height:0}.image-creation .creation-composer{flex:none}.video-creation .creation-composer{display:flex;flex-direction:column}.video-creation .creation-content{display:flex;flex-direction:column}.video-creation [data-studio-panel=inspiration]{flex:1;min-height:0;overflow:auto}.video-creation .studio-welcome{padding:35px 22px;min-height:100%}.video-creation .composer-body{overflow:auto;min-height:0;flex:1}}
@media(min-width:761px) and (max-width:1100px){.app-top{gap:15px;padding:0 15px}.app-top .main-logo{width:137px}.product-nav>a{padding:9px 8px;font-size:11px}.app-top .topright{gap:11px}.credit-chip>span:last-child{display:none}.video-creation{grid-template-columns:300px minmax(0,1fr)}.video-guide{gap:15px}.guide-art{height:125px}.guide-prompt{padding:11px}.guide-prompt>p{font-size:11px}.welcome-copy h2{font-size:26px}.video-creation .studio-welcome{padding:25px 14px}.guide-step h3{font-size:12px}.guide-step>p{font-size:10px}.image-creation .creation-composer{width:calc(100% - 12px)}}
@media(min-width:761px) and (max-width:900px){.video-creation{display:grid;grid-template-columns:290px minmax(0,1fr)}.video-creation .creation-composer{order:0;display:flex;flex-direction:column}.video-creation .creation-content{order:1}.video-creation .composer-body{min-height:0;overflow:auto}.video-creation .composer-controls{grid-template-columns:1fr 1fr}.video-guide{grid-template-columns:1fr;gap:18px;max-width:350px}.guide-step{display:grid;grid-template-columns:105px minmax(0,1fr);column-gap:14px}.guide-art{grid-row:1/span 2;height:110px;margin:0}.guide-step h3{align-self:end}.guide-step>p{align-self:start}.video-creation .studio-welcome{justify-content:flex-start}.welcome-copy{margin-bottom:26px}.video-creation .creation-content{overflow:auto}.image-creation{min-height:calc(100dvh - 80px)}.image-creation .creation-composer{width:100%}}
@media(max-width:760px){.app-top{height:96px;padding:8px 14px 0;gap:0 10px;flex-wrap:wrap;align-content:start;position:sticky;top:0}.app-top .brand{height:35px}.app-top .main-logo{width:143px;max-height:30px}.app-top .topright{margin-left:auto;gap:11px;height:35px}.app-top .credit-chip{display:flex;font-size:11px}.app-top .upgrade-link{display:none}.app-top .account-menu{display:block}.app-top>.product-nav{order:3;flex:0 0 calc(100% + 28px);margin:5px -14px 0;padding:0 10px;height:46px;align-items:center;gap:2px!important;border-top:1px solid #ffffff06}.product-nav>a{font-size:12px;padding:10px 12px}.app-top .mobile-menu{display:none}.sidebar{top:96px}.workspace{min-height:calc(100vh - 96px)}.tool-workspace .workspace{padding:8px 10px 18px;min-height:calc(100dvh - 96px)}.tool-workspace .pagehead{margin:10px 5px 20px}.creation-layout{min-height:0;gap:12px}.video-creation{display:flex;flex-direction:column}.video-creation .creation-composer{order:0;height:auto;min-height:0;padding:12px}.video-creation .creation-content{order:1;height:auto;min-height:0;padding:12px;border:0}.video-creation .composer-body{overflow:visible;display:grid;grid-template-columns:1fr 1fr;gap:8px}.video-creation .video-reference{min-height:140px}.video-creation .composer-prompt{min-height:140px}.video-creation .composer-prompt textarea{min-height:90px;font-size:11px}.video-creation .composer-controls{grid-column:1/-1;grid-template-columns:1fr 1fr;gap:8px}.video-creation .custom-field[data-control-kind=model]{grid-column:1}.video-creation .composer-controls .custom-field:has(select[name=duration]){grid-row:1;grid-column:2}.video-creation .composer-controls .custom-field:has(select[name=format]){grid-row:2;grid-column:1}.video-creation .composer-controls .custom-field:has(select[name=quality]){grid-row:2;grid-column:2}.video-creation .composer-bottom{display:block;padding-top:10px;margin-top:10px}.video-creation .generate-button{width:100%;min-height:45px}.video-creation .creation-content .creation-tabs{margin-bottom:5px}.video-guide{grid-template-columns:1fr;gap:22px;max-width:400px}.guide-step{display:grid;grid-template-columns:105px minmax(0,1fr);column-gap:15px}.guide-art{grid-row:1/span 2;height:110px;margin:0}.guide-step h3{align-self:end;font-size:13px}.guide-step>p{align-self:start;font-size:11px}.guide-upload{padding:6px}.guide-upload img{height:95px}.guide-prompt{padding:10px}.guide-prompt>p{font-size:9px;margin-top:10px}.guide-prompt>span{font-size:9px}.guide-result{padding:5px}.studio-welcome,.video-creation .studio-welcome{padding:24px 4px 15px;min-height:0}.welcome-copy{margin-bottom:28px}.welcome-copy h2,.image-welcome .welcome-copy h2{font-size:24px;letter-spacing:-.6px}.welcome-copy>p{font-size:11px}.starter-prompts{margin-top:25px;gap:6px}.starter-prompts button{font-size:10px;padding:8px}.image-creation .creation-content{order:0;min-height:0;overflow:visible;padding:0}.image-creation .creation-composer{order:1;display:block;width:100%;padding:12px;margin:0}.image-creation .composer-body{display:flex}.image-creation .composer-prompt textarea{min-height:70px}.image-creation .reference-tools{margin-right:1px}.image-creation .composer-controls{gap:6px}.image-creation .composer-controls .custom-field[data-control-kind=model]{grid-column:auto}.image-creation .composer-bottom{padding-top:12px;display:block}.image-creation .generate-button{min-height:44px;padding:10px;width:100%;margin-bottom:1px;flex-wrap:nowrap}.image-creation .studio-welcome{padding:28px 14px 32px;min-height:340px}.welcome-collage img{width:82px;height:94px}.welcome-collage img:nth-child(2){width:92px;height:107px}.image-creation .creation-tabs{padding:0 2px}.account-menu-panel{right:0;top:calc(100% + 9px)}.announcement{font-size:10px;padding:8px 35px 8px 12px;gap:8px;min-height:49px}.announcement>svg{display:none}.announcement>a{font-size:10px;padding:6px 8px}.announcement-close{right:5px}.has-announcement .topbar{top:49px}}
@media(prefers-reduced-motion:reduce){.guide-upload,.guide-prompt,.guide-result,.welcome-collage img{transition:none}}

.has-announcement .topbar{top:var(--announcement-height,44px)}
@media(max-width:760px){.product-nav>a{padding:10px;font-size:11px}.has-announcement .topbar>.navlinks.open{top:calc(62px + var(--announcement-height,49px))}}
body:has(.workspace) .panel{background:#181C1E;border-color:#2A3033;border-radius:12px;box-shadow:none}
body:has(.workspace) .custom-field .select-trigger{background:#22282B;border-color:#30393E}
.tool-workspace .composer-controls .select-trigger{border:0}
body:has(.workspace) .pill{background:transparent;border-color:#30383D;color:#89979E}
body:has(.workspace) .pill.active{background:#2B3439;color:#E6EDF1;border-color:#36424A}
body:has(.workspace) .search{background:#171C1E;border-color:#303A40}
body:has(.workspace) .workspace-menu{background:#222729;border-color:#354046}
body:has(.workspace) .modal-inner{background:#181D20;border-color:#303B42;border-radius:16px}
body:has(.workspace) .modal-inner .eyebrow{display:none}
body:has(.workspace) .modal-inner h2{font-size:22px;letter-spacing:-.5px}