/* Scene configurator: dashboard layout on larger screens, guided flow on phones. */
#screen-scene.active {
  display: block;
  color: #171b32;
}
#screen-scene [hidden] { display: none !important; }

#screen-scene .scene-header {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  max-width: 1420px;
  margin: 0 auto 18px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  text-align: left;
}

#screen-scene .scene-back-btn {
  flex: 0 0 auto;
  min-height: 40px;
  margin: 0;
  padding: 0 12px;
  border: 1px solid #e7e9f0;
  border-radius: 11px;
  background: #fff;
}

#screen-scene .scene-heading-copy { min-width: 0; }
#screen-scene .scene-heading-copy h1 {
  margin: 0;
  color: #171b32;
  font-size: clamp(25px, 2.3vw, 34px);
  font-weight: 760;
  line-height: 1.15;
  letter-spacing: -.8px;
}
#screen-scene .scene-heading-copy .scene-intro {
  margin: 5px 0 0;
  color: #777d91;
  font-size: 14px;
  line-height: 1.45;
}

#screen-scene .scene-layout {
  display: grid;
  grid-template-columns: minmax(280px, .82fr) minmax(0, 1.18fr);
  grid-template-areas: "preview config" "library config";
  align-items: start;
  gap: 14px 18px;
  width: min(100%, 1420px);
  margin: 0 auto;
}
#screen-scene .scene-preview-column { grid-area: preview; min-width: 0; }
#screen-scene .scene-config-column { grid-area: config; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
#screen-scene .scene-library-column { grid-area: library; min-width: 0; }
#screen-scene .scene-preview {
  margin: 0;
  padding: 12px;
  border: 1px solid #e7e9f0;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(20, 24, 45, .03);
}
#screen-scene .scene-preview-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 1px 10px; }
#screen-scene .scene-preview-heading strong { display: inline-flex; align-items: center; gap: 7px; color: #272c46; font-size: 14px; }
#screen-scene .scene-preview-heading strong svg { color: #6247f4; }
#screen-scene .scene-preview-heading > span { padding: 6px 9px; border: 1px solid #ece9fb; border-radius: 9px; background: #faf9ff; color: #62559b; font-size: 11px; font-weight: 650; }
#screen-scene .scene-preview-frame {
  width: 100%;
  max-width: none;
  aspect-ratio: 3 / 4;
  border-radius: 14px;
}
#screen-scene .scene-preview-frame img { object-fit: cover; }

#screen-scene #scene-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: visible;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
#screen-scene #scene-form > .scene-card,
#screen-scene .scene-examples,
#screen-scene #scene-library {
  margin: 0;
  padding: 15px 17px;
  border: 1px solid #e7e9f0;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(20, 24, 45, .03);
}
#screen-scene .scene-card-header { margin: 0 0 11px; }
#screen-scene .scene-card-header h3 { margin: 0; color: #171b32; font-size: 16px; line-height: 1.3; }
#screen-scene .scene-card-header p:not(.sr-only) { display: block; margin: 3px 0 0; color: #81869a; font-size: 12px; line-height: 1.4; }
#screen-scene .scene-grid { gap: 9px; }
#screen-scene .scene-texture-grid { gap: 8px; }
#screen-scene .scene-choice.has-image { overflow: hidden; }
#screen-scene .scene-choice-image { display: block; max-width: 100%; object-fit: cover; }
#screen-scene #scene-surfaces .scene-choice {
  position: relative;
  min-height: 84px;
  justify-content: flex-start;
  gap: 12px;
  padding: 9px;
  text-align: left;
}
#screen-scene #scene-surfaces .scene-choice::before {
  content: '';
  display: block;
  flex: 0 0 78px;
  height: 64px;
  border-radius: 9px;
  background: repeating-linear-gradient(14deg, #e9d0a6 0 11px, #d8bd91 12px 13px, #f0dfc0 14px 27px);
}
#screen-scene #scene-surfaces .scene-choice:nth-child(2)::before {
  background: repeating-linear-gradient(135deg, #f3ead9 0 4px, #e5d8c2 5px 7px, #f6f0e5 8px 13px);
}
#screen-scene #scene-surfaces .scene-choice.has-image::before { display: none; }
#screen-scene #scene-surfaces .scene-choice-image { flex: 0 0 78px; width: 78px; height: 64px; border-radius: 9px; }
#screen-scene #scene-surfaces .scene-choice[aria-pressed="true"]::after,
#screen-scene #scene-textures .scene-choice[aria-pressed="true"]::after {
  content: '✓';
  position: absolute;
  top: 8px;
  right: 8px;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #6247f4;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}
