.seedream-page {
  min-height: 100vh;
  color: var(--sc-color-ink);
  background: var(--sc-color-canvas);
  font-family: var(--sc-font-sans);
}

.seedream-page .seedream-hero { padding-top: clamp(1.25rem, 3vw, 2.5rem); padding-bottom: var(--sc-space-6); }
.seedream-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.84fr) minmax(360px, 1.16fr);
  grid-template-areas:
    "copy create"
    "visual visual";
  align-items: start;
  row-gap: clamp(1.25rem, 3vw, 2rem);
  column-gap: clamp(2rem, 7vw, 7rem);
}
.seedream-hero__copy { grid-area: copy; display: grid; gap: var(--sc-space-5); }
.seedream-hero__copy .sc-title-display { max-width: 12ch; }
.seedream-hero__copy .sc-lede { max-width: 58ch; }
.seedream-hero__chips { display: flex; flex-wrap: wrap; gap: var(--sc-space-2); }
.seedream-chip { min-height: 2.25rem; display: inline-flex; align-items: center; padding: 0.45rem 0.8rem; border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-pill); color: var(--sc-color-text); background: var(--sc-color-surface); font-size: 0.78rem; font-weight: 700; box-shadow: var(--sc-shadow-sm); }

.seedream-hero__visual { grid-area: visual; min-height: clamp(15rem, 24vw, 19rem); position: relative; }
.seedream-hero__image { position: absolute; overflow: hidden; margin: 0; border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-xl); background: var(--sc-color-surface-muted); box-shadow: var(--sc-shadow-lg); }
.seedream-hero__image img { width: 100%; height: 100%; display: block; object-fit: cover; }
.seedream-hero__image--large { inset: 0 4rem 2rem 0; transform: rotate(-2deg); }
.seedream-hero__image--small { width: 47%; height: 48%; right: 0; bottom: 0; transform: rotate(4deg); box-shadow: var(--sc-shadow-md); }
.seedream-hero__stamp { position: absolute; top: 1.25rem; right: 1.1rem; width: 5.2rem; height: 5.2rem; display: grid; place-content: center; border: 1px solid var(--sc-color-brand-200); border-radius: 50%; color: var(--sc-color-brand-800); background: var(--sc-color-brand-50); font-size: 1.2rem; font-weight: 850; line-height: 0.9; text-align: center; transform: rotate(8deg); box-shadow: var(--sc-shadow-sm); }
.seedream-hero__stamp small { margin-top: 0.25rem; font-size: 0.55rem; letter-spacing: 0.12em; }

