/* Resizing must outrank the contained studio's fixed, ID-scoped grid widths. */
.generation-studio .gp-panel,.gs-quick-shell>.gp-panel{position:relative;min-width:0;box-sizing:border-box}
#view-studio .gs-sidebar.gp-panel{position:relative;gap:8px;padding-right:14px}
.generation-studio .gs-chat-header,.gs-quick-shell .gs-chat-header{flex-wrap:wrap;gap:8px;align-items:center}
.generation-studio .gs-chat-header>div,.gs-quick-shell .gs-chat-header>div{flex:1;min-width:0}
#view-studio .gs-planner .gs-chat-header>.gp-toggle,.generation-studio .gs-chat-header>.gp-toggle,.gs-quick-shell .gs-chat-header>.gp-toggle{flex:0 0 auto;margin-left:auto;min-height:36px;padding:8px 12px;background:#ea580c;border:1px solid #c2410c;color:#fff;font-size:12px;font-weight:700;line-height:1.3;white-space:normal;max-width:100%;box-shadow:0 2px 6px #0002}
#view-studio .gs-planner .gs-chat-header>.gp-toggle:hover,.generation-studio .gs-chat-header>.gp-toggle:hover,.gs-quick-shell .gs-chat-header>.gp-toggle:hover{background:#c2410c;border-color:#9a3412}
#view-studio .gs-planner .gs-chat-header>.gp-toggle:focus-visible,.generation-studio .gs-chat-header>.gp-toggle:focus-visible,.gs-quick-shell .gs-chat-header>.gp-toggle:focus-visible{outline:3px solid #fb923c;outline-offset:3px}
.generation-studio .gp-chat-collapsed .gs-planner>:not(.gs-chat-header),.gs-quick-shell>.gp-chat-collapsed>:not(.gs-chat-header):not(.gp-resize){display:none!important}
#view-studio .gp-chat-collapsed [data-scene-planner]{flex:0 0 auto}
#view-studio .gp-chat-collapsed .gs-planner{height:auto}
.gp-chat-collapsed .gs-chat-header{margin-bottom:0!important;border-bottom:0!important;padding-bottom:0!important}
.gp-resize{position:absolute;right:0;top:0;bottom:0;width:12px;cursor:col-resize;touch-action:none;z-index:9;border-radius:5px}
.gp-resize:after{content:"";position:absolute;top:30%;bottom:30%;right:3px;width:4px;border-radius:3px;background:#ea580c}
.gp-nav-resize{flex:0 0 12px;min-height:12px;position:relative;cursor:row-resize;touch-action:none;margin:-4px 0;border-radius:4px}
.gp-nav-resize:after{content:"";position:absolute;left:35%;right:35%;top:4px;height:4px;border-radius:3px;background:#ea580c}
.gp-resize:hover,.gp-nav-resize:hover{background:#ea580c22}
.gp-resize:focus-visible,.gp-nav-resize:focus-visible{outline:2px solid #ea580c;outline-offset:1px}
.gp-nav-resize[hidden]{display:none!important}
.gp-resizing{user-select:none}
@media(min-width:901px){
  #view-studio .gs-layout.gp-layout{grid-template-columns:var(--gp-width,320px) minmax(0,1fr);gap:14px}
  .generation-studio .gs-layout.gp-layout{grid-template-columns:var(--gp-width,320px) minmax(0,1fr);gap:14px}
  .generation-studio .gs-sidebar.gp-panel{padding-right:14px}
  #view-studio .gp-panel>.gs-path{height:var(--gp-nav-height,220px);min-height:0;flex:0 0 auto;overflow:auto;overscroll-behavior:contain}
  #view-studio .gs-sidebar.gp-chat-collapsed>.gs-path{height:auto;max-height:70%;overflow:auto}
}
@media(min-width:801px){
  .gs-quick-shell.gp-layout{grid-template-columns:var(--gp-width,320px) minmax(0,1fr)}
  .gs-quick-shell.gp-collapsed{grid-template-columns:180px minmax(0,1fr)}
  .gs-quick-shell>.gp-panel{padding-right:24px}
}
@media(max-width:900px){
  #view-studio .gs-layout.gp-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,var(--gp-height,240px)) minmax(0,1fr);gap:10px}
  #view-studio .gs-sidebar.gp-panel{display:grid;grid-template-columns:minmax(105px,.7fr) minmax(0,1.3fr);grid-template-rows:minmax(0,1fr);position:relative!important;top:auto;height:100%;max-height:none!important;overflow:hidden;padding:0 0 14px;gap:8px}
  #view-studio .gp-panel>.gs-path{grid-column:1;grid-row:1;height:auto;min-height:0;overflow:auto}
  #view-studio .gp-panel>[data-scene-planner]{grid-column:2;grid-row:1;height:100%;min-width:0}
  #view-studio .gp-panel .gs-planner-log-wrap{max-height:none;min-height:0}
  .generation-studio .gp-panel>.gp-resize{left:0;right:0;top:auto;bottom:0;height:14px;width:auto;cursor:row-resize}
  .generation-studio .gp-panel>.gp-resize:after{top:5px;bottom:auto;left:35%;right:35%;height:4px;width:auto}
}
@media(max-width:800px){
  .gs-quick-shell>.gp-panel{max-height:var(--gp-height,240px);overflow:auto;padding-bottom:14px}
  .gs-quick-shell>.gp-panel>.gp-resize{left:0;right:0;top:auto;bottom:0;height:14px;width:auto;cursor:row-resize}
  .gs-quick-shell>.gp-panel>.gp-resize:after{top:5px;bottom:auto;left:35%;right:35%;height:4px;width:auto}
}
/* Size action and step buttons to the actual workflow column, including small laptops. */
.generation-studio .gs-flow{container-type:inline-size}
.generation-studio .gs-card-footer{flex-wrap:wrap;max-width:100%;gap:8px}
.generation-studio .gs-card-footer>.gs-button{min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere;justify-content:center;text-align:center;font-size:clamp(12px,2.5cqi,15px);padding:clamp(8px,2cqi,12px) clamp(10px,3cqi,20px)}
.generation-studio .gs-step-nav>.gs-button{flex:1;min-width:0;max-width:100%;overflow-wrap:anywhere}
.generation-studio .gs-step-title-row>.gs-step-heading{min-width:0;min-height:clamp(60px,14cqi,90px)!important;padding:clamp(12px,3cqi,23px)!important;gap:clamp(8px,2cqi,17px)!important}
.generation-studio .gs-step-heading h2{font-size:clamp(16px,4cqi,23px);overflow-wrap:anywhere}
@container(max-width:520px){
  .generation-studio .gs-card-footer>.gs-button{width:100%}
  .generation-studio .gs-step-nav{padding:10px;gap:8px}
  .generation-studio .gs-step-nav>.gs-button{padding:9px 6px;font-size:12px}
  .generation-studio .gs-step-help{margin-right:8px;padding:6px;min-width:30px}
  .generation-studio .gs-step-help>span:last-child{display:none}
}
/* Steps and scene chat panel: hidden by default, toggled from the studio tools. */
.generation-studio.gp-sidebar-hidden .gs-sidebar{display:none!important}
#view-studio .gp-sidebar-hidden .gs-layout.gp-layout,.generation-studio.gp-sidebar-hidden .gs-layout.gp-layout{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)!important}
#view-studio .gp-sidebar-hidden .gs-flow,.generation-studio.gp-sidebar-hidden .gs-flow{grid-row:1!important;grid-column:1!important}
/* On large monitors the studio stays within 60% of the screen; smaller screens use the full width. */
@media(min-width:1600px){#view-studio>.generation-studio:not(.gs-workspace-expanded){width:100%;max-width:60vw;margin-inline:auto}}