#screen-scene #scene-textures .scene-choice {
  position: relative;
  display: block;
  padding: 7px;
  text-align: left;
}
#screen-scene #scene-textures .scene-choice::before {
  content: '';
  display: block;
  width: 100%;
  height: 72px;
  margin-bottom: 7px;
  border-radius: 9px;
  background: repeating-radial-gradient(ellipse at 50% 50%, #e7dbc7 0 3px, #d3c1a8 4px 6px, #f4ebde 7px 10px);
}
#screen-scene #scene-textures .scene-choice.has-image::before { display: none; }
#screen-scene #scene-textures .scene-choice-image { width: 100%; height: 72px; margin-bottom: 7px; border-radius: 9px; }
#screen-scene #scene-textures .scene-choice:nth-child(2)::before { background: repeating-linear-gradient(0deg, #e5d9c7 0 4px, #f5eee3 5px 8px); }
#screen-scene #scene-textures .scene-choice:nth-child(3)::before { background: repeating-linear-gradient(45deg, #dfd0bb 0 4px, #f5eee3 5px 10px, #ccb99f 11px 14px); }
#screen-scene #scene-textures .scene-choice:nth-child(4)::before { background: radial-gradient(circle, #f3eadc 0 31%, #d9c9b3 32% 54%, #f0e6d7 56%); background-size: 19px 19px; }
#screen-scene .scene-choice { border-color: #e7e9f0; border-radius: 12px; background: #fff; }
#screen-scene .scene-choice[aria-pressed="true"] { border-color: #6346f5; background: #f1eeff; }
#screen-scene .scene-choice.is-locked {
  position: relative;
  border-style: dashed;
  border-color: #d8d5e8;
  background: #fbfaff;
  color: #6f7487;
  cursor: pointer;
}
#screen-scene .scene-choice.is-locked.has-image .scene-choice-image { opacity: .72; }
#screen-scene .scene-choice.is-locked .scene-color-swatch { opacity: .72; }
#screen-scene .scene-choice-lock {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 21px;
  height: 21px;
  box-sizing: border-box;
  border-radius: 50%;
  background: #6247f4;
  color: #fff;
  box-shadow: 0 2px 6px rgba(51, 40, 137, .18);
}
#screen-scene .scene-choice-lock svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
#screen-scene .scene-advanced summary .scene-choice-lock {
  position: static;
  width: auto;
  height: auto;
  min-height: 21px;
  margin-left: auto;
  padding: 3px 7px;
  border-radius: 999px;
  background: #f1eeff;
  color: #5c45db;
  box-shadow: none;
  font-size: 9px;
  font-weight: 700;
}
#screen-scene .scene-advanced summary .scene-choice-lock svg { width: 11px; height: 11px; }
#screen-scene .scene-advanced details.is-locked input:disabled,
#screen-scene .scene-advanced details.is-locked textarea:disabled {
  background: #f7f7fb;
  color: #85899a;
  cursor: not-allowed;
}
#scene-example-recreate.is-locked { position: relative; padding-right: 38px; border-color: #a89cf8; background: #f2efff; color: #5541c8; }
#scene-example-recreate.is-locked .scene-choice-lock { top: 50%; right: 10px; transform: translateY(-50%); }
#screen-scene .scene-object-chip-image { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 9px; object-fit: contain; background: #f7f6fb; }
#screen-scene #scene-object-picker .scene-choice.has-image { display: flex; flex-direction: column; justify-content: flex-start; width: 108px; min-height: 112px; padding: 7px; text-align: center; }
#screen-scene #scene-object-picker .scene-choice-image { width: 100%; height: 74px; object-fit: contain; }
#screen-scene .scene-color-grid { gap: 8px; }
#screen-scene .scene-color-grid .scene-choice { min-height: 92px; padding: 9px 5px; }
#screen-scene .scene-color-swatch { width: 44px; height: 44px; }
#screen-scene .scene-advanced { margin: 0; padding: 0 4px; }
#screen-scene .scene-credit-note { margin: 0 3px; color: #7b8194; font-size: 11px; }
#screen-scene #scene-generate-btn { display: flex; align-items: center; justify-content: center; gap: 11px; width: 100%; min-height: 48px; margin: 0; border-radius: 12px; }
#screen-scene .scene-generate-icon { display: grid; flex: 0 0 38px; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: rgba(255,255,255,.17); }
#screen-scene .scene-generate-icon svg { width: 19px; height: 19px; }
#screen-scene .scene-generate-spinner {
  width: 19px;
  height: 19px;
  border: 2px solid rgba(255,255,255,.42);
  border-top-color: #fff;
  border-radius: 50%;
  animation: scene-generation-spin .8s linear infinite;
}
#screen-scene .scene-generate-copy { display: flex; flex: 1; flex-direction: column; gap: 2px; min-width: 0; text-align: left; }
#screen-scene .scene-generate-copy strong { color: #fff; font-size: 14px; font-weight: 750; line-height: 1.2; }
#screen-scene .scene-generate-copy small { color: rgba(255,255,255,.82); font-size: 11px; font-weight: 550; line-height: 1.2; }
#screen-scene .scene-generate-arrow { display: grid; flex: 0 0 31px; place-items: center; width: 31px; height: 31px; border: 1px solid rgba(255,255,255,.32); border-radius: 50%; color: #fff; font-size: 20px; line-height: 1; }
#screen-scene .scene-status { margin: 0; }
#screen-scene .scene-mobile-panel,
#screen-scene .scene-stepper,
#screen-scene .scene-mobile-actions { display: none; }
#screen-scene .scene-preview-carousel-track,
#screen-scene .scene-preview-carousel-dots { display: none; }
#screen-scene .scene-library-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#screen-scene .scene-library-actions { justify-content: stretch; }
#screen-scene .scene-library-actions button { width: 100%; }
#screen-scene .scene-plan-note { margin: 10px 0 0; padding: 11px 13px; font-size: 11px; }
#screen-scene .scene-example-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#screen-scene .scene-example-option { padding: 6px; border-radius: 12px; }
#screen-scene .scene-example-option strong { font-size: 11px; }