.seedream-page .seedream-create { grid-area: create; position: relative; z-index: 2; min-width: 0; margin-top: 0; padding-block: 0; }
.seedream-home-chat { width: min(100%, 54rem); margin-inline: auto; }
.seedream-home-chat .home-chat__input { min-height: 3.25rem; }
.seedream-composer__form { display: grid; gap: var(--sc-space-5); }
.seedream-composer__fields { display: grid; grid-template-columns: minmax(220px, 0.78fr) minmax(0, 1.6fr); gap: var(--sc-space-5); }
.seedream-reference, .seedream-prompt { display: grid; align-content: start; gap: var(--sc-space-2); }
.seedream-upload { min-height: 11.5rem; display: flex; align-items: center; gap: var(--sc-space-4); padding: var(--sc-space-5); border: 1px dashed var(--sc-color-brand-200); border-radius: var(--sc-radius-lg); color: var(--sc-color-text); background: var(--sc-color-brand-50); cursor: pointer; text-align: left; transition: border-color var(--sc-motion-fast) var(--sc-ease), background var(--sc-motion-fast) var(--sc-ease), transform var(--sc-motion-fast) var(--sc-ease); }
.seedream-upload:hover { border-color: var(--sc-color-brand-500); background: var(--sc-color-surface); transform: translateY(-1px); }
.seedream-upload:focus-visible { outline: 3px solid rgba(16, 185, 129, 0.25); outline-offset: 3px; }
.seedream-upload__icon { width: 2.75rem; height: 2.75rem; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid var(--sc-color-brand-200); border-radius: 0.75rem; color: var(--sc-color-brand-700); background: var(--sc-color-surface); font-size: 1.5rem; font-weight: 400; }
.seedream-upload__copy { display: grid; gap: 0.35rem; }
.seedream-upload__copy strong { font-size: 0.92rem; }
.seedream-upload__copy small { color: var(--sc-color-muted); font-size: 0.76rem; line-height: 1.5; }
.seedream-prompt__input { min-height: 11.5rem; resize: vertical; }
.seedream-prompt__meta { display: flex; justify-content: space-between; gap: var(--sc-space-3); color: var(--sc-color-subtle); font-size: 0.75rem; }
.seedream-reference-list { display: flex; flex-wrap: wrap; gap: var(--sc-space-2); min-height: 0; }
.seedream-reference-list:not(:empty) { padding-top: var(--sc-space-2); }
.seedream-reference-item { position: relative; width: 3.5rem; height: 3.5rem; overflow: hidden; border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-md); background: var(--sc-color-surface-muted); }
.seedream-reference-item img { width: 100%; height: 100%; display: block; object-fit: cover; }
.seedream-reference-remove { position: absolute; top: 0.2rem; right: 0.2rem; width: 1.65rem; height: 1.65rem; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, 0.8); border-radius: 50%; color: var(--sc-color-ink); background: rgba(255, 255, 255, 0.9); cursor: pointer; font-size: 1rem; line-height: 1; }
.seedream-reference-remove:hover { color: var(--sc-color-danger); }
.seedream-form-message { margin: 0; color: var(--sc-color-danger); font-size: 0.8rem; line-height: 1.5; }
.seedream-form-status { margin: 0; padding: var(--sc-space-3) var(--sc-space-4); border-radius: var(--sc-radius-md); color: var(--sc-color-text); background: var(--sc-color-surface-muted); font-size: 0.84rem; line-height: 1.5; }
.seedream-form-status[data-state="error"] { color: var(--sc-color-danger); background: #fff1f2; }
.seedream-form-status[data-state="loading"] { color: var(--sc-color-brand-800); background: var(--sc-color-brand-50); }
.seedream-composer__toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sc-space-2); padding-top: var(--sc-space-2); }
.seedream-mode-chip, .seedream-menu-button { min-height: var(--sc-control-height); display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.65rem 0.8rem; border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-md); color: var(--sc-color-text); background: var(--sc-color-surface-muted); font: 700 0.8rem/1 var(--sc-font-sans); }
.seedream-mode-chip { color: var(--sc-color-brand-800); background: var(--sc-color-brand-50); }
.seedream-menu-control { position: relative; }
.seedream-menu-button { cursor: pointer; }
.seedream-menu-button:hover:not(:disabled), .seedream-menu-button[aria-expanded="true"] { border-color: var(--sc-color-brand-200); color: var(--sc-color-brand-800); background: var(--sc-color-brand-50); }
.seedream-menu-button:disabled { opacity: 0.55; cursor: wait; }
.seedream-menu { position: absolute; z-index: 10; left: 0; bottom: calc(100% + 0.5rem); min-width: 13rem; max-height: 18rem; overflow-y: auto; padding: 0.4rem; border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-md); background: var(--sc-color-surface); box-shadow: var(--sc-shadow-lg); }
.seedream-menu[hidden] { display: none; }
.seedream-menu-item { width: 100%; min-height: 2.75rem; display: flex; align-items: center; gap: 0.55rem; padding: 0.55rem 0.65rem; border: 0; border-radius: var(--sc-radius-sm); color: var(--sc-color-text); background: transparent; cursor: pointer; font: 650 0.8rem/1.3 var(--sc-font-sans); text-align: left; }
.seedream-menu-item:hover, .seedream-menu-item[aria-checked="true"] { color: var(--sc-color-brand-800); background: var(--sc-color-brand-50); }
.seedream-menu-item:disabled { color: var(--sc-color-subtle); background: var(--sc-color-surface-muted); cursor: not-allowed; }
.seedream-menu-item:focus-visible { outline: 3px solid rgba(16, 185, 129, 0.2); outline-offset: -2px; }
.seedream-generate { margin-left: auto; min-width: 13rem; }

