/* Quiet dividers shared with the Gateway. Paint only: retain panel geometry,
   control states, scrollbar drag targets and all existing interaction layers. */
@layer customer-panel-refinement {
  /* Header actions share one continuous menu; retain its outer perimeter. */
  .editor-page .editor-command-menu :is(button, .editor-menu-group) {
    background-image: none !important;
    border-block-color: transparent !important;
  }
  /* Apply alpha to the surface, keeping labels and real tip samples opaque. */
  .editor-page :is(.editor-brush-menu, #editor-font-picker, #editor-property-panel, #editor-tool-settings-panel) {
    --customer-panel: rgba(0,0,0,.7);
    background-color: rgba(0,0,0,.7) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    color: #f5f5f5 !important;
  }
  .editor-page :is(.editor-brush-menu, #editor-font-picker) :is(button, [role=listbox], .editor-font-import),
  .editor-page .editor-brush-menu button > img {
    background: transparent !important;
    box-shadow: none !important;
    color: #f5f5f5 !important;
  }
  .editor-page :is(.editor-brush-menu, #editor-font-picker) button:is(:hover, :focus-visible) {
    background-color: rgba(255,255,255,.08) !important;
  }
  .editor-page :is(.editor-brush-menu, #editor-font-picker) button[aria-selected=true] {
    background-color: rgba(255,255,255,.13) !important;
    outline: none !important;
  }
  /* These selectors keep their quiet boundaries and focus rings, without the
     decorative white underline used by the earlier shared action treatment. */
  .editor-page #tool-contextual :is(#editor-tool-settings-toggle,.editor-active-tool,.editor-brush-choice),
  .editor-page #layer-blend-panel button,
  .editor-page #toggle-session-gallery {
    background-image: none !important;
    box-shadow: none !important;
  }
  .editor-page #tool-contextual :is(#editor-tool-settings-toggle,.editor-active-tool,.editor-brush-choice),
  .editor-page #toggle-session-gallery {
    --premium-border: #555 !important;
    border-color: #555 !important;
  }
  .editor-page #tool-contextual :is(#editor-tool-settings-toggle,.editor-active-tool,.editor-brush-choice):is([aria-expanded=true],[aria-pressed=true]),
  .editor-page #toggle-session-gallery[aria-expanded=true] {
    background-color: rgba(255,255,255,.08) !important;
    border-color: #777 !important;
  }
  .editor-page #generator-overlay .prompt-field,
  .editor-page #ai-region-controls #ai-region-prompt {
    border-color: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: var(--editor-divider) center bottom / 100% 1px no-repeat transparent !important;
  }
  .editor-page #generator-overlay .prompt-field #user-text {
    background: transparent !important;
    border-color: transparent !important;
  }
  .editor-page[data-ai-focus-modality=pointer] #ai-region-controls #ai-region-prompt:focus,
  .editor-page[data-ai-focus-modality=pointer] #generator-overlay #user-text:focus,
  .editor-page[data-ai-focus-modality=pointer] #generator-overlay .prompt-field:focus-within {
    outline: none !important;
  }
  .editor-page:not([data-ai-focus-modality=pointer]) #ai-region-controls #ai-region-prompt:focus-visible {
    outline: 1px solid #999 !important;
    outline-offset: 2px;
  }
}
.editor-page {
  --editor-panel-background:rgba(0,0,0,.8);
  --editor-panel-radius:8px;
  --editor-panel-text:#f5f5f5;
  --editor-panel-secondary:#aaa;
  --editor-panel-gap:12px;
  --editor-divider: linear-gradient(90deg, transparent, #ffffff60 20%, #ffffff60 80%, transparent);
  --editor-divider-vertical: linear-gradient(transparent, #ffffff60 20%, #ffffff60 80%, transparent);
}

/* Every editor dialog and panel uses the same visual language, including
   panels created on demand. No overlays, hit targets or layout changes. */
.editor-page :is(.live-studio .live-controls, .live-studio .live-layout-content, .live-body-drawer, .live-placement-section, .live-placement-drawer, dialog:not(.live-studio), [role="dialog"]:not(#generator-overlay):not(.live-studio), [role="tooltip"],
  .generator-window, #ai-region-controls, #session-gallery,
  #layer-settings-fields, #layer-blend-panel, .gallery-secondary-actions,
  .editor-command-menu, #editor-toolbar-content, .inspector-panel,
  #customer-generation-gallery) {
  border-color: transparent;
  background-image: var(--editor-divider), var(--editor-divider),
    var(--editor-divider-vertical), var(--editor-divider-vertical);
  background-position: center top, center bottom, left center, right center;
  background-size: 100% 1px, 100% 1px, 1px 100%, 1px 100%;
  background-repeat: no-repeat;
  scrollbar-color: #a0a0a0 transparent;
}

/* Important declarations in this layer take precedence over legacy button
   surfaces, including their selected/disabled rules, without specificity hacks. */
@layer editor-panel-controls {
.editor-page :is(.live-studio .live-controls, .live-studio .live-layout-content, .live-body-drawer, .live-placement-section, .live-placement-drawer, dialog:not(.live-studio), [role="dialog"]:not(#generator-overlay):not(.live-studio), [role="tooltip"],
  .generator-window, #ai-region-controls, #session-gallery,
  #layer-settings-fields, #layer-blend-panel, .gallery-secondary-actions,
  .editor-command-menu, #editor-toolbar-content, .inspector-panel,
  #customer-generation-gallery, #tool-contextual) {
  /* Plain text actions replace the boxed button surfaces. Artwork tiles,
     swatches, color fields and selected rows retain their visual meaning. */
  & :is(button, summary):not(:where(.patterns-card, .artifact-select, .generation-image-button,
    .editor-color-swatch, .color-swatch, .editor-color-field, #editor-recent-colors button,
    .layer-select, .layer-visibility, .layer-lock, .editor-tool,
    [role="slider"], .avatar-select, .generation-feedback-button,
    .export-primary, .start-primary, .editor-primary-apply)) {
    --premium-surface: transparent !important;
    --premium-text: #f5f5f5 !important;
    --premium-border: transparent !important;
    --premium-action-weight: 500 !important;
    --premium-hover-shadow: none;
    --premium-active-shadow: none;
    background: transparent !important;
    color: var(--premium-text) !important;
    border-color: transparent !important;
    box-shadow: none !important;
    font-weight: 500 !important;
    background-image: none !important;
    background-position: center bottom !important;
    background-size: 100% 1px !important;
    background-repeat: no-repeat !important;
    & :is(span, strong, b, small) {
      color: inherit !important;
      font-weight: 500 !important;
    }

    /* Keep existing pseudo-element glyphs (X, minimize, maximize) intact. */
    &:not(:where([aria-label*="Close" i], [aria-label*="Minimize" i],
      [aria-label*="Maximize" i], [aria-label*="Restore" i]))::before {
      background: transparent !important;
      border-color: transparent !important;
      box-shadow: none !important;
    }
    &:hover:not(:disabled) { --premium-surface: #ffffff0d !important; background-color: #ffffff0d !important; }
    &:is([aria-pressed="true"], [aria-checked="true"], [aria-selected="true"], [aria-current="step"],
      .editor-setting-selected, .editor-layer-setting-selected) {
      --premium-surface: #ffffff20 !important;
      background-color: #ffffff20 !important;
      box-shadow: none !important;
    }
    &:is(.danger, .destructive, [data-danger], [data-action="delete"],
      [data-editor-command="delete"]) { --premium-text: #ffb6b6 !important; }
    &:focus-visible { outline: 1px solid #fff !important; outline-offset: -2px; }
    &:disabled { opacity: .4; }
  }

  & :is(input:not(:where([type="range"], [type="checkbox"], [type="radio"],
      [type="color"], [type="file"], [type="hidden"])), select, textarea):not(.editor-color-field):not(:where(.patterns-family select)) {
    border-color: transparent !important;
    border-radius: 0 !important;
    background: var(--editor-divider) center bottom / 100% 1px no-repeat transparent !important;
    color: #f5f5f5 !important;
    box-shadow: none !important;
    &:focus-visible { outline: 1px solid #c8c8c8 !important; outline-offset: -1px; }
    &[aria-invalid="true"] { outline: 1px solid #ffb6b6 !important; }
  }
  & option { background: #080808; color: #f5f5f5; }
}
}

.editor-page :is(.live-studio .live-controls, .live-studio .live-layout-content, .live-body-drawer, .live-placement-section, .live-placement-drawer, dialog:not(.live-studio), [role="dialog"]:not(#generator-overlay):not(.live-studio), [role="tooltip"],
  .generator-window, #ai-region-controls, #session-gallery,
  #layer-settings-fields, #layer-blend-panel, .gallery-secondary-actions,
  .editor-command-menu, #editor-toolbar-content, .inspector-panel,
  #customer-generation-gallery, #tool-contextual) {
  & :is(header, .results-heading, .gallery-heading, .export-heading,
    .editor-color-heading, .editor-start-heading, .credit-dialog-heading,
    .panel-section-heading, .ai-region-panel-heading, .patterns-primary,
    .smart-fields, .generator-mode-row, .generator-reference-area,
    .generation-feedback, .export-actions, .start-actions) {
    border-color: transparent;
    background-image: var(--editor-divider);
    background-position: center bottom;
    background-size: 100% 1px;
    background-repeat: no-repeat;
  }
  & :is(.generator-mode-row, .generator-reference-area, .generation-feedback) {
    padding-bottom: 12px;
  }
  & :is(.generator-body, .results-grid, [id$="-fields"], .patterns-fields) {
    scrollbar-color: #a0a0a0 transparent;
  }
  & .editor-slider-track::before {
    height: 1px;
    top: 11px;
    background: var(--editor-divider);
  }
  & .editor-slider-fill { height: 1px; top: 11px; }
  & .editor-slider-thumb {
    width: 6px; height: 10px; top: 7px; margin-left: -3px;
    border-radius: 1px;
  }
}

/* The horizontal settings bar shares the panel controls, with a single lower
   divider and vertical separators between its existing functional groups. */
.editor-page #tool-contextual {
  border-bottom-color: transparent;
  background-image: var(--editor-divider);
  background-position: center bottom;
  background-size: 100% 1px;
  background-repeat: no-repeat;
}
.editor-page #tool-properties > :not(button):not(input):not(select):not(textarea) + :not(button):not(input):not(select):not(textarea) {
  padding-inline-start:var(--editor-panel-gap);
  margin-inline-start:4px;
  background-image: var(--editor-divider-vertical);
  background-position: left center;
  background-size: 1px 100%;
  background-repeat: no-repeat;
}
@layer editor-panel-controls {
  /* Keep scrolled controls from showing through the sticky tool title. */
  .editor-page #tool-contextual :is(#editor-tool-settings-toggle, .editor-active-tool) {
    background-color: #000 !important;
  }
  .editor-page #tool-contextual button[aria-expanded="true"] {
    box-shadow: none !important;
    background-color: rgba(255,255,255,.08) !important;
  }
}

.editor-page #generator-overlay .prompt-field,
.editor-page #generator-overlay .prompt-field:focus-within {
  border-color: transparent;
  border-radius: 0;
  background: var(--editor-divider) center bottom / 100% 1px no-repeat;
  box-shadow: none;
}

.editor-page :is(.panel-section-heading, .editor-tool-settings-header,
  #editor-effect-handle, .editor-canvas-panel-header, .editor-color-heading,
  .editor-start-heading, .export-heading, .gallery-preview-heading,
  #session-gallery > .results-heading, .generator-header,
  .ai-region-panel-heading) {
  border-bottom-color: transparent;
  background-image: var(--editor-divider);
  background-position: center bottom;
  background-size: 100% 1px;
  background-repeat: no-repeat;
}

.editor-page :is(.editor-text-section:not(:first-child), .editor-text-layout,
  .editor-text-shadow, .editor-command-menu .editor-menu-group) {
  border-top-color: transparent;
  background-image: var(--editor-divider);
  background-position: center top;
  background-size: 100% 1px;
  background-repeat: no-repeat;
}

/* Fading perimeter lines replace solid popup outlines without adding overlays
   that could cover close buttons or other pointer targets. */
.editor-page :is(#editor-tool-settings-panel, #editor-canvas-panel,
  #editor-color-panel, #editor-property-panel, #layer-settings-fields,
  .editor-command-menu, .editor-export-dialog, .editor-start-dialog,
  #gallery-preview) {
  border-color: transparent;
  background-image: var(--editor-divider), var(--editor-divider),
    var(--editor-divider-vertical), var(--editor-divider-vertical);
  background-position: center top, center bottom, left center, right center;
  background-size: 100% 1px, 100% 1px, 1px 100%, 1px 100%;
  background-repeat: no-repeat;
}

/* Native panel scrollbars stay familiar and retain their existing width.
   The tool-properties proxy remains the sole scrollbar for that toolbar. */
.editor-page :is(.inspector-panel, .layer-list, .history-list,
  .editor-tool-grid, .generator-body, .results-grid,
  #editor-tool-settings-fields, #editor-effect-fields, #editor-canvas-fields,
  #editor-properties-scroll, .editor-command-menu, .editor-export-dialog,
  .editor-start-dialog) {
  scrollbar-color: #737373 transparent;
}
.editor-page #editor-properties-scroll { background-color: transparent; }

/* Canvas rails keep the full original 14px hit areas. Only their painted
   track/thumb becomes a fine line; position and length still come from JS. */
.editor-page .canvas-scrollbar.canvas-scrollbar-horizontal {
  background: var(--editor-divider) center / 100% 1px no-repeat #080808;
}
.editor-page .canvas-scrollbar.canvas-scrollbar-vertical {
  background: var(--editor-divider-vertical) center / 1px 100% no-repeat #080808;
}
.editor-page .canvas-scrollbar {
  --editor-scroll-thumb: #a0a0a0;
}
.editor-page .canvas-scrollbar:hover { --editor-scroll-thumb: #d0d0d0; }
.editor-page .canvas-scrollbar:active { --editor-scroll-thumb: #fff; }
.editor-page .canvas-scrollbar.canvas-scrollbar-horizontal .canvas-scrollbar-thumb {
  background: linear-gradient(90deg, transparent, var(--editor-scroll-thumb) 12%,
    var(--editor-scroll-thumb) 88%, transparent) center / 100% 2px no-repeat;
}
.editor-page .canvas-scrollbar.canvas-scrollbar-vertical .canvas-scrollbar-thumb {
  background: linear-gradient(transparent, var(--editor-scroll-thumb) 12%,
    var(--editor-scroll-thumb) 88%, transparent) center / 2px 100% no-repeat;
}
.editor-page .canvas-scrollbar:focus-visible {
  outline-color: #d8d8d8;
}

/* Respect high-contrast preferences instead of relying on subtle gradients. */
@media (forced-colors: active) {
  .editor-page :is(#editor-tool-settings-panel, #editor-canvas-panel,
    #editor-color-panel, #editor-property-panel, #layer-settings-fields,
    .editor-command-menu, .editor-export-dialog, .editor-start-dialog,
    #gallery-preview) { border-color: CanvasText; }
  .editor-page .canvas-scrollbar.canvas-scrollbar-horizontal,
  .editor-page .canvas-scrollbar.canvas-scrollbar-vertical {
    background: Canvas;
  }
  .editor-page .canvas-scrollbar.canvas-scrollbar-horizontal .canvas-scrollbar-thumb,
  .editor-page .canvas-scrollbar.canvas-scrollbar-vertical .canvas-scrollbar-thumb {
    background: ButtonText;
  }
}
/* Complete the established floating Editor panel treatment.
   Keep ancestors of viewport-positioned popups free of backdrop-filter. */
.editor-page :is(#editor-tool-settings-panel,#editor-property-panel,#editor-effect-panel,
  #editor-canvas-panel,#editor-color-panel,#layer-settings-fields,#layer-blend-panel,
  #editor-patterns-panel,#editor-smart-panel,.generator-window,#ai-region-controls,
  #session-gallery,#gallery-preview,.editor-command-menu,.editor-export-dialog,
  .editor-start-dialog,.credit-dialog,.gallery-secondary-actions,.generator-help,
  #customer-generation-gallery) {
  background-color:var(--editor-panel-background);
  color:var(--editor-panel-text);
  border-radius:var(--editor-panel-radius);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
  scrollbar-width:thin;
  scrollbar-color:#737373 transparent;
}
.editor-page :is(.inspector-panel,#editor-toolbar-content) {
  background-color:var(--editor-panel-background);
}
.editor-page :is(.navigator-panel,.layers-panel,.history-panel) {
  border-inline:0;border-radius:0;
}
.editor-page :is(.generator-body,.results-grid,.patterns-fields,.layer-list,.history-list,
  #editor-tool-settings-fields,#editor-effect-fields,#editor-canvas-fields,
  #editor-smart-panel-fields,.editor-command-menu,.editor-export-dialog) {
  scrollbar-width:thin;scrollbar-color:#737373 transparent;
}
.editor-page :is(.editor-text-layout,.editor-text-shadow,.smart-preview-section) {
  border-inline:0;border-bottom:0;border-radius:0;background-color:transparent;
  padding-block:var(--editor-panel-gap);
}
.editor-page :is(.generator-header,.ai-region-panel-heading,.export-heading,
  .editor-start-heading,.gallery-preview-heading) {gap:var(--editor-panel-gap)}
.editor-page :is(.export-heading,.editor-start-heading,.gallery-preview-heading) {padding-bottom:12px}
.editor-page :is(.generator-reference-toolbar,.gallery-actions,.export-actions) {gap:8px;flex-wrap:wrap}
.editor-page :is(.generator-title-group,.generator-reference-toolbar,.prompt-heading) {min-width:0}
.editor-page .generator-title-group > div {min-width:0}
.editor-page .generator-title-group h1 {overflow-wrap:anywhere}
.editor-page :is(.generator-reference-guidance,.generation-tip,.export-note,.patterns-intro) {
  color:var(--editor-panel-secondary);line-height:1.5;
}

/* The prompt is a text field followed by a separate action row. */
.editor-page #generator-overlay .prompt-field {gap:12px;padding:0 0 12px}
.editor-page #generator-overlay .prompt-field #user-text {padding:12px;line-height:1.5}
.editor-page #generator-overlay .generator-submit-row {
  align-items:center;flex-wrap:wrap;gap:12px;padding:0 8px;
}
.editor-page #generator-overlay .generator-submit-row .ai-mode-unavailable {
  flex:1 1 140px;max-width:none;overflow-wrap:anywhere;
}
.editor-page #generator-overlay #generate-button {inset:auto;flex:none}
.editor-page #generator-overlay .generator-reference-area {margin-top:12px}

/* Keep action hierarchy and the family selector above the legacy line controls
   in the same existing cascade layer. Native selection behavior is unchanged. */
.editor-page #editor-patterns-panel .patterns-family {padding-block:4px 12px}
.editor-page #editor-patterns-panel .patterns-family label {
  display:grid;grid-template-columns:minmax(0,1fr);gap:7px;color:#eee;
}
.editor-page #editor-patterns-panel .patterns-family label > span {
  font-size:10px;letter-spacing:.08em;font-weight:650;
}
.editor-page #editor-patterns-panel .patterns-family select {
  min-height:38px;height:38px;cursor:pointer;font-weight:600;
}
.editor-page .topbar-actions :is(#editor-patterns-trigger,#editor-placement-trigger,#open-local,#export-button) {
  --premium-action-radius:5px;gap:5px;height:30px;min-height:30px;
}
.editor-page #editor-placement-trigger .editor-action-logo {filter:none}
.editor-page :is(#editor-patterns-trigger,#editor-placement-trigger)[aria-expanded=true] {
  outline:1px solid #fff;outline-offset:2px;
}
@layer editor-panel-controls {
  .editor-page #editor-patterns-panel .patterns-family select {
    width:100%;
    padding:8px 32px 8px 12px !important;
    background-color:#181818 !important;color:#f5f5f5 !important;
    border:1px solid #666 !important;border-radius:5px !important;
    background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%) !important;
    background-position:right 15px center,right 10px center !important;
    background-size:5px 5px !important;background-repeat:no-repeat !important;
    line-height:1.4;
  }
  .editor-page #editor-patterns-panel .patterns-family select:hover {
    background-color:#242424 !important;border-color:#aaa !important;
  }
  .editor-page #editor-patterns-panel .patterns-family select:is(:focus-visible,:open) {
    outline:2px solid #fff !important;outline-offset:3px !important;
  }
  .editor-page #editor-patterns-panel .patterns-family select:disabled {opacity:.4;cursor:not-allowed}
  .editor-page :is(.export-primary,.start-primary,.editor-primary-apply) {
    --premium-surface:#f5f5f5 !important;--premium-text:#111 !important;
    color:#111 !important;background:#f5f5f5 !important;border-radius:5px !important;
  }
  .editor-page :is(.export-primary,.start-primary,.editor-primary-apply):hover:not(:disabled) {
    background:#fff !important;
  }
  .editor-page :is(.export-primary,.start-primary,.editor-primary-apply) :is(span,strong) {color:inherit !important}
  .editor-page :is(.export-primary,.start-primary,.editor-primary-apply):disabled {opacity:.4}
  .editor-page .topbar-actions #editor-placement-trigger {
    --premium-surface:#181818 !important;--premium-text:#f5f5f5 !important;
    --premium-border:#666 !important;background:#181818 !important;color:#f5f5f5 !important;
  }
  .editor-page .topbar-actions #editor-placement-trigger > span {color:inherit !important}
  .editor-page :is(#open-local,#export-button,#editor-patterns-trigger,#editor-placement-trigger):disabled {opacity:.4}
  .editor-page #editor-presentation-toggle {
    --premium-surface:#181818 !important;--premium-text:#eee !important;
    --premium-border:#555 !important;border-radius:5px !important;
  }
  .editor-page #editor-presentation-toggle[aria-pressed=true] {box-shadow:none !important;background-color:#ffffff20 !important}
  .editor-page #toggle-session-gallery {border-radius:5px !important}
  .editor-page #toggle-session-gallery[aria-expanded=true] {box-shadow:inset 3px 0 #555 !important}
  .editor-page :is(#editor-presentation-toggle,#toggle-session-gallery,#editor-patterns-trigger,#editor-placement-trigger,#open-local,#export-button):focus-visible {
    outline:2px solid #fff !important;outline-offset:2px;
  }
}
@media(max-width:600px) {
  .editor-page .topbar-actions {
    min-width:0;max-width:100%;justify-content:flex-start;
    overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;
    scrollbar-color:#737373 transparent;padding-inline:8px;
  }
  .editor-page .topbar-actions > nav {flex:none}
}
@media(max-width:420px) {
  .editor-page #generator-overlay .generator-header {gap:8px;padding-inline:12px}
  .editor-page #generator-overlay .generator-title-group {gap:6px}
  .editor-page #generator-overlay .generator-title-group h1 {
    font-size:12px;line-height:1.25;white-space:normal;
  }
  .editor-page #generator-overlay .generate-form {padding:14px 12px}
  .editor-page #generator-overlay .prompt-heading {gap:8px;align-items:flex-start}
  .editor-page #generator-overlay .generator-reference-toolbar {row-gap:10px}
}