.scene-generation-notice {
  position: fixed;
  z-index: 10050;
  left: 50%;
  bottom: calc(88px + var(--safe-b, 0px));
  display: flex;
  align-items: center;
  gap: 11px;
  width: min(calc(100vw - 24px), 430px);
  padding: 12px;
  border: 1px solid #e7e4fb;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(29, 27, 60, .2);
  color: #171b32;
  transform: translateX(-50%);
}
.scene-generation-notice[hidden],
.scene-generation-notice-open[hidden],
.scene-generation-notice-spinner[hidden] { display: none !important; }
.scene-generation-notice-spinner {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  border: 2px solid #e6e1ff;
  border-top-color: #6247f4;
  border-radius: 50%;
  animation: scene-generation-spin .8s linear infinite;
}
.scene-generation-notice-copy { display: flex; flex: 1; flex-direction: column; gap: 3px; min-width: 0; }
.scene-generation-notice-copy strong { font-size: 13px; line-height: 1.25; }
.scene-generation-notice-copy > span { color: #73798d; font-size: 11px; line-height: 1.4; }
.scene-generation-notice-open {
  flex: 0 0 auto;
  min-height: 36px;
  padding: 0 11px;
  border: 0;
  border-radius: 10px;
  background: #6247f4;
  color: #fff;
  font: inherit;
  font-size: 11px;
  font-weight: 700;
}
.scene-generation-notice-dismiss {
  align-self: flex-start;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #f4f3fa;
  color: #74798b;
  font: inherit;
  font-size: 18px;
  line-height: 1;
}
#scene-generation-notice[data-state="complete"] { border-color: #d8f0df; }
#scene-generation-notice[data-state="error"] { border-color: #f3d6d6; }
@keyframes scene-generation-spin { to { transform: rotate(360deg); } }

@media (min-width: 768px) {
  .scene-generation-notice { display: none !important; }
}

@media (min-width: 768px) and (max-width: 1100px) {
  #screen-scene.active { padding-inline: 24px; }
  #screen-scene .scene-layout { grid-template-columns: minmax(235px, .8fr) minmax(0, 1.2fr); gap: 12px; }
  #screen-scene .scene-texture-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #screen-scene .scene-color-grid .scene-choice { min-height: 76px; }
}

@media (max-width: 767px) {
  #screen-scene.active {
    display: block;
    width: 100%;
    max-width: none;
    height: 100dvh;
    margin: 0 !important;
    padding: calc(0px + var(--safe-t, 0px)) 14px calc(18px + var(--safe-b, 0px)) !important;
    overflow-x: hidden;
    overflow-y: auto;
    border: 0;
    border-radius: 0;
    background: #f8f9fc;
  }
  #screen-scene .scene-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 60;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    margin: 0 -14px 14px;
    padding: calc(9px + var(--safe-t, 0px)) 14px 10px;
    border-bottom: 1px solid #eceef4;
    background: rgba(255,255,255,.96);
    box-shadow: 0 2px 8px rgba(20, 24, 45, .04);
    backdrop-filter: blur(12px);
  }
  #screen-scene .scene-header::after { display: none; }
  #screen-scene .scene-back-btn {
    display: grid;
    place-items: center;
    width: 38px;
    min-height: 38px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #f5f3ff;
    color: #5f45ed;
  }
  #screen-scene .scene-back-btn span { display: none; }
  #screen-scene .scene-heading-copy h1 { font-size: 16px; line-height: 1.25; letter-spacing: -.25px; }
  #screen-scene .scene-heading-copy .scene-intro { display: none; }
  #screen-scene .scene-layout {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    margin: 0;
  }
  #screen-scene .scene-preview-column,
  #screen-scene .scene-config-column { display: contents; }
  #screen-scene .scene-preview { width: 100%; margin: 0; padding: 0; border: 0; border-radius: 17px; background: transparent; box-shadow: none; }
  #screen-scene .scene-preview-heading { display: none; }
  #screen-scene .scene-preview-frame {
    width: min(100%, 430px);
    max-height: 62dvh;
    aspect-ratio: 3 / 4;
    margin: 0 auto;
    border: 0;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(30, 34, 55, .1);
  }
  #screen-scene .scene-preview-badge { top: 10px; left: 10px; }
  #screen-scene .scene-preview-expand { top: auto; right: 10px; bottom: 10px; }
  #screen-scene .scene-preview-tags { left: 10px; bottom: 10px; }
  #screen-scene .scene-mobile-panel {
    width: 100%;
    padding: 15px;
    border: 1px solid #eceef4;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 3px 12px rgba(20, 24, 45, .04);
  }
  #screen-scene .scene-mobile-panel h2 { margin: 0 0 5px; color: #171b32; font-size: 20px; line-height: 1.2; letter-spacing: -.45px; }
  #screen-scene .scene-mobile-panel p { margin: 0 0 13px; color: #7b8194; font-size: 12px; line-height: 1.5; }
  #screen-scene .scene-action.primary { min-height: 52px; border-radius: 14px; font-size: 14px; }
  #screen-scene[data-mobile-step="intro"] #scene-preview-frame { touch-action: auto; user-select: none; }
  #screen-scene[data-mobile-step="intro"] .scene-preview-carousel-track:not([hidden]) {
    position: absolute;
    inset: 0;
    z-index: 0;
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scroll-behavior: auto;
    scrollbar-width: none;
    touch-action: pan-x pan-y;
  }
  #screen-scene[data-mobile-step="intro"] .scene-preview-carousel-track::-webkit-scrollbar { display: none; }
  #screen-scene[data-mobile-step="intro"] .scene-preview-carousel-slide {
    position: relative;
    flex: 0 0 100%;
    width: 100%;
    height: 100%;
    min-width: 0;
    box-sizing: border-box;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }
  #screen-scene[data-mobile-step="intro"] .scene-preview-carousel-slide > img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    object-fit: cover;
  }
  #screen-scene[data-mobile-step="intro"] .scene-preview-carousel-add-slide {
    display: grid;
    place-items: center;
    padding: 12px;
    background: radial-gradient(circle at 50% 38%, #fff 0, #f4f1ff 58%, #eae6ff 100%);
  }
  #screen-scene[data-mobile-step="intro"] .scene-preview-add-button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding: 32px;
    border: 1px dashed #c9c1fa;
    border-radius: 16px;
    background: rgba(255,255,255,.55);
    color: #292445;
    font: inherit;
    text-align: center;
  }
  #screen-scene[data-mobile-step="intro"] .scene-preview-add-plus {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    border: 1px solid #dcd5ff;
    border-radius: 24px;
    background: #fff;
    color: #6247f4;
    font-size: 46px;
    font-weight: 400;
    line-height: 1;
    box-shadow: 0 8px 22px rgba(98,71,244,.14);
  }
  #screen-scene[data-mobile-step="intro"] .scene-preview-add-button strong { font-size: 20px; font-weight: 750; }
  #screen-scene[data-mobile-step="intro"] .scene-preview-add-button small { max-width: 230px; color: #777d91; font-size: 13px; line-height: 1.45; }
  #screen-scene[data-mobile-step="intro"] .scene-preview-add-button:disabled { opacity: .55; cursor: not-allowed; }
  #screen-scene #scene-mobile-start { min-height: 52px; font-size: 15px; }
  #screen-scene[data-mobile-step="intro"] .scene-preview-carousel-dots:not([hidden]) {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 28px;
    padding: 5px 0 1px;
  }
  #screen-scene[data-mobile-step="intro"] .scene-preview-carousel-dot {
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
  }
  #screen-scene[data-mobile-step="intro"] .scene-preview-carousel-dot::before {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 99px;
    background: #d9d7e3;
    transition: width .2s ease, background-color .2s ease;
  }
  #screen-scene[data-mobile-step="intro"] .scene-preview-carousel-dot.is-active::before {
    width: 19px;
    background: #6247f4;
  }
  #screen-scene .scene-stepper {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 3px;
    width: 100%;
    margin: 0;
    padding: 2px 0 7px;
    list-style: none;
  }
  #screen-scene .scene-stepper li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 5px; min-width: 0; color: #858ba0; }
  #screen-scene .scene-stepper li::before { content: ''; position: absolute; top: 15px; left: -50%; width: 100%; height: 2px; background: #e9eaf1; }
  #screen-scene .scene-stepper li:first-child::before { display: none; }
  #screen-scene .scene-stepper li > span { position: relative; z-index: 1; display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid #e5e7ef; border-radius: 50%; background: #fff; color: #777e93; font-size: 12px; font-weight: 700; }
  #screen-scene .scene-stepper li small { overflow: hidden; max-width: 100%; color: inherit; font-size: 9px; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
  #screen-scene .scene-stepper li.is-current { color: #6247f4; }
  #screen-scene .scene-stepper li.is-current > span { border-color: #6247f4; background: #6247f4; color: #fff; box-shadow: 0 4px 10px rgba(98,71,244,.25); }
  #screen-scene .scene-stepper li.is-complete > span { border-color: #6247f4; background: #6247f4; color: transparent; }
  #screen-scene .scene-stepper li.is-complete > span::after { content: '✓'; position: absolute; color: #fff; font-size: 14px; }
  #screen-scene[data-mobile-step-count="2"] .scene-stepper li[data-scene-progress="texture"],
  #screen-scene[data-mobile-step-count="2"] .scene-stepper li[data-scene-progress="objects"] { display: none; }
  #screen-scene #scene-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: visible;
    border: 0;
    background: transparent;
    box-shadow: none;
  }
  #screen-scene[data-mobile-step="objects"] #scene-form,
  #screen-scene[data-mobile-step="color"][data-mobile-step-count="2"] #scene-form { padding-bottom: calc(174px + var(--safe-b, 0px)); }
  #screen-scene #scene-form > .scene-card,
  #screen-scene #scene-library,
  #screen-scene .scene-examples {
    width: 100%;
    margin: 0;
    padding: 15px;
    border: 1px solid #eceef4;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 3px 12px rgba(20, 24, 45, .04);
  }
  #screen-scene #scene-form > [data-scene-step] { display: none; }
  #screen-scene[data-mobile-step="surface"] #scene-form > [data-scene-step="surface"],
  #screen-scene[data-mobile-step="color"] #scene-form > [data-scene-step="color"],
  #screen-scene[data-mobile-step="texture"] #scene-form > [data-scene-step="texture"],
  #screen-scene[data-mobile-step="objects"] #scene-form > [data-scene-step="objects"] { display: block; }
  #screen-scene .scene-card-header { margin-bottom: 12px; }
  #screen-scene .scene-card-header h3 { color: #171b32; font-size: 18px; }
  #screen-scene .scene-card-header h3 svg { display: none; }
  #screen-scene .scene-card-header p:not(.sr-only) { display: block; margin-top: 4px; font-size: 12px; }
  #screen-scene .scene-grid { gap: 10px; }
  #screen-scene #scene-surfaces { grid-template-columns: minmax(0, 1fr); }
  #screen-scene #scene-surfaces .scene-choice { min-height: 0; flex-direction: column; align-items: stretch; gap: 8px; padding: 8px; font-size: 15px; }
  #screen-scene #scene-surfaces .scene-choice::before { flex-basis: auto; width: 100%; height: min(42vw, 155px); }
  #screen-scene #scene-surfaces .scene-choice-image { flex-basis: auto; width: 100%; height: min(42vw, 155px); }
  #screen-scene .scene-texture-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  #screen-scene .scene-texture-grid .scene-choice { min-height: 0; padding: 7px; font-size: 12px; }
  #screen-scene #scene-textures .scene-choice::before { height: min(24vw, 92px); }
  #screen-scene .scene-color-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  #screen-scene .scene-color-grid .scene-choice { min-height: 82px; padding: 8px 4px; font-size: 11px; }
  #screen-scene .scene-color-swatch { width: 40px; height: 40px; }
  #screen-scene .scene-more-colors { min-height: 82px; }
  #screen-scene .scene-object-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  #screen-scene .scene-object-grid .scene-choice { width: 100%; }
  #screen-scene[data-mobile-step="objects"] .scene-object-add { display: none; }
  #screen-scene #scene-object-picker { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 8px; padding: 0; border: 0; border-radius: 0; background: transparent; }
  #screen-scene #scene-object-picker .scene-choice.has-image { width: 100%; min-height: 0; padding: 6px; border: 1px solid #eceef4; border-radius: 12px; background: #fff; font-size: 10px; }
  #screen-scene #scene-object-picker .scene-choice-image { height: min(21vw, 82px); margin-bottom: 4px; }
  #screen-scene .scene-object-chip-image { flex-basis: 32px; width: 32px; height: 32px; }
  #screen-scene .scene-advanced { display: none; margin: 0; padding: 0; }
  #screen-scene[data-mobile-step="objects"] .scene-advanced { display: block; }
  #screen-scene .scene-mobile-actions { position: sticky; bottom: calc(8px + var(--safe-b, 0px)); z-index: 20; display: flex; gap: 9px; padding: 8px 0; background: linear-gradient(180deg, rgba(248,249,252,0), #f8f9fc 22%); }
  #screen-scene .scene-mobile-actions button,
  #screen-scene #scene-done-edit { min-height: 46px; padding: 0 15px; border: 1px solid #e7e9f0; border-radius: 12px; background: #fff; color: #555d73; font: inherit; font-size: 13px; font-weight: 700; }
  #screen-scene .scene-mobile-actions #scene-mobile-next { flex: 1; border-color: #6247f4; background: #6247f4; color: #fff; box-shadow: 0 7px 16px rgba(98,71,244,.2); }
  #screen-scene[data-mobile-step="objects"] .scene-mobile-actions,
  #screen-scene[data-mobile-step="color"][data-mobile-step-count="2"] .scene-mobile-actions { display: none; }
  #screen-scene #scene-credit-note,
  #screen-scene #scene-generate-btn { display: none; }
  #screen-scene[data-mobile-step="objects"] #scene-credit-note,
  #screen-scene[data-mobile-step="color"][data-mobile-step-count="2"] #scene-credit-note { display: block; margin: 0 3px; font-size: 11px; }
  #screen-scene[data-mobile-step="objects"] #scene-generate-btn,
  #screen-scene[data-mobile-step="color"][data-mobile-step-count="2"] #scene-generate-btn {
    position: fixed;
    left: 50%;
    bottom: calc(104px + var(--safe-b, 0px));
    z-index: 1001;
    display: flex;
    align-items: center;
    gap: 11px;
    width: min(calc(100vw - 28px), 430px);
    min-height: 62px;
    margin: 0;
    padding: 9px 15px;
    border-radius: 16px;
    box-shadow: 0 10px 28px rgba(76, 54, 207, .3), 0 2px 7px rgba(27, 29, 55, .12);
    transform: translateX(-50%);
  }
  #screen-scene .scene-status { width: 100%; margin: 0; }
  #screen-scene .scene-examples { padding: 14px; }
  #screen-scene .scene-example-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  #screen-scene .scene-library-column { display: contents; }
  #screen-scene #scene-library { display: block; }
  #screen-scene .scene-library-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #screen-scene .scene-library-actions button { min-height: 42px; }
  #screen-scene .scene-plan-note { padding: 11px 12px; font-size: 11px; }
  #screen-scene[data-mobile-step="intro"] .scene-mobile-panel#scene-mobile-intro,
  #screen-scene[data-mobile-step="done"] .scene-mobile-panel#scene-mobile-done { display: block; }
  #screen-scene[data-mobile-step="intro"] #scene-mobile-stepper,
  #screen-scene[data-mobile-step="done"] #scene-mobile-stepper,
  #screen-scene[data-mobile-step="intro"] #scene-form,
  #screen-scene[data-mobile-step="done"] #scene-form { display: none; }
  #screen-scene[data-mobile-step="intro"] .scene-preview,
  #screen-scene[data-mobile-step="done"] .scene-preview { display: block; }
  #screen-scene[data-mobile-step="surface"] .scene-preview,
  #screen-scene[data-mobile-step="color"] .scene-preview,
  #screen-scene[data-mobile-step="texture"] .scene-preview,
  #screen-scene[data-mobile-step="objects"] .scene-preview { display: none; }
  #screen-scene[data-mobile-step="surface"] #scene-mobile-intro,
  #screen-scene[data-mobile-step="color"] #scene-mobile-intro,
  #screen-scene[data-mobile-step="texture"] #scene-mobile-intro,
  #screen-scene[data-mobile-step="objects"] #scene-mobile-intro,
  #screen-scene[data-mobile-step="intro"] #scene-mobile-done,
  #screen-scene[data-mobile-step="surface"] #scene-mobile-done,
  #screen-scene[data-mobile-step="color"] #scene-mobile-done,
  #screen-scene[data-mobile-step="texture"] #scene-mobile-done,
  #screen-scene[data-mobile-step="objects"] #scene-mobile-done { display: none; }
  #screen-scene[data-mobile-step="intro"] #scene-mobile-stepper,
  #screen-scene[data-mobile-step="done"] #scene-mobile-stepper { display: none; }
  #screen-scene[data-mobile-step="intro"] .scene-examples,
  #screen-scene[data-mobile-step="intro"] .scene-library-column { display: contents; }
  #screen-scene[data-mobile-step="intro"] .scene-examples { display: block; }
  #screen-scene[data-mobile-step="intro"] #scene-library { display: none; }
  #screen-scene[data-mobile-step="done"] .scene-examples,
  #screen-scene[data-mobile-step="done"] .scene-library-column,
  #screen-scene[data-mobile-step="surface"] .scene-examples,
  #screen-scene[data-mobile-step="surface"] .scene-library-column,
  #screen-scene[data-mobile-step="color"] .scene-examples,
  #screen-scene[data-mobile-step="color"] .scene-library-column,
  #screen-scene[data-mobile-step="texture"] .scene-examples,
  #screen-scene[data-mobile-step="texture"] .scene-library-column,
  #screen-scene[data-mobile-step="objects"] .scene-examples,
  #screen-scene[data-mobile-step="objects"] .scene-library-column { display: none; }
  #screen-scene[data-mobile-step="done"] .scene-mobile-panel { display: block; }
  #screen-scene #scene-mobile-done { display: none; }
  #screen-scene[data-mobile-step="done"] #scene-mobile-done { display: block; }
  #screen-scene[data-mobile-step="done"] #scene-mobile-done #scene-done-edit { width: 100%; margin: 0 0 8px; }
  #screen-scene[data-mobile-step="done"] #scene-done-use { width: 100%; }
}