.seedream-section-intro { max-width: 720px; margin-bottom: var(--sc-space-10); }
.seedream-section-intro .sc-title-section { margin-top: var(--sc-space-4); margin-bottom: var(--sc-space-4); }
.seedream-section-intro--center { margin-inline: auto; text-align: center; }
.seedream-section-intro--center .sc-eyebrow { margin-inline: auto; }
.seedream-example-grid, .seedream-benefit-grid, .seedream-trust-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sc-space-5); }
.seedream-example { overflow: hidden; }
.seedream-example img { width: 100%; height: 15rem; display: block; object-fit: cover; }
.seedream-example__body { display: grid; gap: var(--sc-space-3); padding: var(--sc-space-5); }
.seedream-example__body h3, .seedream-example__body p { margin: 0; }
.seedream-example__body h3 { color: var(--sc-color-ink); font-size: 1.15rem; line-height: 1.25; }
.seedream-example__body p { color: var(--sc-color-muted); font-size: 0.88rem; line-height: 1.65; }
.seedream-example__tag { color: var(--sc-color-brand-700); font-size: 0.73rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.seedream-benefit-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.seedream-benefit { min-height: 14rem; padding: var(--sc-space-5); }
.seedream-benefit__number { color: var(--sc-color-brand-600); font-size: 0.8rem; font-weight: 850; letter-spacing: 0.1em; }
.seedream-benefit h3 { margin: var(--sc-space-8) 0 var(--sc-space-3); color: var(--sc-color-ink); font-size: 1.1rem; line-height: 1.25; }
.seedream-benefit p { margin: 0; color: var(--sc-color-muted); font-size: 0.88rem; line-height: 1.65; }
.seedream-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sc-space-8); }
.seedream-step { position: relative; padding-top: var(--sc-space-5); border-top: 1px solid var(--sc-color-border-strong); }
.seedream-step__number { position: absolute; top: -1.1rem; width: 2.2rem; height: 2.2rem; display: grid; place-items: center; border: 1px solid var(--sc-color-brand-200); border-radius: 50%; color: var(--sc-color-brand-800); background: var(--sc-color-brand-50); font-weight: 850; }
.seedream-step h3 { margin: var(--sc-space-4) 0 var(--sc-space-3); font-size: 1.1rem; }
.seedream-step p { margin: 0; color: var(--sc-color-muted); font-size: 0.9rem; line-height: 1.65; }
.seedream-trust-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.seedream-trust-card { padding: var(--sc-space-5); border-left: 3px solid var(--sc-color-brand-500); }
.seedream-trust-card strong { display: block; margin-bottom: var(--sc-space-2); color: var(--sc-color-ink); font-size: 1rem; }
.seedream-trust-card p { margin: 0; color: var(--sc-color-muted); font-size: 0.86rem; line-height: 1.6; }
.seedream-faq__inner { display: grid; grid-template-columns: minmax(240px, 0.8fr) minmax(0, 1.35fr); gap: clamp(2rem, 8vw, 8rem); align-items: start; }
.seedream-faq .seedream-section-intro { margin-bottom: 0; }
.seedream-page .seedream-final-cta { padding-top: 0; }
.seedream-final-cta__card { display: flex; align-items: center; justify-content: space-between; gap: var(--sc-space-8); padding: clamp(1.5rem, 4vw, 3rem); }
.seedream-final-cta__card .sc-title-section { margin-top: var(--sc-space-4); margin-bottom: var(--sc-space-4); }
.seedream-final-cta__card .sc-lede { font-size: 0.95rem; }
.seedream-related { display: flex; flex-wrap: wrap; gap: var(--sc-space-3); margin-top: var(--sc-space-5); }
.seedream-related a { color: var(--sc-color-brand-700); font-size: 0.85rem; font-weight: 750; text-decoration: none; }
.seedream-related a:hover { color: var(--sc-color-brand-900); text-decoration: underline; text-underline-offset: 0.2em; }

