@charset "UTF-8";
/* A compact phone workspace uses the existing prompt and generation controls. */
.mobile-studio-intro,.mobile-composer-actions,.mobile-workshop-tools{display:none}
@media(max-width:900px){
 #studio.signed-in .topbar{padding-inline:18px;height:64px}
 #studio.signed-in .topbar .breadcrumb{display:none}
 #studio.signed-in .topbar-actions{width:100%;gap:8px}
 #studio.signed-in .quick-command{display:inline-flex;min-width:44px;width:44px;height:44px;padding:10px;margin-right:auto;color:var(--muted)}
 #studio.signed-in .quick-command .keycap{display:none}
 #studio.signed-in .quick-command>.icon{width:20px;height:20px}
 #studio.signed-in .workspace{padding:20px 18px 30px}
 #studio.signed-in[data-view=create]:not(.has-result):not(.generating) .mobile-studio-intro{display:flex;flex-direction:column;align-items:center;padding:38px 0 30px;gap:12px}
 #studio.signed-in .mobile-studio-intro .brand{gap:10px;letter-spacing:0}
 #studio.signed-in .mobile-studio-intro .brand-mark{width:35px;height:37px;border-radius:10px}
 #studio.signed-in .mobile-studio-intro .workspace-wordmark{font-size:32px;font-weight:650}
 #studio.signed-in .mobile-studio-intro .brand-ai{color:var(--muted)}
 #studio.signed-in .mobile-studio-intro p{font-size:12px;color:var(--muted);letter-spacing:-.1px}
 #studio.signed-in[data-view=create]:not(.has-result):not(.generating) .screen-intro{display:none}
 #studio.signed-in .creation-grid{gap:0}
 #studio.signed-in .creation-main .composer{padding:16px;border-radius:22px;background:var(--panel);box-shadow:inset 0 1px 0 #ffffff06;display:flex;flex-direction:column;margin:0}
 #studio.signed-in.has-result .creation-main .composer,#studio.signed-in[data-view=edit] .creation-main .composer{margin-top:20px}
 #studio.signed-in .composer-heading{margin:0}
 #studio.signed-in .composer-heading label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
 #studio.signed-in #clearPrompt{display:none}
 #studio.signed-in #prompt{min-height:76px;height:76px;max-height:260px;padding:0 2px;font-size:16px;line-height:1.6;resize:vertical}
 #studio.signed-in .creation-main .composer .composer-footer{display:grid;grid-template-columns:44px minmax(0,1fr) 44px auto;gap:6px;align-items:center;flex-wrap:nowrap;border:0;padding:10px 0 0;margin:0;order:1}
 #studio.signed-in .creation-main .composer .composer-footer>.text-button,#studio.signed-in .creation-main .composer .composer-footer>.prompt-count{display:none}
 #studio.signed-in .mobile-composer-actions{display:contents}
 #studio.signed-in .creation-main .composer .mobile-composer-icon{display:grid;place-items:center;width:44px;height:44px;min-width:44px;padding:10px;border:1px solid var(--line);background:var(--hover);border-radius:50%}
 #studio.signed-in .mobile-composer-icon .icon{width:19px;height:19px}
 #studio.signed-in #mobileParameterSummary{display:flex;align-items:center;gap:6px;padding:9px 10px;margin:0;height:44px;min-height:44px;min-width:0;border:1px solid var(--line);border-radius:22px;background:var(--hover);font-size:12px;color:var(--text)}
 #studio.signed-in #mobileParameterSummary strong{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:500;flex:1;text-align:left}
 #studio.signed-in #mobileParameterSummary>.icon{width:15px;height:15px}
 #studio.signed-in #mobileParameterSummary>span:first-child{display:none}
 #studio.signed-in #mobileParameterSummary>span:last-child .icon{width:11px;height:11px}
 #studio.signed-in .composer-footer>#run{min-width:58px;min-height:44px;height:44px;padding:10px 12px;border-radius:22px;font-size:0;gap:5px;white-space:nowrap;line-height:1}
 #studio.signed-in .composer-footer>#run:before{content:"";width:15px;height:15px;display:block;flex-shrink:0;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m12 2 3 7 7 3-7 3-3 7-3-7-7-3 7-3Z'/%3E%3C/svg%3E") center/contain no-repeat}
 #studio.signed-in .composer-footer>#run:after{content:attr(data-mobile-label);font-size:12px;font-weight:650;line-height:1}
 #studio.signed-in .composer-tools{display:none;order:2;margin:12px 0 0}
 #studio.signed-in .composer-tools:has(#undoImprovedPrompt:not(.hidden)){display:flex}
 #studio.signed-in .composer-tools>*{display:none}
 #studio.signed-in .composer-tools #undoImprovedPrompt:not(.hidden){display:inline-flex}
 #studio.signed-in .under-composer{font-size:10px;line-height:1.7;margin:11px 2px 0;gap:0}
 #studio.signed-in .mobile-workshop-tools{display:flex;order:3;gap:8px;overflow-x:auto;scrollbar-width:none;padding:8px 0;margin:12px 0 0;min-width:0;overscroll-behavior-x:contain}
 #studio.signed-in .mobile-workshop-tools::-webkit-scrollbar{display:none}
 #studio.signed-in .mobile-workshop-tools button{min-height:38px;flex-shrink:0;padding:9px 12px;border:1px solid var(--line);border-radius:22px;background:var(--panel);font-size:11px;gap:7px}
 #studio.signed-in .mobile-workshop-tools .icon{width:14px;height:14px;color:var(--muted)}
 #studio.signed-in .prompt-ideas{display:none}
 #studio.signed-in .creation-main>.starter{margin-top:26px}
 #studio.signed-in .section-heading h3{font-size:16px;letter-spacing:-.35px}
 #studio.signed-in .section-heading .eyebrow{font-size:8px}
 #studio.signed-in .starter-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(145px,45%);gap:12px;overflow-x:auto;scroll-snap-type:x proximity;overscroll-behavior-x:contain;scrollbar-width:thin;padding:0 0 10px;min-width:0}
 #studio.signed-in .workspace-idea{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;height:auto;padding:0;overflow:visible;border:0;background:transparent;border-radius:0;isolation:auto;scroll-snap-align:start;text-align:left;transform:none!important}
 #studio.signed-in .workspace-idea:after{display:none}
 #studio.signed-in .workspace-idea>img{aspect-ratio:1;height:auto;border-radius:13px;transform:none!important;transition:none}
 #studio.signed-in .workspace-idea .idea-art-meta{top:9px;left:9px;max-width:calc(100% - 18px);font-size:7px;padding:4px 6px;backdrop-filter:none;background:#0a0b0dd9}
 #studio.signed-in .workspace-idea .idea-art-label{position:static;display:flex;align-items:flex-start;gap:8px;margin:11px 0 0;color:var(--text);font-size:14px;line-height:1.4;text-shadow:none;letter-spacing:-.25px}
 #studio.signed-in .workspace-idea .idea-art-label small{font-size:10px;line-height:1.5;color:var(--muted);margin-top:5px}
 #studio.signed-in .workspace-idea .idea-art-label>.icon{width:13px;height:13px;margin-top:3px;color:var(--muted)}
 #studio.signed-in .starter-example-note{font-size:10px}
 #studio.signed-in .creation-grid>#imageParameters{display:none}
 #mobileParametersDialog{position:fixed;inset:auto 0 0;margin:0;width:100%;max-width:none;max-height:88dvh;border-radius:24px 24px 0 0;padding:22px 20px calc(22px + env(safe-area-inset-bottom));--dialog-pad:20px}
 #mobileParametersDialog>.dialog-heading{margin:-22px -20px 24px;padding:24px 20px 18px}
 #mobileParametersDialog .dialog-heading h2{font-size:25px}
 #mobileParametersDialog #imageParameters{position:static;display:grid;grid-template-columns:minmax(0,1fr);gap:24px;border:0;border-radius:0;background:transparent;padding:0;margin:0;box-shadow:none;font-size:13px}
 #mobileParametersDialog #imageParameters>h3,#mobileParametersDialog .parameter-note{display:none}
 #mobileParametersDialog .parameter-field label{font-size:13px}
 #mobileParametersDialog select{font-size:16px;min-height:44px}
 #mobileParametersDialog .native-size{display:none}
 #mobileParametersDialog .field-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}
 #mobileParametersDialog .field-heading label{margin:0}
 #mobileParametersDialog .ratio-options{display:flex;gap:8px}
 #mobileParametersDialog .ratio-options button{flex:1;min-width:0;min-height:60px;flex-direction:column;gap:7px;padding:9px 4px;font-size:12px}
 #mobileParametersDialog .style-options{display:flex;flex-wrap:wrap;gap:8px}
 #mobileParametersDialog .style-options button{min-height:42px;font-size:12px}
 #mobileParametersDialog :is([data-size],[data-style])[aria-pressed=true]{border-color:var(--visual-accent);color:var(--visual-accent);background:var(--dialog-soft)}
 #mobileParametersDialog .parameter-field>small{display:block;font-size:11px;color:var(--muted);margin-top:10px}
 #mobileParametersDialog .parameter-cost{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:18px;margin:0}
}
@media(max-width:359px){
 #studio.signed-in .workspace{padding-inline:12px}
 #studio.signed-in .creation-main .composer{padding:14px 12px}
 #studio.signed-in #mobileParameterSummary{padding-inline:7px;gap:4px}
 #studio.signed-in #mobileParameterSummary>span:first-child{display:none}
 #studio.signed-in .mobile-studio-intro{padding-block:30px 24px}
}