/* Shared group spacing leaves a full label inset after each vertical divider.
   The existing scroll proxy and sticky tool owner retain their layout roles. */
.editor-page #tool-properties {gap:8px;padding-inline-end:12px}
.editor-page #tool-properties > :is(label,.editor-slider,.editor-preview-actions,.editor-guardrails-control) {flex-shrink:0}
.editor-page #tool-properties :is(label,.editor-property-value,.editor-preview-actions) {gap:8px}
.editor-page #tool-properties .editor-top-primary {gap:8px;padding-inline-end:8px}
.editor-page #generator-overlay :is(.prompt-field,.prompt-field:focus-within) {border:0;background:none;box-shadow:none}

/* Equal side regions reserve the viewport center for the existing Gallery
   launcher, independent of unequal menu and file-action widths. */
.editor-page .editor-topbar,
.editor-page[data-editor-presentation] .editor-topbar {
  grid-template-columns:minmax(0,1fr) 144px minmax(0,1fr);
}
.editor-page .editor-header-leading {
  grid-column:1;grid-row:1;display:flex;align-items:center;min-width:0;height:100%;
}
.editor-page .editor-header-leading > .editor-brand {flex:0 1 auto;max-width:9.4rem}
.editor-page[data-editor-presentation=modern] .editor-header-leading > .editor-brand {
  flex:0 0 calc(var(--editor-rail-width) + 4px);
}
.editor-page .editor-header-leading > .editor-toolbar {flex:1;min-width:0}
.editor-page .editor-topbar > .topbar-actions {grid-column:3;grid-row:1;min-width:0}
@media(max-width:1120px) {
  .editor-page {--editor-topbar-height:72px}
  .editor-page .editor-topbar,
  .editor-page[data-editor-presentation] .editor-topbar {
    grid-template-rows:36px 36px;
  }
  .editor-page .editor-topbar > .topbar-actions {
    grid-column:3;grid-row:1;height:36px;max-width:100%;
    justify-content:flex-start;overflow-x:auto;overscroll-behavior-x:contain;
  }
  .editor-page .editor-header-leading {display:contents}
  .editor-page .editor-header-leading > .editor-brand {grid-column:1;grid-row:1}
  .editor-page .editor-header-leading > .editor-toolbar {grid-column:1 / -1;grid-row:2;align-self:center}
  .editor-page .topbar-actions > nav {flex:none}
  @layer customer-panel-refinement {
    .editor-page #toggle-session-gallery {top:3px !important}
  }
}
@media(max-width:600px) {
  .editor-page .editor-topbar > .topbar-actions {justify-content:flex-start}
  .editor-page[data-editor-presentation=modern] .editor-header-leading > .editor-brand {flex-basis:54px}
}