@media (max-width: 900px) {
  .seedream-home-chat .home-chat__toolbar { gap: 0.25rem; margin-right: calc(5rem + var(--sc-space-2)); }
  .seedream-home-chat .home-chat__chip { display: none; }
  .seedream-home-chat .home-chat__menu-control { min-width: 0; flex: 0 0 auto; }
  .seedream-home-chat .home-chat__menu-button { max-width: 100%; gap: 0.25rem; padding-inline: 0.5rem; font-size: 0.68rem; }
  .seedream-home-chat .home-chat__menu-control:first-of-type .home-chat__menu-button { width: 8rem; max-width: 8rem; overflow: hidden; }
  .seedream-home-chat .home-chat__menu-button > span:last-child { overflow: hidden; text-overflow: ellipsis; }
}

@media (max-width: 720px) {
  .seedream-page .seedream-hero { padding-top: 1.25rem; padding-bottom: var(--sc-space-5); }
  .seedream-hero__inner {
    grid-template-columns: 1fr;
    grid-template-areas:
      "copy"
      "create"
      "visual";
    gap: var(--sc-space-5);
  }
  .seedream-hero__copy .sc-title-display { max-width: 15ch; }
  .seedream-hero__visual { min-height: 13rem; max-width: 38rem; width: 100%; margin-inline: auto; }
  .seedream-composer__fields, .seedream-faq__inner { grid-template-columns: 1fr; }
  .seedream-page .seedream-create { margin-top: 0; }
  .seedream-example-grid, .seedream-benefit-grid, .seedream-trust-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .seedream-page .seedream-hero { padding-top: var(--sc-space-5); }
  .seedream-hero__visual { min-height: 14rem; }
  .seedream-hero__image--large { inset: 0 2.2rem 1.5rem 0; }
  .seedream-hero__stamp { top: 0.6rem; right: 0.3rem; width: 4.1rem; height: 4.1rem; font-size: 0.95rem; }
  .seedream-page .seedream-create { margin-top: 0; padding-top: 0; }
  .seedream-final-cta__card { display: grid; gap: var(--sc-space-5); }
  .seedream-home-chat .home-chat__attachments { box-sizing: border-box; min-height: 3rem; height: 3rem; padding-block: 0.25rem; }
  .seedream-home-chat .home-chat__attach, .seedream-home-chat .home-chat__attachment { width: 2.5rem; height: 2.5rem; flex-basis: 2.5rem; }
  .seedream-home-chat .home-chat__attach { font-size: 1.5rem; }
  .seedream-home-chat .home-chat__input { min-height: 2.75rem; padding-block: 0.5rem; }
  .seedream-home-chat .home-chat__menu-button { min-height: 2.5rem; }
  .seedream-home-chat .home-chat__send { min-height: 2.5rem; height: 2.5rem; }
  .seedream-composer__toolbar { align-items: stretch; }
  .seedream-mode-chip, .seedream-menu-control, .seedream-menu-button { width: 100%; }
  .seedream-menu-button { justify-content: space-between; }
  .seedream-menu { right: 0; bottom: calc(100% + 0.5rem); }
  .seedream-generate { width: 100%; margin-left: 0; }
  .seedream-example-grid, .seedream-benefit-grid, .seedream-trust-grid, .seedream-steps { grid-template-columns: 1fr; }
  .seedream-example img { height: 13rem; }
  .seedream-related { display: grid; }
}

@media (prefers-reduced-motion: reduce) {
  .seedream-upload, .seedream-menu-button { transition: none; }
}