@media(max-width:360px) {
  .editor-page .editor-topbar,.editor-page[data-editor-presentation] .editor-topbar {
    grid-template-columns:minmax(0,1fr) 136px minmax(0,1fr);
  }
  .editor-page .editor-topbar > .topbar-actions {padding-inline:0}
}
/* Match the rail toggle to the 30px tool-name button's existing vertical inset. */
.editor-page[data-editor-presentation=modern] {--editor-widget-offset:3px}
.editor-page .tool-rail {padding-top:9px}
.editor-page .layers-panel #editor-boundaries {left:-6px}
.editor-page[data-editor-presentation=modern] #editor-toolbar-content {
  top:calc(var(--editor-topbar-height) + 62px + var(--editor-widget-offset));
}

/* The one Gallery panel belongs to its centered header launcher in either UI. */
.editor-page #session-gallery {
  position:fixed !important;left:50vw !important;right:auto !important;
  top:calc(var(--editor-topbar-height) + 8px) !important;bottom:auto !important;
  width:min(460px,calc(100vw - 24px)) !important;
  height:min(560px,calc(100dvh - var(--editor-topbar-height) - 20px)) !important;
  max-width:calc(100vw - 24px);max-height:calc(100dvh - var(--editor-topbar-height) - 20px);
  min-width:0;min-height:0;box-sizing:border-box;
  transform:translateX(-50%) !important;translate:0 0;transition:none !important;
}
.editor-page #session-gallery:not([hidden]) {animation:session-gallery-enter 260ms cubic-bezier(.2,.7,.2,1) both}
@keyframes session-gallery-enter {
  from {translate:0 calc(-100% - var(--editor-topbar-height) - 8px)}
  to {translate:0 0}
}
@media(prefers-reduced-motion:reduce) {
  .editor-page #session-gallery:not([hidden]) {animation:none}
}
.editor-page #credit-dialog .credit-dialog-heading > h2 {min-width:0;margin:0}

/* Retain the original intrinsic button width and symbol; center only the caption. */
.editor-page #editor-placement-trigger{position:relative}
.editor-page #editor-placement-trigger .editor-placement-label::before{content:"3D PLACEMENT";visibility:hidden}
.editor-page #editor-placement-trigger .editor-placement-caption{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}