:root {
  --ink: #191625;
  --muted: #77748a;
  --soft: #f4f0ff;
  --line: #e7e2f5;
  --panel: #ffffff;
  --purple: #8b73ff;
  --purple-2: #c2b4ff;
  --purple-soft: #f2ecff;
  --cyan: #9fc9ff;
  --green: #39d98a;
  --blue: #9aa9ff;
  --rose: #f5a5cf;
  --amber: #ffb84d;
  --shadow: 0 18px 50px rgba(102, 84, 164, 0.12);
  font-family: "Inter", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}

body[data-active-feature="wrinkle"] #upload-example-button,
body[data-active-feature="wrinkle"] .upload-column > .library-select-row {
  display: none !important;
}

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

html {
  height: 100%;
}

body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background: #fbfbff;
}

button,
input {
  font: inherit;
}

button {
  cursor: pointer;
}

button:disabled {
  cursor: not-allowed;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.app-layout {
  display: grid;
  grid-template-columns: 292px minmax(0, 1fr);
  min-height: 100vh;
}

.sidebar {
  position: sticky;
  top: 0;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 14px;
  height: 100vh;
  padding: 18px 14px 16px;
  border-right: 1px solid #e9e8f3;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 247, 255, 0.98) 52%, rgba(247, 251, 255, 0.98) 100%);
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.88);
}

.brand {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 86px;
  padding: 11px 6px 10px;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  color: inherit;
  text-decoration: none;
  background: transparent;
  box-shadow: none;
}

.brand::before {
  display: none;
}

.brand-logo {
  position: relative;
  display: grid;
  place-items: center;
  width: min(100%, 160px);
  height: 36px;
  overflow: hidden;
  border-radius: 0;
  color: inherit;
  background: transparent;
}

.brand-logo::after {
  display: none;
}

.brand-logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.brand-tagline {
  display: block;
  max-width: 188px;
  color: #667085;
  font-size: 12px;
  font-weight: 450;
  line-height: 1.25;
  letter-spacing: 0.03em;
  text-align: center;
  white-space: nowrap;
}

.brand strong {
  display: block;
  font-size: 29px;
  line-height: 1;
  letter-spacing: 0;
}

.brand small {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  margin-top: 4px;
  padding: 0 12px;
  border-radius: 999px;
  color: var(--purple);
  background: var(--purple-soft);
  font-size: 13px;
  font-weight: 525;
}

.side-nav {
  display: grid;
  gap: 10px;
  align-content: start;
  overflow: auto;
  padding: 2px 3px 8px 0;
  scrollbar-width: thin;
  scrollbar-color: rgba(123, 97, 255, 0.28) transparent;
}

.side-nav::-webkit-scrollbar {
  width: 5px;
}

.side-nav::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(123, 97, 255, 0.24);
}

.nav-group {
  display: grid;
  gap: 5px;
  padding: 7px;
  border: 1px solid #edebf6;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 10px 22px rgba(74, 68, 124, 0.05);
}

.nav-group:first-child {
  padding: 6px;
}

.nav-sublist {
  display: grid;
  gap: 2px;
  padding: 1px 0 2px;
}

.side-nav p {
  margin: 18px 12px 8px;
  color: #9ca0b2;
  font-size: 16px;
  font-weight: 525;
}

.side-nav a {
  position: relative;
  display: flex;
  gap: 9px;
  align-items: center;
  min-height: 38px;
  padding: 0 11px;
  border-radius: 12px;
  color: #373949;
  text-decoration: none;
  font-size: 14px;
  font-weight: 525;
  transition:
    color 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease;
}

.side-nav .nav-primary {
  min-height: 42px;
  color: #232634;
  font-size: 15px;
  font-weight: 525;
}

.side-nav .nav-primary[data-nav-target] {
  min-height: 38px;
  padding: 0 8px 0 7px;
  border-radius: 12px;
  color: #343747;
  background: transparent;
  box-shadow: none;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: none;
}

.side-nav .nav-primary[data-nav-target] .lucide {
  width: 24px;
  height: 24px;
  padding: 5px;
  color: #fff;
  background: linear-gradient(135deg, #7b61ff, #43a8ff);
  box-shadow: 0 8px 18px rgba(94, 92, 230, 0.13);
}

.nav-sublist a {
  min-height: 30px;
  padding: 0 10px 0 11px;
  border-radius: 10px;
  color: #656c80;
  font-size: 13.5px;
  font-weight: 525;
}

.nav-sublist a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 0 999px 999px 0;
  background: transparent;
  transition:
    background 0.18s ease,
    transform 0.18s ease;
}

.side-nav a.active,
.side-nav a:hover {
  color: var(--purple);
  background: #f3f0ff;
}

.side-nav .nav-primary[data-nav-target].active,
.side-nav .nav-primary[data-nav-target]:hover {
  color: #3f31d0;
  background: rgba(123, 97, 255, 0.08);
  box-shadow: inset 0 0 0 1px rgba(123, 97, 255, 0.08);
}

.side-nav .lucide {
  width: 26px;
  height: 26px;
  padding: 6px;
  border-radius: 9px;
  color: currentColor;
  background: #f5f4fb;
  stroke-width: 2.35;
  transition:
    color 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease;
}

.nav-sublist .lucide {
  width: 22px;
  height: 22px;
  padding: 4px;
  border-radius: 7px;
  color: #8b90a4;
  background: transparent;
  stroke-width: 2.25;
}

.side-nav a.active .lucide,
.side-nav a:hover .lucide {
  color: #fff;
  background: linear-gradient(135deg, var(--purple), var(--blue));
  box-shadow: 0 8px 18px rgba(94, 92, 230, 0.18);
}

.nav-sublist a.active::before,
.nav-sublist a:hover::before {
  background: var(--purple);
  transform: none;
}

.side-nav .nav-tail {
  margin-left: auto;
  color: #b2b4c5;
}

.works-card {
  position: relative;
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 86px;
  padding: 14px;
  overflow: hidden;
  border: 0;
  border-radius: 16px;
  color: #fff;
  text-align: left;
  background: linear-gradient(135deg, #7257ff, #9c82ff 52%, #42d7ee);
  box-shadow: 0 18px 34px rgba(123, 97, 255, 0.22);
}

.model-selector-wrap {
  position: relative;
  display: grid;
  gap: 8px;
}

.model-selector-wrap[hidden] {
  display: none !important;
}

.model-selector-button {
  position: relative;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 72px;
  padding: 11px 12px;
  border: 1px solid #e7e3fb;
  border-radius: 16px;
  color: #25283a;
  text-align: left;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 12px 26px rgba(78, 70, 138, 0.08);
}

.model-selector-button:hover {
  border-color: rgba(123, 97, 255, 0.36);
  background: #fff;
}

.model-selector-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  color: #fff;
  background: linear-gradient(135deg, #7158ff, #43a8ff);
  box-shadow: 0 10px 20px rgba(93, 91, 226, 0.16);
}

.model-selector-icon .lucide {
  width: 22px;
  height: 22px;
}

.model-selector-button strong,
.model-selector-button small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.model-selector-button strong {
  color: #262a3c;
  font-size: 16px;
  font-weight: 525;
  line-height: 1.1;
}

.model-selector-button small {
  margin-top: 5px;
  color: #8a8fa3;
  font-size: 12px;
  font-weight: 525;
}

.model-selector-button > .lucide {
  width: 18px;
  height: 18px;
  color: #8f83e8;
  transition: transform 0.18s ease;
}

.model-selector-button[aria-expanded="true"] > .lucide {
  transform: rotate(180deg);
}

.model-selector-menu {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(100% + 8px);
  z-index: 20;
  display: grid;
  gap: 6px;
  max-height: min(520px, 72vh);
  overflow: auto;
  padding: 8px;
  border: 1px solid #e4e0f8;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 22px 46px rgba(62, 55, 120, 0.18);
}

.model-selector-menu[hidden] {
  display: none;
}

.model-option-button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-height: 58px;
  padding: 9px 10px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: #2b2e40;
  text-align: left;
  background: #fbfbff;
}

.model-option-button:hover,
.model-option-button.selected {
  border-color: rgba(123, 97, 255, 0.42);
  background: #f5f2ff;
}

.model-option-button strong,
.model-option-button small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.model-option-button strong {
  font-size: 13px;
  font-weight: 525;
}

.model-option-button small {
  margin-top: 4px;
  color: #81879b;
  font-size: 11px;
  font-weight: 525;
}

.model-option-button em {
  display: inline-grid;
  place-items: center;
  min-width: 34px;
  height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  color: var(--purple);
  background: #ebe7ff;
  font-size: 11px;
  font-style: normal;
  font-weight: 525;
}

.works-card.is-generating {
  background-size: 220% 220%;
  animation: worksGlow 1.6s ease-in-out infinite;
}

@keyframes worksGlow {
  0%,
  100% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }
}

.works-icon {
  position: relative;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.2);
}

.works-icon em {
  position: absolute;
  right: -7px;
  top: -7px;
  display: none;
  place-items: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border: 2px solid #fff;
  border-radius: 999px;
  color: #fff;
  background: #ff4f6d;
  font-size: 12px;
  font-style: normal;
  font-weight: 525;
}

.works-icon em.show {
  display: grid;
}

.works-card strong,
.works-card small {
  display: block;
}

.works-card strong {
  font-size: 20px;
  line-height: 1.1;
}

.works-card small {
  margin-top: 5px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 13px;
  font-weight: 525;
}

.main-area {
  min-width: 0;
}

@media (min-width: 981px) {
  body:not(.library-focus-mode):not(.feature-focus-mode):not(.works-focus-mode) {
    height: 100vh;
    overflow: hidden;
  }

  body:not(.library-focus-mode):not(.feature-focus-mode):not(.works-focus-mode) .app-layout {
    height: 100vh;
    min-height: 0;
    overflow: hidden;
  }

  body:not(.library-focus-mode):not(.feature-focus-mode):not(.works-focus-mode) .sidebar {
    height: 100vh;
  }

  body:not(.library-focus-mode):not(.feature-focus-mode):not(.works-focus-mode) .main-area {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    height: 100vh;
    min-height: 0;
    overflow: hidden;
  }

  body:not(.library-focus-mode):not(.feature-focus-mode):not(.works-focus-mode) .content-grid {
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
  }
}

.side-nav a,
.side-nav .lucide,
.side-nav a::before {
  transition:
    color 0.18s ease,
    background-color 0.18s ease,
    box-shadow 0.18s ease,
    opacity 0.18s ease !important;
}

.side-nav .nav-primary[data-nav-target].active,
.side-nav .nav-primary[data-nav-target]:hover {
  color: #4d3ed2 !important;
}

.side-nav .nav-primary[data-nav-target].active .lucide,
.side-nav .nav-primary[data-nav-target]:hover .lucide {
  color: #5b45e8 !important;
  box-shadow:
    inset 0 0 0 1px rgba(123, 97, 255, 0.22),
    0 8px 18px rgba(105, 91, 164, 0.12) !important;
}

.nav-sublist a.active,
.nav-sublist a:hover {
  color: #5a45d8 !important;
}

.nav-sublist a.active::before,
.nav-sublist a:hover::before {
  background: rgba(91, 75, 232, 0.78) !important;
}

.nav-sublist a.active .lucide,
.nav-sublist a:hover .lucide {
  color: #5b45e8 !important;
  box-shadow:
    inset 0 0 0 1px rgba(123, 97, 255, 0.22),
    0 6px 14px rgba(105, 91, 164, 0.12) !important;
}

body.feature-focus-mode.workstation-feature-mode .inline-model-section summary strong {
  overflow: visible !important;
  max-width: none !important;
  font-size: 11.5px !important;
  line-height: 1.12 !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode .inline-model-section summary {
  grid-template-columns: 34px minmax(84px, 1fr) auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .inline-model-section summary {
  grid-template-columns: 30px minmax(82px, 1fr) 12px !important;
}

body.feature-focus-mode.workstation-feature-mode .inline-model-section summary strong {
  overflow: visible !important;
  max-width: none !important;
  font-size: 11.5px !important;
  line-height: 1.12 !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode .inline-model-section summary {
  grid-template-columns: 34px minmax(84px, 1fr) auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .inline-model-section summary {
  grid-template-columns: 30px minmax(82px, 1fr) 12px !important;
}

body.feature-focus-mode.workstation-feature-mode .inline-model-section summary strong {
  overflow: visible !important;
  max-width: none !important;
  font-size: 11.5px !important;
  line-height: 1.12 !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode .inline-model-section summary {
  grid-template-columns: 34px minmax(84px, 1fr) auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .inline-model-section summary {
  grid-template-columns: 30px minmax(82px, 1fr) 12px !important;
}

.resolution-credit-option {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  column-gap: 10px !important;
  width: 100%;
  padding-left: 14px !important;
  padding-right: 12px !important;
  white-space: nowrap;
}

.resolution-credit-option .resolution-size {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  grid-column: 2;
  line-height: 1;
}

.resolution-credit-option .resolution-credit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: end;
  grid-column: 3;
  gap: 2px;
  color: #ef4444 !important;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
}

.resolution-credit-option .resolution-credit .lucide {
  width: 13px;
  height: 13px;
  color: #ef4444 !important;
  stroke-width: 2;
}

.resolution-credit-option .resolution-credit b {
  color: inherit !important;
  font: inherit;
}

/* Sidebar active layer: visual feedback only, no sizing changes. */
body .side-nav a,
body .side-nav .lucide,
body .side-nav a::before,
body .side-nav .nav-primary[data-nav-target]::after {
  transition:
    color 0.18s ease,
    background-color 0.18s ease,
    box-shadow 0.18s ease,
    opacity 0.18s ease !important;
}

body .side-nav [data-home-link].active,
body .side-nav [data-home-link]:hover,
body .side-nav .nav-primary[data-nav-target].active,
body .side-nav .nav-primary[data-nav-target]:hover {
  color: #4d3ed2 !important;
  background:
    linear-gradient(90deg, rgba(116, 91, 255, 0.11), rgba(255, 255, 255, 0)) !important;
  box-shadow: inset 3px 0 0 rgba(91, 75, 232, 0.72) !important;
}

body .side-nav .nav-primary[data-nav-target].active::after,
body .side-nav .nav-primary[data-nav-target]:hover::after {
  opacity: 1 !important;
  background: linear-gradient(90deg, rgba(91, 75, 232, 0.42), rgba(91, 75, 232, 0)) !important;
}

body .side-nav [data-home-link].active .lucide,
body .side-nav [data-home-link]:hover .lucide,
body .side-nav .nav-primary[data-nav-target].active .lucide,
body .side-nav .nav-primary[data-nav-target]:hover .lucide,
body .nav-sublist a.active .lucide,
body .nav-sublist a:hover .lucide {
  color: #5b45e8 !important;
  box-shadow:
    inset 0 0 0 1px rgba(123, 97, 255, 0.28),
    0 8px 18px rgba(105, 91, 164, 0.14) !important;
}

body .nav-sublist a.active,
body .nav-sublist a:hover {
  color: #5a45d8 !important;
  background:
    linear-gradient(90deg, rgba(116, 91, 255, 0.09), rgba(255, 255, 255, 0)) !important;
  box-shadow: none !important;
}

body .nav-sublist a.active::before,
body .nav-sublist a:hover::before {
  background: rgba(91, 75, 232, 0.82) !important;
  opacity: 1 !important;
  transform: none !important;
}

body .side-nav a:active {
  background:
    linear-gradient(90deg, rgba(116, 91, 255, 0.16), rgba(255, 255, 255, 0)) !important;
}

body .nav-sublist a::before {
  background: transparent !important;
  opacity: 0 !important;
}

body .nav-sublist a.active::before,
body .nav-sublist a:hover::before {
  background: rgba(91, 75, 232, 0.82) !important;
  opacity: 1 !important;
}

body.feature-focus-mode {
  height: 100vh;
  overflow: hidden;
}

body.feature-focus-mode .app-layout {
  height: 100vh;
  min-height: 0;
  overflow: hidden;
}

body.feature-focus-mode .sidebar {
  height: 100vh;
}

body.feature-focus-mode .main-area {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  height: 100vh;
  min-height: 0;
  overflow: hidden;
  background: #fff;
}

@media (max-height: 820px) {
  body.feature-focus-mode {
    height: auto;
    min-height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
  }

  body.feature-focus-mode .app-layout,
  body.feature-focus-mode .main-area,
  body.feature-focus-mode .content-grid,
  body.workstation-feature-mode .workspace,
  body.workstation-feature-mode .task-panel {
    height: auto;
    min-height: 100vh;
    overflow: visible;
  }

  body.feature-focus-mode .main-area {
    display: block;
  }

  body.feature-focus-mode .content-grid {
    padding-bottom: 18px;
  }

  body.workstation-feature-mode .task-panel {
    grid-template-rows: auto auto auto;
  }

  body.feature-focus-mode .task-body {
    min-height: 0;
    overflow: visible;
  }
}

body.feature-focus-mode .topbar {
  display: flex;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 8;
  display: flex;
  gap: 18px;
  align-items: center;
  justify-content: space-between;
  min-height: 70px;
  padding: 14px 32px;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(18px);
}

.top-library-tabs {
  display: inline-flex;
  gap: 10px;
  width: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.top-library-tabs > button,
.top-library-tabs .industry-select-button,
.top-library-tabs .language-switcher-button {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  width: 122px;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid rgba(203, 213, 225, 0.92);
  border-radius: 14px;
  color: #42526a;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.035);
  font-size: 14px;
  font-weight: 560;
  line-height: 1;
  white-space: nowrap;
  transition:
    transform var(--motion-fast) ease,
    border-color var(--motion-fast) ease,
    background-color var(--motion-fast) ease,
    box-shadow var(--motion-fast) ease,
    color var(--motion-fast) ease;
}

.top-library-tabs > button .lucide,
.top-library-tabs .industry-select-button .lucide,
.top-library-tabs .language-switcher-button .lucide {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  padding: 0;
  box-sizing: border-box;
  border-radius: 0;
  color: #667085;
  background: transparent;
  stroke-width: 2.2;
}

.top-library-tabs .industry-select-button .lucide:first-child {
  color: #667085;
  background: transparent;
}

.top-library-tabs > button[data-feature="asset-library"] .lucide {
  color: #667085;
  background: transparent;
}

.top-library-tabs > button.active,
.top-library-tabs > button.selected,
.top-library-tabs .industry-select-button.active,
.top-library-tabs .industry-select-button.selected,
.top-library-tabs .language-switcher-button.active,
.top-library-tabs .language-switcher-button.selected {
  border-color: rgba(91, 75, 232, 0.28);
  color: #312e81;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.055);
}

.top-library-tabs > button.active .lucide,
.top-library-tabs > button.selected .lucide,
.top-library-tabs .industry-select-button.active .lucide,
.top-library-tabs .industry-select-button.selected .lucide,
.top-library-tabs .language-switcher-button.active .lucide,
.top-library-tabs .language-switcher-button.selected .lucide {
  color: #312e81;
  background: transparent;
}

.top-library-tabs > button:hover,
.top-library-tabs > button:focus-visible,
.top-library-tabs .industry-select-button:hover,
.top-library-tabs .industry-select-button:focus-visible,
.top-library-tabs .language-switcher-button:hover,
.top-library-tabs .language-switcher-button:focus-visible {
  border-color: rgba(91, 75, 232, 0.24);
  color: #0f172a;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
  transform: translateY(-1px);
}

.top-library-tabs > button:hover .lucide,
.top-library-tabs > button:focus-visible .lucide,
.top-library-tabs .industry-select-button:hover .lucide,
.top-library-tabs .industry-select-button:focus-visible .lucide,
.top-library-tabs .language-switcher-button:hover .lucide,
.top-library-tabs .language-switcher-button:focus-visible .lucide {
  color: #312e81;
}

.industry-select {
  position: relative;
  display: inline-flex;
}

.top-library-tabs .industry-select-button {
  width: auto;
  min-width: 122px;
}

.industry-select-button .lucide:last-child,
.language-switcher-button .lucide:last-child {
  width: 13px;
  height: 13px;
  flex-basis: 13px;
  padding: 0;
  border-radius: 0;
  color: #94a3b8;
  background: transparent;
  box-sizing: border-box;
  stroke-width: 2.35;
}

.industry-select-menu {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 30000;
  display: grid;
  gap: 4px;
  width: 238px;
  padding: 8px;
  border: 1px solid rgba(226, 232, 240, 0.92);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);
  backdrop-filter: blur(10px) saturate(1.04);
  -webkit-backdrop-filter: blur(10px) saturate(1.04);
}

.industry-select-menu[hidden] {
  display: none !important;
}

.industry-select-menu button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 38px;
  padding: 0 10px;
  border: 0;
  border-radius: 10px;
  color: #374151;
  background: transparent;
  box-shadow: none;
  font-size: 13px;
  font-weight: 520;
  text-align: left;
}

.industry-select-menu button:hover,
.industry-select-menu button:focus-visible,
.industry-select-menu button.is-current {
  color: #4338ca;
  background: #f5f7ff;
}

.industry-select-menu span {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  min-width: 0;
}

.industry-select-menu span .lucide {
  width: 15px;
  height: 15px;
  color: #4f46e5;
}

.industry-select-menu em {
  flex: 0 0 auto;
  color: #9aa4b5;
  font-size: 11.5px;
  font-style: normal;
  font-weight: 500;
}

.industry-select-menu button.is-current em {
  color: #4f46e5;
}

.top-actions {
  position: relative;
  display: flex;
  gap: 16px;
  align-items: center;
}

.generation-channel-switch {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 44px;
  padding: 4px;
  border: 1px solid #e5e1f5;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(74, 67, 132, 0.06);
}

.topbar > .generation-channel-switch {
  position: fixed;
  top: 14px;
  left: 50vw;
  z-index: 12;
  transform: translateX(-50%);
  min-height: 44px;
  gap: 3px;
  padding: 4px 5px;
  white-space: nowrap;
}

.generation-channel-switch-label {
  padding: 0 5px 0 7px;
  color: #8a8ea1;
  font-size: 12px;
  font-weight: 650;
}

.generation-channel-switch.is-forced {
  border-color: #f59e0b;
  background: #fffbeb;
  box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.14), 0 10px 24px rgba(74, 67, 132, 0.08);
}

.generation-channel-switch.is-forced .generation-channel-switch-label {
  color: #b45309;
  font-weight: 800;
}

.topbar > .generation-channel-switch button {
  min-width: 52px;
  height: 34px;
  padding: 0 8px;
  border: 0;
}

@media (max-width: 1280px) {
  .topbar > .generation-channel-switch {
    position: static;
    transform: none;
  }
}

.generation-channel-switch[hidden] {
  display: none !important;
}

.generation-channel-switch button {
  min-width: 62px;
  height: 34px;
  padding: 0 12px;
  border: 0;
  border-radius: 9px;
  color: #7a7e91;
  background: transparent;
  font-size: 14px;
  font-weight: 525;
}

.generation-channel-switch button.selected {
  color: #fff;
  background: linear-gradient(135deg, var(--purple), var(--blue));
  box-shadow: 0 8px 18px rgba(94, 92, 230, 0.18);
}

.generation-channel-model-menu {
  position: fixed;
  top: 67px;
  left: 50vw;
  z-index: 40;
  width: 280px;
  max-height: calc(100vh - 86px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 8px;
  transform: translateX(-50%);
  border: 1px solid #e5e7f0;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 18px 44px rgba(37, 43, 74, 0.16);
}

.generation-channel-model-menu[hidden] {
  display: none !important;
}

.generation-channel-model-menu .channel-model-menu-title {
  display: flex;
  justify-content: space-between;
  padding: 4px 6px 8px;
  color: #777d91;
  font-size: 12px;
}

.generation-channel-model-menu .channel-model-menu-state {
  padding: 18px 10px;
  color: #8b90a3;
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
}

.generation-channel-model-menu button.channel-model-option {
  display: flex;
  width: 100%;
  height: auto;
  min-height: 46px;
  margin: 2px 0;
  padding: 8px 10px;
  align-items: center;
  justify-content: space-between;
  text-align: left;
}

.generation-channel-model-menu .channel-model-option span {
  display: grid;
  gap: 3px;
}

.generation-channel-model-menu .channel-model-option small {
  color: #969bad;
  font-size: 11px;
}

.generation-channel-model-menu .channel-model-option.selected {
  color: #fff;
  background: linear-gradient(135deg, var(--purple), var(--blue));
}

.generation-channel-model-menu .channel-model-option.selected small {
  color: rgba(255, 255, 255, 0.78);
}

.generation-channel-model-menu .channel-model-quality {
  display: grid;
  grid-template-columns: 1fr repeat(3, 36px);
  gap: 5px;
  align-items: center;
  margin: 2px 0 7px;
  padding: 6px 8px;
  border: 1px solid #eceef5;
  border-radius: 9px;
  color: #777d91;
  font-size: 11px;
}

.generation-channel-model-menu .channel-model-quality button {
  min-width: 0;
  height: 26px;
  padding: 0;
  border: 1px solid #e1e4ef;
  border-radius: 7px;
  color: #74798d;
  background: #fff;
  font-size: 11px;
}

.generation-channel-model-menu .channel-model-quality button.selected {
  border-color: rgba(100, 90, 230, 0.35);
  color: #fff;
  background: linear-gradient(135deg, var(--purple), var(--blue));
}

.generation-channel-model-menu button.channel-model-auto {
  width: 100%;
  margin-top: 6px;
  border-top: 1px solid #eceef5;
  border-radius: 0 0 9px 9px;
  color: #72788c;
}

.free-generate-button {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 15px;
  border: 1px solid rgba(123, 97, 255, 0.24);
  border-radius: 12px;
  color: #fff;
  background: linear-gradient(135deg, #19a58f, #6657ff);
  box-shadow: 0 12px 24px rgba(60, 82, 190, 0.16);
  font-size: 14px;
  font-weight: 525;
  white-space: nowrap;
}

.free-generate-button .lucide {
  width: 18px;
  height: 18px;
  stroke-width: 2.4;
}

.language-switcher {
  position: relative;
  flex: 0 0 auto;
}

.language-switcher-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 112px;
  min-height: 42px;
  padding: 0 13px;
  border: 1px solid rgba(214, 220, 235, 0.95);
  border-radius: 12px;
  color: #475569;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 10px 22px rgba(31, 41, 55, 0.055);
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  transition:
    transform var(--motion-fast) ease,
    border-color var(--motion-fast) ease,
    background-color var(--motion-fast) ease,
    box-shadow var(--motion-fast) ease,
    color var(--motion-fast) ease;
}

.language-switcher-button:hover,
.language-switcher-button:focus-visible {
  border-color: rgba(123, 97, 255, 0.26);
  color: #4338ca;
  background: #fff;
  box-shadow: 0 12px 26px rgba(79, 70, 229, 0.1);
  transform: translateY(-1px);
  outline: none;
}

.language-switcher-button .lucide {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  color: #667085;
  stroke-width: 2.2;
}

.language-switcher-menu {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 30000;
  display: grid;
  width: 210px;
  max-height: min(430px, calc(100vh - 110px));
  overflow: auto;
  padding: 8px;
  border: 1px solid #e6e8f0;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 18px 46px rgba(28, 34, 58, 0.14);
}

.language-switcher-menu[hidden] {
  display: none !important;
}

.language-switcher-menu button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 38px;
  padding: 0 10px;
  border: 0;
  border-radius: 10px;
  color: #3f4658;
  background: transparent;
  font-size: 13px;
  font-weight: 520;
  text-align: left;
}

.language-switcher-menu button:hover,
.language-switcher-menu button.is-current {
  color: #4b45d8;
  background: #f5f7ff;
}

.language-switcher-menu button em {
  color: #9aa3b5;
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
}

.free-generate-panel {
  display: grid;
  gap: 12px;
}

.free-generate-panel textarea {
  width: 100%;
  min-height: 118px;
  resize: vertical;
  border: 1px solid #e6e3f2;
  border-radius: 12px;
  padding: 12px;
  color: #30384d;
  background: #fff;
  font-size: 14px;
  line-height: 1.55;
  outline: none;
}

.free-generate-option-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.free-generate-option-grid button {
  min-height: 38px;
  border: 1px solid #e7e3fb;
  border-radius: 10px;
  color: #4d5368;
  background: #fff;
  font-size: 13px;
  font-weight: 525;
}

.free-generate-option-grid button.selected {
  border-color: rgba(123, 97, 255, 0.7);
  color: var(--purple);
  background: #f7f4ff;
  box-shadow: inset 0 0 0 1px rgba(123, 97, 255, 0.14);
}

.advanced-grid .advanced-card {
  order: 10;
}

.advanced-grid .advanced-card[data-feature="model-library"] {
  order: 1;
}

.advanced-grid .advanced-card[data-feature="product-library"] {
  order: 2;
}

.advanced-grid .advanced-card[data-feature="asset-library"] {
  order: 3;
}

.points-button,
.need-request-button,
.checkin-entry-button,
.icon-button,
.shop-button,
.outline-button,
.small-icon-button,
.batch-button {
  border: 1px solid var(--line);
  border-radius: 12px;
  color: #4d5061;
  background: #fff;
}

.points-button {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  min-height: 44px;
  padding: 0 18px;
  color: #777b8d;
  font-size: 15px;
  font-weight: 525;
}

.points-button .lucide:first-child {
  width: 26px;
  height: 26px;
  padding: 5px;
  border-radius: 9px;
  color: #fff;
  background: linear-gradient(135deg, var(--amber), #ff8f6b);
  stroke-width: 2.35;
}

.points-button strong {
  color: var(--purple);
  font-size: 18px;
}

.need-request-button,
.checkin-entry-button {
  position: relative;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  min-height: 44px;
  padding: 0 16px;
  border-color: rgba(123, 97, 255, 0.22);
  color: var(--purple);
  font-size: 14px;
  font-weight: 525;
  background: #f8f6ff;
}

.checkin-entry-button {
  border-color: rgba(79, 70, 229, 0.18);
  color: #3451c8;
  background:
    linear-gradient(135deg, rgba(238, 242, 255, 0.96), rgba(236, 253, 245, 0.92));
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.68);
}

.need-request-button em {
  position: absolute;
  right: -8px;
  top: -9px;
  display: inline-grid;
  place-items: center;
  min-height: 18px;
  padding: 0 7px;
  border-radius: 999px;
  color: #fff;
  background: #ff4f7a;
  box-shadow: 0 6px 14px rgba(255, 79, 122, 0.24);
  font-size: 11px;
  font-style: normal;
  font-weight: 525;
  line-height: 1;
}

.need-request-button .lucide,
.checkin-entry-button .lucide {
  width: 26px;
  height: 26px;
  padding: 5px;
  border-radius: 9px;
  color: #fff;
  background: linear-gradient(135deg, var(--purple), var(--rose));
  stroke-width: 2.35;
}

.checkin-entry-button .lucide {
  background: linear-gradient(135deg, #4f46e5, #14b8a6);
}

.checkin-entry-button.is-checked {
  color: #64748b;
  border-color: rgba(148, 163, 184, 0.25);
  background: #f8fafc;
}

.checkin-entry-button.is-checked .lucide {
  background: linear-gradient(135deg, #94a3b8, #64748b);
}

.icon-button,
.small-icon-button {
  position: relative;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
}

.icon-button .lucide,
.small-icon-button .lucide {
  width: 21px;
  height: 21px;
  color: var(--purple);
  stroke-width: 2.35;
}

.notify-button span {
  position: absolute;
  right: -5px;
  top: -7px;
  display: grid;
  place-items: center;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  border-radius: 999px;
  color: #fff;
  background: #ff4b55;
  font-size: 11px;
  font-weight: 525;
}

.shop-button {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 18px;
  gap: 10px;
  align-items: center;
  min-height: 48px;
  padding: 4px 10px;
  border: 0;
  text-align: left;
  background: transparent;
}

.shop-button img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
}

.shop-button span {
  display: grid;
  color: #282b39;
  font-size: 16px;
  font-weight: 525;
}

.shop-button b {
  overflow: hidden;
  font-size: 16px;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shop-button small {
  justify-self: start;
  margin-top: 2px;
  padding: 2px 9px;
  border-radius: 999px;
  color: var(--purple);
  background: var(--purple-soft);
  font-size: 12px;
}

.account-menu {
  position: fixed;
  right: 32px;
  top: 76px;
  z-index: 100000;
  display: grid;
  gap: 10px;
  width: 260px;
  padding: 14px;
  border: 1px solid #e7e8f0;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 44px rgba(31, 36, 52, 0.16);
}

.account-menu[hidden] {
  display: none;
}

.account-menu::before {
  content: "";
  position: absolute;
  right: 22px;
  top: -7px;
  width: 12px;
  height: 12px;
  border-left: 1px solid #e7e8f0;
  border-top: 1px solid #e7e8f0;
  background: #fff;
  transform: rotate(45deg);
}

.account-menu-head {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.account-menu-head strong {
  overflow: hidden;
  color: #252a39;
  font-size: 15px;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-menu-head small {
  color: #7b8394;
  font-size: 12px;
  font-weight: 525;
}

.account-menu-credit {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 42px;
  padding: 0 12px;
  border-radius: 12px;
  color: #626a7b;
  background: #f7f8fc;
  font-size: 13px;
  font-weight: 525;
}

.account-menu-credit strong {
  color: var(--purple);
  font-size: 17px;
}

.account-menu button {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border: 0;
  border-radius: 12px;
  color: #d84c61;
  background: #fff1f4;
  font-size: 14px;
  font-weight: 525;
}

.account-menu button:hover {
  background: #ffe5eb;
}

.account-menu button.neutral {
  color: #35506f;
  background: #eef4ff;
}

.account-menu button.neutral:hover {
  background: #e2ecff;
}

.account-menu button .lucide {
  width: 18px;
  height: 18px;
}

.content-grid {
  display: block;
  padding: 0 26px 900px;
  background: #fff;
}

body.library-focus-mode .content-grid,
body.feature-focus-mode .content-grid,
body.section-focus-mode .content-grid,
body.works-focus-mode .content-grid {
  padding-bottom: 160px;
}

body.feature-focus-mode .content-grid {
  height: 100%;
  min-height: 0;
  overflow: hidden;
  padding: 16px 16px 12px;
  background: #fff;
}

.workspace {
  display: grid;
  gap: 20px;
  min-width: 0;
  background: #fff;
}

body.library-focus-mode .workspace,
body.feature-focus-mode .workspace,
body.works-focus-mode .workspace {
  gap: 0;
}

body.workstation-feature-mode .workspace {
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

body:not(.library-focus-mode):not(.feature-focus-mode):not(.works-focus-mode) .task-panel,
body:not(.library-focus-mode):not(.feature-focus-mode):not(.works-focus-mode) .works-panel {
  display: none !important;
}

body.section-focus-mode .task-panel,
body.section-focus-mode .works-panel,
body.section-basic-mode .ai-tools-board,
body.section-basic-mode .advanced-board,
body.section-ai-tools-mode .basic-board:not(.ai-tools-board),
body.section-ai-tools-mode .advanced-board,
body.section-advanced-mode .basic-board {
  display: none !important;
}

body.library-focus-mode .hero-card,
body.library-focus-mode .function-board,
body.library-focus-mode .works-panel,
body.feature-focus-mode .hero-card,
body.feature-focus-mode .function-board,
body.feature-focus-mode .works-panel,
body.works-focus-mode .hero-card,
body.works-focus-mode .function-board,
body.works-focus-mode .task-panel {
  display: none !important;
}

.hero-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(360px, 1fr) minmax(460px, 0.82fr);
  gap: 20px;
  align-items: center;
  min-height: 174px;
  padding: 30px 46px;
  overflow: hidden;
  border-radius: 0;
  background:
    radial-gradient(circle at 86% 35%, rgba(126, 98, 255, 0.18), transparent 20%),
    linear-gradient(100deg, #fbfaff 0%, #f5f2ff 54%, #eef3ff 100%);
}

.hero-card::before,
.hero-card::after {
  content: "";
  position: absolute;
  border-radius: 8px;
  background: rgba(123, 97, 255, 0.12);
  transform: rotate(35deg);
}

.hero-card::before {
  right: 260px;
  top: 44px;
  width: 12px;
  height: 12px;
}

.hero-card::after {
  right: 70px;
  top: 84px;
  width: 18px;
  height: 18px;
}

.hero-text {
  position: relative;
  z-index: 2;
}

.hero-text h1 {
  margin: 0;
  font-size: 30px;
  line-height: 1.2;
  letter-spacing: 0;
}

.hero-text p {
  margin: 16px 0 0;
  color: #9194a7;
  font-size: 20px;
  font-weight: 525;
}

.hero-visual {
  position: relative;
  display: grid;
  justify-items: center;
  min-height: 156px;
}

.hero-visual img {
  position: absolute;
  right: 58px;
  bottom: -38px;
  width: 210px;
  height: 230px;
  object-fit: cover;
  object-position: top center;
  border-radius: 46% 46% 8px 8px;
  filter: saturate(0.96);
}

.hero-chip {
  position: absolute;
  right: 260px;
  top: 54px;
  z-index: 2;
  display: inline-grid;
  place-items: center;
  min-height: 38px;
  padding: 0 22px;
  border-radius: 8px;
  color: #fff;
  background: rgba(133, 105, 255, 0.62);
  box-shadow: 0 12px 26px rgba(124, 97, 255, 0.18);
  font-size: 17px;
  font-weight: 525;
  transform: rotate(-5deg);
}

.hero-chip.second {
  right: 234px;
  top: 94px;
  background: rgba(157, 133, 255, 0.52);
}

.function-board,
.task-panel,
.works-panel {
  border: 1px solid #efeff8;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: var(--shadow);
}

.function-board {
  padding: 18px 22px 22px;
}

.section-head {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
}

.section-head h2 {
  position: relative;
  margin: 0;
  padding-left: 14px;
  font-size: 22px;
  line-height: 1.1;
}

.section-head h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1px;
  bottom: 1px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--purple), #8e77ff);
}

.basic-board .section-head h2 {
  padding-left: 16px;
  color: #1f2234;
  font-size: 26px;
  font-weight: 525;
  text-shadow: 0 8px 22px rgba(123, 97, 255, 0.12);
}

.basic-board .section-head h2::before {
  top: -1px;
  bottom: -1px;
  width: 5px;
  background: linear-gradient(180deg, #7b61ff 0%, #43a8ff 100%);
  box-shadow: 0 0 18px rgba(123, 97, 255, 0.32);
}

.basic-board .section-head h2::after {
  content: "";
  position: absolute;
  left: 16px;
  right: -18px;
  bottom: -8px;
  height: 7px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(123, 97, 255, 0.18), rgba(67, 168, 255, 0.08), transparent);
  pointer-events: none;
}

.section-actions {
  display: inline-flex;
  gap: 10px;
  align-items: center;
}

.section-actions span {
  color: var(--muted);
  font-size: 14px;
  font-weight: 525;
}

.batch-button {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  color: var(--purple);
  font-weight: 525;
}

.function-grid {
  display: grid;
  gap: 12px;
}

.basic-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.function-card {
  display: grid;
  gap: 12px;
  align-content: start;
  min-height: 214px;
  padding: 13px;
  border: 1px solid #ececf6;
  border-radius: 16px;
  color: var(--ink);
  text-align: left;
  background: #fff;
  box-shadow: 0 8px 24px rgba(70, 68, 110, 0.04);
}

.function-card:hover,
.function-card.active,
.function-card.selected,
.advanced-card:hover,
.advanced-card.active,
.advanced-card.selected {
  border-color: rgba(123, 97, 255, 0.42);
  box-shadow: 0 12px 32px rgba(123, 97, 255, 0.12);
}

.feature-head {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  min-width: 0;
}

.feature-head strong {
  font-size: 16px;
  line-height: 1.2;
  font-weight: 525;
  white-space: normal;
}

.basic-board .feature-head {
  gap: 9px;
}

.basic-board .feature-head strong {
  color: #25283a;
  font-size: 18px;
  letter-spacing: 0;
}

.feature-head small {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 0 7px;
  border-radius: 999px;
  color: #817a9b;
  background: #f5f3ff;
  font-size: 11px;
  line-height: 1;
  font-weight: 525;
  white-space: nowrap;
}

.basic-board .feature-head small {
  min-height: 22px;
  padding: 0 8px;
  color: #7c8194;
  background: #f7f6fc;
  font-size: 12px;
  font-weight: 525;
}

.feature-icon {
  flex: 0 0 auto;
  position: relative;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  overflow: hidden;
  border-radius: 13px;
  color: #fff;
  background: linear-gradient(135deg, var(--purple), var(--purple-2));
  box-shadow: 0 10px 20px rgba(72, 66, 150, 0.14);
}

.feature-icon::after {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.45);
  pointer-events: none;
}

.feature-icon .lucide {
  width: 20px;
  height: 20px;
  position: relative;
  z-index: 1;
  stroke-width: 2.45;
  filter: drop-shadow(0 3px 5px rgba(20, 18, 60, 0.2));
}

.feature-icon.has-custom-tag-image {
  color: inherit;
  background: #f7f8fc;
}

.feature-icon.has-custom-tag-image::after {
  border-color: rgba(255, 255, 255, 0.62);
}

.feature-icon .feature-tag-image {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  object-fit: cover;
  object-position: center;
}

.feature-icon.purple {
  background: linear-gradient(135deg, #755cff 0%, #a084ff 100%);
}

.feature-icon.mint {
  background: linear-gradient(135deg, #18b9a7 0%, #52d9c9 100%);
}

.feature-icon.blue {
  background: linear-gradient(135deg, #2588ff 0%, #5bc8ff 100%);
}

.feature-icon.green {
  background: linear-gradient(135deg, #18b875 0%, #54d990 100%);
}

.feature-icon.cyan {
  background: linear-gradient(135deg, #21a9e8 0%, #55d7ee 100%);
}

.feature-icon.rainbow {
  background: linear-gradient(135deg, #ff6f91 0%, #8b6cff 54%, #31c6ee 100%);
}

.basic-board .feature-icon {
  width: 38px;
  height: 38px;
  border: 1px solid #ececf7;
  border-radius: 11px;
  color: var(--purple);
  background: #fbfbff;
  box-shadow: none;
}

.basic-board .feature-icon::after {
  display: none;
}

.basic-board .feature-icon .lucide {
  width: 20px;
  height: 20px;
  stroke-width: 2.25;
  filter: none;
}

.basic-board .feature-icon.purple {
  color: #765cff;
  background: #f4f1ff;
  border-color: #e5ddff;
}

.basic-board .feature-icon.mint {
  color: #18aaa0;
  background: #effdfb;
  border-color: #d7f5f0;
}

.basic-board .feature-icon.blue {
  color: #2588e8;
  background: #f0f8ff;
  border-color: #d7ecff;
}

.basic-board .feature-icon.green {
  color: #18a86d;
  background: #f0fbf5;
  border-color: #d7f2e3;
}

.basic-board .feature-icon.rainbow {
  color: #8b63ff;
  background:
    linear-gradient(#fbfbff, #fbfbff) padding-box,
    linear-gradient(135deg, rgba(255, 111, 145, 0.55), rgba(139, 108, 255, 0.5), rgba(49, 198, 238, 0.45)) border-box;
  border-color: transparent;
}

.card-media {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 1px solid #ececf6;
  border-radius: 10px;
  background: #f4f4fa;
}

.basic-board .single-media {
  aspect-ratio: 16 / 9;
}

.basic-board .single-media img {
  display: block;
}

.compare-media {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.compare-media::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 3px;
  background: rgba(255, 255, 255, 0.96);
  transform: translateX(-50%);
  box-shadow: 0 0 0 1px rgba(123, 97, 255, 0.06);
}

.card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.checker-card {
  background-color: #fff;
  background-image:
    linear-gradient(45deg, #f0f0f5 25%, transparent 25%),
    linear-gradient(-45deg, #f0f0f5 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #f0f0f5 75%),
    linear-gradient(-45deg, transparent 75%, #f0f0f5 75%);
  background-position: 0 0, 0 8px, 8px -8px, -8px 0;
  background-size: 16px 16px;
}

.before-label,
.after-label {
  position: absolute;
  bottom: 8px;
  z-index: 3;
  display: grid;
  place-items: center;
  min-height: 22px;
  padding: 0 7px;
  border-radius: 6px;
  color: #fff;
  background: rgba(38, 39, 47, 0.68);
  font-size: 11px;
  font-style: normal;
  font-weight: 525;
}

.before-label {
  left: 8px;
}

.after-label {
  right: 8px;
}

.split-handle {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 28px;
  border-radius: 999px;
  color: #626779;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 8px 18px rgba(38, 39, 70, 0.12);
  transform: translate(-50%, -50%);
}

.split-handle .lucide {
  width: 15px;
  height: 15px;
}

.advanced-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-rows: 238px;
  gap: 18px;
}

.advanced-card {
  position: relative;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 12px;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(223, 226, 236, 0.9);
  border-radius: 22px;
  color: #fff;
  text-decoration: none;
  text-align: left;
  background: #171b27;
  box-shadow: 0 18px 46px rgba(31, 36, 56, 0.13);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease, filter 0.18s ease;
}

.advanced-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(8, 10, 16, 0.12) 0%, rgba(8, 10, 16, 0.1) 42%, rgba(8, 10, 16, 0.86) 100%),
    linear-gradient(90deg, rgba(8, 10, 16, 0.22), rgba(8, 10, 16, 0));
  pointer-events: none;
}

.advanced-card:nth-child(1) {
  grid-column: span 6;
  grid-row: span 2;
}

.advanced-card:nth-child(2) {
  grid-column: span 6;
  grid-row: span 2;
}

.advanced-card:nth-child(3),
.advanced-card:nth-child(4),
.advanced-card:nth-child(5),
.advanced-card:nth-child(6),
.advanced-card:nth-child(7) {
  grid-column: span 3;
}

.advanced-card:hover,
.advanced-card.active,
.advanced-card.selected {
  border-color: rgba(255, 255, 255, 0.86);
  box-shadow: 0 24px 62px rgba(44, 50, 76, 0.2);
  transform: translateY(-3px);
}

.advanced-head {
  display: none;
}

.advanced-card .feature-icon {
  width: 18px;
  height: 18px;
  border-radius: 0;
  box-shadow: none;
}

.advanced-head strong,
.advanced-head small {
  display: block;
}

.advanced-head strong {
  font-size: 19px;
  font-weight: 525;
  line-height: 1.22;
  white-space: normal;
}

.advanced-head small {
  margin-top: 6px;
  overflow: hidden;
  color: #747b8e;
  font-size: 13px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.advanced-visual {
  position: relative;
  display: block;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  border-radius: inherit;
  background: #171b27;
  box-shadow: none;
}

.advanced-visual::after {
  display: none;
}

.advanced-main-img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: top center;
  filter: saturate(0.98) contrast(1.02);
  transition: transform 0.24s ease;
}

.detail-visual .advanced-main-img {
  object-position: center 68%;
}

.advanced-card:hover .advanced-main-img {
  transform: scale(1.03);
}

.advanced-chip {
  position: absolute;
  left: 18px;
  top: 18px;
  z-index: 2;
  display: inline-flex;
  gap: 7px;
  align-items: center;
  min-height: 34px;
  padding: 0 13px;
  border: 1px solid rgba(255, 255, 255, 0.26);
  border-radius: 999px;
  color: #fff;
  background: rgba(18, 22, 32, 0.5);
  box-shadow: 0 12px 26px rgba(8, 12, 20, 0.16);
  font-size: 13px;
  font-weight: 525;
  backdrop-filter: blur(10px);
}

.advanced-chip .lucide {
  width: 15px;
  height: 15px;
}

.advanced-chip.has-custom-tag-image {
  gap: 8px;
  min-height: 36px;
  padding-left: 8px;
}

.advanced-chip .feature-tag-image {
  display: block;
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.82);
  object-fit: cover;
  object-position: center;
}

.advanced-title {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 62px;
  z-index: 2;
  display: grid;
  gap: 8px;
  color: #fff;
}

.advanced-card:not(:first-child) .advanced-title {
  right: 118px;
}

.advanced-card:nth-child(n + 3) .advanced-title {
  right: 18px;
  bottom: 82px;
}

.advanced-card:nth-child(n + 3) .advanced-title strong {
  font-size: 23px;
}

.advanced-card:nth-child(n + 3) .advanced-title small {
  max-width: 82%;
}

.advanced-title strong,
.advanced-title small {
  display: block;
}

.advanced-title strong {
  overflow: hidden;
  font-size: 25px;
  font-weight: 525;
  line-height: 1.12;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-shadow: 0 12px 28px rgba(0, 0, 0, 0.34);
}

.advanced-title small {
  display: -webkit-box;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.78);
  font-size: 13px;
  font-weight: 525;
  line-height: 1.42;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.advanced-card:nth-child(1) .advanced-title strong,
.advanced-card:nth-child(2) .advanced-title strong {
  font-size: 34px;
}

.advanced-card:nth-child(1) .advanced-title small,
.advanced-card:nth-child(2) .advanced-title small {
  max-width: 78%;
  font-size: 15px;
}

.advanced-mini-stack,
.advanced-item-strip {
  position: absolute;
  right: 18px;
  bottom: 20px;
  z-index: 2;
  display: flex;
  gap: 8px;
  align-items: flex-end;
}

.advanced-mini-stack img,
.advanced-item-strip img {
  width: 54px;
  height: 68px;
  border: 2px solid rgba(255, 255, 255, 0.82);
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 10px 22px rgba(12, 14, 25, 0.18);
  object-fit: cover;
  object-position: top center;
}

.advanced-card:nth-child(1) .advanced-mini-stack img,
.advanced-card:nth-child(2) .advanced-mini-stack img {
  width: 70px;
  height: 88px;
}

.video-generate-visual .advanced-main-img {
  object-position: center center;
}

.video-frame-stack {
  position: absolute;
  right: 20px;
  bottom: 22px;
  z-index: 3;
  display: grid;
  gap: 8px;
}

.video-frame-stack span {
  display: inline-grid;
  place-items: center;
  width: 72px;
  height: 46px;
  border: 2px solid rgba(255, 255, 255, 0.78);
  border-radius: 12px;
  color: #fff;
  background: rgba(14, 18, 30, 0.46);
  box-shadow: 0 12px 24px rgba(8, 12, 20, 0.18);
  font-size: 14px;
  font-weight: 525;
  backdrop-filter: blur(8px);
}

.video-frame-stack span:nth-child(2) {
  transform: translateX(-18px);
}

.video-frame-stack span:nth-child(3) {
  transform: translateX(-36px);
}

.advanced-item-strip img {
  width: 52px;
  height: 52px;
  padding: 4px;
  object-fit: contain;
}

.script-board {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  z-index: 2;
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 14px;
  color: #fff;
  background: rgba(15, 20, 32, 0.68);
  box-shadow: 0 14px 28px rgba(8, 12, 20, 0.22);
  backdrop-filter: blur(12px);
}

.script-board b {
  font-size: 25px;
  line-height: 1;
}

.script-board em,
.script-board small {
  font-style: normal;
  line-height: 1.35;
}

.script-board em {
  font-size: 13px;
  font-weight: 525;
}

.script-board small {
  color: rgba(255, 255, 255, 0.76);
  font-size: 12px;
  font-weight: 525;
}

.advanced-foot {
  position: absolute;
  left: 18px;
  bottom: 18px;
  z-index: 3;
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  min-width: 0;
  min-height: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  color: #fff;
  background: transparent;
  font-size: 12px;
  font-weight: 525;
  line-height: 1.25;
  text-overflow: clip;
  white-space: normal;
}

.advanced-foot span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.14);
  backdrop-filter: blur(8px);
}

.script-visual .advanced-title {
  display: none;
}

.script-visual .advanced-foot {
  display: none;
}

.poster-preview,
.buyer-preview {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px;
  min-height: 132px;
}

.poster-preview img,
.buyer-preview img {
  width: 100%;
  height: 132px;
  border-radius: 9px;
  object-fit: cover;
  object-position: top center;
}

.model-preview,
.product-preview,
.item-grid {
  display: grid;
  gap: 8px;
}

.model-preview {
  grid-template-columns: repeat(4, 1fr);
}

.model-preview em {
  grid-column: span 2;
  color: #4d5061;
  font-size: 12px;
  font-style: normal;
  font-weight: 525;
}

.model-preview img,
.model-preview span {
  width: 100%;
  height: 108px;
  border-radius: 9px;
  object-fit: cover;
  object-position: top center;
}

.model-preview span {
  display: grid;
  gap: 6px;
  place-items: center;
  border: 1px dashed #dfe0eb;
  color: #8f94a5;
  background: #fafafe;
  font-size: 12px;
  font-weight: 525;
}

.item-grid,
.product-preview {
  grid-template-columns: repeat(3, 1fr);
}

.item-grid span,
.product-preview img {
  min-width: 0;
  border: 1px solid #eeeef7;
  border-radius: 9px;
  background: #fafafe;
}

.item-grid span {
  display: grid;
  gap: 5px;
  place-items: center;
  min-height: 76px;
  padding: 7px;
  color: #4f5362;
  font-size: 12px;
  font-weight: 525;
}

.item-grid img {
  width: 100%;
  height: 42px;
  object-fit: contain;
}

.product-preview img {
  width: 100%;
  height: 66px;
  object-fit: contain;
  padding: 5px;
}

.copy-preview,
.watermark-card {
  display: grid;
  align-content: center;
  min-height: 132px;
  padding: 16px;
  overflow: hidden;
  border-radius: 12px;
  background: linear-gradient(135deg, #faf9ff, #f3f0ff);
}

.copy-preview b {
  color: var(--purple);
  font-size: 26px;
}

.copy-preview span {
  margin-top: 8px;
  font-size: 16px;
  font-weight: 525;
}

.copy-preview p {
  margin: 8px 0 0;
  color: #8a8fa3;
  font-size: 12px;
  line-height: 1.45;
}

.copy-preview.video {
  background: linear-gradient(135deg, #effcff, #f4f0ff);
}

.watermark-card {
  position: relative;
  padding: 0;
}

.watermark-card img {
  width: 100%;
  height: 132px;
  object-fit: cover;
}

.watermark-card em {
  position: absolute;
  right: 14px;
  bottom: 12px;
  padding: 6px 10px;
  border-radius: 8px;
  color: #fff;
  background: rgba(123, 97, 255, 0.72);
  font-style: normal;
  font-weight: 525;
}

.task-panel {
  display: grid;
  gap: 12px;
  padding: 14px 18px;
  scroll-margin-top: 86px;
}

body.workstation-feature-mode .task-panel {
  height: 100%;
  min-height: 0;
  grid-template-rows: auto minmax(0, 1fr) 118px;
  gap: 8px;
  overflow: hidden;
  padding: 14px 18px 16px;
}

.task-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.task-heading-copy {
  min-width: 0;
}

.task-heading span {
  color: var(--purple);
  font-weight: 525;
}

.task-heading-copy > span,
.task-heading-copy > p,
.task-panel .workflow-card,
.task-panel .result-tags {
  display: none !important;
}

.task-heading h2 {
  margin: 0;
  font-size: 21px;
}

.task-heading p {
  margin: 0;
  color: var(--muted);
}

.task-body {
  display: grid;
  grid-template-columns: minmax(320px, 0.34fr) minmax(0, 1fr);
  gap: 20px;
  align-items: stretch;
  overflow: hidden;
  min-height: 0;
}

.preview-column {
  grid-column: 2 / 3;
  grid-row: 1 / span 2;
  display: grid;
  gap: 8px;
  min-width: 0;
  min-height: 0;
  align-self: stretch;
}

.library-select-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.library-select-button {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  min-width: 0;
  padding: 0 10px;
  border: 1px solid #ded8ff;
  border-radius: 12px;
  color: var(--purple);
  background: #fff;
  font-size: 14px;
  font-weight: 525;
  white-space: nowrap;
}

.library-select-button .lucide {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
}

.detail-page-basic-selects {
  display: none;
}

.detail-page-select-field {
  position: relative;
  display: block;
  min-width: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  z-index: 1;
}

.detail-page-select-field[open] {
  z-index: 90;
}

.detail-page-select-field summary {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  min-height: 42px;
  padding: 8px 30px 8px 10px;
  border: 1px solid rgba(123, 97, 255, 0.16);
  border-radius: 13px;
  background: linear-gradient(180deg, #ffffff 0%, #fbfaff 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.9), 0 10px 22px rgba(66, 57, 132, 0.07);
  cursor: pointer;
  list-style: none;
}

.detail-page-select-field summary::-webkit-details-marker {
  display: none;
}

.detail-page-select-field summary span {
  color: #6657ff;
  font-size: 12px;
  font-weight: 525;
  line-height: 1;
  white-space: nowrap;
}

.detail-page-select-field summary strong {
  overflow: hidden;
  color: #2d3245;
  font-size: 12px;
  font-weight: 525;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.detail-page-select-field summary::after {
  position: absolute;
  right: 14px;
  top: 50%;
  content: "";
  width: 6px;
  height: 6px;
  border-right: 2px solid rgba(113, 98, 232, 0.52);
  border-bottom: 2px solid rgba(113, 98, 232, 0.52);
  pointer-events: none;
  transform: translateY(-60%) rotate(45deg);
  transition: transform 0.16s ease;
}

.detail-page-select-field[open] summary,
.detail-page-select-field summary:hover,
.detail-page-select-field summary:focus-visible {
  border-color: rgba(123, 97, 255, 0.42);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.95), 0 12px 24px rgba(92, 76, 180, 0.1);
  outline: none;
}

.detail-page-select-field[open] summary::after {
  transform: translateY(-35%) rotate(225deg);
}

.detail-page-select-field.is-disabled summary {
  cursor: not-allowed;
  opacity: 0.72;
  background: #f6f7fb;
  box-shadow: none;
}

.detail-page-select-field.is-disabled summary:hover,
.detail-page-select-field.is-disabled summary:focus-visible {
  border-color: rgba(123, 97, 255, 0.16);
  box-shadow: none;
}

.detail-page-select-field.is-disabled summary span {
  color: #8b91a3;
}

.detail-page-select-field.is-disabled summary strong {
  color: #747b8f;
}

.detail-page-select-field.is-disabled .detail-page-select-menu {
  display: none;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"].is-reference-locked .choice-button:disabled ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"].is-reference-locked .choice-button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
  transform: none;
  box-shadow: none;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"].is-reference-locked .choice-button.selected:disabled ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"].is-reference-locked .choice-button.selected:disabled {
  opacity: 0.78;
}

.detail-page-select-menu {
  position: absolute;
  z-index: 260;
  top: calc(100% + 8px);
  left: 0;
  right: auto;
  display: grid;
  gap: 2px;
  width: max(100%, 190px);
  padding: 6px;
  overflow: visible;
  border: 1px solid #e9e7f5;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(42, 39, 78, 0.12);
}

.detail-page-select-menu button {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 30px;
  padding: 0 8px;
  border: 0;
  border-radius: 8px;
  color: #353b50;
  background: transparent;
  font: inherit;
  font-size: 12.5px;
  font-weight: 525;
  text-align: left;
  cursor: pointer;
}

.detail-page-select-menu button span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ratio-mini {
  display: inline-block;
  flex: 0 0 auto;
  border: 1px solid rgba(92, 74, 240, 0.52);
  border-radius: 4px;
  background: #f8f7ff;
}

.ratio-1-1 {
  width: 18px;
  height: 18px;
}

.ratio-3-4 {
  width: 15px;
  height: 20px;
}

.ratio-4-5 {
  width: 16px;
  height: 20px;
}

.ratio-9-16 {
  width: 12px;
  height: 22px;
}

.ratio-16-9 {
  width: 24px;
  height: 14px;
}

.detail-page-select-menu button:hover {
  background: #f7f6ff;
}

.detail-page-select-menu button.selected {
  color: #5c4af0;
  background: #f3f0ff;
  box-shadow: none;
}

.detail-page-module-picker {
  display: none;
}

.detail-page-module-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.detail-page-module-head span {
  color: #2d3245;
  font-size: 13px;
  font-weight: 600;
}

.detail-page-module-head small {
  color: #8a8fa3;
  font-size: 12px;
  font-weight: 400;
}

.detail-page-module-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  overflow: visible;
}

.detail-page-module-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 12px;
  border: 1px solid #eceaf7;
  border-radius: 12px;
  background: #fff;
}

.detail-page-module-card.is-selected {
  border-color: rgba(102, 87, 255, 0.34);
  background: #fbfaff;
}

.detail-page-module-card:has(.detail-count-select[open]) {
  z-index: 20;
}

.detail-page-module-card label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: #2d3245;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
}

.detail-page-module-card input {
  display: none;
}

.detail-page-module-card label span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.detail-page-module-card label strong {
  color: #1d2436;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 560;
}

.detail-page-module-card label small {
  color: #7d8497;
  font-size: 11.5px;
  line-height: 1.35;
  font-weight: 400;
  white-space: normal;
}

.detail-page-module-count {
  display: grid;
  gap: 4px;
  justify-items: end;
  margin-top: 0;
}

.detail-page-count-label {
  color: #8a8fa3;
  font-size: 10.5px;
  font-weight: 400;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-count .detail-count-select,
.detail-page-module-count .detail-count-select {
  position: relative;
  width: 70px;
  height: 30px;
  border: 1px solid #dfe3ef;
  border-radius: 10px;
  color: #394255;
  background: #fff;
  font: inherit;
  font-size: 12px;
  font-weight: 500;
  box-shadow: none;
}

.detail-page-module-count .detail-count-select summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
  padding: 0 9px;
  cursor: pointer;
  list-style: none;
}

.detail-page-module-count .detail-count-select summary::-webkit-details-marker {
  display: none;
}

.detail-page-module-count .detail-count-select summary::after {
  content: "";
  width: 6px;
  height: 6px;
  border-right: 1.5px solid #6f7688;
  border-bottom: 1.5px solid #6f7688;
  transform: rotate(45deg) translateY(-2px);
}

.detail-page-module-count .detail-count-select[open] summary::after {
  transform: rotate(225deg) translate(-1px, -1px);
}

.try-on-model-panel {
  display: grid;
  gap: 12px;
}

.clothes-on-model-panel,
.poster-design-panel,
.live-sticker-panel {
  display: grid;
  gap: 12px;
}

.live-sticker-panel {
  gap: 12px;
}

.poster-design-type-grid,
.poster-design-style-grid,
.poster-design-ratio-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.live-sticker-ratio-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.poster-design-ratio-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .choice-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .extra-prompt-box {
  border: 1px solid rgba(220, 213, 244, 0.78) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-type-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-style-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-ratio-grid {
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .choice-button {
  border-color: rgba(220, 213, 244, 0.78) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .choice-button.selected {
  border-color: rgba(109, 85, 238, 0.58) !important;
  color: var(--purple) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button:focus-visible {
  border-color: var(--line) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button .upload-icon {
  color: var(--purple) !important;
  background: var(--purple-soft) !important;
  box-shadow: none !important;
}

.clothes-age-select-block {
  position: relative;
  display: grid;
  gap: 8px;
}

.clothes-age-select {
  position: relative;
}

.clothes-age-select summary {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 46px;
  padding: 0 14px;
  border: 1px solid #ded8ff;
  border-radius: 12px;
  color: #282d3d;
  background: linear-gradient(180deg, #ffffff 0%, #fbfaff 100%);
  font-size: 14px;
  font-weight: 525;
  letter-spacing: 0;
  box-shadow: 0 8px 18px rgba(81, 70, 140, 0.06);
  cursor: pointer;
  list-style: none;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.clothes-age-select summary span {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}

.clothes-age-select summary::-webkit-details-marker {
  display: none;
}

.clothes-age-select summary:hover {
  border-color: #c9beff;
  background: #fff;
}

.clothes-age-select[open] summary,
.clothes-age-select summary:focus-visible {
  border-color: #8c7bff;
  box-shadow: 0 0 0 3px rgba(102, 87, 255, 0.12), 0 10px 22px rgba(81, 70, 140, 0.08);
  outline: none;
}

.clothes-age-select summary .lucide {
  margin-left: auto;
  width: 16px;
  height: 16px;
  color: #7a8194;
  transition: color 0.18s ease, transform 0.18s ease;
}

.clothes-age-select[open] summary .lucide {
  color: var(--purple);
  transform: rotate(180deg);
}

.clothes-age-menu {
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  padding: 8px;
  border: 1px solid #e5e0ff;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 38px rgba(44, 37, 86, 0.16);
}

.clothes-age-menu button {
  min-height: 38px;
  padding: 0 6px;
  border: 1px solid rgba(220, 213, 244, 0.72);
  border-radius: 10px;
  color: #34394b;
  background: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  font-weight: 525;
  text-align: center;
  cursor: pointer;
}

.clothes-age-menu button:hover {
  border-color: #c9beff;
  color: var(--purple);
  background: #f5f2ff;
}

.clothes-age-menu button.selected {
  border-color: #cfc5ff;
  color: var(--purple);
  background: #eeeaff;
  box-shadow: 0 0 0 2px rgba(109, 85, 238, 0.08);
}

.clothes-model-reference-panel {
  padding-top: 4px;
}

.try-on-model-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.try-on-model-button {
  width: 100%;
  min-height: 74px;
  font-size: 15px;
  justify-content: center;
  text-align: center;
}

.try-on-model-button span {
  display: grid;
  gap: 3px;
}

.try-on-model-button small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 525;
}

.try-on-garment-box {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
}

.try-on-garment-upload,
.try-on-example-button {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  min-height: 74px;
  padding: 10px;
  border: 1px solid #e4ddff;
  border-radius: 14px;
  color: #2f3447;
  background: #fff;
  box-shadow: none;
  cursor: pointer;
}

.try-on-garment-upload > .lucide,
.try-on-example-button > .lucide {
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  color: var(--purple);
}

.try-on-garment-upload span,
.try-on-example-button span {
  display: grid;
  gap: 4px;
  min-width: 0;
  text-align: center;
}

.try-on-garment-upload strong,
.try-on-example-button strong {
  font-size: 15px;
  font-weight: 525;
}

.try-on-garment-upload small,
.try-on-example-button small {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.try-on-garment-clear {
  position: absolute;
  top: 6px;
  right: 8px;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid rgba(255, 255, 255, 0.75);
  border-radius: 999px;
  color: #fff;
  background: rgba(32, 30, 45, 0.62);
  cursor: pointer;
}

.try-on-example-button {
  justify-content: center;
  border-color: rgba(123, 97, 255, 0.22);
  color: var(--purple);
  background: linear-gradient(180deg, rgba(248, 246, 255, 0.98), #fff);
}

.try-on-example-button span {
  text-align: center;
}

.try-on-garment-preview-chip {
  position: absolute;
  left: 24px;
  bottom: 24px;
  z-index: 18;
  display: block;
  width: 300px;
  height: 400px;
  padding: 0;
  border: 1px solid rgba(228, 221, 255, 0.94);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 14px 34px rgba(36, 32, 72, 0.14);
  backdrop-filter: blur(10px);
  overflow: hidden;
}

.try-on-garment-preview-chip[hidden] {
  display: none;
}

.try-on-garment-preview-chip img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 0;
  object-fit: cover;
  object-position: top center;
  background: #f6f4ff;
}

.try-on-garment-preview-chip button {
  position: absolute;
  top: 6px;
  right: 6px;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 999px;
  color: #fff;
  background: rgba(32, 30, 45, 0.62);
  cursor: pointer;
}

.try-on-garment-preview-chip button .lucide {
  width: 14px;
  height: 14px;
}

.try-on-garment-clear .lucide {
  width: 14px;
  height: 14px;
}

.try-on-reference-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.try-on-reference-card {
  position: relative;
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 8px;
  border: 1px solid #e4ddff;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 10px 20px rgba(36, 31, 72, 0.06);
}

.try-on-reference-card img {
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: 10px;
  object-fit: cover;
  object-position: top center;
}

.try-on-reference-card figcaption {
  overflow: hidden;
  color: #4d556b;
  font-size: 12px;
  font-weight: 525;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.try-on-reference-card button {
  position: absolute;
  top: 6px;
  right: 6px;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid rgba(255, 255, 255, 0.75);
  border-radius: 999px;
  color: #fff;
  background: rgba(32, 30, 45, 0.62);
}

.try-on-reference-card button .lucide {
  width: 14px;
  height: 14px;
}

.try-on-model-empty {
  margin: 0;
  padding: 12px;
  border: 1px dashed #d8d0ff;
  border-radius: 14px;
  color: var(--muted);
  background: #fbfaff;
  font-size: 13px;
  line-height: 1.5;
}

.upload-column {
  grid-column: 1 / 2;
  grid-row: 1;
  display: grid;
  gap: 10px;
  min-height: 0;
  overflow: visible;
}

body.feature-focus-mode .upload-column {
  gap: 6px;
}

.upload-primary-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: stretch;
}

.upload-primary-row .upload-card {
  min-width: 0;
}

.upload-card-wrap {
  position: relative;
  display: grid;
  min-width: 0;
}

.upload-card-wrap .upload-card {
  width: 100%;
  height: 100%;
}

.upload-card {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  align-content: center;
  justify-items: center;
  min-height: 220px;
  padding: 16px;
  border: 1px dashed #d7d0ff;
  border-radius: 18px;
  color: var(--ink);
  text-align: center;
  background: linear-gradient(180deg, #fff, #fbfaff);
}

.upload-example-button {
  display: grid;
  gap: 8px;
  place-items: center;
  width: 116px;
  min-height: 122px;
  padding: 12px 10px;
  border: 1px solid rgba(123, 97, 255, 0.18);
  border-radius: 18px;
  color: #5f49f2;
  background: linear-gradient(180deg, #fbf9ff, #f2efff);
  box-shadow: none;
  font-size: 15px;
  font-weight: 525;
  line-height: 1.25;
  text-align: center;
  cursor: pointer;
}

.upload-example-button[hidden] {
  display: none;
}

.upload-example-button:hover,
.upload-example-button:focus-visible {
  border-color: rgba(123, 97, 255, 0.42);
  box-shadow: none;
  outline: 0;
  transform: translateY(-1px);
}

.upload-example-button .lucide {
  width: 32px;
  height: 32px;
  padding: 7px;
  border-radius: 10px;
  color: #fff;
  background: linear-gradient(135deg, #7b61ff, #43a8ff);
  box-shadow: none;
}

.upload-example-button span {
  font-size: 15px;
  line-height: 1.2;
}

.upload-example-button small {
  display: block;
  margin-top: -3px;
  color: #8b8fa3;
  font-size: 12px;
  font-weight: 525;
  line-height: 1.2;
}

.wrinkle-strength-box {
  width: 100%;
  margin-top: 10px;
  padding: 12px;
  border: 1px solid #efeff8;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  box-sizing: border-box;
}

.wrinkle-strength-title {
  display: block;
  margin-bottom: 9px;
  color: #31364a;
  font-size: 13px;
  font-weight: 525;
  line-height: 1.2;
}

.wrinkle-strength-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
}

body:not([data-active-feature="wrinkle"]) .wrinkle-strength-box {
  display: none !important;
}

.wrinkle-strength-button {
  min-height: 40px;
  border: 1px solid #e7e2fb;
  border-radius: 14px;
  color: #575d72;
  background: #fff;
  font-size: 15px;
  font-weight: 525;
  cursor: pointer;
  box-shadow: none;
}

.wrinkle-strength-button.selected {
  border-color: rgba(123, 97, 255, 0.62);
  color: #fff;
  background: var(--purple);
}

.video-bottom-options {
  display: none;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: start;
  position: relative;
  z-index: 8;
}

.detail-bottom-options {
  display: none;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-items: start;
  position: relative;
  z-index: 18;
}

.video-upload-options {
  display: none;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  min-width: 0;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-bottom-options {
  display: grid;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options {
  display: grid;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-compact-select summary {
  min-height: 40px;
  padding: 0 9px 0 11px;
  gap: 6px;
  border-radius: 11px;
  box-shadow: 0 7px 18px rgba(54, 46, 92, 0.06);
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-compact-select summary span {
  font-size: 12.5px;
  font-weight: 650;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-compact-select summary strong {
  font-size: 13px;
  font-weight: 720;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-compact-select summary svg {
  width: 13px;
  height: 13px;
}

.video-compact-select {
  position: relative;
  width: 100%;
}

.video-compact-select summary {
  display: grid;
  grid-template-columns: minmax(0, auto) minmax(0, 1fr) 16px;
  grid-template-areas: "label value icon";
  gap: 8px;
  align-items: center;
  min-height: 48px;
  padding: 0 11px 0 13px;
  border: 1px solid rgba(216, 209, 248, 0.9);
  border-radius: 13px;
  color: #30364b;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(249, 248, 255, 0.96));
  box-shadow: 0 10px 24px rgba(54, 46, 92, 0.08);
  cursor: pointer;
  list-style: none;
  box-sizing: border-box;
}

.video-compact-select summary::-webkit-details-marker {
  display: none;
}

.video-compact-select summary span {
  grid-area: label;
  color: #555b70;
  font-size: 14px;
  font-weight: 650;
  line-height: 1;
  white-space: nowrap;
}

.video-compact-select summary strong {
  grid-area: value;
  overflow: hidden;
  justify-self: end;
  max-width: 100%;
  color: #2f3448;
  font-size: 15px;
  font-weight: 760;
  line-height: 1;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.video-compact-select summary svg {
  grid-area: icon;
  justify-self: end;
  width: 15px;
  height: 15px;
  color: #7b61ff;
  transition: transform 0.16s ease;
}

.video-compact-select[open] summary {
  border-color: rgba(123, 97, 255, 0.55);
  background: #fff;
  box-shadow: 0 12px 28px rgba(85, 72, 132, 0.13);
}

.video-compact-select summary:hover {
  border-color: rgba(123, 97, 255, 0.42);
  box-shadow: 0 12px 26px rgba(70, 59, 110, 0.11);
}

.video-compact-select[open] summary svg {
  transform: rotate(180deg);
}

.video-compact-menu {
  position: absolute;
  right: 0;
  left: 0;
  bottom: calc(100% + 6px);
  display: grid;
  gap: 6px;
  min-width: 100%;
  padding: 8px;
  border: 1px solid #e9e4fb;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 18px 38px rgba(41, 35, 75, 0.14);
  box-sizing: border-box;
}

.video-compact-menu-grid {
  left: auto;
  width: 174px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.video-compact-menu button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-height: 32px;
  padding: 0 8px;
  border: 1px solid #eeeaf9;
  border-radius: 9px;
  color: #565d73;
  background: #fff;
  font-size: 12px;
  font-weight: 550;
  cursor: pointer;
  box-shadow: none;
  white-space: nowrap;
}

.video-compact-menu button.selected {
  border-color: rgba(123, 97, 255, 0.64);
  color: #fff;
  background: var(--purple);
}

.video-compact-menu button.is-disabled {
  border-color: #ececf2;
  color: #a5a8b6;
  background: #f7f7fa;
  cursor: not-allowed;
  opacity: 0.68;
}

.video-compact-menu button.is-disabled.selected {
  border-color: #d8d8e2;
  color: #8f93a3;
  background: #f1f1f5;
}

.video-upload-options .video-compact-menu {
  top: calc(100% + 6px);
  bottom: auto;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options .video-compact-menu {
  z-index: 1200 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-column,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-card-wrap,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-compact-select {
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-compact-select[open] {
  z-index: 1300 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-column {
  position: relative !important;
  z-index: 900 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-card-wrap,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] #product-upload,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options {
  position: relative !important;
  z-index: 910 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options:has(.video-compact-select[open]) {
  z-index: 1250 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .preview-column {
  position: relative !important;
  z-index: 20 !important;
}

.video-ratio-icon {
  display: inline-block;
  width: 14px;
  height: 14px;
  border: 1.6px solid currentColor;
  border-radius: 3px;
  opacity: 0.82;
  box-sizing: border-box;
}

.video-ratio-9-16 {
  width: 9px;
  height: 16px;
}

.video-ratio-16-9 {
  width: 17px;
  height: 10px;
}

.video-ratio-1-1 {
  width: 14px;
  height: 14px;
}

.video-ratio-3-4 {
  width: 11px;
  height: 15px;
}

.video-ratio-4-3 {
  width: 16px;
  height: 12px;
}

.video-ratio-21-9 {
  width: 20px;
  height: 9px;
}

body.feature-focus-mode .upload-card {
  min-height: 122px;
  padding: 14px 13px;
}

body.feature-focus-mode .upload-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
}

body.feature-focus-mode .upload-card strong {
  margin-bottom: 3px;
  font-size: 15px;
}

body.feature-focus-mode .upload-card small {
  font-size: 11px;
  line-height: 1.3;
}

.upload-card.is-filled {
  border-style: solid;
  border-color: var(--purple);
}

.upload-card.is-uploading {
  border-style: solid;
  border-color: rgba(123, 97, 255, 0.42);
  background: linear-gradient(180deg, #fff, #fbfaff);
}

.upload-instant-status {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.upload-instant-status[hidden] {
  display: none;
}

.upload-instant-thumb {
  position: relative;
  width: 136px;
  height: 106px;
  border-radius: 12px;
  overflow: hidden;
  background: #f1effa;
}

.upload-instant-thumb::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  width: 26px;
  height: 26px;
  margin: -13px 0 0 -13px;
  border: 2px solid rgba(255, 255, 255, 0.78);
  border-top-color: rgba(123, 97, 255, 0.95);
  border-radius: 999px;
  animation: uploadInstantSpin 0.72s linear infinite;
  box-shadow: 0 2px 8px rgba(46, 39, 92, 0.16);
}

.upload-instant-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: inherit;
  background: rgba(20, 18, 42, 0.12);
  pointer-events: none;
}

.upload-instant-thumb img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: inherit;
  object-fit: cover;
}

.upload-instant-copy {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.upload-instant-copy strong {
  font: inherit;
}

.upload-instant-copy small {
  font: inherit;
}

.upload-card.is-uploading .upload-icon,
.upload-card.is-uploading .upload-copy {
  display: grid;
}

.detail-upload-strip.is-uploading-preview {
  display: flex;
}

.is-uploading-preview-card {
  position: relative;
  pointer-events: none;
}

.is-uploading-preview-card::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  width: 26px;
  height: 26px;
  margin: -13px 0 0 -13px;
  border: 2px solid rgba(255, 255, 255, 0.78);
  border-top-color: rgba(123, 97, 255, 0.95);
  border-radius: 999px;
  animation: uploadInstantSpin 0.72s linear infinite;
  box-shadow: 0 2px 8px rgba(46, 39, 92, 0.16);
}

.is-uploading-preview-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  border-radius: inherit;
  background: rgba(20, 18, 42, 0.12);
  pointer-events: none;
}

@keyframes uploadInstantSpin {
  to {
    transform: rotate(360deg);
  }
}

.upload-clear-x {
  position: absolute;
  top: -10px;
  right: -10px;
  z-index: 8;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 2px solid #fff;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, #ff3158, #d71942);
  box-shadow: 0 12px 24px rgba(215, 25, 66, 0.28);
  cursor: pointer;
}

.upload-clear-x[hidden] {
  display: none;
}

.upload-clear-x:hover,
.upload-clear-x:focus-visible {
  outline: 0;
  transform: translateY(-1px) scale(1.05);
  box-shadow: 0 16px 30px rgba(215, 25, 66, 0.34);
}

.upload-clear-x .lucide {
  width: 19px;
  height: 19px;
  stroke-width: 3;
}

.upload-card.is-dragover {
  border-color: var(--purple);
  background: #f8f5ff;
  box-shadow: 0 0 0 4px rgba(123, 97, 255, 0.12);
}

.upload-card > img,
.upload-card:not(.is-filled) img {
  display: none;
}

.upload-card.needs-upload {
  border-color: #ff7b8a;
  box-shadow: 0 0 0 3px rgba(255, 88, 112, 0.1);
}

body.auth-modal-open .upload-card,
body.auth-modal-open .upload-card:hover,
body.auth-modal-open .upload-card:focus,
body.auth-modal-open .upload-card:focus-visible,
body.auth-modal-open .upload-card.is-dragover,
body.auth-modal-open .upload-card.needs-upload,
body.auth-modal-open .free-page-upload-zone,
body.auth-modal-open .free-page-upload-zone:hover,
body.auth-modal-open .free-page-upload-zone:focus,
body.auth-modal-open .free-page-upload-zone:focus-visible,
body.auth-modal-open .free-page-upload-zone.is-dragover {
  border-color: #d7d0ff !important;
  background: linear-gradient(180deg, #fff, #fbfaff) !important;
  box-shadow: none !important;
  outline: 0 !important;
  transform: none !important;
}

.upload-icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 16px;
  color: var(--purple);
  background: var(--purple-soft);
  box-shadow: none;
}

.upload-icon .lucide {
  width: 25px;
  height: 25px;
  stroke-width: 2.25;
}

.upload-icon .upload-icon-fallback {
  display: block;
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.15;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.upload-icon > svg.lucide + .upload-icon-fallback {
  display: none;
}

.upload-card img {
  width: 136px;
  height: 106px;
  border-radius: 12px;
  object-fit: contain;
  background: #f3f2fb;
}

.color-reference-upload-row,
.color-reference-upload-card-wrap {
  width: 100%;
  min-width: 0;
}

.color-reference-upload-card-wrap {
  position: relative;
  overflow: visible !important;
}

body[data-active-feature="colors"] .color-reference-upload {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) minmax(82px, 118px) !important;
  align-content: center !important;
  align-items: center !important;
  justify-items: stretch !important;
  width: 100% !important;
  min-height: 122px !important;
  padding: 13px !important;
  gap: 12px !important;
  text-align: left !important;
}

body[data-active-feature="colors"] .color-reference-upload .upload-icon {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  width: 42px !important;
  height: 42px !important;
}

body[data-active-feature="colors"] .color-reference-upload .upload-copy {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

body[data-active-feature="colors"] .color-reference-preview-strip {
  grid-column: 3 !important;
  grid-row: 1 !important;
  display: grid !important;
  justify-content: end !important;
  width: min(118px, max-content) !important;
  min-width: 82px !important;
  max-width: 118px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body[data-active-feature="colors"] .color-reference-preview-strip[hidden] {
  display: none !important;
}

body[data-active-feature="colors"] .color-reference-preview-strip .single-upload-preview-card {
  width: auto !important;
  height: 82px !important;
  max-width: 118px !important;
  aspect-ratio: var(--preview-aspect, 1 / 1) !important;
  cursor: zoom-in;
}

body[data-active-feature="colors"] .color-reference-clear-x {
  display: grid;
  top: 9px !important;
  right: 6px !important;
  z-index: 80 !important;
}

body[data-active-feature="colors"] .color-reference-clear-x[hidden] {
  display: none !important;
}

.color-reference-library-row {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 5px;
}

.color-reference-library-row .library-select-button {
  min-height: 44px;
  padding: 0 8px;
  font-size: 13px;
}

body.feature-focus-mode:not([data-active-feature="colors"]) .color-reference-upload {
  display: flex;
  min-height: 70px;
  padding: 10px 12px;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  text-align: left;
}

body.feature-focus-mode:not([data-active-feature="colors"]) .color-reference-upload .upload-icon {
  width: 64px;
  height: 50px;
  border-radius: 13px;
}

body.feature-focus-mode .color-reference-library-row {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 7px;
}

body.workstation-feature-mode[data-active-feature="colors"] .color-reference-library-row {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body.feature-focus-mode .color-reference-library-row .library-select-button {
  min-height: 42px;
  padding: 0 7px;
  font-size: 13px;
}

.clear-upload-button {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border: 1px solid #ffe1e6;
  border-radius: 12px;
  color: #e64e65;
  background: #fff;
  font-weight: 525;
}

body.workstation-feature-mode #clear-upload {
  display: none !important;
}

.upload-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 0;
}

.upload-stack[hidden] {
  display: none;
}

.upload-stack-card {
  position: relative;
  display: grid;
  place-items: center;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #ece9fb;
  border-radius: 14px;
  background: #fbfbff;
  box-shadow: 0 10px 22px rgba(72, 62, 120, 0.1);
  cursor: zoom-in;
}

.upload-stack-card img {
  display: block;
  width: 100%;
  height: 112px;
  object-fit: contain;
  background: #f3f2fb;
}

.upload-stack-delete {
  position: absolute;
  right: 7px;
  top: 7px;
  z-index: 2;
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 999px;
  color: #fff;
  background: rgba(16, 20, 31, 0.76);
  box-shadow: 0 8px 18px rgba(12, 15, 24, 0.24);
  opacity: 0;
  transform: translateY(-3px);
  transition: opacity 0.18s ease, transform 0.18s ease, background 0.18s ease;
}

.upload-stack-delete .lucide {
  width: 15px;
  height: 15px;
}

.upload-stack-card:hover .upload-stack-delete,
.upload-stack-delete:focus-visible {
  opacity: 1;
  transform: translateY(0);
}

.upload-stack-delete:hover {
  background: #df3f55;
}

body.feature-focus-mode.workstation-feature-mode .upload-stack.image-upload-stack {
  display: flex !important;
  gap: 8px !important;
  width: 100% !important;
  margin-top: 8px !important;
  padding: 0 1px 2px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: thin !important;
}

body.feature-focus-mode.workstation-feature-mode .upload-stack.image-upload-stack[hidden] {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode .upload-stack.image-upload-stack .upload-stack-card {
  flex: 0 0 72px !important;
  width: 72px !important;
  min-width: 72px !important;
  height: 86px !important;
  border-radius: 12px !important;
  border-color: #e4e7f0 !important;
  background: #f8f9fc !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode .upload-stack.image-upload-stack .upload-stack-card img {
  height: 100% !important;
  object-fit: cover !important;
  background: #f8f9fc !important;
}

body.feature-focus-mode.workstation-feature-mode .upload-stack.image-upload-stack .upload-stack-delete {
  right: 4px !important;
  top: 4px !important;
  width: 19px !important;
  height: 19px !important;
  opacity: 0.76 !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode .upload-stack.image-upload-stack .upload-stack-delete .lucide {
  width: 11px !important;
  height: 11px !important;
}

.upload-card strong,
.upload-card small {
  display: block;
}

.upload-card strong {
  margin-bottom: 5px;
  font-size: 16px;
}

.upload-card small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.preview-card {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  min-width: 0;
  min-height: 520px;
  height: clamp(520px, 58vh, 640px);
  max-height: 640px;
  overflow: hidden;
  contain: layout paint;
  border-radius: 16px;
  background: #f1f1fa;
}

.pose-preview-note {
  position: absolute;
  top: 14px;
  left: 18px;
  right: 18px;
  z-index: 6;
  color: #777987;
  font-size: 14px;
  font-style: normal;
  font-weight: 525;
  line-height: 1.45;
  text-align: center;
  pointer-events: none;
}

.pose-preview-note[hidden] {
  display: none !important;
}

body.feature-focus-mode .preview-card {
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
}

body.feature-focus-mode .task-body {
  grid-template-columns: minmax(330px, 0.36fr) minmax(0, 1fr) !important;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}

body.feature-focus-mode .upload-column {
  grid-column: 1 / 2 !important;
  grid-row: 1 !important;
  order: initial !important;
}

body.feature-focus-mode .settings-column {
  grid-column: 1 / 2 !important;
  grid-row: 2 !important;
  order: initial !important;
}

body.feature-focus-mode .preview-column {
  grid-column: 2 / 3 !important;
  grid-row: 1 / span 2 !important;
  order: initial !important;
}

@media (max-height: 820px) and (min-width: 981px) {
  body.feature-focus-mode .topbar {
    min-height: 54px;
    padding-top: 7px;
    padding-bottom: 7px;
  }

  body.feature-focus-mode .task-panel {
    margin: 10px 0 18px;
    padding: 12px 16px;
    gap: 8px;
  }

  body.feature-focus-mode .task-heading {
    min-height: 0;
  }

  body.feature-focus-mode .task-heading h2 {
    font-size: 20px;
  }

  body.feature-focus-mode .task-body {
    grid-template-columns: minmax(300px, 0.34fr) minmax(0, 1fr) !important;
    grid-template-rows: auto minmax(0, auto);
    align-items: start;
    gap: 14px;
  }

  body.feature-focus-mode .preview-column {
    align-self: start;
  }

  body.feature-focus-mode .preview-card {
    height: clamp(360px, calc(100vh - 230px), 560px) !important;
    min-height: 360px !important;
    max-height: 560px !important;
  }

  body.feature-focus-mode:not(.workstation-feature-mode)[data-active-feature="background"] {
    --background-preview-lift: 0px;
  }

  body.feature-focus-mode:not(.workstation-feature-mode)[data-active-feature="background"] .preview-card {
    top: 0;
    height: clamp(360px, calc(100vh - 230px), 560px) !important;
  }

  body.feature-focus-mode .settings-card {
    max-height: none;
  }

  body.feature-focus-mode .task-recent-panel {
    min-height: 104px;
    max-height: 126px;
  }

  body.feature-focus-mode .task-recent-thumb {
    width: 72px;
    height: 86px;
  }

  body.feature-focus-mode .task-recent-gallery {
    align-items: center;
  }
}

@media (min-width: 901px) {
  body.feature-focus-mode:not(.workstation-feature-mode)[data-active-feature="background"] {
    --background-preview-lift: 62px;
  }

  body.feature-focus-mode:not(.workstation-feature-mode)[data-active-feature="background"] .task-body {
    overflow: visible;
  }

  body.feature-focus-mode:not(.workstation-feature-mode)[data-active-feature="background"] .preview-card {
    top: calc(-1 * var(--background-preview-lift));
    height: calc(100% + var(--background-preview-lift)) !important;
  }
}

body[data-active-feature="detail-page"] .task-body {
  grid-template-columns: minmax(460px, 0.48fr) minmax(460px, 0.52fr) !important;
}

body[data-active-feature="detail-page"] .settings-card {
  gap: 14px;
  padding: 16px;
  border-color: #dfe8ff;
  background: linear-gradient(180deg, #fff, #f8fbff);
}

body.feature-focus-mode[data-active-feature="detail-page"] .settings-column {
  gap: 11px;
}

body.feature-focus-mode[data-active-feature="detail-page"] .settings-card {
  gap: 12px;
  padding: 14px;
  border-radius: 16px;
}

body[data-active-feature="detail-page"] .preview-card {
  min-height: 500px;
}

.preview-card img {
  display: block;
  box-sizing: border-box;
  place-self: center;
  align-self: center;
  justify-self: center;
  min-width: 0;
  min-height: 0;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain !important;
  object-position: center center;
  background: transparent;
}

.preview-frame {
  position: relative;
  grid-area: 1 / 1;
  display: grid;
  place-items: center;
  width: calc(100% - 36px);
  height: calc(100% - 36px);
  min-width: 0;
  min-height: 0;
  max-width: calc(100% - 36px);
  max-height: calc(100% - 36px);
  overflow: clip;
  padding: clamp(18px, 2.4vw, 34px);
  border-radius: 14px;
  background: #f7f7fb;
}

.preview-empty {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: clamp(10px, 1.6vw, 18px);
  color: #7c8191;
  text-align: center;
  cursor: default;
  transition: background 0.18s ease, box-shadow 0.18s ease;
}

.preview-empty[hidden] {
  display: none;
}

.preview-empty-visual {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  place-items: center;
  width: min(92%, 1120px);
  max-width: 100%;
  aspect-ratio: 5 / 4;
  overflow: hidden;
  padding: clamp(8px, 1vw, 14px);
  border: 1px solid rgba(218, 213, 238, 0.95);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 18px 42px rgba(62, 57, 112, 0.12);
  cursor: pointer;
  pointer-events: auto;
  transform: translate(-50%, -50%);
  user-select: auto;
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.preview-empty-visual:hover,
.preview-empty-visual:focus-visible {
  border-color: rgba(102, 87, 255, 0.35);
  box-shadow: 0 22px 48px rgba(62, 57, 112, 0.16);
  outline: 0;
  transform: translate(-50%, -50%) scale(1.01);
}

#preview-frame .preview-empty-visual img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  object-position: center center;
  border-radius: 18px;
  transform: none !important;
  pointer-events: auto;
  user-select: auto;
  -webkit-user-drag: none;
}

.preview-empty-actions {
  position: absolute;
  left: 50%;
  bottom: clamp(14px, 2vw, 24px);
  z-index: 5;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: center;
  padding: 8px;
  max-width: min(620px, calc(100% - 36px));
  border: 1px solid rgba(232, 228, 248, 0.92);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: none;
  backdrop-filter: blur(12px);
  transform: translateX(-50%);
}

.preview-empty-actions[hidden] {
  display: none;
}

body[data-active-feature="pose-change"] .preview-empty-actions {
  border-radius: 22px;
  padding: 10px 12px 12px;
}

.preview-empty-action {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid #e8e8f2;
  border-radius: 999px;
  color: #4f5368;
  background: #fff;
  font-size: 13px;
  font-weight: 525;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: none;
}

.preview-empty-action.primary {
  border-color: transparent;
  color: #fff;
  background: linear-gradient(135deg, #7b61ff, #43a8ff);
  box-shadow: none;
}

.preview-empty-action:hover,
.preview-empty-action:focus-visible {
  border-color: rgba(123, 97, 255, 0.34);
  outline: 0;
  transform: translateY(-1px);
}

.preview-empty-action .lucide {
  width: 17px;
  height: 17px;
}

.preview-empty-upload {
  position: absolute;
  left: 50%;
  bottom: clamp(14px, 2.2vw, 26px);
  display: inline-flex;
  gap: 12px;
  align-items: center;
  justify-content: center;
  min-width: min(420px, 100%);
  min-height: 68px;
  padding: 12px 18px;
  border: 1px solid rgba(232, 228, 248, 0.98);
  border-radius: 18px;
  color: #30384d;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 12px 28px rgba(76, 69, 132, 0.09);
  cursor: pointer;
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
  transform: translateX(-50%);
}

.preview-empty-upload:hover,
.preview-empty-upload:focus-visible {
  border-color: rgba(102, 87, 255, 0.32);
  box-shadow: 0 16px 34px rgba(76, 69, 132, 0.14);
  outline: 0;
  transform: translate(-50%, -1px);
}

.preview-empty-upload .lucide {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  padding: 11px;
  border-radius: 14px;
  color: var(--purple);
  background: rgba(102, 87, 255, 0.1);
  box-shadow: none;
  stroke-width: 2.25;
}

.preview-empty-upload span {
  display: grid;
  gap: 3px;
  text-align: left;
}

.preview-empty strong {
  display: block;
  color: #30384d;
  font-size: 18px;
  line-height: 1.15;
  font-weight: 525;
}

.preview-empty small {
  display: block;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.25;
  font-weight: 525;
}

.view-angle-preview {
  position: absolute;
  left: 18px;
  top: 18px;
  z-index: 4;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  max-width: min(420px, calc(100% - 36px));
  min-height: 36px;
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 999px;
  color: #242838;
  background: rgba(255, 255, 255, 0.84);
  box-shadow: 0 12px 28px rgba(54, 50, 96, 0.12);
  backdrop-filter: blur(10px);
  font-size: 12px;
  font-weight: 525;
  pointer-events: none;
}

.view-angle-preview[hidden] {
  display: none;
}

.view-angle-preview .lucide {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  color: var(--purple);
  stroke-width: 2.6;
}

.view-angle-preview span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.repair-mask-canvas {
  position: absolute;
  z-index: 3;
  cursor: crosshair;
  touch-action: none;
  border-radius: 10px;
  pointer-events: auto;
  overflow: hidden;
  clip-path: inset(0 round 10px);
}

.repair-mask-canvas[hidden] {
  display: none;
}

.preview-card.repair-brush-active #preview-badge {
  background: #ff4c60;
}

body[data-active-feature="repair"] .preview-card:not(.is-gallery) .preview-frame img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

.preview-frame img,
.preview-card > img {
  place-self: center;
  align-self: center;
  justify-self: center;
  width: auto !important;
  height: auto !important;
  min-width: 0;
  min-height: 0;
  max-width: 92% !important;
  max-height: 92% !important;
  object-fit: contain !important;
  object-position: center center;
  transform: none !important;
}

body.feature-focus-mode .preview-frame img {
  max-width: min(92%, 1280px) !important;
  max-height: 92% !important;
}

body[data-active-feature="outpaint"] .preview-frame img,
body.feature-focus-mode[data-active-feature="outpaint"] .preview-frame img {
  max-width: var(--outpaint-image-max, 92%) !important;
  max-height: var(--outpaint-image-max, 92%) !important;
}

body[data-active-feature="view-change"] .preview-card.view-main-angle-active .preview-frame {
  perspective: 900px;
  perspective-origin: center;
  padding: clamp(8px, 1vw, 14px);
  background: transparent;
}

body[data-active-feature="view-change"] .preview-card.view-main-angle-active #preview-image {
  width: auto !important;
  height: auto !important;
  max-width: min(92%, 1120px) !important;
  max-height: 92% !important;
  transform: perspective(900px) rotateX(var(--view-main-rotate-x, 0deg)) rotateY(var(--view-main-rotate-y, 0deg)) !important;
  transform-origin: center center;
  transform-style: preserve-3d;
  transition:
    transform 0.22s ease,
    max-width 0.18s ease,
    max-height 0.18s ease;
  box-shadow: 0 18px 45px rgba(28, 31, 54, 0.13);
}

body.workstation-feature-mode[data-active-feature="view-change"] .preview-frame {
  background: transparent !important;
}

body.workstation-feature-mode[data-active-feature="view-change"] .preview-frame img {
  width: auto !important;
  height: auto !important;
  max-width: min(92%, 1120px) !important;
  max-height: 92% !important;
  object-fit: contain !important;
}

body.workstation-feature-mode[data-active-feature="view-change"] #preview-frame .preview-empty-visual img {
  object-fit: contain !important;
}

body.workstation-feature-mode[data-active-feature="pattern-transfer"] .preview-frame {
  background: transparent !important;
}

body.workstation-feature-mode[data-active-feature="pattern-transfer"] .preview-frame img {
  width: auto !important;
  height: auto !important;
  max-width: min(92%, 1120px) !important;
  max-height: 92% !important;
  object-fit: contain !important;
}

body.workstation-feature-mode[data-active-feature="pattern-transfer"] #preview-frame .preview-empty-visual img {
  object-fit: contain !important;
}

.outpaint-editor {
  position: absolute;
  inset: 0;
  z-index: 5;
  pointer-events: none;
}

.outpaint-editor[hidden] {
  display: none;
}

.outpaint-frame {
  position: absolute;
  min-width: 72px;
  min-height: 72px;
  border: 2px dashed rgba(123, 97, 255, 0.85);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.05);
  box-shadow: none;
  pointer-events: none;
}

.outpaint-handle {
  position: absolute;
  z-index: 2;
  width: 15px;
  height: 15px;
  padding: 0;
  border: 2px solid #fff;
  border-radius: 999px;
  background: var(--purple);
  box-shadow: 0 5px 14px rgba(80, 70, 150, 0.2);
  pointer-events: auto;
}

.outpaint-handle.north {
  left: 50%;
  top: -8px;
  cursor: ns-resize;
  transform: translateX(-50%);
}

.outpaint-handle.east {
  right: -8px;
  top: 50%;
  cursor: ew-resize;
  transform: translateY(-50%);
}

.outpaint-handle.south {
  left: 50%;
  bottom: -8px;
  cursor: ns-resize;
  transform: translateX(-50%);
}

.outpaint-handle.west {
  left: -8px;
  top: 50%;
  cursor: ew-resize;
  transform: translateY(-50%);
}

.outpaint-handle.north-west {
  left: -8px;
  top: -8px;
  cursor: nwse-resize;
}

.outpaint-handle.north-east {
  right: -8px;
  top: -8px;
  cursor: nesw-resize;
}

.outpaint-handle.south-west {
  left: -8px;
  bottom: -8px;
  cursor: nesw-resize;
}

.outpaint-handle.south-east {
  right: -8px;
  bottom: -8px;
  cursor: nwse-resize;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .extra-prompt-box {
  display: none !important;
}

.text-edit-panel {
  display: grid;
  gap: 12px;
}

.text-edit-head,
.text-edit-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.text-edit-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px;
}

.text-edit-head-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.text-edit-head span,
.text-edit-section-title {
  min-width: 0;
}

.text-edit-head strong,
.text-edit-section-title strong {
  display: block;
  color: #171721;
  font-size: 14px;
}

.text-edit-head small,
.text-edit-section-title small {
  display: block;
  margin-top: 2px;
  color: #85829a;
  font-size: 12px;
}

.text-edit-recognize-button,
.text-edit-delete-all-button {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 8px;
  white-space: nowrap;
}

.text-edit-recognize-button,
.text-edit-delete-all-button {
  box-sizing: border-box;
  min-height: 36px !important;
  height: 36px !important;
  font-size: 13px;
}

.text-edit-recognize-button {
  min-width: 118px;
}

.text-edit-delete-all-button.selected {
  border-color: rgba(216, 59, 98, 0.34);
  background: #fff4f7;
  color: #d83b62;
}

.text-edit-recognize-button.is-busy .lucide {
  animation: spin 1s linear infinite;
}

.text-edit-list {
  display: grid;
  gap: 8px;
}

.text-edit-list {
  max-height: min(48vh, 520px);
  overflow-y: auto;
  padding-right: 4px;
}

.text-edit-list::-webkit-scrollbar {
  width: 6px;
}

.text-edit-list::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(137, 116, 214, 0.28);
}

.text-edit-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 38px;
  gap: 10px;
  align-items: end;
  padding: 10px;
  border: 1px solid rgba(220, 213, 244, 0.88);
  border-radius: 14px;
  background:
    radial-gradient(circle at 0% 0%, rgba(255, 255, 255, 0.78), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(250, 248, 255, 0.78));
  box-shadow: 0 10px 22px rgba(105, 91, 164, 0.055);
}

.text-edit-row.is-deleted {
  border-color: rgba(229, 204, 214, 0.9);
  background: linear-gradient(180deg, rgba(255, 248, 250, 0.96), rgba(255, 244, 247, 0.82));
}

.text-edit-field {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.text-edit-field span {
  color: #77738f;
  font-size: 12px;
  font-weight: 600;
}

.text-edit-field input {
  width: 100%;
  height: 44px;
  border: 1px solid rgba(214, 207, 244, 0.92);
  border-radius: 12px;
  padding: 0 12px;
  background: rgba(255, 255, 255, 0.86);
  color: #27243a;
  font: inherit;
  outline: none;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}

.text-edit-field input:focus {
  border-color: #9c82ff;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(123, 97, 255, 0.13);
}

.text-edit-field-source input,
.text-edit-field input:disabled {
  color: #77738f;
  background: rgba(247, 246, 253, 0.94);
}

.text-edit-delete-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 44px;
  border: 1px solid rgba(236, 203, 214, 0.95);
  border-radius: 12px;
  background: rgba(255, 250, 251, 0.92);
  color: #d83b62;
  box-shadow: 0 8px 18px rgba(216, 59, 98, 0.08);
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
}

.text-edit-delete-button .lucide {
  width: 16px;
  height: 16px;
}

.text-edit-delete-button:hover {
  transform: translateY(-1px);
  border-color: rgba(216, 59, 98, 0.34);
  background: #fff;
}

.text-edit-delete-button.selected {
  border-color: rgba(157, 132, 255, 0.48);
  background: #f3efff;
  color: #6d54e8;
}

.text-edit-empty {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 10px 12px;
  border: 1px dashed #d9d5ea;
  border-radius: 10px;
  background: #fbfbff;
  color: #77738f;
  font-size: 13px;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-card {
  gap: 8px;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-scroll-area {
  gap: 10px;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-bottom-area {
  margin-top: 8px;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .workspace,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .task-panel {
  min-width: 1280px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .task-panel {
  grid-template-columns: minmax(286px, 320px) minmax(300px, 360px) minmax(560px, 1fr) !important;
  grid-template-rows: auto auto minmax(0, 1fr) 126px !important;
  gap: 0 22px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .task-heading {
  grid-column: 1 / 2 !important;
  grid-row: 1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .upload-column {
  grid-column: 1 / 2 !important;
  grid-row: 2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-column {
  display: contents !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-scroll-area {
  grid-column: 2 / 3 !important;
  grid-row: 1 / 5 !important;
  align-self: stretch !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-card {
  height: 100% !important;
  min-height: 0 !important;
  padding: 12px !important;
  border: 1px solid rgba(220, 213, 244, 0.82) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.78) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(249, 246, 255, 0.78)) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] #dynamic-settings,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-panel {
  min-height: 0 !important;
  height: 100% !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .preview-column {
  grid-column: 3 / 4 !important;
  grid-row: 1 / 4 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-bottom-area {
  grid-column: 1 / 2 !important;
  grid-row: 3 / 5 !important;
  align-self: end !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
  margin-top: 0 !important;
  padding: 0 22px 22px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-bottom-area .generate-count-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-bottom-area .generate-action-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-bottom-area .inline-model-section,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-bottom-area .generate-count-section,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-bottom-area .generation-resolution-section,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-bottom-area .create-button.full {
  min-height: 42px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-head {
  gap: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-head-actions {
  flex-wrap: wrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-head strong,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-section-title strong {
  font-size: 13px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-head small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-section-title small {
  font-size: 11px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-list {
  align-content: start !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow-y: auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-empty {
  min-height: 38px !important;
  padding: 9px 10px !important;
  border-radius: 10px !important;
  font-size: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 32px !important;
  gap: 7px !important;
  padding: 7px !important;
  border-radius: 11px !important;
  box-shadow: 0 8px 18px rgba(105, 91, 164, 0.045) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-field {
  gap: 3px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-field span {
  font-size: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-field input {
  height: 32px !important;
  padding: 0 9px !important;
  border-radius: 9px !important;
  font-size: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-delete-button {
  width: 32px !important;
  height: 32px !important;
  border-radius: 9px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-delete-button .lucide {
  width: 14px !important;
  height: 14px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-scroll-area {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-scroll-area > .settings-card {
  align-self: stretch !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  align-content: stretch !important;
  height: 100% !important;
  max-height: none !important;
}

.task-recent-panel {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
  min-height: 0;
  overflow: hidden;
  padding: 8px 10px;
  border: 1px solid #eceaf7;
  border-radius: 14px;
  background: #fbfbff;
}

body.library-focus-mode .task-recent-panel {
  display: none !important;
}

body.library-focus-mode.feature-focus-mode .task-panel {
  grid-template-rows: auto minmax(0, 1fr);
}

.task-recent-head {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 0;
  padding: 4px 0;
  border-radius: 10px;
  background: #f3f0ff;
}

.task-recent-head strong {
  display: grid;
  gap: 5px;
  place-items: center;
  color: #5f46f4;
  font-size: 14px;
  font-weight: 525;
  letter-spacing: 0;
  line-height: 1.05;
  text-align: center;
}

.task-recent-head small {
  display: none;
}

.task-recent-gallery {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 72px;
  gap: 8px;
  min-height: 0;
  align-content: center;
  align-items: center;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 2px;
  scrollbar-width: thin;
}

.task-recent-card {
  display: block;
  min-width: 0;
  overflow: hidden;
  width: 72px;
  height: 96px;
  padding: 0;
  border: 1px solid #e6e3f4;
  border-radius: 12px;
  color: #4a5063;
  background: #fff;
  cursor: zoom-in;
}

.task-recent-card:hover {
  border-color: rgba(123, 97, 255, 0.52);
  box-shadow: 0 10px 20px rgba(89, 72, 160, 0.12);
}

.task-recent-card.is-running,
.task-recent-card.is-failed,
.task-recent-card:disabled {
  cursor: not-allowed;
  opacity: 0.92;
}

.task-recent-card.is-running:hover,
.task-recent-card.is-failed:hover,
.task-recent-card:disabled:hover {
  border-color: #e6e3f4;
  box-shadow: none;
}

.task-recent-thumb {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: 11px;
  background: #f1f1fa;
}

.task-recent-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  backface-visibility: hidden;
  transform: translateZ(0);
}

img[data-work-src] {
  opacity: 0;
}

img[data-work-media-identity].is-loading,
img[data-work-media-identity].is-missing {
  opacity: 0;
}

img.is-loaded {
  opacity: 1;
  transition: opacity 0.16s ease;
}

.work-image-empty {
  display: block;
  width: 100%;
  height: 100%;
}

.task-recent-runner {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, rgba(23, 26, 42, 0.18), rgba(23, 26, 42, 0.5));
}

.task-recent-runner::before,
.task-recent-runner::after {
  content: "";
  position: absolute;
  border-radius: 999px;
}

.task-recent-runner::before {
  width: 34px;
  height: 34px;
  border: 2px solid rgba(255, 255, 255, 0.42);
  border-top-color: #fff;
  animation: taskRecentSpin 0.9s linear infinite;
}

.task-recent-runner::after {
  width: 8px;
  height: 8px;
  background: #fff;
  box-shadow: 0 0 18px rgba(255, 255, 255, 0.8);
}

.task-recent-failed {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, rgba(58, 20, 28, 0.2), rgba(176, 31, 55, 0.64));
}

.task-recent-failed::before {
  content: "!";
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 2px solid rgba(255, 255, 255, 0.86);
  border-radius: 999px;
  color: #fff;
  font-size: 18px;
  font-weight: 525;
  line-height: 1;
}

.task-recent-thumb em {
  position: absolute;
  right: 5px;
  bottom: 5px;
  z-index: 3;
  padding: 2px 6px;
  border-radius: 999px;
  color: #fff;
  background: rgba(31, 35, 51, 0.76);
  font-size: 10px;
  font-style: normal;
}

.task-recent-card.is-failed .task-recent-thumb em {
  background: rgba(190, 36, 59, 0.9);
}

.task-recent-card.video-task {
  cursor: pointer;
}

.video-task-thumb small,
.video-work-thumb small {
  position: absolute;
  left: 7px;
  bottom: 7px;
  z-index: 4;
  min-height: 21px;
  padding: 2px 7px;
  border-radius: 999px;
  color: #fff;
  background: rgba(28, 33, 47, 0.78);
  font-size: 10px;
  line-height: 1.45;
  font-weight: 525;
}

.video-play-badge {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(180deg, rgba(15, 19, 30, 0.04), rgba(15, 19, 30, 0.32));
  pointer-events: none;
}

.video-play-badge .lucide {
  width: 24px;
  height: 24px;
  padding: 7px;
  box-sizing: content-box;
  border-radius: 999px;
  background: rgba(24, 29, 43, 0.72);
  box-shadow: 0 12px 26px rgba(14, 18, 30, 0.28);
}

@keyframes taskRecentSpin {
  to {
    transform: rotate(360deg);
  }
}

.task-recent-empty {
  display: grid;
  min-height: 100%;
  place-items: center;
  border: 1px dashed #dedbf0;
  border-radius: 12px;
  color: var(--muted);
  background: #fff;
  font-size: 12px;
  font-weight: 525;
}

.preview-frame[hidden],
.preview-frame img[hidden],
.preview-frame img:not([src]),
.preview-frame img[src=""],
.preview-card > img[hidden],
.preview-gallery[hidden],
.preview-compare[hidden],
.copy-result-panel[hidden] {
  display: none;
}

.copy-result-panel {
  grid-area: 1 / 1;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: clamp(260px, 18vw, 320px);
  grid-template-rows: minmax(0, 1fr);
  gap: 16px;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  padding: 16px 20px;
  overflow: auto;
  align-items: stretch;
  align-content: stretch;
}

.copy-result-panel.is-copy-grid-large {
  grid-template-rows: repeat(2, minmax(0, 1fr));
}

.copy-result-empty {
  border: 1px solid #ebe8f7;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 12px 26px rgba(38, 42, 72, 0.08);
}

.copy-result-empty {
  display: grid;
  gap: 10px;
  min-height: 260px;
  place-items: center;
  align-content: center;
  padding: 28px;
  color: #262d42;
  text-align: center;
}

.copy-result-empty .lucide {
  width: 38px;
  height: 38px;
  color: var(--purple);
}

.copy-result-empty strong {
  font-size: 22px;
  font-weight: 525;
}

.copy-result-empty small {
  color: var(--muted);
  font-size: 14px;
  font-weight: 525;
}

.copy-post-card {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 0;
  position: relative;
  width: 100%;
  min-height: 0;
  height: 100%;
  padding: 4px;
  border: 1px solid rgba(124, 103, 255, 0.12);
  border-radius: 20px;
  background: linear-gradient(135deg, #715bff 0%, #9b85ff 48%, #d8d0ff 100%);
  box-shadow: 0 10px 24px rgba(78, 64, 180, 0.12);
  overflow: hidden;
}

.copy-post-top {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-height: 38px;
  padding: 0 8px 7px;
  color: #fff;
  text-align: center;
}

.copy-post-title {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 0;
}

.copy-post-title .lucide {
  width: 18px;
  height: 18px;
  fill: rgba(255, 255, 255, 0.28);
  stroke-width: 2.4;
}

.copy-post-title strong {
  font-size: 17px;
  font-weight: 525;
  letter-spacing: 0;
  text-shadow: 0 2px 10px rgba(67, 52, 168, 0.2);
}

.copy-post-check {
  display: none;
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 3px solid rgba(255, 255, 255, 0.78);
  border-radius: 50%;
  background: linear-gradient(135deg, #8c73ff, #5545f0);
  box-shadow: 0 10px 22px rgba(70, 54, 178, 0.22);
}

.copy-post-check .lucide {
  width: 24px;
  height: 24px;
  color: #fff;
  stroke-width: 3.4;
}

.copy-post-body {
  display: grid;
  gap: 16px;
  grid-template-rows: auto auto auto auto;
  align-content: stretch;
  min-height: 0;
  height: 100%;
  padding: 16px 14px 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.78);
  overflow: auto;
}

.copy-post-body::after {
  content: "";
  display: block;
  min-height: 70px;
}

.copy-post-section {
  display: grid;
  gap: 8px;
}

.copy-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.copy-post-section h4 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: #5b4ee6;
  font-size: 15px;
  font-weight: 525;
}

.copy-section-head button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  flex: 0 0 auto;
  min-height: 24px;
  padding: 0 8px;
  border: 1px solid #dedaf4;
  border-radius: 999px;
  color: #5a4bdc;
  background: #f6f4ff;
  font-size: 11px;
  font-weight: 525;
  cursor: pointer;
}

.copy-section-head button .lucide {
  width: 13px;
  height: 13px;
}

.copy-post-section h4 span {
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 10px solid #f4c58a;
}

.copy-post-section:nth-of-type(2) h4 span {
  border-left-color: #d9d2ff;
}

.copy-post-section:nth-of-type(3) h4 span {
  border-left-color: #dad6ff;
}

.copy-post-section p {
  margin: 0;
  color: #4d5369;
  font-size: 13px;
  font-weight: 525;
  line-height: 1.72;
  word-break: break-word;
}

.copy-post-main-title {
  font-size: 13.5px !important;
  color: #34394d !important;
  font-weight: 525 !important;
}

.copy-tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.copy-tag-list span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 23px;
  padding: 0 9px;
  border-radius: 999px;
  color: #5c50d8;
  background: #f1efff;
  font-size: 12px;
  font-weight: 525;
}

.copy-post-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  padding-top: 10px;
  align-self: start;
  border-top: 1px solid #eceaf7;
  color: #9c95c6;
}

.copy-post-footer button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-width: 0;
  color: #9c95c6;
  font-size: 12px;
  font-weight: 525;
}

.copy-post-footer button {
  min-height: 28px;
  padding: 0 12px;
  border: 1px solid #dedaf4;
  border-radius: 999px;
  color: #584bd4;
  background: #f7f5ff;
  cursor: pointer;
}

.copy-post-footer button .lucide {
  width: 16px;
  height: 16px;
}

.copy-post-raw {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  color: #252b3f;
  font-family: inherit;
  font-size: 15px;
  font-weight: 525;
  line-height: 1.8;
}

@media (max-width: 720px) {
  .copy-result-panel {
    display: grid;
    grid-auto-flow: row;
    grid-auto-columns: auto;
    grid-template-rows: none;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    padding: 14px;
    justify-items: center;
  }

  .copy-post-card {
    width: min(100%, 360px);
    min-height: 420px;
    border-radius: 20px;
    padding: 10px;
  }

  .copy-post-title strong {
    font-size: 17px;
  }

  .copy-post-check {
    width: 50px;
    height: 50px;
  }

  .copy-post-body {
    gap: 16px;
    padding: 16px 14px 14px;
  }

  .copy-post-footer {
    grid-template-columns: minmax(0, 1fr);
  }

  .copy-post-footer button {
    grid-column: 1 / -1;
  }
}

.copy-thumb,
.work-copy-thumb {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 5px;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  color: #3d356e;
  background: linear-gradient(180deg, #fff, #f6f4ff);
  text-align: center;
}

.copy-thumb.has-image,
.work-copy-thumb.has-image {
  position: relative;
  overflow: hidden;
  background: #f1f1fa;
}

.copy-thumb.has-image img,
.work-copy-thumb.has-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
  background: #f7f6fb;
}

.copy-thumb.has-image small,
.work-copy-thumb.has-image small {
  position: absolute;
  z-index: 3;
  left: 8px;
  right: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  border-radius: 999px;
  color: #fff;
  background: rgba(31, 33, 48, 0.66);
  backdrop-filter: blur(6px);
}

.copy-thumb.has-image small,
.work-copy-thumb.has-image small {
  bottom: 8px;
  min-height: 24px;
}

.copy-post-card.is-pending .copy-post-body {
  background: rgba(255, 255, 255, 0.9);
}

.copy-thumb .lucide,
.work-copy-thumb .lucide {
  width: 28px;
  height: 28px;
  color: var(--purple);
}

.copy-thumb strong,
.work-copy-thumb strong {
  font-size: 14px;
  font-weight: 525;
}

.copy-thumb small,
.work-copy-thumb small {
  color: #8a8fa3;
  font-size: 12px;
  font-weight: 525;
}

.preview-gallery {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  padding: 8px;
  overflow: auto;
  align-content: start;
}

.preview-gallery figure {
  display: grid;
  gap: 5px;
  min-width: 0;
  min-height: 0;
  margin: 0;
  align-content: start;
  justify-items: center;
}

.preview-gallery-thumb {
  position: relative;
  display: inline-grid;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  place-items: center;
  cursor: zoom-in;
}

.preview-gallery img {
  display: block;
  width: auto;
  max-width: 100%;
  height: clamp(176px, 13.2vw, 260px);
  border-radius: 14px;
  object-fit: contain;
  background: transparent;
  box-shadow: 0 14px 26px rgba(45, 48, 72, 0.16);
}

.preview-delete-button {
  position: absolute;
  top: 7px;
  right: 7px;
  z-index: 2;
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 0;
  border-radius: 999px;
  color: #fff;
  background: rgba(16, 20, 31, 0.76);
  box-shadow: 0 8px 18px rgba(12, 15, 24, 0.26);
  cursor: pointer;
  opacity: 0;
  transform: translateY(-3px);
  transition: opacity 0.18s ease, transform 0.18s ease, background 0.18s ease;
}

.preview-delete-button .lucide {
  width: 15px;
  height: 15px;
}

.preview-gallery figure:hover .preview-delete-button,
.preview-delete-button:focus-visible {
  opacity: 1;
  transform: translateY(0);
}

.preview-delete-button:hover {
  background: #df3f55;
}

.preview-gallery figcaption {
  width: 100%;
  overflow: hidden;
  color: #52586b;
  font-size: 12px;
  font-weight: 525;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.preview-compare {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
  gap: 12px;
  align-items: stretch;
  justify-items: stretch;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  padding: 16px;
  overflow: hidden;
}

.compare-pane {
  position: relative;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  max-width: 100%;
  max-height: 100%;
  overflow: clip;
  padding: clamp(16px, 2vw, 30px);
  border-radius: 14px;
  background: #fff;
}

.compare-pane img {
  place-self: center;
  align-self: center;
  justify-self: center;
  width: auto !important;
  height: auto !important;
  min-width: 0;
  min-height: 0;
  max-width: 92% !important;
  max-height: 92% !important;
  object-fit: contain !important;
  object-position: center center;
  transform: none !important;
}

.compare-pane strong {
  position: absolute;
  left: 12px;
  top: 12px;
  min-height: 28px;
  padding: 5px 10px;
  border-radius: 999px;
  color: #fff;
  background: rgba(32, 35, 52, 0.72);
  font-size: 12px;
  font-weight: 525;
}

.preview-compare p {
  position: absolute;
  left: 50%;
  bottom: 14px;
  z-index: 2;
  margin: 0;
  max-width: min(680px, calc(100% - 32px));
  padding: 8px 12px;
  border-radius: 999px;
  color: #fff;
  background: rgba(32, 35, 52, 0.72);
  font-size: 12px;
  font-weight: 525;
  transform: translateX(-50%);
}

.preview-card > span {
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 2;
  min-height: 32px;
  padding: 7px 12px;
  border-radius: 10px;
  color: #fff;
  background: var(--purple);
  font-size: 12px;
  font-weight: 525;
}

.shine-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 0%, rgba(255, 255, 255, 0.55) 48%, transparent 60%);
  opacity: 0;
  transform: translateX(-85%);
}

.preview-card.generating .shine-layer {
  animation: sweep 1.05s ease-in-out infinite;
  opacity: 1;
}

@keyframes sweep {
  to {
    transform: translateX(85%);
  }
}

.settings-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, #fff, #fbfaff);
}

.settings-column {
  grid-column: 1 / 2;
  grid-row: 2;
  display: grid;
  gap: 14px;
  align-content: start;
  width: 100%;
  min-height: 0;
  overflow: visible;
}

body.feature-focus-mode .settings-column {
  gap: 7px;
}

body.feature-focus-mode .settings-card {
  gap: 7px;
  padding: 9px;
  border-radius: 13px;
}

body.feature-focus-mode .settings-head {
  min-height: 20px;
}

.task-recent-thumb .task-recent-elapsed {
  top: 5px;
  right: auto;
  bottom: auto;
  left: 5px;
  max-width: calc(100% - 10px);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #5144bd;
  background: rgba(255, 255, 255, 0.9);
  font-size: 8px;
  font-weight: 650;
}

.task-recent-thumb .task-recent-elapsed b {
  font-weight: 750;
}

body.feature-focus-mode .settings-head span {
  font-size: 11px;
}

body.feature-focus-mode .settings-head strong {
  font-size: 16px;
}

body.feature-focus-mode .extra-prompt-box {
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
}

body.feature-focus-mode .extra-prompt-box textarea {
  height: 150px;
  min-height: 150px;
  max-height: 150px;
  padding: 16px;
}

.extra-prompt-box {
  position: relative;
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid #dedaf8;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 26px rgba(103, 88, 190, 0.08);
}

.extra-prompt-box::before {
  content: "";
  position: absolute;
  top: 14px;
  right: 14px;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #7b61ff;
}

.extra-prompt-box span {
  display: flex;
  align-items: center;
  min-height: 24px;
  color: #1f2540;
  font-size: 15px;
  font-weight: 525;
}

.extra-prompt-box textarea {
  width: 100%;
  height: 150px;
  min-height: 150px;
  max-height: 150px;
  resize: none;
  padding: 16px;
  border: 1px solid #dedaf4;
  border-radius: 16px;
  color: #20263a;
  background: #f8f7ff;
  font: inherit;
  font-size: 15px;
  line-height: 1.65;
  outline: 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.extra-prompt-box textarea:focus {
  border-color: #7b61ff;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(123, 97, 255, 0.12);
}

.video-reference-url-box {
  position: relative;
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid #dedaf8;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 26px rgba(103, 88, 190, 0.08);
}

.video-reference-url-box[hidden] {
  display: none !important;
}

.video-reference-url-box span {
  display: flex;
  align-items: baseline;
  gap: 6px;
  min-height: 24px;
  color: #1f2540;
  font-size: 15px;
  font-weight: 525;
}

.video-reference-url-box small {
  color: #8b91a4;
  font-size: 11px;
  font-weight: 500;
}

.video-reference-url-box textarea {
  width: 100%;
  height: 78px;
  min-height: 78px;
  max-height: 120px;
  resize: vertical;
  padding: 12px 14px;
  border: 1px solid #dedaf4;
  border-radius: 14px;
  color: #20263a;
  background: #f8f7ff;
  font: inherit;
  font-size: 13px;
  line-height: 1.5;
  outline: 0;
}

.video-reference-url-box textarea:focus {
  border-color: #7b61ff;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(123, 97, 255, 0.12);
}

.generate-count-box {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.generate-count-box[hidden] {
  display: none;
}

.generate-count-box.hide-generate-count-section .generate-count-section {
  display: none;
}

.generate-count-box.hide-generate-count-section .generation-resolution-section {
  grid-column: 1 / -1;
}

.generate-count-box > span,
.generate-count-label {
  color: #30384d;
  font-size: 15px;
  font-weight: 525;
}

.generate-count-section,
.set-ratio-section,
.generation-resolution-section {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.set-ratio-section {
  grid-column: 1 / -1;
}

.set-ratio-section[hidden] {
  display: none;
}

.free-bottom-ratio-section {
  display: none;
  gap: 8px;
  min-width: 0;
}

.generate-count-label {
  display: grid;
  gap: 3px;
}

.generate-count-label small,
.detail-count-note {
  color: #8a8fa3;
  font-size: 12.5px;
  line-height: 1.35;
  font-weight: 525;
}

.settings-alert-text {
  color: #e53935;
  font-weight: 525;
}

.generate-count-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.generation-resolution-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.detail-page-resolution-panel {
  display: none;
}

.detail-page-latest-panel {
  display: none;
}

.count-option {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  overflow: visible;
  min-height: 38px;
  border: 1px solid #e8e4fb;
  border-radius: 12px;
  color: #3a4055;
  background: #fbfbff;
  font-size: 14px;
  font-weight: 525;
}

.print-compact-menu button {
  position: relative;
}

.count-option-main {
  line-height: 1;
}

.count-discount-badge {
  position: absolute;
  right: 5px;
  top: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 14px;
  padding: 0 4px;
  border-radius: 999px;
  color: #d84b18;
  background: #fff0e8;
  border: 1px solid rgba(248, 119, 58, 0.26);
  font-size: 9px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  pointer-events: none;
}

.count-option.selected {
  border-color: rgba(123, 97, 255, 0.6);
  color: #fff;
  background: var(--purple);
  box-shadow: 0 10px 22px rgba(95, 76, 180, 0.16);
}

.count-option.selected .count-discount-badge {
  color: #6b49ff;
  background: rgba(255, 255, 255, 0.88);
  border-color: rgba(255, 255, 255, 0.45);
}

.resolution-option {
  min-height: 38px;
  border: 1px solid #d9e3ff;
  border-radius: 12px;
  color: #31509a;
  background: #f7f9ff;
  font-size: 13px;
  font-weight: 525;
}

.resolution-option.selected {
  border-color: rgba(49, 80, 154, 0.6);
  color: #fff;
  background: #3c66d1;
  box-shadow: 0 10px 22px rgba(60, 102, 209, 0.16);
}

.generate-action-row {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 4fr;
  gap: 10px;
  align-items: stretch;
}

.inline-model-section {
  position: relative;
  min-width: 0;
  border: 1px solid rgba(123, 97, 255, 0.16);
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff 0%, #faf9ff 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.85), 0 8px 18px rgba(66, 57, 132, 0.06);
}

.inline-model-section[hidden] {
  display: none;
}

.inline-model-section summary {
  display: grid;
  grid-template-rows: auto auto;
  align-content: center;
  justify-items: center;
  min-height: 56px;
  padding: 8px 11px;
  text-align: center;
  cursor: pointer;
  list-style: none;
}

.inline-model-section summary::-webkit-details-marker {
  display: none;
}

.inline-model-section summary span {
  color: #8c7dff;
  font-size: 14px;
  font-weight: 525;
  letter-spacing: 0.02em;
}

.inline-model-section summary strong {
  overflow: hidden;
  color: #252b3c;
  font-size: 12px;
  font-weight: 525;
  line-height: 1.18;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.inline-model-section:hover,
.inline-model-section[open] {
  border-color: rgba(123, 97, 255, 0.38);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.9), 0 12px 24px rgba(92, 76, 180, 0.1);
}

.inline-model-options {
  position: absolute;
  left: 0;
  width: 292px;
  bottom: calc(100% + 8px);
  z-index: 20;
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(123, 97, 255, 0.16);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 38px rgba(36, 39, 64, 0.16);
}

.inline-model-options p {
  margin: 0 0 2px;
  color: #757d91;
  font-size: 12px;
  font-weight: 525;
  line-height: 1.45;
}

.inline-model-highlight {
  color: #e53935;
  font-weight: 525;
}

.inline-model-option {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 56px;
  border: 1px solid #ebe9f7;
  border-radius: 12px;
  color: #353b50;
  background: #fbfbff;
  font-size: 13px;
  font-weight: 525;
  transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.inline-model-recommend-badge {
  position: absolute;
  right: 11px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-grid;
  place-items: center;
  min-width: 34px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  color: #fff;
  background: #ef4444;
  font-size: 11px;
  font-weight: 525;
  line-height: 1;
}

.inline-model-option.selected .inline-model-recommend-badge {
  color: #ef4444;
  background: #fff;
}

.inline-model-option:hover {
  border-color: rgba(123, 97, 255, 0.36);
  background: #f6f3ff;
}

.inline-model-option.selected {
  border-color: transparent;
  color: #fff;
  background: linear-gradient(135deg, #765cff, #8f72ff);
  box-shadow: 0 10px 20px rgba(123, 97, 255, 0.2);
}

@media (max-width: 760px) {
  .generate-count-box {
    grid-template-columns: 1fr;
  }
}

.settings-head {
  position: relative;
  display: grid;
  gap: 4px;
}

.settings-head span {
  color: var(--purple);
  font-size: 12px;
  font-weight: 525;
}

.settings-head strong {
  font-size: 18px;
}

.small-icon-button {
  position: absolute;
  right: 0;
  top: 0;
  width: 38px;
  height: 38px;
}

.dynamic-settings {
  display: grid;
  gap: 12px;
}

.detail-module-settings {
  display: grid;
  gap: 10px;
}

.detail-template-entry {
  position: relative;
}

.detail-reference-materials {
  display: none;
  gap: 10px;
  margin-top: 6px;
  padding: 12px;
  border: 1px solid rgba(112, 92, 246, 0.2);
  border-radius: 14px;
  background: linear-gradient(180deg, #fbfaff 0%, #f7f9ff 100%);
}

body[data-active-feature="detail-page"] .detail-reference-materials,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-main-reference-materials ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-main-reference-materials {
  display: grid;
}

.detail-reference-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.detail-reference-head span {
  color: #5c50d9;
  font-size: 14.5px;
  font-weight: 600;
}

.detail-reference-head small {
  color: #737b93;
  font-size: 11.5px;
  font-weight: 400;
}

.detail-reference-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.detail-reference-card {
  position: relative;
  min-width: 0;
}

.detail-reference-card.detail-template-entry {
  grid-column: 1 / -1;
}

.detail-reference-button {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 74px;
  padding: 12px 30px 12px 12px;
  border: 1px solid rgba(126, 112, 255, 0.34);
  border-radius: 12px;
  color: #20273a;
  background: #fff;
  box-shadow: 0 10px 22px rgba(79, 75, 150, 0.08);
  font-family: inherit;
  text-align: left;
  cursor: pointer;
}

.detail-reference-button span {
  min-width: 0;
}

.detail-reference-button > img,
.detail-reference-button > .lucide {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 11px;
  object-fit: cover;
  background: #f0edff;
}

.detail-reference-button > .lucide {
  padding: 9px;
  color: #6757ff;
}

.detail-reference-button strong,
.detail-reference-button small {
  display: block;
}

.detail-reference-button strong {
  color: #252a3d;
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.2;
}

.detail-reference-button small {
  overflow: hidden;
  margin-top: 4px;
  color: #6f768a;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.detail-reference-card.has-template .detail-reference-button,
.detail-reference-card.has-image .detail-reference-button {
  border-color: rgba(112, 92, 246, 0.6);
  background: linear-gradient(135deg, #ffffff 0%, #f4f1ff 100%);
}

.detail-reference-card.has-template small,
.detail-reference-card.has-image small {
  color: #6d5cf2;
}

.detail-reference-button:hover {
  border-color: rgba(106, 93, 246, 0.42);
  box-shadow: 0 10px 22px rgba(75, 70, 140, 0.1);
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-main-reference-materials .detail-reference-card.is-disabled .detail-reference-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-main-reference-materials .detail-reference-card.is-disabled .detail-reference-button {
  border-color: rgba(124, 128, 151, 0.2);
  color: #8d93a5;
  background: #f5f5f8;
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.62;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-main-reference-materials .detail-reference-card.is-disabled .detail-reference-button:hover ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-main-reference-materials .detail-reference-card.is-disabled .detail-reference-button:hover {
  border-color: rgba(124, 128, 151, 0.2);
  box-shadow: none;
}

.detail-reference-clear,
.detail-template-remove {
  position: absolute;
  right: 6px;
  top: 6px;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border: 0;
  border-radius: 999px;
  color: #697286;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 5px 12px rgba(38, 45, 74, 0.12);
  cursor: pointer;
}

.detail-reference-clear .lucide,
.detail-template-remove .lucide {
  width: 12px;
  height: 12px;
}

.detail-reference-clear:hover,
.detail-template-remove:hover {
  color: #d84f61;
  background: #fff1f4;
}

.detail-style-reference {
  position: relative;
}

.detail-style-preset-panel {
  display: grid;
  gap: 10px;
  padding-top: 4px;
}

.detail-style-preset-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.detail-style-preset-head span {
  color: #30384d;
  font-size: 13.5px;
  font-weight: 600;
}

.detail-style-preset-head small {
  color: #7d8497;
  font-size: 11px;
  font-weight: 400;
}

.detail-style-preset-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.detail-style-preset-button {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 0;
  min-height: 56px;
  padding: 8px 10px;
  border: 1px solid rgba(126, 112, 255, 0.22);
  border-radius: 12px;
  color: #465066;
  background: rgba(255, 255, 255, 0.78);
  font-family: inherit;
  line-height: 1.2;
  cursor: pointer;
  text-align: center;
}

.detail-style-preset-button span {
  display: block;
  max-width: 100%;
  color: inherit;
  font-size: 13px;
  font-weight: 560;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.detail-style-preset-button small {
  display: block;
  max-width: 100%;
  color: #778095;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.detail-style-preset-auto {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 48px;
  grid-template-rows: auto auto;
  column-gap: 12px;
  row-gap: 3px;
  align-items: center;
  min-height: 58px;
  padding: 12px 18px;
  text-align: center;
}

.detail-style-recommend-badge {
  position: static;
  z-index: 2;
  grid-column: 1;
  grid-row: 1 / 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: start;
  min-width: 40px;
  height: 20px;
  padding: 0 8px;
  border-radius: 999px;
  border: 1px solid rgba(112, 92, 246, 0.28);
  color: #5940d4;
  background: #e8e2ff;
  box-shadow: none;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  white-space: nowrap;
}

.detail-style-preset-auto[aria-pressed="true"] .detail-style-recommend-badge,
.detail-style-preset-auto.selected .detail-style-recommend-badge {
  border-color: transparent;
  color: #6f49f4;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 4px 10px rgba(88, 71, 219, 0.18);
}

.detail-style-preset-auto > span {
  grid-column: 2;
  grid-row: 1;
}

.detail-style-preset-auto > small {
  grid-column: 2;
  grid-row: 2;
}

.detail-style-preset-button::after,
.outpaint-preset-grid .choice-button[data-detail-style-tip]::after,
.print-extract-mode-grid .choice-button[data-detail-style-tip]::after,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch[data-detail-style-tip]::after {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 8px);
  z-index: 40;
  content: attr(data-detail-style-tip);
  width: max-content;
  max-width: 260px;
  padding: 8px 10px;
  border: 1px solid rgba(36, 42, 62, 0.08);
  border-radius: 10px;
  color: #fff;
  background: rgba(31, 35, 52, 0.94);
  box-shadow: 0 14px 28px rgba(36, 42, 62, 0.18);
  font-size: 11.5px;
  font-weight: 500;
  line-height: 1.45;
  text-align: left;
  white-space: normal;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 4px);
  transition: opacity 0.14s ease, transform 0.14s ease;
}

.detail-style-preset-button::before,
.outpaint-preset-grid .choice-button[data-detail-style-tip]::before,
.print-extract-mode-grid .choice-button[data-detail-style-tip]::before,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch[data-detail-style-tip]::before {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 3px);
  z-index: 41;
  content: "";
  width: 8px;
  height: 8px;
  background: rgba(31, 35, 52, 0.94);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 4px) rotate(45deg);
  transition: opacity 0.14s ease, transform 0.14s ease;
}

.detail-style-preset-button:hover::after,
.detail-style-preset-button:focus-visible::after,
.outpaint-preset-grid .choice-button[data-detail-style-tip]:hover::after,
.outpaint-preset-grid .choice-button[data-detail-style-tip]:focus-visible::after,
.print-extract-mode-grid .choice-button[data-detail-style-tip]:hover::after,
.print-extract-mode-grid .choice-button[data-detail-style-tip]:focus-visible::after,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch[data-detail-style-tip]:hover::after,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch[data-detail-style-tip]:focus-visible::after {
  opacity: 1;
  transform: translate(-50%, 0);
}

.detail-style-preset-button:hover::before,
.detail-style-preset-button:focus-visible::before,
.outpaint-preset-grid .choice-button[data-detail-style-tip]:hover::before,
.outpaint-preset-grid .choice-button[data-detail-style-tip]:focus-visible::before,
.print-extract-mode-grid .choice-button[data-detail-style-tip]:hover::before,
.print-extract-mode-grid .choice-button[data-detail-style-tip]:focus-visible::before,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch[data-detail-style-tip]:hover::before,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch[data-detail-style-tip]:focus-visible::before {
  opacity: 1;
  transform: translate(-50%, 0) rotate(45deg);
}

.detail-style-preset-button:hover {
  border-color: rgba(106, 93, 246, 0.4);
  background: #fff;
}

.detail-style-preset-button.selected {
  border-color: transparent;
  color: #fff;
  background: linear-gradient(135deg, #705cf6, #8d74ff);
  box-shadow: 0 8px 16px rgba(108, 93, 246, 0.18);
}

.detail-style-preset-button.selected small {
  color: rgba(255, 255, 255, 0.78);
}

.detail-reference-materials .detail-reference-button strong {
  color: #252a3d !important;
  font-family: inherit !important;
  font-size: 14.5px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

.detail-reference-materials .detail-reference-button small {
  margin-top: 4px !important;
  color: #727b91 !important;
  font-family: inherit !important;
  font-size: 11.5px !important;
  line-height: 1.3 !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

.detail-style-clear {
  position: absolute;
  right: 6px;
  top: 6px;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border: 0;
  border-radius: 999px;
  color: #526077;
  background: #fff;
  box-shadow: 0 5px 12px rgba(38, 45, 74, 0.12);
}

.detail-style-clear .lucide {
  width: 14px;
  height: 14px;
}

.detail-style-note {
  display: grid;
  gap: 5px;
  padding: 10px 12px;
  border: 1px solid #e8e4fb;
  border-radius: 12px;
  background: #fbfaff;
}

.detail-style-note strong {
  color: #30384d;
  font-size: 13.5px;
  font-weight: 525;
}

.detail-style-note small {
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.5;
  font-weight: 525;
}

.detail-module-checkgrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  overflow: visible;
}

.detail-module-option {
  position: relative;
  display: grid;
  gap: 8px;
  min-height: 86px;
  padding: 11px 12px;
  border: 1px solid #e8ecf3;
  border-radius: 14px;
  color: #3a4055;
  background: #fff;
  font-size: 12px;
  font-weight: 400;
  box-shadow: 0 8px 18px rgba(27, 35, 60, 0.03);
  transition:
    border-color 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.detail-module-option.is-selected {
  border-color: rgba(102, 87, 255, 0.42);
  background: #faf9ff;
  box-shadow: inset 0 0 0 1px rgba(102, 87, 255, 0.08);
}

.detail-module-label {
  position: relative;
  display: grid;
  min-height: 34px;
  padding-right: 26px;
  cursor: pointer;
}

.detail-module-label input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.detail-module-copy {
  display: grid;
  align-content: center;
}

.detail-module-option strong {
  color: #151a2d;
  font-size: 13px;
  line-height: 1.2;
  font-weight: 400;
}

.detail-module-check {
  position: absolute;
  right: 0;
  top: 0;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border: 1px solid #d9dee8;
  border-radius: 7px;
  color: transparent;
  background: #fff;
  font-size: 12px;
  font-weight: 525;
  line-height: 1;
  transition:
    border-color 0.18s ease,
    background 0.18s ease,
    color 0.18s ease;
}

.detail-module-label input:checked ~ .detail-module-check {
  border-color: #6657ff;
  color: #fff;
  background: #6657ff;
}

.detail-module-count {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  transition: opacity 0.18s ease;
}

.detail-module-count > span {
  display: grid;
  flex: 1 1 auto;
  gap: 2px;
  min-width: 0;
  color: #8a8fa3;
  font-size: 10.5px;
  font-weight: 400;
}

.detail-count-select {
  position: relative;
  width: 70px;
  height: 30px;
  border: 1px solid #dfe3ef;
  border-radius: 10px;
  color: #394255;
  background: #fff;
  font: inherit;
  font-size: 12px;
  font-weight: 500;
  box-shadow: none;
  cursor: pointer;
}

.detail-count-select summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
  padding: 0 9px;
  cursor: pointer;
  list-style: none;
}

.detail-count-select summary::-webkit-details-marker {
  display: none;
}

.detail-count-select summary::after {
  content: "";
  width: 6px;
  height: 6px;
  border-right: 1.5px solid #6f7688;
  border-bottom: 1.5px solid #6f7688;
  transform: rotate(45deg) translateY(-2px);
}

.detail-count-select[open] summary::after {
  transform: rotate(225deg) translate(-1px, -1px);
}

.detail-count-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 180;
  display: grid;
  min-width: 78px;
  padding: 6px;
  border: 1px solid #e8e9f2;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 14px 32px rgba(26, 30, 48, 0.14);
}

.detail-count-menu button {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  border: 0;
  border-radius: 9px;
  color: #3a4050;
  background: transparent;
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
}

.detail-count-menu button:hover {
  background: #f6f7fb;
}

.detail-count-menu button.selected {
  color: #5f4cf4;
  background: #f1efff;
  font-weight: 560;
}

.detail-count-select:focus {
  outline: 0;
  border-color: rgba(102, 87, 255, 0.52);
  box-shadow: 0 0 0 3px rgba(102, 87, 255, 0.1);
}

.detail-count-select:disabled {
  color: #9ca4b4;
  background: #f6f7fb;
  cursor: default;
}

.detail-count-select.is-disabled {
  color: #9ca4b4;
  background: #f6f7fb;
  cursor: default;
  pointer-events: none;
}

.detail-module-option:not(.is-selected) .detail-module-count {
  opacity: 0.38;
}

.detail-module-option:hover {
  transform: translateY(-1px);
}

.detail-preset-panel {
  display: grid;
  gap: 10px;
}

.detail-section-title {
  display: grid;
  gap: 3px;
  padding: 11px 12px;
  border: 1px solid #e6ebf2;
  border-radius: 14px;
  background: linear-gradient(180deg, #ffffff, #f7fafc);
}

.detail-section-title span {
  color: #647084;
  font-size: 11px;
  font-weight: 525;
}

.detail-section-title strong {
  color: #151a2d;
  font-size: 16px;
  font-weight: 525;
}

.detail-section-title small {
  color: #778095;
  font-size: 11px;
  font-weight: 525;
  line-height: 1.35;
}

.detail-preset-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.detail-preset-card {
  display: grid;
  gap: 5px;
  min-height: 82px;
  padding: 11px 12px;
  border: 1px solid #dfe5ef;
  border-radius: 14px;
  color: #30384d;
  background: #ffffff;
  font-size: 13px;
  text-align: left;
  box-shadow: 0 8px 18px rgba(27, 35, 60, 0.04);
}

.detail-preset-card span {
  color: #6e778a;
  font-size: 10px;
  font-weight: 525;
}

.detail-preset-card strong {
  color: #1b2235;
  font-size: 14px;
  line-height: 1.2;
}

.detail-preset-card small {
  color: #7c8497;
  font-size: 10.5px;
  font-weight: 525;
  line-height: 1.35;
  white-space: normal;
}

.detail-preset-card.selected {
  border-color: rgba(102, 87, 255, 0.86);
  color: #4b3dce;
  background: linear-gradient(180deg, #f7f5ff, #ffffff);
  box-shadow: 0 12px 26px rgba(102, 87, 255, 0.15);
}

.detail-module-settings .detail-style-reference {
  margin-top: 2px;
}

.detail-upload-preview {
  position: relative;
}

.detail-upload-preview figcaption {
  position: absolute;
  left: 7px;
  bottom: 7px;
  max-width: calc(100% - 14px);
  overflow: hidden;
  padding: 3px 6px;
  border-radius: 999px;
  color: #ffffff;
  background: rgba(18, 24, 38, 0.62);
  font-size: 10px;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.detail-preview-board {
  display: grid;
  grid-template-columns: minmax(210px, 0.84fr) minmax(280px, 1.16fr);
  gap: 18px;
  align-items: stretch;
  width: min(100%, 980px);
  height: min(100%, 620px);
  padding: 18px;
  border: 1px solid #e5e9f2;
  border-radius: 22px;
  background: linear-gradient(135deg, #f7fbff, #ffffff 48%, #f9f7ff);
  box-shadow: 0 24px 58px rgba(28, 40, 72, 0.12);
}

.detail-preview-hero {
  display: grid;
  align-content: center;
  gap: 10px;
  min-height: 0;
  padding: 22px;
  border: 1px solid rgba(47, 138, 247, 0.14);
  border-radius: 18px;
  background: #ffffff;
}

.detail-preview-hero span {
  color: #2f8af7;
  font-size: 12px;
  font-weight: 525;
}

.detail-preview-hero strong {
  color: #172033;
  font-size: 32px;
  line-height: 1.08;
  font-weight: 525;
}

.detail-preview-hero small {
  color: #687388;
  font-size: 13px;
  line-height: 1.55;
  font-weight: 525;
}

.detail-preview-phone {
  display: grid;
  gap: 8px;
  align-content: start;
  min-height: 0;
  overflow: hidden auto;
  padding: 12px;
  border: 10px solid #172033;
  border-radius: 26px;
  background: #f3f5f8;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.26);
}

.detail-preview-section {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 58px;
  padding: 10px;
  border: 1px solid #e4e8f0;
  border-radius: 14px;
  background: #ffffff;
}

.detail-preview-section b {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  color: #2f8af7;
  background: #eef6ff;
  font-size: 12px;
  font-weight: 525;
}

.detail-preview-section span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.detail-preview-section strong {
  overflow: hidden;
  color: #182033;
  font-size: 14px;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.detail-preview-section small {
  overflow: hidden;
  color: #748096;
  font-size: 11px;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.detail-preview-foot {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  color: #647084;
  font-size: 12px;
  font-weight: 525;
}

.detail-preview-foot span {
  padding: 6px 10px;
  border: 1px solid #e5e9f2;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
}

@media (max-width: 980px) {
  .detail-preset-grid {
    grid-template-columns: 1fr;
  }

  .detail-preview-board {
    grid-template-columns: 1fr;
    height: auto;
  }

  .detail-preview-hero strong {
    font-size: 24px;
  }
}

body.feature-focus-mode .dynamic-settings {
  gap: 6px;
}

body.feature-focus-mode .generate-count-box {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.feature-focus-mode .generate-count-options {
  gap: 8px;
}

body.feature-focus-mode .generation-resolution-options {
  gap: 8px;
}

body[data-active-feature="hd-upscale"] .generation-resolution-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
}

body[data-active-feature="hd-upscale"] .resolution-option {
  width: 100%;
  min-width: 0;
  padding-inline: 18px;
}

body.feature-focus-mode .count-option,
body.feature-focus-mode .resolution-option {
  min-height: 32px;
  border-radius: 12px;
  font-size: 13px;
}

body.feature-focus-mode .generate-count-box > span,
body.feature-focus-mode .generate-count-label {
  font-size: 14px;
}

body.feature-focus-mode .generate-count-label small {
  font-size: 12px;
}

body.feature-focus-mode .create-button.full {
  min-height: 56px;
}

body.feature-focus-mode .library-select-row {
  gap: 7px;
}

body.feature-focus-mode .library-select-button {
  gap: 4px;
  min-height: 48px;
  padding: 0 5px;
  font-size: 14px;
}

body.feature-focus-mode .library-select-button .lucide {
  width: 17px;
  height: 17px;
}

.range-panel {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid #ede9ff;
  border-radius: 14px;
  background: #fff;
}

.range-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  color: #36394a;
  font-weight: 525;
}

.range-head output {
  display: grid;
  place-items: center;
  min-width: 54px;
  min-height: 30px;
  border-radius: 999px;
  color: #fff;
  background: var(--purple);
  font-weight: 525;
}

.range-panel input[type="range"] {
  width: 100%;
}

.range-ticks {
  display: grid;
  grid-template-columns: repeat(11, 1fr);
  color: #9a9dad;
  font-size: 10px;
  font-weight: 525;
  text-align: center;
}

.fixed-wrinkle-panel {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid #ede9ff;
  border-radius: 14px;
  color: #30384d;
  background: #fff;
}

.fixed-wrinkle-panel strong {
  font-size: 15px;
  font-weight: 525;
}

.fixed-wrinkle-panel small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
  font-weight: 525;
}

.toast {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 240;
  display: none;
  align-items: center;
  justify-content: center;
  width: max-content;
  max-width: min(560px, calc(100vw - 48px));
  min-height: 58px;
  padding: 14px 24px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 16px;
  color: #fff;
  background: rgba(31, 41, 55, 0.72);
  box-shadow: 0 22px 64px rgba(15, 23, 42, 0.2), 0 8px 20px rgba(15, 23, 42, 0.12);
  font-size: 17px;
  font-weight: 480;
  line-height: 1.45;
  text-align: center;
  transform: translate(-50%, -50%);
  backdrop-filter: blur(14px);
  pointer-events: none;
}

.toast.show {
  display: flex;
}

.setting-note {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 11px;
  border-radius: 13px;
  color: #6d5bd6;
  background: var(--purple-soft);
  font-size: 12px;
  line-height: 1.5;
}

.wrinkle-option-list {
  display: grid;
  gap: 10px;
}

.background-choice-group {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  overflow: hidden;
  border: 1px solid #e7e3fb;
  border-radius: 14px;
  background: #fff;
}

.background-choice {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 48px;
  padding: 0 10px;
  color: #4d5368;
  cursor: pointer;
  font-size: 13px;
  font-weight: 525;
}

.background-choice + .background-choice {
  border-left: 1px solid #ece9fb;
}

.background-choice input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.background-choice span {
  pointer-events: none;
}

.background-choice.selected {
  color: var(--purple);
  background: #f7f4ff;
  box-shadow: inset 0 0 0 1px rgba(123, 97, 255, 0.16);
}

.background-mode-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 8px;
  border: 1px solid rgba(123, 97, 255, 0.16);
  border-radius: 16px;
  background: linear-gradient(180deg, #fbfaff, #ffffff);
}

.background-mode-tabs button {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  border: 1px solid rgba(123, 97, 255, 0.28);
  border-radius: 14px;
  color: #4f46c8;
  background: #fff;
  font-size: 15px;
  font-weight: 525;
  box-shadow: 0 8px 18px rgba(123, 97, 255, 0.08);
}

.background-mode-tabs button .lucide {
  width: 18px;
  height: 18px;
}

.background-mode-tabs button.selected {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, #7568ff, #5f8cff);
  box-shadow: 0 12px 24px rgba(95, 104, 255, 0.22);
}

.background-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.background-action-grid.bottom-actions {
  margin-top: 2px;
  padding-top: 10px;
  border-top: 1px dashed #e6e1fb;
}

.background-action-grid button,
.model-bg-grid button,
.model-library-tabs button {
  border: 1px solid #e7e3fb;
  border-radius: 12px;
  color: #3d4356;
  background: #fff;
}

.background-action-grid button {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  font-weight: 525;
}

.background-action-grid.bottom-actions button {
  border-color: #bdeee5;
  color: #0b756d;
  background: linear-gradient(180deg, #f3fffc, #e9fbf7);
}

.background-action-grid.bottom-actions button:nth-child(2) {
  border-color: #ffe0a3;
  color: #986413;
  background: linear-gradient(180deg, #fffaf0, #fff3d8);
}

.background-action-grid.bottom-actions button.selected {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, #12bda4, #6d7cff);
  box-shadow: 0 12px 24px rgba(42, 109, 155, 0.16);
}

.background-action-grid button.selected,
.model-bg-grid button.selected,
.model-library-tabs button.selected {
  border-color: rgba(123, 97, 255, 0.46);
  color: #4b3dce;
  background: #f8f6ff;
  box-shadow: inset 0 0 0 1px rgba(123, 97, 255, 0.1);
}

.model-bg-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid {
  margin-top: 10px;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .background-preset-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 14px 2px 0;
  color: #6f7488;
  font-size: 13px;
  font-weight: 520;
  line-height: 1;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .background-preset-divider::before,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .background-preset-divider::after {
  flex: 1;
  height: 1px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(198, 190, 232, 0.88));
  content: "";
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .background-preset-divider::after {
  background: linear-gradient(90deg, rgba(198, 190, 232, 0.88), transparent);
}

.model-bg-grid button,
.model-library-tabs button {
  display: grid;
  gap: 5px;
  padding: 10px;
  text-align: left;
}

.model-bg-grid button {
  min-height: 46px;
  align-content: center;
  justify-items: center;
  text-align: center;
  font-size: 13px;
  font-weight: 525;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 48px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(218, 214, 236, 0.96) !important;
  border-radius: 14px !important;
  color: #3d4356 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  text-align: center !important;
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid button::before {
  width: 6px !important;
  height: 6px !important;
  border-radius: 999px !important;
  background: #c2c8d6 !important;
  content: "" !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid button:hover {
  border-color: rgba(171, 162, 222, 0.76) !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(87, 91, 120, 0.06) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid button:disabled,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid button[aria-disabled="true"],
body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid button.is-disabled {
  cursor: not-allowed !important;
  opacity: 0.46 !important;
  filter: grayscale(0.16) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid button:disabled:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid button[aria-disabled="true"]:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid button.is-disabled:hover {
  border-color: rgba(218, 214, 236, 0.96) !important;
  background: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid button.selected {
  border-color: rgba(91, 75, 232, 0.52) !important;
  color: #5142d6 !important;
  background: #f5f3ff !important;
  box-shadow: 0 9px 20px rgba(91, 75, 232, 0.1) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid button.selected::before {
  background: #5b4be8 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid strong {
  font-size: 14px;
  font-weight: 520;
  color: inherit !important;
}

.model-library-tabs button {
  min-height: 72px;
}

.model-bg-grid strong,
.model-library-tabs strong {
  color: #3d4356;
  font-size: 13px;
  font-weight: 525;
}

.model-bg-grid small,
.model-library-tabs small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  font-weight: 525;
}

.model-library-tabs strong {
  color: inherit;
  font-size: 13px;
}

.model-library-tabs small {
  font-size: 11px;
}

.material-picker,
.asset-section {
  display: grid;
  gap: 12px;
  padding: 13px;
  border: 1px solid #ede9ff;
  border-radius: 14px;
  background: #fff;
}

.material-picker-head,
.asset-section-head {
  display: flex;
  gap: 10px;
  align-items: baseline;
  justify-content: space-between;
}

.material-picker-head strong,
.asset-section-head strong {
  color: #30384d;
  font-size: 13px;
  font-weight: 525;
}

.material-picker-head small,
.asset-section-head small {
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 525;
}

.material-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
}

.material-thumb,
.asset-material-card {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 5px;
  border: 1px solid #ece9fb;
  border-radius: 12px;
  color: #42485d;
  text-align: left;
  background: #fbfbff;
}

.material-thumb.selected,
.asset-material-card:hover {
  border-color: rgba(123, 97, 255, 0.68);
  box-shadow: inset 0 0 0 1px rgba(123, 97, 255, 0.16);
}

.material-thumb img,
.asset-material-card img {
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 8px;
  object-fit: cover;
  background: #f1f1fa;
}

.material-thumb span,
.asset-material-card span {
  overflow: hidden;
  font-size: 10px;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.asset-material-card small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 525;
}

.material-toggle {
  min-height: 36px;
  border-radius: 11px;
  color: var(--purple);
  font-weight: 525;
}

.background-upload-button {
  grid-template-columns: auto minmax(0, 1fr);
  justify-items: start;
  min-height: 122px;
  padding: 14px 13px;
  text-align: left;
}

.background-upload-button.is-filled {
  border-style: dashed;
}

.background-upload-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body[data-active-feature="background"] .single-background-upload-row {
  grid-template-columns: minmax(0, 1fr) !important;
}

body[data-active-feature="background"] .background-upload-card-wrap {
  position: relative;
  width: 100%;
  min-width: 0;
  overflow: visible !important;
}

body[data-active-feature="background"] .single-background-upload-row .background-upload-button {
  grid-template-columns: auto minmax(0, 1fr) minmax(82px, 118px) !important;
  align-content: center !important;
  align-items: center !important;
  justify-items: stretch !important;
  width: 100% !important;
  min-height: 122px !important;
  padding: 13px !important;
  gap: 12px !important;
  text-align: left !important;
}

body[data-active-feature="background"] .single-background-upload-row .background-upload-button .upload-icon {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  width: 42px !important;
  height: 42px !important;
}

body[data-active-feature="background"] .single-background-upload-row .background-upload-button .upload-copy {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

body[data-active-feature="background"] .background-reference-preview-strip {
  grid-column: 3 !important;
  grid-row: 1 !important;
  display: grid !important;
  justify-content: end !important;
  width: min(118px, max-content) !important;
  min-width: 82px !important;
  max-width: 118px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body[data-active-feature="background"] .background-reference-preview-strip[hidden] {
  display: none !important;
}

body[data-active-feature="background"] .background-reference-preview-strip .single-upload-preview-card {
  width: auto !important;
  height: 82px !important;
  max-width: 118px !important;
  aspect-ratio: var(--preview-aspect, 1 / 1) !important;
  cursor: zoom-in;
}

body[data-active-feature="background"] .background-reference-clear-x {
  display: grid;
  top: 9px !important;
  right: 6px !important;
  z-index: 80 !important;
}

body[data-active-feature="background"] .background-reference-clear-x[hidden] {
  display: none !important;
}

.background-library-button {
  grid-template-columns: auto minmax(0, 1fr);
  justify-items: start;
  min-height: 76px;
  padding: 12px;
  color: #345164;
  text-align: left;
  background: linear-gradient(180deg, #f4fbff, #eef7ff);
}

.background-library-button:hover {
  border-color: rgba(69, 148, 209, 0.45);
  box-shadow: 0 12px 26px rgba(37, 112, 166, 0.12);
}

.background-upload-button .upload-icon,
.background-library-button .upload-icon {
  width: 42px;
  height: 42px;
  border-radius: 14px;
}

.background-upload-status,
body[data-active-feature="background"] .secondary-reference-upload-row .upload-copy small,
body[data-active-feature="colors"] .secondary-reference-upload-row .upload-copy small {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.background-upload-status::before,
body[data-active-feature="background"] .secondary-reference-upload-row .upload-copy small::before,
body[data-active-feature="colors"] .secondary-reference-upload-row .upload-copy small::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.7;
}

.background-material-picker-card {
  width: min(1180px, 94vw);
}

.mini-picker-grid.background-material-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.mini-picker-grid.background-material-grid img {
  aspect-ratio: 1 / 1;
}

.asset-library-panel {
  display: grid;
  gap: 12px;
}

.asset-material-grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 8px;
}

.asset-section.muted {
  color: var(--muted);
  background: #fbfbff;
}

.asset-section.muted p {
  margin: 0;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 525;
}

.admin-panel,
.admin-section {
  display: grid;
  gap: 12px;
}

.admin-section {
  padding: 13px;
  border: 1px solid #ede9ff;
  border-radius: 14px;
  background: #fff;
}

.admin-section > strong {
  color: #30384d;
  font-size: 15px;
  font-weight: 525;
}

.admin-section p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
  font-weight: 525;
}

.admin-prompt-row {
  display: grid;
  gap: 7px;
}

.admin-prompt-row span {
  color: #30384d;
  font-size: 12px;
  font-weight: 525;
}

.admin-prompt-row textarea {
  width: 100%;
  min-height: 112px;
  padding: 10px;
  border: 1px solid #e8e6f2;
  border-radius: 12px;
  background: #fbfbff;
  color: var(--ink);
  font: inherit;
  font-size: 12px;
  line-height: 1.45;
  resize: vertical;
}

.admin-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.admin-action-grid button,
.full-width-button {
  min-height: 40px;
  border: 1px solid #e7e3fb;
  border-radius: 12px;
  color: var(--purple);
  background: #fff;
  font-weight: 525;
}

.repair-tool-panel {
  display: grid;
  gap: 12px;
}

.repair-tool-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 12px;
  border: 1px solid #efe9ff;
  border-radius: 13px;
  color: #495066;
  background: #fbf9ff;
  font-size: 12px;
  line-height: 1.55;
  font-weight: 525;
}

.repair-tool-note .lucide {
  width: 18px;
  height: 18px;
  color: var(--purple);
}

.pattern-transfer-panel {
  display: grid;
  gap: 12px;
}

body.workstation-feature-mode[data-active-feature="pattern-transfer"] .pattern-transfer-panel {
  gap: 10px;
}

.pattern-upload-button {
  position: relative;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
}

.pattern-upload-button.is-filled {
  border-color: rgba(123, 97, 255, 0.35);
  background: #fbfaff;
}

.pattern-upload-thumb {
  width: 46px;
  height: 46px;
  border: 1px solid #ece8f7;
  border-radius: 10px;
  background:
    linear-gradient(45deg, #f0eef7 25%, transparent 25%),
    linear-gradient(-45deg, #f0eef7 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #f0eef7 75%),
    linear-gradient(-45deg, transparent 75%, #f0eef7 75%);
  background-color: #fff;
  background-position: 0 0, 0 6px, 6px -6px, -6px 0;
  background-size: 12px 12px;
  object-fit: contain;
}

.pattern-transfer-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.pattern-transfer-actions .outline-button {
  min-height: 38px;
  padding: 0 8px;
  font-size: 12px;
}

.pattern-transfer-actions .danger {
  color: #d84d58;
  border-color: #ffd6dc;
  background: #fff7f8;
}

.pattern-transfer-overlay {
  position: absolute;
  z-index: 7;
  min-width: 28px;
  min-height: 28px;
  cursor: move;
  touch-action: none;
  pointer-events: auto;
}

.pattern-transfer-overlay[hidden] {
  display: none;
}

.pattern-transfer-overlay img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain;
  filter: drop-shadow(0 6px 12px rgba(20, 20, 40, 0.14));
  user-select: none;
  pointer-events: none;
}

.pattern-transfer-overlay::before {
  content: "";
  position: absolute;
  inset: -5px;
  border: 1.5px dashed rgba(123, 97, 255, 0.72);
  border-radius: 10px;
  pointer-events: none;
}

.pattern-transfer-resize {
  position: absolute;
  right: -10px;
  bottom: -10px;
  width: 20px;
  height: 20px;
  border: 2px solid #fff;
  border-radius: 999px;
  background: var(--purple);
  box-shadow: 0 8px 16px rgba(80, 70, 150, 0.22);
  cursor: nwse-resize;
}

.pattern-transfer-resize::before {
  content: "";
  position: absolute;
  inset: 5px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
}

.pose-change-panel {
  display: grid;
  gap: 12px;
}

.pose-custom-reference {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: stretch;
}

.pose-upload-reference-button {
  display: flex;
  min-height: 70px;
  padding: 10px 12px;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  text-align: left;
  width: 100%;
}

.pose-upload-reference-button span:not(.upload-icon) {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.pose-upload-reference-button strong {
  color: #2f3447;
  font-size: 15px;
  font-weight: 525;
}

.pose-upload-reference-button small {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pose-clear-reference-button {
  min-height: 48px;
  padding-inline: 14px;
  white-space: nowrap;
}

.pose-type-tabs {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  padding: 7px;
  border: 1px solid rgba(123, 97, 255, 0.14);
  border-radius: 15px;
  background: #fbfaff;
}

.pose-type-button {
  min-height: 42px;
  border: 1px solid rgba(123, 97, 255, 0.2);
  border-radius: 12px;
  background: #fff;
  color: #3f4358;
  font-size: 14px;
  font-weight: 525;
  cursor: pointer;
  transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.pose-type-button:hover {
  border-color: rgba(123, 97, 255, 0.42);
  background: #fff;
}

.pose-type-button.selected {
  border-color: transparent;
  background: linear-gradient(135deg, #7568ff, #5f8cff);
  color: #fff;
  box-shadow: 0 10px 20px rgba(95, 104, 255, 0.18);
}

.pose-selection-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 38px;
  padding: 8px 11px;
  border: 1px solid rgba(123, 97, 255, 0.14);
  border-radius: 10px;
  background: #fbfaff;
  color: #596078;
  font-size: 12px;
  line-height: 1.4;
}

.pose-selection-summary strong {
  color: #5e49d8;
  font-size: 14px;
}

.pose-selection-summary small {
  flex: 0 0 auto;
  padding: 3px 7px;
  border-radius: 6px;
  background: #f1eff8;
  color: #73778b;
  font-size: 11px;
}

.pose-selection-summary.has-discount small {
  background: #e9f8f0;
  color: #16865c;
}

.pose-reference-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

.pose-reference-card {
  position: relative;
  display: grid;
  gap: 5px;
  padding: 5px;
  border: 1px solid #ece8f4;
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  box-shadow: 0 6px 14px rgba(40, 36, 60, 0.04);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.pose-reference-card:hover,
.pose-reference-card.selected {
  border-color: rgba(123, 97, 255, 0.48);
  box-shadow: 0 9px 18px rgba(78, 59, 170, 0.08);
  transform: translateY(-1px);
}

.pose-upload-reference-button:disabled,
.pose-reference-card:disabled {
  cursor: not-allowed;
  opacity: 0.48;
  transform: none;
}

.pose-reference-card:disabled:hover {
  border-color: #ece8f4;
  box-shadow: 0 8px 18px rgba(40, 36, 60, 0.06);
}

.pose-reference-card.selected::after {
  content: "";
  position: absolute;
  top: 7px;
  right: 7px;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--purple);
  box-shadow: 0 0 0 3px rgba(123, 97, 255, 0.18);
}

.pose-reference-card img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: 7px;
  background: #f6f6f8;
  object-fit: contain;
  object-position: center top;
}

.pose-reference-card span {
  color: #696d7e;
  font-size: 11px;
  font-weight: 525;
  line-height: 1;
  text-align: center;
}

.repair-brush-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid #ece8f7;
  border-radius: 13px;
  background: #fff;
}

.repair-brush-row span,
.repair-brush-row output {
  color: #30384d;
  font-size: 12px;
  font-weight: 525;
  white-space: nowrap;
}

.repair-brush-row input {
  width: 100%;
  accent-color: var(--purple);
}

.repair-clear-button {
  width: 100%;
  min-height: 42px;
}

.repair-action-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.repair-action-row .repair-clear-button {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  justify-content: center;
}

.repair-action-row .lucide {
  width: 16px;
  height: 16px;
}

.repair-tool-panel p {
  margin: 0;
  padding: 10px 12px;
  border-radius: 12px;
  color: #6a5478;
  background: #fff6fb;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 525;
}

.need-request-list {
  display: grid;
  gap: 10px;
}

.need-request-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid #ebe8f7;
  border-radius: 12px;
  background: #fbfbff;
}

.need-request-item.pending {
  border-color: rgba(123, 97, 255, 0.28);
  background: #f9f6ff;
}

.need-request-item > div {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.need-request-item strong {
  color: #30384d;
  font-size: 14px;
  font-weight: 525;
}

.need-request-item span,
.need-request-item small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 525;
}

.need-request-item p {
  color: #44495d;
  overflow-wrap: anywhere;
}

.need-request-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}

.need-request-attachments a {
  display: block;
  width: 54px;
  height: 54px;
  overflow: hidden;
  border: 1px solid #ece9f5;
  border-radius: 10px;
  background: #f7f6fb;
}

.need-request-attachments img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.approve-request-button,
.approved-badge {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 12px;
  border: 0;
  border-radius: 10px;
  color: #fff;
  background: linear-gradient(135deg, var(--purple), var(--purple-2));
  font-size: 12px;
  font-weight: 525;
  white-space: nowrap;
}

.approve-request-button:disabled {
  cursor: wait;
  opacity: 0.72;
}

.approved-badge {
  color: #22a06b;
  background: #eaf8f1;
}

.model-library-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.mini-picker {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(28, 29, 42, 0.42);
}

.mini-picker[hidden] {
  display: none;
}

.mini-picker-card {
  display: grid;
  gap: 16px;
  width: min(1480px, 97vw);
  max-height: min(92vh, 980px);
  padding: 20px;
  overflow: hidden;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 28px 70px rgba(25, 23, 50, 0.24);
}

.mini-picker-head {
  position: relative;
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
}

.mini-picker-head div:first-child {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.mini-picker-head strong {
  font-size: 20px;
}

.mini-picker-head small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 525;
}

.mini-picker-head b {
  color: var(--purple);
}

.mini-picker-actions {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  margin-left: auto;
  padding-right: 50px;
}

.mini-picker-back {
  min-height: 38px;
  padding: 0 13px;
  border-radius: 11px;
  color: #4f5368;
  font-size: 12px;
  font-weight: 525;
}

.mini-picker-actions .create-button {
  min-height: 38px;
  padding: 0 14px;
  border-radius: 11px;
  font-size: 12px;
}

.mini-picker-actions .create-button:disabled {
  cursor: not-allowed;
  opacity: 0.46;
}

.mini-picker-grid {
  display: grid;
  gap: 14px;
  max-height: min(74vh, 760px);
  overflow: auto;
  padding: 2px 4px 4px 2px;
}

.mini-picker-grid.entry-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.mini-picker-grid.photo-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.mini-picker-grid button {
  position: relative;
  display: grid;
  gap: 8px;
  align-content: start;
  padding: 10px;
  border: 1px solid #ece9fb;
  border-radius: 14px;
  color: #30384d;
  background: #fbfbff;
  font-weight: 525;
  text-align: left;
}

.mini-picker-grid button.selected {
  border-color: rgba(123, 97, 255, 0.7);
  background: #f7f4ff;
  box-shadow: 0 0 0 3px rgba(123, 97, 255, 0.12);
}

.mini-picker-checkbox {
  position: absolute;
  left: 18px;
  top: 18px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 2px solid rgba(38, 44, 62, 0.26);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 6px 14px rgba(16, 20, 31, 0.16);
}

.mini-picker-grid button.selected .mini-picker-checkbox {
  border-color: var(--purple);
  background: var(--purple);
}

.mini-picker-grid button.selected .mini-picker-checkbox::after {
  content: "";
  width: 11px;
  height: 6px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translateY(-1px);
}

.mini-picker-empty {
  grid-column: 1 / -1;
  display: grid;
  place-items: center;
  min-height: 140px;
  border: 1px dashed #e5e0fb;
  border-radius: 12px;
  color: var(--muted);
  background: #fbfbff;
  font-size: 13px;
  font-weight: 525;
}

.mini-picker-grid img {
  width: 100%;
  border-radius: 11px;
  object-fit: contain;
  background: #f1f1fa;
}

.mini-picker-grid.entry-grid img {
  aspect-ratio: 1 / 1;
}

.mini-picker-grid.photo-grid img {
  aspect-ratio: 3 / 4;
}

.feature-example-picker-card,
.wrinkle-example-picker-card {
  width: min(1040px, 94vw);
}

.unified-upload-card {
  width: min(1080px, 94vw);
  gap: 16px;
}

.unified-upload-head span {
  color: var(--purple);
  font-size: 13px;
  font-weight: 525;
}

.unified-upload-dropzone {
  display: grid;
  place-items: center;
  min-height: 214px;
  padding: 26px;
  border: 2px dashed #cbd3df;
  border-radius: 18px;
  color: #30384d;
  background: #f8fafc;
  text-align: center;
}

.unified-upload-dropzone:hover,
.unified-upload-dropzone:focus-visible,
.unified-upload-dropzone.is-dragover {
  border-color: var(--purple);
  background: #f7f4ff;
}

.unified-upload-icon {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  margin-bottom: 10px;
  border-radius: 16px;
  color: var(--purple);
  background: #eee8ff;
}

.unified-upload-icon .lucide {
  width: 25px;
  height: 25px;
}

.unified-upload-dropzone strong {
  font-size: 17px;
  font-weight: 525;
}

.unified-upload-dropzone small {
  margin-top: 8px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 525;
}

.unified-upload-dropzone em {
  margin-top: 10px;
  color: var(--purple);
  font-size: 13px;
  font-style: normal;
  font-weight: 525;
}

.unified-upload-section {
  display: grid;
  gap: 12px;
}

.unified-upload-section-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: end;
}

.unified-upload-section-head strong {
  color: #30384d;
  font-size: 15px;
}

.unified-upload-section-head small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 525;
}

.detail-dialog-upload-zone {
  display: grid;
  gap: 14px;
  padding: 14px;
  border: 1px solid #eef0fb;
  border-radius: 18px;
  background: #fbfbff;
}

.detail-dialog-upload-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.detail-dialog-upload-slot {
  position: relative;
  display: grid;
  grid-template-rows: auto auto auto;
  gap: 7px;
  min-width: 0;
  padding: 12px;
  border: 1px solid #e3e6f3;
  border-radius: 16px;
  background: #fff;
  color: #475467;
  cursor: pointer;
}

.detail-dialog-upload-slot:hover,
.detail-dialog-upload-slot:focus-visible {
  border-color: #8b73ff;
  box-shadow: 0 12px 28px rgba(95, 76, 225, 0.12);
}

.detail-dialog-upload-slot.is-filled {
  border-color: #cfc7ff;
  background: #faf8ff;
}

.detail-dialog-upload-thumb {
  display: grid;
  place-items: center;
  width: 100%;
  height: 132px;
  min-height: 132px;
  overflow: hidden;
  border: 1px dashed #d9ddea;
  border-radius: 12px;
  background: linear-gradient(180deg, #fbfaff 0%, #f4f2ff 100%);
}

.detail-dialog-upload-slot.is-filled .detail-dialog-upload-thumb {
  border-style: solid;
  background: #fff;
}

.detail-dialog-upload-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.detail-dialog-upload-thumb .lucide {
  width: 46px;
  height: 46px;
  color: #8b73ff;
  stroke-width: 1.65;
}

.detail-dialog-upload-slot strong,
.detail-dialog-upload-slot small {
  min-width: 0;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.detail-dialog-upload-slot strong {
  font-size: 14px;
  font-weight: 650;
  color: #344054;
}

.detail-dialog-upload-slot small {
  font-size: 12px;
  color: #8a90a0;
}

.unified-example-grid {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 10px;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 6px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(123, 97, 255, 0.26) transparent;
}

.unified-example-grid button {
  flex: 0 0 210px;
  display: grid;
  gap: 0;
  padding: 0;
  border: 0;
  border-radius: 10px;
  color: #30384d;
  background: transparent;
  font-weight: 525;
  text-align: center;
}

.unified-example-grid button:hover,
.unified-example-grid button:focus-visible {
  background: transparent;
}

.unified-example-grid button:hover img,
.unified-example-grid button:focus-visible img {
  border-color: rgba(123, 97, 255, 0.55);
  box-shadow: 0 10px 22px rgba(58, 48, 112, 0.1);
}

.unified-example-grid::-webkit-scrollbar {
  height: 7px;
}

.unified-example-grid::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(123, 97, 255, 0.22);
}

.unified-example-grid img {
  width: 100%;
  aspect-ratio: 3 / 4;
  border: 1px solid #ece9fb;
  border-radius: 10px;
  object-fit: contain;
  background: #f3f2fb;
}

.unified-example-grid span {
  display: none;
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.unified-library-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.unified-library-actions .library-select-button {
  width: 100%;
  min-width: 0;
}

.unified-library-actions .library-select-button:only-child {
  grid-column: 1 / -1;
}

.unified-upload-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding-top: 4px;
}

.unified-upload-actions .outline-button,
.unified-upload-actions .create-button {
  min-width: 104px;
}

.unified-upload-actions .create-button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.feature-example-grid,
.wrinkle-example-grid {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 10px;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 6px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(123, 97, 255, 0.26) transparent;
}

.feature-example-grid::-webkit-scrollbar,
.wrinkle-example-grid::-webkit-scrollbar {
  height: 7px;
}

.feature-example-grid::-webkit-scrollbar-thumb,
.wrinkle-example-grid::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(123, 97, 255, 0.22);
}

.feature-example-grid .feature-example-card,
.wrinkle-example-grid .wrinkle-example-card {
  flex: 0 0 210px;
  gap: 0;
  padding: 10px;
  text-align: center;
}

.feature-example-grid .feature-example-card img,
.wrinkle-example-grid .wrinkle-example-card img {
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: 12px;
  object-fit: contain;
  background: #f3f2fb;
}

.feature-example-grid .feature-example-card span,
.wrinkle-example-grid .wrinkle-example-card span {
  overflow: hidden;
  color: #30384d;
  font-size: 12px;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mini-picker-grid button > span:not(.mini-picker-checkbox),
.mini-picker-grid button > small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mini-picker-grid button > small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 525;
}

@media (max-width: 900px) {
  .mini-picker {
    align-items: start;
    padding: 14px;
    overflow: auto;
  }

  .mini-picker-card {
    width: 100%;
    max-height: none;
  }

  .mini-picker-head {
    align-items: flex-start;
  }

  .mini-picker-grid,
  .mini-picker-grid.entry-grid,
  .mini-picker-grid.photo-grid,
  .unified-example-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-height: none;
  }

  .unified-upload-section-head {
    display: grid;
  }

  .unified-library-actions {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  .mini-picker-grid,
  .mini-picker-grid.entry-grid,
  .mini-picker-grid.photo-grid,
  .unified-example-grid {
    grid-template-columns: 1fr;
  }
}

.background-ref-chip {
  position: absolute;
  left: 18px;
  bottom: 18px;
  z-index: 7;
  display: grid;
  gap: 5px;
  width: 156px;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, 0.78);
  border-radius: 14px;
  color: #fff;
  background: rgba(28, 29, 42, 0.72);
  box-shadow: 0 16px 34px rgba(27, 24, 52, 0.22);
  backdrop-filter: blur(10px);
}

.background-ref-chip[hidden] {
  display: none;
}

.background-ref-chip img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1;
  max-width: 100% !important;
  max-height: none !important;
  border-radius: 10px;
  object-fit: cover !important;
  background: #f1f1fa;
}

body.workstation-feature-mode[data-active-feature="pose-change"] .background-ref-chip {
  width: 190px;
  padding: 10px;
}

body.workstation-feature-mode[data-active-feature="pose-change"] .background-ref-chip img {
  aspect-ratio: 3 / 4;
  object-fit: contain !important;
  object-position: center top;
}

body[data-active-feature="pose-change"] .preview-frame {
  padding-top: 30px;
}

.background-ref-chip span {
  font-size: 12px;
  font-weight: 525;
  text-align: center;
}

.background-upload-status {
  display: inline-grid;
  width: fit-content;
  margin-top: 5px;
  padding: 4px 8px;
  border-radius: 999px;
  color: #247056;
  background: #eaf8f1;
  font-size: 11px;
  font-style: normal;
  font-weight: 525;
}

.prompt-option {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 13px;
  border: 1px solid #ede9ff;
  border-radius: 14px;
  background: #fff;
}

.prompt-option strong,
.prompt-option small {
  display: block;
}

.prompt-option strong {
  color: #30384d;
  font-size: 14px;
  font-weight: 525;
}

.prompt-option small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.slider-row,
.switch-row {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  color: #344054;
  font-size: 14px;
  font-weight: 525;
}

input[type="range"] {
  width: 52%;
  accent-color: var(--purple);
}

input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--purple);
}

.choice-grid,
.library-board,
.upload-slot-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.choice-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.choice-grid.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.buyer-filter-block {
  display: grid;
  gap: 8px;
}

.buyer-filter-block + .buyer-filter-block {
  margin-top: 12px;
}

.buyer-filter-title {
  color: #2d3448;
  font-size: 13px;
  font-weight: 525;
  line-height: 1.25;
}

.buyer-gender-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.buyer-gender-grid .choice-button {
  min-height: 48px;
  padding: 9px 10px;
  justify-items: center;
  align-content: center;
  text-align: center;
  font-size: 14px;
  font-weight: 525;
}

.choice-grid.clothes-ethnicity-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.choice-grid.clothes-model-age-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.clothes-model-age-grid .choice-button {
  min-height: 42px;
  padding: 8px 10px;
  justify-items: center;
  align-content: center;
  text-align: center;
  font-size: 13.5px;
  font-weight: 525;
}

body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .buyer-filter-block .choice-button:disabled,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .buyer-filter-block .choice-button[aria-disabled="true"],
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-age-select.is-disabled summary {
  cursor: not-allowed;
  opacity: 0.48;
  filter: grayscale(0.18);
}

body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .buyer-filter-block .choice-button:disabled:hover,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .buyer-filter-block .choice-button[aria-disabled="true"]:hover {
  transform: none;
  box-shadow: none;
}

body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-age-select.is-disabled summary {
  pointer-events: none;
}

.set-product-type-block {
  display: grid;
  gap: 8px;
}

.set-generate-mode-block {
  display: none;
}

body.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-mode-block,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-pet-type-group {
  display: grid;
  gap: 10px;
  margin-bottom: 4px;
  padding: 11px;
  border: 1px solid rgba(123, 97, 255, 0.18);
  border-radius: 16px;
  background: linear-gradient(180deg, #fbfaff, #ffffff);
  box-shadow: inset 0 -1px 0 rgba(123, 97, 255, 0.08);
}

.set-mode-label {
  color: #5c5578;
  font-size: 13px;
  font-weight: 525;
}

body.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-mode-block .set-mode-button {
  border-color: rgba(123, 97, 255, 0.32);
  background: linear-gradient(180deg, #fbf9ff, #ffffff);
  color: #5b4ee6;
  box-shadow: 0 10px 22px rgba(123, 97, 255, 0.12);
}

body.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-mode-block .set-mode-button small {
  color: #8c87aa;
}

body.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-mode-block .set-mode-button.selected {
  border-color: rgba(102, 87, 255, 0.92);
  background: linear-gradient(180deg, #7564ff, #8d6cff);
  color: #ffffff;
  box-shadow: 0 14px 30px rgba(123, 97, 255, 0.26);
}

body.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-mode-block .set-mode-button.selected small {
  color: rgba(255, 255, 255, 0.86);
}

.set-mode-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.set-mode-button {
  min-height: 68px;
  justify-items: center;
  align-content: center;
  gap: 6px;
  text-align: center;
  font-size: 16px;
  border-radius: 16px;
}

.set-mode-button small {
  max-width: 16em;
  text-align: center;
  line-height: 1.35;
}

.set-mode-button.selected {
  border-color: rgba(123, 97, 255, 0.66);
  background: linear-gradient(180deg, #f7f4ff, #ffffff);
  color: #4a3fd0;
  box-shadow: inset 0 0 0 1px rgba(123, 97, 255, 0.14);
}

.set-product-type-grid .choice-button {
  min-height: 44px;
  justify-items: center;
  align-content: center;
  text-align: center;
  font-size: 14px;
  font-weight: 525;
}

.set-product-type-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.set-model-role-field {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid rgba(123, 97, 255, 0.16);
  border-radius: 14px;
  background: linear-gradient(180deg, #fbfaff, #ffffff);
}

.set-model-role-field + .set-model-role-field {
  margin-top: 8px;
  border-color: rgba(40, 158, 125, 0.18);
  background: linear-gradient(180deg, #f7fffc, #ffffff);
}

.set-model-role-field .experience-label {
  align-items: center;
  width: fit-content;
  margin-bottom: 0;
  padding: 3px 8px;
  border-radius: 999px;
  color: #4b3dce;
  background: rgba(117, 104, 255, 0.1);
  font-size: 13px;
}

.set-model-role-field + .set-model-role-field .experience-label {
  color: #257c68;
  background: rgba(40, 158, 125, 0.1);
}

.set-model-role-field small {
  color: #7e8298;
  font-size: 12px;
  line-height: 1.35;
}

.set-model-role-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.set-model-role-button {
  min-height: 40px;
  border: 1px solid rgba(128, 137, 160, 0.34);
  border-radius: 12px;
  background: #fff;
  color: #30384d;
  padding: 0 8px;
  font-size: 12.5px;
  font-weight: 525;
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease, color 0.16s ease;
}

.set-model-role-button.selected {
  border-color: rgba(102, 87, 255, 0.5);
  background: #f4f1ff;
  color: #4b3dce;
  box-shadow: inset 0 0 0 1px rgba(102, 87, 255, 0.08);
}

.set-model-style-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.set-model-style-button {
  min-height: 40px;
  border: 1px solid rgba(128, 137, 160, 0.34);
  border-radius: 12px;
  background: #fff;
  color: #30384d;
  padding: 0 10px;
  font-size: 12.5px;
  font-weight: 525;
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease, color 0.16s ease;
}

.set-model-style-button.selected {
  border-color: rgba(40, 158, 125, 0.55);
  background: #effbf7;
  color: #257c68;
  box-shadow: inset 0 0 0 1px rgba(40, 158, 125, 0.08);
}

body.feature-showcase-mode .set-preview-board {
  display: grid;
  grid-template-rows: auto 590px;
  flex: 0 0 auto;
  gap: 16px;
  box-sizing: border-box;
  width: 1004px;
  height: 704px;
  margin: auto;
  padding: 20px;
  border: 1px solid rgba(128, 137, 160, 0.18);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 18px 44px rgba(36, 42, 62, 0.08);
  backdrop-filter: blur(10px);
}

body.feature-showcase-mode .set-preview-board-head {
  display: grid;
  gap: 5px;
  align-content: center;
  min-height: 58px;
  padding: 0 4px;
}

body.feature-showcase-mode .set-preview-board-head strong {
  color: #242a39;
  font-size: 22px;
  font-weight: 525;
  line-height: 1.15;
}

body.feature-showcase-mode .set-preview-board-head small {
  color: #72798a;
  font-size: 13px;
  font-weight: 525;
  line-height: 1.45;
}

body.feature-showcase-mode .set-preview-layout {
  position: relative;
  display: grid;
  grid-template-columns: 443px 447px;
  gap: 74px;
  min-height: 0;
}

body.feature-showcase-mode .set-preview-divider {
  position: absolute;
  left: 480px;
  top: 50%;
  z-index: 4;
  display: grid;
  place-items: center;
  width: 34px;
  height: 84px;
  color: #8b91a3;
  transform: translate(-50%, -50%);
}

body.feature-showcase-mode .set-preview-divider::before,
body.feature-showcase-mode .set-preview-divider::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 1px;
  height: 25px;
  background: linear-gradient(180deg, transparent, rgba(139, 145, 163, 0.45));
}

body.feature-showcase-mode .set-preview-divider::before {
  top: 0;
}

body.feature-showcase-mode .set-preview-divider::after {
  bottom: 0;
  background: linear-gradient(180deg, rgba(139, 145, 163, 0.45), transparent);
}

body.feature-showcase-mode .set-preview-divider .lucide {
  position: relative;
  z-index: 1;
  width: 20px;
  height: 20px;
  padding: 4px;
  border: 1px solid rgba(139, 145, 163, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  stroke-width: 2.6;
}

body.feature-showcase-mode .preview-empty {
  display: grid;
  place-items: center;
  overflow: visible;
}

body.feature-showcase-mode .preview-card {
  overflow: auto;
}

body.feature-showcase-mode .set-preview-grid {
  display: grid;
  grid-template-columns: repeat(2, 214px);
  grid-template-rows: repeat(2, 286px);
  gap: 18px 19px;
  min-height: 0;
}

body.feature-showcase-mode .set-preview-card {
  position: relative;
  overflow: hidden;
  min-height: 0;
  border: 1px solid rgba(128, 137, 160, 0.18);
  border-radius: 12px;
  background: #f7f7fb;
  box-shadow: none;
}

body.feature-showcase-mode .set-preview-card[data-showcase-image] {
  cursor: zoom-in;
}

body.feature-showcase-mode .set-preview-card[data-showcase-image]:hover {
  border-color: rgba(37, 99, 235, 0.28);
}

body.feature-showcase-mode .set-preview-card-main {
  width: 100%;
  height: 100%;
}

body.feature-showcase-mode .preview-card .set-preview-card img {
  display: block;
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  max-width: none;
  max-height: none;
  object-fit: cover !important;
  object-position: center center;
}

body.feature-showcase-mode .set-preview-card span {
  position: absolute;
  left: 10px;
  top: 10px;
  z-index: 1;
  padding: 5px 8px;
  border-radius: 999px;
  color: #fff;
  background: rgba(18, 22, 32, 0.58);
  font-size: 12px;
  font-weight: 525;
  backdrop-filter: blur(8px);
}

body.feature-showcase-mode .set-preview-card.is-empty {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  padding: 24px;
  color: #7c8191;
  text-align: center;
}

body.feature-showcase-mode .set-preview-card.is-empty strong {
  color: #30384d;
  font-size: 18px;
  font-weight: 525;
}

body.feature-showcase-mode .set-preview-card.is-empty small {
  max-width: 180px;
  font-size: 12px;
  font-weight: 525;
  line-height: 1.45;
}

body.feature-showcase-mode .feature-image-showcase-layout {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 96px;
}

body.feature-showcase-mode .feature-image-showcase-board {
  grid-template-rows: auto minmax(0, 700px);
  width: min(1320px, calc(100% - 40px));
  height: 824px;
  padding: 22px;
  border: 0;
}

body.feature-showcase-mode .feature-image-showcase-board .set-preview-divider {
  left: 50%;
}

body.feature-showcase-mode .feature-image-showcase-board .set-preview-divider .lucide {
  border: 0;
}

body.feature-showcase-mode .feature-image-showcase-board .set-preview-board-head {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 58px;
  padding: 0 4px;
  border-bottom: 1px solid rgba(128, 137, 160, 0.18);
}

body.feature-showcase-mode .feature-image-showcase-logo {
  position: absolute;
  left: 4px;
  top: 50%;
  width: 124px;
  max-height: 20px;
  object-fit: contain;
  object-position: left center;
  transform: translateY(-50%);
}

body.feature-showcase-mode .feature-image-showcase-heading {
  display: grid;
  gap: 5px;
  justify-items: center;
  text-align: center;
}

body.feature-showcase-mode .feature-image-showcase-board .set-preview-board-head strong {
  color: #202637;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.1;
}

body.feature-showcase-mode .feature-image-showcase-board .set-preview-board-head small {
  color: #7b8293;
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.5;
}

body.feature-showcase-mode .feature-image-showcase-layout::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 4%;
  bottom: 4%;
  z-index: 2;
  width: 1px;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(113, 102, 222, 0.18) 18%,
    rgba(113, 102, 222, 0.42) 50%,
    rgba(113, 102, 222, 0.18) 82%,
    transparent 100%
  );
  box-shadow: 0 0 14px rgba(113, 102, 222, 0.12);
  transform: translateX(-50%);
  pointer-events: none;
}

body.feature-showcase-mode .feature-image-showcase-layout.has-pair-dividers::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 3;
  width: 7px;
  height: 7px;
  border: 2px solid rgba(113, 102, 222, 0.34);
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 0 0 5px rgba(113, 102, 222, 0.07);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

body.feature-showcase-mode .feature-image-showcase-layout.has-pair-dividers {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 96px;
}

body.feature-showcase-mode .feature-image-showcase-group {
  position: relative;
  min-width: 0;
  min-height: 0;
}

body.feature-showcase-mode .feature-image-showcase-group-grid {
  display: grid;
  width: 100%;
  height: 100%;
  min-height: 0;
}

body.feature-showcase-mode .feature-image-showcase-group.is-single .feature-image-showcase-group-grid {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
}

body.feature-showcase-mode .feature-image-showcase-group.is-single-large {
  align-self: stretch;
  width: 100%;
  height: 100%;
}

body.feature-showcase-mode .feature-image-showcase-group.is-single-large .feature-image-showcase-group-grid,
body.feature-showcase-mode .feature-image-showcase-group.is-single-large .set-preview-card {
  width: 100%;
  height: 100%;
  min-height: 0;
}

body.feature-showcase-mode .feature-image-showcase-group.count-0 {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
}

body.feature-showcase-mode .feature-image-showcase-group.count-2 .feature-image-showcase-group-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: auto;
  align-content: start;
  height: auto;
  column-gap: 19px;
}

body.feature-showcase-mode .feature-image-showcase-group.count-2 {
  align-self: start;
}

body.feature-showcase-mode .feature-image-showcase-group.count-2 .set-preview-card {
  aspect-ratio: 3 / 4;
  height: auto;
}

body.feature-showcase-mode .feature-image-showcase-group.count-3 .feature-image-showcase-group-grid,
body.feature-showcase-mode .feature-image-showcase-group.count-4 .feature-image-showcase-group-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 18px 19px;
}

body.feature-showcase-mode .feature-image-showcase-group .set-preview-card {
  width: 100%;
  height: 100%;
  border: 0;
}

body.feature-showcase-mode .feature-image-showcase-group .set-preview-card img {
  display: block;
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  object-fit: cover !important;
  object-position: center center;
}

body.feature-showcase-mode .feature-image-pair-arrow {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 5;
  display: grid;
  width: 18px;
  height: 18px;
  place-items: center;
  border: 0;
  border-radius: 999px;
  color: #767d90;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 2px 6px rgba(36, 42, 62, 0.08);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

body.feature-showcase-mode .feature-image-pair-arrow .lucide {
  width: 10px;
  height: 10px;
  stroke-width: 2;
}

body.feature-showcase-mode .feature-image-showcase-layout.has-center-divider .feature-image-pair-arrow {
  display: none;
}

body.feature-showcase-mode .feature-image-showcase-group.count-3 .feature-image-pair-arrow.pair-1,
body.feature-showcase-mode .feature-image-showcase-group.count-4 .feature-image-pair-arrow.pair-1 {
  top: 24.25%;
}

body.feature-showcase-mode .feature-image-showcase-group.count-4 .feature-image-pair-arrow.pair-2 {
  top: 75.75%;
}
.set-ratio-select {
  position: relative;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.set-ratio-select summary {
  display: flex;
  min-height: 46px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 12px;
  color: #30384d;
  cursor: pointer;
  list-style: none;
  font-size: 14px;
  font-weight: 525;
}

.set-ratio-select summary::-webkit-details-marker {
  display: none;
}

.set-ratio-select summary::after {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid #8a8fa3;
  border-bottom: 2px solid #8a8fa3;
  transform: rotate(45deg);
  transition: transform 0.16s ease;
}

.set-ratio-select[open] summary::after {
  transform: rotate(225deg);
}

.set-ratio-select summary strong {
  margin-left: auto;
  color: var(--purple);
  font-size: 14px;
}

.set-ratio-menu {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(100% + 8px);
  z-index: 20;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid #e8e4fb;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(65, 52, 132, 0.16);
}

.set-ratio-select:not([open]) .set-ratio-menu {
  display: none;
}

.set-ratio-menu button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 38px;
  min-height: 48px;
  align-items: center;
  gap: 6px;
  border: 1px solid #e8e4fb;
  border-radius: 10px;
  color: #30384d;
  background: #fbfbff;
  font-size: 13px;
  font-weight: 525;
}

.set-ratio-menu button[data-set-generate-ratio="auto"] {
  grid-template-columns: 1fr;
  justify-items: center;
}

.set-ratio-menu button.selected {
  border-color: rgba(123, 97, 255, 0.6);
  color: var(--purple);
  background: #f6f2ff;
}

.set-ratio-menu .ratio-icon {
  width: 38px;
  height: 30px;
}

.clothes-ethnicity-grid .choice-button {
  min-height: 48px;
  padding: 9px 10px;
  justify-items: center;
  align-content: center;
  text-align: center;
  font-size: 14px;
  font-weight: 525;
}

.buyer-age-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.buyer-age-grid .choice-button {
  min-height: 48px;
  padding: 9px 8px;
  justify-items: center;
  align-content: center;
  text-align: center;
  font-size: 14px;
  font-weight: 525;
}

.choice-button,
.swatch-button,
.model-card,
.slot-button {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.choice-button {
  display: grid;
  gap: 5px;
  min-height: 58px;
  padding: 10px;
  color: #30384d;
  text-align: left;
  font-size: 13px;
  font-weight: 525;
}

.choice-button small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 525;
}

.choice-button.selected,
.swatch-button.selected,
.model-card.selected,
.slot-button.is-filled {
  border-color: var(--purple);
  background: #f8f6ff;
  color: #4b3dce;
  box-shadow: inset 0 0 0 1px rgba(123, 97, 255, 0.2);
}

.print-extract-mode-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.print-extract-mode-grid .choice-button {
  position: relative;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 68px;
  padding: 10px 12px;
  border: 1px solid rgba(216, 221, 235, 0.92);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.78);
  color: #32394d;
  text-align: left;
  font-size: 14px;
  font-weight: 620;
  box-shadow: 0 10px 22px rgba(64, 72, 104, 0.055);
}

.print-extract-mode-grid .choice-button > .lucide {
  width: 38px;
  height: 38px;
  padding: 9px;
  border-radius: 13px;
  color: #6856e8;
  background: rgba(109, 85, 238, 0.1);
}

.print-extract-mode-grid .choice-button span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.print-extract-mode-grid .choice-button strong {
  overflow: hidden;
  color: inherit;
  font-size: 14px;
  font-weight: 720;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.print-extract-mode-grid .choice-button small {
  color: #9aa1af;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.25;
}

.print-extract-mode-grid .choice-button:hover {
  border-color: rgba(123, 97, 255, 0.28);
  background: #ffffff;
  color: #272e42;
}

.print-extract-mode-grid .choice-button.selected {
  border-color: rgba(109, 85, 238, 0.48);
  background: linear-gradient(135deg, #ffffff 0%, #f2efff 100%);
  color: #5b45d6;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08), 0 14px 28px rgba(83, 68, 179, 0.1);
}

.print-extract-mode-grid .choice-button.selected small {
  color: #7d72bd;
}

.print-extract-mode-grid .choice-button.selected > .lucide {
  color: #ffffff;
  background: linear-gradient(135deg, #6d55ee, #8d7bff);
}

.outpaint-preset-grid .choice-button {
  position: relative;
  grid-template-columns: minmax(0, 1fr) 58px;
  align-items: center;
  gap: 12px;
  min-height: 72px;
  padding: 12px 14px;
}

.outpaint-preset-text {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.outpaint-preset-text strong {
  color: #30384d;
  font-size: 14px;
  line-height: 1.15;
  font-weight: 525;
}

.outpaint-preset-text small {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.25;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ratio-icon {
  justify-self: end;
  position: relative;
  display: grid;
  place-items: center;
  width: 52px;
  height: 42px;
  color: #8f96aa;
}

.ratio-icon::before {
  content: "";
  width: var(--ratio-icon-width, 34px);
  height: var(--ratio-icon-height, 26px);
  border: 2px solid currentColor;
  border-radius: 6px;
  background:
    linear-gradient(90deg, rgba(123, 97, 255, 0.12) 1px, transparent 1px),
    linear-gradient(180deg, rgba(123, 97, 255, 0.12) 1px, transparent 1px),
    rgba(255, 255, 255, 0.78);
  background-size: 8px 8px;
}

.ratio-icon-auto::before,
.ratio-icon-auto::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  border: 0;
  border-radius: 999px;
  background: currentColor;
  transform: translate(-50%, -50%);
}

.ratio-icon-auto::before {
  width: 30px;
  height: 2px;
}

.ratio-icon-auto::after {
  width: 2px;
  height: 30px;
}

.ratio-arrow {
  position: absolute;
  width: 8px;
  height: 8px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
}

.ratio-arrow-up {
  left: 50%;
  top: 5px;
  transform: translateX(-50%) rotate(-45deg);
}

.ratio-arrow-right {
  right: 6px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}

.ratio-arrow-down {
  left: 50%;
  bottom: 5px;
  transform: translateX(-50%) rotate(135deg);
}

.ratio-arrow-left {
  left: 6px;
  top: 50%;
  transform: translateY(-50%) rotate(-135deg);
}

.outpaint-preset-grid .choice-button.selected .ratio-icon {
  color: rgba(255, 255, 255, 0.82);
}

.outpaint-preset-grid .choice-button.selected .outpaint-preset-text strong {
  color: #ffffff;
}

.outpaint-preset-grid .choice-button.selected .outpaint-preset-text small {
  color: rgba(255, 255, 255, 0.74);
}

.outpaint-preset-grid .choice-button.selected .ratio-icon::before {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.16) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.16) 1px, transparent 1px),
    rgba(255, 255, 255, 0.08);
}

.view-change-panel {
  display: grid;
  gap: 12px;
}

body.workstation-feature-mode[data-active-feature="view-change"] .view-change-panel {
  align-content: start;
  gap: 8px;
}

body.workstation-feature-mode[data-active-feature="view-change"] .view-orbit-card {
  grid-template-columns: 72px minmax(0, 1fr);
  padding: 8px;
}

body.workstation-feature-mode[data-active-feature="view-change"] .view-orbit-sphere {
  width: 68px;
  height: 68px;
}

body.workstation-feature-mode[data-active-feature="view-change"] .view-orbit-subject {
  width: 34px;
  height: 34px;
}

body.workstation-feature-mode[data-active-feature="view-change"] .view-preset-button {
  min-height: 40px;
  padding: 7px 8px;
}

body.workstation-feature-mode[data-active-feature="view-change"] .view-preset-button small,
body.workstation-feature-mode[data-active-feature="view-change"] .view-orbit-card small {
  font-size: 10px;
}

body.workstation-feature-mode[data-active-feature="view-change"] .view-angle-controls {
  gap: 7px;
}

body.workstation-feature-mode[data-active-feature="view-change"] .view-angle-row {
  grid-template-columns: 58px minmax(0, 1fr) 42px;
  gap: 7px;
  font-size: 12px;
}

body.workstation-feature-mode[data-active-feature="view-change"] .view-reset-button {
  min-height: 34px;
}

.view-subject-toggle {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 8px;
  border: 1px solid rgba(123, 97, 255, 0.15);
  border-radius: 16px;
  background: linear-gradient(180deg, #fbfaff, #ffffff);
}

.view-subject-button,
.view-preset-button {
  border: 1px solid var(--line);
  border-radius: 12px;
  color: #30384d;
  background: #fff;
  font-weight: 525;
}

.view-subject-button {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  border-color: rgba(123, 97, 255, 0.25);
  color: #4f46c8;
  font-size: 15px;
  box-shadow: 0 8px 18px rgba(123, 97, 255, 0.08);
}

.view-subject-button .lucide {
  width: 18px;
  height: 18px;
}

.view-subject-button.selected {
  border-color: transparent;
  color: #fff;
  background: linear-gradient(135deg, #7568ff, #5f8cff);
  box-shadow: 0 12px 24px rgba(95, 104, 255, 0.22);
}

.view-preset-button.selected {
  border-color: rgba(123, 97, 255, 0.46);
  color: #4b3dce;
  background: #f8f6ff;
  box-shadow: inset 0 0 0 1px rgba(123, 97, 255, 0.1);
}

.view-preset-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.view-preset-button {
  display: grid;
  gap: 4px;
  min-height: 48px;
  padding: 8px 10px;
  font-size: 13px;
  text-align: left;
}

.view-preset-button strong {
  font-size: 13px;
  line-height: 1.1;
}

.view-preset-button small {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.view-orbit-card {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 10px;
  border: 1px solid #eceaf7;
  border-radius: 14px;
  background: #fbfbff;
}

.view-orbit-card small {
  color: #626981;
  font-size: 12px;
  font-weight: 525;
  line-height: 1.45;
}

.view-orbit-sphere {
  position: relative;
  display: grid;
  place-items: center;
  width: 88px;
  height: 88px;
  overflow: hidden;
  border: 1px solid #d9d7e8;
  border-radius: 999px;
  background:
    radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.95), rgba(241, 240, 248, 0.82) 58%, rgba(217, 216, 230, 0.78)),
    repeating-linear-gradient(0deg, transparent 0 17px, rgba(110, 112, 130, 0.18) 18px 19px),
    repeating-linear-gradient(90deg, transparent 0 17px, rgba(110, 112, 130, 0.12) 18px 19px);
}

.view-orbit-sphere::before,
.view-orbit-sphere::after,
.view-orbit-line {
  content: "";
  position: absolute;
  border: 1px solid rgba(95, 99, 118, 0.24);
  border-radius: 999px;
  pointer-events: none;
}

.view-orbit-sphere::before {
  inset: 10px 3px;
}

.view-orbit-sphere::after {
  inset: 3px 17px;
}

.view-orbit-line.horizontal {
  left: 4px;
  right: 4px;
  top: 50%;
  height: 20px;
  transform: translateY(-50%);
}

.view-orbit-line.vertical {
  top: 4px;
  bottom: 4px;
  left: 50%;
  width: 20px;
  transform: translateX(-50%);
}

.view-orbit-subject {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  transform: perspective(160px) rotateX(var(--view-rotate-x, 0deg)) rotateY(var(--view-rotate-y, 0deg));
  transform-style: preserve-3d;
  transition: transform 0.18s ease;
}

.view-orbit-subject img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 8px 18px rgba(20, 24, 45, 0.18);
}

.view-angle-controls {
  display: grid;
  gap: 10px;
}

.view-angle-row {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) 48px;
  gap: 10px;
  align-items: center;
  color: #495066;
  font-size: 13px;
  font-weight: 525;
}

.view-angle-row input[type="range"] {
  width: 100%;
}

.view-angle-row output {
  color: #1f2333;
  text-align: right;
  font-weight: 525;
}

.view-reset-button {
  min-height: 38px;
  justify-content: center;
}

.check-list {
  display: grid;
  gap: 10px;
}

.check-list label {
  display: flex;
  gap: 9px;
  align-items: center;
  color: #30384d;
  font-size: 13px;
  font-weight: 525;
}

.swatch-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px;
}

.swatch-button {
  display: grid;
  gap: 4px;
  place-items: center;
  min-height: 48px;
  padding: 5px 2px;
  color: #3d4558;
  font-size: 10px;
  font-weight: 525;
}

.swatch-button::before {
  content: "";
  width: 22px;
  height: 22px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 999px;
  background: var(--swatch);
}

body.feature-focus-mode .swatch-grid {
  gap: 6px;
}

body.feature-focus-mode .swatch-button {
  min-height: 42px;
  padding: 5px 2px;
  border-radius: 11px;
  font-size: 10px;
  gap: 3px;
  line-height: 1.12;
}

body.feature-focus-mode .swatch-button::before {
  width: 20px;
  height: 20px;
}

body[data-active-feature="colors"] .settings-card,
body[data-active-feature="colors"] .dynamic-settings {
  gap: 9px;
}

body[data-active-feature="repair"] .extra-prompt-box {
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
}

body[data-active-feature="repair"] .extra-prompt-box textarea {
  height: 228px;
  min-height: 228px;
  max-height: 228px;
  padding: 16px;
  font-size: 15px;
  line-height: 1.55;
}

body[data-active-feature="free-generate"] .extra-prompt-box {
  display: none;
}

body[data-active-feature="free-generate"] .preview-empty,
body[data-active-feature="free-generate"] .preview-empty-visual,
body[data-active-feature="free-generate"] .preview-empty-actions {
  display: none !important;
}

body[data-active-feature="wrinkle"] .extra-prompt-box {
  display: none !important;
}

body[data-active-feature="xiaohongshu"] .generation-resolution-section,
body[data-active-feature="xiaohongshu"] .inline-model-section,
body[data-active-feature="xiaohongshu"] .extra-prompt-box {
  display: none !important;
}

body[data-active-feature="xiaohongshu"] .print-compact-select {
  display: none !important;
}

body[data-active-feature="xiaohongshu"] .library-select-row,
body[data-active-feature="xiaohongshu"] #upload-example-button,
body[data-active-feature="xiaohongshu"] .wrinkle-strength-box {
  display: none !important;
}

body[data-active-feature="xiaohongshu"] .generate-count-box {
  grid-template-columns: 1fr !important;
}

body[data-active-feature="xiaohongshu"] .generate-count-section {
  width: 100%;
}

body[data-active-feature="xiaohongshu"] .generate-count-options {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100%;
}

body[data-active-feature="xiaohongshu"] .count-option {
  width: 100%;
  min-height: 48px;
  font-size: 16px;
}

body[data-active-feature="print-extract"] .settings-bottom-area,
body[data-active-feature="wrinkle"] .settings-bottom-area {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

body[data-active-feature="print-extract"] .generate-count-box,
body[data-active-feature="print-extract"] .generate-action-row,
body[data-active-feature="wrinkle"] .generate-count-box,
body[data-active-feature="wrinkle"] .generate-action-row {
  display: contents;
}

body[data-active-feature="print-extract"] .generate-count-section,
body[data-active-feature="print-extract"] .generation-resolution-section,
body[data-active-feature="print-extract"] .inline-model-section,
body[data-active-feature="wrinkle"] .generate-count-section,
body[data-active-feature="wrinkle"] .generation-resolution-section,
body[data-active-feature="wrinkle"] .inline-model-section {
  min-width: 0;
}

body[data-active-feature="print-extract"] .inline-model-section,
body[data-active-feature="wrinkle"] .inline-model-section {
  grid-column: 1;
  grid-row: 1;
}

body[data-active-feature="print-extract"] .generate-count-section,
body[data-active-feature="wrinkle"] .generate-count-section {
  grid-column: 2;
  grid-row: 1;
}

body[data-active-feature="print-extract"] .generation-resolution-section,
body[data-active-feature="wrinkle"] .generation-resolution-section {
  position: relative;
  grid-column: 3;
  grid-row: 1;
  overflow: visible !important;
}

body[data-active-feature="print-extract"] .inline-model-section summary,
body[data-active-feature="wrinkle"] .inline-model-section summary {
  position: relative;
  grid-template-columns: 28px auto minmax(0, 1fr);
  grid-template-rows: auto;
  column-gap: 7px;
  min-height: 56px;
  padding: 8px 9px;
  border-radius: 16px;
}

body[data-active-feature="print-extract"] .inline-model-section summary .lucide,
body[data-active-feature="print-extract"] .print-compact-select summary .lucide,
body[data-active-feature="wrinkle"] .inline-model-section summary .lucide,
body[data-active-feature="wrinkle"] .print-compact-select summary .lucide {
  grid-row: 1;
  align-self: center;
  width: 24px;
  height: 24px;
  padding: 5px;
  border-radius: 9px;
  color: #7162e8;
  background: rgba(123, 97, 255, 0.1);
  stroke-width: 2.35;
}

body[data-active-feature="print-extract"] .inline-model-section summary span,
body[data-active-feature="wrinkle"] .inline-model-section summary span {
  font-size: 13px;
  align-self: center;
}

body[data-active-feature="print-extract"] .inline-model-section summary strong,
body[data-active-feature="wrinkle"] .inline-model-section summary strong {
  font-size: 12px;
  color: #5f55c8;
  align-self: center;
}

body[data-active-feature="print-extract"] .inline-model-section summary small,
body[data-active-feature="print-extract"] .print-compact-select summary small,
body[data-active-feature="wrinkle"] .inline-model-section summary small,
body[data-active-feature="wrinkle"] .print-compact-select summary small {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 8px);
  z-index: 30;
  width: max-content;
  max-width: 240px;
  padding: 7px 9px;
  border: 1px solid rgba(36, 42, 62, 0.08);
  border-radius: 10px;
  color: #fff;
  background: rgba(36, 42, 62, 0.92);
  box-shadow: 0 14px 28px rgba(36, 42, 62, 0.16);
  font-size: 11.5px;
  font-weight: 525;
  line-height: 1.3;
  white-space: normal;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 4px);
  transition: opacity 0.14s ease, transform 0.14s ease;
}

body[data-active-feature="print-extract"] .inline-model-section summary:hover small,
body[data-active-feature="print-extract"] .inline-model-section summary:focus-visible small,
body[data-active-feature="print-extract"] .print-compact-select summary:hover small,
body[data-active-feature="print-extract"] .print-compact-select summary:focus-visible small,
body[data-active-feature="wrinkle"] .inline-model-section summary:hover small,
body[data-active-feature="wrinkle"] .inline-model-section summary:focus-visible small,
body[data-active-feature="wrinkle"] .print-compact-select summary:hover small,
body[data-active-feature="wrinkle"] .print-compact-select summary:focus-visible small {
  opacity: 1;
  transform: translate(-50%, 0);
}

body[data-active-feature="print-extract"] .generate-count-section,
body[data-active-feature="print-extract"] .generation-resolution-section,
body[data-active-feature="wrinkle"] .generate-count-section,
body[data-active-feature="wrinkle"] .generation-resolution-section {
  padding: 0;
  border: 0;
  background: transparent;
}

body[data-active-feature="print-extract"] .generate-count-label,
body[data-active-feature="print-extract"] .generate-count-options,
body[data-active-feature="print-extract"] .generation-resolution-options,
body[data-active-feature="wrinkle"] .generate-count-label,
body[data-active-feature="wrinkle"] .generate-count-options,
body[data-active-feature="wrinkle"] .generation-resolution-options {
  display: none !important;
}

body[data-active-feature="print-extract"] .print-compact-select,
body[data-active-feature="wrinkle"] .print-compact-select {
  position: relative;
  min-width: 0;
  border: 1px solid rgba(123, 97, 255, 0.16);
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff 0%, #faf9ff 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.85), 0 8px 18px rgba(66, 57, 132, 0.06);
}

body[data-active-feature="print-extract"] .print-compact-select summary,
body[data-active-feature="wrinkle"] .print-compact-select summary {
  position: relative;
  display: grid;
  grid-template-columns: 28px auto minmax(0, 1fr);
  grid-template-rows: auto;
  align-content: center;
  justify-items: start;
  gap: 2px 7px;
  min-height: 56px;
  padding: 8px 11px;
  text-align: left;
  cursor: pointer;
  list-style: none;
}

body[data-active-feature="print-extract"] .print-compact-select summary::-webkit-details-marker,
body[data-active-feature="wrinkle"] .print-compact-select summary::-webkit-details-marker {
  display: none;
}

body[data-active-feature="print-extract"] .print-compact-select summary span,
body[data-active-feature="wrinkle"] .print-compact-select summary span {
  color: #8c7dff;
  font-size: 14px;
  font-weight: 525;
  align-self: center;
}

body[data-active-feature="print-extract"] .print-compact-select summary strong,
body[data-active-feature="wrinkle"] .print-compact-select summary strong {
  overflow: hidden;
  color: #252b3c;
  font-size: 13px;
  font-weight: 525;
  line-height: 1.18;
  text-overflow: ellipsis;
  white-space: nowrap;
  align-self: center;
}

body[data-active-feature="print-extract"] .print-compact-select:hover,
body[data-active-feature="print-extract"] .print-compact-select[open],
body[data-active-feature="wrinkle"] .print-compact-select:hover,
body[data-active-feature="wrinkle"] .print-compact-select[open] {
  border-color: rgba(123, 97, 255, 0.38);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.9), 0 12px 24px rgba(92, 76, 180, 0.1);
}

body[data-active-feature="print-extract"] .print-compact-menu,
body[data-active-feature="wrinkle"] .print-compact-menu {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(100% + 8px);
  z-index: 21;
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(123, 97, 255, 0.16);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 38px rgba(36, 39, 64, 0.16);
}

body[data-active-feature="print-extract"] .print-compact-menu button,
body[data-active-feature="wrinkle"] .print-compact-menu button {
  min-height: 38px;
  border: 1px solid #ebe9f7;
  border-radius: 12px;
  color: #353b50;
  background: #fbfbff;
  font-size: 13px;
  font-weight: 525;
}

body[data-active-feature="print-extract"] .print-compact-menu button:hover,
body[data-active-feature="wrinkle"] .print-compact-menu button:hover {
  border-color: rgba(123, 97, 255, 0.36);
  background: #f6f3ff;
}

body[data-active-feature="print-extract"] .print-compact-menu button.selected,
body[data-active-feature="wrinkle"] .print-compact-menu button.selected {
  border-color: transparent;
  color: #fff;
  background: linear-gradient(135deg, #765cff, #8f72ff);
  box-shadow: 0 10px 20px rgba(123, 97, 255, 0.2);
}

body[data-active-feature="print-extract"] .print-resolution-bubble,
body[data-active-feature="wrinkle"] .print-resolution-bubble {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 10px);
  z-index: 80;
  width: max-content;
  max-width: 260px;
  padding: 8px 10px;
  border: 1px solid rgba(123, 97, 255, 0.16);
  border-radius: 12px;
  color: #403a5f;
  background: #fff;
  box-shadow: 0 16px 34px rgba(44, 38, 92, 0.16);
  font-size: 12px;
  font-weight: 525;
  line-height: 1.35;
  transform: translateX(-50%);
}

body[data-active-feature="print-extract"] .print-resolution-bubble[hidden],
body[data-active-feature="wrinkle"] .print-resolution-bubble[hidden] {
  display: none;
}

body[data-active-feature="print-extract"] .print-resolution-bubble::after,
body[data-active-feature="wrinkle"] .print-resolution-bubble::after {
  position: absolute;
  left: 50%;
  top: 100%;
  content: "";
  width: 9px;
  height: 9px;
  border-right: 1px solid rgba(123, 97, 255, 0.16);
  border-bottom: 1px solid rgba(123, 97, 255, 0.16);
  background: #fff;
  transform: translate(-50%, -5px) rotate(45deg);
}

body[data-active-feature="print-extract"] .inline-model-section summary,
body[data-active-feature="print-extract"] .print-compact-select summary,
body[data-active-feature="wrinkle"] .inline-model-section summary,
body[data-active-feature="wrinkle"] .print-compact-select summary {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  align-content: center !important;
  justify-items: start !important;
  gap: 2px 9px !important;
  min-height: 58px !important;
  padding: 8px 11px !important;
  color: #30384d !important;
  text-align: left !important;
  font-family: inherit !important;
}

body[data-active-feature="print-extract"] .inline-model-section summary .lucide,
body[data-active-feature="print-extract"] .print-compact-select summary .lucide,
body[data-active-feature="wrinkle"] .inline-model-section summary .lucide,
body[data-active-feature="wrinkle"] .print-compact-select summary .lucide {
  grid-row: 1 / 3 !important;
  width: 26px !important;
  height: 26px !important;
  padding: 5px !important;
  border-radius: 10px !important;
  color: #7162e8 !important;
  background: rgba(123, 97, 255, 0.1) !important;
  stroke-width: 2.35 !important;
}

body[data-active-feature="print-extract"] .inline-model-section summary span,
body[data-active-feature="print-extract"] .print-compact-select summary span,
body[data-active-feature="wrinkle"] .inline-model-section summary span,
body[data-active-feature="wrinkle"] .print-compact-select summary span {
  grid-column: 2 !important;
  grid-row: 1 !important;
  color: #30384d !important;
  font-size: 13px !important;
  font-weight: 525 !important;
  line-height: 1.15 !important;
}

body[data-active-feature="print-extract"] .inline-model-section summary strong,
body[data-active-feature="print-extract"] .print-compact-select summary strong,
body[data-active-feature="wrinkle"] .inline-model-section summary strong,
body[data-active-feature="wrinkle"] .print-compact-select summary strong {
  grid-column: 2 !important;
  grid-row: 2 !important;
  color: #7162e8 !important;
  font-size: 12px !important;
  font-weight: 525 !important;
  line-height: 1.15 !important;
}

body[data-active-feature="print-extract"] .inline-model-section summary::after,
body[data-active-feature="print-extract"] .print-compact-select summary::after,
body[data-active-feature="wrinkle"] .inline-model-section summary::after,
body[data-active-feature="wrinkle"] .print-compact-select summary::after {
  grid-column: 3 !important;
  grid-row: 1 / 3 !important;
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid rgba(113, 98, 232, 0.52);
  border-bottom: 2px solid rgba(113, 98, 232, 0.52);
  transform: rotate(45deg) translateY(-2px);
}

body[data-active-feature="print-extract"] .create-button.full,
body[data-active-feature="wrinkle"] .create-button.full {
  grid-column: 1 / -1;
  grid-row: 2;
  width: 100%;
}

@media (max-width: 980px) {
  body[data-active-feature="print-extract"] .settings-bottom-area,
  body[data-active-feature="wrinkle"] .settings-bottom-area {
    grid-template-columns: 1fr;
  }

  body[data-active-feature="print-extract"] .generate-count-box,
  body[data-active-feature="print-extract"] .generate-action-row,
  body[data-active-feature="wrinkle"] .generate-count-box,
  body[data-active-feature="wrinkle"] .generate-action-row {
    display: grid;
  }
}

.xhs-settings-panel {
  display: grid;
  gap: 12px;
}

.xhs-option-block {
  display: grid;
  gap: 10px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.xhs-block-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
}

.xhs-block-head span {
  color: #30384d;
  font-size: 16px;
  font-weight: 525;
}

.xhs-block-head small {
  color: #969bad;
  font-size: 12px;
  font-weight: 525;
}

.xhs-requirement-wrap {
  position: relative;
}

.xhs-requirement-input {
  width: 100%;
  height: 280px;
  min-height: 280px;
  max-height: 280px;
  resize: none;
  padding: 16px 17px 58px;
  border: 1px solid rgba(214, 210, 236, 0.96);
  border-radius: 14px;
  color: #20263a;
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 10px 22px rgba(105, 91, 164, 0.055);
  font: inherit;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
  outline: 0;
  box-sizing: border-box;
}

.xhs-requirement-input:focus {
  border-color: rgba(109, 85, 238, 0.55);
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08), 0 12px 24px rgba(105, 91, 164, 0.08);
}

.xhs-requirement-wrap .xhs-prompt-optimize-button {
  position: absolute;
  right: 12px;
  bottom: 12px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(109, 85, 238, 0.24);
  border-radius: 999px;
  color: #5b4be8;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 10px 20px rgba(91, 73, 230, 0.12);
  font-size: 11px;
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.xhs-prompt-optimize-button .lucide {
  width: 13px;
  height: 13px;
  stroke-width: 2.2;
}

.xhs-prompt-optimize-button span {
  font-weight: 450 !important;
  -webkit-font-smoothing: antialiased;
}

.xhs-prompt-optimize-button:hover:not(:disabled) {
  border-color: rgba(91, 73, 230, 0.5);
  color: #ffffff;
  background: #5b4be8;
  box-shadow: 0 12px 24px rgba(91, 73, 230, 0.2);
  transform: translateY(-1px);
}

.xhs-prompt-optimize-button:disabled {
  color: #aaa6be;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: none;
  cursor: not-allowed;
}

.xhs-prompt-optimize-button.is-busy {
  color: #ffffff;
  background: #5b4be8;
  cursor: wait;
}

.xhs-simple-tip {
  margin: 0;
  color: #8d92a5;
  font-size: 12px;
  font-weight: 525;
  line-height: 1.55;
}

.xhs-choice-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.xhs-choice-grid .choice-button {
  display: grid;
  gap: 4px;
  min-height: 58px;
  justify-items: start;
  align-content: center;
  padding: 10px 12px;
  border-color: #ece9f8;
  border-radius: 14px;
  color: #30384d;
  background: #fff;
  text-align: left;
  box-shadow: none;
}

.xhs-choice-grid .choice-button strong {
  font-size: 14px;
  font-weight: 525;
}

.xhs-choice-grid .choice-button small {
  color: #9297aa;
  font-size: 11.5px;
  font-weight: 525;
}

.xhs-choice-grid .choice-button.selected {
  border-color: rgba(123, 97, 255, 0.65);
  color: #2b245f;
  background: linear-gradient(180deg, #ffffff, #f7f4ff);
  box-shadow: inset 0 0 0 1px rgba(123, 97, 255, 0.14);
}

.xhs-choice-grid .choice-button.selected small {
  color: #6f62be;
}

.generate-count-box {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 0;
  border: 0;
  background: transparent;
}

.generate-count-section,
.generation-resolution-section {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.works-panel {
  display: grid;
  gap: 16px;
  padding: 18px 22px 22px;
  scroll-margin-top: 86px;
}

.works-panel-head {
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: flex-start;
}

.works-panel-head span {
  color: var(--purple);
  font-size: 12px;
  font-weight: 525;
}

.works-panel-head h2 {
  margin: 4px 0;
  font-size: 24px;
  line-height: 1.1;
}

.works-panel-head p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  font-weight: 525;
}

.works-retention-notice {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  min-height: 34px;
  padding: 8px 12px;
  border: 1px solid #f2dfb6;
  border-radius: 12px;
  color: #7a5b18;
  background: #fff8e8;
  font-size: 13px;
  font-weight: 525;
}

.works-retention-notice .lucide {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  color: #c68512;
}

.works-toggle {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 14px;
  color: var(--purple);
  font-weight: 525;
}

.works-panel-foot {
  display: flex;
  justify-content: center;
  padding: 4px 0 0;
}

.works-category-toolbar {
  display: none;
}

.works-category-list {
  display: flex;
  gap: 8px;
  max-width: 100%;
  overflow-x: auto;
  padding: 2px 0 8px;
  scrollbar-width: thin;
}

.works-category-button {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 7px;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid #e3e2ef;
  border-radius: 999px;
  color: #4a5063;
  background: #fff;
  font-size: 12px;
  font-weight: 525;
}

.works-category-button:hover {
  border-color: rgba(123, 97, 255, 0.45);
  color: var(--purple);
  background: #fbf9ff;
}

.works-category-button.selected {
  border-color: var(--purple);
  color: #fff;
  background: var(--purple);
  box-shadow: 0 10px 20px rgba(87, 68, 190, 0.16);
}

.works-category-button small {
  display: grid;
  place-items: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  color: var(--purple);
  background: var(--purple-soft);
  font-size: 11px;
  line-height: 1;
}

.works-category-button.selected small {
  color: var(--purple);
  background: #fff;
}

.works-gallery {
  display: grid;
  grid-template-columns: repeat(10, minmax(118px, 1fr));
  gap: 12px;
  align-items: start;
  min-width: 1280px;
  content-visibility: auto;
  contain-intrinsic-size: 900px;
}

.works-empty {
  grid-column: 1 / -1;
  display: grid;
  place-items: center;
  gap: 7px;
  min-height: 180px;
  border: 1px dashed #dcd9ef;
  border-radius: 14px;
  color: var(--muted);
  background: #fbfbff;
}

.works-empty .lucide {
  width: 34px;
  height: 34px;
  color: var(--purple);
}

.works-empty strong {
  color: #30384d;
  font-size: 16px;
  font-weight: 525;
}

.works-empty small {
  font-size: 13px;
  font-weight: 525;
}

.work-card {
  display: grid;
  gap: 8px;
  min-width: 0;
  height: auto;
  align-self: start;
  overflow: hidden;
  contain: layout paint;
  padding: 8px;
  border: 1px solid #ececf6;
  border-radius: 14px;
  color: #30384d;
  text-align: left;
  background: #fff;
}

.work-card:not(.batch-work),
.project-image-card {
  cursor: zoom-in;
}

.work-card.is-failed,
.project-image-card.is-failed,
.work-detail-card.is-failed,
.work-detail-card.is-failed .work-detail-thumb {
  cursor: not-allowed;
}

.batch-work {
  cursor: pointer;
}

.work-card.selected,
.work-card:hover {
  border-color: rgba(123, 97, 255, 0.5);
  box-shadow: 0 12px 24px rgba(96, 76, 180, 0.12);
}

.work-card.is-failed:hover {
  border-color: #f1d7dc;
  box-shadow: none;
}

.work-thumb {
  position: relative;
  display: block;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: 11px;
  background: #f3f2fb;
}

.work-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  content-visibility: auto;
}

.batch-work-preview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 3px;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.batch-work-preview[data-preview-count="1"] {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
}

.batch-work-preview[data-preview-count="2"] {
  grid-template-rows: minmax(0, 1fr);
}

.batch-work-preview[data-preview-count="3"] .batch-work-preview-item:first-child {
  grid-row: 1 / span 2;
}

.batch-work-preview-item {
  display: block;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  background: #f3f2fb;
}

.batch-work-preview-item img {
  display: block;
  object-fit: cover;
}

.work-card.video-work:not(.is-running):not(.is-failed),
.work-card.video-work:not(.batch-work) {
  cursor: pointer;
}

.video-work-thumb {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}

.video-work-thumb img {
  display: block;
}

.work-card.is-running .work-thumb img {
  filter: saturate(0.92) contrast(0.94) brightness(0.88);
  animation: workImageBreath 2.8s ease-in-out infinite;
}

.work-card.is-failed .work-thumb img,
.project-image-card.is-failed .project-image-thumb img,
.work-detail-card.is-failed .work-detail-thumb img {
  filter: grayscale(0.2) saturate(0.78) brightness(0.72);
}

.work-generating-mask {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 9px;
  padding: 12px;
  color: #fff;
  text-align: center;
  background:
    radial-gradient(circle at 50% 30%, rgba(255, 255, 255, 0.2), transparent 34%),
    linear-gradient(180deg, rgba(22, 24, 36, 0.5), rgba(22, 24, 36, 0.76));
  backdrop-filter: blur(3px);
}

.work-running-card {
  align-content: center;
  grid-template-rows: none;
  gap: 9px;
  padding: 12px 10px 10px;
  color: #2f3748;
  background:
    radial-gradient(circle at 50% 20%, rgba(255, 255, 255, 0.95), transparent 30%),
    linear-gradient(145deg, rgba(247, 248, 252, 0.94), rgba(237, 241, 248, 0.92) 48%, rgba(249, 250, 252, 0.94));
  box-shadow: inset 0 0 0 1px rgba(222, 228, 240, 0.9);
  backdrop-filter: blur(5px);
}

.work-running-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg, transparent 0%, rgba(255, 255, 255, 0.7) 43%, transparent 62%);
  background-size: 220% 100%;
  animation: wrinkleRunningShine 1.8s ease-in-out infinite;
  pointer-events: none;
}

.work-running-card .wrinkle-running-aura {
  left: 50%;
  top: 20%;
  width: 58px;
  height: 58px;
}

.work-running-card .wrinkle-running-core {
  grid-template-columns: none;
  grid-template-rows: none;
  justify-self: center;
  justify-items: center;
  gap: 4px;
  text-align: center;
}

.work-running-card .wrinkle-running-spinner {
  grid-row: auto;
  grid-column: auto;
  width: 32px;
  height: 25px;
}

.work-running-card .wrinkle-running-spinner i {
  width: 22px;
  height: 22px;
  border-width: 2px;
}

.work-running-card .wrinkle-running-core strong,
.work-running-card > strong {
  grid-column: auto;
  position: relative;
  z-index: 1;
  color: #30384d;
  font-size: 13px;
  font-weight: 620;
}

.work-running-card .wrinkle-running-core small,
.work-running-card > small {
  grid-column: auto;
  position: relative;
  z-index: 1;
  max-width: 100%;
  color: #667085;
  font-size: 10px;
  font-weight: 480;
  line-height: 1.35;
}

.work-running-card .work-runner-counts {
  position: relative;
  z-index: 1;
  min-height: auto;
  padding: 3px 7px;
  color: #556174;
  background: rgba(255, 255, 255, 0.68);
  border: 1px solid rgba(220, 226, 238, 0.9);
}

.work-running-card .wrinkle-running-info {
  width: 100%;
  padding: 5px 7px;
  margin-top: 2px;
}

.work-running-card .wrinkle-running-info span {
  font-size: 10px;
}

.work-running-card .wrinkle-running-progress {
  width: 100%;
  grid-template-columns: minmax(0, 1fr);
  gap: 3px;
  justify-items: center;
}

.work-running-card .wrinkle-running-progress span {
  width: 100%;
}

.work-running-card .wrinkle-running-progress em {
  display: block;
  justify-self: center;
  padding: 0;
  border-radius: 0;
  color: #667085;
  background: transparent;
  font-size: 10px;
  line-height: 1;
  text-align: center;
}

.work-running-card .work-compensation-badge {
  width: 100%;
  gap: 2px;
  padding: 0 4px;
  border: 0;
  border-radius: 0;
  align-self: auto;
  margin-top: 7px;
  text-align: left;
  background: transparent;
}

.work-running-card .work-compensation-badge b {
  font-size: 10px;
}

.work-running-card .work-compensation-badge span {
  font-size: 10px;
  line-height: 1.25;
}

.work-running-card.small {
  gap: 5px;
  padding: 8px;
}

.work-running-card.small .wrinkle-running-aura {
  top: 28%;
  width: 50px;
  height: 50px;
}

.work-running-card.small .wrinkle-running-spinner {
  width: 28px;
  height: 28px;
}

.work-running-card.small .wrinkle-running-spinner i {
  width: 18px;
  height: 18px;
}

.project-running-panel {
  align-content: center;
  justify-items: stretch;
  gap: 7px;
  padding: 10px;
  border-radius: inherit;
  overflow: hidden;
  pointer-events: none;
}

.project-running-panel .wrinkle-running-aura {
  top: 18%;
  width: 52px;
  height: 52px;
}

.project-running-panel .wrinkle-running-core {
  gap: 5px;
}

.project-running-panel .wrinkle-running-spinner {
  width: 30px;
  height: 30px;
}

.project-running-panel .wrinkle-running-spinner i {
  width: 20px;
  height: 20px;
  border-width: 2px;
}

.project-running-panel .wrinkle-running-core strong {
  font-size: 13px;
}

.project-running-panel .wrinkle-running-core small,
.project-running-panel .wrinkle-running-info span,
.project-running-panel .wrinkle-compensation-badge span,
.project-running-panel .wrinkle-compensation-badge b {
  display: block;
  white-space: normal;
}

.project-running-panel .wrinkle-running-core small {
  max-width: 100%;
  font-size: 10px;
  line-height: 1.28;
}

.project-running-panel .wrinkle-running-info {
  gap: 3px;
  width: 100%;
  padding: 5px 7px;
}

.project-running-panel .wrinkle-running-info span {
  overflow: hidden;
  font-size: 10px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-running-panel .wrinkle-running-progress {
  width: 100%;
}

.project-running-panel .work-compensation-badge {
  width: 100%;
  margin-top: 0;
  padding: 0 2px;
}

.project-running-panel .work-compensation-badge b,
.project-running-panel .work-compensation-badge span {
  font-size: 10px;
}

.project-running-panel.compact {
  gap: 5px;
  padding: 8px;
}

.project-running-panel.compact .wrinkle-running-core small {
  display: none;
}

.project-running-panel.compact .wrinkle-running-info {
  padding: 4px 6px;
}

.project-running-panel.compact .wrinkle-running-info span {
  font-size: 9.5px;
}

.project-running-panel.compact .work-compensation-badge {
  display: none;
}

.project-image-card .project-running-panel strong,
.project-image-card .project-running-panel small,
.work-detail-card .project-running-panel strong,
.work-detail-card .project-running-panel small {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}

.work-runner-head {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
}

.work-runner-head strong {
  font-size: 15px;
  font-weight: 525;
  letter-spacing: 0;
}

.work-runner-orbit {
  position: relative;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.17);
}

.work-runner-orbit::before {
  content: "";
  position: absolute;
  inset: -3px;
  border: 2px solid rgba(255, 255, 255, 0.28);
  border-top-color: #fff;
  border-radius: inherit;
  animation: spin 1.1s linear infinite;
}

.work-runner-orbit .lucide {
  width: 16px;
  height: 16px;
}

.work-runner-counts {
  min-height: 24px;
  padding: 4px 9px;
  border-radius: 999px;
  color: #fff;
  background: rgba(255, 255, 255, 0.16);
  font-size: 11px;
  line-height: 1.2;
  font-weight: 525;
}

.work-runner-bar {
  position: relative;
  display: grid;
  align-items: center;
  width: min(118px, 82%);
  height: 16px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.22);
}

.work-runner-bar i {
  grid-area: 1 / 1;
  display: block;
  height: 100%;
  min-width: 10px;
  border-radius: inherit;
  background: linear-gradient(90deg, #ffffff, #bff4ee);
  box-shadow: 0 0 14px rgba(255, 255, 255, 0.55);
  transition: width 0.35s ease;
}

.work-runner-bar em {
  grid-area: 1 / 1;
  position: relative;
  z-index: 1;
  color: #fff;
  font-size: 10px;
  font-style: normal;
  font-weight: 720;
  line-height: 1;
  text-align: center;
  text-shadow: 0 1px 4px rgba(40, 30, 80, 0.28);
}

.work-generating-mask p {
  margin: 0;
  font-size: 11px;
  line-height: 1.35;
  font-weight: 525;
}

.work-generating-mask small {
  display: block;
  color: rgba(255, 255, 255, 0.88);
  font-size: 10px;
  line-height: 1.35;
  font-weight: 525;
}

.work-failed-mask {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 8px;
  padding: 12px;
  color: #fff;
  text-align: center;
  background: linear-gradient(180deg, rgba(42, 20, 28, 0.42), rgba(42, 20, 28, 0.76));
  pointer-events: none;
}

.work-failed-mask.small {
  gap: 6px;
  padding: 8px;
}

.work-failed-mask strong {
  font-size: 14px;
  line-height: 1.2;
  font-weight: 525;
}

.work-failed-mask.small strong {
  font-size: 12px;
}

.work-failed-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 2px solid rgba(255, 255, 255, 0.86);
  border-radius: 999px;
  color: #fff;
  background: rgba(223, 63, 85, 0.9);
  font-size: 21px;
  line-height: 1;
  font-weight: 525;
}

.work-failed-mask.small .work-failed-icon {
  width: 28px;
  height: 28px;
  font-size: 17px;
}

@keyframes workMaskSweep {
  to {
    background-position: 0 0, -220% 0;
  }
}

@keyframes workImageBreath {
  50% {
    transform: scale(1.025);
  }
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

.work-thumb em {
  position: absolute;
  right: 7px;
  top: 7px;
  z-index: 5;
  min-height: 22px;
  padding: 3px 7px;
  border-radius: 999px;
  color: #fff;
  background: rgba(32, 35, 52, 0.72);
  font-size: 11px;
  font-style: normal;
  font-weight: 525;
}

.work-delete-action {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 7;
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 0;
  border-radius: 999px;
  color: #fff;
  background: rgba(20, 23, 34, 0.78);
  box-shadow: 0 10px 20px rgba(12, 15, 24, 0.22);
  cursor: pointer;
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity 0.18s ease, transform 0.18s ease, background 0.18s ease;
}

.work-delete-action .lucide {
  width: 15px;
  height: 15px;
}

.work-card:hover .work-delete-action,
.work-detail-card:hover .work-delete-action,
.work-delete-action:focus-visible {
  opacity: 1;
  transform: translateY(0);
}

.work-delete-action:hover {
  background: #df3f55;
}

.project-open-action {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 6;
  display: inline-flex;
  gap: 6px;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0 13px;
  border-radius: 12px;
  color: #fff;
  background: rgba(32, 35, 52, 0.76);
  font-size: 12px;
  font-weight: 525;
  opacity: 0;
  transform: translate(-50%, -44%);
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.project-open-action .lucide {
  width: 16px;
  height: 16px;
}

.batch-work:hover .project-open-action,
.batch-work.selected .project-open-action {
  opacity: 1;
  transform: translate(-50%, -50%);
}

.work-meta {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.work-meta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.work-meta strong,
.work-meta em,
.work-meta small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.work-meta strong {
  font-size: 12px;
  font-weight: 525;
}

.work-meta em {
  justify-self: start;
  max-width: 100%;
  padding: 2px 7px;
  border-radius: 999px;
  color: var(--purple);
  background: var(--purple-soft);
  font-size: 10px;
  font-style: normal;
  font-weight: 525;
}

.work-meta small {
  flex: 0 0 auto;
  padding: 2px 7px;
  border-radius: 999px;
  color: var(--muted);
  background: #f4f5f9;
  font-size: 11px;
  font-weight: 525;
}

.work-meta-error {
  color: #b33b4d !important;
  font-size: 11px;
  line-height: 1.35;
  font-weight: 525;
  white-space: normal !important;
}

.work-progress {
  position: relative;
  display: grid;
  align-items: center;
  height: 14px;
  overflow: hidden;
  border-radius: 999px;
  background: #efedf8;
}

.work-progress i {
  grid-area: 1 / 1;
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--purple), #41c7ee);
  transition: width 0.35s ease;
}

.work-progress em {
  grid-area: 1 / 1;
  position: relative;
  z-index: 1;
  color: #fff;
  font-size: 10px;
  font-style: normal;
  font-weight: 720;
  line-height: 1;
  text-align: center;
  text-shadow: 0 1px 4px rgba(40, 30, 80, 0.28);
}

.project-inline {
  grid-column: 1 / -1;
  display: grid;
  gap: 12px;
  margin: 2px 0 4px;
  padding: 14px;
  border: 1px solid #ede9ff;
  border-radius: 16px;
  background: #fbfaff;
}

.project-inline-head {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
}

.project-inline-head strong {
  color: #30384d;
  font-size: 16px;
  font-weight: 525;
}

.project-inline-head small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 525;
}

.project-inline-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 14px;
  align-items: start;
}

.project-image-card {
  display: grid;
  gap: 7px;
  min-width: 0;
  height: auto;
  align-self: start;
  overflow: hidden;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #fff;
}

.project-image-thumb {
  position: relative;
  display: block;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: 10px;
  background: #f3f2fb;
}

.project-image-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.project-image-card.is-running .project-image-thumb img {
  filter: saturate(0.92) contrast(0.94) brightness(0.88);
  animation: workImageBreath 2.8s ease-in-out infinite;
}

.work-generating-mask.small {
  gap: 5px;
  padding: 8px;
}

.work-generating-mask.small .work-runner-orbit {
  width: 26px;
  height: 26px;
}

.work-generating-mask.small .work-runner-orbit .lucide {
  width: 13px;
  height: 13px;
}

.work-generating-mask.small .work-runner-head strong {
  font-size: 12px;
}

.project-image-card strong,
.project-image-card small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-image-card strong {
  color: #30384d;
  font-size: 12px;
  font-weight: 525;
}

.project-image-card small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 525;
}

.works-detail {
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 75;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 16px;
  width: min(1680px, 82vw);
  height: min(90vh, 980px);
  overflow: hidden;
  padding: 20px;
  border: 1px solid #ede9ff;
  border-radius: 20px;
  background: #fbfaff;
  box-shadow: 0 28px 80px rgba(20, 22, 40, 0.28);
  transform: translate(-50%, -50%);
}

.works-detail[hidden] {
  display: none;
}

.works-detail-head {
  position: relative;
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
}

.works-detail-actions {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  flex: 0 0 auto;
}

.works-project-download {
  min-height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 525;
  white-space: nowrap;
}

.works-project-download .lucide {
  width: 15px;
  height: 15px;
}

.works-project-download:disabled {
  opacity: 0.46;
  cursor: not-allowed;
}

.works-detail-head strong,
.works-detail-head small {
  display: block;
}

.works-detail-head strong {
  font-size: 17px;
  font-weight: 525;
}

.works-detail-head small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 525;
}

.works-detail-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  min-height: 0;
  overflow: auto;
  align-content: start;
  padding-right: 4px;
}

.work-detail-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  align-items: start;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
}

.work-detail-card img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  border-radius: 10px;
  object-fit: contain;
}

.work-detail-thumb {
  position: relative;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  width: 100%;
  aspect-ratio: 3 / 4;
  height: auto;
  min-height: 0;
  overflow: hidden;
  padding: 0;
  border-radius: 11px;
  background: linear-gradient(180deg, #f7f8fc, #f1f3f8);
}

.work-detail-thumb:disabled {
  border: 0;
  cursor: not-allowed;
}

.work-detail-thumb img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  border-radius: 0;
  object-fit: cover !important;
  object-position: center center;
}

.work-detail-error {
  display: grid;
  gap: 4px;
  padding: 8px 10px;
  border: 1px solid #f1d7dc;
  border-radius: 11px;
  background: #fff7f8;
}

.work-detail-error strong {
  color: #b33b4d;
  font-size: 12px;
  font-weight: 525;
}

.work-detail-error small {
  color: #8f5964;
  font-size: 11px;
  line-height: 1.45;
  font-weight: 525;
  white-space: pre-wrap;
}

.work-detail-mask {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 6px;
  color: #fff;
  text-align: center;
  background: rgba(24, 23, 38, 0.68);
  font-size: 11px;
  font-weight: 525;
}

.work-detail-card strong,
.work-detail-card small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.work-detail-card strong {
  color: #30384d;
  font-size: 12px;
  font-weight: 525;
}

.work-detail-card small {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 525;
}

@media (max-width: 760px) {
  .works-detail-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .works-detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* 宠物使用场景图：关键决策用信息卡片，动作与场景用紧凑选择器。 */
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-settings,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-settings ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-settings,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-settings {
  display: grid;
  gap: 12px;
}

html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-makeup-try-on"] .beauty-makeup-try-on-settings {
  display: grid;
  gap: 14px;
}

html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-makeup-try-on"] .beauty-makeup-reference-group {
  display: grid;
  gap: 7px;
}

html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-makeup-try-on"] .beauty-makeup-reference-upload {
  min-height: 88px !important;
  border: 1px solid rgba(143, 119, 255, 0.28) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.9) !important;
  box-shadow: 0 8px 24px rgba(71, 52, 148, 0.045) !important;
}

html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-makeup-try-on"] .beauty-makeup-reference-upload:not(.is-filled) {
  grid-template-columns: 42px minmax(0, 1fr) !important;
}

html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-makeup-try-on"] .beauty-makeup-reference-upload:hover,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-makeup-try-on"] .beauty-makeup-reference-upload:focus-visible {
  border-color: rgba(109, 85, 238, 0.58) !important;
  box-shadow: 0 10px 26px rgba(71, 52, 148, 0.09) !important;
}

html[data-theme="dark"][data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-makeup-try-on"] .beauty-makeup-reference-upload {
  border-color: rgba(155, 137, 234, 0.26) !important;
  background: rgba(30, 31, 42, 0.94) !important;
}

@media (max-width: 560px) {
  html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-makeup-try-on"] .beauty-makeup-reference-upload {
    grid-template-columns: 38px minmax(0, 1fr) minmax(64px, 86px) !important;
    min-height: 82px !important;
    padding: 10px !important;
  }
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-selects,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-selects ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-selects,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-selects {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select {
  position: relative;
  min-width: 0;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > summary,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > summary ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select > summary,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > summary {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 7px 12px 7px 9px;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 15px;
  color: #30384d;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(249, 247, 255, 0.98)) padding-box,
    linear-gradient(120deg, rgba(121, 94, 255, 0.48), rgba(157, 136, 255, 0.14), rgba(121, 94, 255, 0.4)) border-box;
  box-shadow: 0 7px 18px rgba(75, 59, 143, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.9);
  cursor: pointer;
  list-style: none;
  transition: box-shadow 180ms ease, background 180ms ease;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > summary::-webkit-details-marker,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > summary::-webkit-details-marker ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select > summary::-webkit-details-marker,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > summary::-webkit-details-marker {
  display: none;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > summary:hover,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > summary:hover,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select > summary:hover,,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > summary:hover,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > summary:focus-visible,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > summary:focus-visible,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select > summary:focus-visible,,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > summary:focus-visible,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select[open] > summary,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select[open] > summary ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select[open] > summary,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select[open] > summary {
  outline: none;
  background:
    linear-gradient(180deg, #ffffff, #f5f1ff) padding-box,
    linear-gradient(120deg, #775dff, #a88cff, #6f59f4) border-box;
  box-shadow: 0 9px 22px rgba(91, 68, 190, 0.15), 0 0 0 3px rgba(116, 91, 244, 0.06);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-icon,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-icon ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-icon,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-icon {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 11px;
  color: #6548e8;
  background: linear-gradient(145deg, #eee9ff, #f8f5ff);
  box-shadow: inset 0 0 0 1px rgba(112, 83, 239, 0.1), 0 4px 10px rgba(91, 65, 184, 0.08);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-icon .lucide,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-icon .lucide ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-icon .lucide,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-icon .lucide {
  width: 17px;
  height: 17px;
  stroke-width: 2;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > small,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > small ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > small,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > small {
  flex: 0 0 auto;
  color: #7c748e;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.25;
  white-space: nowrap;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > small em,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > small em ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > small em,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > small em {
  margin-left: 3px;
  color: #7056e8;
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > strong,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > strong ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > strong,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > strong {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  color: #2f2944;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-hint,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-hint ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-hint,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-hint {
  padding: 4px 7px;
  border: 1px solid rgba(111, 80, 233, 0.12);
  border-radius: 999px;
  color: #6a4fe5;
  background: rgba(237, 232, 255, 0.82);
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select[open] .pet-detail-product-type-hint,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select[open] .pet-detail-product-type-hint ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select[open] .pet-detail-product-type-hint,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select[open] .pet-detail-product-type-hint {
  color: #ffffff;
  background: linear-gradient(135deg, #7558f3, #8b6cff);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > summary::after,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > summary::after ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select > summary::after,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > summary::after {
  content: "";
  width: 7px;
  height: 7px;
  margin-top: -4px;
  border-right: 1.5px solid #766b98;
  border-bottom: 1.5px solid #766b98;
  transform: rotate(45deg);
  transition: transform 160ms ease;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select[open] > summary::after,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select[open] > summary::after ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select[open] > summary::after,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select[open] > summary::after {
  margin-top: 4px;
  transform: rotate(225deg);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2200;
  display: none;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  width: 0;
  max-height: none;
  margin: 0;
  padding: 12px;
  overflow: visible;
  visibility: hidden;
  pointer-events: none;
  border: 1px solid rgba(199, 205, 230, 0.95);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.99);
  box-shadow: 0 16px 36px rgba(58, 47, 112, 0.17);
  box-sizing: border-box;
  overscroll-behavior: contain;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select[open] > .pet-detail-product-type-menu,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select[open] > .pet-detail-product-type-menu ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select[open] > .pet-detail-product-type-menu,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select[open] > .pet-detail-product-type-menu {
  display: grid;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select[open] > .pet-detail-product-type-menu[data-positioned="true"],
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select[open] > .pet-detail-product-type-menu[data-positioned="true"] ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select[open] > .pet-detail-product-type-menu[data-positioned="true"],
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select[open] > .pet-detail-product-type-menu[data-positioned="true"] {
  visibility: visible;
  pointer-events: auto;
  animation: pet-detail-product-menu-in 150ms ease-out both;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-empty-option,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-empty-option ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-empty-option,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-empty-option {
  grid-column: 1 / -1;
  padding: 14px 12px;
  border: 1px dashed rgba(194, 185, 222, 0.9);
  border-radius: 11px;
  color: #81798f;
  background: #fbfaff;
  font-size: 12px;
  line-height: 1.4;
  text-align: center;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button {
  display: flex;
  min-width: 0;
  min-height: 48px;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  padding: 8px 10px 8px 12px;
  border: 1px solid rgba(218, 212, 238, 0.95);
  border-radius: 11px;
  color: #4c465b;
  background: linear-gradient(180deg, #ffffff, #fbfaff);
  box-shadow: 0 3px 9px rgba(55, 46, 91, 0.045);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.3;
  text-align: left;
  transition: border-color 160ms ease, color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button::after,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button::after ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button::after,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button::after {
  content: "";
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  margin-left: auto;
  border: 1.5px solid #d4cde9;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: inset 0 0 0 3px #ffffff;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button:hover,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button:hover,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button:hover,,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button:hover,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button:focus-visible,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button:focus-visible ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button:focus-visible,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button:focus-visible {
  outline: none;
  border-color: rgba(117, 88, 243, 0.5);
  color: #5d42d5;
  background: linear-gradient(180deg, #ffffff, #f5f1ff);
  box-shadow: 0 7px 16px rgba(94, 69, 188, 0.11);
  transform: translateY(-1px);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button.selected,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button.selected ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button.selected,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button.selected {
  border-color: transparent;
  color: #ffffff;
  background: linear-gradient(135deg, #7056e8, #8b70f6);
  box-shadow: 0 8px 18px rgba(104, 77, 214, 0.22);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button.selected::after,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button.selected::after ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button.selected::after,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button.selected::after {
  content: "✓";
  display: grid;
  place-items: center;
  border-color: rgba(255, 255, 255, 0.82);
  color: #6d53df;
  background: #ffffff;
  box-shadow: none;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > summary,
html[data-theme="dark"][data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > summary ,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > summary {
  color: #f3efff;
  background:
    linear-gradient(180deg, rgba(37, 34, 51, 0.99), rgba(30, 28, 43, 0.99)) padding-box,
    linear-gradient(120deg, rgba(147, 124, 255, 0.58), rgba(157, 136, 255, 0.16), rgba(121, 94, 255, 0.44)) border-box;
  box-shadow: 0 9px 22px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > strong,
html[data-theme="dark"][data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > strong ,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > strong {
  color: #f5f2ff;
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > small,
html[data-theme="dark"][data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > small ,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-copy > small {
  color: #aaa3be;
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu,
html[data-theme="dark"][data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu ,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu {
  border-color: rgba(122, 111, 162, 0.46);
  background: rgba(29, 27, 40, 0.99);
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.34);
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button,
html[data-theme="dark"][data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button ,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > .pet-detail-product-type-menu > button {
  border-color: rgba(115, 105, 148, 0.36);
  color: #e9e5f4;
  background: linear-gradient(180deg, #292635, #24212f);
}

@media (max-width: 560px) {
  html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select > summary,
  html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select > summary ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select > summary,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select > summary {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 7px;
    min-height: 54px;
    padding-inline: 8px;
  }

  html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-hint,
  html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-hint ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-hint,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-primary-select .pet-detail-product-type-hint {
    display: none;
  }
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-card,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-card ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-card,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-card {
  position: relative;
  display: grid;
  gap: 12px;
  padding: 13px;
  overflow: visible;
  border: 1px solid rgba(104, 84, 224, 0.2);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(248, 247, 255, 0.96), rgba(255, 255, 255, 0.98));
  box-shadow: 0 10px 28px rgba(69, 53, 145, 0.06);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-heading,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-heading ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-heading,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-heading {
  display: grid;
  gap: 10px;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-heading > div:first-child,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-heading > div:first-child ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-heading > div:first-child,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-heading > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-heading > div:first-child > strong,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-heading > div:first-child > strong ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-heading > div:first-child > strong,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-heading > div:first-child > strong {
  color: #292437;
  font-size: 15px;
  font-weight: 650;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-heading > div:first-child > small,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-heading > div:first-child > small ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-heading > div:first-child > small,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-heading > div:first-child > small {
  color: #9a94aa;
  font-size: 10px;
  line-height: 1.35;
  text-align: right;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-tabs,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-tabs ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-tabs,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  padding: 4px;
  border-radius: 12px;
  background: rgba(235, 231, 249, 0.68);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-tabs button,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-tabs button ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-tabs button,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-tabs button {
  min-height: 36px;
  padding: 7px 10px;
  border: 0;
  border-radius: 9px;
  color: #6c657d;
  background: transparent;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-tabs button.selected,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-tabs button.selected ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-tabs button.selected,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-tabs button.selected {
  color: #ffffff;
  background: linear-gradient(135deg, #7059f2, #5a43dd);
  box-shadow: 0 6px 14px rgba(82, 61, 196, 0.2);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-summary,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-summary ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-summary,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-summary {
  display: flex;
  min-height: 0;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 5px 1px;
  border: 0;
  border-radius: 0;
  color: #91899f;
  background: transparent;
  box-shadow: none;
  text-align: center;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-summary > .lucide,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-summary > .lucide ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-summary > .lucide,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-summary > .lucide {
  display: none;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-summary span,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-summary span ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-summary span,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-summary span {
  display: block;
  min-width: 0;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-summary small,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-summary small ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-summary small,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-summary small {
  display: none;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-summary strong,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-summary strong ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-summary strong,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-summary strong {
  color: #81798f;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  white-space: normal;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-summary.is-ready,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-summary.is-ready ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-plan-summary.is-ready,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-summary.is-ready {
  border: 0;
  background: transparent;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-grid,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-grid ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-grid,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-select,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-select ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-select,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-select {
  position: relative;
  min-width: 0;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-select > summary,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-select > summary ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-select > summary,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-select > summary {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 11px;
  border: 1px solid rgba(93, 80, 157, 0.18);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.94);
  cursor: pointer;
  list-style: none;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-select > summary::-webkit-details-marker,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-select > summary::-webkit-details-marker ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-select > summary::-webkit-details-marker,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-select > summary::-webkit-details-marker {
  display: none;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-select > summary span,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-select > summary span ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-select > summary span,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-select > summary span {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-select > summary small,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-select > summary small ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-select > summary small,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-select > summary small {
  flex: 0 0 auto;
  color: #837b92;
  font-size: 11px;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-select > summary strong,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-select > summary strong ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-select > summary strong,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-select > summary strong {
  overflow: hidden;
  color: #332e40;
  font-size: 12.5px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-select > summary > .lucide,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-select > summary > .lucide ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-select > summary > .lucide,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-select > summary > .lucide {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  color: #796fa0;
  transition: transform 160ms ease;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-select[open] > summary > .lucide,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-select[open] > summary > .lucide ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-select[open] > summary > .lucide,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-select[open] > summary > .lucide {
  transform: rotate(180deg);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-select.is-disabled > summary,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-select.is-disabled > summary ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-select.is-disabled > summary,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-select.is-disabled > summary {
  cursor: not-allowed;
  opacity: 0.62;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-menu,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-menu ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-menu,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 70;
  display: none;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  width: 100%;
  padding: 9px;
  border: 1px solid rgba(199, 205, 230, 0.95);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.99);
  box-shadow: 0 14px 32px rgba(58, 47, 112, 0.16);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-select[open] > .pet-product-scene-custom-menu,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-select[open] > .pet-product-scene-custom-menu ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-select[open] > .pet-product-scene-custom-menu,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-select[open] > .pet-product-scene-custom-menu {
  display: grid;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-menu button,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-menu button ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-menu button,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-menu button {
  min-height: 38px;
  padding: 7px 9px;
  border: 1px solid rgba(93, 80, 157, 0.17);
  border-radius: 9px;
  color: #4d475b;
  background: #ffffff;
  font-size: 11.5px;
  cursor: pointer;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-menu button:hover,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-menu button:hover,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-menu button:hover,,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-menu button:hover,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-menu button.selected,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-menu button.selected ,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"] .pet-product-scene-custom-menu button.selected,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-menu button.selected {
  border-color: #7059f2;
  color: #ffffff;
  background: linear-gradient(135deg, #7059f2, #5a43dd);
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-card,
html[data-theme="dark"][data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-card ,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-card {
  border-color: rgba(137, 115, 247, 0.28);
  background: linear-gradient(145deg, rgba(35, 32, 48, 0.98), rgba(28, 26, 39, 0.98));
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] :is(.pet-product-scene-plan-heading > div:first-child > strong, .pet-product-scene-custom-select > summary strong),
html[data-theme="dark"][data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] :is(.pet-product-scene-plan-heading > div:first-child > strong, .pet-product-scene-custom-select > summary strong) ,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] :is(.pet-product-scene-plan-heading > div:first-child > strong, .pet-product-scene-custom-select > summary strong) {
  color: #f2effb;
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-select > summary,
html[data-theme="dark"][data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-select > summary ,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-select > summary {
  border-color: rgba(137, 125, 174, 0.38);
  background: rgba(39, 36, 52, 0.96);
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-plan-summary strong,
html[data-theme="dark"][data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-plan-summary strong ,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-plan-summary strong {
  color: #aaa3b8;
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-menu,
html[data-theme="dark"][data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-menu ,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-menu {
  border-color: rgba(122, 111, 162, 0.46);
  background: rgba(29, 27, 40, 0.99);
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .pet-product-scene-custom-menu button,
html[data-theme="dark"][data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .pet-product-scene-custom-menu button ,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .pet-product-scene-custom-menu button {
  border-color: rgba(115, 105, 148, 0.36);
  color: #e9e5f4;
  background: #292635;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"] .extra-prompt-box textarea,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"] .extra-prompt-box textarea ,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .extra-prompt-box textarea {
  height: 86px !important;
  min-height: 86px !important;
  max-height: 86px !important;
}

@keyframes aotuToastIn {
  from {
    opacity: 0;
    transform: translate(-50%, -8px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translate(-50%, 0) scale(1);
  }
}

.toast {
  top: 84px !important;
  left: 50% !important;
  gap: 9px;
  width: max-content;
  max-width: min(440px, calc(100vw - 32px)) !important;
  min-height: 42px !important;
  padding: 10px 14px !important;
  border: 1px solid rgba(218, 222, 232, 0.96) !important;
  border-radius: 10px !important;
  color: #343949 !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 10px 28px rgba(35, 39, 54, 0.12) !important;
  font-size: 13.5px !important;
  font-weight: 540 !important;
  line-height: 1.45 !important;
  text-align: left !important;
  transform: translate(-50%, 0) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

.toast::before {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #7064e8;
  box-shadow: 0 0 0 4px rgba(112, 100, 232, 0.1);
}

.toast.show {
  display: flex;
  animation: aotuToastIn 180ms ease-out !important;
}

html[data-theme="dark"] .toast {
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: #f1f2f7 !important;
  background: rgba(35, 36, 45, 0.96) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.3) !important;
}

@media (max-width: 560px) {
  .toast {
    top: 70px !important;
    max-width: calc(100vw - 24px) !important;
    min-height: 40px !important;
    padding: 9px 12px !important;
    font-size: 13px !important;
  }
}

.create-button,
.outline-button {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 18px;
  border: 0;
  border-radius: 12px;
  color: #fff;
  background: linear-gradient(135deg, var(--purple), var(--purple-2));
  box-shadow: 0 12px 24px rgba(123, 97, 255, 0.18);
  font-weight: 525;
}

.create-button.full {
  width: 100%;
  min-height: 58px;
  font-size: 16px;
}

.create-button > .lucide,
.outline-button > .lucide,
.batch-button > .lucide,
.library-select-button > .lucide,
.experience-upload-button > .lucide,
.model-upload-link > .lucide {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  padding: 5px;
  border-radius: 9px;
  stroke-width: 2.45;
}

.create-button > .lucide {
  color: #fff;
  background: rgba(255, 255, 255, 0.18);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22);
}

.outline-button > .lucide,
.batch-button > .lucide,
.library-select-button > .lucide,
.experience-upload-button > .lucide,
.model-upload-link > .lucide {
  color: var(--purple);
  background: #f2eeff;
}

.outline-button {
  border: 1px solid var(--line);
  color: #4d5061;
  background: #fff;
  box-shadow: none;
}

.workflow-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px 22px;
  align-items: start;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fbfbff;
}

.workflow-card strong {
  color: var(--purple);
}

.workflow-card ol {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 26px;
  margin: 0;
  padding-left: 18px;
  color: #5f6376;
}

.workflow-card li::marker {
  color: var(--purple);
  font-weight: 525;
}

.result-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.result-tags span {
  min-height: 28px;
  padding: 6px 10px;
  border-radius: 999px;
  color: var(--purple);
  background: var(--purple-soft);
  font-size: 12px;
  font-weight: 525;
}

.task-panel.advanced-mode {
  gap: 16px;
  padding-top: 18px;
}

.task-panel.advanced-mode .task-heading {
  order: 1;
}

.task-panel.advanced-mode .feature-experience {
  order: 2;
}

.task-panel.advanced-mode .task-recent-panel {
  order: 3;
}

.task-heading[hidden],
.task-body[hidden],
.workflow-card[hidden],
.result-tags[hidden] {
  display: none !important;
}

.feature-experience {
  min-width: 0;
}

.feature-experience[hidden] {
  display: none;
}

.experience-layout,
.content-experience,
.library-experience,
.admin-experience {
  display: grid;
  gap: 16px;
}

.experience-layout {
  grid-template-columns: 270px minmax(0, 1fr) 320px;
  align-items: stretch;
}

.experience-pane,
.content-source-panel,
.content-editor-panel,
.library-sidebar,
.library-main {
  min-width: 0;
  padding: 16px;
  border: 1px solid #e8e6f2;
  border-radius: 14px;
  background: #fff;
}

.experience-label {
  display: inline-flex;
  margin-bottom: 12px;
  color: #697083;
  font-size: 13px;
  font-weight: 525;
  line-height: 1.25;
  letter-spacing: 0;
}

.experience-upload-box {
  display: grid;
  gap: 10px;
}

.experience-upload-button {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 74px;
  padding: 12px;
  border: 1px dashed #cfd5dd;
  border-radius: 12px;
  color: #30384d;
  background: #f8fafc;
  text-align: left;
}

.experience-upload-button .lucide {
  width: 26px;
  height: 26px;
  color: #3e7c78;
}

.experience-upload-button strong,
.experience-upload-button small {
  display: block;
}

.experience-upload-button small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 525;
}

.experience-field {
  display: grid;
  gap: 8px;
}

.experience-field span {
  color: #30384d;
  font-size: 13px;
  font-weight: 525;
}

.experience-field input,
.experience-field textarea {
  width: 100%;
  min-height: 42px;
  padding: 11px 12px;
  border: 1px solid #e4e7ee;
  border-radius: 11px;
  color: var(--ink);
  background: #fbfcff;
  font: inherit;
  font-size: 13px;
  line-height: 1.5;
  outline: 0;
}

.experience-field textarea {
  min-height: 120px;
  resize: vertical;
}

.detail-page-preview,
.poster-canvas-preview,
.outfit-model-stage,
.buyer-shot-wall,
.watermark-preview-board,
.content-editor-panel,
.video-generate-stage {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #e4e7ee;
  border-radius: 14px;
  background: #f7f9fb;
}

.video-generate-experience {
  grid-template-columns: 300px minmax(0, 1fr) 320px;
  align-items: stretch;
}

.video-profile-grid,
.video-size-grid {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.video-profile-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.video-size-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 12px;
}

.video-profile-grid .choice-button,
.video-size-grid .choice-button {
  min-height: 58px;
  align-content: center;
}

.video-select-field select {
  width: 100%;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid #e4e7ee;
  border-radius: 11px;
  color: var(--ink);
  background: #fbfcff;
  font: inherit;
  font-size: 13px;
  outline: 0;
}

.video-url-field textarea {
  min-height: 92px;
}

.video-empty-preview {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 16px;
  width: 100%;
  height: 100%;
  padding: 26px;
  text-align: center;
}

.video-empty-frame {
  position: relative;
  width: min(58%, 180px);
  aspect-ratio: 9 / 16;
  overflow: hidden;
  border-radius: 26px;
  background: #141927;
  box-shadow: 0 18px 42px rgba(34, 40, 66, 0.16);
}

.video-empty-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.82;
}

.video-empty-frame span {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  color: #fff;
  background: rgba(28, 34, 50, 0.62);
  transform: translate(-50%, -50%);
}

.video-empty-frame .lucide {
  width: 20px;
  height: 20px;
  margin-left: 2px;
}

.video-empty-copy {
  display: grid;
  gap: 6px;
  max-width: 280px;
}

.video-empty-copy strong {
  color: #262c42;
  font-size: 18px;
  font-weight: 680;
}

.video-empty-copy small {
  color: #7a8194;
  font-size: 13px;
  line-height: 1.5;
}

.video-generate-layout {
  grid-template-columns: 270px minmax(0, 1fr) 320px;
}

.video-generate-layout .experience-pane {
  display: grid;
  align-content: start;
  gap: 12px;
}

.video-generate-layout .experience-label {
  margin-bottom: 0;
}

.video-generate-layout .video-task-note {
  margin: 0;
}

.video-generate-preview {
  background: #141927;
}

.video-generate-preview::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(20, 25, 39, 0.06), rgba(20, 25, 39, 0.18));
}

.video-generate-preview div {
  z-index: 1;
  max-width: 330px;
}

.video-generate-preview span {
  display: block;
  color: rgba(255, 255, 255, 0.82);
  font-size: 13px;
  line-height: 1.45;
  font-weight: 525;
}

.video-setting-hint {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.video-task-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 9px;
  align-items: start;
  margin: 12px 0;
  padding: 10px 11px;
  border: 1px solid #dde8e6;
  border-radius: 12px;
  color: #3f5964;
  background: #f4f9f8;
  font-size: 12px;
  line-height: 1.45;
  font-weight: 525;
}

.video-task-note .lucide {
  width: 15px;
  height: 15px;
  color: #3e7c78;
  transform: translateY(1px);
}

.video-generate-stage {
  display: grid;
  grid-template-columns: minmax(180px, 260px) minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  padding: 18px;
  background: linear-gradient(135deg, #141927, #253145);
}

.video-phone-frame {
  position: relative;
  justify-self: center;
  width: min(100%, 230px);
  aspect-ratio: 9 / 16;
  overflow: hidden;
  border: 8px solid rgba(255, 255, 255, 0.16);
  border-radius: 28px;
  background: #0b0f17;
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.28);
}

.video-phone-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.video-phone-frame span {
  position: absolute;
  right: 12px;
  top: 12px;
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 9px;
  border-radius: 999px;
  color: #fff;
  background: rgba(0, 0, 0, 0.38);
  font-size: 12px;
  font-weight: 525;
}

.video-shot-list {
  display: grid;
  gap: 12px;
}

.video-shot-list span {
  display: flex;
  gap: 12px;
  align-items: center;
  min-height: 54px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 14px;
  color: #fff;
  background: rgba(255, 255, 255, 0.1);
  font-size: 14px;
  font-weight: 525;
}

.video-shot-list b {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  color: #152033;
  background: #fff;
  font-size: 12px;
}

.video-result-preview {
  display: grid;
  gap: 12px;
  width: min(100%, 520px);
  margin: 0 auto;
  padding: 12px;
  border: 1px solid #e4e7ee;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 16px 38px rgba(42, 49, 70, 0.08);
}

.video-result-preview video {
  display: block;
  width: 100%;
  max-height: min(68vh, 560px);
  aspect-ratio: 9 / 16;
  border-radius: 11px;
  background: #111827;
  object-fit: contain;
}

.video-result-preview div {
  display: grid;
  gap: 4px;
}

.video-result-preview strong {
  color: #30384d;
  font-size: 15px;
  font-weight: 525;
}

.video-result-preview span {
  color: #697083;
  font-size: 12px;
  line-height: 1.45;
  font-weight: 525;
}

.detail-page-strip {
  display: grid;
  gap: 12px;
  max-width: 420px;
  margin: 0 auto;
  padding: 18px;
  background: #fff;
}

.detail-page-strip img {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 10px;
  object-fit: cover;
}

.detail-page-strip section {
  display: grid;
  gap: 4px;
  padding: 12px;
  border-left: 4px solid #3e7c78;
  background: #f4f8f7;
}

.detail-page-strip b,
.editor-paper span {
  color: #3e7c78;
  font-size: 12px;
  font-weight: 525;
}

.detail-page-strip strong,
.editor-paper h3 {
  color: #30384d;
}

.detail-page-strip p,
.editor-paper p,
.editor-paper li {
  margin: 0;
  color: #626a7b;
  font-size: 13px;
  line-height: 1.55;
  font-weight: 525;
}

.detail-module-list,
.poster-template-grid,
.model-mini-list,
.experience-stat-grid {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.detail-module-list button,
.poster-template-grid button,
.model-mini-list button,
.model-library-large-grid button,
.library-tile-grid button,
.library-sidebar button {
  border: 1px solid #e4e7ee;
  border-radius: 11px;
  color: #30384d;
  background: #fff;
  font-weight: 525;
}

.detail-module-list button,
.poster-template-grid button {
  min-height: 42px;
}

.detail-module-list button.selected,
.poster-template-grid button.selected,
.model-mini-list button.selected,
.model-library-large-grid button.selected,
.library-sidebar button.selected {
  border-color: #3e7c78;
  color: #245d59;
  background: #edf6f4;
}

.buyer-shot-wall,
.watermark-preview-board {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 16px;
  align-content: start;
}

.buyer-shot-wall figure,
.watermark-preview-board figure {
  position: relative;
  display: grid;
  gap: 6px;
  margin: 0;
}

.buyer-shot-wall img,
.watermark-preview-board img,
.model-mini-list img,
.model-library-large-grid img,
.library-tile-grid img {
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 10px;
  object-fit: cover;
  background: #eef1f5;
}

.buyer-shot-wall figcaption {
  color: #626a7b;
  font-size: 12px;
  font-weight: 525;
}

.experience-stat-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.experience-stat-grid span {
  display: grid;
  gap: 4px;
  min-height: 72px;
  place-items: center;
  border-radius: 12px;
  background: #f5f8fa;
}

.experience-stat-grid b {
  color: #3e7c78;
  font-size: 19px;
}

.experience-stat-grid small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 525;
}

.outfit-builder {
  grid-template-columns: 320px minmax(0, 1fr) 320px;
}

.outfit-slot-board {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.outfit-slot {
  display: grid;
  gap: 8px;
  min-height: 112px;
  place-items: center;
  border: 1px solid #e4e7ee;
  border-radius: 13px;
  color: #30384d;
  background: #fff;
}

.outfit-slot.is-filled {
  border-color: #3e7c78;
  background: #edf6f4;
}

.outfit-model-stage {
  position: relative;
  display: grid;
  place-items: end start;
  min-height: 440px;
  padding: 20px;
}

.outfit-model-stage img,
.poster-canvas-preview img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.outfit-model-stage div,
.poster-canvas-preview div {
  position: relative;
  z-index: 1;
  max-width: 360px;
  padding: 14px;
  border-radius: 12px;
  color: #fff;
  background: rgba(32, 38, 45, 0.72);
}

.model-mini-list {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.model-mini-list button,
.model-library-large-grid button {
  display: grid;
  gap: 6px;
  padding: 8px;
}

.poster-canvas-preview {
  position: relative;
  display: grid;
  align-items: end;
  min-height: 440px;
  padding: 20px;
}

.poster-canvas-preview b {
  display: block;
  color: #bbf0e6;
  font-size: 12px;
}

.poster-canvas-preview strong {
  display: block;
  margin: 5px 0;
  font-size: 24px;
}

.watermark-preview-board figure em {
  position: absolute;
  right: 10px;
  bottom: 30px;
  padding: 5px 8px;
  border-radius: 7px;
  color: #fff;
  background: rgba(62, 124, 120, 0.72);
  font-style: normal;
  font-weight: 525;
}

.content-experience {
  grid-template-columns: 300px minmax(0, 1fr) 320px;
}

.editor-paper {
  display: grid;
  gap: 12px;
  max-width: 620px;
  margin: 0 auto;
  padding: 28px;
  background: #fff;
  min-height: 100%;
}

.editor-paper h3 {
  margin: 0;
  font-size: 24px;
}

.editor-paper ol {
  display: grid;
  gap: 10px;
  margin: 0;
  padding-left: 20px;
}

.library-experience {
  grid-template-columns: 240px minmax(0, 1fr);
}

body.library-focus-mode .content-grid {
  min-width: 0 !important;
  min-height: calc(100vh - 80px);
  overflow: auto;
  padding: 16px 24px 24px !important;
  background: #fff !important;
}

body.library-focus-mode .workspace {
  min-width: 0 !important;
  width: 100% !important;
  height: auto !important;
  background: #fff !important;
}

body.library-focus-mode .task-panel {
  width: 100% !important;
  min-width: 0 !important;
  min-height: calc(100vh - 126px);
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}

body.library-focus-mode .task-panel.advanced-mode {
  display: block !important;
}

body.library-focus-mode .feature-experience {
  width: 100%;
  min-height: calc(100vh - 126px);
}

.material-library-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 22px;
  min-width: 0;
  min-height: calc(100vh - 126px);
}

.material-library-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.material-library-tabs button {
  display: flex;
  gap: 10px;
  align-items: center;
  min-width: 0;
  min-height: 56px;
  padding: 0 4px 12px;
  border: 1px solid #e8ebf4;
  border-radius: 10px;
  color: #30384d;
  background: #fafbfe;
  text-align: left;
  box-shadow: none;
}

.material-library-tabs button.selected {
  border-color: #3f63f3;
  color: #2142c4;
  background: #f5f7ff;
}

.material-library-tabs .lucide {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  padding: 6px;
  border-radius: 9px;
  background: #f3f4f8;
}

.material-library-tabs button.selected .lucide {
  color: #fff;
  background: #3f63f3;
}

.material-library-tabs span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.material-library-tabs strong,
.material-library-tabs small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.material-library-tabs strong {
  font-size: 14px;
  font-weight: 700;
}

.material-library-tabs small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 480;
}

.unified-material-library {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  gap: 0 28px;
  min-width: 0;
  min-height: 0;
}

.unified-material-overview {
  grid-column: 1 / -1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  min-width: 0;
  padding: 0 0 20px;
  border-bottom: 1px solid #edf0f7;
}

.unified-material-overview > div:first-child {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.unified-material-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}

.unified-material-overview span {
  color: #647084;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.unified-material-overview strong {
  overflow: hidden;
  color: #182033;
  font-size: 26px;
  font-weight: 700;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.unified-material-overview small {
  color: #667085;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
}

.unified-material-overview-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.unified-material-groups {
  min-width: 0;
  border-right: 1px solid #edf0f7;
  background: #fff;
  box-shadow: none;
}

.unified-material-groups {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 14px;
  padding: 22px 20px 0 0;
}

.unified-material-main {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 18px;
  min-width: 0;
  padding: 22px 0 0;
  background: #fff;
}

.unified-material-main.is-dragover {
  outline: 2px dashed #3f63f3;
  outline-offset: 8px;
  background: #f8faff;
}

.unified-material-section-head,
.unified-material-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
}

.unified-material-section-head > div {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.unified-material-section-head strong,
.unified-material-toolbar strong {
  display: block;
  overflow: hidden;
  color: #20283a;
  font-size: 15px;
  font-weight: 580;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.unified-material-section-head small,
.unified-material-toolbar small {
  display: block;
  color: #7c879a;
  font-size: 12px;
}

.material-overview-upload {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 16px;
  border: 0;
  border-radius: 9px;
  color: #fff;
  background: #3158e8;
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 10px 22px rgba(49, 88, 232, 0.16);
}

.material-overview-upload:disabled {
  cursor: not-allowed;
  color: #98a2b3;
  background: #eef1f6;
  box-shadow: none;
}

.material-overview-upload .lucide {
  width: 16px;
  height: 16px;
}

.material-group-add-button {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 6px;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid #dfe5f2;
  border-radius: 9px;
  color: #536075;
  background: #fff;
  font-size: 12px;
  font-weight: 500;
}

.material-group-add-button:hover,
.material-group-add-button:focus-visible {
  border-color: #cbd5e1;
  background: #f8fafc;
}

.material-group-add-button .lucide {
  width: 14px;
  height: 14px;
}

.unified-material-group-list {
  display: grid;
  align-content: start;
  gap: 2px;
  min-height: 0;
  overflow: auto;
  padding: 14px 14px 0 0;
  border-top: 1px solid #edf0f7;
}

.unified-material-group-list button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 10px;
  border: 0;
  border-radius: 9px;
  color: #475467;
  background: transparent;
  font-size: 14px;
  font-weight: 460;
  text-align: left;
}

.unified-material-group-list button:hover,
.unified-material-group-list button.selected {
  color: #2b4fc7;
  background: #f4f7ff;
}

.unified-material-group-list span {
  overflow: hidden;
  font-weight: 460;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.unified-material-group-list small {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  color: #667085;
  background: #f2f4f7;
  font-size: 11px;
  font-weight: 700;
}

.unified-material-empty-mini {
  display: grid;
  place-items: center;
  min-height: 80px;
  padding: 14px;
  border: 0;
  border-radius: 9px;
  color: var(--muted);
  background: #f8fafc;
  text-align: center;
  font-size: 13px;
}

.unified-material-toolbar > div:first-child {
  min-width: 0;
}

.unified-material-toolbar > div:last-child {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.material-toolbar-button {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid #dfe5f2;
  border-radius: 9px;
  color: #536075;
  background: #fff;
  font-size: 12px;
  font-weight: 500;
}

.material-toolbar-button.primary {
  border-color: #cdd8ff;
  color: #2f55d4;
  background: #f4f7ff;
  box-shadow: none;
}

.material-toolbar-button.danger {
  color: #c24a55;
  border-color: #f3d8dc;
  background: #fffafa;
}

.material-toolbar-button:hover,
.material-toolbar-button:focus-visible {
  border-color: #cbd5e1;
  background: #f8fafc;
  transform: translateY(-1px);
}

.material-toolbar-button.primary:hover,
.material-toolbar-button.primary:focus-visible {
  border-color: #b8c7ff;
  background: #eef3ff;
}

.material-toolbar-button.danger:hover,
.material-toolbar-button.danger:focus-visible {
  border-color: #efc8cf;
  background: #fff4f5;
}

.material-toolbar-button .lucide {
  width: 14px;
  height: 14px;
}

.unified-material-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  align-content: start;
  gap: 20px;
  min-height: 0;
  overflow: visible;
  padding: 0 0 24px;
}

.unified-material-card {
  position: relative;
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}

.unified-material-card > button:first-child {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1.18;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 9px;
  background: #f4f6fb;
}

.unified-material-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.unified-material-card > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.unified-material-card strong,
.unified-material-card small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.unified-material-card strong {
  color: #4b5568;
  font-size: 11px;
  font-weight: 500;
}

.unified-material-card small {
  color: var(--muted);
  font-size: 11px;
}

.unified-material-card .small-icon-button {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 28px;
  height: 28px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  color: #fff;
  background: rgba(17, 24, 39, 0.44);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18);
  opacity: 0;
  backdrop-filter: blur(8px);
  transform: translateY(-2px);
  transition: opacity 0.16s ease, transform 0.16s ease, background 0.16s ease;
}

.unified-material-card:hover .small-icon-button,
.unified-material-card .small-icon-button:focus-visible {
  opacity: 1;
  transform: translateY(0);
}

.unified-material-card .small-icon-button:hover {
  background: rgba(205, 44, 61, 0.9);
}

.unified-material-card .small-icon-button .lucide {
  width: 14px;
  height: 14px;
}

.unified-material-empty {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  min-height: 420px;
  border: 1px dashed #d9deea;
  border-radius: 10px;
  color: var(--muted);
  background: #fbfcff;
  text-align: center;
}

.unified-material-empty-inline {
  grid-column: 1 / -1;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 12px;
  min-height: 320px;
  color: #667085;
  background: #fff;
  text-align: center;
}

.unified-material-empty-inline em {
  color: #8a95a8;
  font-size: 13px;
  font-weight: 420;
  font-style: normal;
}

.unified-material-empty-inline .lucide {
  width: 38px;
  height: 38px;
  padding: 9px;
  border-radius: 10px;
  color: #3f63f3;
  background: #eef3ff;
}

.unified-material-empty-inline strong {
  color: #20283a;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.45;
}

.material-empty-upload-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0 18px;
  border: 1px solid #d8e0ef;
  border-radius: 9px;
  color: #3359d4;
  background: #fff;
  font-size: 13px;
  font-weight: 480;
  line-height: 1;
  box-shadow: 0 6px 16px rgba(32, 64, 154, 0.06);
}

.material-empty-upload-button:hover,
.material-empty-upload-button:focus-visible {
  border-color: #bccbff;
  background: #f7f9ff;
  transform: translateY(-1px);
}

.unified-material-empty .lucide {
  width: 42px;
  height: 42px;
  padding: 10px;
  border-radius: 12px;
  color: #4c76ff;
  background: #eef4ff;
}

.unified-material-empty strong {
  color: #2d344a;
  font-size: 16px;
}

.unified-material-empty small {
  max-width: 280px;
  color: var(--muted);
  line-height: 1.6;
}

.material-group-dialog-card {
  width: min(420px, calc(100vw - 36px));
  display: grid;
  gap: 18px;
}

.material-group-dialog-kicker {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 8px;
  padding: 4px 9px;
  border-radius: 999px;
  color: #3152c9;
  background: #eef3ff;
  font-size: 12px;
  font-weight: 700;
}

.material-group-dialog-card label {
  display: grid;
  gap: 8px;
  color: #30384d;
  font-size: 13px;
  font-weight: 650;
}

.material-group-dialog-card input {
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid #dfe5f2;
  border-radius: 10px;
  color: #1f2637;
  background: #fff;
  font-size: 14px;
  outline: none;
}

.material-group-dialog-card input:focus {
  border-color: #3f63f3;
  box-shadow: 0 0 0 3px rgba(63, 99, 243, 0.12);
}

.material-group-dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.material-group-dialog-actions button {
  min-height: 38px;
  padding: 0 15px;
  border: 1px solid #dfe5f2;
  border-radius: 9px;
  color: #4b5568;
  background: #fff;
  font-size: 13px;
  font-weight: 650;
}

.material-group-dialog-actions button.primary {
  border-color: #3f63f3;
  color: #fff;
  background: #3f63f3;
}

@media (max-width: 860px) {
  .material-library-tabs {
    grid-template-columns: 1fr;
  }

  .unified-material-library {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .unified-material-groups {
    grid-template-rows: auto auto auto;
  }

  .unified-material-group-list {
    max-height: 220px;
  }

  .unified-material-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .unified-material-toolbar > div:last-child {
    justify-content: flex-start;
  }
}

.library-sidebar {
  display: grid;
  gap: 10px;
  align-content: start;
}

.library-sidebar strong {
  color: #30384d;
}

.library-sidebar button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 42px;
  padding: 0 12px;
}

.library-main {
  display: grid;
  gap: 14px;
}

.library-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  color: #30384d;
}

.library-toolbar-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.library-toolbar-actions {
  display: flex;
  flex-shrink: 0;
  gap: 8px;
  align-items: center;
}

.library-toolbar span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 525;
}

.library-tile-grid,
.model-library-large-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.library-experience .library-tile-grid {
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 8px;
}

.library-tile-grid.compact {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.library-tile-grid button,
.model-library-large-grid button {
  display: grid;
  gap: 7px;
  padding: 10px;
  text-align: left;
}

.library-experience .library-tile-grid button {
  gap: 5px;
  padding: 6px;
}

.library-experience .library-tile-grid .product-empty-state {
  grid-column: 1 / -1;
}

.library-tile-grid strong,
.model-library-large-grid strong {
  overflow: hidden;
  color: #30384d;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.library-experience .library-tile-grid strong {
  font-size: 11px;
}

.library-tile-grid small,
.model-library-large-grid small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 525;
}

.library-experience .library-tile-grid small {
  font-size: 10px;
}

.model-directory {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.model-directory-layout {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  min-width: 0;
}

.model-directory-content {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.model-filter-panel {
  position: sticky;
  top: 86px;
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid #dce9ff;
  border-radius: 12px;
  background: linear-gradient(180deg, #f7fbff, #ffffff);
  box-shadow: 0 14px 30px rgba(45, 130, 255, 0.08);
}

.model-filter-panel > strong {
  display: flex;
  align-items: center;
  min-height: 30px;
  color: #1e75f0;
  font-size: 17px;
  font-weight: 525;
}

.model-filter-group {
  display: grid;
  gap: 7px;
  padding: 10px;
  border: 1px solid #edf1f7;
  border-radius: 10px;
  background: #fff;
}

.model-filter-group span {
  color: #303747;
  font-size: 13px;
  font-weight: 525;
}

.model-filter-group button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  color: #3d4657;
  background: #f9fbff;
  font-size: 12px;
  font-weight: 525;
  text-align: left;
}

.model-filter-group button.selected {
  border-color: #2d82ff;
  color: #1e75f0;
  background: #edf5ff;
  box-shadow: 0 0 0 3px rgba(45, 130, 255, 0.1);
}

.model-search-box,
.model-filter-select,
.model-date-button,
.model-view-toggle {
  min-height: 40px;
  border: 1px solid #e5e8ef;
  border-radius: 7px;
  background: #fff;
}

.model-search-box {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  padding: 0 12px;
}

.model-search-box input,
.model-filter-select select {
  width: 100%;
  border: 0;
  color: #2f3545;
  background: transparent;
  font: inherit;
  font-size: 13px;
  font-weight: 525;
  outline: 0;
}

.model-search-box input::placeholder {
  color: #a3a8b4;
}

.model-search-box .lucide {
  width: 18px;
  height: 18px;
  color: #5f6677;
}

.model-filter-select {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 0 10px;
}

.model-filter-select span,
.model-date-button span {
  color: #7a8190;
  font-size: 12px;
  font-weight: 525;
  white-space: nowrap;
}

.model-filter-select select {
  min-width: 0;
  color: #3d4352;
}

.model-date-button {
  display: inline-grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 0 11px;
  color: #3d4352;
  text-align: left;
}

.model-date-button .lucide {
  width: 16px;
  height: 16px;
  color: #697082;
}

.model-date-button em {
  overflow: hidden;
  color: #7a8190;
  font-size: 12px;
  font-style: normal;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.model-view-toggle {
  display: inline-grid;
  grid-template-columns: repeat(2, 40px);
  gap: 6px;
  padding: 4px;
  border: 0;
  background: transparent;
}

.model-view-toggle button {
  display: grid;
  place-items: center;
  width: 40px;
  height: 34px;
  border: 1px solid #e5e8ef;
  border-radius: 7px;
  color: #5f6677;
  background: #fff;
}

.model-view-toggle button.selected {
  border-color: #2d82ff;
  color: #1e75f0;
  background: #f3f8ff;
}

.model-view-toggle .lucide {
  width: 18px;
  height: 18px;
}

.model-directory-section {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid #eceff4;
  border-radius: 8px;
  background: #fff;
}

.model-directory-section[hidden] {
  display: none;
}

.model-directory-section-head {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
}

.model-directory-section-head div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  align-items: baseline;
  min-width: 0;
}

.model-directory-section-head h3 {
  margin: 0;
  color: #1f2531;
  font-size: 18px;
  font-weight: 525;
}

.model-directory-section-head span {
  padding: 3px 8px;
  border-radius: 6px;
  color: #2274e8;
  background: #edf5ff;
  font-size: 12px;
  font-weight: 525;
}

.model-directory-section-head p {
  margin: 0;
  color: #7b8392;
  font-size: 12px;
  font-weight: 525;
}

.model-upload-link {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid #e2e7ee;
  border-radius: 7px;
  color: #3d4657;
  background: #fff;
  font-size: 12px;
  font-weight: 525;
  white-space: nowrap;
}

.model-upload-link.primary {
  border-color: #2d82ff;
  color: #1e75f0;
  background: #f3f8ff;
}

.model-upload-link .lucide {
  width: 15px;
  height: 15px;
}

.model-directory-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 8px;
}

.model-directory-card {
  overflow: hidden;
  min-width: 0;
  border: 1px solid #eceff4;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(28, 35, 52, 0.04);
}

.model-directory-card[hidden] {
  display: none;
}

.product-directory {
  display: grid;
  gap: 14px;
}

.product-directory-toolbar {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) auto auto;
  gap: 10px;
  align-items: center;
}

.product-group-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.product-group-tabs button {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid #e4e8ef;
  border-radius: 999px;
  color: #3d4657;
  background: #fff;
  font-size: 12px;
  font-weight: 525;
}

.product-group-tabs button.selected {
  border-color: rgba(45, 130, 255, 0.32);
  color: #1e75f0;
  background: #f3f8ff;
}

.product-group-tabs small {
  color: #8a93a5;
  font-size: 11px;
  font-weight: 525;
}

.product-directory-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 12px;
}

.product-directory-card {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 8px;
  border: 1px solid #eceff4;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(28, 35, 52, 0.04);
}

.product-directory-card[hidden] {
  display: none;
}

.product-directory-image {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  padding: 8px;
  border: 0;
  border-radius: 8px;
  background: #f3f5f8;
}

.product-directory-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.product-directory-meta {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.product-directory-meta strong,
.product-directory-meta small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-directory-meta strong {
  color: #212734;
  font-size: 12px;
  font-weight: 525;
}

.product-directory-meta small {
  color: #7b8392;
  font-size: 11px;
  font-weight: 525;
}

.product-empty-state {
  display: grid;
  place-items: center;
  gap: 8px;
  min-height: 240px;
  padding: 24px;
  border: 1px dashed #dce3ed;
  border-radius: 12px;
  color: #7b8392;
  background: #fbfcff;
  text-align: center;
}

.product-empty-state .lucide {
  width: 34px;
  height: 34px;
  color: #9aa4b5;
}

.product-empty-state strong {
  color: #303747;
  font-size: 15px;
  font-weight: 525;
}

.model-directory-image {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: #eef2f6;
}

.model-directory-image img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
}

.product-directory .product-directory-card {
  overflow: hidden;
  padding: 0;
}

.product-directory .product-directory-grid {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 8px;
}

.product-directory .product-directory-image img {
  aspect-ratio: 3 / 4;
  object-fit: contain;
  object-position: center;
}

.product-directory .product-directory-meta {
  grid-template-columns: minmax(0, 1fr) auto;
}

.product-directory .product-empty-state {
  grid-column: 1 / -1;
}

.model-directory-image.selected img {
  outline: 3px solid rgba(45, 130, 255, 0.58);
  outline-offset: -3px;
}

.model-directory-check {
  position: absolute;
  left: 8px;
  top: 8px;
}

.model-directory-check {
  width: 15px;
  height: 15px;
  border: 1px solid rgba(31, 39, 52, 0.22);
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.88);
}

.model-directory-image.selected .model-directory-check {
  border-color: #2274e8;
  background: #2274e8;
  box-shadow: inset 0 0 0 3px #fff;
}

.model-directory-meta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px;
  align-items: center;
  padding: 7px 6px;
}

.model-directory-meta strong {
  overflow: hidden;
  color: #212734;
  font-size: 11px;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.model-more-button {
  display: grid;
  place-items: center;
  width: 18px;
  height: 20px;
  border: 0;
  border-radius: 6px;
  color: #343a47;
  background: transparent;
}

.model-more-button:hover {
  background: #f3f5f8;
}

.model-more-button .lucide {
  width: 14px;
  height: 14px;
}

.model-action-menu {
  position: fixed;
  z-index: 240;
  display: grid;
  min-width: 132px;
  padding: 6px;
  border: 1px solid #e5e9f1;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(23, 28, 42, 0.18);
}

.model-action-menu[hidden] {
  display: none;
}

.model-action-menu button {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  min-height: 36px;
  padding: 0 10px;
  border: 0;
  border-radius: 9px;
  color: #d74f63;
  background: transparent;
  font-size: 12px;
  font-weight: 525;
  text-align: left;
}

.model-action-menu button:hover {
  background: #fff2f4;
}

.model-action-menu .lucide {
  width: 15px;
  height: 15px;
}

.model-upload-dialog {
  position: fixed;
  inset: 0;
  z-index: 180;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(25, 29, 40, 0.42);
}

.model-upload-dialog-card {
  display: grid;
  gap: 14px;
  width: min(420px, 92vw);
  padding: 18px;
  border: 1px solid #e6eaf0;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 26px 70px rgba(23, 28, 42, 0.26);
}

.model-upload-dialog-head {
  display: grid;
  gap: 4px;
}

.model-upload-dialog-head span {
  color: #2274e8;
  font-size: 12px;
  font-weight: 525;
}

.model-upload-dialog-head strong {
  color: #1f2531;
  font-size: 18px;
  font-weight: 525;
}

.model-upload-dialog-card label {
  display: grid;
  gap: 7px;
  color: #303747;
  font-size: 13px;
  font-weight: 525;
}

.model-upload-dialog-card input,
.model-upload-dialog-card select {
  width: 100%;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid #dfe5ee;
  border-radius: 9px;
  color: #1f2531;
  background: #fbfcff;
  font: inherit;
  outline: 0;
}

.model-upload-dialog-card input:focus,
.model-upload-dialog-card select:focus {
  border-color: #2d82ff;
  box-shadow: 0 0 0 3px rgba(45, 130, 255, 0.12);
}

.model-upload-dialog-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 4px;
}

.model-detail-modal {
  position: fixed;
  inset: 0;
  z-index: 190;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(18, 22, 32, 0.48);
}

.model-detail-card {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  width: min(1560px, 78vw);
  height: min(90vh, 980px);
  overflow: hidden;
  border: 1px solid #e6eaf0;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 30px 90px rgba(23, 28, 42, 0.26);
}

.model-detail-head {
  position: relative;
  display: flex;
  gap: 16px;
  align-items: flex-start;
  justify-content: space-between;
  padding: 16px 66px 14px 20px;
  border-bottom: 1px solid #edf0f5;
}

.model-detail-close-button {
  position: absolute;
  right: 18px;
  top: 14px;
  z-index: 2;
  width: 34px;
  height: 34px;
  border-color: #dfe5ee;
  border-radius: 11px;
  color: #293140;
  background: #fff;
  box-shadow: 0 10px 22px rgba(33, 40, 58, 0.1);
}

.model-detail-close-button:hover {
  border-color: #cfd7e4;
  background: #f7f9fc;
}

.model-detail-close-button .lucide {
  width: 18px;
  height: 18px;
}

.model-detail-head-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.model-detail-head-copy span {
  color: #2274e8;
  font-size: 12px;
  font-weight: 525;
}

.model-detail-head-copy strong {
  overflow: hidden;
  color: #1f2531;
  font-size: 20px;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.model-detail-head-copy small {
  color: #768092;
  font-size: 12px;
  font-weight: 525;
}

.model-detail-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  min-height: 0;
}

.model-detail-visual,
.model-detail-form-panel {
  min-width: 0;
  min-height: 0;
  padding: 16px;
}

.model-detail-visual {
  overflow: hidden;
  border-right: 1px solid #edf0f5;
  background: #fbfcff;
}

.model-detail-thumb-head {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.model-detail-thumb-head strong {
  color: #283041;
  font-size: 14px;
  font-weight: 525;
}

.model-detail-upload {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 9px;
  font-size: 12px;
}

.model-detail-photo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 12px;
  min-height: 0;
  max-height: calc(90vh - 132px);
  overflow: auto;
  align-content: start;
  padding-right: 4px;
}

.model-detail-photo-card {
  position: relative;
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 8px;
  border: 1px solid #e7ebf2;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 22px rgba(38, 49, 72, 0.05);
}

.model-detail-photo-card.selected {
  border-color: #2d82ff;
  box-shadow: 0 0 0 3px rgba(45, 130, 255, 0.14);
}

.model-detail-photo-thumb {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  padding: 8px;
  border: 0;
  border-radius: 10px;
  background: linear-gradient(180deg, #f7f8fc, #f1f3f8);
}

.model-detail-photo-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
}

.model-detail-photo-delete {
  position: absolute;
  right: 14px;
  top: 14px;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 999px;
  color: #fff;
  background: rgba(32, 35, 52, 0.62);
}

.model-detail-photo-delete .lucide {
  width: 15px;
  height: 15px;
}

.model-detail-photo-card strong,
.model-detail-photo-card small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.model-detail-photo-card strong {
  color: #30384d;
  font-size: 11px;
  font-weight: 525;
}

.model-detail-photo-card small {
  color: #7b8392;
  font-size: 10px;
  font-weight: 525;
}

.model-detail-form-panel {
  overflow: auto;
  background: #fff;
}

.model-detail-form {
  display: grid;
  gap: 10px;
}

.model-detail-form label {
  display: grid;
  gap: 6px;
  color: #303747;
  font-size: 12px;
  font-weight: 525;
}

.model-detail-form input,
.model-detail-form select {
  width: 100%;
  min-height: 36px;
  padding: 0 10px;
  border: 1px solid #dfe5ee;
  border-radius: 9px;
  color: #1f2531;
  background: #fbfcff;
  font: inherit;
  font-size: 12px;
  outline: 0;
}

.model-detail-form input:focus,
.model-detail-form select:focus {
  border-color: #2d82ff;
  box-shadow: 0 0 0 3px rgba(45, 130, 255, 0.12);
}

.model-detail-meta-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.model-detail-meta {
  display: grid;
  gap: 3px;
  padding: 9px;
  border: 1px solid #e9edf3;
  border-radius: 10px;
  background: #fbfcff;
}

.model-detail-meta span {
  color: #7b8392;
  font-size: 12px;
  font-weight: 525;
}

.model-detail-meta strong {
  color: #1f2531;
  font-size: 13px;
  font-weight: 525;
}

.model-detail-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-top: 4px;
}

.model-detail-actions .create-button,
.model-detail-actions .outline-button {
  min-height: 38px;
  padding: 0 12px;
  border-radius: 10px;
  font-size: 12px;
}

.model-detail-delete-button {
  border-color: rgba(224, 88, 105, 0.24);
  color: #d74f63;
  background: #fff5f7;
}

.model-detail-delete-button .lucide {
  width: 16px;
  height: 16px;
}

.admin-experience {
  gap: 14px;
}

.admin-wide-stats {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.admin-prompt-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-prompt-grid > strong {
  grid-column: 1 / -1;
}

.model-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.model-card {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 7px;
}

.model-card img {
  width: 100%;
  aspect-ratio: 0.82;
  border-radius: 9px;
  object-fit: cover;
  object-position: top center;
}

.model-card span {
  overflow: hidden;
  color: #535b70;
  font-size: 12px;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.privacy-note {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 11px;
  border: 1px solid #ded7ff;
  border-radius: 12px;
  color: var(--purple);
  background: var(--purple-soft);
  font-size: 12px;
  line-height: 1.5;
}

.library-stat {
  display: grid;
  gap: 4px;
  min-height: 64px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.library-stat span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 525;
}

.library-stat strong {
  font-size: 22px;
}

.slot-button {
  display: grid;
  gap: 7px;
  min-height: 76px;
  padding: 10px;
  color: #30384d;
  text-align: left;
  font-size: 13px;
  font-weight: 525;
}

.slot-button small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 525;
}

.mobile-generate {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 20;
  display: none;
  gap: 8px;
  align-items: center;
  min-height: 46px;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  color: #fff;
  background: var(--purple);
  box-shadow: 0 14px 28px rgba(123, 97, 255, 0.28);
  font-weight: 525;
}

.image-edit-menu {
  position: fixed;
  z-index: 80;
  display: none;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid #ded8ff;
  border-radius: 10px;
  color: var(--purple);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 14px 32px rgba(58, 48, 120, 0.18);
  font-size: 14px;
  font-weight: 525;
}

.image-edit-menu.show {
  display: inline-flex;
  align-items: center;
}

.super-admin-edit-menu {
  position: fixed;
  z-index: 120;
  display: none;
  width: 230px;
  padding: 8px;
  border: 1px solid rgba(102, 87, 255, 0.2);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 44px rgba(38, 30, 86, 0.2);
}

.super-admin-edit-menu.show {
  display: grid;
  gap: 6px;
}

.super-admin-edit-menu strong {
  padding: 6px 8px 4px;
  color: #241f4a;
  font-size: 13px;
}

.super-admin-edit-menu button {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 36px;
  padding: 0 10px;
  border: 0;
  border-radius: 10px;
  color: #312a61;
  background: #f5f3ff;
  font-size: 13px;
  font-weight: 525;
  text-align: left;
}

.super-admin-edit-menu button:not(:disabled):hover {
  color: #fff;
  background: var(--purple);
}

.super-admin-edit-menu button:disabled {
  color: #a39dbc;
  background: #f7f7fb;
  cursor: default;
}

.super-admin-edit-menu small {
  padding: 2px 8px 6px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.super-admin-text-modal {
  z-index: 130;
}

.super-admin-text-card {
  width: min(92vw, 720px);
}

.super-admin-kicker {
  color: var(--purple);
  font-size: 12px;
  font-weight: 525;
}

.super-admin-text-card textarea {
  width: 100%;
  min-height: 260px;
  resize: vertical;
  padding: 14px;
  border: 1px solid #ded8ff;
  border-radius: 12px;
  outline: none;
  color: var(--ink);
  background: #fbfaff;
  font: inherit;
  line-height: 1.7;
}

.super-admin-text-card textarea:focus {
  border-color: var(--purple);
  box-shadow: 0 0 0 4px rgba(102, 87, 255, 0.12);
}

.super-admin-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.super-admin-modal-actions button {
  min-height: 40px;
  padding: 0 18px;
  border: 0;
  border-radius: 12px;
  font-weight: 525;
}

.super-admin-modal-actions button:first-child {
  color: var(--muted);
  background: #f1f2f6;
}

.super-admin-modal-actions button:last-child {
  color: #fff;
  background: var(--purple);
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 30;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(15, 23, 42, 0.18);
  backdrop-filter: blur(8px) saturate(1.03);
  -webkit-backdrop-filter: blur(8px) saturate(1.03);
}

.modal-backdrop[hidden] {
  display: none;
}

.modal-card {
  display: grid;
  gap: 14px;
  width: min(100%, 460px);
  padding: 24px;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.2);
}

.modal-icon {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 13px;
  color: #fff;
  background: var(--purple);
}

.modal-card h2 {
  margin: 0;
}

.modal-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.modal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.modal-actions button {
  min-height: 42px;
  padding: 0 18px;
  border: 1px solid rgba(203, 213, 225, 0.9);
  border-radius: 12px;
  color: #334155;
  background: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.detail-dialog-upload-delete {
  position: absolute;
  top: 5px;
  right: 5px;
  z-index: 5;
  display: grid;
  place-items: center;
  width: 23px;
  height: 23px;
  padding: 0;
  border: 2px solid #fff;
  border-radius: 999px;
  color: #fff;
  background: rgba(235, 52, 82, 0.96);
  box-shadow: 0 6px 14px rgba(223, 63, 85, 0.24);
  cursor: pointer;
}

.detail-dialog-upload-delete .lucide {
  width: 12px;
  height: 12px;
  stroke-width: 3;
}

.detail-dialog-upload-delete:hover,
.detail-dialog-upload-delete:focus-visible {
  background: #df3f55;
  transform: scale(1.05);
}

.modal-actions button:first-child {
  border-color: transparent;
  color: #fff;
  background: #1677ff;
}

.auth-card {
  width: min(100%, 420px);
}

.prompt-card {
  width: min(760px, 94vw);
}

.prompt-card textarea {
  width: 100%;
  min-height: 260px;
  resize: vertical;
  padding: 13px 14px;
  border: 1px solid #e5e3f1;
  border-radius: 14px;
  color: var(--ink);
  background: #fbfbff;
  font: inherit;
  font-size: 14px;
  line-height: 1.65;
  outline: 0;
}

.prompt-card textarea:focus {
  border-color: rgba(123, 97, 255, 0.55);
  box-shadow: 0 0 0 3px rgba(123, 97, 255, 0.1);
}

.prompt-preparing-status {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 10px 0 12px;
  padding: 10px 12px;
  border: 1px solid rgba(123, 97, 255, 0.2);
  border-radius: 12px;
  color: #6251d8;
  background: rgba(123, 97, 255, 0.07);
  font-size: 13px;
  line-height: 1.45;
}

.prompt-preparing-status[hidden] {
  display: none;
}

.prompt-preparing-status svg {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
}

.prompt-preparing-status.is-loading svg {
  animation: prompt-status-spin 0.9s linear infinite;
}

.prompt-preparing-status.is-ready {
  color: #28765a;
  border-color: rgba(45, 153, 112, 0.2);
  background: rgba(45, 153, 112, 0.07);
}

.prompt-preparing-status.is-warning {
  color: #a26316;
  border-color: rgba(214, 139, 37, 0.24);
  background: rgba(214, 139, 37, 0.08);
}

.prompt-card textarea.is-preparing {
  color: #8d89a0;
  background: linear-gradient(110deg, rgba(248, 247, 253, 0.96) 20%, rgba(239, 236, 255, 0.9) 42%, rgba(248, 247, 253, 0.96) 64%);
  background-size: 220% 100%;
  animation: prompt-loading-sheen 1.5s ease-in-out infinite;
  cursor: wait;
}

@keyframes prompt-status-spin {
  to { transform: rotate(360deg); }
}

@keyframes prompt-loading-sheen {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}

.credit-center-modal {
  z-index: 55;
  padding: 26px;
  background: rgba(17, 24, 39, 0.46);
}

.credit-center-dialog {
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  gap: 16px;
  width: min(1180px, 94vw);
  max-height: min(820px, 90vh);
  padding: 22px;
  overflow: hidden;
  border: 1px solid rgba(226, 232, 240, 0.88);
  border-radius: 20px;
  background:
    radial-gradient(circle at 12% 0%, rgba(79, 70, 229, 0.08), transparent 32%),
    #fff;
  box-shadow: 0 34px 90px rgba(15, 23, 42, 0.28);
}

.credit-center-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 18px;
}

.credit-center-head span {
  color: var(--purple);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
}

.credit-center-head h2 {
  margin: 5px 0 6px;
  color: #151a27;
  font-size: 26px;
  letter-spacing: 0;
}

.credit-center-head p {
  margin: 0;
  color: #737b8c;
  font-size: 14px;
}

.credit-center-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.credit-center-summary > div {
  display: grid;
  gap: 4px;
  min-height: 74px;
  padding: 14px 16px;
  border: 1px solid #edf0f8;
  border-radius: 16px;
  background: #fafbff;
}

.credit-center-summary small {
  color: #9099aa;
  font-size: 12px;
  font-weight: 650;
}

.credit-center-summary strong {
  overflow: hidden;
  color: #171c28;
  font-size: 22px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.credit-center-tabs {
  display: inline-flex;
  gap: 6px;
  padding: 5px;
  border: 1px solid #edf0f6;
  border-radius: 14px;
  background: #f8f9fc;
  justify-self: start;
}

.credit-center-tabs button {
  min-height: 36px;
  padding: 0 16px;
  border: 0;
  border-radius: 10px;
  color: #687184;
  background: transparent;
  font-size: 14px;
  font-weight: 650;
}

.credit-center-tabs button.selected {
  color: #fff;
  background: var(--purple);
  box-shadow: 0 10px 20px rgba(79, 70, 229, 0.18);
}

.credit-center-body {
  min-height: 0;
  overflow: auto;
  padding-right: 4px;
}

.credit-center-pane[hidden] {
  display: none !important;
}

.credit-center-pane[data-credit-pane="records"] {
  height: 100%;
  min-height: 0;
}

.credit-package-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.credit-package-card,
.member-plan-card {
  position: relative;
  display: grid;
  gap: 10px;
  align-content: start;
  min-width: 0;
  padding: 16px;
  border: 1px solid #e9edf7;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(55, 64, 100, 0.055);
}

.credit-package-card.is-recommended,
.member-plan-card.is-recommended {
  border-color: rgba(79, 70, 229, 0.34);
  box-shadow: 0 16px 34px rgba(79, 70, 229, 0.12);
}

.credit-package-card em,
.member-plan-head em {
  justify-self: start;
  min-height: 22px;
  padding: 0 9px;
  border-radius: 999px;
  color: #fff;
  background: var(--purple);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
}

.credit-package-card span {
  color: #6b7280;
  font-size: 14px;
  font-weight: 650;
}

.credit-package-card strong {
  color: #141820;
  font-size: 27px;
  line-height: 1.05;
  font-weight: 800;
}

.credit-package-card small {
  min-height: 38px;
  color: #8b95a8;
  font-size: 13px;
  line-height: 1.45;
  font-weight: 550;
}

.credit-package-card button,
.member-plan-card button,
.credit-checkin-card button {
  min-height: 40px;
  border: 0;
  border-radius: 12px;
  color: #fff;
  background: var(--purple);
  font-weight: 700;
}

.credit-center-note {
  margin: 14px 0 0;
  color: #8b95a8;
  font-size: 13px;
}

.checkin-card {
  width: min(560px, calc(100vw - 28px));
  align-items: stretch;
  text-align: left;
}

.checkin-card-head {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}

.checkin-card-icon {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border-radius: 16px;
  color: #fff;
  background: linear-gradient(135deg, #4f46e5, #14b8a6);
  box-shadow: 0 16px 28px rgba(79, 70, 229, 0.18);
}

.checkin-card-icon .lucide {
  width: 25px;
  height: 25px;
}

.checkin-card-head span {
  color: #4f46e5;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.checkin-card-head h2 {
  margin: 3px 0 0;
  color: #111827;
  font-size: 26px;
  line-height: 1.15;
}

.checkin-card-head p {
  margin: 6px 0 0;
  color: #64748b;
  font-size: 14px;
}

.checkin-reward-panel {
  display: grid;
  gap: 6px;
  margin-top: 18px;
  padding: 18px;
  border: 1px solid rgba(226, 232, 240, 0.92);
  border-radius: 18px;
  background:
    radial-gradient(circle at 94% 0, rgba(20, 184, 166, 0.16), transparent 28%),
    linear-gradient(135deg, #ffffff, #f8fbff);
}

.checkin-reward-panel small {
  color: #64748b;
  font-size: 13px;
  font-weight: 700;
}

.checkin-reward-panel strong {
  color: #4f46e5;
  font-size: 36px;
  line-height: 1;
}

.checkin-reward-panel span {
  color: #475569;
  font-size: 14px;
  line-height: 1.5;
}

.checkin-rule-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.checkin-rule-grid div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(226, 232, 240, 0.82);
  border-radius: 12px;
  background: #fff;
}

.checkin-rule-grid b {
  color: #111827;
  font-size: 13px;
}

.checkin-rule-grid span {
  color: #64748b;
  font-size: 12px;
}

.checkin-notes {
  display: grid;
  gap: 9px;
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
}

.checkin-notes li {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  color: #64748b;
  font-size: 13px;
  line-height: 1.5;
}

.checkin-notes .lucide {
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  margin-top: 1px;
  color: #14b8a6;
}

.checkin-card .modal-actions {
  margin-top: 18px;
}

@media (max-width: 560px) {
  .checkin-rule-grid {
    grid-template-columns: 1fr;
  }
}

.member-plan-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.member-plan-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 10px;
}

.member-plan-head span {
  display: grid;
  gap: 4px;
}

.member-plan-head strong {
  color: #171c28;
  font-size: 18px;
  font-weight: 760;
}

.member-plan-head small {
  color: #8b95a8;
  font-size: 13px;
}

.member-plan-card > b {
  color: var(--purple);
  font-size: 24px;
}

.member-plan-card ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.member-plan-card li {
  color: #555e70;
  font-size: 13px;
  line-height: 1.45;
}

.member-plan-card li::before {
  content: "✓";
  margin-right: 6px;
  color: #16a34a;
  font-weight: 800;
}

.member-plan-card.is-current button {
  color: var(--purple);
  background: #eef2ff;
}

.credit-checkin-card {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 22px;
  border: 1px solid rgba(79, 70, 229, 0.14);
  border-radius: 20px;
  background: linear-gradient(135deg, #f8f9ff, #fff);
}

.credit-checkin-icon {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 18px;
  color: var(--purple);
  background: #eef2ff;
}

.credit-checkin-icon .lucide {
  width: 30px;
  height: 30px;
}

.credit-checkin-card strong {
  display: block;
  color: #171c28;
  font-size: 21px;
}

.credit-checkin-card small {
  display: block;
  margin-top: 5px;
  color: #7a8496;
}

.credit-checkin-rules {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.credit-checkin-rules span {
  min-height: 42px;
  padding: 11px;
  border-radius: 13px;
  color: #596174;
  background: #f6f7fb;
  font-size: 13px;
  font-weight: 650;
}

.credit-record-empty {
  display: grid;
  place-items: center;
  min-height: 260px;
  padding: 30px;
  border: 1px dashed #dbe1ee;
  border-radius: 20px;
  color: #8b95a8;
  text-align: center;
  background: #fafbff;
}

.credit-record-empty .lucide {
  width: 48px;
  height: 48px;
  margin-bottom: 12px;
  color: var(--purple);
}

.credit-record-empty strong {
  color: #303747;
  font-size: 18px;
}

.credit-record-empty small {
  margin-top: 6px;
  font-size: 13px;
}

.credit-record-empty.is-loading .lucide {
  animation: spin 0.9s linear infinite;
}

.credit-record-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.045);
}

.credit-record-headline {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.78);
  background: linear-gradient(90deg, rgba(238, 242, 255, 0.88), rgba(240, 253, 250, 0.58));
}

.credit-record-headline > div:first-child {
  display: grid;
  gap: 3px;
}

.credit-record-headline strong {
  color: #182033;
  font-size: 16px;
  font-weight: 800;
}

.credit-record-headline small {
  color: #94a3b8;
  font-size: 12px;
  font-weight: 650;
}

.credit-record-toolbar {
  display: inline-flex;
  gap: 4px;
  align-items: center;
  justify-self: end;
  width: max-content;
  padding: 5px;
  border: 1px solid rgba(226, 232, 240, 0.92);
  border-radius: 14px;
  background: #fff;
}

.credit-record-toolbar button {
  min-width: 86px;
  min-height: 34px;
  padding: 0 18px;
  border: 0;
  border-radius: 11px;
  color: #64748b;
  background: transparent;
  font-size: 14px;
  font-weight: 750;
}

.credit-record-toolbar button.selected {
  color: #fff;
  background: #4f46e5;
  box-shadow: 0 8px 18px rgba(79, 70, 229, 0.18);
}

.credit-record-refresh {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid rgba(226, 232, 240, 0.92);
  border-radius: 12px;
  color: #536176;
  background: rgba(255, 255, 255, 0.92);
  font-size: 13px;
  font-weight: 750;
}

.credit-record-refresh:hover {
  color: #4f46e5;
  border-color: rgba(79, 70, 229, 0.28);
  background: #fff;
}

.credit-record-refresh:disabled {
  cursor: default;
  opacity: 0.62;
}

.credit-record-refresh .lucide {
  width: 16px;
  height: 16px;
}

.credit-record-scroll {
  min-height: 0;
  overflow: auto;
  padding-right: 4px;
  scrollbar-color: rgba(148, 163, 184, 0.32) transparent;
  scrollbar-width: thin;
}

.credit-record-scroll::-webkit-scrollbar,
.credit-rules-panel::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.credit-record-scroll::-webkit-scrollbar-track,
.credit-rules-panel::-webkit-scrollbar-track {
  background: transparent;
}

.credit-record-scroll::-webkit-scrollbar-thumb,
.credit-rules-panel::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.26);
}

.credit-record-scroll:hover::-webkit-scrollbar-thumb,
.credit-rules-panel:hover::-webkit-scrollbar-thumb {
  background: rgba(100, 116, 139, 0.36);
}

.credit-record-list {
  display: grid;
  gap: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.credit-record-item {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) minmax(138px, auto);
  gap: 13px;
  align-items: center;
  min-height: 68px;
  padding: 12px 16px;
  border: 0;
  border-bottom: 1px solid rgba(226, 232, 240, 0.78);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.credit-record-item:hover {
  background: rgba(248, 250, 252, 0.86);
}

.credit-record-item:last-child {
  border-bottom: 0;
}

.credit-record-icon {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  color: #687184;
  background: #f2f4f8;
}

.credit-record-icon.is-positive {
  color: #0f9f6e;
  background: #e9fbf3;
}

.credit-record-icon.is-negative {
  color: #d94848;
  background: #fff0f0;
}

.credit-record-icon .lucide {
  width: 20px;
  height: 20px;
}

.credit-record-main {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.credit-record-main strong {
  overflow: hidden;
  color: #171c28;
  font-size: 14px;
  font-weight: 760;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.credit-record-main small,
.credit-record-side small {
  color: #8a94a7;
  font-size: 12px;
  font-weight: 600;
}

.credit-record-side {
  display: grid;
  gap: 5px;
  justify-items: end;
  text-align: right;
}

.credit-record-side b {
  color: #5d6678;
  font-size: 16px;
  font-weight: 820;
}

.credit-record-side b.is-positive {
  color: #0f9f6e;
}

.credit-record-side b.is-negative {
  color: #d94848;
}

.credit-record-footnote {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: center;
  justify-content: space-between;
  margin-top: 0;
  padding: 11px 16px;
  border-top: 1px solid rgba(226, 232, 240, 0.78);
  color: #8a94a7;
  background: rgba(248, 250, 252, 0.78);
  font-size: 12px;
  font-weight: 650;
}

.credit-rules-toggle {
  min-height: 26px;
  padding: 0;
  border: 0;
  color: #4f46e5;
  background: transparent;
  font-size: 12px;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.credit-rules-panel {
  display: grid;
  gap: 6px;
  margin-top: 8px;
  max-height: min(240px, 34vh);
  overflow: auto;
  scrollbar-color: rgba(148, 163, 184, 0.32) transparent;
  scrollbar-width: thin;
  padding: 14px 16px;
  border: 1px solid rgba(226, 232, 240, 0.88);
  border-radius: 14px;
  color: #475569;
  background: rgba(255, 255, 255, 0.82);
  font-size: 12px;
  line-height: 1.7;
}

.credit-rules-panel[hidden] {
  display: none !important;
}

.credit-rules-panel strong {
  color: #111827;
  font-size: 13px;
}

.credit-rules-panel p {
  margin: 0;
}

@media (max-width: 920px) {
  .credit-package-grid,
  .member-plan-grid {
    grid-template-columns: 1fr 1fr;
  }

  .credit-center-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .credit-record-item {
    grid-template-columns: 40px minmax(0, 1fr);
  }

  .credit-record-side {
    grid-column: 2;
    justify-items: start;
    text-align: left;
  }
}

/* Premium purchase center refinement */
.credit-center-modal {
  padding: 8px !important;
  background: rgba(15, 23, 42, 0.16) !important;
  backdrop-filter: blur(10px) saturate(1.04) !important;
  -webkit-backdrop-filter: blur(10px) saturate(1.04) !important;
}

.credit-center-dialog {
  grid-template-rows: auto auto auto minmax(0, 1fr) !important;
  gap: 12px !important;
  width: min(1080px, 94vw) !important;
  height: min(900px, calc(100vh - 16px)) !important;
  max-height: calc(100vh - 16px) !important;
  padding: 26px 30px 28px !important;
  border: 1px solid rgba(226, 232, 240, 0.86) !important;
  border-radius: 24px !important;
  background:
    linear-gradient(180deg, rgba(239, 246, 255, 0.92) 0%, rgba(248, 250, 252, 0.98) 28%, rgba(248, 250, 252, 0.98) 100%) !important;
  box-shadow: 0 36px 110px rgba(15, 23, 42, 0.28) !important;
}

.credit-center-head {
  position: relative;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 20px !important;
  padding: 0 !important;
}

.credit-center-head::before {
  content: none !important;
}

.credit-center-head > div,
.credit-center-head > button {
  position: relative;
  z-index: 1;
}

.credit-center-head span,
.credit-center-head h2,
.credit-center-head p {
  color: inherit !important;
}

.credit-center-head > div:first-child > span {
  display: none !important;
}

.credit-center-head h2 {
  margin: 0 0 6px !important;
  color: #101827 !important;
  font-size: 30px !important;
  font-weight: 780 !important;
}

.credit-center-head p {
  color: #52647d !important;
  font-size: 14px !important;
}

.credit-center-head .small-icon-button {
  color: #4f46e5 !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08) !important;
  backdrop-filter: blur(10px);
}

.credit-center-head-actions {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  flex: 0 0 auto;
}

.credit-mini-action {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(79, 70, 229, 0.16);
  border-radius: 999px;
  color: #475569;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: none;
  font-size: 13px;
  font-weight: 800;
  backdrop-filter: blur(10px);
}

.credit-mini-action i {
  width: 15px;
  height: 15px;
  color: #4f46e5;
  stroke-width: 2.3;
}

.credit-mini-action[data-credit-action-view="plans"] {
  border-color: rgba(15, 118, 110, 0.18);
}

.credit-mini-action[data-credit-action-view="plans"] i {
  color: #0f766e;
}

.credit-mini-action:hover {
  color: #111827;
  border-color: rgba(79, 70, 229, 0.26);
  background: #fff;
  filter: none;
  transform: translateY(-1px);
}

.credit-mini-action[data-credit-action-view="plans"]:hover {
  border-color: rgba(15, 118, 110, 0.28);
}

.credit-center-summary {
  position: relative;
  z-index: 1;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  padding: 0 !important;
}

.credit-summary-card,
.credit-center-summary > div {
  position: relative;
  display: grid;
  gap: 4px;
  align-content: center;
  min-width: 0;
  min-height: 94px !important;
  padding: 14px 16px !important;
  border: 1px solid rgba(226, 232, 240, 0.92) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.045) !important;
  backdrop-filter: none;
  text-align: left;
}

.credit-summary-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 16px;
  bottom: 16px;
  width: 4px;
  border-radius: 0 999px 999px 0;
  background: #4f46e5;
}

.credit-summary-card:nth-child(2)::before {
  background: #0f766e;
}

button.credit-summary-card {
  cursor: pointer;
}

.credit-center-summary small {
  color: #5b6b84 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.credit-center-summary strong {
  overflow: hidden;
  color: #101827 !important;
  font-size: 28px !important;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.credit-center-summary .credit-total-line {
  display: flex !important;
  flex-wrap: nowrap;
  gap: 14px;
  align-items: baseline;
  min-width: 0;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible;
}

.credit-bucket-row {
  display: flex !important;
  flex-wrap: nowrap;
  gap: 14px;
  align-items: baseline;
  margin-top: 0;
  min-width: 0;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.credit-bucket-pill {
  display: inline-flex;
  gap: 0;
  align-items: center;
  min-height: 18px;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
}

.credit-bucket-pill i {
  display: none;
}

.credit-bucket-pill.is-gift {
  color: #c2410c;
  background: transparent;
}

.credit-bucket-pill.is-subscription {
  color: #4f46e5;
  background: transparent;
}

.credit-bucket-pill.is-recharge {
  color: #047857;
  background: transparent;
}

.credit-summary-card em {
  justify-self: start;
  min-height: 20px;
  padding: 0 8px;
  border-radius: 999px;
  color: #64748b;
  background: #f1f5f9;
  font-size: 11px;
  font-style: normal;
  font-weight: 750;
  line-height: 20px;
}

.credit-center-body {
  min-height: 0 !important;
  padding: 10px 2px 0 0 !important;
}

.credit-pane-intro {
  display: grid;
  gap: 5px;
  margin-bottom: 14px;
}

.credit-pane-intro span {
  color: #6657ff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.credit-pane-intro strong {
  color: #151a27;
  font-size: 20px;
  font-weight: 760;
}

.credit-pane-intro small {
  color: #778196;
  font-size: 13px;
}

.credit-action-modal {
  z-index: 58;
  padding: 14px !important;
  background: rgba(15, 23, 42, 0.16) !important;
  backdrop-filter: blur(10px) saturate(1.04) !important;
  -webkit-backdrop-filter: blur(10px) saturate(1.04) !important;
}

.credit-action-dialog {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 16px;
  width: min(1040px, 94vw);
  max-height: min(840px, calc(100vh - 28px));
  min-height: min(620px, calc(100vh - 28px));
  padding: 26px 28px;
  overflow: hidden;
  border: 1px solid rgba(226, 232, 240, 0.86);
  border-radius: 24px;
  background: rgba(248, 250, 252, 0.98);
  box-shadow: 0 36px 110px rgba(15, 23, 42, 0.28);
}

.credit-action-modal.is-plans .credit-action-dialog {
  width: min(1540px, 96vw);
  height: min(940px, calc(100vh - 12px));
  max-height: calc(100vh - 12px);
  min-height: min(700px, calc(100vh - 12px));
  padding: 32px 34px;
  background: rgba(250, 250, 249, 0.98);
}

.credit-action-modal.is-plans .credit-action-head p {
  display: none;
}

.credit-action-modal.is-plans .credit-action-body {
  overflow: hidden;
  padding-right: 0;
  padding-bottom: 8px;
}

.member-plan-switch {
  display: inline-flex;
  justify-self: center;
  gap: 0;
  padding: 0;
  margin: 0 auto 24px;
  overflow: hidden;
  border: 1px solid #111827;
  border-radius: 999px;
  background: #fff;
  box-shadow: none;
}

.member-plan-switch button {
  min-width: 106px;
  min-height: 46px;
  padding: 0 22px;
  border: 0;
  border-radius: 0;
  color: #111827;
  background: transparent;
  font-size: 18px;
  font-weight: 800;
  box-shadow: none;
}

.member-plan-switch button.selected {
  color: #fff;
  background: linear-gradient(135deg, #6657ff, #0f9f9a);
  box-shadow: none;
}

.member-plan-validity {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin: -8px 0 0;
  border: 1px solid #e3e8f0;
  border-radius: 12px;
  background: #f8fafc;
}

.member-plan-validity span {
  display: flex;
  gap: 7px;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 42px;
  padding: 8px 14px;
  border-right: 1px solid #e3e8f0;
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
  text-align: center;
}

.member-plan-validity span:last-child {
  border-right: 0;
}

.member-plan-validity i {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  color: #0f9f9a;
}

.member-plan-validity b {
  color: #334155;
  font-weight: 800;
}

.credit-action-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
}

.credit-action-head h2 {
  margin: 0 0 6px;
  color: #111827;
  font-size: 28px;
  letter-spacing: 0;
}

.credit-action-head p {
  margin: 0;
  color: #64748b;
  font-size: 14px;
}

.credit-action-body {
  min-height: 0;
  overflow: auto;
  padding-right: 4px;
  scrollbar-color: rgba(148, 163, 184, 0.32) transparent;
  scrollbar-width: thin;
}

.credit-action-body::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.credit-action-body::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.26);
}

.credit-action-modal.is-payment .credit-action-dialog {
  width: min(1040px, 94vw);
  min-height: min(620px, calc(100vh - 28px));
  background: #f8fafc;
}

.credit-action-modal.is-payment .credit-action-body {
  overflow: auto;
}

.credit-payment-page {
  display: grid;
  gap: 18px;
  min-height: 0;
}

.credit-payment-hero {
  display: flex;
  gap: 18px;
  align-items: center;
  justify-content: space-between;
  padding: 20px 22px;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 20px;
  background:
    radial-gradient(circle at 88% 18%, rgba(20, 184, 166, 0.16), transparent 28%),
    linear-gradient(135deg, #ffffff, #eff6ff 56%, #ecfeff);
}

.credit-payment-hero span {
  display: block;
  margin-bottom: 8px;
  color: #0f766e;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.08em;
}

.credit-payment-hero strong {
  display: block;
  color: #0f172a;
  font-size: 28px;
  line-height: 1.15;
}

.credit-payment-hero small {
  display: block;
  margin-top: 8px;
  color: #64748b;
  font-size: 14px;
  line-height: 1.55;
}

.credit-payment-secure {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 8px;
  align-items: center;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid rgba(20, 184, 166, 0.28);
  border-radius: 999px;
  color: #0f766e;
  background: rgba(240, 253, 250, 0.92);
  font-size: 13px;
  font-weight: 800;
}

.credit-payment-secure .lucide {
  width: 17px;
  height: 17px;
}

.credit-payment-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 18px;
  align-items: stretch;
}

.credit-payment-order,
.credit-payment-checkout {
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.07);
}

.credit-payment-order {
  display: grid;
  gap: 18px;
  padding: 22px;
}

.credit-payment-section-title {
  display: grid;
  gap: 6px;
}

.credit-payment-section-title span {
  color: #64748b;
  font-size: 13px;
  font-weight: 750;
}

.credit-payment-section-title strong {
  color: #111827;
  font-size: 22px;
}

.credit-payment-detail-list {
  display: grid;
  gap: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid #e8edf5;
  border-radius: 16px;
}

.credit-payment-detail-list div {
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr);
  min-height: 48px;
  border-bottom: 1px solid #edf2f7;
}

.credit-payment-detail-list div:last-child {
  border-bottom: 0;
}

.credit-payment-detail-list dt,
.credit-payment-detail-list dd {
  display: flex;
  align-items: center;
  margin: 0;
  min-width: 0;
  padding: 0 14px;
  font-size: 13px;
}

.credit-payment-detail-list dt {
  color: #64748b;
  background: #f8fafc;
  font-weight: 750;
}

.credit-payment-detail-list dd {
  overflow: hidden;
  color: #1f2937;
  font-weight: 720;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.credit-payment-note {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 58px;
  padding: 12px 14px;
  border-radius: 16px;
  color: #475569;
  background: #f8fafc;
  font-size: 13px;
  line-height: 1.55;
}

.credit-payment-note .lucide {
  width: 22px;
  height: 22px;
  color: #2563eb;
}

.credit-payment-checkout {
  display: grid;
  gap: 16px;
  align-content: start;
  padding: 22px;
}

.credit-payment-amount {
  display: grid;
  gap: 8px;
  padding: 18px;
  border-radius: 18px;
  color: #fff;
  background: linear-gradient(135deg, #0f172a, #1d4ed8 58%, #0f766e);
}

.credit-payment-amount span {
  color: rgba(255, 255, 255, 0.78);
  font-size: 13px;
  font-weight: 750;
}

.credit-payment-amount strong {
  color: #fff;
  font-size: 42px;
  line-height: 1;
}

.credit-payment-amount small {
  color: rgba(255, 255, 255, 0.82);
  font-size: 13px;
  font-weight: 750;
  line-height: 1.45;
}

.credit-payment-method {
  display: grid;
  gap: 10px;
}

.credit-payment-method > span {
  color: #64748b;
  font-size: 13px;
  font-weight: 750;
}

.credit-payment-method button {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 4px 10px;
  align-items: center;
  min-height: 66px;
  padding: 12px;
  border: 1px solid #e4e8f0;
  border-radius: 16px;
  color: #344054;
  background: #ffffff;
  text-align: left;
  cursor: pointer;
  transition: border-color 160ms ease, background-color 160ms ease;
}

.credit-payment-method button.selected {
  border-color: rgba(91, 75, 232, 0.48);
  background: #f7f5ff;
}

.credit-payment-method button .payment-brand-logo {
  grid-row: span 2;
  align-self: center;
}

.credit-payment-method button strong {
  color: #273142;
  font-size: 15px;
}

.credit-payment-method button.selected strong {
  color: #5145cd;
}

.credit-payment-method button small {
  color: #64748b;
  font-size: 12px;
}

.payment-brand-logo {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  overflow: hidden;
}

.payment-brand-logo.is-alipay {
  border-radius: 8px;
}

.payment-brand-logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.payment-brand-logo.is-wechat {
  border-radius: 0;
}

.credit-payment-submit,
.credit-payment-back {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  border: 0;
  border-radius: 15px;
  font-size: 15px;
  font-weight: 850;
  cursor: pointer;
}

.credit-payment-submit {
  color: #fff;
  background: #1677ff;
  box-shadow: 0 16px 28px rgba(22, 119, 255, 0.24);
}

.credit-payment-submit:hover {
  background: #0958d9;
}

.credit-payment-submit:disabled {
  cursor: wait;
  opacity: 0.78;
}

.credit-payment-back {
  color: #475569;
  background: #f1f5f9;
}

.credit-payment-back:hover {
  background: #e2e8f0;
}

.credit-payment-submit .lucide,
.credit-payment-back .lucide {
  width: 18px;
  height: 18px;
}

.credit-payment-checkout p {
  margin: 0;
  color: #94a3b8;
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
  overflow-wrap: anywhere;
}

.credit-wechat-pay-box {
  border: 1px solid #d8f3df;
  background: #f7fffa;
  border-radius: 8px;
  padding: 14px;
}

.credit-wechat-qr {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}

.credit-wechat-qr img {
  width: 132px;
  height: 132px;
  padding: 8px;
  border: 1px solid #e3e8ef;
  border-radius: 8px;
  background: #fff;
}

.credit-wechat-qr strong,
.credit-wechat-qr span {
  display: block;
}

.credit-wechat-qr strong {
  color: #132238;
  font-size: 15px;
}

.credit-wechat-qr span {
  margin-top: 6px;
  color: #667085;
  font-size: 13px;
}

.credit-wechat-qr button {
  margin-top: 12px;
  border: 0;
  border-radius: 8px;
  padding: 9px 12px;
  background: #16a34a;
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}

body > .modal-backdrop.payment-pending-modal {
  z-index: 120200 !important;
  padding: 18px;
  background: rgba(15, 23, 42, 0.22) !important;
  backdrop-filter: blur(7px) saturate(1.02);
}

.payment-pending-card {
  position: relative;
  display: grid;
  gap: 18px;
  width: min(420px, calc(100vw - 28px));
  max-height: calc(100vh - 28px);
  overflow: auto;
  padding: 28px;
  border: 1px solid rgba(226, 232, 240, 0.96);
  border-radius: 18px;
  background: #ffffff;
}

.payment-pending-close {
  position: absolute;
  top: 14px;
  right: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #7b8495;
  background: #f4f6f9;
  cursor: pointer;
}

.payment-pending-close svg {
  width: 16px;
  height: 16px;
  stroke-width: 1.8;
}

.payment-pending-brand {
  display: flex;
  gap: 12px;
  align-items: center;
  padding-right: 38px;
}

.payment-pending-brand .payment-brand-logo {
  width: 42px;
  height: 42px;
}

.payment-pending-brand strong,
.payment-pending-brand span {
  display: block;
}

.payment-pending-brand strong {
  color: #182230;
  font-size: 19px;
}

.payment-pending-brand span {
  margin-top: 4px;
  color: #667085;
  font-size: 13px;
}

.payment-pending-qr {
  display: grid;
  justify-items: center;
  gap: 10px;
  padding: 18px;
  border: 1px solid #e8edf4;
  border-radius: 14px;
  background: #fafbfc;
}

.payment-pending-qr img {
  width: 220px;
  max-width: 100%;
  aspect-ratio: 1;
  padding: 8px;
  border: 1px solid #edf0f5;
  border-radius: 10px;
  background: #ffffff;
}

.payment-pending-qr span {
  color: #475467;
  font-size: 13px;
}

.payment-pending-alipay-state {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 4px 12px;
  align-items: center;
  min-height: 88px;
  padding: 16px;
  border: 1px solid #dcecff;
  border-radius: 14px;
  background: #f6faff;
}

.payment-pending-alipay-state svg {
  grid-row: span 2;
  width: 26px;
  height: 26px;
  color: #1677ff;
  stroke-width: 1.7;
}

.payment-pending-alipay-state strong {
  color: #25324a;
  font-size: 15px;
}

.payment-pending-alipay-state span {
  color: #667085;
  font-size: 13px;
  line-height: 1.5;
}

.payment-pending-confirm {
  width: 100%;
  min-height: 46px;
  border: 0;
  border-radius: 12px;
  color: #ffffff;
  background: #171b27;
  font-size: 15px;
  font-weight: 750;
  cursor: pointer;
}

.payment-pending-confirm:hover {
  background: #272d3c;
}

.payment-pending-confirm:disabled {
  cursor: wait;
  opacity: 0.68;
}

.payment-check-result {
  margin: -8px 0 0;
  color: #b54708;
  font-size: 13px;
  line-height: 1.45;
  text-align: center;
}

.payment-check-result[hidden] {
  display: none;
}

body > .modal-backdrop.payment-success-modal {
  z-index: 120400 !important;
  background: rgba(15, 23, 42, 0.18) !important;
  backdrop-filter: blur(7px) saturate(1.02);
}

body > .modal-backdrop.payment-success-modal .modal-card {
  position: relative;
  z-index: 1;
}

@media (max-width: 720px) {
  .credit-center-dialog {
    width: min(100%, 96vw) !important;
    height: calc(100vh - 12px) !important;
    max-height: calc(100vh - 12px) !important;
    padding: 22px 18px !important;
    border-radius: 20px !important;
  }

  .credit-center-head {
    gap: 12px !important;
  }

  .credit-center-head h2 {
    font-size: 24px !important;
  }

  .credit-center-summary {
    grid-template-columns: 1fr !important;
  }

  .credit-center-summary > div {
    min-height: 82px !important;
  }

  .credit-center-summary .credit-total-line,
  .credit-bucket-row {
    flex-wrap: wrap;
  }

  .credit-payment-hero,
  .credit-payment-layout {
    grid-template-columns: 1fr;
  }

  .credit-payment-hero {
    display: grid;
  }

  .credit-payment-layout {
    display: grid;
  }

  .credit-payment-detail-list div {
    grid-template-columns: 92px minmax(0, 1fr);
  }
}

html[data-theme="dark"] #profile-modal .profile-card,
html[data-theme="dark"] .credit-action-dialog {
  border-color: #2b3648 !important;
  background: #111827 !important;
}

html[data-theme="dark"] #profile-modal .profile-invite-combined,
html[data-theme="dark"] .credit-redeem-panel {
  border-color: #303c50 !important;
  background: #172033 !important;
}

html[data-theme="dark"] #profile-modal .profile-invite-summary strong,
html[data-theme="dark"] #profile-modal .profile-invite-binding > span,
html[data-theme="dark"] .credit-redeem-panel strong {
  color: #e5e7eb !important;
}

html[data-theme="dark"] #profile-modal .profile-invite-summary span,
html[data-theme="dark"] #profile-modal .profile-invite-binding > small,
html[data-theme="dark"] .credit-redeem-panel small,
html[data-theme="dark"] .credit-redeem-panel > span {
  color: #9aa7ba !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #upload-clear-x {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-delete {
  top: -6px !important;
  right: -4px !important;
  z-index: 5 !important;
  width: 19px !important;
  height: 19px !important;
  padding: 0 !important;
  border: 1.5px solid #fff !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: rgba(235, 52, 82, 0.96) !important;
  box-shadow: 0 7px 14px rgba(223, 63, 85, 0.2) !important;
  opacity: 0.92 !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-delete .lucide {
  width: 11px !important;
  height: 11px !important;
  stroke-width: 3 !important;
  color: currentColor !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot:hover .detail-upload-delete,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-delete:focus-visible {
  opacity: 1 !important;
  transform: translateY(-1px) scale(1.04) !important;
  background: #df3f55 !important;
}

body.feature-showcase-mode.feature-focus-mode.workstation-feature-mode[data-active-feature]
  .preview-frame
  .set-preview-board-head
  > .feature-image-showcase-logo {
  width: 124px !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 124px !important;
  max-height: 20px !important;
  object-fit: contain !important;
  object-position: left center !important;
  transform: translateY(-50%) !important;
}

/* Make outfit recommendation selections immediately distinguishable. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button.selected:not(:disabled):not([aria-disabled="true"]):not(.is-disabled),
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button.is-selected:not(:disabled):not([aria-disabled="true"]):not(.is-disabled) {
  border-color: #6655ed !important;
  color: #ffffff !important;
  background: #6d5df3 !important;
  background-image: none !important;
  box-shadow: 0 0 0 3px rgba(109, 93, 243, 0.18) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button.selected:not(:disabled):not([aria-disabled="true"]):not(.is-disabled) strong,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button.is-selected:not(:disabled):not([aria-disabled="true"]):not(.is-disabled) strong {
  color: #ffffff !important;
  font-weight: 620 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button.selected:not(:disabled):not([aria-disabled="true"]):not(.is-disabled) small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button.is-selected:not(:disabled):not([aria-disabled="true"]):not(.is-disabled) small {
  color: rgba(255, 255, 255, 0.86) !important;
}

.auth-register-agreement {
  display: flex !important;
  align-items: flex-start;
  gap: 8px;
  order: 5;
  width: 100%;
  color: #6f7789;
  font-size: 12px;
  line-height: 1.6;
  cursor: pointer;
}

.auth-register-agreement[hidden] {
  display: none !important;
}

.auth-form .auth-register-agreement > input[type="checkbox"] {
  flex: 0 0 16px;
  width: 16px !important;
  min-width: 16px;
  height: 16px !important;
  min-height: 16px;
  padding: 0;
  margin: 2px 0 0;
  border: 0;
  border-radius: 3px;
  box-shadow: none;
  appearance: auto;
  -webkit-appearance: checkbox;
  accent-color: #6657e8;
}

.auth-register-agreement > span {
  display: inline;
  min-width: 0;
  writing-mode: horizontal-tb;
  white-space: normal;
  overflow-wrap: normal;
}

.auth-register-agreement a {
  color: #5a4fd1;
  text-decoration: none;
}

#auth-message {
  order: 6;
}

.generation-concurrency-notice {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0 2px;
  border: 0;
  color: #c56a08;
  background: transparent;
  font-size: 12px;
  line-height: 20px;
  white-space: nowrap;
  overflow: hidden;
}

.generation-concurrency-notice[hidden] {
  display: none !important;
}

.generation-concurrency-notice .lucide {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  color: #d97706;
}

.generation-concurrency-notice span {
  min-width: 0;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
}

.generation-concurrency-notice.is-readiness {
  color: #52647f;
}

.generation-concurrency-notice.is-readiness .lucide {
  color: #5f7fb7;
}

.generate-action-row.has-concurrency-notice,
.free-page-actions.has-concurrency-notice {
  position: relative;
  padding-bottom: 28px !important;
}

.generate-action-row > .generation-concurrency-notice,
.free-page-actions > .generation-concurrency-notice {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;
}

button.is-concurrency-blocked {
  cursor: not-allowed !important;
  filter: saturate(0.55);
}

button.is-input-incomplete {
  cursor: not-allowed !important;
}

.generation-concurrency-notice.is-mobile {
  position: fixed;
  right: 18px;
  bottom: 74px;
  z-index: 21;
  width: min(360px, calc(100vw - 36px));
  padding: 5px 9px;
  border: 1px solid #f5c98d;
  border-radius: 6px;
  background: #fff8ed;
  box-shadow: 0 8px 20px rgba(79, 53, 22, 0.12);
}

html[data-theme="dark"] .generation-concurrency-notice {
  color: #fbd38d;
  background: transparent;
}

html[data-theme="dark"] .generation-concurrency-notice.is-mobile {
  border-color: #754b1f;
  background: #2a2117;
}

.work-retry-action {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 5px;
  min-height: 28px;
  margin-top: 4px;
  padding: 4px 9px;
  border: 1px solid #c9d8f2;
  border-radius: 6px;
  color: #1d5fc7;
  background: #f6f9ff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
  cursor: pointer;
}

.work-retry-action .lucide {
  width: 13px;
  height: 13px;
}

.work-retry-action.compact {
  margin: 4px 8px 8px;
}

html[data-theme="dark"] .work-retry-action {
  border-color: #40567b;
  color: #9cc2ff;
  background: #1d2a40;
}

@media (max-width: 760px) {
  .generation-concurrency-notice {
    font-size: 11px;
  }
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-strip {
  grid-template-columns: repeat(3, 68px) !important;
  gap: 9px !important;
  align-items: end !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #product-upload {
  min-height: 148px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #upload-clear-x {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #upload-clear-x {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot {
  display: grid !important;
  grid-template-rows: auto 16px !important;
  justify-items: center !important;
  align-items: start !important;
  gap: 4px !important;
  width: 68px !important;
  min-height: 112px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot:hover {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot-frame {
  width: 64px !important;
  height: auto !important;
  aspect-ratio: 3 / 4 !important;
  border: 1px dashed rgba(195, 199, 217, 0.92) !important;
  border-radius: 13px !important;
  background: rgba(247, 248, 252, 0.96) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot.is-filled .detail-upload-slot-frame {
  border-style: solid !important;
  border-color: rgba(215, 219, 232, 0.95) !important;
  background: #fff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-delete {
  top: -6px !important;
  right: -4px !important;
  z-index: 5 !important;
  width: 19px !important;
  height: 19px !important;
  padding: 0 !important;
  border: 1.5px solid #fff !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: rgba(235, 52, 82, 0.96) !important;
  box-shadow: 0 7px 14px rgba(223, 63, 85, 0.2) !important;
  opacity: 0.92 !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-delete .lucide {
  width: 11px !important;
  height: 11px !important;
  stroke-width: 3 !important;
  color: currentColor !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot:hover .detail-upload-delete,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-delete:focus-visible {
  opacity: 1 !important;
  transform: translateY(-1px) scale(1.04) !important;
  background: #df3f55 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-delete {
  top: -6px !important;
  right: -4px !important;
  z-index: 5 !important;
  width: 19px !important;
  height: 19px !important;
  padding: 0 !important;
  border: 1.5px solid #fff !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: rgba(235, 52, 82, 0.96) !important;
  box-shadow: 0 7px 14px rgba(223, 63, 85, 0.2) !important;
  opacity: 0.92 !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-delete .lucide {
  width: 11px !important;
  height: 11px !important;
  stroke-width: 3 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot:hover .detail-upload-delete,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-delete:focus-visible {
  opacity: 1 !important;
  transform: translateY(-1px) scale(1.04) !important;
  background: #df3f55 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot small {
  width: 100% !important;
  height: 16px !important;
  font-size: 11px !important;
  line-height: 16px !important;
  font-weight: 500 !important;
  color: #697386 !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot .lucide {
  width: 21px !important;
  height: 21px !important;
  color: #394150 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot:hover .detail-upload-slot-frame {
  border-color: rgba(113, 91, 255, 0.72) !important;
  background: #f6f3ff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot.is-dragover {
  background: transparent !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot.is-dragover::after {
  inset: -5px 1px 14px !important;
  border-radius: 17px !important;
}

#profile-modal .profile-actions {
  gap: 9px;
}

#profile-modal .profile-actions #profile-close,
#profile-modal .profile-actions #profile-save {
  width: 82px;
  min-width: 82px;
  height: 36px;
  min-height: 36px;
  padding: 0 !important;
  border: 1px solid #cfd7e3;
  border-radius: 7px !important;
  font-size: 13px;
  font-weight: 750;
  line-height: 34px;
  box-shadow: none !important;
}

#profile-modal .profile-actions #profile-close {
  color: #4b5870;
  background: #fff;
}

#profile-modal .profile-actions #profile-save {
  color: #fff;
  border-color: #315f9f;
  background: #315f9f;
}

#profile-modal .profile-actions #profile-close:hover {
  border-color: #9eabbd;
  background: #f7f9fc;
}

#profile-modal .profile-actions #profile-save:hover {
  border-color: #274f86;
  background: #274f86;
}

/* Personal center: compact two-column workspace. */
#profile-modal .profile-card {
  width: min(840px, calc(100vw - 28px)) !important;
  max-height: calc(100vh - 30px) !important;
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid #dfe5ed !important;
  border-radius: 12px !important;
  color: #1f2937 !important;
  background: #f7f9fc !important;
  box-shadow: 0 24px 70px rgba(26, 39, 61, 0.2) !important;
}

#profile-modal .profile-center-head {
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) !important;
  gap: 13px !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 18px 20px 15px !important;
  border-bottom: 1px solid #e4e9f0;
  background: #fff;
}

#profile-modal .profile-center-head h2 {
  margin: 1px 0 0 !important;
  color: #182235 !important;
  font-size: 22px !important;
  line-height: 1.15 !important;
}

#profile-modal .profile-center-head p {
  margin: 4px 0 0 !important;
  color: #7a8699 !important;
  font-size: 12px !important;
}

#profile-modal .profile-center-head > div > span {
  color: #54729d !important;
  font-size: 10px !important;
  font-weight: 800;
}

#profile-modal .profile-avatar-edit,
#profile-modal .profile-avatar-edit span {
  width: 54px !important;
  height: 54px !important;
  min-height: 54px !important;
  border-radius: 9px !important;
}

#profile-modal .profile-center-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.14fr) minmax(280px, 0.86fr) !important;
  gap: 11px !important;
  max-height: calc(100vh - 160px);
  padding: 14px 16px 4px !important;
  overflow: auto;
}

#profile-modal .profile-panel {
  border: 1px solid #e1e7ef !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 3px 12px rgba(31, 45, 67, 0.035) !important;
}

#profile-modal .profile-account-compact {
  grid-column: 1;
  padding: 14px !important;
}

#profile-modal .profile-panel-title {
  margin-bottom: 11px !important;
}

#profile-modal .profile-panel-title strong {
  color: #253147 !important;
  font-size: 13px !important;
}

#profile-modal .profile-form-compact {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}

#profile-modal .profile-form-compact label {
  height: 39px !important;
  padding: 0 11px !important;
  border: 1px solid #e4e9f0 !important;
  border-radius: 6px !important;
  color: #778398 !important;
  background: #f8fafc !important;
}

#profile-modal .profile-form-compact label > span {
  font-size: 12px !important;
}

#profile-modal .profile-form-compact input {
  height: 35px !important;
  color: #1d293d !important;
  background: transparent !important;
  font-size: 13px !important;
}

#profile-modal .profile-form-compact label:has(input:not([readonly]))::after {
  color: #5576a7 !important;
}

#profile-modal .profile-stat-grid {
  grid-column: 2;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  padding: 12px !important;
  border: 1px solid #e1e7ef !important;
  border-radius: 8px !important;
  background: #fff !important;
}

#profile-modal .profile-stat-grid article {
  min-height: 43px !important;
  border-radius: 6px !important;
}

#profile-modal .profile-stat-grid article span,
#profile-modal .profile-stat-grid article strong {
  font-size: 12px !important;
}

#profile-modal .profile-stat-grid article strong {
  margin-left: auto !important;
  text-align: right;
}

#profile-modal .profile-invite-combined,
#profile-modal .profile-service-panel,
#profile-modal #profile-message {
  grid-column: 1 / -1;
}

#profile-modal .profile-invite-combined {
  gap: 11px !important;
  padding: 13px 14px !important;
  border-color: #dce4ef !important;
  background: #fff !important;
}

#profile-modal .profile-promotion-icon {
  width: 36px !important;
  height: 36px !important;
  color: #fff !important;
  background: #426da8 !important;
}

#profile-modal .profile-invite-summary > button {
  color: #365f96 !important;
  border-color: #cbd8e8 !important;
  background: #f7faff !important;
}

#profile-modal .profile-invite-binding {
  border-color: #e7ebf1 !important;
}

#profile-modal .profile-invite-binding input {
  color: #263247 !important;
  border-color: #dfe5ed !important;
  background: #f8fafc !important;
}

#profile-modal .profile-invite-binding button {
  color: #3d5f8d !important;
  border-color: #cdd8e6 !important;
  background: #fff !important;
}

#profile-modal .profile-service-panel {
  padding: 13px 14px !important;
}

#profile-modal .profile-action-grid-wide {
  gap: 8px !important;
}

#profile-modal .profile-action-grid-wide button {
  min-height: 42px !important;
  color: #334155 !important;
  border: 1px solid #e2e7ee !important;
  border-radius: 6px !important;
  background: #f8fafc !important;
}

#profile-modal .profile-action-grid-wide button:hover {
  border-color: #c8d5e5 !important;
  background: #f1f6fc !important;
}

#profile-modal .profile-actions {
  margin: 0 !important;
  padding: 12px 16px 14px !important;
  border-top: 1px solid #e5eaf1;
  background: #fff;
}

@media (max-width: 720px) {
  #profile-modal .profile-card {
    width: calc(100vw - 16px) !important;
  }

  #profile-modal .profile-center-head {
    padding: 14px !important;
  }

  #profile-modal .profile-center-grid {
    grid-template-columns: 1fr !important;
    max-height: calc(100vh - 145px);
    padding: 10px 11px 3px !important;
  }

  #profile-modal .profile-account-compact,
  #profile-modal .profile-stat-grid {
    grid-column: 1;
  }

  #profile-modal .profile-stat-grid {
    grid-template-columns: 1fr !important;
  }

  #profile-modal .profile-invite-summary {
    grid-template-columns: 34px minmax(0, 1fr) !important;
  }

  #profile-modal .profile-invite-summary > button {
    grid-column: 1 / -1;
    justify-content: center;
  }
}

.credit-package-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(300px, 0.95fr);
  gap: 18px;
  align-items: stretch;
  margin-bottom: 18px;
  padding: 20px;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 18px;
  background: linear-gradient(135deg, #ffffff, #f7fbff 56%, #eef2ff);
}

.credit-package-hero span {
  display: inline-flex;
  margin-bottom: 8px;
  color: #4f46e5;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.credit-package-hero strong {
  display: block;
  color: #111827;
  font-size: 28px;
  line-height: 1.15;
}

.credit-package-hero small {
  display: block;
  margin-top: 8px;
  color: #64748b;
  font-size: 14px;
  line-height: 1.6;
}

.credit-package-hero ul {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.credit-package-hero li {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  color: #475569;
  font-size: 13px;
  font-weight: 650;
}

.credit-package-hero li span {
  margin: 0;
  color: inherit;
  font-size: inherit;
  letter-spacing: 0;
}

.credit-package-hero li .lucide {
  width: 17px;
  height: 17px;
  color: #14b8a6;
}

.credit-package-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

.credit-package-card {
  gap: 10px !important;
  min-height: 350px;
  padding: 16px !important;
  overflow: hidden;
  border: 1px solid rgba(226, 232, 240, 0.92) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #fff, #fafbff) !important;
  box-shadow: 0 18px 42px rgba(45, 52, 86, 0.075) !important;
}

.credit-package-card::before {
  content: none;
}

.credit-package-card.is-recommended {
  color: #fff;
  border-color: rgba(102, 87, 255, 0.28) !important;
  background:
    radial-gradient(circle at 82% 10%, rgba(255, 255, 255, 0.22), transparent 26%),
    linear-gradient(155deg, #171b28, #4f46e5 70%, #14b8a6) !important;
  box-shadow: 0 24px 52px rgba(79, 70, 229, 0.24) !important;
}

.credit-package-top,
.credit-package-price,
.credit-package-meta,
.credit-package-usage,
.credit-package-member-prices,
.credit-package-card p,
.credit-package-card button {
  position: relative;
  z-index: 1;
}

.credit-package-top {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.credit-package-top span {
  color: inherit !important;
  font-size: 15px !important;
}

.credit-package-top em {
  min-height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  color: #0f766e !important;
  background: #ccfbf1 !important;
  font-size: 12px;
  line-height: 24px;
}

.credit-package-card.is-recommended .credit-package-top em {
  color: #161b2a !important;
  background: #fff !important;
}

.credit-package-price {
  display: grid;
  gap: 6px;
  margin-top: 4px;
}

.credit-package-price-main {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
}

.credit-package-price strong {
  color: #4f46e5 !important;
  font-size: 34px !important;
  line-height: 1;
  letter-spacing: 0;
}

.credit-package-price small {
  min-height: auto !important;
  color: #4f46e5 !important;
  font-size: 14px !important;
  font-weight: 800;
}

.credit-package-current-pay {
  display: inline-flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 5px;
  min-width: 0;
  padding-bottom: 3px;
  text-align: right;
}

.credit-package-current-pay b {
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.credit-package-current-pay em {
  justify-self: end !important;
  min-height: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  color: #4f46e5 !important;
  background: transparent !important;
  font-size: 21px !important;
  font-style: normal;
  font-weight: 900;
  line-height: 1.05;
  white-space: nowrap;
}

.credit-package-card.is-recommended .credit-package-price small {
  color: rgba(255, 255, 255, 0.86) !important;
}

.credit-package-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.credit-package-meta b {
  min-height: 26px;
  padding: 0 8px;
  border-radius: 999px;
  color: #606a7d;
  background: #f3f5fa;
  font-size: 12px;
  line-height: 26px;
}

.credit-package-card.is-recommended .credit-package-meta b {
  color: #fff;
  background: rgba(255, 255, 255, 0.14);
}

.credit-package-card p {
  margin: 2px 0 0;
  min-height: 36px;
  color: #64748b;
  font-size: 13px;
  line-height: 1.5;
}

.credit-package-card.is-recommended p {
  color: rgba(255, 255, 255, 0.78);
}

.credit-package-usage {
  display: grid;
  gap: 6px;
  margin-top: auto;
}

.credit-package-usage span {
  min-height: 24px;
  padding: 0 8px;
  border-radius: 8px;
  color: #475569 !important;
  background: rgba(241, 245, 249, 0.9);
  font-size: 12px !important;
  line-height: 24px;
  font-weight: 700;
}

.credit-package-card.is-recommended .credit-package-usage span {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.14);
}

.credit-package-member-prices {
  display: grid;
  gap: 3px;
  padding-top: 8px;
  border-top: 1px solid #e7ebf2;
}

.credit-package-member-list {
  display: grid;
  gap: 0;
}

.credit-package-member-head,
.credit-package-member-row {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(48px, 0.62fr) minmax(56px, 0.78fr);
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.credit-package-member-head {
  min-height: 22px;
  color: #94a3b8;
  font-size: 10px;
  font-weight: 750;
}

.credit-package-member-head span:nth-child(n + 2) {
  text-align: right;
}

.credit-package-member-row {
  min-height: 32px;
  padding: 4px 0;
  border-bottom: 1px solid #eef1f5;
}

.credit-package-member-row:last-child {
  border-bottom: 0;
}

.credit-package-member-row b,
.credit-package-member-row strong,
.credit-package-member-row em {
  min-width: 0;
  line-height: 1.25;
  white-space: nowrap;
}

.credit-package-member-row b {
  display: inline-flex;
  gap: 4px;
  align-items: center;
  color: #475569;
  font-size: 12px;
  font-weight: 750;
}

.credit-package-member-row b i {
  color: #0f766e;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}

.credit-package-member-row strong,
.credit-package-member-row em {
  justify-self: end;
  text-align: right;
}

.credit-package-member-row strong {
  color: #111827;
  font-size: 13px;
  font-weight: 850;
}

.credit-package-member-row em {
  min-height: 0;
  padding: 0;
  border-radius: 0;
  color: #4f46e5 !important;
  background: transparent !important;
  font-style: normal;
  font-size: 11px !important;
  font-weight: 800;
}

html[data-theme="dark"] .credit-package-current-pay b,
html[data-theme="dark"] .credit-package-member-head {
  color: #94a3b8;
}

html[data-theme="dark"] .credit-package-member-row b,
html[data-theme="dark"] .credit-package-member-row strong {
  color: #e5e7eb;
}

.credit-package-card button,
.member-plan-card button,
.credit-checkin-card button {
  min-height: 44px !important;
  border-radius: 14px !important;
  background: #171b28 !important;
  box-shadow: 0 14px 28px rgba(23, 27, 40, 0.16) !important;
}

.credit-package-card.is-recommended button {
  color: #171b28 !important;
  background: #fff !important;
}

.member-plan-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(200px, 1fr)) !important;
  gap: 16px !important;
  min-width: 1064px;
  padding: 0;
}

.member-plan-board {
  overflow-x: auto;
  overflow-y: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  scrollbar-color: rgba(148, 163, 184, 0.28) transparent;
  scrollbar-width: thin;
}

.credit-action-modal.is-plans .member-plan-board {
  padding-top: 18px;
}

.member-plan-board::-webkit-scrollbar {
  height: 6px;
}

.member-plan-board::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.24);
}

.member-plan-card {
  display: grid !important;
  position: relative;
  --plan-accent: #4f46e5;
  --plan-accent-soft: rgba(79, 70, 229, 0.08);
  grid-template-rows: auto auto minmax(0, 1fr) auto auto;
  gap: 12px !important;
  min-height: 430px;
  padding: 22px 18px 20px !important;
  overflow: visible;
  border: 1px solid rgba(226, 232, 240, 0.9) !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: none !important;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    background-color 180ms ease;
}

.member-plan-card:hover {
  border-color: rgba(79, 70, 229, 0.28) !important;
  background: #fff !important;
  transform: translateY(-4px);
}

.member-plan-card:nth-child(1) {
  --plan-accent: #475569;
  --plan-accent-soft: rgba(71, 85, 105, 0.07);
}

.member-plan-card:nth-child(2) {
  --plan-accent: #475569;
  --plan-accent-soft: rgba(71, 85, 105, 0.07);
}

.member-plan-card:nth-child(3) {
  --plan-accent: #475569;
  --plan-accent-soft: rgba(71, 85, 105, 0.07);
}

.member-plan-card:nth-child(4) {
  --plan-accent: #475569;
  --plan-accent-soft: rgba(71, 85, 105, 0.07);
}

.member-plan-card:nth-child(5) {
  --plan-accent: #4f46e5;
  --plan-accent-soft: rgba(79, 70, 229, 0.1);
}

.member-plan-card:nth-child(6) {
  --plan-accent: #475569;
  --plan-accent-soft: rgba(71, 85, 105, 0.07);
}

.member-plan-card.is-current {
  border-color: rgba(79, 70, 229, 0.34) !important;
  background:
    linear-gradient(180deg, rgba(79, 70, 229, 0.028), #fff 30%) !important;
}

.member-plan-card.is-featured {
  --plan-accent: #4f46e5;
  --plan-accent-soft: rgba(79, 70, 229, 0.1);
  border-color: rgba(79, 70, 229, 0.48) !important;
  background:
    linear-gradient(180deg, rgba(79, 70, 229, 0.045), #fff 36%) !important;
}

.member-plan-popular {
  position: absolute;
  top: -18px;
  left: 50%;
  min-height: 30px;
  padding: 0 16px;
  border-radius: 999px;
  color: #fff;
  background: #4f46e5;
  font-size: 12px;
  font-weight: 800;
  line-height: 30px;
  transform: translateX(-50%);
}

.member-plan-current {
  position: absolute;
  top: 16px;
  right: 16px;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  color: #4f46e5;
  background: rgba(79, 70, 229, 0.09);
  font-size: 11px;
  font-weight: 800;
  line-height: 24px;
}

.member-plan-popular + .member-plan-current {
  top: 18px;
}

.member-plan-packages .credit-pane-intro {
  margin-bottom: 14px;
}

.member-plan-packages .credit-package-grid {
  padding-bottom: 4px;
}

@media (max-width: 1040px) {
  .credit-package-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  .credit-package-hero {
    grid-template-columns: 1fr;
  }

  .credit-package-grid {
    grid-template-columns: 1fr !important;
  }
}

.member-plan-head {
  display: grid !important;
  grid-template-columns: 1fr;
  align-items: start !important;
  gap: 0;
  min-height: 60px;
}

.member-plan-head > i {
  display: none;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  color: var(--plan-accent);
  background: var(--plan-accent-soft);
}

.member-plan-card.is-featured .member-plan-head > i {
  color: #fff;
  background: var(--plan-accent);
}

.member-plan-head em {
  justify-self: end;
  min-height: 22px !important;
  padding: 0 12px !important;
  border: 1px dashed rgba(245, 158, 11, 0.72);
  border-radius: 999px !important;
  color: #f97316 !important;
  background: transparent !important;
  font-size: 12px !important;
  font-style: normal;
  font-weight: 800 !important;
  line-height: 22px !important;
}

.member-plan-head strong {
  color: #1f2937 !important;
  font-size: 22px !important;
  line-height: 1.15;
}

.member-plan-head small {
  margin-top: 4px;
  color: #6b7280 !important;
  font-size: 12px !important;
  line-height: 1.35;
}

.member-plan-price {
  display: grid;
  gap: 6px;
  align-content: start;
  min-height: 70px;
}

.member-plan-price-main {
  display: flex;
  gap: 6px;
  align-items: flex-end;
}

.member-plan-price strong {
  color: #4f46e5 !important;
  font-size: 34px;
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: 0;
}

.member-plan-price span {
  color: #6b7280;
  font-size: 14px;
  font-weight: 700;
  transform: translateY(-6px);
}

.member-plan-price-note {
  color: #4f46e5;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.45;
}

.member-plan-validity-hero {
  margin-top: -8px;
  margin-bottom: 0;
}

.member-plan-card.is-featured .member-plan-price-note {
  color: #4f46e5;
}

.member-plan-feature-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 8px 0 0;
  list-style: none;
}

.member-plan-feature-list li {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  color: #4b5563 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

.member-plan-feature-list li::before {
  content: none !important;
}

.member-plan-feature-list i {
  width: 18px;
  height: 18px;
  margin-top: 2px;
  color: var(--plan-accent);
}

.member-plan-card button {
  width: 100%;
  min-height: 44px !important;
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  color: #fff !important;
  background: #4f46e5 !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  transition:
    background-color 180ms ease,
    transform 180ms ease;
}

.member-plan-card.is-featured button {
  color: #fff !important;
  border-color: transparent !important;
  background: #4f46e5 !important;
}

.member-plan-card button:hover {
  background: #4338ca !important;
  transform: translateY(-1px);
}

.member-plan-pay-note {
  color: #9ca3af;
  font-size: 11px;
  text-align: center;
}

.credit-checkin-card,
.credit-record-empty {
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 18px 42px rgba(45, 52, 86, 0.075) !important;
}

.detail-template-modal {
  z-index: 48;
  padding: 28px;
  background: rgba(13, 18, 34, 0.52);
}

.detail-template-dialog {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 18px;
  width: min(1180px, 94vw);
  height: min(780px, 88vh);
  padding: 22px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 34px 90px rgba(5, 12, 30, 0.28);
}

.detail-template-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 20px;
}

.detail-template-head span {
  color: #6b62e8;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.detail-template-head h2 {
  margin: 3px 0 4px;
  color: #202538;
  font-size: 24px;
  font-weight: 640;
}

.detail-template-head p {
  margin: 0;
  color: #737b8e;
  font-size: 13px;
  line-height: 1.5;
}

.detail-template-head-actions {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  padding-right: 48px;
}

.detail-template-head-actions .small-icon-button {
  right: 0;
  top: 0;
}

.detail-template-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  align-content: start;
  gap: 14px;
  min-height: 0;
  overflow: auto;
  padding: 2px 6px 8px 2px;
}

.detail-template-card {
  display: grid;
  gap: 9px;
  padding: 9px;
  border: 1px solid #e3e8f3;
  border-radius: 12px;
  background: #fff;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.detail-template-card:hover {
  border-color: rgba(106, 93, 246, 0.36);
  box-shadow: 0 14px 28px rgba(37, 45, 74, 0.1);
  transform: translateY(-1px);
}

.detail-template-card.selected {
  border-color: rgba(106, 93, 246, 0.68);
  box-shadow: 0 0 0 3px rgba(106, 93, 246, 0.12), 0 14px 28px rgba(37, 45, 74, 0.1);
}

.detail-template-image {
  position: relative;
  display: block;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: 9px;
  background: #f1f4f9;
}

.detail-template-image img {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
}

.detail-template-image img.is-loaded {
  opacity: 1;
}

.detail-template-image em {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #8b93a5;
  font-size: 12px;
  font-style: normal;
  font-weight: 520;
}

.detail-template-meta {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.detail-template-meta small {
  color: #7b8395;
  font-size: 11px;
  font-weight: 520;
}

.detail-template-meta strong {
  overflow: hidden;
  color: #252b3e;
  font-size: 13.5px;
  font-weight: 610;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.prompt-card .create-button.is-busy {
  cursor: wait;
  opacity: 0.78;
}

.need-request-card {
  width: min(520px, 94vw);
}

.need-request-form {
  display: grid;
  gap: 8px;
}

.need-request-form span {
  color: #30384d;
  font-size: 13px;
  font-weight: 525;
}

.need-request-form textarea {
  width: 100%;
  min-height: 132px;
  padding: 12px 13px;
  border: 1px solid #e5e3f1;
  border-radius: 14px;
  color: var(--ink);
  background: #fbfbff;
  font: inherit;
  font-size: 14px;
  line-height: 1.55;
  resize: vertical;
  outline: 0;
}

.need-request-form textarea:focus {
  border-color: rgba(123, 97, 255, 0.55);
  box-shadow: 0 0 0 3px rgba(123, 97, 255, 0.1);
}

.need-request-form small {
  min-height: 18px;
  color: var(--purple);
  font-size: 12px;
  font-weight: 525;
}

.need-request-upload {
  display: grid;
  justify-items: center;
  gap: 12px;
  margin-top: 14px;
}

.need-request-dropzone {
  display: grid;
  place-items: center;
  gap: 8px;
  width: min(360px, 100%);
  min-height: 142px;
  padding: 20px;
  border: 1.5px dashed #cfd7ea;
  border-radius: 18px;
  color: #5f6b82;
  background: linear-gradient(180deg, #fbfcff 0%, #f6f8fd 100%);
  text-align: center;
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.need-request-dropzone:hover,
.need-request-dropzone:focus-visible,
.need-request-dropzone.is-dragover {
  border-color: rgba(123, 97, 255, 0.58);
  background: #fff;
  box-shadow: 0 14px 30px rgba(87, 100, 140, 0.1);
  transform: translateY(-1px);
}

.need-request-dropzone .lucide {
  width: 34px;
  height: 34px;
  color: var(--purple);
}

.need-request-dropzone strong {
  color: #252b3e;
  font-size: 15px;
  font-weight: 760;
}

.need-request-dropzone span {
  color: #8993a8;
  font-size: 12.5px;
  font-weight: 560;
}

.need-request-upload .outline-button {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  min-height: 38px;
  padding: 0 14px;
  font-weight: 525;
}

.need-request-image-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(82px, 1fr));
  gap: 8px;
  width: 100%;
}

.need-request-image-item {
  position: relative;
  overflow: hidden;
  border: 1px solid #ece9f5;
  border-radius: 12px;
  background: #f8f7fd;
  aspect-ratio: 1 / 1;
}

.need-request-image-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.need-request-image-item button {
  position: absolute;
  right: 5px;
  top: 5px;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 999px;
  color: #fff;
  background: rgba(25, 29, 42, 0.68);
}

.need-request-contact {
  margin: 12px 0 0;
  color: #656b7e;
  font-size: 13px;
  font-weight: 525;
}

.need-request-contact strong {
  color: var(--purple);
}

#need-request-modal {
  padding: 18px !important;
  background:
    radial-gradient(circle at 50% 12%, rgba(255, 255, 255, 0.28), transparent 34%),
    rgba(23, 24, 34, 0.5) !important;
  backdrop-filter: blur(16px) saturate(1.02) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.02) !important;
}

#need-request-modal .need-request-card {
  position: relative;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  align-items: start;
  gap: 10px 14px;
  width: min(560px, calc(100vw - 32px)) !important;
  max-height: min(720px, calc(100vh - 36px));
  padding: 28px !important;
  overflow: auto;
  border: 1px solid rgba(226, 229, 239, 0.86);
  border-radius: 22px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(251, 252, 255, 0.96)) !important;
  box-shadow: 0 30px 90px rgba(20, 22, 36, 0.24) !important;
}

#need-request-modal .modal-icon {
  grid-row: 1 / span 2;
  width: 48px;
  height: 48px;
  border-radius: 15px;
  color: #5d56f0;
  background:
    linear-gradient(180deg, rgba(247, 247, 255, 0.98), rgba(238, 241, 255, 0.94));
  box-shadow: inset 0 0 0 1px rgba(109, 96, 238, 0.12), 0 12px 28px rgba(60, 70, 120, 0.1);
}

#need-request-modal .modal-icon .lucide {
  width: 23px;
  height: 23px;
}

#need-request-modal .need-request-card h2 {
  align-self: end;
  margin: 1px 0 0 !important;
  color: #1f2433;
  font-size: 26px;
  line-height: 1.12;
  font-weight: 760;
}

#need-request-modal .need-request-card > p:not(.need-request-contact) {
  margin: 0 !important;
  color: #6d7487;
  font-size: 14.5px;
  line-height: 1.65;
}

#need-request-modal .need-request-form,
#need-request-modal .need-request-upload,
#need-request-modal .need-request-contact,
#need-request-modal .need-request-support-button,
#need-request-modal .modal-actions {
  grid-column: 1 / -1;
}

#need-request-modal .need-request-form {
  gap: 7px;
  margin-top: 8px;
}

#need-request-modal .need-request-form span {
  color: #363c4f;
  font-size: 13px;
  font-weight: 620;
}

#need-request-modal .need-request-form textarea {
  min-height: 118px !important;
  max-height: 210px;
  padding: 13px 14px !important;
  border: 1px solid rgba(214, 220, 235, 0.95) !important;
  border-radius: 14px !important;
  color: #242938 !important;
  background: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(20, 24, 40, 0.03);
}

#need-request-modal .need-request-form textarea:focus {
  border-color: rgba(95, 103, 236, 0.56) !important;
  box-shadow: 0 0 0 4px rgba(95, 103, 236, 0.1), inset 0 1px 0 rgba(20, 24, 40, 0.02) !important;
}

#need-request-modal .need-request-form small {
  min-height: 16px;
  color: #5d56f0;
  font-size: 12px;
}

#need-request-modal .need-request-upload {
  justify-items: stretch;
  gap: 10px;
  margin-top: 8px !important;
}

#need-request-modal .need-request-dropzone {
  grid-template-columns: 42px minmax(0, auto);
  justify-content: center;
  place-items: center;
  gap: 4px 12px;
  width: 100% !important;
  min-height: 96px !important;
  padding: 18px 20px !important;
  border: 1px dashed rgba(178, 187, 210, 0.95) !important;
  border-radius: 16px !important;
  color: #657084;
  background:
    linear-gradient(180deg, rgba(250, 252, 255, 0.98), rgba(246, 248, 252, 0.98)) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.74);
}

#need-request-modal .need-request-dropzone:hover,
#need-request-modal .need-request-dropzone:focus-visible,
#need-request-modal .need-request-dropzone.is-dragover {
  border-color: rgba(95, 103, 236, 0.5) !important;
  background: #ffffff !important;
  box-shadow: 0 14px 30px rgba(48, 58, 96, 0.1), inset 0 0 0 1px rgba(255, 255, 255, 0.9) !important;
}

#need-request-modal .need-request-dropzone .lucide {
  grid-row: 1 / span 2;
  width: 32px !important;
  height: 32px !important;
  color: #5d56f0 !important;
}

#need-request-modal .need-request-dropzone strong {
  justify-self: start;
  color: #252b3d;
  font-size: 15px;
  font-weight: 720;
}

#need-request-modal .need-request-dropzone span {
  justify-self: start;
  color: #8a93a7;
  font-size: 12.5px;
  font-weight: 540;
}

#need-request-modal .need-request-image-list:not(:empty) {
  grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
  gap: 8px;
  margin-top: 2px;
}

#need-request-modal .need-request-image-item {
  border-color: rgba(223, 226, 238, 0.96);
  border-radius: 12px;
  background: #f7f8fc;
}

#need-request-modal .need-request-contact {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  width: fit-content;
  margin: 0 !important;
  padding: 8px 11px;
  border: 1px solid rgba(224, 228, 239, 0.94);
  border-radius: 999px;
  color: #70788c;
  background: rgba(248, 250, 254, 0.92);
  font-size: 12.5px;
  line-height: 1.2;
}

#need-request-modal .need-request-contact strong {
  color: #4f46e5;
  font-weight: 760;
}

#need-request-modal .need-request-support-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: fit-content;
  min-height: 38px;
  margin: 0;
  padding: 0 14px;
  border: 1px solid rgba(210, 216, 232, 0.96);
  border-radius: 999px;
  color: #3f4658;
  background: rgba(255, 255, 255, 0.9);
  font: inherit;
  font-size: 13px;
  font-weight: 680;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(33, 39, 66, 0.06);
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease;
}

#need-request-modal .need-request-support-button:hover,
#need-request-modal .need-request-support-button:focus-visible {
  border-color: rgba(95, 103, 236, 0.38);
  color: #4f46e5;
  box-shadow: 0 12px 26px rgba(52, 58, 100, 0.1);
  transform: translateY(-1px);
  outline: 0;
}

#need-request-modal .need-request-support-button .lucide {
  width: 16px;
  height: 16px;
}

#need-request-modal .modal-actions {
  justify-content: flex-start;
  gap: 10px;
  margin-top: 2px;
}

#need-request-modal .modal-actions button {
  min-height: 42px;
  border-radius: 14px !important;
  font-size: 14px;
  font-weight: 720;
}

#need-request-modal .modal-actions .create-button {
  padding: 0 18px !important;
  background: #17152f !important;
  box-shadow: 0 14px 28px rgba(31, 28, 68, 0.2) !important;
}

#need-request-modal .modal-actions .create-button .lucide {
  color: #ffffff;
}

#need-request-modal .modal-actions .outline-button {
  min-width: 82px;
  color: #5c6476 !important;
  border-color: rgba(219, 224, 237, 0.96) !important;
  background: #ffffff !important;
}

@media (max-width: 620px) {
  #need-request-modal .need-request-card {
    grid-template-columns: 44px minmax(0, 1fr);
    padding: 22px !important;
    border-radius: 18px !important;
  }

  #need-request-modal .need-request-card h2 {
    font-size: 23px;
  }

  #need-request-modal .need-request-dropzone {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }

  #need-request-modal .need-request-dropzone .lucide {
    grid-row: auto;
  }

  #need-request-modal .need-request-dropzone strong,
  #need-request-modal .need-request-dropzone span {
    justify-self: center;
  }
}

.support-qrcode-card {
  width: min(100%, 420px);
  text-align: center;
}

.support-qrcode-card .modal-icon {
  margin: 0 auto;
}

.support-qrcode-image {
  display: block;
  width: min(100%, 320px);
  margin: 2px auto 0;
  border: 1px solid rgba(226, 232, 240, 0.92);
  border-radius: 16px;
  background: #fff;
}

.support-qrcode-actions {
  justify-content: center;
}

.support-qrcode-actions button {
  min-width: 120px;
}

.affiliate-card {
  width: min(100%, 520px);
  padding: 26px !important;
}

.affiliate-head {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) 34px;
  gap: 12px;
  align-items: start;
}

.affiliate-head-icon {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 8px;
  color: #fff;
  background: #1769e0;
}

.affiliate-head-icon .lucide {
  width: 23px;
  height: 23px;
}

.affiliate-head > div:nth-child(2) > span {
  display: block;
  margin-bottom: 3px;
  color: #167a72;
  font-size: 12px;
  font-weight: 800;
}

.affiliate-head h2 {
  margin: 0;
  color: #111827;
  font-size: 24px;
  letter-spacing: 0;
}

.affiliate-head p {
  margin: 5px 0 0;
  color: #64748b;
  font-size: 13px;
  line-height: 1.55;
}

.affiliate-head .icon-button {
  width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
  border: 0;
  color: #64748b;
  background: #f1f5f9;
}

.affiliate-benefit {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  margin-top: 20px;
  padding: 14px 16px;
  border-left: 3px solid #12a594;
  border-radius: 4px;
  background: #effcf9;
}

.affiliate-benefit > .lucide {
  width: 28px;
  height: 28px;
  color: #0f8b7d;
}

.affiliate-benefit small,
.affiliate-benefit strong {
  display: block;
}

.affiliate-benefit small {
  margin-bottom: 2px;
  color: #64748b;
  font-size: 12px;
}

.affiliate-benefit strong {
  color: #0f766e;
  font-size: 18px;
}

.affiliate-invite-section {
  display: grid;
  gap: 12px;
  margin-top: 18px;
  padding: 18px 0;
  border-top: 1px solid #e5eaf1;
  border-bottom: 1px solid #e5eaf1;
}

.affiliate-section-title {
  display: grid;
  gap: 3px;
}

.affiliate-section-title span {
  color: #1f2937;
  font-size: 14px;
  font-weight: 800;
}

.affiliate-section-title small {
  color: #7c8798;
  font-size: 12px;
  line-height: 1.5;
}

.affiliate-code-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  padding: 0 13px;
  border: 1px solid #dfe5ed;
  border-radius: 6px;
  background: #f8fafc;
}

.affiliate-code-row span {
  color: #64748b;
  font-size: 13px;
}

.affiliate-code-row strong {
  color: #172033;
  font-size: 18px;
  letter-spacing: 0;
}

.affiliate-copy-button,
.affiliate-apply-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 44px;
  border: 0;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}

.affiliate-copy-button {
  color: #1d4ed8;
  background: #eaf2ff;
}

.affiliate-copy-button:hover {
  background: #dce9ff;
}

.affiliate-copy-button .lucide,
.affiliate-apply-button .lucide {
  width: 18px;
  height: 18px;
}

.affiliate-copy-status {
  min-height: 18px;
  margin: -5px 0 0;
  color: #0f8b7d;
  font-size: 12px;
  text-align: center;
}

.affiliate-apply-section {
  display: grid;
  gap: 9px;
  margin-top: 18px;
}

.affiliate-apply-button {
  color: #fff;
  background: #1769e0;
  box-shadow: 0 10px 22px rgba(23, 105, 224, 0.2);
}

.affiliate-apply-button:hover {
  background: #1258bd;
}

.affiliate-apply-section p {
  margin: 0;
  color: #697586;
  font-size: 12px;
  line-height: 1.65;
  text-align: center;
}

@media (max-width: 560px) {
  .affiliate-card {
    width: calc(100vw - 24px);
    padding: 20px !important;
  }

  .affiliate-head {
    grid-template-columns: 42px minmax(0, 1fr) 32px;
  }

  .affiliate-head-icon {
    width: 42px;
    height: 42px;
  }
}

.auth-card {
  position: relative;
  width: min(980px, calc(100vw - 40px));
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(226, 232, 240, 0.72);
  border-radius: 24px;
}

#auth-modal {
  background: rgba(25, 23, 36, 0.42);
  backdrop-filter: blur(10px) saturate(0.65) brightness(0.78);
  -webkit-backdrop-filter: blur(10px) saturate(0.65) brightness(0.78);
}

.auth-card .auth-close-button {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 34px;
  height: 34px;
  min-height: 34px;
  border-radius: 999px;
  color: #7c879b;
  background: rgba(248, 250, 252, 0.9);
  box-shadow: none;
}

.auth-card .auth-close-button:hover {
  color: var(--ink);
  background: #fff;
}

.auth-shell {
  display: grid;
  grid-template-columns: minmax(300px, 0.88fr) minmax(360px, 1fr);
  min-height: 560px;
}

.auth-promo {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 18px;
  min-height: 560px;
  padding: 34px;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 28% 84%, rgba(154, 132, 255, 0.58), transparent 34%),
    radial-gradient(circle at 76% 16%, rgba(111, 191, 255, 0.44), transparent 30%),
    linear-gradient(145deg, #2c2457 0%, #20335d 46%, #5b3fcb 100%);
}

.auth-promo::after {
  content: "";
  position: absolute;
  inset: auto -18% -20% -18%;
  height: 42%;
  background: linear-gradient(90deg, rgba(190, 168, 255, 0.44), rgba(125, 211, 252, 0.22));
  filter: blur(26px);
  animation: authPromoGlow 8s ease-in-out infinite alternate;
}

.auth-promo-logo {
  position: relative;
  z-index: 1;
  width: 124px;
  height: auto;
  filter: brightness(0) invert(1);
  opacity: 0.92;
}

.auth-promo-copy {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 12px;
  max-width: none;
  margin-top: 154px;
}

.auth-promo-copy h3 {
  margin: 0;
  font-size: clamp(16px, 1.55vw, 22px);
  line-height: 1.18;
  letter-spacing: 0;
  white-space: normal;
}

.auth-promo-copy p {
  margin: 0;
  color: rgba(255, 255, 255, 0.7);
  font-size: 14px;
  line-height: 1.8;
}

.auth-promo-art {
  position: absolute;
  z-index: 0;
  pointer-events: none;
  user-select: none;
  will-change: transform;
}

.auth-promo-ring {
  right: -90px;
  top: 28px;
  width: 255px;
  opacity: 0.5;
  animation: authFloatSlow 9s ease-in-out infinite alternate;
}

.auth-promo-mascot {
  left: -1px;
  bottom: -2px;
  width: min(90%, 405px);
  opacity: 0.98;
  filter: drop-shadow(0 24px 34px rgba(20, 18, 44, 0.32));
  animation: none;
}

.auth-promo-sparkles {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.auth-promo-sparkles span {
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 0 12px rgba(255, 255, 255, 0.82), 0 0 22px rgba(154, 132, 255, 0.52);
  opacity: 0;
  animation: authSparkle 2.8s ease-in-out infinite;
}

.auth-promo-sparkles span:nth-child(1) {
  left: 28%;
  top: 43%;
  animation-delay: 0s;
}

.auth-promo-sparkles span:nth-child(2) {
  left: 54%;
  top: 49%;
  width: 4px;
  height: 4px;
  animation-delay: 0.45s;
}

.auth-promo-sparkles span:nth-child(3) {
  left: 72%;
  top: 39%;
  width: 6px;
  height: 6px;
  animation-delay: 1.1s;
}

.auth-promo-sparkles span:nth-child(4) {
  left: 40%;
  top: 61%;
  width: 3px;
  height: 3px;
  animation-delay: 1.65s;
}

.auth-promo-sparkles span:nth-child(5) {
  left: 82%;
  top: 58%;
  width: 4px;
  height: 4px;
  animation-delay: 2.1s;
}

.auth-promo-sparkles span:nth-child(6) {
  left: 22%;
  top: 53%;
  width: 3px;
  height: 3px;
  animation-delay: 0.75s;
}

.auth-promo-sparkles span:nth-child(7) {
  left: 64%;
  top: 63%;
  width: 5px;
  height: 5px;
  animation-delay: 1.35s;
}

.auth-promo-sparkles span:nth-child(8) {
  left: 36%;
  top: 36%;
  width: 4px;
  height: 4px;
  animation-delay: 1.9s;
}

.auth-promo-sparkles span:nth-child(9) {
  left: 76%;
  top: 48%;
  width: 3px;
  height: 3px;
  animation-delay: 2.45s;
}

.auth-promo-sparkles span:nth-child(10) {
  left: 50%;
  top: 57%;
  width: 3px;
  height: 3px;
  animation-delay: 3s;
}

@keyframes authFloatSlow {
  from {
    transform: translate3d(0, 0, 0) rotate(-2deg);
  }
  to {
    transform: translate3d(-8px, 10px, 0) rotate(3deg);
  }
}

@keyframes authPromoGlow {
  from {
    opacity: 0.66;
    transform: translateX(-3%);
  }
  to {
    opacity: 1;
    transform: translateX(4%);
  }
}

@keyframes authSparkle {
  0%, 100% {
    opacity: 0;
    transform: scale(0.45);
  }
  35% {
    opacity: 0.95;
    transform: scale(1);
  }
  55% {
    opacity: 0.35;
    transform: scale(0.72);
  }
}

.auth-panel {
  position: relative;
  display: grid;
  align-content: center;
  gap: 16px;
  padding: 46px 52px;
}

.auth-mode-switch {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 5px;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 16px;
  background: #f8fafc;
}

.auth-login-method-switch {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.auth-login-method-switch button,
.auth-mode-switch button {
  min-height: 36px;
  border: 0;
  border-radius: 10px;
  color: #64748b;
  background: transparent;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.auth-login-method-switch button {
  min-height: 44px;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  color: #64748b;
  font-size: 16px;
}

.auth-login-method-switch button.selected {
  color: var(--ink);
  border-color: #1677ff;
}

.auth-mode-switch button.selected {
  color: #fff;
  background: #1677ff;
  box-shadow: 0 10px 24px rgba(22, 119, 255, 0.2);
}

.auth-form {
  display: grid;
  gap: 13px;
}

.auth-form label {
  display: grid;
  gap: 7px;
  color: #30384d;
  font-size: 13px;
  font-weight: 525;
}

.auth-field-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.auth-forgot-link {
  border: 0;
  padding: 0;
  color: #64748b;
  background: transparent;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}

.auth-forgot-link:hover {
  color: #1677ff;
}

.auth-form input {
  width: 100%;
  min-height: 48px;
  padding: 0 15px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--ink);
  background: #fff;
  font-size: 15px;
  outline: 0;
}

.auth-code-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.auth-code-row .outline-button {
  min-height: 48px;
  white-space: nowrap;
}

.auth-form input:focus {
  border-color: rgba(123, 97, 255, 0.55);
  box-shadow: 0 0 0 3px rgba(123, 97, 255, 0.12);
}

.auth-form small {
  min-height: 18px;
  color: #e64e65;
  font-weight: 525;
}

.auth-card .modal-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  justify-items: center;
}

.auth-card #auth-submit {
  width: 100%;
  min-height: 48px;
  border-radius: 14px;
  font-size: 15px;
}

.auth-card .auth-secondary-action {
  width: auto;
  min-height: 30px;
  border: 0 !important;
  padding: 0 8px;
  color: #64748b;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

.auth-card .auth-secondary-action:hover {
  color: #1677ff;
  background: transparent !important;
}

.auth-card .modal-actions [hidden] {
  display: none;
}

/* Account flow: one account field with a branded promotional panel. */
.auth-card {
  width: min(980px, calc(100vw - 40px));
  border-radius: 24px;
}

.auth-shell {
  display: grid;
  grid-template-columns: minmax(360px, 0.92fr) minmax(430px, 1.08fr);
  min-height: 560px;
}

.auth-panel {
  display: grid;
  align-content: center;
  gap: 14px;
  padding: 42px 48px 38px;
}

.auth-simple-logo {
  display: block;
  width: 132px;
  height: 42px;
  margin-bottom: 4px;
  object-fit: contain;
  object-position: left center;
}

.auth-panel > h2 {
  margin: 0;
  font-size: 24px;
  letter-spacing: 0;
}

.auth-panel > #auth-copy {
  margin: -6px 0 4px;
  color: #64748b;
  font-size: 13px;
}

.auth-text-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.auth-text-link {
  min-height: 30px;
  padding: 0;
  border: 0;
  color: #526078;
  background: transparent;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.auth-text-link:hover {
  color: #1677ff;
}

.auth-text-actions:has(> [hidden]:first-child) {
  justify-content: flex-end;
}

.auth-primary-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(132px, 0.58fr);
  gap: 10px;
  width: 100%;
  align-items: stretch;
}

.auth-primary-actions:has(#auth-method-toggle[hidden]) {
  grid-template-columns: 1fr;
}

.auth-primary-actions #auth-method-toggle {
  min-height: 48px;
  padding: 0 16px;
  border: 1px solid rgba(215, 208, 239, 0.96);
  border-radius: 14px;
  color: #574f70;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 8px 20px rgba(64, 50, 112, 0.06);
  white-space: nowrap;
}

.auth-primary-actions #auth-method-toggle:hover {
  border-color: rgba(123, 97, 255, 0.48);
  color: #6754e8;
  background: #fff;
}

.auth-form {
  gap: 12px;
}

.auth-captcha-row {
  grid-template-columns: minmax(0, 1fr) 138px;
}

@media (max-width: 560px) {
  .auth-card {
    width: min(100%, calc(100vw - 24px));
    border-radius: 16px;
  }

  .auth-panel {
    padding: 30px 20px 24px;
  }

  .auth-simple-logo {
    width: 116px;
    height: 36px;
  }

  .auth-captcha-row {
    grid-template-columns: minmax(0, 1fr) 126px;
  }
}

@media (max-width: 560px) {
  .auth-card {
    width: min(100%, calc(100vw - 28px));
    border-radius: 22px;
  }

  .auth-shell {
    grid-template-columns: 1fr;
  }

  .auth-promo {
    min-height: 245px;
    padding: 22px;
  }

  .auth-promo-logo {
    width: 90px;
  }

  .auth-promo-copy {
    gap: 6px;
    margin-top: 66px;
  }

  .auth-promo-copy h3 {
    max-width: calc(100vw - 84px);
    font-size: clamp(13px, 3.35vw, 16px);
    white-space: nowrap;
  }

  .auth-promo-copy p,
  .auth-promo-ring {
    display: none;
  }

  .auth-promo-mascot {
    left: -1px;
    bottom: -2px;
    width: 150px;
  }

  .auth-promo-sparkles span:nth-child(1) {
    left: 42%;
    top: 46%;
  }

  .auth-promo-sparkles span:nth-child(2) {
    left: 62%;
    top: 54%;
  }

  .auth-promo-sparkles span:nth-child(3) {
    left: 78%;
    top: 43%;
  }

  .auth-promo-sparkles span:nth-child(6) {
    left: 28%;
    top: 58%;
  }

  .auth-promo-sparkles span:nth-child(7) {
    left: 70%;
    top: 61%;
  }

  .auth-promo-sparkles span:nth-child(8) {
    left: 52%;
    top: 40%;
  }

  .auth-promo-sparkles span:nth-child(9) {
    left: 84%;
    top: 52%;
  }

  .auth-promo-sparkles span:nth-child(10) {
    left: 48%;
    top: 65%;
  }

  .auth-panel {
    padding: 24px 22px 26px;
  }

  .auth-card .modal-actions {
    grid-template-columns: 1fr;
  }

  .auth-secondary-action {
    width: auto;
  }
}

@media (max-width: 760px) {
  .auth-card {
    width: min(440px, calc(100vw - 24px));
    border-radius: 20px;
  }

  .auth-shell {
    display: block;
    min-height: 0;
  }

  .auth-promo {
    display: none;
  }

  .auth-panel {
    padding: 30px 24px 26px;
  }
}

.auth-captcha-field {
  display: grid;
  gap: 7px;
  color: #30384d;
  font-size: 13px;
  font-weight: 525;
}

.auth-captcha-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px;
  gap: 8px;
  align-items: center;
}

.auth-captcha-row input {
  width: 100%;
  min-height: 48px;
  padding: 0 15px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--ink);
  background: #fff;
  font-size: 15px;
  letter-spacing: 1px;
  outline: 0;
}

.auth-captcha-row input:focus {
  border-color: rgba(123, 97, 255, 0.55);
  box-shadow: 0 0 0 3px rgba(123, 97, 255, 0.12);
}

.captcha-image-button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
  min-height: 48px;
  padding: 4px 8px;
  border: 1px solid rgba(199, 210, 254, 0.9);
  border-radius: 14px;
  color: #4f46e5;
  background: linear-gradient(135deg, #fff 0%, #f8fbff 100%);
  cursor: pointer;
}

.captcha-image-button img {
  width: 100%;
  height: 38px;
  object-fit: contain;
}

.captcha-image-button span {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.captcha-image-button svg {
  width: 14px;
  height: 14px;
}

.auth-captcha-field small {
  min-height: 18px;
  color: #e64e65;
  font-weight: 525;
}

@media (max-width: 560px) {
  .auth-captcha-row {
    grid-template-columns: minmax(0, 1fr) 132px;
  }
}

.image-viewer {
  z-index: 240;
  padding: 0;
  background: rgba(15, 23, 42, 0.16);
  backdrop-filter: blur(10px) saturate(1.04);
  -webkit-backdrop-filter: blur(10px) saturate(1.04);
}

.image-viewer-card {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 12px;
  width: 100vw;
  height: 100vh;
  padding: 16px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.image-viewer-head {
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
}

.image-viewer-head strong {
  overflow: hidden;
  color: #fff;
  font-size: 16px;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.image-viewer-actions {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 8px;
  align-items: center;
}

.image-viewer-foot {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  justify-content: center;
  min-width: 0;
  max-width: min(980px, calc(100vw - 32px));
  margin: 0 auto;
}

.image-viewer-foot .outline-button {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  justify-content: center;
  min-width: 104px;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 13px;
  color: var(--purple);
  text-decoration: none;
  font-size: 14px;
  font-weight: 650;
}

.image-viewer-foot .outline-button[hidden] {
  display: none;
}

.image-viewer-foot .danger-button {
  border-color: rgba(255, 116, 137, 0.36);
  color: #ff9dac;
  background: rgba(255, 92, 119, 0.12);
}

.image-viewer-foot .danger-button:hover {
  color: #fff;
  background: #df3f55;
}

.image-viewer-foot .outline-button .lucide {
  width: 19px;
  height: 19px;
  stroke-width: 2.35;
}

.image-viewer-foot .image-viewer-remix {
  color: #fff;
  border-color: rgba(123, 97, 255, 0.78);
  background: #6d55f7;
}

.image-viewer-foot .image-viewer-remix:hover {
  border-color: #5d46e8;
  background: #5d46e8;
}

.image-viewer-foot .image-viewer-appeal {
  border-color: rgba(223, 63, 85, 0.24);
  color: #d83b52;
  background: #fff1f3;
}

.image-viewer-foot .image-viewer-appeal:hover {
  border-color: rgba(223, 63, 85, 0.42);
  background: #ffe6ea;
}

.library-add-wrap {
  position: relative;
  display: inline-flex;
}

.image-viewer-send-wrap {
  display: contents;
}

.library-add-menu {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 10px);
  z-index: 4;
  display: grid;
  gap: 6px;
  width: 150px;
  padding: 8px;
  border: 1px solid #ececf6;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 18px 40px rgba(20, 22, 40, 0.2);
  transform: translateX(-50%);
}

.library-add-menu.group-select-mode {
  width: 230px;
  gap: 8px;
  padding: 10px;
}

.library-add-menu[hidden] {
  display: none;
}

.library-add-menu-head {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 6px;
  align-items: center;
  padding: 0 2px 4px;
}

.library-add-menu-head span {
  overflow: hidden;
  color: #2f3848;
  font-size: 13px;
  font-weight: 560;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.library-add-menu .library-add-back {
  display: inline-grid;
  place-items: center;
  min-height: 28px;
  width: 28px;
  padding: 0;
  border-radius: 9px;
  color: #6f7787;
  background: #f5f7fb;
}

.library-add-group-list {
  display: grid;
  gap: 6px;
  max-height: 236px;
  overflow: auto;
  padding-right: 2px;
}

.library-add-menu button {
  display: flex;
  gap: 7px;
  align-items: center;
  min-height: 34px;
  padding: 0 10px;
  border: 0;
  border-radius: 10px;
  color: #30384d;
  background: #f7f8fc;
  font-size: 13px;
  font-weight: 525;
  cursor: pointer;
}

.library-add-group-list button {
  justify-content: space-between;
  min-height: 38px;
  padding: 0 11px;
  color: #30384d;
  background: #f8fafc;
}

.library-add-group-list button span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.library-add-group-list button small {
  flex: 0 0 auto;
  min-width: 24px;
  color: #8a93a3;
  font-size: 12px;
  font-weight: 500;
  text-align: right;
}

.library-add-menu button:hover {
  color: var(--purple);
  background: var(--purple-soft);
}

.library-add-menu .lucide {
  width: 15px;
  height: 15px;
}

.image-viewer-foot #image-viewer-send-to {
  order: 20;
  min-width: 104px;
  min-height: 42px;
  padding: 0 16px;
  border-color: rgba(109, 85, 247, 0.28);
  color: #5d46e8;
  background: #f5f3ff;
  box-shadow: 0 8px 18px rgba(109, 85, 247, 0.12);
  font-size: 14px;
  font-weight: 650;
}

.image-viewer-foot #image-viewer-send-to:hover {
  border-color: rgba(109, 85, 247, 0.46);
  background: #ece8ff;
}

.image-viewer-foot #image-viewer-send-to .lucide {
  width: 19px;
  height: 19px;
}

.image-viewer-send-menu {
  position: static;
  left: auto;
  bottom: auto;
  flex: 0 0 min(1120px, calc(100vw - 80px));
  order: 100;
  width: min(1120px, calc(100vw - 80px));
  max-height: none;
  margin-top: 4px;
  overflow: visible;
  gap: 9px;
  padding: 10px 12px 12px;
  border-color: rgba(226, 224, 236, 0.92);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 10px 26px rgba(20, 22, 40, 0.1);
  transform: none;
}

.image-viewer-send-title {
  color: #7c8294;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
}

.image-viewer-send-grid {
  display: grid;
  gap: 7px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.image-viewer-send-menu button {
  justify-content: center;
  min-height: 36px;
  min-width: 0;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: rgba(246, 247, 251, 0.92);
  color: #30384d;
  text-align: center;
}

.image-viewer-send-menu button:hover {
  border-color: rgba(109, 85, 247, 0.2);
  color: #5d46e8;
  background: #f1efff;
}

.image-viewer-send-menu button span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.image-appeal-card {
  width: min(560px, calc(100vw - 32px));
}

.appeal-modal {
  z-index: 30000 !important;
  background: rgba(15, 23, 42, 0.18);
}

.appeal-modal .image-appeal-card {
  gap: 18px;
  padding: 28px 30px;
  border: 1px solid rgba(226, 228, 238, 0.9);
  border-radius: 20px;
  box-shadow: 0 28px 80px rgba(15, 23, 42, 0.22);
}

.appeal-modal .modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.appeal-modal .modal-head span {
  display: block;
  margin-bottom: 8px;
  color: #8a90a2;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.appeal-modal .modal-head h3 {
  margin: 0;
  color: #1f2937;
  font-size: 22px;
  line-height: 1.25;
}

.appeal-modal .icon-button {
  width: 36px;
  height: 36px;
  border: 1px solid #e5e7ef;
  border-radius: 12px;
  color: #667085;
  background: #fff;
  box-shadow: 0 8px 18px rgba(20, 22, 40, 0.08);
}

.appeal-modal .icon-button:hover {
  color: #5d46e8;
  border-color: rgba(109, 85, 247, 0.28);
  background: #f7f5ff;
}

.image-appeal-body {
  display: grid;
  gap: 14px;
}

.image-appeal-warning {
  margin: 0;
  padding: 12px 14px;
  border: 1px solid rgba(223, 63, 85, 0.16);
  border-radius: 12px;
  color: #5f6678;
  background: #fff7f8;
  font-size: 13px;
  line-height: 1.75;
}

.image-appeal-field {
  display: grid;
  gap: 8px;
  color: #34394a;
  font-size: 13px;
  font-weight: 650;
}

.image-appeal-field textarea {
  width: 100%;
  min-height: 128px;
  padding: 12px 13px;
  border: 1px solid #e2e4ee;
  border-radius: 12px;
  color: #252b3a;
  background: #fff;
  font: inherit;
  font-weight: 450;
  line-height: 1.6;
  resize: vertical;
  outline: none;
}

.image-appeal-field textarea:focus {
  border-color: rgba(109, 85, 247, 0.42);
  box-shadow: 0 0 0 3px rgba(109, 85, 247, 0.1);
}

.image-appeal-message {
  min-height: 20px;
  margin: 0;
  color: #d83b52;
  font-size: 13px;
}

.image-appeal-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
}

.image-appeal-actions .outline-button,
.image-appeal-actions .primary-button {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 16px;
  border: 1px solid #e2e4ee;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 650;
  cursor: pointer;
}

.image-appeal-actions .outline-button {
  color: #475569;
  background: #fff;
}

.image-appeal-actions .outline-button:hover {
  border-color: #cfd5e3;
  background: #f8fafc;
}

.image-appeal-actions .primary-button {
  color: #fff;
  border-color: #5d46e8;
  background: #5d46e8;
  box-shadow: 0 10px 20px rgba(93, 70, 232, 0.18);
}

.image-appeal-actions .primary-button:hover {
  border-color: #513bd7;
  background: #513bd7;
}

.image-appeal-actions .primary-button:disabled {
  cursor: wait;
  opacity: 0.68;
}

.image-appeal-actions .lucide {
  width: 17px;
  height: 17px;
}

@media (max-width: 720px) {
  .image-viewer-send-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .image-viewer-send-menu {
    max-height: 230px;
  }
}

.image-viewer-body {
  display: grid;
  min-height: 0;
  grid-template-rows: minmax(0, 1fr) auto;
  place-items: center;
  overflow: hidden;
  border-radius: 0;
  background: transparent;
}

.image-viewer-body img {
  display: block;
  width: auto;
  height: auto;
  max-width: calc(100vw - 32px);
  max-height: calc(100vh - 144px);
  object-fit: contain;
  object-position: center;
  cursor: zoom-out;
}

.image-viewer-body > img[hidden] {
  display: none !important;
}

.image-viewer-video {
  display: block;
  width: min(760px, calc(100vw - 96px));
  height: auto;
  max-height: min(72vh, 620px);
  border-radius: 12px;
  background: #000;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.34);
}

.image-viewer.video-viewer-mode .image-viewer-card {
  width: min(860px, calc(100vw - 48px));
  height: auto;
  max-height: min(88vh, 760px);
}

.image-viewer.video-viewer-mode .image-viewer-body {
  grid-template-rows: minmax(0, 1fr) auto;
  overflow: hidden;
}

.image-viewer.video-viewer-mode.work-mode .image-viewer-card {
  width: min(560px, calc(100vw - 40px));
  max-height: min(94vh, 900px);
}

.image-viewer.video-viewer-mode.work-mode .image-viewer-body {
  justify-items: center;
  padding: 12px;
  gap: 12px;
}

.image-viewer.video-viewer-mode.work-mode .image-viewer-video {
  width: min(420px, calc(100vw - 96px), calc((94vh - 188px) * 3 / 4));
  aspect-ratio: 3 / 4;
  height: calc(min(420px, calc(100vw - 96px), calc((94vh - 188px) * 3 / 4)) * 4 / 3);
  max-height: calc(94vh - 188px);
  object-fit: contain;
}

.image-viewer.video-viewer-mode.work-mode .image-viewer-info {
  width: min(100%, 420px);
  align-self: center;
}

.image-viewer-info {
  align-self: end;
  width: min(100%, 1120px);
  margin-top: 14px;
  padding: 10px 14px;
  border-radius: 14px;
  color: #d8deee;
  background: rgba(14, 18, 30, 0.78);
  font-size: 12px;
  line-height: 1.5;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  justify-content: center;
}

.image-viewer-info[hidden] {
  display: none;
}

.image-viewer-info span {
  white-space: nowrap;
}

.image-viewer-info .image-viewer-prompt-line {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: stretch;
  flex: 1 0 100%;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  text-align: left;
}

.image-viewer-info .image-viewer-prompt-line > span {
  flex: 1 1 auto;
  min-width: 0;
  display: -webkit-box;
  overflow: hidden;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.image-viewer-info .image-viewer-prompt-line button {
  display: inline-flex;
  align-self: center;
  flex: 0 0 auto;
  gap: 4px;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
  font-size: 12px;
  font-weight: 525;
  cursor: pointer;
}

.image-viewer-info .image-viewer-prompt-line button:hover {
  background: rgba(255, 255, 255, 0.2);
}

.image-viewer-info .image-viewer-prompt-line button .lucide {
  width: 13px;
  height: 13px;
}

.image-viewer-compare {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 12px;
  width: 100%;
  min-width: 0;
  align-items: center;
}

.image-viewer-compare[hidden] {
  display: none;
}

.image-viewer-compare figure {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 8px;
  min-width: 0;
  margin: 0;
}

.image-viewer-compare img {
  justify-self: center;
  max-width: 100%;
  max-height: min(58vh, 520px);
  border-radius: 18px;
  object-fit: contain;
  cursor: zoom-in;
  box-shadow: 0 18px 34px rgba(45, 48, 72, 0.16);
}

.image-viewer-compare figcaption {
  justify-self: center;
  min-height: 28px;
  padding: 6px 12px;
  border-radius: 999px;
  color: #4f5368;
  background: #fff;
  font-size: 12px;
  font-weight: 525;
  box-shadow: 0 8px 18px rgba(45, 48, 72, 0.08);
}

.image-viewer-compare-button {
  display: inline-grid;
  gap: 5px;
  place-items: center;
  width: 58px;
  height: 58px;
  border: 1px solid rgba(123, 97, 255, 0.24);
  border-radius: 999px;
  color: #5f46f4;
  background: #fff;
  font-size: 12px;
  font-weight: 525;
  cursor: zoom-in;
  box-shadow: 0 12px 28px rgba(85, 73, 150, 0.13);
}

.image-viewer-compare-button:hover {
  color: #fff;
  border-color: #6d55f7;
  background: #6d55f7;
}

.image-viewer-compare-button .lucide {
  width: 18px;
  height: 18px;
}

.image-viewer.work-mode {
  padding: 20px;
  background: rgba(15, 23, 42, 0.16);
  backdrop-filter: blur(10px) saturate(1.04);
  -webkit-backdrop-filter: blur(10px) saturate(1.04);
}

.image-viewer.work-mode .image-viewer-card {
  width: min(1120px, calc(100vw - 40px));
  height: auto;
  max-height: min(94vh, 900px);
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.68);
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 26px 80px rgba(7, 10, 18, 0.28);
}

.image-viewer.work-mode .image-viewer-head strong {
  color: #30384d;
}

.image-viewer.work-mode .image-viewer-body {
  width: 100%;
  padding: 12px;
  gap: 26px;
  overflow: auto;
  border: 1px solid #ececf6;
  border-radius: 20px;
  background: #f7f8fc;
}

.image-viewer.work-mode .image-viewer-compare:not([hidden]) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  align-self: start !important;
  margin-bottom: 2px;
}

.image-viewer.work-mode .image-viewer-info {
  align-self: stretch;
  margin-top: 0;
  max-height: 118px;
}

.image-viewer.work-mode .image-viewer-compare[hidden] {
  display: none !important;
}

.image-viewer.work-mode.single-image-mode .image-viewer-body {
  justify-items: center;
  align-items: center;
}

.image-viewer.work-mode .image-viewer-body > img {
  max-width: 100%;
  max-height: min(58vh, 520px);
  border-radius: 18px;
  cursor: zoom-in;
  box-shadow: 0 18px 34px rgba(45, 48, 72, 0.16);
}

.image-viewer.work-mode.single-large-mode {
  padding: 24px;
  background: rgba(15, 23, 42, 0.16);
  backdrop-filter: blur(10px) saturate(1.04);
  -webkit-backdrop-filter: blur(10px) saturate(1.04);
}

.image-viewer.work-mode.single-large-mode .image-viewer-card {
  width: min(1280px, calc(100vw - 48px));
  height: 90vh;
  max-height: 90vh;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 28px 86px rgba(7, 10, 18, 0.3);
}

.image-viewer.work-mode.single-large-mode .image-viewer-head strong {
  color: #30384d;
}

.image-viewer.work-mode.single-large-mode .image-viewer-body {
  grid-template-rows: minmax(0, 1fr) auto;
  align-items: stretch;
  gap: 10px;
  padding: 12px;
  overflow: hidden;
  border: 1px solid #ececf6;
  border-radius: 20px;
  background: #f7f8fc;
}

.image-viewer.work-mode.single-large-mode .image-viewer-body > img {
  align-self: center;
  justify-self: center;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-width: 100%;
  max-height: 100%;
  border-radius: 18px;
  object-fit: contain;
  cursor: zoom-out;
  box-shadow: 0 18px 38px rgba(45, 48, 72, 0.18);
}

.image-viewer.work-mode.single-large-mode .image-viewer-body > img + .image-viewer-info {
  grid-row: 2;
}

.image-viewer.work-mode.single-large-mode .image-viewer-info {
  align-self: stretch;
  width: 100%;
  max-height: 112px;
  margin-top: 0;
  overflow: auto;
  padding: 8px 12px;
  font-size: 11px;
  line-height: 1.35;
}

.image-viewer.work-mode.single-large-mode .image-viewer-info .image-viewer-prompt-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.image-viewer.work-mode.single-large-mode .image-viewer-info .image-viewer-prompt-line > span {
  -webkit-line-clamp: 1;
}

.image-viewer.work-mode.single-large-mode .image-viewer-info .image-viewer-prompt-line button {
  min-height: 24px;
  padding: 0 10px;
  font-size: 11px;
}

.image-viewer.work-mode.single-large-mode .image-viewer-foot {
  display: flex;
  max-width: min(1120px, 100%);
}

.image-viewer.work-mode.fullscreen-mode {
  padding: 0;
  background: rgba(15, 23, 42, 0.16);
  backdrop-filter: blur(10px) saturate(1.04);
  -webkit-backdrop-filter: blur(10px) saturate(1.04);
}

.image-viewer.work-mode.fullscreen-mode .image-viewer-card {
  width: 100vw;
  height: 100vh;
  max-height: none;
  padding: 16px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.image-viewer.work-mode.fullscreen-mode .image-viewer-head strong {
  color: #fff;
}

.image-viewer.work-mode.fullscreen-mode .image-viewer-foot {
  display: none;
}

.image-viewer.work-mode.fullscreen-mode .image-viewer-body {
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.image-viewer.work-mode.fullscreen-mode .image-viewer-info {
  width: auto;
  max-width: min(1120px, calc(100vw - 56px));
  margin-top: 8px;
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  color: rgba(255, 255, 255, 0.82);
  background: rgba(14, 18, 28, 0.46);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  gap: 5px 12px;
  font-size: 11px;
  line-height: 1.35;
  justify-content: center;
}

.image-viewer.work-mode.fullscreen-mode.single-image-mode .image-viewer-info {
  max-height: 58px;
  overflow: hidden;
}

.image-viewer.work-mode.fullscreen-mode.single-image-mode .image-viewer-info > span:not(.image-viewer-prompt-line) {
  max-width: 210px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.image-viewer.work-mode.fullscreen-mode.single-image-mode .image-viewer-info .image-viewer-prompt-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  flex: 1 0 100%;
  gap: 8px;
  min-width: 0;
}

.image-viewer.work-mode.fullscreen-mode.single-image-mode .image-viewer-info .image-viewer-prompt-line > span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  -webkit-line-clamp: initial;
}

.image-viewer.work-mode.fullscreen-mode.single-image-mode .image-viewer-info .image-viewer-prompt-line button {
  min-height: 24px;
  padding: 0 10px;
  font-size: 11px;
}

.image-viewer.work-mode.fullscreen-mode .image-viewer-body > img {
  max-width: calc(100vw - 32px);
  max-height: calc(100vh - 126px);
  border-radius: 0;
  cursor: zoom-out;
  box-shadow: none;
}

.image-viewer.work-mode.fullscreen-mode.single-image-mode .image-viewer-body {
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 8px;
  padding: 12px 16px 10px;
}

.image-viewer.work-mode.fullscreen-mode .image-viewer-compare:not([hidden]) {
  height: calc(100vh - 76px);
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  align-items: center;
}

.image-viewer.work-mode.fullscreen-mode.compare-fullscreen-mode .image-viewer-compare {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
}

.image-viewer.work-mode.fullscreen-mode .image-viewer-compare-button {
  display: none;
}

.image-viewer.work-mode.fullscreen-mode .image-viewer-compare img {
  max-width: calc((100vw - 56px) / 2);
  max-height: calc(100vh - 118px);
  border-radius: 0;
  cursor: zoom-out;
  box-shadow: none;
}

.image-viewer.work-mode.fullscreen-mode .image-viewer-compare figcaption {
  color: #fff;
  background: rgba(255, 255, 255, 0.16);
  box-shadow: none;
}

.lucide {
  width: 19px;
  height: 19px;
  stroke-width: 2.25;
}

@media (max-width: 1620px) {
  .app-layout {
    grid-template-columns: 274px minmax(0, 1fr);
  }

  .brand strong {
    font-size: 25px;
  }

  .side-nav a {
    font-size: 14px;
  }

  .side-nav .nav-primary {
    font-size: 15px;
  }

  .side-nav .nav-primary[data-nav-target] {
    font-size: 14px;
  }

  .nav-sublist a {
    font-size: 13.5px;
  }

  .function-card {
    padding: 14px;
  }

  .advanced-grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
}

@media (max-width: 1320px) {
  .basic-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .advanced-grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }

  .hero-card {
    grid-template-columns: 1fr;
  }

  .task-body {
    grid-template-columns: minmax(300px, 0.45fr) minmax(0, 1fr);
  }

  .preview-card {
    height: 430px;
    min-height: 430px;
  }
}

@media (max-width: 980px) {
  .app-layout {
    display: block;
  }

  body.feature-focus-mode .app-layout {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
  }

  .sidebar {
    position: static;
    display: block;
    height: auto;
    padding: 14px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .brand {
    margin-bottom: 12px;
  }

  .side-nav {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 0 0 4px;
    scrollbar-width: none;
  }

  .side-nav::-webkit-scrollbar {
    display: none;
  }

  .side-nav p,
  .side-nav .nav-tail {
    display: none;
  }

  .side-nav a {
    flex: 0 0 auto;
    min-height: 38px;
    padding: 0 12px;
    border-radius: 10px;
    font-size: 14px;
    white-space: nowrap;
  }

  .side-nav .nav-primary {
    font-size: 15px;
  }

  .works-card {
    position: fixed;
    left: 14px;
    bottom: 14px;
    z-index: 90;
    grid-template-columns: 42px minmax(0, 1fr);
    width: 178px;
    min-height: 66px;
    padding: 10px;
    border-radius: 14px;
  }

  .works-icon {
    width: 38px;
    height: 38px;
  }

  .works-card strong {
    font-size: 14px;
  }

  .works-card small {
    font-size: 11px;
  }

  .topbar {
    position: static;
    display: grid;
    padding: 12px;
  }

  .top-library-tabs {
    width: 100%;
  }

  .top-actions {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: thin;
  }

  .top-actions > * {
    flex: 0 0 auto;
  }

  .generation-channel-switch {
    flex: 0 0 auto;
  }

  .free-generate-button {
    min-height: 42px;
    padding: 0 12px;
    font-size: 13px;
  }

  .shop-button {
    min-width: 150px;
  }

  .notify-button {
    min-width: 42px;
  }

  .shop-button {
    background: #fff;
    border: 1px solid var(--line);
  }

  body.feature-focus-mode .sidebar {
    position: sticky;
    top: 0;
    display: grid;
    grid-template-rows: auto 1fr auto;
    height: 100vh;
    overflow: hidden;
    border-right: 1px solid var(--line);
    border-bottom: 0;
  }

  body.feature-focus-mode .side-nav {
    display: grid;
    overflow: auto;
  }

  body.feature-focus-mode .topbar {
    min-height: 58px;
    padding: 8px 12px;
  }

  .content-grid {
    padding: 16px 12px 220px;
  }

  body.feature-focus-mode .content-grid {
    height: 100%;
    padding: 16px 10px 10px;
    overflow: hidden;
  }

  @media (max-height: 820px) {
    body.feature-focus-mode .app-layout,
    body.feature-focus-mode .main-area,
    body.feature-focus-mode .content-grid,
    body.feature-focus-mode .workspace,
    body.feature-focus-mode .task-panel {
      height: auto;
      min-height: 100vh;
      overflow: visible;
    }

    body.feature-focus-mode .content-grid {
      padding: 16px 10px 16px;
    }

    body.feature-focus-mode .sidebar {
      min-height: 100vh;
    }

    body.feature-focus-mode .task-body {
      overflow: visible;
    }

    body.feature-focus-mode .preview-card {
      height: 340px !important;
      min-height: 340px !important;
      max-height: none !important;
    }
  }

  .hero-card {
    min-height: 230px;
    padding: 22px;
    border-radius: 18px;
  }

  .hero-text h1 {
    font-size: 25px;
  }

  .hero-text p {
    font-size: 15px;
  }

  .hero-visual {
    min-height: 120px;
  }

  .hero-visual img {
    right: 10px;
    bottom: -26px;
    width: 132px;
    height: 154px;
  }

  .hero-chip {
    right: 118px;
    top: 34px;
    min-height: 28px;
    padding: 0 12px;
    font-size: 12px;
  }

  .hero-chip.second {
    right: 96px;
    top: 66px;
  }

  .basic-grid,
  .advanced-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .advanced-grid {
    grid-auto-rows: 220px;
  }

  .advanced-card,
  .advanced-card:nth-child(1),
  .advanced-card:nth-child(2),
  .advanced-card:nth-child(3),
  .advanced-card:nth-child(4),
  .advanced-card:nth-child(5),
  .advanced-card:nth-child(6),
  .advanced-card:nth-child(7) {
    grid-column: span 1;
    grid-row: span 1;
  }

  .function-board,
  .task-panel {
    padding: 14px;
    border-radius: 16px;
  }

  .function-card,
  .advanced-card {
    min-height: 0;
    padding: 12px;
  }

  .advanced-card {
    padding: 0;
  }

  .feature-head,
  .advanced-head {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 8px;
  }

  .feature-icon {
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }

  .feature-head strong,
  .advanced-head strong {
    font-size: 15px;
  }

  .task-body {
    grid-template-columns: 1fr;
  }

  body.feature-focus-mode .task-body {
    grid-template-columns: minmax(240px, 0.36fr) minmax(0, 1fr) !important;
    grid-template-rows: auto minmax(0, 1fr);
  }

  .upload-column,
  .settings-column,
  .preview-column {
    grid-column: 1 / -1;
    grid-row: auto;
  }

  .upload-column {
    order: 1;
  }

  .settings-column {
    order: 2;
  }

  .preview-column {
    order: 3;
  }

  .preview-card {
    height: 360px;
    min-height: 360px;
  }
}

@media (max-width: 1180px) {
  .model-directory-layout {
    grid-template-columns: 170px minmax(0, 1fr);
  }

  .model-directory-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .brand-logo {
    width: 150px;
    height: 34px;
    border-radius: 0;
  }

  .brand strong {
    font-size: 23px;
  }

  .brand small {
    font-size: 11px;
  }

  .points-button {
    min-width: 0;
    padding: 0 10px;
    font-size: 12px;
  }

  .points-button strong {
    font-size: 14px;
  }

  .section-head {
    align-items: flex-start;
  }

  .section-actions {
    display: grid;
    justify-items: end;
    gap: 6px;
  }

  .section-actions span {
    font-size: 12px;
  }

  .batch-button {
    min-height: 30px;
    padding: 0 10px;
    font-size: 12px;
  }

  .basic-grid,
  .advanced-grid {
    gap: 10px;
  }

  .function-card {
    gap: 10px;
  }

  .feature-head {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
  }

  .feature-head strong {
    font-size: 14px;
    white-space: normal;
  }

  .advanced-head small {
    display: none;
  }

  .poster-preview img,
  .buyer-preview img {
    height: 82px;
  }

  .model-preview img,
  .model-preview span {
    height: 72px;
  }

  .product-preview img {
    height: 48px;
  }

  .copy-preview,
  .watermark-card {
    min-height: 92px;
  }

  .watermark-card img {
    height: 92px;
  }

  .task-heading h2 {
    font-size: 21px;
  }

  .preview-card {
    height: 320px;
    min-height: 320px;
  }

  .workflow-card {
    grid-template-columns: 1fr;
  }

  .workflow-card ol {
    display: grid;
    gap: 8px;
  }

  .swatch-grid,
  .choice-grid,
  .choice-grid.three,
  .library-board,
  .upload-slot-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .model-directory-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .model-directory-layout {
    grid-template-columns: 1fr;
  }

  .model-filter-panel {
    position: static;
  }
}

@media (max-height: 820px) {
  html,
  body,
    body.feature-focus-mode {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.feature-focus-mode .app-layout,
  body.feature-focus-mode .main-area,
  body.feature-focus-mode .content-grid,
  body.feature-focus-mode .workspace,
  body.feature-focus-mode .task-panel,
  body.feature-focus-mode .task-body {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.feature-focus-mode .app-layout {
    min-height: 100vh !important;
  }

  body.feature-focus-mode .main-area {
    display: block !important;
  }

  body.feature-focus-mode .content-grid {
    padding-bottom: 18px !important;
  }

  body.feature-focus-mode .task-panel {
    grid-template-rows: auto auto auto !important;
    margin-bottom: 18px !important;
  }

  body.feature-focus-mode .task-body {
    align-items: start !important;
  }

  body.feature-focus-mode .preview-card {
    height: clamp(320px, calc(100vh - 230px), 560px) !important;
    min-height: 320px !important;
    max-height: 560px !important;
  }

  body.feature-focus-mode[data-active-feature="background"] .preview-card {
    top: 0 !important;
    height: clamp(320px, calc(100vh - 230px), 560px) !important;
  }

  body.feature-focus-mode .task-recent-panel {
    min-height: 96px !important;
    max-height: 128px !important;
  }

  body.feature-focus-mode .task-recent-thumb {
    width: 72px !important;
    height: 86px !important;
  }
}

body.feature-focus-mode {
  height: auto !important;
  min-height: 100vh !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.feature-focus-mode .app-layout,
body.feature-focus-mode .main-area,
body.feature-focus-mode .content-grid,
body.feature-focus-mode .workspace,
body.feature-focus-mode .task-panel,
body.feature-focus-mode .task-body {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

body.feature-focus-mode .app-layout {
  min-height: 100vh !important;
}

body.feature-focus-mode .main-area {
  display: block !important;
}

body.feature-focus-mode .content-grid {
  padding-bottom: 18px !important;
}

body.feature-focus-mode .task-panel {
  grid-template-rows: auto auto auto !important;
  margin-bottom: 18px !important;
}

body.feature-focus-mode .task-body {
  align-items: start !important;
}

body.feature-focus-mode .preview-card {
  height: clamp(320px, 58vh, 560px) !important;
  min-height: 320px !important;
  max-height: 560px !important;
}

body.feature-focus-mode[data-active-feature="background"] .preview-card {
  top: 0 !important;
}

body.feature-focus-mode[data-active-feature="background"] .preview-card {
  height: auto !important;
  min-height: clamp(560px, 78vh, 920px) !important;
  max-height: none !important;
  overflow: visible !important;
}

body.feature-focus-mode[data-active-feature="background"] .preview-frame {
  height: auto !important;
  min-height: inherit !important;
  overflow: visible !important;
}

body.feature-focus-mode[data-active-feature="background"] .preview-empty {
  height: auto !important;
  min-height: inherit !important;
  overflow: visible !important;
}

body.feature-focus-mode[data-active-feature="background"] .preview-empty-visual {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  width: min(100%, 1280px) !important;
  aspect-ratio: auto !important;
  margin: 0 auto !important;
  overflow: visible !important;
}

body.feature-focus-mode[data-active-feature="background"] #preview-frame .preview-empty-visual img {
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
}

body.feature-focus-mode .preview-card {
  height: auto !important;
  min-height: clamp(560px, 78vh, 920px) !important;
  max-height: none !important;
  overflow: visible !important;
}

body.feature-focus-mode .preview-frame,
body.feature-focus-mode .preview-empty {
  height: auto !important;
  min-height: inherit !important;
  overflow: visible !important;
}

body.feature-focus-mode .preview-empty-visual {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  width: min(100%, 1280px) !important;
  aspect-ratio: auto !important;
  margin: 0 auto !important;
  overflow: visible !important;
}

body.feature-focus-mode #preview-frame .preview-empty-visual img {
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
}

body.feature-focus-mode .preview-card {
  min-height: clamp(420px, 62vh, 680px) !important;
}

body.feature-focus-mode .preview-empty-visual {
  display: grid !important;
  place-items: center !important;
  width: min(86%, 980px) !important;
}

body.feature-focus-mode #preview-frame .preview-empty-visual img {
  width: auto !important;
  max-width: 100% !important;
  max-height: min(58vh, 520px) !important;
}

body.feature-focus-mode .preview-empty-visual {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode .preview-empty-visual:hover,
body.feature-focus-mode .preview-empty-visual:focus-visible {
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

body.feature-focus-mode #preview-frame .preview-empty-visual img {
  border-radius: 0 !important;
}

body.feature-focus-mode .preview-card {
  height: calc(100vh - 132px) !important;
  min-height: clamp(520px, 72vh, 860px) !important;
  max-height: none !important;
}

body.feature-focus-mode .preview-frame,
body.feature-focus-mode .preview-empty {
  height: 100% !important;
  min-height: 100% !important;
}

body.feature-focus-mode .preview-empty-visual {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
}

body.feature-focus-mode #preview-frame .preview-empty-visual img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
}

body.feature-focus-mode .task-panel {
  grid-template-rows: auto minmax(0, 1fr) auto !important;
}

body.feature-focus-mode .task-recent-panel {
  display: grid !important;
  min-height: 108px !important;
  max-height: none !important;
  margin-top: 6px !important;
}

body.feature-focus-mode .task-recent-gallery {
  align-items: start !important;
}

body.feature-focus-mode .preview-card {
  height: calc(100vh - 180px) !important;
  min-height: clamp(360px, 58vh, 620px) !important;
  max-height: 620px !important;
}

body.feature-focus-mode .preview-empty-visual {
  width: min(78%, 860px) !important;
}

body.feature-focus-mode #preview-frame .preview-empty-visual img {
  max-height: min(50vh, 420px) !important;
}

body.feature-focus-mode .task-panel {
  height: 100% !important;
  min-height: 0 !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  align-content: stretch !important;
}

body.feature-focus-mode .task-body {
  min-height: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode .preview-column {
  min-height: 0 !important;
}

body.feature-focus-mode .preview-card {
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
}

body.feature-focus-mode .task-recent-panel {
  min-height: 112px !important;
  max-height: 132px !important;
  margin-top: 8px !important;
}

body.feature-focus-mode .preview-empty-visual {
  width: min(74%, 820px) !important;
}

body.feature-focus-mode #preview-frame .preview-empty-visual img {
  max-height: min(46vh, 380px) !important;
}

@media (min-width: 981px) {
  body.feature-focus-mode {
    height: 100vh !important;
    min-height: 100vh !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .app-layout,
  body.feature-focus-mode .main-area {
    height: 100vh !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .content-grid,
  body.feature-focus-mode .workspace {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .main-area {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
  }

  body.feature-focus-mode .content-grid {
    padding: 16px 16px 12px !important;
  }

  body.feature-focus-mode .task-panel {
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    grid-template-rows: auto minmax(0, 1fr) 118px !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .task-body {
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .upload-column,
  body.feature-focus-mode .settings-column {
    min-height: 0 !important;
    overflow: auto !important;
  }

  body.feature-focus-mode .preview-column,
  body.feature-focus-mode .preview-card,
  body.feature-focus-mode .preview-frame,
  body.feature-focus-mode .preview-empty {
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .preview-empty-visual {
    width: 100% !important;
    height: 100% !important;
  }

  body.feature-focus-mode #preview-frame .preview-empty-visual img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: contain !important;
  }

  body.feature-focus-mode .task-recent-panel {
    display: grid !important;
    min-height: 0 !important;
    height: 118px !important;
    max-height: 118px !important;
    margin-top: 0 !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .task-body {
    grid-template-columns: minmax(330px, 0.36fr) minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, auto) minmax(0, 1fr) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    padding-right: 6px !important;
  }

  body.feature-focus-mode .task-body::-webkit-scrollbar {
    width: 6px;
  }

  body.feature-focus-mode .task-body::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(123, 97, 255, 0.24);
  }

  body.feature-focus-mode .upload-column,
  body.feature-focus-mode .settings-column {
    overflow: visible !important;
  }

  body.feature-focus-mode .preview-empty-visual {
    width: 100% !important;
    height: 100% !important;
  }

  body.feature-focus-mode #preview-frame .preview-empty-visual img {
    width: min(100%, calc(0.82 * 100% * 1.58)) !important;
    height: 82% !important;
    max-width: 100% !important;
    max-height: 82% !important;
    object-fit: contain !important;
  }
}

@media (min-width: 981px) {
  body.feature-focus-mode {
    height: auto !important;
    min-height: 100vh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.feature-focus-mode .app-layout,
  body.feature-focus-mode .main-area,
  body.feature-focus-mode .content-grid,
  body.feature-focus-mode .workspace,
  body.feature-focus-mode .task-panel,
  body.feature-focus-mode .task-body {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.feature-focus-mode .main-area {
    display: block !important;
  }

  body.feature-focus-mode .content-grid {
    padding: 16px 24px 28px !important;
  }

  body.feature-focus-mode .task-panel {
    gap: 14px !important;
    margin: 0 !important;
    padding: 18px 22px !important;
    grid-template-rows: auto auto auto !important;
  }

  body.feature-focus-mode .task-body {
    grid-template-columns: minmax(450px, 520px) minmax(0, 1fr) !important;
    grid-template-rows: auto !important;
    align-items: start !important;
    gap: 18px 24px !important;
    padding-right: 0 !important;
  }

  body.feature-focus-mode .upload-column,
  body.feature-focus-mode .settings-column {
    grid-column: 1 / 2 !important;
    overflow: visible !important;
    align-self: start !important;
  }

  body.feature-focus-mode .upload-column {
    grid-row: 1 !important;
    min-height: 0 !important;
    height: auto !important;
  }

  body.feature-focus-mode .settings-column {
    grid-row: 1 !important;
    margin-top: calc(var(--upload-column-height, 0px) + 18px) !important;
    min-height: 0 !important;
    height: auto !important;
  }

  body.feature-focus-mode .preview-column {
    grid-column: 2 / 3 !important;
    grid-row: 1 !important;
    align-self: start !important;
    min-height: 0 !important;
  }

body.feature-focus-mode .preview-card {
  height: clamp(560px, 64vh, 760px) !important;
  min-height: 560px !important;
  max-height: 760px !important;
  overflow: hidden !important;
  }

  body.feature-focus-mode .preview-frame,
  body.feature-focus-mode .preview-empty {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .preview-empty-visual {
    width: min(86%, 980px) !important;
    height: 86% !important;
    max-width: 980px !important;
    max-height: 86% !important;
  }

  body.feature-focus-mode #preview-frame .preview-empty-visual img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
  }

  body.feature-focus-mode .task-recent-panel {
    display: grid !important;
    height: auto !important;
    min-height: 126px !important;
    max-height: none !important;
    margin-top: 4px !important;
    overflow: hidden !important;
  }
}

@media (min-width: 981px) {
  body.feature-focus-mode[data-active-feature="wrinkle"] .task-panel {
    display: grid !important;
    grid-template-columns: minmax(400px, 500px) minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto auto !important;
    gap: 0 28px !important;
    align-items: start !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .task-heading {
    grid-column: 1 / 2 !important;
    grid-row: 1 !important;
    padding: 18px 22px 10px !important;
    border: 1px solid #efeff8 !important;
    border-bottom: 0 !important;
    border-radius: 22px 22px 0 0 !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 18px 42px rgba(45, 42, 86, 0.08) !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .task-body {
    display: contents !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .upload-column {
    grid-column: 1 / 2 !important;
    grid-row: 2 !important;
    padding: 0 22px 16px !important;
    border-right: 1px solid #efeff8 !important;
    border-left: 1px solid #efeff8 !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 18px 42px rgba(45, 42, 86, 0.08) !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .settings-column {
    grid-column: 1 / 2 !important;
    grid-row: 3 !important;
    margin-top: 0 !important;
    padding: 0 22px 22px !important;
    border: 1px solid #efeff8 !important;
    border-top: 0 !important;
    border-radius: 0 0 22px 22px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 18px 42px rgba(45, 42, 86, 0.08) !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .task-heading::after,
  body.feature-focus-mode[data-active-feature="wrinkle"] .upload-column::after,
  body.feature-focus-mode[data-active-feature="wrinkle"] .settings-column::before {
    content: none !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .preview-column {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 4 !important;
    min-height: 0 !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .preview-card {
    height: clamp(560px, 64vh, 760px) !important;
    min-height: 560px !important;
    max-height: 760px !important;
    border: 1px solid #efeff8 !important;
    border-radius: 22px !important;
    background: rgba(245, 244, 251, 0.96) !important;
    box-shadow: var(--shadow) !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .task-recent-panel {
    grid-column: 2 / 3 !important;
    grid-row: 4 !important;
    height: auto !important;
    min-height: 126px !important;
    margin-top: 0 !important;
    border: 1px solid #efeff8 !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: var(--shadow) !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .task-panel {
    position: relative !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .task-panel::before {
    content: "" !important;
    grid-column: 1 / 2 !important;
    grid-row: 1 / 4 !important;
    align-self: stretch !important;
    border: 1px solid #efeff8 !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 18px 42px rgba(45, 42, 86, 0.08) !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .task-heading,
  body.feature-focus-mode[data-active-feature="wrinkle"] .upload-column,
  body.feature-focus-mode[data-active-feature="wrinkle"] .settings-column {
    position: relative !important;
    z-index: 1 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .task-heading {
    padding: 18px 22px 10px !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .upload-column {
    padding: 0 22px 16px !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .settings-column {
    padding: 0 22px 22px !important;
  }
}

@media (min-width: 981px) {
  body.feature-focus-mode {
    height: 100vh !important;
    min-height: 100vh !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .app-layout,
  body.feature-focus-mode .main-area {
    height: 100vh !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .main-area {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
  }

  body.feature-focus-mode .content-grid,
  body.feature-focus-mode .workspace {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .content-grid {
    padding: 16px 24px 18px !important;
  }

  body.feature-focus-mode .task-panel {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .task-body {
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .settings-column {
    display: grid !important;
    grid-template-rows: minmax(0, 1fr) auto !important;
    align-content: stretch !important;
    gap: 12px !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .settings-scroll-area {
    display: grid !important;
    gap: 12px !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    padding-right: 4px !important;
  }

  body.feature-focus-mode .settings-scroll-area::-webkit-scrollbar {
    width: 6px;
  }

  body.feature-focus-mode .settings-scroll-area::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(123, 97, 255, 0.24);
  }

  body.feature-focus-mode[data-active-feature="detail-page"] .settings-bottom-area {
    display: grid !important;
    gap: 10px !important;
    min-height: 0 !important;
    padding-top: 10px !important;
    border-top: 1px solid rgba(232, 230, 242, 0.9) !important;
    background: rgba(255, 255, 255, 0.82) !important;
  }

  body.feature-focus-mode[data-active-feature="detail-page"] .generate-count-box {
    flex: none !important;
  }

  body.feature-focus-mode[data-active-feature="detail-page"] .create-button.full {
    flex: none !important;
    min-height: 56px !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .task-panel {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    grid-template-rows: auto auto minmax(0, 1fr) auto !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .task-panel::before {
    grid-row: 1 / 5 !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .settings-column {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    padding: 0 22px 22px !important;
    grid-row: 3 / 5 !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .settings-scroll-area {
    align-content: start !important;
    align-items: start !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .extra-prompt-box {
    display: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-bottom-area {
    align-self: end !important;
    padding-top: 8px !important;
    background: transparent !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-box {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px 10px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-options {
    grid-template-columns: repeat(4, minmax(42px, 1fr)) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generation-resolution-options {
    grid-template-columns: repeat(3, minmax(48px, 1fr)) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .generate-count-options {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    gap: 12px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .generate-count-box {
    grid-template-columns: 1fr !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .count-option {
    width: 100% !important;
    min-height: 48px !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .preview-column {
    height: 100% !important;
    min-height: 0 !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .preview-card {
    height: calc(100% - 22px) !important;
    min-height: 0 !important;
    max-height: none !important;
  }

  body.feature-focus-mode[data-active-feature="wrinkle"] .task-recent-panel {
    height: 126px !important;
    min-height: 126px !important;
    max-height: 126px !important;
    margin-top: 14px !important;
    overflow: hidden !important;
  }
}

@media (min-width: 981px) and (max-height: 680px) {
  body.feature-focus-mode[data-active-feature="detail-page"] .settings-bottom-area {
    gap: 8px !important;
  }

  body.feature-focus-mode[data-active-feature="detail-page"] .generate-count-box {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px 10px !important;
    padding: 0 !important;
  }

  body.feature-focus-mode .generate-count-label small {
    display: block !important;
    font-size: 12px !important;
  }

  body.feature-focus-mode[data-active-feature="detail-page"] .create-button.full {
    min-height: 56px !important;
  }
}

@media (max-width: 980px) {
  body.feature-focus-mode .settings-column {
    display: grid !important;
    grid-template-rows: minmax(0, 1fr) auto !important;
    gap: 12px !important;
    min-height: 0 !important;
    height: min(620px, calc(100vh - 24px)) !important;
    max-height: calc(100vh - 24px) !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode .settings-scroll-area {
    display: grid !important;
    gap: 12px !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    padding-right: 4px !important;
  }

  body.feature-focus-mode[data-active-feature="detail-page"] .settings-bottom-area {
    display: grid !important;
    gap: 10px !important;
    padding-top: 10px !important;
    border-top: 1px solid rgba(232, 230, 242, 0.9) !important;
    background: rgba(255, 255, 255, 0.9) !important;
  }

  body.feature-focus-mode[data-active-feature="detail-page"] .generate-count-box {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  body.feature-focus-mode[data-active-feature="detail-page"] .create-button.full {
    min-height: 56px !important;
  }

  body.feature-focus-mode .generate-count-label small {
    display: block !important;
    font-size: 12px !important;
  }
}

body.workstation-feature-mode .settings-scroll-area {
  align-content: start !important;
  align-items: start !important;
  grid-auto-rows: max-content !important;
}

body.workstation-feature-mode .extra-prompt-box {
  align-self: start !important;
  height: auto !important;
  min-height: 0 !important;
  gap: 12px !important;
  padding: 14px !important;
  border-radius: 18px !important;
}

body.workstation-feature-mode .extra-prompt-box textarea {
  height: 150px !important;
  min-height: 150px !important;
  max-height: 150px !important;
}

body.workstation-feature-mode[data-active-feature="repair"] .extra-prompt-box textarea {
  height: 228px !important;
  min-height: 228px !important;
  max-height: 228px !important;
}

body.workstation-feature-mode[data-active-feature="detail-page"] .settings-bottom-area {
  align-self: end !important;
}

body.workstation-feature-mode .task-panel {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.workstation-feature-mode .task-panel::before {
  content: none !important;
}

body.workstation-feature-mode .task-heading,
body.workstation-feature-mode .upload-column,
body.workstation-feature-mode .settings-column {
  background: rgba(255, 255, 255, 0.96) !important;
}

body.workstation-feature-mode .task-heading {
  border: 1px solid #efeff8 !important;
  border-bottom: 0 !important;
  border-radius: 22px 22px 0 0 !important;
}

body.workstation-feature-mode .upload-column {
  border-right: 1px solid #efeff8 !important;
  border-left: 1px solid #efeff8 !important;
}

body.workstation-feature-mode .settings-column {
  border: 1px solid #efeff8 !important;
  border-top: 0 !important;
  border-radius: 0 0 22px 22px !important;
}

body.workstation-feature-mode .preview-card {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.workstation-feature-mode .task-panel {
  padding-top: 14px !important;
}

body.workstation-feature-mode #clear-upload {
  display: none !important;
}

body.workstation-feature-mode #upload-example-button {
  display: inline-flex !important;
}

body.workstation-feature-mode #upload-example-button {
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  text-align: center !important;
  line-height: 1.2 !important;
}

#preview-badge {
  display: none !important;
}

body.feature-focus-mode .preview-gallery {
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  gap: 4px !important;
  padding: 4px !important;
}

body.feature-focus-mode .preview-gallery figure {
  gap: 3px !important;
}

body.feature-focus-mode .preview-gallery img {
  border-radius: 10px !important;
}

body.feature-focus-mode .preview-gallery figcaption {
  font-size: 11px !important;
}

html,
body {
  min-width: 0 !important;
  overflow-x: hidden !important;
}

.app-layout {
  grid-template-columns: 274px minmax(0, 1fr) !important;
  min-width: 0 !important;
}

.sidebar {
  width: 274px !important;
  min-width: 274px !important;
}

.main-area,
.content-grid,
.workspace,
.task-panel {
  min-width: 0 !important;
}

.topbar {
  display: flex !important;
  flex-wrap: nowrap !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none;
}

.topbar::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.top-library-tabs,
.top-actions,
.library-shortcuts,
.generation-channel-switch {
  flex: 0 0 auto !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
}

.library-button,
.free-generate-button,
.points-button,
.need-request-button,
.shop-button,
.generation-channel-switch button {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}

body.feature-focus-mode {
  min-width: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode .app-layout {
  min-width: 0 !important;
}

body.feature-focus-mode .main-area {
  min-width: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
}

body.feature-focus-mode .content-grid {
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 16px 24px 18px !important;
  background: #fff !important;
}

body.feature-focus-mode .workspace {
  min-width: 1044px !important;
  width: 100% !important;
  height: 100% !important;
  overflow: visible !important;
  background: #fff !important;
}

body.feature-focus-mode .task-panel {
  width: 100% !important;
  min-width: 1044px !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
}

body.workstation-feature-mode .task-body:not([hidden]) {
  display: contents !important;
}

body.workstation-feature-mode .task-panel {
  display: grid !important;
  grid-template-columns: minmax(400px, 500px) minmax(560px, 1fr) !important;
  grid-template-rows: auto auto minmax(0, 1fr) 126px !important;
  gap: 0 28px !important;
  align-items: stretch !important;
  padding: 14px 0 0 !important;
}

body.workstation-feature-mode .task-heading,
body.workstation-feature-mode .upload-column,
body.workstation-feature-mode .settings-column {
  width: auto !important;
  min-width: 0 !important;
}

body.workstation-feature-mode .task-heading {
  grid-column: 1 / 2 !important;
  grid-row: 1 !important;
  padding: 20px 22px 10px !important;
  border: 1px solid #efeff8 !important;
  border-bottom: 0 !important;
  border-radius: 22px 22px 0 0 !important;
  background: rgba(255, 255, 255, 0.96) !important;
}

body.workstation-feature-mode .upload-column {
  grid-column: 1 / 2 !important;
  grid-row: 2 !important;
  padding: 0 22px 16px !important;
  border-right: 1px solid #efeff8 !important;
  border-left: 1px solid #efeff8 !important;
  background: rgba(255, 255, 255, 0.96) !important;
}

body.workstation-feature-mode .settings-column {
  grid-column: 1 / 2 !important;
  grid-row: 3 / 5 !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 22px 22px !important;
  border: 1px solid #efeff8 !important;
  border-top: 0 !important;
  border-radius: 0 0 22px 22px !important;
  background: rgba(255, 255, 255, 0.96) !important;
}

body.workstation-feature-mode .preview-column {
  grid-column: 2 / 3 !important;
  grid-row: 1 / 4 !important;
  height: 100% !important;
  min-height: 0 !important;
}

body.workstation-feature-mode .preview-card {
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  top: auto !important;
  border: 0 !important;
  border-radius: 18px !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.workstation-feature-mode .task-recent-panel {
  grid-column: 2 / 3 !important;
  grid-row: 4 !important;
  height: 126px !important;
  min-height: 126px !important;
  max-height: 126px !important;
  margin-top: 14px !important;
  overflow: hidden !important;
  border: 1px solid #efeff8 !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: var(--shadow) !important;
}

body.workstation-feature-mode .upload-primary-row {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 8px !important;
}

body.workstation-feature-mode .upload-primary-row {
  width: 100% !important;
  grid-template-columns: minmax(0, 1fr) minmax(144px, 156px) !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
}

body.workstation-feature-mode .upload-card-wrap,
body.workstation-feature-mode .upload-example-button {
  min-width: 0 !important;
  height: 100% !important;
}

#upload-example-button,
#preview-empty-use-example {
  display: none !important;
}

.set-shot-picker {
  display: grid;
  gap: 14px;
}

.set-shot-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.set-shot-actions .choice-button {
  min-height: 40px;
  padding: 7px 10px;
  justify-items: center;
  align-content: center;
  text-align: center;
  border-radius: 999px;
  background: #fff;
  font-size: 13px;
  font-weight: 525;
}

.set-shot-actions .choice-button.selected {
  border-color: rgba(102, 87, 255, 0.5);
  color: #4b3dce;
  background: #f4f1ff;
  box-shadow: inset 0 0 0 1px rgba(102, 87, 255, 0.08);
}

.set-shot-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.set-shot-option {
  min-height: 36px;
  padding: 7px 8px;
  border: 1px solid rgba(117, 104, 255, 0.16);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.82);
  color: #403a5f;
  font-size: 12.5px;
  font-weight: 525;
  line-height: 1.2;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
}

.set-shot-option:hover {
  border-color: rgba(117, 104, 255, 0.42);
  background: #ffffff;
}

.set-shot-option.selected {
  border-color: rgba(117, 104, 255, 0.46);
  background: rgba(117, 104, 255, 0.1);
  color: #4b3dce;
}

body.feature-focus-mode[data-active-feature="set-generate"] .settings-scroll-area {
  padding-bottom: 18px !important;
}

body.feature-focus-mode[data-active-feature="set-generate"] .set-generate-settings {
  display: grid;
  gap: 14px;
}

body.feature-focus-mode[data-active-feature="set-generate"] .set-product-type-block {
  display: grid;
  gap: 14px;
}

body.feature-focus-mode[data-active-feature="set-generate"] .extra-prompt-box {
  display: none !important;
}

body.feature-focus-mode[data-active-feature="set-generate"] .settings-head {
  display: none !important;
}

body.feature-focus-mode[data-active-feature="set-generate"] .set-shot-picker {
  max-height: none;
  overflow: visible;
  padding-right: 0;
}

@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .settings-column {
    display: grid !important;
    grid-row: 3 / 5 !important;
    grid-template-rows: minmax(0, 1fr) auto !important;
    align-content: stretch !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .settings-scroll-area {
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .settings-card {
    min-height: 0 !important;
    overflow: visible !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] #dynamic-settings {
    min-height: 0 !important;
    overflow: visible !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .settings-bottom-area {
    align-self: end !important;
    min-height: 0 !important;
    overflow: visible !important;
    gap: 12px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .generate-count-box {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px 10px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-ratio-section {
    grid-column: 1 / -1 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .generate-count-section,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .generation-resolution-section {
    grid-column: auto !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .generate-count-section,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-ratio-section,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .generation-resolution-section {
    gap: 8px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .generate-count-label {
    gap: 4px !important;
    font-size: 14px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .generate-count-label small {
    display: block !important;
    font-size: 11.5px !important;
    line-height: 1.25 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-ratio-select summary {
    min-height: 34px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .count-option,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .resolution-option {
    min-height: 32px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .inline-model-section {
    padding: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .inline-model-section summary {
    min-height: 56px !important;
    padding: 8px 11px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .inline-model-option {
    min-height: 38px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .inline-model-section .generate-count-label small {
    display: block !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .create-button.full {
    min-height: 56px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .choice-grid > .choice-button {
    min-height: 42px !important;
    padding: 8px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-mode-button {
    min-height: 56px !important;
    font-size: 15px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-mode-button small {
    font-size: 11px !important;
    line-height: 1.2 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-product-type-grid .choice-button {
    min-height: 40px !important;
    font-size: 14px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-shot-actions .choice-button {
    min-height: 40px !important;
    padding: 6px 8px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-shot-option {
    min-height: 36px !important;
    padding: 7px 8px !important;
    border-radius: 10px !important;
    font-size: 12.5px !important;
  }
}

/* Final free-generate standalone override. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .topbar,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .workspace,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .task-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .works-panel {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .content-grid {
  height: 100% !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #f6f7fb !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-generate-page {
  display: block !important;
}

@media (max-width: 980px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .content-grid {
    min-height: auto !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-generate-page {
    min-width: 0 !important;
    height: auto !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-shell {
    height: auto !important;
    min-height: calc(100vh - 20px) !important;
    padding: 12px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-composer {
    grid-template-columns: 1fr !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-setting-row {
    grid-template-columns: 1fr !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-ratio-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-actions {
  grid-template-columns: 1fr !important;
}
}

/* Free generate compact workbench - 20260630 */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .topbar {
  display: flex !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .task-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .works-panel {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .workspace {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .hero-card,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .function-board {
  display: none !important;
}

/* Generated work thumbnails are refreshed by task polling; keep completed images stable. */
.work-thumb img,
.project-image-card img,
.work-detail-thumb img,
.task-recent-thumb img,
.wrinkle-latest-thumb img,
.video-latest-media img {
  animation: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .content-grid {
  min-height: calc(100vh - 76px) !important;
  padding: 18px !important;
  overflow: auto !important;
  background: #f6f7f9 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-generate-page {
  display: block !important;
  width: min(1180px, 100%) !important;
  min-width: 0 !important;
  min-height: auto !important;
  height: auto !important;
  margin: 0 auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-shell {
  display: grid !important;
  grid-template-columns: minmax(0, 1.1fr) minmax(360px, 0.9fr) !important;
  gap: 16px !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-stage,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-composer {
  border: 1px solid #e5e7eb !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-stage {
  display: grid !important;
  grid-template-rows: auto minmax(420px, 1fr) !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 18px 20px !important;
  border-bottom: 1px solid #eef0f4 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-hero-copy {
  max-width: none !important;
  margin: 0 !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-hero-copy span {
  display: block !important;
  color: #8b93a5 !important;
  font-size: 12px !important;
  font-weight: 520 !important;
  letter-spacing: 0.08em !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-hero-copy h1 {
  margin: 4px 0 5px !important;
  color: #1f2937 !important;
  font-size: 24px !important;
  font-weight: 620 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-hero-copy p {
  margin: 0 !important;
  color: #667085 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-upload-button {
  min-height: 42px !important;
  padding: 0 16px !important;
  border: 1px solid #d8dde8 !important;
  border-radius: 10px !important;
  color: #1f2937 !important;
  background: #fff !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-upload-zone {
  display: grid !important;
  min-height: 420px !important;
  padding: 18px !important;
  overflow: auto !important;
  background: #fbfcfe !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-upload-preview:empty {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-upload-preview:not(:empty) + .free-page-empty-state {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-empty-state {
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 10px !important;
  min-height: 100% !important;
  border: 1px dashed #cfd5e2 !important;
  border-radius: 12px !important;
  color: #667085 !important;
  background: #fff !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-empty-state span {
  display: grid !important;
  place-items: center !important;
  width: 54px !important;
  height: 54px !important;
  border-radius: 14px !important;
  color: #4f46e5 !important;
  background: #f3f4ff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-empty-state strong {
  color: #1f2937 !important;
  font-size: 18px !important;
  font-weight: 620 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-empty-state small {
  color: #8b93a5 !important;
  font-size: 13px !important;
  font-weight: 520 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-reference-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)) !important;
  gap: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-reference-card {
  margin: 0 !important;
  padding: 8px !important;
  border: 1px solid #eceef5 !important;
  border-radius: 12px !important;
  background: #fff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-reference-card img {
  width: 100% !important;
  aspect-ratio: 1 !important;
  border-radius: 9px !important;
  object-fit: cover !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-composer {
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-content: start !important;
  gap: 14px !important;
  padding: 18px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-prompt {
  display: grid !important;
  gap: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-prompt span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-setting-row > span {
  color: #4b5563 !important;
  font-size: 13px !important;
  font-weight: 560 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] #free-page-prompt {
  min-height: 150px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  border: 1px solid #e1e5ee !important;
  border-radius: 12px !important;
  padding: 13px 14px !important;
  color: #1f2937 !important;
  background: #fbfcfe !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  resize: vertical !important;
  outline: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-settings {
  display: grid !important;
  gap: 11px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-setting-row {
  display: grid !important;
  grid-template-columns: 48px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-select {
  position: relative !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-select summary {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 42px !important;
  padding: 0 12px !important;
  border: 1px solid #e1e5ee !important;
  border-radius: 10px !important;
  color: #1f2937 !important;
  background: #fff !important;
  cursor: pointer !important;
  list-style: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-select summary::-webkit-details-marker {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-select-menu {
  position: absolute !important;
  z-index: 80 !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 10px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 16px 38px rgba(15, 23, 42, 0.12) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-ratio-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-count-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-select-menu button {
  min-height: 36px !important;
  border: 1px solid #e2e6ef !important;
  border-radius: 9px !important;
  color: #4b5563 !important;
  background: #fff !important;
  font-size: 13px !important;
  font-weight: 540 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-select-menu button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-select-menu button[aria-pressed="true"] {
  border-color: #4f46e5 !important;
  color: #3730a3 !important;
  background: #eef2ff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-actions {
  display: grid !important;
  grid-template-columns: 0.38fr 1fr !important;
  gap: 10px !important;
  margin-top: 2px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-clear-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-generate-button {
  min-height: 50px !important;
  border-radius: 11px !important;
  font-weight: 580 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-clear-button {
  border: 1px solid #e1e5ee !important;
  color: #667085 !important;
  background: #fff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-generate-button {
  border: 0 !important;
  color: #fff !important;
  background: #1f2937 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-generate-button small {
  color: rgba(255, 255, 255, 0.72) !important;
  font-size: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-toast {
  position: fixed !important;
  left: 50% !important;
  bottom: 28px !important;
  z-index: 3000 !important;
  transform: translateX(-50%) !important;
  padding: 10px 14px !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: rgba(17, 24, 39, 0.86) !important;
}

@media (max-width: 980px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-shell {
    grid-template-columns: 1fr !important;
  }
}

/* Free generate standard workstation override - keep at file end. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .topbar {
  display: flex !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .workspace {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .hero-card,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .function-board,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-generate-page,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .works-panel {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .task-panel {
  display: grid !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .content-grid {
  height: calc(100vh - 64px) !important;
  min-height: 0 !important;
  max-height: calc(100vh - 64px) !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  padding: 32px 24px 30px !important;
  background: #f6f7f9 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .extra-prompt-box {
  display: grid !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .preview-empty,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .preview-empty-visual,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .preview-empty-actions {
  display: flex !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .settings-card {
  display: block !important;
}

/* Free generate uses the standard workstation layout. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .workspace {
  display: block !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .hero-card,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .function-board,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-generate-page {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .task-panel {
  display: grid !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .works-panel {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .content-grid {
  height: calc(100vh - 64px) !important;
  min-height: 0 !important;
  max-height: calc(100vh - 64px) !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  padding: 32px 24px 30px !important;
  background: #f6f7f9 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .extra-prompt-box {
  display: grid !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .preview-empty,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .preview-empty-visual,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .preview-empty-actions {
  display: flex !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .settings-card {
  display: block !important;
}

/* Free generate visibility guard after legacy overrides. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .workspace {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .hero-card,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .function-board {
  display: none !important;
}

/* Final set-generate layout guard: keep settings scroll area above the fixed generate controls. */
@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .settings-column {
    display: grid !important;
    grid-template-rows: minmax(0, 1fr) auto !important;
    align-content: stretch !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .settings-scroll-area {
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .settings-bottom-area {
    align-self: end !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
}

/* Final composer-only layout for free-generate. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .content-grid {
  background: #f7f6fb !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-shell {
  grid-template-rows: minmax(0, 1fr) auto !important;
  gap: 18px !important;
  height: 100% !important;
  padding: 22px 26px 24px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-stage {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-head {
  padding: 0 0 14px !important;
  border-bottom: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-upload-zone {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-empty-state {
  min-height: 100% !important;
  border: 1px dashed #ddd8ea !important;
  border-radius: 18px !important;
  color: #8a8399 !important;
  background: rgba(255, 255, 255, 0.45) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-composer {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  width: min(100%, 1160px) !important;
  min-height: 226px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(179, 128, 255, 0.56) !important;
  border-radius: 20px !important;
  background: #fff !important;
  box-shadow: 0 18px 44px rgba(146, 99, 255, 0.18) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] #free-page-prompt {
  display: block !important;
  width: 100% !important;
  min-height: 148px !important;
  height: 148px !important;
  padding: 22px 24px 12px !important;
  resize: none !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #252b3a !important;
  background: transparent !important;
  font-size: 18px !important;
  line-height: 1.65 !important;
  outline: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] #free-page-prompt::placeholder {
  color: #a6a2ad !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-toolbar {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 14px !important;
  min-height: 76px !important;
  padding: 0 20px 20px !important;
  box-sizing: border-box !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-toolbar-left {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-tool-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-inline-group {
  min-height: 44px !important;
  border: 1px solid #dedde6 !important;
  border-radius: 9px !important;
  background: #fff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-tool-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 0 14px !important;
  color: #2f3442 !important;
  font-size: 15px !important;
  font-weight: 525 !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-tool-button .lucide {
  width: 18px !important;
  height: 18px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-inline-group {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 4px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-inline-group button {
  min-width: 42px !important;
  min-height: 34px !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 7px !important;
  color: #686476 !important;
  background: transparent !important;
  font-size: 13px !important;
  font-weight: 525 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-inline-group button.selected {
  color: #7a45db !important;
  background: #f3eaff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-ratio-group {
  max-width: 292px !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-ratio-group::-webkit-scrollbar {
  width: 0;
  height: 0;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-clear-button[hidden] {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-generate-button {
  position: relative !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 12px !important;
  color: #fff !important;
  background: #d9b8ff !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-generate-button .lucide {
  width: 25px !important;
  height: 25px !important;
  stroke-width: 2.5 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-generate-button small {
  position: absolute !important;
  right: 0 !important;
  bottom: calc(100% + 6px) !important;
  display: none !important;
  min-width: max-content !important;
  color: #8e6ab8 !important;
  font-size: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-generate-button:hover small {
  display: block !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-prompt {
  position: relative !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-prompt .free-page-toolbar {
  position: absolute !important;
  left: 18px !important;
  right: 18px !important;
  bottom: 18px !important;
  z-index: 3 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-height: 36px !important;
  padding: 0 !important;
  pointer-events: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-prompt .free-page-toolbar-left {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  pointer-events: auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-prompt .free-page-tool-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-prompt .free-prompt-optimize-button {
  position: static !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
  min-height: 34px !important;
  height: 34px !important;
  border-radius: 999px !important;
  pointer-events: auto !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-prompt .free-page-tool-button {
  padding: 0 13px !important;
  border: 1px solid rgba(91, 73, 230, 0.18) !important;
  color: #8f86aa !important;
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: 0 8px 18px rgba(91, 73, 230, 0.08) !important;
  font-size: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-prompt .free-page-tool-button:hover {
  border-color: rgba(91, 73, 230, 0.34) !important;
  color: #5b4be8 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-prompt #free-page-prompt {
  padding-bottom: 64px !important;
}

@media (max-width: 1180px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-composer {
    min-height: 278px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-toolbar {
    align-items: stretch !important;
  }
}

/* Free-generate composer redesign: all controls live in the bottom prompt box. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .content-grid {
  background: #f7f6fb !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-shell {
  grid-template-rows: minmax(0, 1fr) auto !important;
  gap: 18px !important;
  height: 100% !important;
  padding: 22px 26px 24px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-stage {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-head {
  padding: 0 0 14px !important;
  border-bottom: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-upload-zone {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-empty-state {
  min-height: 100% !important;
  border: 1px dashed #ddd8ea !important;
  border-radius: 18px !important;
  color: #8a8399 !important;
  background: rgba(255, 255, 255, 0.45) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-composer {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  width: min(100%, 1160px) !important;
  min-height: 226px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(179, 128, 255, 0.56) !important;
  border-radius: 20px !important;
  background: #fff !important;
  box-shadow: 0 18px 44px rgba(146, 99, 255, 0.18) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] #free-page-prompt {
  display: block !important;
  width: 100% !important;
  min-height: 148px !important;
  height: 148px !important;
  padding: 22px 24px 12px !important;
  resize: none !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #252b3a !important;
  background: transparent !important;
  font-size: 18px !important;
  line-height: 1.65 !important;
  outline: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] #free-page-prompt::placeholder {
  color: #a6a2ad !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-toolbar {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 14px !important;
  min-height: 76px !important;
  padding: 0 20px 20px !important;
  box-sizing: border-box !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-toolbar-left {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-tool-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-inline-group {
  min-height: 44px !important;
  border: 1px solid #dedde6 !important;
  border-radius: 9px !important;
  background: #fff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-tool-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 0 14px !important;
  color: #2f3442 !important;
  font-size: 15px !important;
  font-weight: 525 !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-tool-button .lucide {
  width: 18px !important;
  height: 18px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-inline-group {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 4px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-inline-group button {
  min-width: 42px !important;
  min-height: 34px !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 7px !important;
  color: #686476 !important;
  background: transparent !important;
  font-size: 13px !important;
  font-weight: 525 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-inline-group button.selected {
  color: #7a45db !important;
  background: #f3eaff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-ratio-group {
  max-width: 292px !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-ratio-group::-webkit-scrollbar {
  width: 0;
  height: 0;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-clear-button[hidden] {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-generate-button {
  position: relative !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 12px !important;
  color: #fff !important;
  background: #d9b8ff !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-generate-button .lucide {
  width: 25px !important;
  height: 25px !important;
  stroke-width: 2.5 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-generate-button small {
  position: absolute !important;
  right: 0 !important;
  bottom: calc(100% + 6px) !important;
  display: none !important;
  min-width: max-content !important;
  color: #8e6ab8 !important;
  font-size: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-generate-button:hover small {
  display: block !important;
}

@media (max-width: 1180px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-composer {
    min-height: 278px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-toolbar {
    align-items: stretch !important;
  }
}
@media (max-width: 980px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .content-grid {
    min-height: auto !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-generate-page {
    min-width: 0 !important;
    height: auto !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-shell {
    height: auto !important;
    min-height: calc(100vh - 20px) !important;
    padding: 12px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-composer {
    grid-template-columns: 1fr !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-setting-row {
    grid-template-columns: 1fr !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-ratio-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-actions {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 980px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .content-grid {
    min-height: auto !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-generate-page {
    min-width: 0 !important;
    height: auto !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-shell {
    height: auto !important;
    min-height: calc(100vh - 20px) !important;
    padding: 12px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-composer {
    grid-template-columns: 1fr !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-setting-row {
    grid-template-columns: 1fr !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-ratio-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-actions {
    grid-template-columns: 1fr !important;
  }
}

/* Free generate is a standalone page; keep these rules last so workstation overrides cannot leak in. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .topbar,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .workspace,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .task-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .works-panel {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .content-grid {
  height: 100% !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #f6f7fb !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-generate-page {
  display: block !important;
}

@media (max-width: 980px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .content-grid {
    min-height: auto !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  body.feature-focus-mode[data-active-feature="free-generate"] .free-generate-page {
    min-width: 0;
    height: auto;
  }

  .free-page-shell {
    height: auto;
    min-height: calc(100vh - 20px);
    padding: 12px;
  }

  .free-page-composer {
    grid-template-columns: 1fr;
  }

  .free-page-setting-row {
    grid-template-columns: 1fr;
  }

  .free-page-ratio-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .free-page-actions {
    grid-template-columns: 1fr;
  }
}

body.workstation-feature-mode .upload-primary-row {
  width: 100% !important;
  min-width: 100% !important;
  justify-self: stretch !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
}

body.workstation-feature-mode .upload-card-wrap,
body.workstation-feature-mode #product-upload,
body.workstation-feature-mode #upload-example-button,
body.workstation-feature-mode .library-select-row,
body.workstation-feature-mode .extra-prompt-box {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

body.workstation-feature-mode .task-panel {
  row-gap: 16px !important;
}

body.workstation-feature-mode .upload-column,
body.workstation-feature-mode .settings-column,
body.workstation-feature-mode .preview-column,
body.workstation-feature-mode .task-recent-panel {
  margin-top: 0 !important;
}

body.workstation-feature-mode .preview-column {
  gap: 14px !important;
}

body.workstation-feature-mode .settings-column {
  padding-bottom: 34px !important;
}

body.workstation-feature-mode[data-active-feature="detail-page"] .settings-bottom-area {
  padding-bottom: 8px !important;
}

body.workstation-feature-mode .library-select-row {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

body.workstation-feature-mode[data-active-feature="hd-upscale"] .library-select-row {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body.workstation-feature-mode[data-active-feature="outpaint"] .library-select-row {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body.workstation-feature-mode[data-active-feature="watermark-remove"] .upload-column > .library-select-row {
  display: none !important;
}

body.workstation-feature-mode[data-active-feature="pose-change"] .upload-column > .library-select-row {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.workstation-feature-mode[data-active-feature="pose-change"] #product-library-select {
  display: none !important;
}

body.workstation-feature-mode[data-active-feature="pose-change"] .upload-column > .library-select-row [data-library-picker="model"] {
  width: 100% !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .task-panel {
  grid-template-columns: minmax(360px, 460px) minmax(560px, 1fr) !important;
  grid-template-rows: auto auto minmax(0, 1fr) 126px !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .task-heading {
  grid-row: 1 !important;
  border-bottom: 1px solid #efeff8 !important;
  border-radius: 22px 22px 0 0 !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .settings-column {
  grid-row: 3 / 5 !important;
  padding-top: 4px !important;
  border-top: 0 !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .upload-column {
  display: grid !important;
  grid-row: 2 !important;
  padding: 4px 22px 14px !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .preview-column {
  grid-row: 1 / 3 !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .task-recent-panel {
  grid-row: 3 !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .upload-primary-row {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] #product-upload {
  min-height: 106px !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .upload-copy strong::after {
  content: "閿涘牆褰查柅澶涚礆";
  margin-left: 4px;
  color: #8b7cff;
  font-size: 12px;
  font-weight: 525;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] #clear-upload {
  display: inline-flex !important;
  min-height: 38px !important;
  justify-content: center !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-result-panel {
  padding: 22px !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] #upload-stack {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 8px !important;
  margin-top: 0 !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] #upload-stack[hidden] {
  display: none !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .xhs-upload-preview {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 16px !important;
  background: #f7f6fb !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .xhs-upload-preview img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: transparent !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .xhs-upload-preview .upload-stack-delete {
  z-index: 4 !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .upload-copy strong::after {
  content: "" !important;
  display: none !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-post-card {
  padding: 0 !important;
  border: 1px solid #d8d3ff !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #f4f1ff 0, #ffffff 76px) !important;
  box-shadow: 0 12px 28px rgba(79, 70, 229, 0.08) !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-post-top {
  min-height: 42px !important;
  padding: 0 14px !important;
  border-bottom: 1px solid #ddd8ff !important;
  background: #f1eeff !important;
  color: #4f46c7 !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-post-title {
  gap: 8px !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-post-title .lucide {
  width: 16px !important;
  height: 16px !important;
  color: #6d5df2 !important;
  fill: rgba(109, 93, 242, 0.14) !important;
  stroke-width: 2.2 !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-post-title strong {
  color: #4f46c7 !important;
  font-size: 15px !important;
  font-weight: 560 !important;
  text-shadow: none !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-post-body {
  gap: 18px !important;
  padding: 18px 16px 16px !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-post-section {
  gap: 9px !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-post-section h4 {
  color: #6b5de6 !important;
  font-size: 13px !important;
  font-weight: 560 !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-post-section h4 span {
  width: 7px !important;
  height: 7px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #b8afff !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-post-section p,
body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-post-main-title {
  color: #475569 !important;
  font-weight: 500 !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-section-head button,
body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-post-footer button {
  border-color: #ddd8ff !important;
  color: #5b50d6 !important;
  background: #f5f3ff !important;
}

body.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-tag-list span {
  color: #5b50d6 !important;
  background: #f3f0ff !important;
}

body.workstation-feature-mode[data-active-feature="hd-upscale"] .library-select-button,
body.workstation-feature-mode[data-active-feature="outpaint"] .library-select-button {
  min-width: 0 !important;
  padding-inline: 8px !important;
}

body.workstation-feature-mode .library-select-button,
body.workstation-feature-mode .upload-example-button,
body.workstation-feature-mode .clear-upload-button {
  white-space: nowrap !important;
}

body.workstation-feature-mode .preview-frame,
body.workstation-feature-mode .preview-empty {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.workstation-feature-mode .preview-empty-visual {
  width: min(78%, 860px) !important;
  height: 78% !important;
  max-width: 860px !important;
  max-height: 78% !important;
}

body.workstation-feature-mode #preview-frame .preview-empty-visual img,
body.workstation-feature-mode .preview-frame img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
}

body.workstation-feature-mode .preview-gallery {
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  overflow: auto !important;
}

[data-feature="pattern-transfer"][hidden] {
  display: none !important;
}

.free-generate-page {
  display: none;
}

body.feature-focus-mode[data-active-feature="free-generate"] .topbar,
body.feature-focus-mode[data-active-feature="free-generate"] .workspace,
body.feature-focus-mode[data-active-feature="free-generate"] .task-panel,
body.feature-focus-mode[data-active-feature="free-generate"] .works-panel {
  display: none !important;
}

body.feature-focus-mode[data-active-feature="free-generate"] .main-area {
  grid-template-rows: minmax(0, 1fr) !important;
  background: #f6f7fb !important;
}

body.feature-focus-mode[data-active-feature="free-generate"] .content-grid {
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #f6f7fb !important;
}

body.feature-focus-mode[data-active-feature="free-generate"] .free-generate-page {
  display: block;
  height: 100%;
  min-width: 980px;
  min-height: 0;
}

.free-page-shell {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 16px;
  height: 100%;
  padding: 22px;
  box-sizing: border-box;
}

.free-page-stage,
.free-page-composer {
  border: 1px solid #e8eaf1;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 44px rgba(35, 43, 67, 0.06);
}

.free-page-stage {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-height: 0;
  overflow: hidden;
}

.free-page-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 20px 22px 14px;
  border-bottom: 1px solid #edf0f5;
}

.free-page-head span {
  color: #8b93a5;
  font-size: 12px;
  font-weight: 525;
  letter-spacing: 0.08em;
}

.free-page-head h1 {
  margin: 4px 0 0;
  color: #252b3a;
  font-size: 26px;
  line-height: 1.15;
}

.free-page-upload-button,
.free-page-clear-button,
.free-page-generate-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  border-radius: 12px;
  font-weight: 525;
  white-space: nowrap;
}

.free-page-upload-button {
  min-height: 44px;
  padding: 0 18px;
  color: #fff;
  background: #252b3a;
}

.free-page-upload-zone {
  min-height: 0;
  padding: 18px 22px 22px;
  overflow: auto;
  background: #fbfcfe;
  transition: background 0.18s ease, box-shadow 0.18s ease;
}

.free-page-upload-zone.is-dragover {
  background: #f0f7ff;
  box-shadow: inset 0 0 0 2px rgba(67, 136, 255, 0.2);
}

.free-page-upload-preview {
  min-height: 100%;
}

.free-page-empty-state {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  width: 100%;
  min-height: 100%;
  border: 1px dashed #cfd5e2;
  border-radius: 16px;
  color: #596174;
  background: #fff;
  text-align: center;
}

.free-page-empty-state span {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 16px;
  color: #2f756b;
  background: #eef8f5;
}

.free-page-empty-state .lucide {
  width: 28px;
  height: 28px;
}

.free-page-empty-state strong {
  color: #242b3d;
  font-size: 19px;
}

.free-page-empty-state small {
  color: #8b93a5;
  font-size: 14px;
  font-weight: 525;
}

.free-page-reference-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 14px;
}

.free-page-reference-card {
  position: relative;
  display: grid;
  gap: 9px;
  margin: 0;
  padding: 10px;
  border: 1px solid #eceef5;
  border-radius: 14px;
  background: #fff;
}

.free-page-reference-card img {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 10px;
  object-fit: cover;
  background: #f1f3f7;
}

.free-page-reference-card button {
  position: absolute;
  top: 16px;
  right: 16px;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 999px;
  color: #fff;
  background: rgba(23, 29, 43, 0.68);
}

.free-page-reference-card figcaption {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.free-page-reference-card strong,
.free-page-reference-card small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.free-page-reference-card strong {
  color: #293044;
  font-size: 13px;
}

.free-page-reference-card small {
  color: #8f97a8;
  font-size: 12px;
  font-weight: 525;
}

.free-page-composer {
  display: grid;
  grid-template-columns: minmax(360px, 1fr) minmax(420px, 520px);
  gap: 18px;
  padding: 16px;
}

.free-page-prompt {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.free-page-prompt span,
.free-page-setting-row > span {
  color: #596174;
  font-size: 14px;
  font-weight: 525;
}

.free-page-prompt textarea {
  width: 100%;
  min-height: 156px;
  height: 100%;
  resize: none;
  box-sizing: border-box;
  border: 1px solid #e3e6ee;
  border-radius: 14px;
  padding: 14px 15px;
  color: #273044;
  background: #fbfcfe;
  font-size: 15px;
  line-height: 1.55;
  outline: none;
}

.free-page-prompt textarea:focus {
  border-color: rgba(47, 117, 107, 0.55);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(47, 117, 107, 0.08);
}

.free-page-settings {
  display: grid;
  gap: 11px;
  min-width: 0;
}

.free-page-setting-row {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
}

.free-page-segment {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(62px, 1fr));
  gap: 6px;
  min-width: 0;
}

.free-page-ratio-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.free-page-segment button {
  min-height: 36px;
  padding: 0 10px;
  border: 1px solid #e2e6ef;
  border-radius: 10px;
  color: #596174;
  background: #fff;
  font-size: 13px;
  font-weight: 525;
}

.free-page-segment button.selected {
  border-color: rgba(47, 117, 107, 0.52);
  color: #185f56;
  background: #edf8f5;
  box-shadow: inset 0 0 0 1px rgba(47, 117, 107, 0.08);
}

.free-page-actions {
  display: grid;
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
  margin-top: 2px;
}

.free-page-clear-button {
  min-height: 50px;
  border: 1px solid #e7e9f1;
  color: #687084;
  background: #fff;
}

.free-page-clear-button[hidden] {
  display: none;
}

.free-page-generate-button {
  min-height: 50px;
  padding: 0 16px;
  color: #fff;
  background: #242b3d;
}

.free-page-generate-button small {
  color: rgba(255, 255, 255, 0.74);
  font-size: 12px;
  font-weight: 525;
}

.free-page-generate-button:disabled,
.free-page-clear-button:disabled {
  opacity: 0.58;
}

@media (max-width: 1279px) and (min-width: 981px) {
  body.feature-focus-mode .content-grid {
    padding-right: 16px !important;
    padding-left: 16px !important;
  }

  body.workstation-feature-mode .workspace,
  body.workstation-feature-mode .task-panel {
    min-width: 1040px !important;
  }

  body.workstation-feature-mode .task-panel {
    grid-template-columns: 500px minmax(516px, 1fr) !important;
    gap: 0 18px !important;
  }
}

@media (max-width: 980px) {
  html,
  body,
  body.feature-focus-mode {
    min-width: 0 !important;
    height: auto !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  .app-layout {
    grid-template-columns: 1fr !important;
  }

  .sidebar {
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
  }

  body.feature-focus-mode .main-area,
  body.feature-focus-mode .content-grid,
  body.workstation-feature-mode .workspace,
  body.workstation-feature-mode .task-panel {
    height: auto !important;
    min-width: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.feature-focus-mode .content-grid {
    padding: 0 14px 24px !important;
  }

  body.workstation-feature-mode .task-panel {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
    gap: 14px !important;
    padding-top: 12px !important;
  }

  body.workstation-feature-mode .task-body {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto !important;
    gap: 14px !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding-right: 0 !important;
  }

  body.workstation-feature-mode .task-heading,
  body.workstation-feature-mode .upload-column,
  body.workstation-feature-mode .settings-column,
  body.workstation-feature-mode .preview-column,
  body.workstation-feature-mode .task-recent-panel {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  body.workstation-feature-mode .upload-column,
  body.workstation-feature-mode .settings-column,
  body.workstation-feature-mode .preview-column {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  body.workstation-feature-mode .preview-card {
    width: 100% !important;
    height: clamp(420px, 68vh, 720px) !important;
    min-height: 420px !important;
  }

  body.workstation-feature-mode .task-recent-panel {
    height: auto !important;
    min-height: 126px !important;
    max-height: none !important;
  }

  body.workstation-feature-mode .upload-primary-row {
    grid-template-columns: minmax(0, 1fr) 132px !important;
  }

  body.workstation-feature-mode .library-select-row {
    grid-template-columns: repeat(2, minmax(132px, 1fr)) !important;
  }

  body.workstation-feature-mode .upload-column {
    overflow-x: hidden !important;
  }
}

/* Unified workbench layout for every image-generation feature. */
@media (min-width: 981px) {
  body.workstation-feature-mode {
    height: 100vh !important;
    min-height: 100vh !important;
    overflow: hidden !important;
  }

  body.workstation-feature-mode .app-layout,
  body.workstation-feature-mode .main-area {
    height: 100vh !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.workstation-feature-mode .main-area {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
  }

  body.workstation-feature-mode .content-grid {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 16px 24px 30px !important;
  }

  body.workstation-feature-mode .workspace,
  body.workstation-feature-mode .task-panel {
    width: 100% !important;
    min-width: 1044px !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.workstation-feature-mode .task-panel {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(460px, 520px) minmax(560px, 1fr) !important;
    grid-template-rows: auto auto minmax(0, 1fr) 126px !important;
    gap: 0 28px !important;
    align-items: stretch !important;
    margin: 0 !important;
    padding: 14px 0 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.workstation-feature-mode .task-panel::before {
    content: none !important;
  }

  body.workstation-feature-mode .task-body:not([hidden]) {
    display: contents !important;
  }

  body.workstation-feature-mode .task-heading,
  body.workstation-feature-mode .upload-column,
  body.workstation-feature-mode .settings-column {
    position: relative !important;
    z-index: 1 !important;
    grid-column: 1 / 2 !important;
    width: auto !important;
    min-width: 0 !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: none !important;
  }

  body.workstation-feature-mode .task-heading {
    grid-row: 1 !important;
    padding: 20px 22px 10px !important;
    border: 1px solid #efeff8 !important;
    border-bottom: 0 !important;
    border-radius: 22px 22px 0 0 !important;
  }

  body.workstation-feature-mode .upload-column {
    grid-row: 2 !important;
    padding: 0 22px 16px !important;
    border-right: 1px solid #efeff8 !important;
    border-left: 1px solid #efeff8 !important;
    border-radius: 0 !important;
  }

  body.workstation-feature-mode .settings-column {
    display: grid !important;
    grid-row: 3 / 5 !important;
    grid-template-rows: minmax(0, 1fr) auto !important;
    align-content: stretch !important;
    gap: 12px !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin-top: 0 !important;
    padding: 0 22px 34px !important;
    border: 1px solid #efeff8 !important;
    border-top: 0 !important;
    border-radius: 0 0 22px 22px !important;
    overflow: hidden !important;
  }

  body.workstation-feature-mode .settings-scroll-area {
    display: grid !important;
    align-content: start !important;
    align-items: start !important;
    grid-auto-rows: max-content !important;
    gap: 12px !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    padding-right: 4px !important;
  }

  body.workstation-feature-mode[data-active-feature="detail-page"] .settings-bottom-area {
    align-self: end !important;
    display: grid !important;
    gap: 10px !important;
    min-height: 0 !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    border-top: 1px solid rgba(232, 230, 242, 0.9) !important;
    background: transparent !important;
  }

  body.workstation-feature-mode .preview-column {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 4 !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.workstation-feature-mode .preview-card {
    width: 100% !important;
    height: calc(100% - 22px) !important;
    min-height: 0 !important;
    max-height: none !important;
    top: auto !important;
    border: 0 !important;
    border-radius: 18px !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }

  body.workstation-feature-mode .task-recent-panel {
    display: grid !important;
    grid-column: 2 / 3 !important;
    grid-row: 4 !important;
    height: 126px !important;
    min-height: 126px !important;
    max-height: 126px !important;
    margin-top: 14px !important;
    overflow: hidden !important;
    border: 1px solid #efeff8 !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: var(--shadow) !important;
  }
}

@media (min-width: 981px) and (max-width: 1279px) {
  body.workstation-feature-mode .content-grid {
    padding-right: 16px !important;
    padding-left: 16px !important;
  }

  body.workstation-feature-mode .workspace,
  body.workstation-feature-mode .task-panel {
    min-width: 1040px !important;
  }

  body.workstation-feature-mode .task-panel {
    grid-template-columns: 500px minmax(516px, 1fr) !important;
    gap: 0 18px !important;
  }
}

@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode .task-panel {
    grid-template-columns: minmax(450px, 520px) minmax(0, 1fr) !important;
    grid-template-rows: auto auto minmax(0, 1fr) 126px !important;
    gap: 14px 28px !important;
    padding: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-panel::before {
    content: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-heading {
    grid-column: 1 / 2 !important;
    grid-row: 1 !important;
    padding: 18px 22px 10px !important;
    border: 1px solid #efeff8 !important;
    border-bottom: 0 !important;
    border-radius: 22px 22px 0 0 !important;
    background: rgba(255, 255, 255, 0.96) !important;
  }

body.feature-focus-mode.workstation-feature-mode .upload-column {
    grid-column: 1 / 2 !important;
    grid-row: 2 !important;
    padding: 4px 22px 16px !important;
    border-right: 1px solid #efeff8 !important;
    border-left: 1px solid #efeff8 !important;
    background: rgba(255, 255, 255, 0.96) !important;
  }

  body.feature-focus-mode.workstation-feature-mode .upload-primary-row,
  body.feature-focus-mode.workstation-feature-mode .library-select-row,
  body.feature-focus-mode.workstation-feature-mode .extra-prompt-box {
    width: 100% !important;
    justify-self: stretch !important;
    box-sizing: border-box !important;
  }

  body.feature-focus-mode.workstation-feature-mode .upload-primary-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
    align-items: stretch !important;
    min-width: 100% !important;
  }

  body.feature-focus-mode.workstation-feature-mode .upload-card-wrap,
  body.feature-focus-mode.workstation-feature-mode #product-upload,
  body.feature-focus-mode.workstation-feature-mode #upload-example-button,
  body.feature-focus-mode.workstation-feature-mode .library-select-row,
  body.feature-focus-mode.workstation-feature-mode .extra-prompt-box {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }

  body.feature-focus-mode.workstation-feature-mode #upload-example-button {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 122px !important;
    white-space: normal !important;
    text-align: center !important;
    line-height: 1.2 !important;
  }

  body.feature-focus-mode.workstation-feature-mode #clear-upload {
    display: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .settings-column {
    grid-column: 1 / 2 !important;
    grid-row: 3 / 5 !important;
    padding: 4px 22px 22px !important;
    border: 1px solid #efeff8 !important;
    border-top: 0 !important;
    border-radius: 0 0 22px 22px !important;
    background: rgba(255, 255, 255, 0.96) !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-column {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 4 !important;
    align-self: stretch !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-card {
    top: auto !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-recent-panel {
    grid-column: 2 / 3 !important;
    grid-row: 4 !important;
    height: 126px !important;
    min-height: 126px !important;
    max-height: 126px !important;
    margin-top: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .task-body {
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-card {
    top: auto !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
  }
}

@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode .content-grid {
    height: calc(100vh - 64px) !important;
    min-height: 0 !important;
    max-height: calc(100vh - 64px) !important;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
    padding: 16px 24px 30px !important;
  }

  body.feature-focus-mode.workstation-feature-mode .workspace,
  body.feature-focus-mode.workstation-feature-mode .task-panel {
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-panel {
    display: grid !important;
    grid-template-columns: minmax(400px, 500px) minmax(0, 1fr) !important;
    grid-template-rows: auto auto minmax(0, 1fr) 126px !important;
    gap: 14px 28px !important;
    align-items: stretch !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-column {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-card,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-card {
    top: auto !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-recent-panel {
    height: 126px !important;
    min-height: 126px !important;
    max-height: 126px !important;
    overflow: hidden !important;
  }
}

/* Absolute final workstation visual fix. Keep this block last. */
@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode .content-grid {
    padding-top: 32px !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-panel {
    row-gap: 0 !important;
    column-gap: 28px !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-panel::before {
    content: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-heading,
  body.feature-focus-mode.workstation-feature-mode .upload-column,
  body.feature-focus-mode.workstation-feature-mode .settings-column {
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-heading {
    border: 1px solid #efeff8 !important;
    border-bottom: 0 !important;
    border-radius: 22px 22px 0 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode .upload-column {
    border-right: 1px solid #efeff8 !important;
    border-left: 1px solid #efeff8 !important;
    border-radius: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode .settings-column {
    border: 1px solid #efeff8 !important;
    border-top: 0 !important;
    border-radius: 0 0 22px 22px !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-card,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-card {
    border: 0 !important;
    background: #f4f3fa !important;
    box-shadow: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode #upload-example-button,
  body.feature-focus-mode.workstation-feature-mode #upload-example-button:hover,
  body.feature-focus-mode.workstation-feature-mode #upload-example-button:focus-visible,
  body.feature-focus-mode.workstation-feature-mode #upload-example-button .lucide {
    box-shadow: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-frame,
  body.feature-focus-mode.workstation-feature-mode .preview-empty,
  body.feature-focus-mode.workstation-feature-mode .preview-empty-visual,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-frame,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-empty,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-empty-visual {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .upload-column > .library-select-row {
    display: none !important;
  }
}

body[data-active-feature="wrinkle"] .upload-column > .library-select-row,
body[data-active-feature="wrinkle"] #upload-example-button {
  display: none !important;
}

/* Final visual polish: no frame gaps and no nested preview background. */
@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode .content-grid {
    padding-top: 32px !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-panel {
    row-gap: 0 !important;
    column-gap: 28px !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-panel::before {
    content: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-heading,
  body.feature-focus-mode.workstation-feature-mode .upload-column,
  body.feature-focus-mode.workstation-feature-mode .settings-column {
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-heading {
    border: 1px solid #efeff8 !important;
    border-bottom: 0 !important;
    border-radius: 22px 22px 0 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode .upload-column {
    border-right: 1px solid #efeff8 !important;
    border-left: 1px solid #efeff8 !important;
    border-radius: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode .settings-column {
    border: 1px solid #efeff8 !important;
    border-top: 0 !important;
    border-radius: 0 0 22px 22px !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-card,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-card {
    border: 0 !important;
    background: #f4f3fa !important;
    box-shadow: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-frame,
  body.feature-focus-mode.workstation-feature-mode .preview-empty,
  body.feature-focus-mode.workstation-feature-mode .preview-empty-visual,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-frame,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-empty,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-empty-visual {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .task-panel {
    grid-template-columns: minmax(380px, 460px) minmax(560px, 1fr) !important;
    grid-template-rows: auto auto minmax(0, 1fr) 126px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .copy-result-panel {
    grid-auto-columns: clamp(288px, 20vw, 352px) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .upload-column {
    display: grid !important;
    grid-column: 1 / 2 !important;
    grid-row: 2 !important;
    padding: 4px 22px 14px !important;
    border-right: 0 !important;
    border-left: 0 !important;
    background: transparent !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .settings-column {
    grid-column: 1 / 2 !important;
    grid-row: 3 / 5 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .preview-column {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 4 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .task-recent-panel {
    grid-column: 2 / 3 !important;
    grid-row: 4 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .upload-primary-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] #upload-example-button,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .library-select-row {
    display: none !important;
  }
}

@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .preview-frame img {
    width: auto !important;
    height: auto !important;
    max-width: var(--outpaint-image-max, 92%) !important;
    max-height: var(--outpaint-image-max, 92%) !important;
    object-fit: contain !important;
  }
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .preview-frame {
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .detail-page-latest-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .preview-gallery,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .preview-compare,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .copy-result-panel {
  display: none !important;
}

/* Polish workstation frame: one clean left border and one clean preview background. */
@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode .content-grid {
    padding-top: 28px !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-panel {
    position: relative !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-panel::before {
    content: "" !important;
    grid-column: 1 / 2 !important;
    grid-row: 1 / 5 !important;
    align-self: stretch !important;
    border: 1px solid #efeff8 !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-heading,
  body.feature-focus-mode.workstation-feature-mode .upload-column,
  body.feature-focus-mode.workstation-feature-mode .settings-column {
    position: relative !important;
    z-index: 1 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-card,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-card {
    border: 0 !important;
    background: #f4f3fa !important;
    box-shadow: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-frame,
  body.feature-focus-mode.workstation-feature-mode .preview-empty,
  body.feature-focus-mode.workstation-feature-mode .preview-empty-visual,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-frame,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-empty,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-empty-visual {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

@media (min-width: 981px) and (max-width: 1180px) {
  body.feature-focus-mode.workstation-feature-mode .content-grid {
    overflow-x: auto !important;
  }

  body.feature-focus-mode.workstation-feature-mode .workspace,
  body.feature-focus-mode.workstation-feature-mode .task-panel {
    min-width: 1040px !important;
  }
}

/* Final override: every workstation feature uses the same layout as wrinkle. */
@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode .content-grid {
    height: calc(100vh - 64px) !important;
    min-height: 0 !important;
    max-height: calc(100vh - 64px) !important;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
    padding: 16px 24px 30px !important;
  }

  body.feature-focus-mode.workstation-feature-mode .workspace,
  body.feature-focus-mode.workstation-feature-mode .task-panel {
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-panel {
    display: grid !important;
    grid-template-columns: minmax(400px, 500px) minmax(0, 1fr) !important;
    grid-template-rows: auto auto minmax(0, 1fr) 126px !important;
    gap: 14px 28px !important;
    align-items: stretch !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-body:not([hidden]) {
    display: contents !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-column {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 4 !important;
    align-self: stretch !important;
    box-sizing: border-box !important;
    padding-left: 14px !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-card,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-card {
    top: auto !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-frame,
  body.feature-focus-mode.workstation-feature-mode .preview-empty,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-frame,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-empty {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-empty-visual,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-empty-visual {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    width: min(78%, 860px) !important;
    height: 78% !important;
    max-width: 860px !important;
    max-height: 78% !important;
    aspect-ratio: auto !important;
    margin: 0 auto !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode #preview-frame .preview-empty-visual img,
  body.feature-focus-mode.workstation-feature-mode .preview-frame img,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] #preview-frame .preview-empty-visual img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-recent-panel {
    grid-column: 2 / 3 !important;
    grid-row: 4 !important;
    height: 126px !important;
    min-height: 126px !important;
    max-height: 126px !important;
    margin-top: 0 !important;
    overflow: hidden !important;
  }
}

/* True final workstation visual fix. Do not place workstation rules after this block. */
@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode .content-grid {
    padding-top: 32px !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-panel {
    row-gap: 0 !important;
    column-gap: 28px !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-panel::before {
    content: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-heading,
  body.feature-focus-mode.workstation-feature-mode .upload-column,
  body.feature-focus-mode.workstation-feature-mode .settings-column {
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-heading {
    border: 1px solid #efeff8 !important;
    border-bottom: 0 !important;
    border-radius: 22px 22px 0 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode .upload-column {
    border-right: 1px solid #efeff8 !important;
    border-left: 1px solid #efeff8 !important;
    border-radius: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode .settings-column {
    border: 1px solid #efeff8 !important;
    border-top: 0 !important;
    border-radius: 0 0 22px 22px !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-card,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-card {
    border: 0 !important;
    background: #f4f3fa !important;
    box-shadow: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode .preview-frame,
  body.feature-focus-mode.workstation-feature-mode .preview-empty,
  body.feature-focus-mode.workstation-feature-mode .preview-empty-visual,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-frame,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-empty,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .preview-empty-visual {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}



#preview-empty-use-example {
  display: none !important;
}

/* Final free-generate standalone override. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .topbar,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .workspace,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .task-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .works-panel {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .content-grid {
  height: 100% !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #f6f7fb !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-generate-page {
  display: block !important;
}

@media (max-width: 980px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .content-grid {
    min-height: auto !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-generate-page {
    min-width: 0 !important;
    height: auto !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-shell {
    height: auto !important;
    min-height: calc(100vh - 20px) !important;
    padding: 12px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-composer {
    grid-template-columns: 1fr !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-setting-row {
    grid-template-columns: 1fr !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-ratio-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-actions {
    grid-template-columns: 1fr !important;
  }
}




body[data-active-feature="wrinkle"] #upload-example-button,
body[data-active-feature="wrinkle"] .upload-column > .library-select-row {
  display: none !important;
}


body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #upload-example-button {
  display: none !important;
}


body[data-active-feature="wrinkle"] .upload-primary-row {
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
}

body[data-active-feature="wrinkle"] .upload-card-wrap,
body[data-active-feature="wrinkle"] #product-upload {
  width: 100% !important;
  max-width: none !important;
}

body[data-active-feature="wrinkle"] #product-upload {
  min-height: 190px !important;
  padding: 26px 18px !important;
}

body[data-active-feature="wrinkle"] #product-upload .upload-icon {
  width: 54px !important;
  height: 54px !important;
}


@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .upload-primary-row {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    min-width: 100% !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .upload-card-wrap,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload {
    width: 100% !important;
    max-width: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload {
    min-height: 190px !important;
  }
}


body[data-active-feature="wrinkle"] #product-upload {
  gap: 12px !important;
}

body[data-active-feature="wrinkle"] #product-upload .upload-icon {
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  border-radius: 0 !important;
  color: var(--purple) !important;
  background: transparent !important;
  box-shadow: none !important;
}

body[data-active-feature="wrinkle"] #product-upload .upload-icon .lucide {
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  stroke-width: 1.9 !important;
}

body[data-active-feature="wrinkle"] #product-upload strong {
  margin: 0 !important;
  font-size: 22px !important;
  line-height: 1.15 !important;
  font-weight: 525 !important;
}

body[data-active-feature="wrinkle"] #product-upload small {
  font-size: 14px !important;
  line-height: 1.45 !important;
  font-weight: 525 !important;
}


body[data-active-feature="wrinkle"] #product-upload {
  gap: 14px !important;
  min-height: 210px !important;
  padding: 30px 22px !important;
  border: 1.5px dashed rgba(123, 97, 255, 0.42) !important;
  border-radius: 24px !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfaff 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.7), 0 10px 30px rgba(86, 70, 180, 0.05) !important;
}

body[data-active-feature="wrinkle"] #product-upload:hover,
body[data-active-feature="wrinkle"] #product-upload:focus-visible {
  border-color: rgba(123, 97, 255, 0.72) !important;
  background: linear-gradient(180deg, #ffffff 0%, #f7f3ff 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.82), 0 14px 34px rgba(86, 70, 180, 0.1) !important;
}

body[data-active-feature="wrinkle"] #product-upload .upload-icon {
  color: #7b61ff !important;
  background: transparent !important;
}

body[data-active-feature="wrinkle"] #product-upload .upload-icon .lucide {
  width: 42px !important;
  height: 42px !important;
  stroke-width: 1.75 !important;
}

body[data-active-feature="wrinkle"] #product-upload .upload-copy {
  display: grid !important;
  gap: 7px !important;
  justify-items: center !important;
}

body[data-active-feature="wrinkle"] #product-upload strong {
  color: #1f2433 !important;
  font-size: 24px !important;
  letter-spacing: 0 !important;
}

body[data-active-feature="wrinkle"] #product-upload small {
  max-width: 320px !important;
  color: #747b90 !important;
  font-size: 14px !important;
  font-weight: 525 !important;
}

body[data-active-feature="wrinkle"] #product-upload {
  gap: 11px !important;
  min-height: 168px !important;
  padding: 22px 20px !important;
}

body[data-active-feature="wrinkle"] #product-upload .upload-icon .lucide {
  width: 36px !important;
  height: 36px !important;
  stroke-width: 1.8 !important;
}

body[data-active-feature="wrinkle"] #product-upload .upload-copy {
  gap: 5px !important;
}

body[data-active-feature="wrinkle"] #product-upload strong {
  font-size: 20px !important;
  line-height: 1.2 !important;
}

body[data-active-feature="wrinkle"] #product-upload small {
  max-width: 300px !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  font-weight: 525 !important;
}

/* Final wrinkle upload card sizing: keep the wide card, but make it visibly lower. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload,
body[data-active-feature="wrinkle"] #product-upload {
  min-height: 138px !important;
  padding: 18px 20px !important;
  gap: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload .upload-icon .lucide,
body[data-active-feature="wrinkle"] #product-upload .upload-icon .lucide {
  width: 32px !important;
  height: 32px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload .upload-copy,
body[data-active-feature="wrinkle"] #product-upload .upload-copy {
  gap: 4px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload strong,
body[data-active-feature="wrinkle"] #product-upload strong {
  font-size: 18px !important;
  line-height: 1.18 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload small,
body[data-active-feature="wrinkle"] #product-upload small {
  max-width: 280px !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

/* Unified upload flow: keep examples and library choices inside the upload dialog. */
body .upload-column > .library-select-row,
body #upload-example-button {
  display: none !important;
}

/* Unified upload flow: the primary upload button owns the whole row. */
body .upload-primary-row {
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
}

body .upload-card-wrap,
body #product-upload {
  width: 100% !important;
  max-width: none !important;
}

/* Final unified upload width override for desktop workstation layouts. */
body.feature-focus-mode.workstation-feature-mode .upload-primary-row,
body.workstation-feature-mode .upload-primary-row,
body[data-active-feature] .upload-primary-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
}

body.feature-focus-mode.workstation-feature-mode .upload-card-wrap,
body.feature-focus-mode.workstation-feature-mode #product-upload,
body.workstation-feature-mode .upload-card-wrap,
body.workstation-feature-mode #product-upload,
body[data-active-feature] .upload-card-wrap,
body[data-active-feature] #product-upload {
  width: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
}

/* Make wrinkle use the same primary upload card style as the other features. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload,
body[data-active-feature="wrinkle"] #product-upload {
  min-height: 122px !important;
  padding: 14px 13px !important;
  gap: 10px !important;
  border: 1px dashed #d7d0ff !important;
  border-radius: 18px !important;
  color: var(--ink) !important;
  background: linear-gradient(180deg, #fff, #fbfaff) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload:focus-visible,
body[data-active-feature="wrinkle"] #product-upload:hover,
body[data-active-feature="wrinkle"] #product-upload:focus-visible {
  border-color: #d7d0ff !important;
  background: linear-gradient(180deg, #fff, #fbfaff) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload .upload-icon,
body[data-active-feature="wrinkle"] #product-upload .upload-icon {
  width: 42px !important;
  height: 42px !important;
  padding: 0 !important;
  border-radius: 12px !important;
  color: var(--purple) !important;
  background: var(--purple-soft) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload .upload-icon .lucide,
body[data-active-feature="wrinkle"] #product-upload .upload-icon .lucide {
  width: 25px !important;
  height: 25px !important;
  padding: 0 !important;
  stroke-width: 2.25 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload .upload-copy,
body[data-active-feature="wrinkle"] #product-upload .upload-copy {
  gap: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload strong,
body[data-active-feature="wrinkle"] #product-upload strong {
  margin-bottom: 3px !important;
  color: var(--ink) !important;
  font-size: 15px !important;
  line-height: normal !important;
  font-weight: 525 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload small,
body[data-active-feature="wrinkle"] #product-upload small {
  max-width: none !important;
  color: var(--muted) !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
  font-weight: 400 !important;
}

/* Unified bottom controls for all generation workstations except Xiaohongshu copywriting. */
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .settings-bottom-area {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .generate-count-box,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .generate-action-row {
  display: contents !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .inline-model-section,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .generate-count-section,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .generation-resolution-section {
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .inline-model-section {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .generate-count-section {
  grid-column: 2 !important;
  grid-row: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .generation-resolution-section {
  position: relative !important;
  grid-column: 3 !important;
  grid-row: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .generate-count-label,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .generate-count-options,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .generation-resolution-options {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-select {
  position: relative !important;
  display: block !important;
  min-width: 0 !important;
  border: 1px solid rgba(123, 97, 255, 0.16) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #ffffff 0%, #faf9ff 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.85), 0 8px 18px rgba(66, 57, 132, 0.06) !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .inline-model-section summary,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-select summary {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) auto !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  align-content: center !important;
  justify-items: start !important;
  gap: 2px 9px !important;
  min-height: 58px !important;
  padding: 8px 11px !important;
  border-radius: 16px !important;
  color: #30384d !important;
  text-align: left !important;
  font-family: inherit !important;
  cursor: pointer !important;
  list-style: none !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .inline-model-section summary::-webkit-details-marker,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-select summary::-webkit-details-marker {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .inline-model-section summary .lucide,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-select summary .lucide {
  grid-column: 1 !important;
  grid-row: 1 / 3 !important;
  align-self: center !important;
  width: 26px !important;
  height: 26px !important;
  padding: 5px !important;
  border-radius: 10px !important;
  color: #7162e8 !important;
  background: rgba(123, 97, 255, 0.1) !important;
  stroke-width: 2.35 !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .inline-model-section summary span,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-select summary span {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: end !important;
  color: #30384d !important;
  font-size: 13px !important;
  font-weight: 525 !important;
  line-height: 1.15 !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .inline-model-section summary strong,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-select summary strong {
  grid-column: 2 !important;
  grid-row: 2 !important;
  overflow: hidden !important;
  align-self: start !important;
  max-width: 100% !important;
  color: #7162e8 !important;
  font-size: 12px !important;
  font-weight: 525 !important;
  line-height: 1.15 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .inline-model-section summary::after,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-select summary::after {
  grid-column: 3 !important;
  grid-row: 1 / 3 !important;
  content: "" !important;
  width: 7px !important;
  height: 7px !important;
  border-right: 2px solid rgba(113, 98, 232, 0.52) !important;
  border-bottom: 2px solid rgba(113, 98, 232, 0.52) !important;
  transform: rotate(45deg) translateY(-2px) !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .inline-model-section summary small,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-select summary small {
  position: absolute !important;
  left: 50% !important;
  bottom: calc(100% + 8px) !important;
  z-index: 30 !important;
  width: max-content !important;
  max-width: 240px !important;
  padding: 7px 9px !important;
  border: 1px solid rgba(36, 42, 62, 0.08) !important;
  border-radius: 10px !important;
  color: #fff !important;
  background: rgba(36, 42, 62, 0.92) !important;
  box-shadow: 0 14px 28px rgba(36, 42, 62, 0.16) !important;
  font-size: 11.5px !important;
  font-weight: 525 !important;
  line-height: 1.3 !important;
  white-space: normal !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate(-50%, 4px) !important;
  transition: opacity 0.14s ease, transform 0.14s ease !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .inline-model-section summary:hover small,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .inline-model-section summary:focus-visible small,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-select summary:hover small,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-select summary:focus-visible small {
  opacity: 1 !important;
  transform: translate(-50%, 0) !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .inline-model-section:hover,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .inline-model-section[open],
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-select:hover,
body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-select[open] {
  border-color: rgba(123, 97, 255, 0.38) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.9), 0 12px 24px rgba(92, 76, 180, 0.1) !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-menu {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: calc(100% + 8px) !important;
  z-index: 21 !important;
  display: grid !important;
  gap: 8px !important;
  padding: 10px !important;
  border: 1px solid rgba(123, 97, 255, 0.16) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 18px 38px rgba(36, 39, 64, 0.16) !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-menu button {
  min-height: 38px !important;
  border: 1px solid #ebe9f7 !important;
  border-radius: 12px !important;
  color: #353b50 !important;
  background: #fbfbff !important;
  font-size: 13px !important;
  font-weight: 525 !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-menu button:hover {
  border-color: rgba(123, 97, 255, 0.36) !important;
  background: #f6f3ff !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-compact-menu button.selected {
  border-color: transparent !important;
  color: #fff !important;
  background: linear-gradient(135deg, #765cff, #8f72ff) !important;
  box-shadow: 0 10px 20px rgba(123, 97, 255, 0.2) !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-resolution-bubble {
  position: absolute !important;
  left: 50% !important;
  bottom: calc(100% + 10px) !important;
  z-index: 80 !important;
  width: max-content !important;
  max-width: 260px !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(123, 97, 255, 0.16) !important;
  border-radius: 12px !important;
  color: #403a5f !important;
  background: #fff !important;
  box-shadow: 0 16px 34px rgba(44, 38, 92, 0.16) !important;
  font-size: 12px !important;
  font-weight: 525 !important;
  line-height: 1.35 !important;
  transform: translateX(-50%) !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-resolution-bubble[hidden] {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .print-resolution-bubble::after {
  position: absolute !important;
  left: 50% !important;
  top: 100% !important;
  content: "" !important;
  width: 9px !important;
  height: 9px !important;
  border-right: 1px solid rgba(123, 97, 255, 0.16) !important;
  border-bottom: 1px solid rgba(123, 97, 255, 0.16) !important;
  background: #fff !important;
  transform: translate(-50%, -5px) rotate(45deg) !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .create-button.full {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  width: 100% !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .set-ratio-section:not([hidden]) {
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .generate-count-box.hide-generate-count-section .generation-resolution-section {
  grid-column: 2 / 4 !important;
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="xiaohongshu"]):not([data-active-feature="detail-page"]) .generate-count-box.hide-generate-count-section .generate-count-section {
  display: none !important;
}

/* Detail-page bottom controls. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-bottom-area {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-action-row {
  display: contents !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-section,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generation-resolution-section {
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-section {
  grid-column: 2 !important;
  grid-row: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generation-resolution-section {
  position: relative !important;
  grid-column: 3 !important;
  grid-row: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-label,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-options,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generation-resolution-options {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select {
  position: relative !important;
  display: block !important;
  min-width: 0 !important;
  border: 1px solid rgba(123, 97, 255, 0.16) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #ffffff 0%, #faf9ff 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.85), 0 8px 18px rgba(66, 57, 132, 0.06) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section summary,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select summary {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) auto !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  align-content: center !important;
  justify-items: start !important;
  gap: 2px 9px !important;
  min-height: 58px !important;
  padding: 8px 11px !important;
  border-radius: 16px !important;
  color: #30384d !important;
  text-align: left !important;
  font-family: inherit !important;
  cursor: pointer !important;
  list-style: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section summary::-webkit-details-marker,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select summary::-webkit-details-marker {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section summary .lucide,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select summary .lucide {
  grid-column: 1 !important;
  grid-row: 1 / 3 !important;
  align-self: center !important;
  width: 26px !important;
  height: 26px !important;
  padding: 5px !important;
  border-radius: 10px !important;
  color: #7162e8 !important;
  background: rgba(123, 97, 255, 0.1) !important;
  stroke-width: 2.35 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section summary span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select summary span {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: end !important;
  color: #30384d !important;
  font-size: 13px !important;
  font-weight: 525 !important;
  line-height: 1.15 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section summary strong,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select summary strong {
  grid-column: 2 !important;
  grid-row: 2 !important;
  overflow: hidden !important;
  align-self: start !important;
  max-width: 100% !important;
  color: #7162e8 !important;
  font-size: 12px !important;
  font-weight: 525 !important;
  line-height: 1.15 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section summary::after,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select summary::after {
  grid-column: 3 !important;
  grid-row: 1 / 3 !important;
  content: "" !important;
  width: 7px !important;
  height: 7px !important;
  border-right: 2px solid rgba(113, 98, 232, 0.52) !important;
  border-bottom: 2px solid rgba(113, 98, 232, 0.52) !important;
  transform: rotate(45deg) translateY(-2px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section summary small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select summary small {
  position: absolute !important;
  left: 50% !important;
  bottom: calc(100% + 8px) !important;
  z-index: 30 !important;
  width: max-content !important;
  max-width: 240px !important;
  padding: 7px 9px !important;
  border: 1px solid rgba(36, 42, 62, 0.08) !important;
  border-radius: 10px !important;
  color: #fff !important;
  background: rgba(36, 42, 62, 0.92) !important;
  box-shadow: 0 14px 28px rgba(36, 42, 62, 0.16) !important;
  font-size: 11.5px !important;
  font-weight: 525 !important;
  line-height: 1.3 !important;
  white-space: normal !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate(-50%, 4px) !important;
  transition: opacity 0.14s ease, transform 0.14s ease !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section summary:hover small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section summary:focus-visible small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select summary:hover small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select summary:focus-visible small {
  opacity: 1 !important;
  transform: translate(-50%, 0) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section[open],
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select[open] {
  border-color: rgba(123, 97, 255, 0.38) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.9), 0 12px 24px rgba(92, 76, 180, 0.1) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-menu {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: calc(100% + 8px) !important;
  z-index: 21 !important;
  display: grid !important;
  gap: 8px !important;
  padding: 10px !important;
  border: 1px solid rgba(123, 97, 255, 0.16) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 18px 38px rgba(36, 39, 64, 0.16) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-menu button {
  min-height: 38px !important;
  border: 1px solid #ebe9f7 !important;
  border-radius: 12px !important;
  color: #353b50 !important;
  background: #fbfbff !important;
  font-size: 13px !important;
  font-weight: 525 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-menu button:hover {
  border-color: rgba(123, 97, 255, 0.36) !important;
  background: #f6f3ff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-menu button.selected {
  border-color: transparent !important;
  color: #fff !important;
  background: linear-gradient(135deg, #765cff, #8f72ff) !important;
  box-shadow: 0 10px 20px rgba(123, 97, 255, 0.2) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-resolution-bubble {
  position: absolute !important;
  left: 50% !important;
  bottom: calc(100% + 10px) !important;
  z-index: 80 !important;
  width: max-content !important;
  max-width: 260px !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(123, 97, 255, 0.16) !important;
  border-radius: 12px !important;
  color: #403a5f !important;
  background: #fff !important;
  box-shadow: 0 16px 34px rgba(44, 38, 92, 0.16) !important;
  font-size: 12px !important;
  font-weight: 525 !important;
  line-height: 1.35 !important;
  transform: translateX(-50%) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-resolution-bubble[hidden] {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-resolution-bubble::after {
  position: absolute !important;
  left: 50% !important;
  top: 100% !important;
  content: "" !important;
  width: 9px !important;
  height: 9px !important;
  border-right: 1px solid rgba(123, 97, 255, 0.16) !important;
  border-bottom: 1px solid rgba(123, 97, 255, 0.16) !important;
  background: #fff !important;
  transform: translate(-50%, -5px) rotate(45deg) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .create-button.full {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  width: 100% !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .set-ratio-section:not([hidden]) {
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-box.hide-generate-count-section .generation-resolution-section {
  grid-column: 2 / 4 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-box.hide-generate-count-section .generate-count-section {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .settings-bottom-area {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-ratio-section:not([hidden]) {
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .inline-model-section {
  grid-column: 1 !important;
  grid-row: 2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .generate-count-section {
  grid-column: 2 !important;
  grid-row: 2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .generation-resolution-section {
  grid-column: 3 !important;
  grid-row: 2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .create-button.full {
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-ratio-select {
  position: relative !important;
  display: block !important;
  min-width: 0 !important;
  border: 1px solid rgba(123, 97, 255, 0.16) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #ffffff 0%, #faf9ff 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.85), 0 8px 18px rgba(66, 57, 132, 0.06) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-ratio-select summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  align-content: center !important;
  min-height: 58px !important;
  padding: 8px 11px !important;
  border-radius: 16px !important;
  gap: 2px 9px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-ratio-select summary span {
  grid-column: 1 !important;
  grid-row: 1 !important;
  color: #30384d !important;
  font-size: 13px !important;
  font-weight: 525 !important;
  line-height: 1.15 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-ratio-select summary strong {
  grid-column: 1 !important;
  grid-row: 2 !important;
  margin-left: 0 !important;
  overflow: hidden !important;
  max-width: 100% !important;
  color: #7162e8 !important;
  font-size: 12px !important;
  font-weight: 525 !important;
  line-height: 1.15 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-ratio-select summary::after {
  grid-column: 2 !important;
  grid-row: 1 / 3 !important;
  width: 7px !important;
  height: 7px !important;
  border-right: 2px solid rgba(113, 98, 232, 0.52) !important;
  border-bottom: 2px solid rgba(113, 98, 232, 0.52) !important;
  transform: rotate(45deg) translateY(-2px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-ratio-select[open] summary::after {
  transform: rotate(225deg) translate(-2px, -2px) !important;
}

/* Xiaohongshu follows the same bottom-row language, with count + generate only. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .settings-bottom-area {
  display: grid !important;
  grid-template-columns: minmax(116px, 0.85fr) minmax(0, 1.6fr) !important;
  align-items: stretch !important;
  gap: 12px !important;
  min-height: 0 !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .generate-count-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .generate-action-row {
  display: contents !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .generate-count-section {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .create-button.full {
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 100% !important;
  min-height: 58px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .generate-count-label,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .generate-count-options {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-count-select {
  position: relative !important;
  display: block !important;
  min-width: 0 !important;
  border: 1px solid rgba(123, 97, 255, 0.16) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #ffffff 0%, #faf9ff 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.85), 0 8px 18px rgba(66, 57, 132, 0.06) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-count-select summary {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) auto !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  align-content: center !important;
  justify-items: start !important;
  gap: 2px 9px !important;
  min-height: 58px !important;
  padding: 8px 11px !important;
  border-radius: 16px !important;
  color: #30384d !important;
  text-align: left !important;
  font-family: inherit !important;
  cursor: pointer !important;
  list-style: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-count-select summary::-webkit-details-marker {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-count-select summary .lucide {
  grid-column: 1 !important;
  grid-row: 1 / 3 !important;
  align-self: center !important;
  width: 26px !important;
  height: 26px !important;
  padding: 5px !important;
  border-radius: 10px !important;
  color: #7162e8 !important;
  background: rgba(123, 97, 255, 0.1) !important;
  stroke-width: 2.35 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-count-select summary span {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: end !important;
  color: #30384d !important;
  font-size: 13px !important;
  font-weight: 525 !important;
  line-height: 1.15 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-count-select summary strong {
  grid-column: 2 !important;
  grid-row: 2 !important;
  overflow: hidden !important;
  align-self: start !important;
  max-width: 100% !important;
  color: #7162e8 !important;
  font-size: 12px !important;
  font-weight: 525 !important;
  line-height: 1.15 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-count-select summary::after {
  grid-column: 3 !important;
  grid-row: 1 / 3 !important;
  content: "" !important;
  width: 7px !important;
  height: 7px !important;
  border-right: 2px solid rgba(113, 98, 232, 0.52) !important;
  border-bottom: 2px solid rgba(113, 98, 232, 0.52) !important;
  transform: rotate(45deg) translateY(-2px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-count-select summary small {
  position: absolute !important;
  left: 50% !important;
  bottom: calc(100% + 8px) !important;
  z-index: 30 !important;
  width: max-content !important;
  max-width: 240px !important;
  padding: 7px 9px !important;
  border: 1px solid rgba(36, 42, 62, 0.08) !important;
  border-radius: 10px !important;
  color: #fff !important;
  background: rgba(36, 42, 62, 0.92) !important;
  box-shadow: 0 14px 28px rgba(36, 42, 62, 0.16) !important;
  font-size: 11.5px !important;
  font-weight: 525 !important;
  line-height: 1.3 !important;
  white-space: normal !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate(-50%, 4px) !important;
  transition: opacity 0.14s ease, transform 0.14s ease !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-count-select summary:hover small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-count-select summary:focus-visible small {
  opacity: 1 !important;
  transform: translate(-50%, 0) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-count-select:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-count-select[open] {
  border-color: rgba(123, 97, 255, 0.38) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.9), 0 12px 24px rgba(92, 76, 180, 0.1) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-compact-menu {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: calc(100% + 8px) !important;
  z-index: 21 !important;
  display: grid !important;
  gap: 8px !important;
  padding: 10px !important;
  border: 1px solid rgba(123, 97, 255, 0.16) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 18px 38px rgba(36, 39, 64, 0.16) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-compact-menu button {
  min-height: 38px !important;
  border: 1px solid #ebe9f7 !important;
  border-radius: 12px !important;
  color: #353b50 !important;
  background: #fbfbff !important;
  font-size: 13px !important;
  font-weight: 525 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-compact-menu button:hover {
  border-color: rgba(123, 97, 255, 0.36) !important;
  background: #f6f3ff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .print-compact-menu button.selected {
  border-color: transparent !important;
  color: #fff !important;
  background: linear-gradient(135deg, #765cff, #8f72ff) !important;
  box-shadow: 0 10px 20px rgba(123, 97, 255, 0.2) !important;
}

@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="xiaohongshu"] .task-panel {
    grid-template-columns: minmax(400px, 500px) minmax(0, 1fr) !important;
  }
}

@media (max-width: 980px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-bottom-area {
    grid-template-columns: 1fr !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-box,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-action-row {
    display: grid !important;
  }
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-panel {
  grid-template-columns: minmax(320px, 520px) minmax(420px, 1fr) !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  align-content: stretch !important;
  justify-content: stretch !important;
  gap: 18px !important;
  min-width: 0 !important;
  overflow: visible !important;
  padding: 14px 0 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .workspace {
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-heading,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-scroll-area,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-recent-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .workflow-card,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .result-tags,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .feature-experience,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .library-select-row,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #upload-stack,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #clear-upload {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-heading {
  display: grid !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  min-height: 55px !important;
  padding-top: 18px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-column {
  grid-row: 2 !important;
  padding: 0 22px 22px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .preview-column {
  grid-row: 1 / span 2 !important;
}

/* Final detail-page frame cleanup: keep one outer frame plus the upload dropzone. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-heading {
  border-top: 1px solid #efeff8 !important;
  border-radius: 22px 22px 0 0 !important;
  background: rgba(255, 255, 255, 0.96) !important;
  background-color: rgba(255, 255, 255, 0.96) !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-body:not([hidden]) .upload-column,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-column {
  grid-row: 2 !important;
  padding: 4px 22px 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: rgba(255, 255, 255, 0.96) !important;
  background-color: rgba(255, 255, 255, 0.96) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Align detail-page title/upload positions with video generation. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-panel {
  grid-template-rows: 55px minmax(0, 1fr) !important;
  padding: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-heading {
  display: grid !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  height: 55px !important;
  min-height: 55px !important;
  padding: 18px 22px 10px !important;
  border-top: 1px solid #efeff8 !important;
  border-radius: 22px 22px 0 0 !important;
  background: rgba(255, 255, 255, 0.96) !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-column {
  grid-column: 1 !important;
  grid-row: 2 !important;
  padding: 4px 22px 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: rgba(255, 255, 255, 0.96) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Final detail-page frame cleanup: keep one outer frame plus the upload dropzone. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-heading {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-panel > .task-body:not([hidden]) + .upload-column,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-panel .upload-column {
  grid-row: 2 !important;
  padding: 0 22px 22px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Match detail-page left layout to the video-generation frame logic. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-heading {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-column {
  grid-row: 2 !important;
  padding: 0 22px 22px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-body:not([hidden]) {
  display: contents !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-column {
  grid-column: 1 !important;
  grid-row: 1 !important;
  position: relative !important;
  z-index: 120 !important;
  padding: 22px !important;
  overflow: visible !important;
  border: 1px solid #efeff8 !important;
  border-bottom: 0 !important;
  border-radius: 22px 22px 0 0 !important;
  background: rgba(255, 255, 255, 0.96) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-card-wrap {
  overflow: visible !important;
  isolation: isolate;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #upload-clear-x {
  top: 8px !important;
  right: 8px !important;
  z-index: 40 !important;
  width: 32px !important;
  height: 32px !important;
  pointer-events: auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #product-upload {
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  justify-items: stretch !important;
  min-height: 118px !important;
  padding: 14px !important;
  gap: 12px !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #product-upload > #upload-thumb {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #product-upload .upload-icon {
  justify-self: start !important;
  width: 42px !important;
  height: 42px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #product-upload .upload-copy {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #product-upload .upload-copy strong {
  font-size: 15px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #product-upload .upload-copy small {
  max-width: 190px !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
}

.detail-upload-strip {
  display: none;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-strip {
  display: grid !important;
  grid-template-columns: repeat(3, 64px) !important;
  gap: 8px !important;
  align-items: center !important;
  justify-content: end !important;
  padding-right: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-clear,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-template-remove {
  z-index: 20;
  pointer-events: auto;
}

body.feature-focus-mode.workstation-feature-mode .upload-column:has(.single-upload-preview-strip:not([hidden])) #product-upload {
  grid-template-columns: auto minmax(0, 1fr) 82px !important;
  align-items: center !important;
  justify-items: stretch !important;
  min-height: 122px !important;
  padding: 13px !important;
  gap: 12px !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode .upload-column:has(.single-upload-preview-strip:not([hidden])) #product-upload > #upload-thumb {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode .upload-column:has(.single-upload-preview-strip:not([hidden])) #product-upload .upload-icon {
  justify-self: start !important;
  width: 42px !important;
  height: 42px !important;
}

body.feature-focus-mode.workstation-feature-mode .upload-column:has(.single-upload-preview-strip:not([hidden])) #product-upload .upload-copy {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode .single-upload-preview-strip {
  display: grid !important;
  justify-content: end !important;
  width: 82px !important;
}

body.feature-focus-mode.workstation-feature-mode .single-upload-preview-strip[hidden] {
  display: none !important;
}

.single-upload-preview-card {
  position: relative;
  display: grid;
  width: 82px;
  height: 82px;
  aspect-ratio: var(--preview-aspect, 1 / 1);
  overflow: hidden;
  border: 1px solid #e3e6ef;
  border-radius: 12px;
  background: #f7f8fb;
  cursor: zoom-in;
}

.single-upload-preview-card img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 0 !important;
  object-fit: contain !important;
  background: #f7f8fb !important;
}

.single-upload-preview-card .upload-stack-delete {
  right: 4px;
  top: 4px;
  width: 20px;
  height: 20px;
  opacity: 0.78;
  transform: none;
}

.single-upload-preview-card .upload-stack-delete .lucide {
  width: 12px;
  height: 12px;
}

.single-upload-preview-card:hover .upload-stack-delete,
.single-upload-preview-card .upload-stack-delete:focus-visible {
  opacity: 1;
  transform: none;
}

body.feature-focus-mode.workstation-feature-mode .upload-column:has(.multi-upload-preview-strip:not([hidden])) #product-upload {
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-content: start !important;
  align-items: center !important;
  justify-items: stretch !important;
  min-height: 214px !important;
  padding: 14px !important;
  gap: 12px !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode .upload-column:has(.multi-upload-preview-strip:not([hidden])) #product-upload > #upload-thumb {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode .upload-column:has(.multi-upload-preview-strip:not([hidden])) #product-upload .upload-icon {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  width: 42px !important;
  height: 42px !important;
}

body.feature-focus-mode.workstation-feature-mode .upload-column:has(.multi-upload-preview-strip:not([hidden])) #product-upload .upload-copy {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode .multi-upload-preview-strip {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  display: flex !important;
  gap: 8px !important;
  justify-self: stretch !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-width: 0 !important;
  margin-top: 2px !important;
  padding: 0 1px 2px !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode .multi-upload-preview-strip[hidden] {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode .multi-upload-preview-strip.is-scrollable {
  overflow-x: auto !important;
  scrollbar-width: thin !important;
}

.multi-upload-preview-card {
  position: relative;
  display: grid;
  flex: 0 0 calc((100% - 32px) / 5);
  width: calc((100% - 32px) / 5);
  min-width: calc((100% - 32px) / 5);
  overflow: hidden;
  border: 1px solid #e3e6ef;
  border-radius: 12px;
  background: #f7f8fb;
  cursor: zoom-in;
}

.multi-upload-preview-strip.is-scrollable .multi-upload-preview-card {
  flex-basis: calc((100% - 32px) / 5);
}

.multi-upload-preview-card img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 3 / 4 !important;
  border-radius: 0 !important;
  object-fit: cover !important;
  background: #f7f8fb !important;
}

.multi-upload-preview-card .upload-stack-delete {
  right: 4px;
  top: 4px;
  width: 20px;
  height: 20px;
  opacity: 0.78;
  transform: none;
}

.multi-upload-preview-card .upload-stack-delete .lucide {
  width: 12px;
  height: 12px;
}

.multi-upload-preview-card:hover .upload-stack-delete,
.multi-upload-preview-card .upload-stack-delete:focus-visible {
  opacity: 1;
  transform: none;
}

.detail-upload-slot {
  position: relative;
  display: grid;
  grid-template-rows: 64px auto;
  justify-items: center;
  gap: 4px;
  width: 64px;
  min-height: 84px;
  overflow: visible;
  color: #8a90a0;
  cursor: pointer;
}

.detail-upload-slot-frame {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  overflow: hidden;
  border: 1px dashed #d8dce8;
  border-radius: 12px;
  background: #f8f9fc;
}

.detail-upload-slot.is-filled .detail-upload-slot-frame {
  border-style: solid;
  border-color: #dfe2ec;
  background: #fff;
}

.detail-upload-slot small {
  display: block;
  width: 100%;
  font-size: 10.5px;
  line-height: 1.1;
  font-weight: 500;
  color: #667085;
  text-align: center;
}

.detail-upload-slot img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 0 !important;
  object-fit: cover !important;
  background: #f4f5f8 !important;
}

.detail-upload-slot .lucide {
  width: 18px;
  height: 18px;
  stroke-width: 2;
}

.detail-upload-slot:hover .detail-upload-slot-frame {
  border-color: #8b73ff;
  background: #f5f2ff;
}


body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-basic-selects {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 9px !important;
  margin-top: 14px !important;
  position: relative !important;
  z-index: 130 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-basic-select-card {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 9px !important;
  padding: 10px !important;
  border: 1px solid rgba(221, 226, 240, 0.94) !important;
  border-radius: 16px !important;
  background: rgba(250, 251, 255, 0.88) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.92), 0 8px 20px rgba(37, 45, 72, 0.04) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options {
  display: grid !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-resolution-panel {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-action-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 9px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options .video-compact-select summary {
  min-height: 44px !important;
  padding: 0 11px 0 12px !important;
  gap: 6px !important;
  border-radius: 10px !important;
  box-shadow: 0 7px 16px rgba(54, 46, 92, 0.06) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options .video-compact-select summary span {
  font-size: 12px !important;
  font-weight: 600 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options .video-compact-select summary strong {
  font-size: 12.5px !important;
  font-weight: 700 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options .video-compact-select summary > .lucide {
  width: 13px !important;
  height: 13px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options .video-compact-menu {
  bottom: calc(100% + 6px) !important;
  top: auto !important;
  z-index: 1200 !important;
  gap: 5px !important;
  padding: 7px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options .video-compact-menu button {
  min-height: 32px !important;
  padding: 0 10px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-ratio-menu {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  grid-template-columns: minmax(0, 1fr) !important;
  justify-items: stretch !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-ratio-menu button {
  justify-content: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  padding: 0 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-ratio-menu button span {
  overflow: visible !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-resolution-menu {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-row {
  display: grid !important;
  grid-column: 1 / -1 !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: stretch !important;
  gap: 8px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 12px !important;
  border: 1px solid rgba(108, 93, 246, 0.22) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8f7ff 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.94), 0 12px 26px rgba(88, 76, 180, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-row > span {
  color: #4f46c8 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-options {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 8px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-options button {
  min-width: 0 !important;
  min-height: 34px !important;
  border: 1px solid rgba(199, 205, 230, 0.95) !important;
  border-radius: 999px !important;
  padding: 0 12px !important;
  color: #30384d !important;
  background: rgba(255, 255, 255, 0.98) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  box-shadow: 0 3px 10px rgba(34, 42, 70, 0.04) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-options button:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-options button:focus-visible {
  border-color: rgba(123, 97, 255, 0.42) !important;
  outline: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-options button.selected {
  color: #fff !important;
  border-color: #6c5df6 !important;
  background: linear-gradient(135deg, #6c5df6, #7b8cff) !important;
  box-shadow: 0 8px 18px rgba(108, 93, 246, 0.2) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-template-entry {
  margin-top: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-button {
  min-height: 74px !important;
  border-radius: 11px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-materials .detail-reference-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 74px !important;
  padding: 12px 30px 12px 12px !important;
  border: 1px solid rgba(126, 112, 255, 0.34) !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 10px 22px rgba(79, 75, 150, 0.08) !important;
  font-family: inherit !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-materials .detail-reference-button > img,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-materials .detail-reference-button > .lucide {
  width: 40px !important;
  height: 40px !important;
  padding: 9px !important;
  border-radius: 11px !important;
  color: #6757ff !important;
  background: #f0edff !important;
}

html body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-page-module-picker {
  display: grid !important;
  gap: 10px !important;
  margin-top: 14px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-card {
  grid-template-columns: minmax(0, 1fr) !important;
  min-height: 0 !important;
  padding: 8px 12px !important;
  cursor: pointer !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-card label {
  min-height: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-card label span {
  gap: 1px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-card label strong {
  line-height: 1.15 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-card label small {
  line-height: 1.2 !important;
}

html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-card label small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-grid {
  gap: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Detail pages: compact the ten module cards without changing type or grid rhythm. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-card {
  padding: 7px 13px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-grid {
  gap: 7px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-materials .detail-reference-button {
  min-height: 78px !important;
  padding: 12px 28px 12px 12px !important;
  gap: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-materials .detail-reference-button > img,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-materials .detail-reference-button > .lucide {
  width: 40px !important;
  height: 40px !important;
  padding: 9px !important;
  border-radius: 11px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-panel {
  gap: 7px !important;
  padding-top: 2px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-grid {
  gap: 7px !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle {
  grid-column: 1 / -1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  width: 64px;
  height: 28px;
  margin: -1px 0 1px;
  padding: 0;
  border: 1px solid rgba(119, 99, 246, 0.24);
  border-radius: 999px;
  color: #6f58ee;
  background: rgba(246, 243, 255, 0.92);
  box-shadow: 0 5px 14px rgba(93, 72, 213, 0.08);
  cursor: pointer;
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle:hover {
  border-color: rgba(101, 79, 242, 0.48);
  color: #563de5;
  background: #fff;
  box-shadow: 0 7px 17px rgba(93, 72, 213, 0.14);
  transform: translateY(1px);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle:focus-visible {
  outline: 3px solid rgba(111, 88, 238, 0.16);
  outline-offset: 2px;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle > .lucide {
  width: 18px;
  height: 18px;
  stroke-width: 2.2;
  transition: transform 0.2s ease;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle[aria-expanded="true"] > .lucide {
  transform: rotate(180deg);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-options {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-options[hidden] {
  display: none !important;
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle {
  border-color: rgba(153, 136, 255, 0.36);
  color: #b9aaff;
  background: rgba(112, 92, 246, 0.14);
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-button {
  gap: 4px !important;
  min-height: 56px !important;
  padding: 9px 11px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-auto {
  display: grid !important;
  grid-template-columns: 48px minmax(0, 1fr) 48px !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  column-gap: 12px !important;
  row-gap: 3px !important;
  min-height: 76px !important;
  padding: 15px 18px !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-recommend-badge {
  position: static !important;
  grid-column: 1 !important;
  grid-row: 1 / 3 !important;
  justify-self: start !important;
  height: 18px !important;
  min-width: 36px !important;
  padding: 0 7px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-button.detail-style-preset-auto span {
  font-size: 15px !important;
  font-weight: 620 !important;
  line-height: 1.15 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-button.detail-style-preset-auto small {
  display: block !important;
  margin-top: 3px !important;
  font-size: 11.5px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-button.detail-style-preset-auto.selected small {
  color: rgba(255, 255, 255, 0.82) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-button:not(.detail-style-preset-auto) span {
  color: #2c3449 !important;
  font-size: 13.5px !important;
  font-weight: 650 !important;
  line-height: 1.15 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-button:not(.detail-style-preset-auto).selected span {
  color: #fff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-button[aria-disabled="true"],
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-button.is-disabled {
  cursor: not-allowed !important;
  opacity: 0.58 !important;
  transform: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-button[aria-disabled="true"]:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-button.is-disabled:hover {
  border-color: rgba(218, 222, 238, 0.88) !important;
  background: rgba(255, 255, 255, 0.72) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-button.is-dragover {
  border-color: rgba(91, 75, 232, 0.66) !important;
  background:
    radial-gradient(circle at 50% 6%, rgba(123, 97, 255, 0.13), transparent 42%),
    linear-gradient(180deg, #fff 0%, #f5f2ff 100%) !important;
  box-shadow:
    0 18px 36px rgba(123, 97, 255, 0.16),
    0 0 0 5px rgba(123, 97, 255, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-card::before {
  position: absolute !important;
  left: 12px !important;
  top: calc(100% + 7px) !important;
  z-index: 80 !important;
  content: "鐐瑰嚮娣诲姞涓€寮狅紝閲嶅鐐瑰嚮鍙坊鍔犲寮? !important;
  width: max-content !important;
  max-width: 220px !important;
  padding: 7px 9px !important;
  border-radius: 10px !important;
  color: #fff !important;
  background: rgba(36, 42, 62, 0.92) !important;
  box-shadow: 0 14px 28px rgba(36, 42, 62, 0.16) !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(-2px) !important;
  transition: opacity 0.14s ease, transform 0.14s ease !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-card:hover::before,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-card:focus-visible::before {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-card.has-count::after {
  position: absolute !important;
  right: 10px !important;
  top: 9px !important;
  content: attr(data-detail-module-count-label) !important;
  padding: 4px 7px !important;
  border-radius: 999px !important;
  color: #6657ff !important;
  background: rgba(102, 87, 255, 0.09) !important;
  font-size: 10.5px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-count {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-select-field[open] {
  z-index: 140 !important;
}

@media (max-width: 760px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-basic-selects {
    grid-template-columns: 1fr !important;
  }
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-column {
  grid-column: 1 !important;
  grid-row: 2 !important;
  position: relative !important;
  z-index: 1 !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 22px 22px !important;
  border: 1px solid #efeff8 !important;
  border-top: 0 !important;
  border-radius: 0 0 22px 22px !important;
  background: rgba(255, 255, 255, 0.96) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-bottom-area {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-action-row {
  display: grid !important;
  grid-column: 1 / -1 !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  align-items: stretch !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-resolution-panel {
  display: grid !important;
  grid-column: 1 / -1 !important;
  gap: 8px !important;
  padding: 12px !important;
  border: 1px solid #e8ecf5 !important;
  border-radius: 16px !important;
  background: #fbfcff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-resolution-title {
  color: #4b5570 !important;
  font-size: 13px !important;
  font-weight: 520 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-resolution-options {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-resolution-options button {
  min-height: 36px !important;
  border: 1px solid #dde5f5 !important;
  border-radius: 12px !important;
  color: #43506f !important;
  background: #fff !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-resolution-options button.selected {
  border-color: #5572d8 !important;
  color: #fff !important;
  background: #5572d8 !important;
  box-shadow: 0 8px 18px rgba(85, 114, 216, 0.18) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .preview-frame,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .preview-gallery,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .preview-compare,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .copy-result-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-recent-panel {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .preview-column {
  display: block !important;
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .preview-card {
  display: block !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-panel {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) !important;
  gap: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-body {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 8px !important;
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  min-height: 38px !important;
  padding: 1px 12px 3px 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-toolbar span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  border: 1px solid rgba(108, 93, 246, 0.22) !important;
  border-radius: 999px !important;
  padding: 0 13px !important;
  color: #5d55d8 !important;
  background: rgba(108, 93, 246, 0.09) !important;
  font-size: 12.5px !important;
  font-weight: 680 !important;
  box-shadow: 0 6px 16px rgba(108, 93, 246, 0.09) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-toolbar button {
  min-height: 30px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(218, 223, 237, 0.96) !important;
  border-radius: 999px !important;
  color: #656d81 !important;
  background: #ffffff !important;
  font-size: 12.5px !important;
  font-weight: 620 !important;
  cursor: pointer !important;
  box-shadow: 0 7px 16px rgba(35, 43, 68, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-toolbar button:hover {
  color: #d84f61 !important;
  border-color: rgba(216, 79, 97, 0.32) !important;
  background: rgba(255, 247, 248, 0.98) !important;
  box-shadow: 0 8px 18px rgba(216, 79, 97, 0.12) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-head {
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-head strong {
  color: #202538 !important;
  font-size: 18px !important;
  font-weight: 560 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-head small {
  color: #7d8497 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-list {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(100px, 1fr)) !important;
  grid-template-rows: none !important;
  grid-auto-rows: 540px !important;
  align-content: start !important;
  gap: 12px !important;
  min-height: 0 !important;
  height: 100% !important;
  overflow: auto !important;
  padding: 0 4px 8px 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-list-1 {
  grid-template-rows: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-list-2 {
  grid-template-rows: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-list-3 {
  grid-template-rows: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-list-4 {
  grid-auto-rows: auto !important;
  align-content: start !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-frame {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  gap: 8px !important;
  width: 100% !important;
  height: 540px !important;
  justify-self: stretch !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 9px !important;
  border: 1px solid rgba(226, 230, 242, 0.62) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.5) !important;
  box-shadow: 0 8px 18px rgba(38, 45, 74, 0.04) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-delete-button {
  position: absolute !important;
  right: 10px !important;
  top: 10px !important;
  z-index: 4 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  color: #ff7f90 !important;
  background: rgba(255, 245, 247, 0.92) !important;
  box-shadow: 0 6px 16px rgba(120, 50, 65, 0.1) !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  opacity: 0.96 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-delete-button:hover {
  color: #ffffff !important;
  background: #ff7f90 !important;
  opacity: 1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-delete-button .lucide {
  width: 13px !important;
  height: 13px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-frame.is-selected {
  border-color: rgba(129, 139, 255, 0.32) !important;
  box-shadow: 0 12px 26px rgba(95, 109, 241, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-card {
  position: relative !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 5px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
  overflow: visible !important;
  appearance: none !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  cursor: zoom-in !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-card img,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-card .work-image-empty {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-unit-summary {
  position: static !important;
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: #6f778b !important;
  background: transparent !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  font-style: normal !important;
  line-height: 1.35 !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-card em {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(255, 255, 255, 0.16), transparent 34%),
    linear-gradient(120deg, rgba(38, 44, 68, 0.38), rgba(95, 109, 241, 0.34), rgba(55, 182, 164, 0.24)),
    rgba(32, 37, 56, 0.34) !important;
  font-style: normal !important;
  font-size: 14px !important;
  font-weight: 560 !important;
  letter-spacing: 0 !important;
  animation: detail-preview-overlay-pulse 1.8s ease-in-out infinite !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-empty {
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 8px !important;
  height: 100% !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #8b92a5 !important;
  background: transparent !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-empty strong {
  color: #4b5368 !important;
  font-size: 18px !important;
  font-weight: 560 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-panel {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  gap: 9px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-progress-panel {
  display: grid !important;
  grid-template-rows: auto auto auto !important;
  align-content: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 4px 2px !important;
  color: #202538 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-head {
  display: grid !important;
  align-items: start !important;
  gap: 6px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-head > span {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-head strong {
  overflow: hidden !important;
  color: #182033 !important;
  font-size: 15px !important;
  font-weight: 680 !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-empty small {
  color: #858da1 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  text-align: right !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-scroll-area {
  display: grid !important;
  align-content: start !important;
  gap: 9px !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 1px 8px 4px 0 !important;
  scrollbar-color: rgba(108, 116, 140, 0.26) transparent !important;
  scrollbar-width: thin !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-scroll-area::-webkit-scrollbar {
  width: 6px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-scroll-area::-webkit-scrollbar-track {
  background: transparent !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-scroll-area::-webkit-scrollbar-thumb {
  min-height: 42px !important;
  border-radius: 999px !important;
  background: rgba(108, 116, 140, 0.24) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-scroll-area:hover::-webkit-scrollbar-thumb {
  background: rgba(108, 93, 246, 0.34) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-list {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 5px !important;
  min-height: 0 !important;
  max-height: 220px !important;
  overflow: auto !important;
  padding-right: 2px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-edit-request {
  width: 100% !important;
  min-height: 48px !important;
  resize: vertical !important;
  border: 1px solid rgba(226, 230, 242, 0.88) !important;
  border-radius: 7px !important;
  padding: 6px 7px !important;
  color: #202538 !important;
  background: rgba(255, 255, 255, 0.86) !important;
  font: inherit !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
  outline: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-field-main .detail-preview-edit-request {
  min-height: 70px !important;
  max-height: 110px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-field-copy .detail-preview-edit-request {
  min-height: 58px !important;
  max-height: 92px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-edit-request:focus {
  border-color: #8b94ff !important;
  box-shadow: 0 0 0 3px rgba(139, 148, 255, 0.12) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-item {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  align-content: start !important;
  gap: 4px !important;
  min-width: 0 !important;
  padding: 4px !important;
  border: 1px solid rgba(226, 230, 242, 0.42) !important;
  border-radius: 7px !important;
  background: rgba(248, 250, 255, 0.38) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-item.is-disabled {
  opacity: 0.58 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-line-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-item span {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  color: #4b5368 !important;
  font-size: 11px !important;
  font-weight: 560 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  align-self: start !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-line-head button {
  flex: 0 0 auto !important;
  min-height: 18px !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 0 6px !important;
  color: #7b8194 !important;
  background: rgba(231, 235, 247, 0.8) !important;
  font-size: 10px !important;
  font-weight: 560 !important;
  cursor: pointer !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-item.is-disabled .detail-preview-line-head button {
  color: #6c5df6 !important;
  background: rgba(108, 93, 246, 0.12) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-item span em {
  display: inline-grid !important;
  place-items: center !important;
  width: 20px !important;
  height: 16px !important;
  border-radius: 5px !important;
  color: #6c5df6 !important;
  background: rgba(108, 93, 246, 0.1) !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 650 !important;
  flex: 0 0 auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-item textarea {
  width: 100% !important;
  min-height: 32px !important;
  height: auto !important;
  resize: vertical !important;
  border: 1px solid rgba(226, 230, 242, 0.8) !important;
  border-radius: 6px !important;
  padding: 5px 6px !important;
  color: #202538 !important;
  background: rgba(255, 255, 255, 0.82) !important;
  font: inherit !important;
  font-size: 11px !important;
  line-height: 1.34 !important;
  outline: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-item textarea:disabled {
  color: #9399aa !important;
  background: rgba(242, 244, 250, 0.72) !important;
  text-decoration: line-through !important;
}

@media (max-width: 1120px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-list {
    grid-template-columns: repeat(2, minmax(130px, 1fr)) !important;
  }
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-item textarea:focus {
  border-color: #8b94ff !important;
  box-shadow: 0 0 0 3px rgba(139, 148, 255, 0.12) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-action-row {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-final-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-download-button {
  justify-self: end !important;
  min-width: 62px !important;
  min-height: 30px !important;
  border: 0 !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 560 !important;
  cursor: pointer !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-final-button {
  color: #fff !important;
  background: #6c5df6 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-download-button {
  color: #4b5368 !important;
  background: rgba(231, 235, 247, 0.9) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-progress-track {
  width: 100% !important;
  height: 8px !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background: #e8ebf6 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-progress-track span {
  display: block !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: linear-gradient(90deg, #5f6df1, #37b6a4, #5f6df1) !important;
  background-size: 200% 100% !important;
  animation: detail-preview-progress-flow 1.35s linear infinite !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-progress-meta {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  color: #747c90 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-progress-meta strong {
  color: #202538 !important;
  font-size: 15px !important;
  font-weight: 560 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-loading-line {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 5px !important;
  height: 4px !important;
  margin: 3px 0 4px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-loading-line i {
  display: block !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, rgba(108, 93, 246, 0.25), rgba(108, 93, 246, 0.85), rgba(108, 93, 246, 0.25)) !important;
  animation: detail-loading-pulse 1.15s ease-in-out infinite !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-loading-line i:nth-child(2) {
  animation-delay: 0.15s !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-loading-line i:nth-child(3) {
  animation-delay: 0.3s !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-empty {
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 8px !important;
  height: 100% !important;
  color: #8b92a5 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #generate {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-height: 58px !important;
}

.detail-preview-lightbox {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000 !important;
  display: grid !important;
  place-items: center !important;
  padding: 28px !important;
  border: 0 !important;
  background: rgba(18, 22, 34, 0.78) !important;
  cursor: zoom-out !important;
}

.detail-preview-lightbox img {
  display: block !important;
  max-width: min(92vw, 1280px) !important;
  max-height: 92vh !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.34) !important;
  pointer-events: none !important;
}

@keyframes detail-preview-progress-flow {
  0% {
    background-position: 100% 0;
  }
  100% {
    background-position: -100% 0;
  }
}

@keyframes detail-preview-overlay-pulse {
  0%,
  100% {
    opacity: 0.82;
  }
  50% {
    opacity: 1;
  }
}

body.feature-focus-mode.workstation-feature-mode:not([data-active-feature="detail-page"]) .preview-card {
  height: calc(100% - 12px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] {
  height: 100vh !important;
  min-height: 100vh !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .app-layout,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .main-area,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .content-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .workspace,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-body {
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .main-area {
  display: grid !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-panel {
  grid-template-rows: auto minmax(0, 1fr) !important;
  margin-bottom: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-body {
  align-items: stretch !important;
  min-height: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .preview-column {
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .preview-card {
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-body {
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-body {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-list {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  grid-auto-rows: max-content !important;
  align-content: start !important;
  gap: 12px !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 0 10px 18px 0 !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable !important;
  scrollbar-color: rgba(124, 113, 220, 0.28) rgba(246, 247, 252, 0.62) !important;
  scrollbar-width: thin !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-list::-webkit-scrollbar {
  width: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-list::-webkit-scrollbar-track {
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(247, 248, 253, 0.42), rgba(239, 241, 249, 0.72)) !important;
  box-shadow: inset 0 0 0 1px rgba(216, 221, 238, 0.34) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-list::-webkit-scrollbar-thumb {
  min-height: 76px !important;
  border: 3px solid rgba(247, 248, 253, 0.82) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(153, 143, 236, 0.5), rgba(115, 103, 224, 0.34)) !important;
  box-shadow: 0 6px 16px rgba(108, 93, 246, 0.12) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-list:hover::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(139, 128, 238, 0.72), rgba(105, 92, 224, 0.5)) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-frame {
  overflow: hidden !important;
  align-content: start !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-frame.is-draft {
  height: 720px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-card {
  overflow: hidden !important;
  border-radius: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-card img,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-card .work-image-empty {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: min(48vh, 430px) !important;
  object-fit: contain !important;
  object-position: center top !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-frame:not(.is-draft):not(.is-running):not(.is-failed) {
  gap: 0 !important;
  padding: 8px !important;
  background: rgba(255, 255, 255, 0.68) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-frame:not(.is-draft):not(.is-running):not(.is-failed) .detail-page-latest-card {
  display: block !important;
  height: 100% !important;
  min-height: 0 !important;
  border-radius: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-frame:not(.is-draft):not(.is-running):not(.is-failed) .detail-page-latest-card img,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-frame:not(.is-draft):not(.is-running):not(.is-failed) .detail-page-latest-card .work-image-empty {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-frame:not(.is-draft):not(.is-running):not(.is-failed) .detail-page-latest-unit-summary {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  z-index: 3 !important;
  max-width: calc(100% - 52px) !important;
  padding: 5px 8px !important;
  border-radius: 999px !important;
  color: #30384d !important;
  background: rgba(255, 255, 255, 0.84) !important;
  box-shadow: 0 8px 20px rgba(38, 45, 74, 0.1) !important;
  backdrop-filter: blur(10px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-regenerate-button {
  justify-self: center !important;
  margin-top: 7px !important;
  min-height: 24px !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 0 10px !important;
  color: #8a91a3 !important;
  background: transparent !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-frame:not(.is-draft):not(.is-running):not(.is-failed) .detail-preview-regenerate-button {
  position: absolute !important;
  left: 50% !important;
  bottom: 10px !important;
  z-index: 3 !important;
  transform: translateX(-50%) !important;
  margin-top: 0 !important;
  min-height: 26px !important;
  padding: 0 14px !important;
  color: #6c7284 !important;
  background: rgba(255, 255, 255, 0.82) !important;
  box-shadow: 0 8px 22px rgba(38, 45, 74, 0.1) !important;
  backdrop-filter: blur(10px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-regenerate-button:hover {
  color: #5f55d8 !important;
  background: rgba(108, 93, 246, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-variant-controls {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: center !important;
  gap: 8px !important;
  margin-top: 8px !important;
  padding: 3px 5px !important;
  border-radius: 999px !important;
  background: rgba(246, 248, 252, 0.92) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-frame:not(.is-draft):not(.is-running):not(.is-failed) .detail-preview-variant-controls {
  position: absolute !important;
  left: 50% !important;
  bottom: 42px !important;
  z-index: 3 !important;
  transform: translateX(-50%) !important;
  margin-top: 0 !important;
  background: rgba(255, 255, 255, 0.84) !important;
  box-shadow: 0 8px 22px rgba(38, 45, 74, 0.1) !important;
  backdrop-filter: blur(10px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-variant-controls button {
  min-height: 23px !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 0 9px !important;
  color: #6d7382 !important;
  background: #ffffff !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  box-shadow: 0 4px 12px rgba(34, 42, 62, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-variant-controls button:hover {
  color: #5f55d8 !important;
  background: rgba(108, 93, 246, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-variant-controls span {
  min-width: 32px !important;
  color: #8c93a3 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-text-panel {
  gap: 15px !important;
  min-height: 500px !important;
  overflow: hidden !important;
  padding: 19px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-edit-request {
  max-width: 100% !important;
  min-height: 110px !important;
  border-radius: 10px !important;
  padding: 10px 11px !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-field {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-field > span {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 4px 8px !important;
  min-width: 0 !important;
  color: #30384d !important;
  font-size: 13px !important;
  font-weight: 560 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-field > span em {
  flex: 0 0 auto !important;
  min-width: 0 !important;
  color: #30384d !important;
  font-style: normal !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-field-copy > span {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-title {
  display: flex !important;
  align-items: baseline !important;
  gap: 7px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-copy-control {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-ai-text-button {
  position: absolute !important;
  right: 10px !important;
  bottom: 10px !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  flex: 0 0 auto !important;
  min-height: 24px !important;
  padding: 0 8px !important;
  border: 1px solid rgba(108, 93, 246, 0.24) !important;
  border-radius: 999px !important;
  color: #6658e9 !important;
  background: rgba(247, 245, 255, 0.96) !important;
  box-shadow: 0 5px 12px rgba(108, 93, 246, 0.08) !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-ai-text-button .lucide {
  width: 12px !important;
  height: 12px !important;
  stroke-width: 2.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-ai-text-button b {
  font: inherit !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-ai-text-button:hover:not(:disabled) {
  color: #fff !important;
  border-color: #6c5df6 !important;
  background: #6c5df6 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-ai-text-button:disabled {
  opacity: 0.72 !important;
  cursor: wait !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-ai-text-button.is-busy .lucide {
  animation: detail-preview-spin 1.1s linear infinite !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switches {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  min-width: max-content !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-field .detail-preview-edit-request {
  border-color: rgba(207, 216, 238, 0.96) !important;
  background: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 6px 14px rgba(44, 54, 88, 0.04) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-field-main .detail-preview-edit-request,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-field-copy .detail-preview-edit-request {
  display: block !important;
  width: 100% !important;
  height: 102px !important;
  min-height: 102px !important;
  max-height: 102px !important;
  box-sizing: border-box !important;
  resize: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-copy-request {
  padding-bottom: 40px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  flex: 0 0 auto !important;
  min-height: 26px !important;
  border: 1px solid rgba(216, 222, 238, 0.96) !important;
  border-radius: 999px !important;
  padding: 0 8px 0 4px !important;
  color: #727b91 !important;
  background: rgba(243, 246, 252, 0.92) !important;
  font-size: 10px !important;
  font-weight: 560 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch[data-detail-style-tip]::after {
  left: auto !important;
  right: 0 !important;
  width: 232px !important;
  max-width: min(260px, calc(100vw - 32px)) !important;
  transform: translateY(4px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch[data-detail-style-tip]::before {
  left: auto !important;
  right: 16px !important;
  transform: translateY(4px) rotate(45deg) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch[data-detail-style-tip]:hover::after,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch[data-detail-style-tip]:focus-visible::after {
  transform: translateY(0) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch[data-detail-style-tip]:hover::before,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch[data-detail-style-tip]:focus-visible::before {
  transform: translateY(0) rotate(45deg) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch b {
  font: inherit !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch i {
  position: relative !important;
  width: 30px !important;
  height: 18px !important;
  flex: 0 0 auto !important;
  border-radius: 999px !important;
  background: #cbd3e4 !important;
  transition: background 0.18s ease !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch i::after {
  content: "" !important;
  position: absolute !important;
  top: 3px !important;
  left: 3px !important;
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-shadow: 0 1px 4px rgba(28, 35, 54, 0.22) !important;
  transition: transform 0.18s ease !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch.selected {
  color: #fff !important;
  border-color: #6c5df6 !important;
  background: #6c5df6 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch.selected i {
  background: rgba(255, 255, 255, 0.32) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch.selected i::after {
  transform: translateX(12px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-no-text-switch {
  color: #8a6471 !important;
  background: rgba(255, 241, 244, 0.92) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-no-text-switch.selected {
  color: #fff !important;
  border-color: #e15b78 !important;
  background: #e15b78 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-text-switch:disabled {
  opacity: 0.48 !important;
  cursor: not-allowed !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-copy-request:disabled {
  color: #9aa3b5 !important;
  background: rgba(242, 245, 251, 0.9) !important;
  cursor: not-allowed !important;
}

@media (max-width: 1380px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-list {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-placeholder {
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 180px !important;
  aspect-ratio: 9 / 13 !important;
  padding: 14px !important;
  color: #747c90 !important;
  background: linear-gradient(180deg, rgba(247, 249, 255, 0.96), rgba(238, 241, 250, 0.86)) !important;
  border: 1px dashed rgba(175, 183, 206, 0.7) !important;
  border-radius: 8px !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-placeholder .lucide {
  width: 24px !important;
  height: 24px !important;
  color: #6c5df6 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-frame.is-running .detail-card-placeholder .lucide {
  animation: detail-preview-spin 1.1s linear infinite !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-placeholder strong {
  color: #30384d !important;
  font-size: 13px !important;
  font-weight: 560 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-placeholder small {
  max-width: 150px !important;
  color: #858da1 !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-option-row {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 9px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-option-row button {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 36px !important;
  border: 1px solid rgba(216, 222, 238, 0.95) !important;
  border-radius: 999px !important;
  padding: 0 10px !important;
  color: #3f4658 !important;
  background: rgba(255, 255, 255, 0.92) !important;
  font-size: 12px !important;
  font-weight: 520 !important;
  cursor: pointer !important;
  box-shadow: 0 2px 8px rgba(45, 54, 82, 0.04) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-option-row button:first-of-type {
  grid-column: 1 / -1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-option-row.is-multi button:first-of-type {
  grid-column: 1 / -1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-option-row.is-count {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-option-row.is-count button:first-of-type {
  grid-column: auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-option-row button.selected {
  color: #fff !important;
  border-color: #6c5df6 !important;
  background: linear-gradient(135deg, #6c5df6, #7b8cff) !important;
  box-shadow: 0 8px 18px rgba(108, 93, 246, 0.22) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-color-panel {
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-auto-color {
  justify-self: stretch !important;
  order: -2 !important;
  width: 100% !important;
  min-height: 36px !important;
  border: 1px solid rgba(226, 230, 242, 0.9) !important;
  border-radius: 999px !important;
  padding: 0 13px !important;
  color: #4b5368 !important;
  background: rgba(255, 255, 255, 0.82) !important;
  font-size: 12px !important;
  font-weight: 520 !important;
  cursor: pointer !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-auto-color.selected {
  color: #fff !important;
  border-color: #6c5df6 !important;
  background: #6c5df6 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-color-block {
  display: grid !important;
  gap: 6px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-color-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-color-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  min-width: 0 !important;
  min-height: 32px !important;
  border: 1px solid rgba(226, 230, 242, 0.86) !important;
  border-radius: 8px !important;
  padding: 0 6px !important;
  color: #4b5368 !important;
  background: rgba(255, 255, 255, 0.78) !important;
  font-size: 11px !important;
  font-weight: 520 !important;
  cursor: pointer !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-color-button i {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
  border: 1px solid rgba(80, 86, 104, 0.18) !important;
  border-radius: 50% !important;
  background: var(--detail-color) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-color-button.selected {
  color: #302a78 !important;
  border-color: rgba(108, 93, 246, 0.72) !important;
  background: rgba(108, 93, 246, 0.1) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-mode-row {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-mode-row button {
  width: 100% !important;
  min-height: 34px !important;
  border: 1px solid rgba(226, 230, 242, 0.86) !important;
  border-radius: 999px !important;
  padding: 0 12px !important;
  color: #4b5368 !important;
  background: rgba(255, 255, 255, 0.78) !important;
  font-size: 12px !important;
  font-weight: 520 !important;
  cursor: pointer !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-mode-row button.selected {
  color: #fff !important;
  border-color: #6c5df6 !important;
  background: #6c5df6 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-preview-action-row {
  align-items: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-state {
  margin-right: auto !important;
  color: #858da1 !important;
  font-size: 11px !important;
  font-weight: 560 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-copy-button {
  min-height: 26px !important;
  border: 1px solid rgba(216, 222, 238, 0.92) !important;
  border-radius: 999px !important;
  padding: 0 12px !important;
  color: #5f55d8 !important;
  background: rgba(255, 255, 255, 0.88) !important;
  font-size: 11px !important;
  font-weight: 520 !important;
  cursor: pointer !important;
  box-shadow: 0 4px 12px rgba(45, 54, 82, 0.06) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-card-copy-button:hover {
  color: #ffffff !important;
  border-color: #6c5df6 !important;
  background: #6c5df6 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-column,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-column {
  font-family: inherit !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #product-upload .upload-copy strong,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-head span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-head span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-label,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-box > span {
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-button strong,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-materials .detail-reference-button strong,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-button span {
  font-size: 12.5px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-module-option strong {
  font-size: 12.5px !important;
  font-weight: 300 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-select-field summary,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-row > span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-options button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .count-option,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .resolution-option,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section summary span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section summary strong,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select summary span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select summary strong,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-count-select,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-count-menu button {
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #product-upload .upload-copy small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-head small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-button small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-reference-materials .detail-reference-button small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-head small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-button small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-count-label small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-count-note,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .inline-model-section summary small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .print-compact-select summary small {
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-recommend-badge,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-card.has-count::after,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-module-count > span {
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-row > span {
  font-size: 13px !important;
  font-weight: 600 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-options button {
  font-size: 12.5px !important;
  font-weight: 500 !important;
}

@keyframes detail-preview-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes detail-loading-pulse {
  0%,
  100% {
    opacity: 0.35;
    transform: scaleX(0.72);
  }
  50% {
    opacity: 1;
    transform: scaleX(1);
  }
}

/* Video generation uses the standard workstation layout; only video-specific controls are adjusted here. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .preview-gallery,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .preview-compare,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .copy-result-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .generate-count-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .inline-model-section,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .detail-page-resolution-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .preview-frame,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .task-recent-panel {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .task-panel {
  grid-template-rows: auto auto minmax(0, 1fr) 126px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .task-heading {
  min-height: 0 !important;
  align-content: end !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-column {
  align-self: start !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-column:has(.video-upload-strip:not([hidden])) #product-upload {
  align-content: start !important;
  min-height: 236px !important;
  padding: 18px 16px 14px !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  justify-items: stretch !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-column:has(.video-upload-strip:not([hidden])) #product-upload .upload-icon {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  align-self: center !important;
  width: 52px !important;
  height: 52px !important;
  border-radius: 16px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-column:has(.video-upload-strip:not([hidden])) #product-upload .upload-copy {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  justify-self: stretch !important;
  min-width: 0 !important;
  display: grid !important;
  gap: 3px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-column:has(.video-upload-strip:not([hidden])) #product-upload strong {
  font-size: 16px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] #upload-stack {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-strip {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  display: flex !important;
  justify-self: stretch !important;
  justify-content: flex-start !important;
  gap: 4px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin-top: 6px !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  padding: 0 1px 2px !important;
  scroll-snap-type: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-strip[hidden] {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-strip.is-scrollable {
  overflow-x: auto !important;
  scroll-snap-type: x mandatory !important;
  scrollbar-width: thin !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-slot {
  position: relative !important;
  display: grid !important;
  grid-template-rows: auto 20px !important;
  gap: 7px !important;
  place-items: stretch !important;
  flex: 0 0 calc((100% - 16px) / 5) !important;
  width: calc((100% - 16px) / 5) !important;
  min-width: calc((100% - 16px) / 5) !important;
  aspect-ratio: auto !important;
  height: auto !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  scroll-snap-align: start !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-strip.is-scrollable .video-upload-slot {
  flex-basis: calc((100% - 16px) / 5) !important;
  width: calc((100% - 16px) / 5) !important;
  min-width: calc((100% - 16px) / 5) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-slot img,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-slot video,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-audio-thumb {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 3 / 4 !important;
  min-height: 0 !important;
  object-fit: cover !important;
  overflow: hidden !important;
  border: 1px solid rgba(226, 230, 242, 0.9) !important;
  border-radius: 10px !important;
  background: #f7f7fb !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-slot small {
  position: static !important;
  display: grid !important;
  place-items: center !important;
  align-self: start !important;
  min-width: 0 !important;
  padding: 0 2px !important;
  color: #4b5368 !important;
  background: transparent !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  pointer-events: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-audio-thumb {
  display: grid !important;
  place-items: center !important;
  color: #7b61ff !important;
  background: linear-gradient(180deg, #f8f6ff, #eef7ff) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-audio-thumb .lucide {
  width: 22px !important;
  height: 22px !important;
  stroke-width: 2.4 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-slot .upload-stack-delete {
  right: 4px !important;
  top: 4px !important;
  display: grid !important;
  place-items: center !important;
  width: 18px !important;
  height: 18px !important;
  padding: 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.72) !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: rgba(19, 24, 38, 0.48) !important;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.18) !important;
  opacity: 0.72 !important;
  transform: none !important;
  transition: opacity 0.16s ease, transform 0.16s ease, background 0.16s ease !important;
  backdrop-filter: blur(8px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-slot .upload-stack-delete .lucide {
  width: 11px !important;
  height: 11px !important;
  stroke-width: 2.6 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-slot:hover .upload-stack-delete,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-slot .upload-stack-delete:focus-visible {
  opacity: 1 !important;
  transform: none !important;
  background: rgba(239, 68, 68, 0.9) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-column .video-upload-options {
  margin-top: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column {
  grid-row: 3 / 5 !important;
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  align-self: stretch !important;
  height: 100% !important;
  max-height: none !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-scroll-area {
  display: grid !important;
  gap: 12px !important;
  min-height: 0 !important;
  height: auto !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 0 4px 116px 0 !important;
  scrollbar-gutter: stable !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-card,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-reference-url-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .extra-prompt-box {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-card {
  min-height: 0 !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .extra-prompt-box::before {
  content: none !important;
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .extra-prompt-box {
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px 10px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-head {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] #settings-card {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] #dynamic-settings {
  gap: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .extra-prompt-box > span {
  grid-column: 1 !important;
  min-height: auto !important;
  color: #30384d !important;
  font-size: 14px !important;
  font-weight: 560 !important;
  line-height: 1.25 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .extra-prompt-box textarea {
  grid-column: 1 / -1 !important;
  height: 280px !important;
  min-height: 280px !important;
  max-height: 280px !important;
  padding: 16px 17px 58px !important;
  border: 1px solid rgba(214, 210, 236, 0.96) !important;
  border-radius: 14px !important;
  color: #20263a !important;
  background: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 10px 22px rgba(105, 91, 164, 0.055) !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="video-generate"], [data-active-feature="free-generate"]) .extra-prompt-box.has-video-highlight textarea {
  color: transparent !important;
  caret-color: #20263a !important;
  -webkit-text-fill-color: transparent !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="video-generate"], [data-active-feature="free-generate"]) .extra-prompt-box.has-video-highlight textarea::placeholder {
  color: #8a91a3 !important;
  -webkit-text-fill-color: #8a91a3 !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="video-generate"], [data-active-feature="free-generate"]) .video-prompt-highlight {
  position: absolute;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
  white-space: pre-wrap;
  overflow-wrap: break-word;
  border: 1px solid transparent;
  color: #20263a;
  font-size: 14px;
  line-height: 1.65;
  box-sizing: border-box;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="video-generate"], [data-active-feature="free-generate"]) .video-prompt-highlight-token {
  display: inline;
  padding: 0;
  border-radius: 0;
  color: #5b4be8;
  background: transparent;
  box-shadow: none;
  font-size: inherit;
  font-weight: inherit;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .extra-prompt-box textarea:focus {
  border-color: rgba(109, 85, 238, 0.55) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08), 0 12px 24px rgba(105, 91, 164, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .extra-prompt-box .video-material-mention {
  position: absolute !important;
  right: 166px !important;
  bottom: 12px !important;
  z-index: 80 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention[hidden] {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-storyboard-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 66px !important;
  min-height: 30px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(109, 85, 238, 0.2) !important;
  border-radius: 999px !important;
  color: #5b4be8 !important;
  background: rgba(255, 255, 255, 0.94) !important;
  font-size: 11px !important;
  font-weight: 450 !important;
  line-height: 1 !important;
  box-shadow: 0 8px 16px rgba(91, 73, 230, 0.09) !important;
  cursor: pointer !important;
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-button:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-storyboard-button:hover {
  transform: translateY(-1px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-storyboard-button {
  min-width: 100px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-button:hover {
  border-color: rgba(91, 73, 230, 0.5) !important;
  color: #ffffff !important;
  background: #5b4be8 !important;
  box-shadow: 0 10px 20px rgba(91, 73, 230, 0.18) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-storyboard-button:hover {
  border-color: rgba(91, 73, 230, 0.5) !important;
  color: #ffffff !important;
  background: #5b4be8 !important;
  box-shadow: 0 10px 20px rgba(91, 73, 230, 0.18) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-button:disabled,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-storyboard-button:disabled {
  color: #a5a9b8 !important;
  border-color: rgba(196, 201, 216, 0.7) !important;
  background: rgba(248, 249, 252, 0.96) !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-button:disabled {
  color: #5b4be8 !important;
  border-color: rgba(109, 85, 238, 0.18) !important;
  background: rgba(255, 255, 255, 0.88) !important;
  box-shadow: 0 8px 16px rgba(91, 73, 230, 0.07) !important;
  opacity: 0.58 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-button {
  font-size: 11px !important;
  font-weight: 450 !important;
}

.video-script-entry-button {
  display: none;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-entry-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: stretch !important;
  position: relative !important;
  isolation: isolate !important;
  width: 100% !important;
  min-height: 50px !important;
  gap: 9px !important;
  margin-top: 0 !important;
  padding: 0 18px !important;
  overflow: hidden !important;
  border: 1px solid rgba(91, 75, 232, 0.34) !important;
  border-radius: 15px !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #6f5cf4 0%, #5949e8 52%, #4d3ed8 100%) !important;
  box-shadow: 0 12px 26px rgba(79, 62, 216, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
  font-size: 14px !important;
  font-weight: 780 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-entry-button::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  top: -42px !important;
  left: -24px !important;
  width: 132px !important;
  height: 96px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.13) !important;
  transform: rotate(-14deg) !important;
  pointer-events: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-entry-button .lucide {
  box-sizing: content-box !important;
  width: 17px !important;
  height: 17px !important;
  padding: 6px !important;
  border-radius: 9px !important;
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.15) !important;
  stroke-width: 2.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-entry-button:hover {
  border-color: rgba(80, 62, 222, 0.62) !important;
  background: linear-gradient(135deg, #7866f7 0%, #604fec 52%, #5141dc 100%) !important;
  box-shadow: 0 15px 30px rgba(79, 62, 216, 0.27), inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
  transform: translateY(-2px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-entry-button:active {
  box-shadow: 0 8px 18px rgba(79, 62, 216, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
  transform: translateY(0) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-entry-button:focus-visible {
  outline: 3px solid rgba(91, 75, 232, 0.2) !important;
  outline-offset: 2px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .prompt-optimize-button {
  position: absolute !important;
  right: 12px !important;
  bottom: 12px !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  min-height: 30px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(109, 85, 238, 0.24) !important;
  border-radius: 999px !important;
  color: #5b4be8 !important;
  background: rgba(255, 255, 255, 0.94) !important;
  box-shadow: 0 10px 20px rgba(91, 73, 230, 0.12) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .prompt-optimize-button .lucide {
  width: 13px !important;
  height: 13px !important;
  stroke-width: 2.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .prompt-optimize-button span {
  font-weight: 450 !important;
  -webkit-font-smoothing: antialiased !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .prompt-optimize-button:hover:not(:disabled) {
  border-color: rgba(91, 73, 230, 0.5) !important;
  color: #ffffff !important;
  background: #5b4be8 !important;
  box-shadow: 0 12px 24px rgba(91, 73, 230, 0.2) !important;
  transform: translateY(-1px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .prompt-optimize-button:disabled {
  color: #5b4be8 !important;
  border-color: rgba(109, 85, 238, 0.18) !important;
  background: rgba(255, 255, 255, 0.88) !important;
  box-shadow: 0 8px 16px rgba(91, 73, 230, 0.07) !important;
  opacity: 0.58 !important;
  cursor: not-allowed !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .prompt-optimize-button.is-busy {
  color: #ffffff !important;
  background: #5b4be8 !important;
  cursor: wait !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-menu {
  position: absolute !important;
  left: 0 !important;
  top: auto !important;
  bottom: calc(100% + 6px) !important;
  z-index: 90 !important;
  display: grid !important;
  gap: 4px !important;
  width: 136px !important;
  max-height: 186px !important;
  overflow-y: auto !important;
  padding: 7px !important;
  border: 1px solid rgba(221, 224, 238, 0.92) !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 14px 34px rgba(42, 48, 74, 0.16) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-menu[hidden] {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-menu button {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 32px !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 44px !important;
  padding: 6px 7px 6px 10px !important;
  border: 0 !important;
  border-radius: 9px !important;
  color: #20263a !important;
  background: transparent !important;
  text-align: left !important;
  cursor: pointer !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-menu button:hover {
  background: rgba(123, 97, 255, 0.09) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-menu strong {
  overflow: hidden !important;
  font-size: 13px !important;
  font-weight: 720 !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-thumb {
  display: grid !important;
  place-items: center !important;
  width: 32px !important;
  height: 32px !important;
  overflow: hidden !important;
  border-radius: 8px !important;
  background: #f3f5fb !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-thumb img,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-thumb video {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-thumb.is-audio {
  color: #7b61ff !important;
  background: rgba(123, 97, 255, 0.1) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-thumb.is-audio .lucide {
  width: 16px !important;
  height: 16px !important;
  stroke-width: 2.4 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-menu small,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-material-mention-empty {
  overflow: hidden !important;
  color: #8a91a3 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.video-storyboard-modal {
  align-items: center;
  justify-content: center;
  z-index: 10000;
  padding: 20px;
}

.video-storyboard-card {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(520px, calc(100vw - 40px));
  max-height: min(720px, calc(100vh - 40px));
  overflow: hidden;
  border: 1px solid rgba(226, 230, 242, 0.92);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 28px 80px rgba(33, 42, 74, 0.22);
}

.video-storyboard-head,
.video-storyboard-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px;
}

.video-storyboard-head {
  border-bottom: 1px solid #eef1f7;
}

.video-storyboard-head div {
  display: grid;
  gap: 3px;
}

.video-storyboard-head span {
  color: #8a91a3;
  font-size: 12px;
  font-weight: 600;
}

.video-storyboard-head strong {
  color: #202538;
  font-size: 18px;
  font-weight: 760;
}

.video-storyboard-body {
  display: grid;
  gap: 14px;
  min-height: 0;
  overflow-y: auto;
  padding: 16px 18px;
}

.video-storyboard-note {
  margin: 0;
  padding: 10px 12px;
  border-radius: 12px;
  color: #536078;
  background: #f7f8fc;
  font-size: 13px;
  line-height: 1.45;
}

.video-script-description,
.video-script-source-note {
  margin: 0;
  padding: 10px 12px;
  border-radius: 12px;
  font-size: 13px;
  line-height: 1.5;
}

.video-script-description {
  color: #536078;
  background: #f7f8fc;
}

.video-script-source-note {
  border: 1px solid transparent;
  color: #7c5a18;
  background: #fff8e8;
}

.video-script-source-note.is-ready {
  border-color: rgba(55, 153, 108, 0.18);
  color: #277653;
  background: #eefaf4;
}

.video-script-source-note.is-warning {
  border-color: rgba(206, 145, 38, 0.2);
}

.video-storyboard-type,
.video-storyboard-shot-block {
  display: grid;
  gap: 8px;
}

.video-storyboard-shot-block[hidden] {
  display: none !important;
}

.video-storyboard-type div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.video-storyboard-type button {
  min-height: 38px;
  border: 1px solid #e2e6f2;
  border-radius: 10px;
  color: #536078;
  background: #fff;
  font-size: 13px;
  font-weight: 760;
  cursor: pointer;
}

.video-storyboard-type button.selected {
  border-color: rgba(123, 97, 255, 0.42);
  color: #fff;
  background: #7b61ff;
  box-shadow: 0 8px 18px rgba(123, 97, 255, 0.16);
}

.video-storyboard-shot-options {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
}

.video-storyboard-shot-options button {
  min-height: 36px;
  border: 1px solid #e2e6f2;
  border-radius: 10px;
  color: #536078;
  background: #fff;
  font-size: 13px;
  font-weight: 760;
  cursor: pointer;
}

.video-storyboard-shot-options button.selected {
  border-color: rgba(123, 97, 255, 0.42);
  color: #fff;
  background: #7b61ff;
  box-shadow: 0 8px 18px rgba(123, 97, 255, 0.16);
}

.video-storyboard-control {
  display: grid;
  gap: 7px;
}

.video-storyboard-type > span,
.video-storyboard-shot-block > span,
.video-storyboard-motion > span,
.video-storyboard-materials-head span,
.video-storyboard-image-count span,
.video-storyboard-control span {
  color: #2f3548;
  font-size: 13px;
  font-weight: 720;
}

.video-storyboard-image-count select,
.video-storyboard-material-row input,
.video-storyboard-control textarea {
  width: 100%;
  border: 1px solid #e2e6f2;
  border-radius: 10px;
  color: #202538;
  background: #fbfcff;
  font: inherit;
  font-size: 13px;
  outline: 0;
}

.video-storyboard-image-count select,
.video-storyboard-material-row input {
  height: 38px;
  padding: 0 10px;
}

.video-storyboard-control textarea {
  min-height: 76px;
  resize: vertical;
  padding: 10px;
  line-height: 1.5;
}

.video-storyboard-motion {
  display: grid;
  gap: 8px;
}

.video-storyboard-motion div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.video-storyboard-motion button {
  min-height: 38px;
  border: 1px solid #e2e6f2;
  border-radius: 10px;
  color: #536078;
  background: #fff;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.video-storyboard-motion button.selected {
  border-color: rgba(123, 97, 255, 0.42);
  color: #fff;
  background: #7b61ff;
}

.video-storyboard-materials {
  display: grid;
  gap: 9px;
}

.video-storyboard-materials-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.video-storyboard-materials-head small {
  color: #b4bac8;
  font-size: 11px;
  font-weight: 500;
}

.video-storyboard-material-row input::placeholder,
.video-storyboard-control textarea::placeholder {
  color: #b9bfcc;
}

.video-storyboard-material-row {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}

.video-storyboard-material-row > span {
  color: #596174;
  font-size: 13px;
  font-weight: 700;
}

.video-storyboard-foot {
  border-top: 1px solid #eef1f7;
  justify-content: flex-end;
}

.video-storyboard-foot .outline-button {
  margin-right: auto;
}

.video-storyboard-image-count {
  display: grid;
  grid-template-columns: auto 86px;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.video-storyboard-foot .primary-button {
  min-height: 40px;
  padding: 0 16px;
  border: 0;
  border-radius: 12px;
  color: #fff;
  background: #7b61ff;
  font-size: 14px;
  font-weight: 760;
  cursor: pointer;
  box-shadow: 0 10px 22px rgba(123, 97, 255, 0.22);
}

.video-storyboard-foot .primary-button:hover {
  background: #6b52ef;
}

.video-script-dialog .video-storyboard-foot .primary-button:disabled {
  color: rgba(255, 255, 255, 0.78);
  background: #b7bbc8;
  box-shadow: none;
  cursor: not-allowed;
}

@media (max-width: 640px) {
  .video-script-modal {
    align-items: flex-end;
    padding: 12px;
  }

  .video-script-dialog {
    width: 100%;
    max-height: min(82vh, 680px);
    border-radius: 18px;
  }

  .video-script-dialog .video-storyboard-head,
  .video-script-dialog .video-storyboard-body,
  .video-script-dialog .video-storyboard-foot {
    padding-right: 14px;
    padding-left: 14px;
  }
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-bottom-area {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
  align-self: end !important;
  min-height: 0 !important;
  padding-top: 10px !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .generate-action-row {
  display: grid !important;
  grid-column: 1 / -1 !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-bottom-options {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .create-button.full {
  grid-column: 1 !important;
  grid-row: 2 !important;
  min-height: 56px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .preview-column {
  grid-row: 1 / 5 !important;
  display: grid !important;
  min-height: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .preview-card {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) !important;
  gap: 0 !important;
  position: relative !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] #preview-badge {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .preview-card::after {
  content: none !important;
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .detail-page-latest-panel {
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .generate-count-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .inline-model-section,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .detail-page-resolution-panel {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .settings-bottom-area {
  position: relative !important;
  z-index: 12 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
  margin-top: -112px !important;
  padding-top: 0 !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.98) 18%, rgba(255, 255, 255, 0.98)) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .generate-action-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  gap: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .video-bottom-options {
  display: grid !important;
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  width: 100% !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .create-button.full {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  width: 100% !important;
}

.video-latest-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 2fr) minmax(0, 1fr);
  gap: 10px;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.video-latest-panel.is-video-only,
.video-latest-showcase-panel {
  grid-template-rows: auto minmax(0, 1fr);
}

.video-latest-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 34px;
  padding: 8px 12px 2px;
}

.video-latest-toolbar span {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  color: #252b3c;
  font-size: 15px;
  font-weight: 560;
}

.video-latest-toolbar small {
  color: #8a91a3;
  font-size: 12px;
  font-weight: 500;
}

.video-latest-toolbar > div {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.video-latest-toolbar button,
.video-latest-more-button {
  min-height: 32px;
  padding: 0 14px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  color: #475569;
  background: #ffffff;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  box-shadow: none;
}

.video-latest-toolbar button[data-video-show-more] {
  color: #334155;
  border-color: #cbd5e1;
  background: #f8fafc;
}

.video-latest-toolbar button[data-video-all-clear] {
  color: #64748b;
  border-color: #e2e8f0;
  background: #ffffff;
}

.video-latest-toolbar button:hover {
  color: #111827;
  border-color: #94a3b8;
  background: #f8fafc;
  box-shadow: none;
}

.video-latest-toolbar button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
  box-shadow: none;
}

.video-latest-record-area {
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  padding-top: 2px;
}

.video-latest-list {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 0;
  align-content: stretch;
  gap: 8px;
  height: 100%;
  max-height: 100%;
  min-height: 0;
  overflow: hidden;
  padding: 0;
}

.video-latest-more-button {
  justify-self: center;
  align-self: center;
  min-width: 72px;
  color: #5572d8;
  background: rgba(85, 114, 216, 0.1);
}

.video-latest-more-button:hover {
  color: #fff;
  background: #5572d8;
}

.video-latest-reserved-area {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.video-storyboard-strip {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 8px;
  height: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.video-storyboard-strip.is-empty {
  place-items: center;
  border: 1px dashed rgba(190, 196, 214, 0.82);
  border-radius: 12px;
  color: #9aa1b4;
  background: rgba(248, 249, 252, 0.72);
  font-size: 12px;
  font-weight: 600;
}

.video-storyboard-strip .video-record-card {
  grid-template-rows: minmax(0, 1fr) 24px;
  gap: 5px;
  min-height: 0;
}

.video-storyboard-strip .video-record-meta {
  display: none;
}

.video-storyboard-strip .video-latest-media {
  aspect-ratio: 3 / 4;
  min-height: 0;
}

.video-storyboard-strip .video-record-card.is-selected-storyboard .video-latest-media {
  box-shadow: none;
}

.video-storyboard-strip .video-record-card.is-selected-storyboard .video-latest-media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  border: 2px solid rgba(123, 97, 255, 0.82);
  border-radius: inherit;
}

.video-storyboard-strip .video-script-strip-card {
  position: relative;
  display: block;
  grid-column: span 2;
  min-width: 0;
  min-height: 0;
  padding: 7px;
  overflow: hidden;
  border: 1px solid rgba(222, 226, 239, 0.96);
  border-radius: 8px;
  background: #ffffff;
}

.video-storyboard-strip .video-script-strip-list {
  display: grid;
  grid-template-rows: repeat(3, minmax(0, 1fr));
  gap: 5px;
  height: 100%;
  min-height: 0;
}

.video-storyboard-strip .video-script-strip-item {
  position: relative;
  display: block;
  min-width: 0;
  min-height: 0;
  padding: 10px 10px 42px;
  overflow: hidden;
  border: 1px solid rgba(229, 232, 242, 0.92);
  border-radius: 7px;
  background: #fbfcfe;
}

.video-storyboard-strip .video-script-strip-item.is-selected {
  border-color: rgba(91, 75, 232, 0.5);
  background: rgba(247, 245, 255, 0.96);
}

.video-storyboard-strip .video-script-strip-copy {
  display: grid;
  align-content: start;
  justify-items: start;
  gap: 4px;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.video-storyboard-strip .video-script-strip-copy strong {
  color: #30364a;
  font-size: 14px;
  font-weight: 760;
}

.video-storyboard-strip .video-script-strip-copy p {
  display: block;
  margin: 0;
  color: #737b90;
  font-size: 12.5px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.video-storyboard-strip .video-script-strip-actions {
  position: absolute;
  right: 9px;
  bottom: 9px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.video-storyboard-strip .video-script-strip-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 0 6px;
  border: 1px solid rgba(91, 75, 232, 0.22);
  border-radius: 8px;
  color: #5548d9;
  background: rgba(91, 75, 232, 0.08);
  font-size: 11px;
  font-weight: 760;
  cursor: pointer;
}

.video-storyboard-strip .video-script-use-button {
  min-width: 50px;
}

.video-storyboard-strip .video-script-card-delete {
  position: absolute;
  z-index: 2;
  top: 10px;
  right: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  padding: 0;
  color: #a2a8b7;
  border: 1px solid rgba(222, 226, 239, 0.82);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.94);
  cursor: pointer;
  transition: color 160ms ease, background-color 160ms ease;
}

.video-storyboard-strip .video-script-card-delete svg {
  width: 13px;
  height: 13px;
  stroke-width: 1.8;
}

.video-storyboard-strip .video-script-use-button:hover {
  border-color: rgba(91, 75, 232, 0.46);
  background: rgba(91, 75, 232, 0.14);
}

.video-storyboard-strip .video-script-card-delete:hover {
  color: #c24b62;
  background: rgba(194, 75, 98, 0.08);
}

.video-storyboard-strip .video-script-strip-item.is-selected .video-script-use-button {
  color: #ffffff;
  border-color: #5b4be8;
  background: #5b4be8;
}

.video-storyboard-strip .video-script-strip-loading {
  display: flex;
  grid-row: 1 / -1;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 100%;
  color: #8c94a8;
  font-size: 11px;
  text-align: center;
}

.video-storyboard-strip .video-script-strip-loading .lucide {
  width: 16px;
  height: 16px;
  color: #6b57ee;
  animation: spin 0.9s linear infinite;
}

.video-storyboard-use-button {
  width: 100%;
  min-width: 0;
  min-height: 24px;
  padding: 0 6px;
  border: 0;
  border-radius: 8px;
  color: #5b4ee6;
  background: rgba(123, 97, 255, 0.1);
  font-size: 11px;
  font-weight: 760;
  cursor: pointer;
}

.video-storyboard-use-button:hover,
.video-storyboard-use-button.is-selected {
  color: #fff;
  background: #7b61ff;
}

.video-record-card {
  position: relative;
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  padding: 6px;
  border: 1px solid rgba(226, 230, 242, 0.72);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.62);
  box-shadow: 0 8px 18px rgba(38, 45, 74, 0.04);
}

.video-record-delete {
  position: absolute;
  right: 6px;
  top: 6px;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #ff7f90;
  background: rgba(255, 245, 247, 0.94);
  box-shadow: 0 6px 16px rgba(120, 50, 65, 0.1);
  cursor: pointer;
}

.video-record-delete:hover {
  color: #fff;
  background: #ff7f90;
}

.video-record-delete .lucide {
  width: 12px;
  height: 12px;
}

.video-record-open {
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  gap: 0;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.video-record-meta {
  display: none;
  overflow: hidden;
  color: #6f778b;
  background: transparent;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.video-latest-media {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  border-radius: 6px;
  background: #f5f7fb;
}

.video-latest-media img,
.video-latest-media video,
.video-latest-media .work-image-empty {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  border: 0;
  background: transparent;
}

.video-latest-media em {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  color: #fff;
  background: rgba(27, 32, 49, 0.68);
  transform: translate(-50%, -50%);
  box-shadow: 0 10px 28px rgba(27, 32, 49, 0.24);
}

.video-latest-media em .lucide {
  width: 17px;
  height: 17px;
  margin-left: 2px;
}

.video-latest-empty {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  min-height: 220px;
  color: #8b92a5;
  background: transparent;
}

.video-latest-empty strong {
  color: #4b5368;
  font-size: 18px;
  font-weight: 560;
}

.video-status-card {
  display: grid;
  grid-template-rows: auto auto auto;
  align-content: center;
  justify-items: center;
  gap: 12px;
  width: 100%;
  height: 100%;
  min-width: 0;
  padding: 18px 12px;
  border-radius: 10px;
  text-align: center;
  background: linear-gradient(180deg, rgba(248, 250, 255, 0.98), rgba(241, 244, 250, 0.92));
}

.video-status-card.is-failed {
  background: linear-gradient(180deg, rgba(255, 248, 249, 0.98), rgba(255, 242, 245, 0.9));
}

.video-status-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  color: #6c5df6;
  background: rgba(108, 93, 246, 0.12);
}

.video-status-card.is-failed .video-status-icon {
  color: #e45b73;
  background: rgba(228, 91, 115, 0.12);
}

.video-status-icon .lucide {
  width: 20px;
  height: 20px;
}

.video-status-card.is-running .video-status-icon .lucide {
  animation: detail-preview-spin 1.1s linear infinite;
}

.video-status-copy {
  display: grid;
  justify-items: center;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
}

.video-status-copy strong {
  color: #202538;
  font-size: 16px;
  font-weight: 680;
  line-height: 1.2;
}

.video-status-copy small {
  display: -webkit-box;
  max-width: 100%;
  overflow: hidden;
  color: #6f778b;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

.video-status-card.is-failed .video-status-copy small {
  color: #9f5261;
}

.video-status-meta {
  display: grid;
  justify-items: center;
  gap: 6px;
  max-width: 100%;
}

.video-status-meta span {
  display: block;
  max-width: 100%;
  overflow: hidden;
  color: #8a91a3;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.video-status-meta strong {
  min-height: 22px;
  padding: 0 10px;
  border-radius: 999px;
  color: #fff;
  background: #8a7cff;
  font-size: 11px;
  font-weight: 620;
  line-height: 22px;
}

.video-status-progress {
  display: grid;
  grid-template-columns: minmax(80px, 128px) 38px;
  align-items: center;
  gap: 8px;
  max-width: 100%;
}

.video-status-progress span {
  position: relative;
  display: block;
  width: 100%;
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(138, 124, 255, 0.14);
}

.video-status-progress span i {
  display: block;
  height: 100%;
  min-width: 8px;
  border-radius: inherit;
  background: linear-gradient(90deg, #8a7cff, #3bc4e8);
  box-shadow: 0 0 12px rgba(138, 124, 255, 0.34);
  transition: width 0.35s ease;
}

.video-status-progress strong {
  min-height: 22px;
  padding: 0;
  color: #695ce8;
  background: transparent;
  font-size: 12px;
  font-weight: 760;
  line-height: 22px;
  text-align: left;
}

.video-status-card.is-failed .video-status-meta strong {
  background: #e45b73;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .task-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .task-body,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-column,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-card-wrap,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] #product-upload,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options {
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-column {
  position: relative !important;
  z-index: 3000 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-primary-row,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-card-wrap,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] #product-upload {
  position: relative !important;
  z-index: 1 !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .preview-column,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .preview-card {
  z-index: 1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options .video-compact-menu {
  z-index: 3200 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options .video-compact-select[open] {
  z-index: 3300 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options:has(.video-compact-select[open]),
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-column:has(.video-upload-options .video-compact-select[open]),
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .upload-card-wrap:has(.video-upload-options .video-compact-select[open]) {
  position: relative !important;
  z-index: 9000 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options .video-compact-select {
  position: relative !important;
  z-index: 1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options .video-compact-select[open] {
  z-index: 9200 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options .video-compact-menu {
  top: calc(100% + 8px) !important;
  bottom: auto !important;
  z-index: 9300 !important;
  max-height: 240px !important;
  overflow-y: auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options .video-compact-menu-grid {
  left: 0 !important;
  width: max(100%, 188px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .image-viewer {
  z-index: 20000 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] #clear-upload {
  display: none !important;
}

.buyer-tryon-settings {
  display: grid;
  gap: 14px;
}

.buyer-tryon-shop-field {
  display: grid;
  gap: 9px;
  color: #4f46c8;
  font-size: 13px;
  font-weight: 600;
}

.buyer-tryon-shop-summary {
  min-height: 46px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(108, 93, 246, 0.2);
  border-radius: 13px;
  padding: 6px 8px 6px 13px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 8px 18px rgba(88, 76, 180, 0.06);
}

.buyer-tryon-shop-summary strong {
  min-width: 0;
  overflow: hidden;
  color: #25283a;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.buyer-tryon-shop-summary strong.is-empty {
  color: rgba(63, 69, 92, 0.48);
  font-weight: 560;
}

.buyer-tryon-shop-summary button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 34px;
  border: 1px solid rgba(108, 93, 246, 0.24);
  border-radius: 11px;
  padding: 0 11px;
  color: #5b50d9;
  background: rgba(108, 93, 246, 0.08);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.buyer-tryon-shop-summary button:hover,
.buyer-tryon-shop-summary button:focus-visible {
  border-color: rgba(108, 93, 246, 0.48);
  background: rgba(108, 93, 246, 0.12);
  outline: none;
}

.buyer-tryon-shop-summary button .lucide {
  width: 14px;
  height: 14px;
}

.buyer-tryon-shop-name-dialog-field {
  display: grid;
  gap: 8px;
  margin-top: 6px;
  color: #4f46c8;
  font-size: 13px;
  font-weight: 650;
  text-align: left;
}

.buyer-tryon-shop-name-dialog-field input {
  width: 100%;
  height: 42px;
  border: 1px solid rgba(108, 93, 246, 0.2);
  border-radius: 13px;
  padding: 0 13px;
  color: #25283a;
  background: rgba(255, 255, 255, 0.96);
  font-size: 13px;
  font-weight: 560;
  outline: none;
  box-shadow: 0 8px 18px rgba(88, 76, 180, 0.06);
}

.buyer-tryon-shop-name-dialog-field input:focus {
  border-color: rgba(108, 93, 246, 0.5);
  box-shadow: 0 0 0 3px rgba(108, 93, 246, 0.12);
}

.buyer-tryon-product-type-row {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(108, 93, 246, 0.22);
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff 0%, #f8f7ff 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.94), 0 12px 26px rgba(88, 76, 180, 0.08);
}

.buyer-tryon-product-type-row > span {
  color: #4f46c8;
  font-size: 13px;
  font-weight: 600;
}

.buyer-tryon-product-type-options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
  gap: 8px;
  min-width: 0;
}

.buyer-tryon-product-type-options button {
  min-width: 0;
  min-height: 40px;
  border: 1px solid rgba(199, 205, 230, 0.95);
  border-radius: 999px;
  padding: 0 12px;
  color: #30384d;
  background: rgba(255, 255, 255, 0.98);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 3px 10px rgba(34, 42, 70, 0.04);
  transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.buyer-tryon-product-type-options button:hover,
.buyer-tryon-product-type-options button:focus-visible {
  border-color: rgba(123, 97, 255, 0.42);
  outline: none;
}

.buyer-tryon-product-type-options button.selected {
  color: #fff;
  border-color: #6c5df6;
  background: linear-gradient(135deg, #6c5df6, #7b8cff);
  box-shadow: 0 8px 18px rgba(108, 93, 246, 0.2);
}

.buyer-tryon-max-field {
  display: grid;
  gap: 9px;
}

.buyer-tryon-max-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.buyer-tryon-max-option {
  position: relative;
  min-width: 0;
  height: 42px;
  border: 1px solid rgba(112, 93, 190, 0.18);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.9);
  color: rgba(36, 31, 63, 0.78);
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.buyer-tryon-max-option:hover {
  border-color: rgba(112, 93, 190, 0.34);
  background: rgba(255, 255, 255, 0.98);
  color: #241f3f;
}

.buyer-tryon-max-option.is-selected {
  border-color: rgba(112, 93, 190, 0.62);
  background: linear-gradient(135deg, rgba(112, 93, 190, 0.16), rgba(62, 124, 120, 0.13));
  color: #241f3f;
  box-shadow: 0 8px 18px rgba(112, 93, 190, 0.14);
}

.buyer-tryon-max-option:active {
  transform: translateY(1px);
}

.buyer-tryon-fixed-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  min-height: 42px;
  padding: 10px 11px;
  border: 1px solid rgba(62, 124, 120, 0.18);
  border-radius: 12px;
  background: rgba(62, 124, 120, 0.08);
  font-size: 13px;
  line-height: 1.45;
  color: rgba(39, 33, 68, 0.76);
}

.buyer-tryon-fixed-note .lucide {
  width: 17px;
  height: 17px;
  color: #3e7c78;
}

.buyer-tryon-links {
  display: grid;
  gap: 10px;
  padding-top: 4px;
}

.buyer-tryon-links-head,
.buyer-tryon-link-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.buyer-tryon-links-head button,
.buyer-tryon-link-actions button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid rgba(102, 87, 255, 0.18);
  border-radius: 10px;
  padding: 8px 10px;
  background: rgba(255, 255, 255, 0.82);
  color: #352e68;
  font-size: 12px;
}

.buyer-tryon-empty,
.buyer-tryon-link-card {
  border: 1px solid rgba(102, 87, 255, 0.14);
  border-radius: 14px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.74);
}

.buyer-tryon-link-card {
  display: grid;
  gap: 10px;
}

.buyer-tryon-link-main {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.buyer-tryon-link-main img {
  width: 56px;
  height: 72px;
  object-fit: cover;
  border-radius: 10px;
  background: #f5f2ff;
}

.buyer-tryon-link-main strong,
.buyer-tryon-link-main span,
.buyer-tryon-link-main small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.buyer-tryon-link-main strong {
  color: #241f3f;
}

.buyer-tryon-link-main span,
.buyer-tryon-link-main small,
.buyer-tryon-empty {
  color: rgba(39, 33, 68, 0.62);
  font-size: 12px;
}

.buyer-tryon-record-list {
  display: flex;
  gap: 8px;
  overflow-x: auto;
}

.buyer-tryon-record-list span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  max-width: 160px;
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(102, 87, 255, 0.08);
  color: rgba(39, 33, 68, 0.72);
  font-size: 12px;
}

.buyer-tryon-record-list img {
  width: 24px;
  height: 24px;
  border-radius: 999px;
  object-fit: cover;
}

body[data-active-feature="buyer-try-on"] .generate-count-box,
body[data-active-feature="buyer-try-on"] .inline-model-section,
body[data-active-feature="buyer-try-on"] .generation-resolution-section,
body[data-active-feature="buyer-try-on"] .detail-page-resolution-panel {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .task-recent-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .detail-page-latest-panel {
  display: none !important;
}

.buyer-tryon-room-panel {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 12px;
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: left;
}

.buyer-tryon-room-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 34px;
  min-width: 0;
  padding: 8px 12px 2px;
}

.buyer-tryon-room-title {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  min-width: 0;
}

.buyer-tryon-room-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex: 0 0 auto;
}

.buyer-tryon-room-head strong {
  color: #252b3d;
  font-size: 15px;
  font-weight: 560;
  line-height: 1.25;
  white-space: nowrap;
}

.buyer-tryon-room-head small {
  overflow: hidden;
  color: #8a91a3;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.buyer-tryon-room-head button,
.buyer-tryon-room-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 32px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 0 14px;
  color: #475569;
  background: #ffffff;
  box-shadow: none;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
}

.buyer-tryon-room-head button[data-buyer-tryon-view-all] {
  color: #334155;
  border-color: #cbd5e1;
  background: #f8fafc;
}

.buyer-tryon-room-head button[data-buyer-tryon-clear-records] {
  color: #64748b;
  border-color: #e2e8f0;
  background: #ffffff;
}

.buyer-tryon-room-head button:hover {
  color: #111827;
  border-color: #94a3b8;
  background: #f8fafc;
}

.buyer-tryon-room-head button:disabled {
  cursor: default;
  opacity: 0.45;
}

.buyer-tryon-room-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-template-rows: auto;
  align-content: start;
  align-items: start;
  justify-content: start;
  gap: 10px;
  min-height: 0;
}

.buyer-tryon-room-empty {
  grid-column: 1 / -1;
  min-height: 220px;
  border: 1px dashed rgba(153, 161, 183, 0.32);
  border-radius: 14px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  padding: 18px;
  color: rgba(48, 56, 77, 0.58);
  background: rgba(248, 249, 252, 0.72);
  text-align: center;
  font-size: 13px;
  line-height: 1.5;
}

.buyer-tryon-room-empty .lucide {
  width: 26px;
  height: 26px;
  color: rgba(108, 99, 216, 0.42);
}

.buyer-tryon-room-tile {
  position: relative;
  display: block;
  min-width: 0;
  max-width: none;
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(224, 225, 239, 0.95);
  border-radius: 10px;
  padding: 0;
  color: #fff;
  background: #f4f5fb;
  box-shadow: none;
}

@media (max-width: 1880px) {
  .buyer-tryon-room-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 1560px) {
  .buyer-tryon-room-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  .buyer-tryon-room-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .buyer-tryon-room-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .buyer-tryon-room-grid {
    grid-template-columns: 1fr;
  }
}

.buyer-tryon-room-tile:not(.is-empty) {
  cursor: pointer;
}

.buyer-tryon-room-tile.is-link,
.buyer-tryon-room-tile.is-record {
  display: grid;
  grid-template-rows: auto 38px;
  gap: 6px;
  padding: 4px;
  color: #252b3d;
  background: #fff;
  cursor: default;
}

.buyer-tryon-room-thumb {
  position: relative;
  display: block;
  aspect-ratio: 3 / 4;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border-radius: 8px;
  background: #f4f5fb;
}

.buyer-tryon-room-delete {
  position: absolute;
  top: 5px;
  right: 5px;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border: 1px solid rgba(255, 255, 255, 0.78);
  border-radius: 999px;
  padding: 0;
  color: #fff;
  background: rgba(24, 28, 42, 0.68);
  box-shadow: 0 6px 14px rgba(30, 33, 48, 0.2);
  cursor: pointer;
}

.buyer-tryon-room-delete .lucide {
  width: 14px;
  height: 14px;
}

.buyer-tryon-room-copy {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-width: 0;
  min-height: 38px;
  border: 1px solid rgba(102, 87, 255, 0.18);
  border-radius: 8px;
  padding: 0 3px;
  color: #443b78;
  background: #f8f7ff;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
  overflow: hidden;
  transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.buyer-tryon-room-copy.is-link-ready {
  border-color: rgba(69, 134, 211, 0.26);
  color: #245894;
  background: linear-gradient(135deg, rgba(69, 134, 211, 0.12), rgba(255, 255, 255, 0.95));
}

.buyer-tryon-room-copy.is-link-ready:hover {
  border-color: rgba(69, 134, 211, 0.42);
  background: linear-gradient(135deg, rgba(69, 134, 211, 0.18), rgba(255, 255, 255, 0.98));
  box-shadow: 0 6px 14px rgba(69, 134, 211, 0.14);
}

.buyer-tryon-room-copy.is-status,
.buyer-tryon-room-copy:disabled {
  color: rgba(51, 46, 83, 0.72);
  background: #f7f7fb;
  cursor: default;
  opacity: 1;
}

.buyer-tryon-room-copy.is-running-status,
.buyer-tryon-room-copy.is-queued-status {
  border-color: rgba(222, 151, 55, 0.32);
  color: #8a5a13;
  background: linear-gradient(120deg, rgba(255, 242, 209, 0.98), rgba(255, 250, 238, 0.98), rgba(255, 228, 166, 0.9));
  background-size: 220% 100%;
  animation: buyerTryonStatusFlow 1.4s ease-in-out infinite;
}

.buyer-tryon-room-copy.is-running-status::before,
.buyer-tryon-room-copy.is-queued-status::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.58), transparent);
  transform: translateX(-120%);
  animation: buyerTryonStatusSweep 1.25s ease-in-out infinite;
}

.buyer-tryon-room-copy.is-completed-status {
  border-color: rgba(62, 124, 120, 0.32);
  color: #2e6d68;
  background: linear-gradient(135deg, rgba(62, 124, 120, 0.14), rgba(244, 252, 250, 0.96));
}

.buyer-tryon-room-copy.is-failed-status {
  border-color: rgba(202, 77, 96, 0.28);
  color: #9e3045;
  background: linear-gradient(135deg, rgba(202, 77, 96, 0.12), rgba(255, 247, 249, 0.96));
}

.buyer-tryon-room-copy .lucide {
  display: none;
  width: 12px;
  height: 12px;
  flex: 0 0 auto;
}

.buyer-tryon-room-copy span {
  position: relative;
  z-index: 1;
  display: block;
  overflow: hidden;
  max-width: 100%;
  font-size: inherit;
  font-weight: 500;
  text-align: center;
  text-overflow: clip;
  white-space: nowrap;
}

@keyframes buyerTryonStatusFlow {
  0%,
  100% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
}

@keyframes buyerTryonStatusSweep {
  0% {
    transform: translateX(-120%);
  }
  58%,
  100% {
    transform: translateX(120%);
  }
}


.buyer-tryon-room-tile:disabled {
  cursor: default;
}

.buyer-tryon-room-tile.is-empty {
  aspect-ratio: 3 / 4;
  display: grid;
  place-items: center;
  border-style: dashed;
  color: rgba(100, 105, 124, 0.28);
}

.buyer-tryon-room-tile.is-empty em {
  font-style: normal;
  font-size: 12px;
}

.buyer-tryon-room-tile img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
}

.buyer-tryon-room-progress {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  max-width: calc(100% - 10px);
  min-height: 30px;
  border-radius: 999px;
  padding: 0 8px;
  color: #fff;
  background: rgba(21, 26, 39, 0.72);
  transform: translate(-50%, -50%);
}

.buyer-tryon-room-progress .lucide {
  width: 14px;
  height: 14px;
  color: #bbf0e6;
  animation: taskRecentSpin 0.9s linear infinite;
}

.buyer-tryon-room-progress strong {
  overflow: hidden;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.buyer-tryon-room-thumb > em,
.buyer-tryon-room-tile.is-record > em,
.buyer-tryon-room-tile > b {
  position: absolute;
  z-index: 2;
  left: 6px;
  top: 6px;
  max-width: calc(100% - 12px);
  overflow: hidden;
  border-radius: 999px;
  padding: 3px 7px;
  color: #fff;
  background: rgba(21, 26, 39, 0.72);
  font-size: 10px;
  font-style: normal;
  font-weight: 525;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.buyer-tryon-room-tile > b {
  top: auto;
  bottom: 6px;
  display: none;
}

.buyer-tryon-room-more {
  justify-self: center;
}

.buyer-tryon-room-mosaic {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  gap: 2px;
  overflow: hidden;
  border-radius: inherit;
  background: #e8ebf3;
  cursor: pointer;
}

.buyer-tryon-room-mosaic.has-1 {
  grid-template-columns: 1fr;
}

.buyer-tryon-room-mosaic.has-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.buyer-tryon-room-mosaic.has-3 {
  grid-template-columns: 1.25fr 0.75fr;
  grid-template-rows: repeat(2, minmax(0, 1fr));
}

.buyer-tryon-room-mosaic.has-3 .buyer-tryon-room-mosaic-item:first-child {
  grid-row: 1 / 3;
}

.buyer-tryon-room-mosaic.has-4 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
}

.buyer-tryon-room-mosaic-item {
  position: relative;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  background: #f1f3f8;
}

.buyer-tryon-room-mosaic-item b {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #fff;
  background: rgba(16, 20, 32, 0.58);
  font-size: 20px;
  font-weight: 700;
}

.buyer-tryon-room-badges {
  position: absolute;
  top: 6px;
  left: 6px;
  z-index: 3;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  max-width: calc(100% - 40px);
}

.buyer-tryon-room-badges em {
  border-radius: 999px;
  padding: 3px 7px;
  color: #fff;
  background: rgba(21, 26, 39, 0.74);
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}

.buyer-tryon-room-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 38px;
  gap: 6px;
  min-width: 0;
}

.buyer-tryon-room-footer .buyer-tryon-room-copy {
  width: 100%;
  cursor: pointer;
}

.buyer-tryon-room-copy.is-ready-status {
  border-color: rgba(69, 134, 211, 0.26);
  color: #245894;
  background: linear-gradient(135deg, rgba(69, 134, 211, 0.12), rgba(255, 255, 255, 0.95));
  cursor: pointer;
}

.buyer-tryon-room-copy-link {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(69, 134, 211, 0.24);
  border-radius: 8px;
  padding: 0;
  color: #245894;
  background: #f3f8ff;
  cursor: pointer;
}

.buyer-tryon-room-copy-link:hover {
  border-color: rgba(69, 134, 211, 0.46);
  background: #e8f2ff;
}

.buyer-tryon-room-copy-link .lucide {
  width: 15px;
  height: 15px;
}

body.buyer-tryon-detail-open {
  overflow: hidden;
}

.buyer-tryon-detail-modal {
  position: fixed;
  inset: 0;
  z-index: 180;
  display: grid;
  place-items: center;
  padding: 24px;
}

.buyer-tryon-detail-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background: rgba(20, 24, 36, 0.52);
  backdrop-filter: blur(8px);
}

.buyer-tryon-detail-dialog {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(920px, calc(100vw - 40px));
  max-height: min(820px, calc(100dvh - 40px));
  overflow: hidden;
  border: 1px solid #dfe4ed;
  border-radius: 8px;
  color: #20283a;
  background: #fff;
  box-shadow: 0 28px 80px rgba(20, 24, 36, 0.24);
}

.buyer-tryon-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 24px 18px;
  border-bottom: 1px solid #e7eaf0;
}

.buyer-tryon-detail-head > div > span {
  color: #2563eb;
  font-size: 11px;
  font-weight: 750;
}

.buyer-tryon-detail-head h2 {
  margin: 4px 0 0;
  font-size: 22px;
  line-height: 1.3;
}

.buyer-tryon-detail-head p {
  margin: 5px 0 0;
  color: #697386;
  font-size: 13px;
}

.buyer-tryon-detail-head > button {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid #dfe4ed;
  border-radius: 50%;
  padding: 0;
  color: #64748b;
  background: #f8fafc;
  cursor: pointer;
}

.buyer-tryon-detail-head > button .lucide {
  width: 17px;
  height: 17px;
}

.buyer-tryon-detail-body {
  display: grid;
  gap: 20px;
  min-height: 0;
  overflow-y: auto;
  padding: 20px 24px 24px;
}

.buyer-tryon-detail-section {
  display: grid;
  gap: 12px;
}

.buyer-tryon-detail-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
}

.buyer-tryon-detail-section-head strong {
  font-size: 15px;
}

.buyer-tryon-detail-section-head span {
  color: #7a8497;
  font-size: 12px;
}

.buyer-tryon-detail-garments {
  display: grid;
  grid-auto-columns: 116px;
  grid-auto-flow: column;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 4px;
}

.buyer-tryon-detail-garments button {
  display: grid;
  grid-template-rows: 140px auto;
  gap: 7px;
  min-width: 0;
  border: 0;
  padding: 0;
  color: #344054;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.buyer-tryon-detail-garments img {
  width: 116px;
  height: 140px;
  border: 1px solid #e1e6ef;
  border-radius: 6px;
  object-fit: cover;
  background: #f3f5f8;
}

.buyer-tryon-detail-garments span {
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.buyer-tryon-detail-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid #e2e7ef;
  border-radius: 7px;
  overflow: hidden;
}

.buyer-tryon-detail-stats > span {
  display: grid;
  gap: 4px;
  min-height: 78px;
  padding: 15px 18px;
  border-right: 1px solid #e2e7ef;
}

.buyer-tryon-detail-stats > span:last-child {
  border-right: 0;
}

.buyer-tryon-detail-stats small {
  color: #7b8495;
  font-size: 12px;
}

.buyer-tryon-detail-stats strong {
  font-size: 22px;
}

.buyer-tryon-detail-stats .is-working strong {
  color: #c47a10;
}

.buyer-tryon-detail-guests {
  display: grid;
  gap: 10px;
}

.buyer-tryon-detail-guest {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid #e2e7ef;
  border-radius: 7px;
  background: #fbfcfe;
}

.buyer-tryon-detail-guest.is-working {
  border-color: rgba(217, 145, 40, 0.38);
  background: #fffaf0;
}

.buyer-tryon-detail-guest-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.buyer-tryon-detail-guest-head > span {
  display: grid;
  gap: 3px;
}

.buyer-tryon-detail-guest-head strong {
  font-size: 14px;
}

.buyer-tryon-detail-guest-head small {
  color: #7b8495;
  font-size: 11px;
}

.buyer-tryon-detail-guest-head em {
  color: #5d6678;
  font-size: 12px;
  font-style: normal;
  white-space: nowrap;
}

.buyer-tryon-detail-guest-head em b {
  color: #2563eb;
  font-size: 16px;
}

.buyer-tryon-detail-guest-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.buyer-tryon-detail-guest-summary span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border-radius: 999px;
  padding: 4px 8px;
  color: #526075;
  background: #eef2f7;
  font-size: 11px;
}

.buyer-tryon-detail-guest-summary .is-working {
  color: #925b0d;
  background: #fff0cf;
}

.buyer-tryon-detail-guest-summary .is-working .lucide {
  width: 12px;
  height: 12px;
  animation: taskRecentSpin 0.9s linear infinite;
}

.buyer-tryon-detail-guest-summary .is-failed {
  color: #a23b4e;
  background: #fff0f3;
}

.buyer-tryon-detail-records {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.buyer-tryon-detail-record {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.buyer-tryon-detail-record > button {
  display: grid;
  place-items: center;
  width: 44px;
  height: 52px;
  overflow: hidden;
  border: 1px solid #e1e6ef;
  border-radius: 5px;
  padding: 0;
  color: #7b8495;
  background: #f1f4f8;
  cursor: pointer;
}

.buyer-tryon-detail-record > button:disabled {
  cursor: default;
}

.buyer-tryon-detail-record img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.buyer-tryon-detail-record > span {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.buyer-tryon-detail-record strong,
.buyer-tryon-detail-record small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.buyer-tryon-detail-record strong {
  font-size: 12px;
}

.buyer-tryon-detail-record small {
  color: #788296;
  font-size: 11px;
}

.buyer-tryon-detail-record.is-running small,
.buyer-tryon-detail-record.is-queued small {
  color: #9a640f;
}

.buyer-tryon-detail-record.is-failed small {
  color: #a23b4e;
}

.buyer-tryon-detail-empty {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  min-height: 126px;
  border: 1px dashed #d8dee8;
  border-radius: 7px;
  color: #7b8495;
  font-size: 12px;
}

.buyer-tryon-detail-empty .lucide {
  width: 22px;
  height: 22px;
}

.buyer-tryon-detail-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 14px 24px;
  border-top: 1px solid #e7eaf0;
  background: #fbfcfe;
}

.buyer-tryon-detail-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 38px;
  border: 1px solid #d8dee8;
  border-radius: 6px;
  padding: 0 14px;
  color: #465166;
  background: #fff;
  cursor: pointer;
}

.buyer-tryon-detail-actions button.is-primary {
  border-color: #2563eb;
  color: #fff;
  background: #2563eb;
}

.buyer-tryon-detail-actions .lucide {
  width: 15px;
  height: 15px;
}

html[data-theme="dark"] .buyer-tryon-detail-dialog {
  border-color: #36394a;
  color: #eef0f7;
  background: #171821;
}

html[data-theme="dark"] .buyer-tryon-detail-head,
html[data-theme="dark"] .buyer-tryon-detail-actions {
  border-color: #303342;
  background: #1b1c26;
}

html[data-theme="dark"] .buyer-tryon-detail-head p,
html[data-theme="dark"] .buyer-tryon-detail-section-head span,
html[data-theme="dark"] .buyer-tryon-detail-guest-head small,
html[data-theme="dark"] .buyer-tryon-detail-record small {
  color: #9ca3b6;
}

html[data-theme="dark"] .buyer-tryon-detail-stats,
html[data-theme="dark"] .buyer-tryon-detail-stats > span,
html[data-theme="dark"] .buyer-tryon-detail-guest,
html[data-theme="dark"] .buyer-tryon-detail-record > button,
html[data-theme="dark"] .buyer-tryon-detail-garments img,
html[data-theme="dark"] .buyer-tryon-detail-empty {
  border-color: #343746;
}

html[data-theme="dark"] .buyer-tryon-detail-guest,
html[data-theme="dark"] .buyer-tryon-detail-record > button {
  background: #20212c;
}

html[data-theme="dark"] .buyer-tryon-detail-guest.is-working {
  border-color: rgba(217, 145, 40, 0.48);
  background: #292317;
}

html[data-theme="dark"] .buyer-tryon-detail-actions button {
  border-color: #3b3f50;
  color: #d7dbea;
  background: #242631;
}

html[data-theme="dark"] .buyer-tryon-detail-actions button.is-primary {
  border-color: #4d7ff0;
  color: #fff;
  background: #315fc5;
}

@media (max-width: 720px) {
  .buyer-tryon-detail-modal {
    align-items: end;
    padding: 0;
  }

  .buyer-tryon-detail-dialog {
    width: 100%;
    max-height: calc(100dvh - 18px);
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: 8px 8px 0 0;
  }

  .buyer-tryon-detail-head,
  .buyer-tryon-detail-body,
  .buyer-tryon-detail-actions {
    padding-right: 16px;
    padding-left: 16px;
  }

  .buyer-tryon-detail-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .buyer-tryon-detail-stats > span:nth-child(2) {
    border-right: 0;
  }

  .buyer-tryon-detail-stats > span:nth-child(-n + 2) {
    border-bottom: 1px solid #e2e7ef;
  }

  .buyer-tryon-detail-records {
    grid-template-columns: 1fr;
  }

  .buyer-tryon-detail-guest-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }
}

.buyer-tryon-public-body {
  margin: 0;
  min-height: 100dvh;
  background: #eceef4;
  color: #25283a;
  font-family: inherit;
}

.buyer-tryon-public-page {
  width: min(100%, 430px);
  min-height: 100dvh;
  margin: 0 auto;
  padding: 14px 14px calc(132px + env(safe-area-inset-bottom, 0px));
  display: grid;
  align-content: start;
  gap: 14px;
  background: #fbfaf8;
  box-shadow: 0 0 0 1px rgba(31, 35, 54, 0.04), 0 24px 80px rgba(31, 35, 54, 0.14);
}

.buyer-tryon-public-brand {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  border: 1px solid rgba(219, 221, 232, 0.82);
  border-radius: 18px;
  padding: 10px 12px;
  color: inherit;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(246, 247, 255, 0.92));
  box-shadow: 0 16px 34px rgba(61, 67, 94, 0.08);
}

.buyer-tryon-public-brand img {
  flex: 0 0 auto;
  width: 74px;
  height: 34px;
  border-radius: 0;
  object-fit: contain;
  background: transparent;
  box-shadow: none;
}

.buyer-tryon-public-brand div {
  display: grid;
  gap: 2px;
  flex: 1 1 auto;
  min-width: 0;
}

.buyer-tryon-public-brand strong {
  color: #202538;
  font-size: 17px;
  font-weight: 760;
  line-height: 1.15;
}

.buyer-tryon-public-brand span {
  color: rgba(55, 62, 84, 0.62);
  font-size: 12px;
  line-height: 1.3;
}

.buyer-tryon-public-product,
.buyer-tryon-public-upload-card,
.buyer-tryon-public-result,
.buyer-tryon-public-history,
.buyer-tryon-public-garments {
  border: 1px solid rgba(219, 221, 232, 0.95);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 16px 38px rgba(61, 67, 94, 0.08);
}

.buyer-tryon-public-product {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  gap: 13px;
  align-items: center;
  padding: 12px;
}

.buyer-tryon-public-garment {
  margin: 0;
}

.buyer-tryon-public-garment img,
.buyer-tryon-public-garment.is-empty {
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: 14px;
  object-fit: cover;
  background: #f4f5fb;
  box-shadow: 0 12px 26px rgba(39, 45, 68, 0.12);
}

.buyer-tryon-public-garment.is-empty {
  display: grid;
  place-items: center;
  margin: 0;
  color: rgba(81, 88, 116, 0.42);
}

.buyer-tryon-public-garment.is-empty .lucide {
  width: 30px;
  height: 30px;
}

.buyer-tryon-public-product-copy {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.buyer-tryon-public-product-copy > span {
  color: #6d63d8;
  font-size: 11px;
  font-weight: 760;
  line-height: 1;
}

.buyer-tryon-public-product-copy h1 {
  margin: 0;
  color: #202538;
  font-size: 20px;
  font-weight: 780;
  line-height: 1.18;
}

.buyer-tryon-public-product-copy p {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  color: rgba(50, 57, 78, 0.72);
  font-size: 13px;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.buyer-tryon-public-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.buyer-tryon-public-meta span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 26px;
  border-radius: 999px;
  padding: 0 9px;
  color: #356a66;
  background: rgba(62, 124, 120, 0.1);
  font-size: 12px;
  font-weight: 580;
}

.buyer-tryon-public-meta .lucide {
  width: 13px;
  height: 13px;
}

.buyer-tryon-public-section-head {
  display: grid;
  gap: 4px;
}

.buyer-tryon-public-section-head strong {
  color: #202538;
  font-size: 16px;
  font-weight: 720;
  line-height: 1.2;
}

.buyer-tryon-public-section-head span {
  color: rgba(55, 62, 84, 0.62);
  font-size: 12px;
  line-height: 1.35;
}

.buyer-tryon-public-upload-card {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.buyer-tryon-public-garments {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.buyer-tryon-public-garment-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.buyer-tryon-public-garment-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 34px;
  border: 1px solid rgba(108, 99, 216, 0.22);
  border-radius: 12px;
  padding: 0 12px;
  color: #4c428f;
  background: rgba(108, 99, 216, 0.08);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.buyer-tryon-public-garment-actions button:disabled {
  opacity: 0.48;
  cursor: not-allowed;
}

.buyer-tryon-public-garment-actions .lucide {
  width: 16px;
  height: 16px;
}

.buyer-tryon-public-garment-actions small {
  color: rgba(55, 62, 84, 0.58);
  font-size: 12px;
  line-height: 1.3;
  white-space: nowrap;
}

.buyer-tryon-public-garment-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.buyer-tryon-public-garment-option {
  position: relative;
  display: grid;
  gap: 7px;
  min-width: 0;
  border: 1px solid rgba(219, 221, 232, 0.95);
  border-radius: 14px;
  padding: 8px;
  color: #202538;
  background: #fff;
  text-align: left;
  cursor: pointer;
}

.buyer-tryon-public-garment-option:disabled {
  opacity: 0.54;
  cursor: not-allowed;
}

.buyer-tryon-public-garment-option.is-selected {
  border-color: rgba(108, 99, 216, 0.68);
  box-shadow: inset 0 0 0 2px rgba(108, 99, 216, 0.12);
}

.buyer-tryon-public-garment-option.is-selected::after {
  content: "";
  position: absolute;
  top: 9px;
  right: 9px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #6d63d8;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.82);
}

.buyer-tryon-public-garment-option span {
  display: block;
  overflow: hidden;
  border-radius: 10px;
  background: #f4f5fb;
}

.buyer-tryon-public-garment-option img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
}

.buyer-tryon-public-garment-option strong,
.buyer-tryon-public-garment-option em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.buyer-tryon-public-garment-option strong {
  font-size: 13px;
  font-weight: 720;
  line-height: 1.25;
}

.buyer-tryon-public-garment-option em {
  color: rgba(55, 62, 84, 0.58);
  font-size: 11px;
  font-style: normal;
  line-height: 1.2;
}

.buyer-tryon-public-upload button {
  width: 100%;
  min-height: 230px;
  border: 1px dashed rgba(108, 99, 216, 0.34);
  border-radius: 16px;
  padding: 16px;
  display: grid;
  align-content: center;
  place-items: center;
  gap: 8px;
  color: #4c428f;
  background: rgba(108, 99, 216, 0.06);
  cursor: pointer;
}

.buyer-tryon-public-upload.is-processing button {
  cursor: wait;
  opacity: 0.82;
}

.buyer-tryon-public-upload.is-processing button > .lucide {
  animation: buyerTryOnPublicUploadSpin 0.8s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
  .buyer-tryon-public-upload.is-processing button > .lucide {
    animation: none;
  }
}

@keyframes buyerTryOnPublicUploadSpin {
  to { transform: rotate(360deg); }
}

.buyer-tryon-public-upload button > .lucide {
  width: 34px;
  height: 34px;
}

.buyer-tryon-public-upload button strong {
  font-size: 18px;
  font-weight: 760;
}

.buyer-tryon-public-upload button small {
  color: rgba(54, 61, 82, 0.56);
  font-size: 12px;
  line-height: 1.4;
}

.buyer-tryon-public-upload.has-image button {
  min-height: 104px;
  border-style: solid;
  padding: 12px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  justify-items: stretch;
  gap: 12px;
  background: #f4f5fb;
  text-align: left;
}

.buyer-tryon-public-upload.has-image img {
  width: auto;
  height: auto;
  max-width: 108px;
  max-height: 96px;
  border-radius: 12px;
  object-fit: contain;
  background: #fff;
  box-shadow: 0 10px 22px rgba(39, 45, 68, 0.12);
}

.buyer-tryon-public-upload.has-image .buyer-tryon-public-upload-copy {
  position: static;
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #4c428f;
  background: transparent;
  line-height: 1.2;
}

.buyer-tryon-public-upload.has-image .buyer-tryon-public-upload-copy strong {
  color: #202538;
  font-size: 16px;
  font-weight: 760;
}

.buyer-tryon-public-form {
  position: fixed;
  left: 50%;
  right: auto;
  bottom: 0;
  z-index: 20;
  width: min(100%, 430px);
  display: grid;
  gap: 10px;
  padding: 12px 14px calc(14px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid rgba(219, 221, 232, 0.95);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 -14px 34px rgba(61, 67, 94, 0.12);
  transform: translateX(-50%);
  backdrop-filter: blur(14px);
}

.buyer-tryon-public-body.is-busy .buyer-tryon-public-submit .lucide,
.buyer-tryon-public-generating .lucide {
  animation: taskRecentSpin 0.9s linear infinite;
}

.buyer-tryon-public-generating {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  column-gap: 9px;
  row-gap: 2px;
  border-radius: 13px;
  padding: 10px;
  color: #7b4e12;
  background: rgba(255, 236, 190, 0.62);
}

.buyer-tryon-public-generating .lucide {
  grid-row: 1 / 3;
  width: 18px;
  height: 18px;
}

.buyer-tryon-public-generating strong {
  font-size: 13px;
  font-weight: 720;
  line-height: 1.2;
}

.buyer-tryon-public-generating span {
  color: rgba(98, 72, 35, 0.72);
  font-size: 12px;
  line-height: 1.35;
}

.buyer-tryon-public-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 50px;
  border: 0;
  border-radius: 14px;
  color: #fff;
  background: linear-gradient(135deg, #6d63d8, #35a79b);
  box-shadow: 0 12px 26px rgba(92, 83, 198, 0.24);
  font-size: 16px;
  font-weight: 760;
  cursor: pointer;
}

.buyer-tryon-public-submit:disabled {
  color: rgba(70, 76, 99, 0.48);
  background: #eef0f5;
  box-shadow: none;
  cursor: default;
}

.buyer-tryon-public-submit .lucide {
  width: 18px;
  height: 18px;
}

.buyer-tryon-public-status {
  margin: 0;
  color: rgba(53, 46, 104, 0.72);
}

.buyer-tryon-public-error {
  margin: 0;
  border-radius: 12px;
  padding: 9px 10px;
  background: rgba(180, 35, 24, 0.08);
  color: #b42318;
  font-size: 12px;
  line-height: 1.4;
}

.buyer-tryon-public-result {
  margin: 0;
  overflow: hidden;
  padding: 10px;
}

.buyer-tryon-public-result button {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 14px;
  padding: 0;
  background: #f4f5fb;
  cursor: zoom-in;
}

.buyer-tryon-public-result img {
  display: block;
  width: 100%;
  max-height: 68vh;
  border-radius: 14px;
  object-fit: contain;
  background: #f4f5fb;
}

.buyer-tryon-public-result figcaption {
  padding: 10px 4px 2px;
  color: rgba(50, 57, 78, 0.66);
  font-size: 13px;
  line-height: 1.45;
}

.buyer-tryon-public-history {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.buyer-tryon-public-history-empty {
  min-height: 108px;
  display: grid;
  place-items: center;
  gap: 8px;
  border: 1px dashed rgba(108, 99, 216, 0.22);
  border-radius: 15px;
  color: rgba(55, 62, 84, 0.5);
  background: rgba(108, 99, 216, 0.04);
  font-size: 13px;
}

.buyer-tryon-public-history-empty .lucide {
  width: 28px;
  height: 28px;
  color: rgba(108, 99, 216, 0.48);
}

.buyer-tryon-public-history-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.buyer-tryon-public-history-item {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(219, 221, 232, 0.86);
  border-radius: 14px;
  background: #fff;
}

.buyer-tryon-public-history-item figure {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 3 / 4;
  margin: 0;
  overflow: hidden;
  background: #f4f5fb;
}

.buyer-tryon-public-history-preview {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  padding: 0;
  background: transparent;
  cursor: zoom-in;
}

.buyer-tryon-public-history-item figure > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.buyer-tryon-public-history-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.buyer-tryon-public-history-item figure > .lucide {
  width: 26px;
  height: 26px;
  color: rgba(79, 86, 112, 0.42);
}

.buyer-tryon-public-history-loading {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #fff;
  background: rgba(27, 31, 46, 0.42);
}

.buyer-tryon-public-history-loading .lucide {
  width: 24px;
  height: 24px;
  animation: taskRecentSpin 0.9s linear infinite;
}

.buyer-tryon-public-history-item div {
  display: grid;
  gap: 3px;
  padding: 9px;
}

.buyer-tryon-public-history-item strong,
.buyer-tryon-public-history-item span,
.buyer-tryon-public-history-item small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.buyer-tryon-public-history-item strong {
  color: #202538;
  font-size: 13px;
  font-weight: 720;
}

.buyer-tryon-public-history-item span,
.buyer-tryon-public-history-item small {
  color: rgba(55, 62, 84, 0.58);
  font-size: 11px;
  line-height: 1.3;
}

.buyer-tryon-public-history-item.is-completed strong {
  color: #2e6d68;
}

.buyer-tryon-public-history-item.is-running strong,
.buyer-tryon-public-history-item.is-queued strong {
  color: #8a5a13;
}

.buyer-tryon-public-history-item.is-failed strong {
  color: #9e3045;
}

.buyer-tryon-public-viewer {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(17, 20, 32, 0.82);
  backdrop-filter: blur(10px);
}

.buyer-tryon-public-viewer-panel {
  position: relative;
  width: min(100%, 680px);
  max-height: 92dvh;
  margin: 0;
  display: grid;
  place-items: center;
}

.buyer-tryon-public-viewer-panel img {
  display: block;
  max-width: 100%;
  max-height: 92dvh;
  border-radius: 16px;
  object-fit: contain;
  background: #f4f5fb;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.34);
}

.buyer-tryon-public-viewer-close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 1;
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 999px;
  color: #1f2434;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.2);
  cursor: pointer;
}

.buyer-tryon-public-viewer-close .lucide {
  width: 18px;
  height: 18px;
}

@media (min-width: 860px) {
  .buyer-tryon-public-body {
    background: linear-gradient(135deg, #f4f6fb 0%, #eceef4 46%, #f9f5ef 100%);
  }

  .buyer-tryon-public-page {
    width: min(100%, 1120px);
    min-height: 100dvh;
    grid-template-columns: minmax(0, 1fr) 380px;
    grid-template-areas:
      "brand brand"
      "product upload"
      "garments upload"
      "result form"
      "history history";
    align-items: start;
    gap: 16px;
    padding: 22px;
    background: transparent;
    box-shadow: none;
  }

  .buyer-tryon-public-brand {
    grid-area: brand;
  }

  .buyer-tryon-public-product {
    grid-area: product;
    grid-template-columns: 220px minmax(0, 1fr);
    min-height: 316px;
    padding: 18px;
  }

  .buyer-tryon-public-product-copy h1 {
    font-size: 30px;
  }

  .buyer-tryon-public-product-copy p {
    max-width: 420px;
    font-size: 14px;
    -webkit-line-clamp: 3;
  }

  .buyer-tryon-public-meta span {
    min-height: 30px;
    font-size: 13px;
  }

  .buyer-tryon-public-upload-card {
    grid-area: upload;
    min-height: 316px;
  }

  .buyer-tryon-public-garments {
    grid-area: garments;
  }

  .buyer-tryon-public-garment-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .buyer-tryon-public-upload button {
    min-height: 226px;
  }

  .buyer-tryon-public-result {
    grid-area: result;
  }

  .buyer-tryon-public-result img {
    max-height: 620px;
  }

  .buyer-tryon-public-history {
    grid-area: history;
  }

  .buyer-tryon-public-history-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .buyer-tryon-public-form {
    position: sticky;
    grid-area: form;
    top: 18px;
    left: auto;
    bottom: auto;
    width: 100%;
    border: 1px solid rgba(219, 221, 232, 0.95);
    border-radius: 18px;
    padding: 14px;
    box-shadow: 0 16px 38px rgba(61, 67, 94, 0.08);
    transform: none;
  }
}

@media (max-width: 859px) {
  .buyer-tryon-public-page {
    width: min(100%, 430px);
  }
}

@media (max-width: 374px) {
  .buyer-tryon-public-page {
    padding-inline: 10px;
  }

  .buyer-tryon-public-product {
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 10px;
    padding: 10px;
  }

  .buyer-tryon-public-product-copy h1 {
    font-size: 19px;
  }
}

/* Global minimal visual pass - 20260628 */
:root {
  --ink: #1f2937;
  --muted: #6b7280;
  --soft: #f7f8fb;
  --line: #e5e7eb;
  --panel: #ffffff;
  --purple: #4f46e5;
  --purple-2: #6366f1;
  --purple-soft: #eef2ff;
  --cyan: #64748b;
  --green: #16a34a;
  --blue: #2563eb;
  --rose: #e11d48;
  --amber: #d97706;
  --shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

body {
  background: #f6f7f9;
}

.sidebar,
.brand,
.topbar,
.nav-group,
.shop-button,
.function-card,
.advanced-card,
.settings-card,
.upload-card,
#product-upload,
.upload-column #product-upload,
.upload-card-wrap #product-upload,
.preview-card,
.workflow-card,
.works-panel,
.task-recent-panel,
.detail-page-latest-panel,
.generate-count-box,
.inline-model-section,
.detail-page-resolution-panel,
.extra-prompt-box,
.video-reference-url-box,
.copy-result-panel,
.modal-card,
.account-menu,
.model-selector-menu,
.model-picker-popover,
.video-material-mention-menu,
.library-panel,
.library-modal,
.feature-experience,
.detail-preview-shell,
.video-status-card,
.buyer-tryon-public-page,
.buyer-tryon-public-upload-card,
.buyer-tryon-public-product,
.buyer-tryon-public-result,
.buyer-tryon-public-history,
.buyer-tryon-public-garments,
.buyer-tryon-public-form {
  border-color: var(--line) !important;
  background-color: var(--panel) !important;
  background-image: none !important;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04) !important;
}

body #product-upload,
body .upload-card-wrap #product-upload,
body .upload-column #product-upload {
  border-color: var(--line) !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04) !important;
}

body.feature-focus-mode.workstation-feature-mode .preview-card,
body.feature-focus-mode.workstation-feature-mode .task-recent-panel,
body.feature-focus-mode.workstation-feature-mode .detail-page-latest-panel {
  border-color: var(--line) !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .extra-prompt-box {
  border: 0 !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

.content-grid,
.workspace,
.task-body,
.settings-column,
.preview-column,
.buyer-tryon-public-body {
  background-image: none !important;
}

.hero-card,
.works-card,
.create-button,
.free-generate-button,
.generation-channel-switch button.selected,
.resolution-option.selected,
.choice-button.selected,
.inline-model-option.selected,
.detail-page-resolution-options button.selected,
.video-compact-select summary,
.print-compact-select summary,
.points-button .lucide:first-child,
.need-request-button .lucide,
.model-selector-icon,
.feature-icon,
.advanced-chip,
.upload-icon,
.video-upload-audio-thumb,
.video-material-mention-button,
.video-storyboard-button {
  background-image: none !important;
}

.create-button,
.create-button.full,
.free-generate-button,
#generate,
#mobile-generate,
.generation-channel-switch button.selected,
.resolution-option.selected,
.choice-button.selected,
.inline-model-option.selected,
.detail-page-resolution-options button.selected,
.video-material-mention-button,
.video-storyboard-button,
.buyer-tryon-public-form button[type="submit"] {
  color: #ffffff !important;
  background-color: var(--purple) !important;
  border-color: var(--purple) !important;
  box-shadow: none !important;
}

.outline-button,
.points-button,
.need-request-button,
.icon-button,
.small-icon-button,
.batch-button,
.choice-button,
.resolution-option,
.inline-model-option,
.detail-page-resolution-options button,
.model-option-button,
.video-compact-select summary,
.print-compact-select summary,
.video-material-mention-menu button,
.upload-stack-delete,
.buyer-tryon-public-history-item,
.buyer-tryon-public-meta span {
  color: var(--ink) !important;
  border-color: var(--line) !important;
  background-color: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
}

.advanced-chip,
.feature-head small,
.brand small,
.shop-button small,
.model-option-button em,
.settings-alert-text,
.status-pill,
.recommended-badge,
.task-status-badge {
  color: var(--purple) !important;
  background-color: var(--purple-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.function-card:hover,
.advanced-card:hover,
.choice-button:hover,
.resolution-option:hover,
.inline-model-option:hover,
.model-option-button:hover,
.detail-page-resolution-options button:hover,
.video-material-mention-button:hover,
.video-storyboard-button:hover {
  transform: none !important;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06) !important;
}

.hero-card::before,
.hero-card::after,
.function-card::before,
.advanced-card::before,
.preview-card::before,
.extra-prompt-box::before,
.settings-card::before,
.upload-card::before,
.detail-preview-shell::before,
.works-panel::before {
  opacity: 0 !important;
}

.feature-icon {
  color: var(--purple) !important;
  background-color: var(--purple-soft) !important;
}

.nav-item.active,
.nav-item[aria-current="page"] {
  color: var(--purple) !important;
  background-color: var(--purple-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.nav-item:hover,
.shop-button:hover,
.points-button:hover,
.need-request-button:hover {
  background-color: #f8fafc !important;
  background-image: none !important;
  box-shadow: none !important;
}

input,
textarea,
select {
  border-color: var(--line) !important;
  background-color: #ffffff !important;
  box-shadow: none !important;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--purple) !important;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1) !important;
  outline: none !important;
}

/* Restore key top/sidebar actions after the minimal pass. */
.works-card {
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04) !important;
}

.sidebar-footer-stack {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.sidebar-footer-stack .works-card {
  margin-top: 0 !important;
}

.ai-assistant-sidebar-slot:not(.is-active) {
  display: none;
}

.ai-assistant-sidebar-slot.is-active {
  display: block;
  min-width: 0;
}

.works-card strong {
  color: var(--ink) !important;
}

.works-card small {
  color: var(--muted) !important;
}

.works-icon {
  color: var(--purple) !important;
  background: var(--purple-soft) !important;
}

.works-icon .lucide {
  color: var(--purple) !important;
}

.need-request-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.points-button > .lucide:first-child,
.need-request-button > .lucide:first-child {
  display: inline-grid !important;
  flex: 0 0 auto !important;
  place-items: center !important;
  width: 30px !important;
  height: 30px !important;
  padding: 6px !important;
  border-radius: 10px !important;
  color: var(--purple) !important;
  background: var(--purple-soft) !important;
  opacity: 1 !important;
  stroke-width: 2.2 !important;
}

.need-request-button em {
  color: #ffffff !important;
  background: #ff4f6d !important;
}

.points-button > .lucide:last-child {
  display: inline-block !important;
  flex: 0 0 auto !important;
  width: 18px !important;
  height: 18px !important;
  padding: 0 !important;
  color: #a3a8b8 !important;
  background: transparent !important;
  opacity: 0.9 !important;
  stroke-width: 2 !important;
}

/* Unified top action controls. */
.top-actions {
  align-items: center !important;
  gap: 10px !important;
}

.free-generate-button,
.points-button,
.need-request-button,
.checkin-entry-button,
.notify-button,
.shop-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 42px !important;
  height: 42px !important;
  padding: 0 13px !important;
  border: 1px solid #e6e9f2 !important;
  border-radius: 12px !important;
  color: #364152 !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.025) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
}

.free-generate-button {
  color: #4338ca !important;
  font-weight: 600 !important;
}

.points-button strong {
  color: #4338ca !important;
  font-size: 15px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
}

.points-button > .lucide:first-child,
.need-request-button > .lucide:first-child,
.checkin-entry-button > .lucide:first-child,
.free-generate-button > .lucide:first-child,
.account-entry-icon {
  display: inline-grid !important;
  flex: 0 0 auto !important;
  place-items: center !important;
  width: 28px !important;
  height: 28px !important;
  padding: 6px !important;
  border-radius: 9px !important;
  color: #4338ca !important;
  background: #f3f5ff !important;
  opacity: 1 !important;
  stroke-width: 2 !important;
}

.checkin-entry-button > .lucide:first-child {
  color: #0f766e !important;
  background: #ecfdf5 !important;
}

.need-request-button > .lucide:first-child {
  color: #be123c !important;
  background: #fff5f6 !important;
}

.free-generate-button > .lucide:first-child {
  color: #6d28d9 !important;
  background: #f6f0ff !important;
}

.points-button > .lucide:last-child {
  width: 16px !important;
  height: 16px !important;
  color: #a3a8b8 !important;
}

.need-request-button em {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  min-height: 20px !important;
  padding: 0 7px !important;
  border-radius: 999px !important;
  color: #be123c !important;
  background: #fff1f2 !important;
  box-shadow: none !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}

.checkin-entry-button.is-checked {
  color: #64748b !important;
  background: #f8fafc !important;
}

.checkin-entry-button.is-checked > .lucide:first-child {
  color: #64748b !important;
  background: #f1f5f9 !important;
}

.notify-button {
  position: relative !important;
  width: 42px !important;
  min-width: 42px !important;
  padding: 0 !important;
}

.notify-button .lucide {
  width: 20px !important;
  height: 20px !important;
  color: #4338ca !important;
}

.notify-button span {
  right: -4px !important;
  top: -6px !important;
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 5px !important;
  background: #ef4444 !important;
  font-size: 10px !important;
  font-weight: 800 !important;
}

.notify-button span[hidden] {
  display: none !important;
}

.notification-popover {
  position: fixed;
  z-index: 1100;
  display: grid;
  gap: 0;
  max-height: min(520px, calc(100vh - 92px));
  overflow: hidden;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 22px 60px rgba(15, 23, 42, 0.16);
}

.notification-popover[hidden] {
  display: none !important;
}

.notification-popover-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 14px 12px;
  border-bottom: 1px solid #eef2f7;
}

.notification-popover-head strong {
  color: #111827;
  font-size: 15px;
  font-weight: 850;
}

.notification-popover-head small {
  color: #64748b;
  font-size: 11.5px;
  font-weight: 500;
  white-space: nowrap;
}

.notification-list {
  display: grid;
  gap: 0;
  overflow: auto;
}

.notification-item {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid #f1f5f9;
  background: #ffffff;
}

.notification-item.no-image {
  grid-template-columns: minmax(0, 1fr);
}

.notification-item:last-child {
  border-bottom: 0;
}

.notification-item.is-unread {
  background: #f8fbff;
}

.notification-item.is-actionable {
  cursor: pointer;
  transition: background-color 160ms ease;
}

.notification-item.is-actionable:hover,
.notification-item.is-actionable:focus-visible {
  background: #f5f3ff;
  outline: none;
}

.notification-item img {
  width: 54px;
  height: 54px;
  border-radius: 10px;
  object-fit: cover;
  background: #f1f5f9;
}

.notification-item div {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.notification-item strong {
  overflow: hidden;
  color: #111827;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notification-item p {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  color: #475569;
  font-size: 12px;
  line-height: 1.5;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.notification-item small {
  color: #94a3b8;
  font-size: 11px;
  font-weight: 700;
}

.notification-empty {
  padding: 24px 18px;
  color: #64748b;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.6;
  text-align: center;
}

.shop-button {
  grid-template-columns: none !important;
  min-width: 132px !important;
  padding-right: 10px !important;
  text-align: left !important;
}

.shop-button img {
  display: none !important;
}

.shop-button span {
  display: grid !important;
  min-width: 0 !important;
  color: #364152 !important;
  font-size: 13px !important;
}

.shop-button b {
  max-width: 92px !important;
  overflow: hidden !important;
  color: #1f2937 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.shop-button small {
  margin-top: 2px !important;
  padding: 0 !important;
  color: #64748b !important;
  background: transparent !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

.shop-button > .lucide:last-child {
  width: 15px !important;
  height: 15px !important;
  color: #94a3b8 !important;
}

.shop-button:hover,
.points-button:hover,
.need-request-button:hover,
.checkin-entry-button:hover,
.notify-button:hover,
.free-generate-button:hover {
  border-color: #d8dded !important;
  background: #f8fafc !important;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.045) !important;
}

/* Detail page uses the same outer workstation frame as video generation. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .content-grid {
  padding-top: 18px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-panel {
  display: grid !important;
  grid-template-columns: 520px minmax(0, 1fr) !important;
  grid-template-rows: auto auto minmax(0, 1fr) 126px !important;
  gap: 0 24px !important;
  align-items: stretch !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-body:not([hidden]) {
  display: contents !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-heading {
  display: grid !important;
  grid-column: 1 / 2 !important;
  grid-row: 1 !important;
  align-content: end !important;
  align-self: stretch !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 18px 22px 10px !important;
  overflow: visible !important;
  border: 1px solid #efeff8 !important;
  border-bottom: 0 !important;
  border-radius: 22px 22px 0 0 !important;
  background: rgba(255, 255, 255, 0.96) !important;
  background-color: rgba(255, 255, 255, 0.96) !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-scroll-area {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-body:not([hidden]) .upload-column,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-column {
  grid-column: 1 / 2 !important;
  grid-row: 2 / 3 !important;
  align-self: stretch !important;
  position: relative !important;
  z-index: 1 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 4px 22px 16px !important;
  overflow-x: visible !important;
  overflow-y: auto !important;
  border: 1px solid #efeff8 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
  background: rgba(255, 255, 255, 0.96) !important;
  background-color: rgba(255, 255, 255, 0.96) !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-column {
  grid-column: 1 / 2 !important;
  grid-row: 3 / 5 !important;
  position: relative !important;
  z-index: 30 !important;
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 22px 22px !important;
  overflow: visible !important;
  border: 1px solid #efeff8 !important;
  border-top: 0 !important;
  border-radius: 0 0 22px 22px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  background-color: rgba(255, 255, 255, 0.96) !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-bottom-area {
  position: relative !important;
  z-index: 40 !important;
  background: rgba(255, 255, 255, 0.98) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .preview-column {
  display: grid !important;
  grid-column: 2 / 3 !important;
  grid-row: 1 / 5 !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

/* Account center panel */
.account-menu {
  right: 22px !important;
  top: 76px !important;
  gap: 12px !important;
  width: 440px !important;
  max-width: min(440px, calc(100vw - 24px)) !important;
  padding: 16px !important;
  overflow: visible !important;
  border: 1px solid rgba(222, 226, 238, 0.92) !important;
  border-radius: 20px !important;
  background:
    linear-gradient(180deg, rgba(250, 251, 255, 0.98), rgba(255, 255, 255, 0.98)) !important;
  box-shadow: 0 28px 80px rgba(60, 66, 96, 0.17) !important;
}

.account-menu::before {
  right: 30px !important;
  border-color: rgba(226, 232, 240, 0.92) !important;
}

.account-profile-head {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) 34px;
  gap: 12px;
  align-items: center;
  padding: 2px 2px 4px;
}

.account-profile-avatar {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  overflow: hidden;
  border: 1px solid #eef0f5;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 22px rgba(79, 70, 229, 0.09);
}

.account-profile-avatar img {
  width: 88%;
  height: 88%;
  object-fit: contain;
}

.account-profile-main {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.account-profile-name-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.account-profile-name-row strong {
  overflow: hidden;
  color: #141820;
  font-size: 20px;
  line-height: 1.1;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-profile-name-row em {
  flex: 0 0 auto;
  min-height: 23px;
  padding: 0 10px;
  border: 1px solid rgba(79, 70, 229, 0.14);
  border-radius: 999px;
  color: #4f46e5;
  background: #eef2ff;
  font-size: 12px;
  font-style: normal;
  font-weight: 650;
  line-height: 21px;
}

.account-profile-main small {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #98a1b2;
  font-size: 14px;
  font-weight: 600;
}

.account-profile-main small b {
  color: #98a1b2;
  font-weight: 650;
}

.account-profile-arrow {
  display: inline-grid !important;
  place-items: center !important;
  min-height: 30px !important;
  width: 30px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 9px !important;
  color: #9aa3b2 !important;
  background: transparent !important;
}

.account-profile-arrow .lucide {
  width: 18px;
  height: 18px;
}

.account-overview-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.account-overview-card {
  display: grid !important;
  gap: 9px !important;
  align-content: center !important;
  min-height: 76px !important;
  padding: 13px 14px !important;
  border: 1px solid #e9ecf6 !important;
  border-radius: 16px !important;
  color: #293040 !important;
  text-align: left !important;
  background: #fff !important;
  box-shadow: 0 12px 26px rgba(72, 78, 110, 0.05) !important;
}

.account-overview-card span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #737b8c;
  font-size: 13px;
  font-weight: 600;
}

.account-overview-card span .lucide {
  width: 24px;
  height: 24px;
  padding: 5px;
  border-radius: 8px;
  color: #4f46e5;
  background: #eef2ff;
}

.account-overview-card strong {
  overflow: hidden;
  color: #141820;
  font-size: 22px;
  line-height: 1.05;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-member-ribbon {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 54px;
  padding: 10px 12px;
  border: 1px solid rgba(79, 70, 229, 0.12);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(238, 242, 255, 0.9), rgba(245, 243, 255, 0.92));
}

.account-member-ribbon > .lucide {
  width: 34px;
  height: 34px;
  padding: 8px;
  border-radius: 11px;
  color: #4f46e5;
  background: #fff;
}

.account-member-ribbon small {
  color: #5e6575;
  font-size: 13px;
  font-weight: 600;
}

.account-member-ribbon button {
  min-height: 34px !important;
  padding: 0 13px !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: #4f46e5 !important;
  box-shadow: 0 10px 18px rgba(79, 70, 229, 0.18) !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}

.account-menu-section {
  display: grid;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid #eef0f4;
}

.account-menu-section > span {
  padding: 0 8px 4px;
  color: #a1a8b5;
  font-size: 13px;
  font-weight: 650;
}

.account-menu-section {
  grid-template-columns: 1fr 1fr;
}

.account-menu-section > span {
  grid-column: 1 / -1;
}

.account-menu-section button {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 9px !important;
  align-items: center !important;
  justify-content: initial !important;
  min-height: 60px !important;
  padding: 10px !important;
  border: 1px solid #eef0f6 !important;
  border-radius: 14px !important;
  color: #3f4653 !important;
  text-align: left !important;
  background: rgba(255, 255, 255, 0.86) !important;
  box-shadow: 0 8px 18px rgba(66, 74, 105, 0.035) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

.account-menu-section [data-admin-only][hidden] {
  display: none !important;
}

.account-menu-section button > .lucide:first-child {
  width: 30px;
  height: 30px;
  padding: 7px;
  border-radius: 9px;
  color: #606875;
  background: #f3f5f8;
}

.account-menu-section button span {
  display: grid;
  gap: 2px;
}

.account-menu-section button small {
  color: #9aa2b1;
  font-size: 12px;
  font-weight: 500;
}

.account-menu-section button:hover,
.account-profile-arrow:hover,
.account-overview-card:hover {
  background: #f7f8fb !important;
}

.account-menu-footer {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid #eef0f4;
}

.account-menu-footer button {
  min-height: 42px !important;
  border-radius: 11px !important;
  font-size: 14px !important;
  font-weight: 650 !important;
}

.account-logout-button {
  color: #6d7481 !important;
  background: #fff !important;
  border: 1px solid #edf0f6 !important;
}

.account-menu button:hover {
  transform: translateY(-1px);
}

/* Account center compact polish */
.account-menu {
  right: 14px !important;
  top: 72px !important;
  gap: 10px !important;
  width: 380px !important;
  max-width: min(380px, calc(100vw - 18px)) !important;
  padding: 12px !important;
  border-radius: 18px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(250, 251, 255, 0.98)) !important;
  box-shadow: 0 24px 58px rgba(20, 27, 46, 0.16) !important;
}

.account-profile-head {
  grid-template-columns: minmax(0, 1fr) 28px !important;
  gap: 10px !important;
  padding: 2px 2px 0 !important;
}

.account-profile-avatar {
  width: 46px !important;
  height: 46px !important;
  border-radius: 13px !important;
  box-shadow: 0 8px 18px rgba(79, 70, 229, 0.08) !important;
}

.account-profile-main {
  gap: 5px !important;
}

.account-profile-name-row strong {
  font-size: 18px !important;
  font-weight: 720 !important;
}

.account-profile-name-row em {
  min-height: 21px !important;
  padding: 0 8px !important;
  font-size: 11px !important;
  line-height: 19px !important;
}

.account-profile-main small {
  display: block !important;
  max-width: 100%;
  overflow: hidden;
  color: #a0a8b8 !important;
  font-size: 12px !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-profile-main small b {
  color: #8d96a8 !important;
}

.account-profile-arrow {
  width: 28px !important;
  min-height: 28px !important;
  border-radius: 8px !important;
}

.account-overview-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0 !important;
  overflow: hidden !important;
  border: 1px solid #edf0f6 !important;
  border-radius: 15px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.account-overview-card {
  gap: 7px !important;
  min-height: 62px !important;
  padding: 12px 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.account-overview-card + .account-overview-card {
  border-left: 1px solid #edf0f6 !important;
}

.account-overview-card span {
  gap: 6px !important;
  color: #7a8292 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

.account-overview-card span .lucide {
  width: 15px !important;
  height: 15px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  color: #8a93a3 !important;
  background: transparent !important;
  stroke-width: 2.1 !important;
}

.account-overview-card strong {
  color: #1f2937 !important;
  font-size: 18px !important;
  font-weight: 650 !important;
}

.account-member-ribbon {
  grid-template-columns: 30px minmax(0, 1fr) auto !important;
  min-height: 46px !important;
  padding: 8px 10px !important;
  border-radius: 14px !important;
  background: #f5f6ff !important;
}

.account-member-ribbon > .lucide {
  width: 30px !important;
  height: 30px !important;
  padding: 7px !important;
  border-radius: 10px !important;
}

.account-member-ribbon small {
  font-size: 12px !important;
}

.account-member-ribbon button {
  min-height: 31px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
}

.account-menu-section {
  gap: 7px !important;
  padding-top: 10px !important;
}

.account-menu-section {
  grid-template-columns: 1fr !important;
}

.account-menu-section > span {
  padding: 0 4px 2px !important;
  font-size: 12px !important;
}

.account-menu-section button {
  grid-template-columns: 32px minmax(0, 1fr) !important;
  min-height: 48px !important;
  padding: 8px 10px !important;
  border-radius: 13px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}

.account-menu-section button > .lucide:first-child {
  width: 28px !important;
  height: 28px !important;
  padding: 7px !important;
}

.account-menu-section button small {
  display: none !important;
}

.account-menu-footer {
  padding-top: 9px !important;
}

.account-menu-footer button {
  min-height: 38px !important;
}

/* Global premium motion layer. Keep motion subtle so the app still feels like a work tool. */
:root {
  --motion-fast: 140ms;
  --motion-medium: 220ms;
  --motion-slow: 420ms;
  --motion-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --motion-soft-shadow: 0 14px 34px rgba(42, 47, 75, 0.1);
  --motion-purple-shadow: 0 16px 34px rgba(123, 97, 255, 0.18);
}

@keyframes premiumFadeLift {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes premiumModalIn {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.975);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes premiumToastIn {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes centeredToastIn {
  from {
    opacity: 0;
    transform: translate(-50%, calc(-50% + 14px)) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes premiumSoftPulse {
  0%,
  100% {
    box-shadow: 0 0 0 rgba(123, 97, 255, 0);
  }
  50% {
    box-shadow: 0 0 0 5px rgba(123, 97, 255, 0.08);
  }
}

@keyframes premiumSweep {
  from {
    transform: translateX(-120%) skewX(-16deg);
  }
  to {
    transform: translateX(140%) skewX(-16deg);
  }
}

@keyframes premiumSkeleton {
  from {
    background-position: 120% 0;
  }
  to {
    background-position: -120% 0;
  }
}

@keyframes premiumImageReveal {
  from {
    opacity: 0;
    filter: saturate(0.9) blur(3px);
    transform: scale(0.992);
  }
  to {
    opacity: 1;
    filter: saturate(1) blur(0);
    transform: scale(1);
  }
}

button,
a,
summary,
input,
textarea,
select,
.function-card,
.advanced-card,
.work-card,
.project-image-card,
.work-detail-card,
.material-thumb,
.model-card,
.model-option-button,
.inline-model-option,
.choice-button,
.resolution-option,
.count-option,
.detail-style-preset-button,
.detail-page-module-card,
.set-mode-button,
.upload-card,
.preview-card,
.settings-card,
.extra-prompt-box,
.workflow-card,
.account-menu,
.modal-card,
.detail-template-dialog,
.image-viewer-panel,
.buyer-tryon-public-upload-card {
  transition:
    transform var(--motion-medium) var(--motion-ease),
    box-shadow var(--motion-medium) var(--motion-ease),
    border-color var(--motion-medium) var(--motion-ease),
    background-color var(--motion-medium) var(--motion-ease),
    color var(--motion-fast) ease,
    opacity var(--motion-medium) var(--motion-ease),
    filter var(--motion-medium) var(--motion-ease) !important;
}

.content-grid,
.task-panel,
.free-generate-page,
.works-panel,
.library-shell {
  animation: premiumFadeLift 260ms var(--motion-ease);
}

.works-card {
  position: relative !important;
  grid-template-columns: 56px minmax(0, 1fr) 24px !important;
  gap: 13px !important;
  min-height: 88px !important;
  padding: 14px 15px !important;
  border: 1px solid rgba(218, 222, 238, 0.88) !important;
  color: #202637 !important;
  background:
    radial-gradient(circle at 16% 18%, rgba(124, 92, 255, 0.14), transparent 34%),
    linear-gradient(135deg, #ffffff 0%, #fbfaff 58%, #f5f7ff 100%) !important;
  box-shadow: 0 14px 30px rgba(55, 57, 92, 0.08) !important;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease !important;
}

.works-card::before {
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.72), transparent 56%);
  pointer-events: none;
  content: "";
}

.works-card::after {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  color: #7a6bea;
  background: rgba(122, 107, 234, 0.08);
  font-size: 17px;
  font-weight: 400;
  line-height: 1;
  content: "›";
}

.works-card:hover {
  transform: translateY(-1px);
  border-color: rgba(124, 92, 255, 0.26) !important;
  box-shadow: 0 18px 36px rgba(72, 64, 130, 0.12) !important;
}

.works-card:active {
  transform: translateY(0);
}

.works-card .works-icon,
.works-card > span {
  position: relative;
  z-index: 1;
}

.works-icon {
  width: 54px !important;
  height: 54px !important;
  border-radius: 17px !important;
  color: #5b4be8 !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(244, 242, 255, 0.86)),
    linear-gradient(135deg, rgba(91, 75, 232, 0.15), rgba(59, 130, 246, 0.1)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(123, 97, 255, 0.1),
    0 10px 20px rgba(91, 75, 232, 0.12) !important;
}

.works-icon .lucide {
  width: 24px !important;
  height: 24px !important;
  stroke-width: 1.9 !important;
}

.works-card strong {
  color: #202637 !important;
  font-size: 21px !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
}

.works-card small {
  margin-top: 7px !important;
  color: #7c8498 !important;
  font-size: 13px !important;
  font-weight: 450 !important;
}

.works-card.is-generating {
  background:
    radial-gradient(circle at 16% 18%, rgba(255, 79, 109, 0.16), transparent 34%),
    linear-gradient(135deg, #ffffff 0%, #fff8fb 54%, #f7f4ff 100%) !important;
  animation: none !important;
}

.create-button,
.free-generate-button,
.outline-button,
.batch-button,
.points-button,
.checkin-entry-button,
.small-icon-button,
.library-select-button,
.experience-upload-button,
.model-upload-link,
.preview-empty-action,
.preview-empty-upload,
.upload-example-button {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  will-change: transform, box-shadow;
}

.need-request-button,
.checkin-entry-button,
.shop-button,
.icon-button {
  overflow: visible !important;
}

.create-button::after,
.free-generate-button::after,
.preview-empty-action::after,
.preview-empty-upload::after {
  content: "";
  position: absolute;
  inset: -60% auto -60% -45%;
  z-index: -1;
  width: 42%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.34), transparent);
  opacity: 0;
  pointer-events: none;
}

.create-button:hover::after,
.free-generate-button:hover::after,
.preview-empty-action:hover::after,
.preview-empty-upload:hover::after {
  opacity: 1;
  animation: premiumSweep 760ms var(--motion-ease);
}

.create-button:hover:not(:disabled),
.free-generate-button:hover:not(:disabled),
.outline-button:hover:not(:disabled),
.batch-button:hover:not(:disabled),
.points-button:hover:not(:disabled),
.need-request-button:hover:not(:disabled),
.checkin-entry-button:hover:not(:disabled),
.shop-button:hover:not(:disabled),
.icon-button:hover:not(:disabled),
.small-icon-button:hover:not(:disabled),
.library-select-button:hover:not(:disabled),
.experience-upload-button:hover:not(:disabled),
.model-upload-link:hover:not(:disabled),
.preview-empty-action:hover:not(:disabled),
.preview-empty-upload:hover:not(:disabled),
.upload-example-button:hover:not(:disabled) {
  transform: translateY(-1px) !important;
  box-shadow: var(--motion-soft-shadow) !important;
}

.create-button:hover:not(:disabled),
.free-generate-button:hover:not(:disabled),
.preview-empty-action:hover:not(:disabled),
.preview-empty-upload:hover:not(:disabled) {
  box-shadow: var(--motion-purple-shadow) !important;
}

.create-button:active:not(:disabled),
.free-generate-button:active:not(:disabled),
.outline-button:active:not(:disabled),
.batch-button:active:not(:disabled),
.points-button:active:not(:disabled),
.need-request-button:active:not(:disabled),
.checkin-entry-button:active:not(:disabled),
.shop-button:active:not(:disabled),
.icon-button:active:not(:disabled),
.small-icon-button:active:not(:disabled),
.library-select-button:active:not(:disabled),
.experience-upload-button:active:not(:disabled),
.model-upload-link:active:not(:disabled),
.preview-empty-action:active:not(:disabled),
.preview-empty-upload:active:not(:disabled),
.upload-example-button:active:not(:disabled) {
  transform: translateY(0) scale(0.985) !important;
  box-shadow: 0 8px 18px rgba(20, 24, 42, 0.08) !important;
}

button:disabled,
.create-button:disabled,
.outline-button:disabled {
  filter: saturate(0.86);
  opacity: 0.58;
}

.function-card:hover,
.advanced-card:hover,
.work-card:hover,
.project-image-card:hover,
.work-detail-card:hover,
.material-thumb:hover,
.model-card:hover,
.model-option-button:hover,
.inline-model-option:hover,
.choice-button:hover,
.resolution-option:hover,
.count-option:hover,
.detail-style-preset-button:hover,
.detail-page-module-card:hover,
.set-mode-button:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(123, 97, 255, 0.34) !important;
  box-shadow: var(--motion-soft-shadow) !important;
}

.function-card:active,
.advanced-card:active,
.work-card:active,
.material-thumb:active,
.model-card:active,
.model-option-button:active,
.inline-model-option:active,
.choice-button:active,
.resolution-option:active,
.count-option:active,
.detail-style-preset-button:active,
.detail-page-module-card:active,
.set-mode-button:active {
  transform: translateY(0) scale(0.992) !important;
}

.function-card img,
.advanced-card img,
.card-media img,
.advanced-main-img,
.material-thumb img,
.model-directory-image img,
.model-detail-photo-card img,
.preview-frame img,
.preview-card > img,
.upload-card img,
.detail-upload-slot img,
.need-request-image-item img {
  transition:
    transform var(--motion-slow) var(--motion-ease),
    opacity var(--motion-medium) var(--motion-ease),
    filter var(--motion-medium) var(--motion-ease) !important;
  animation: premiumImageReveal 360ms var(--motion-ease);
}

.work-thumb img,
.project-image-card img,
.work-detail-thumb img,
.task-recent-thumb img,
.wrinkle-latest-thumb img,
.video-latest-media img {
  transition:
    transform var(--motion-slow) var(--motion-ease),
    opacity var(--motion-medium) var(--motion-ease),
    filter var(--motion-medium) var(--motion-ease) !important;
  animation: none !important;
}

.work-card.batch-work.is-running .work-thumb img {
  filter: none !important;
  animation: none !important;
}

.function-card:hover img,
.advanced-card:hover img,
.work-card:hover .work-thumb img,
.project-image-card:hover img,
.work-detail-card:hover .work-detail-thumb img,
.material-thumb:hover img,
.model-directory-image:hover img,
.model-detail-photo-card:hover img {
  transform: scale(1.025) !important;
}

.upload-card:hover,
.unified-upload-dropzone:hover,
.detail-dialog-upload-slot:hover,
.upload-card.is-dragover,
.unified-upload-dropzone.is-dragover {
  border-color: rgba(123, 97, 255, 0.48) !important;
  box-shadow: 0 16px 34px rgba(123, 97, 255, 0.12) !important;
  transform: translateY(-1px) !important;
}

.upload-card.is-dragover,
.unified-upload-dropzone.is-dragover {
  animation: premiumSoftPulse 1.2s ease-in-out infinite;
}

.upload-stack figure,
.preview-gallery figure,
.detail-preview-card,
.set-preview-card,
.free-work-card,
.work-card {
  animation: premiumFadeLift 260ms var(--motion-ease);
}

.work-card:not(.is-running),
.work-card.batch-work.is-running,
.free-work-card:not(.is-running) {
  animation: none !important;
}

.preview-card.generating,
.work-card.is-running,
.free-work-card.is-running,
.task-recent-thumb.is-running,
.buyer-tryon-public-history-item.is-running {
  position: relative;
  overflow: hidden;
}

.preview-card.generating::after,
.work-card.is-running::after,
.free-work-card.is-running::after,
.task-recent-thumb.is-running::after,
.buyer-tryon-public-history-item.is-running::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 0%, rgba(255, 255, 255, 0.34) 44%, transparent 62%);
  background-size: 220% 100%;
  pointer-events: none;
  animation: premiumSkeleton 1.35s ease-in-out infinite;
}

.work-card.batch-work.is-running::after {
  content: none !important;
  animation: none !important;
}

.modal-backdrop:not([hidden]) {
  animation: premiumToastIn 180ms var(--motion-ease);
}

.modal-backdrop:not([hidden]) .modal-card,
.modal-backdrop:not([hidden]) .detail-template-dialog,
.modal-backdrop:not([hidden]) .image-viewer-panel,
.modal-backdrop:not([hidden]) .video-storyboard-dialog,
.modal-backdrop:not([hidden]) .video-script-dialog {
  animation: premiumModalIn 240ms var(--motion-ease);
}

.account-menu:not([hidden]) {
  animation: premiumModalIn 180ms var(--motion-ease);
  transform-origin: top right;
}

.toast.show,
.free-toast:not([hidden]) {
  animation: premiumToastIn 220ms var(--motion-ease);
}

.toast.show {
  animation: centeredToastIn 220ms var(--motion-ease);
}

input:focus,
textarea:focus,
select:focus,
.detail-count-select:focus,
.xhs-requirement-input:focus,
.free-page-prompt textarea:focus,
.extra-prompt-box textarea:focus,
.video-reference-url-box textarea:focus,
.auth-form input:focus,
.need-request-form textarea:focus {
  border-color: rgba(123, 97, 255, 0.58) !important;
  box-shadow: 0 0 0 4px rgba(123, 97, 255, 0.12) !important;
}

.settings-card:hover,
.extra-prompt-box:hover,
.workflow-card:hover,
.preview-card:hover {
  box-shadow: 0 12px 30px rgba(42, 47, 75, 0.07) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .preview-card,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .preview-card:hover {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="wrinkle"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="prompt-edit"], [data-active-feature="hd-upscale"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"], [data-active-feature="print-extract"], [data-active-feature="buyer-show"], [data-active-feature="set-generate"]) .preview-frame,
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="wrinkle"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="prompt-edit"], [data-active-feature="hd-upscale"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"], [data-active-feature="print-extract"], [data-active-feature="buyer-show"], [data-active-feature="set-generate"]) .preview-gallery,
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="wrinkle"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="prompt-edit"], [data-active-feature="hd-upscale"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"], [data-active-feature="print-extract"], [data-active-feature="buyer-show"], [data-active-feature="set-generate"]) .preview-compare,
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="wrinkle"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="prompt-edit"], [data-active-feature="hd-upscale"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"], [data-active-feature="print-extract"], [data-active-feature="buyer-show"], [data-active-feature="set-generate"]) .copy-result-panel,
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="wrinkle"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="prompt-edit"], [data-active-feature="hd-upscale"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"], [data-active-feature="print-extract"], [data-active-feature="buyer-show"], [data-active-feature="set-generate"]) .task-recent-panel,
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="wrinkle"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="prompt-edit"], [data-active-feature="hd-upscale"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"], [data-active-feature="print-extract"], [data-active-feature="buyer-show"], [data-active-feature="set-generate"]) #preview-badge,
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="wrinkle"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="prompt-edit"], [data-active-feature="hd-upscale"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"], [data-active-feature="print-extract"], [data-active-feature="buyer-show"], [data-active-feature="set-generate"]) .shine-layer {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="wrinkle"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="prompt-edit"], [data-active-feature="hd-upscale"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"], [data-active-feature="print-extract"], [data-active-feature="buyer-show"], [data-active-feature="set-generate"]) .detail-page-latest-panel {
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="wrinkle"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="prompt-edit"], [data-active-feature="hd-upscale"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"], [data-active-feature="print-extract"], [data-active-feature="buyer-show"], [data-active-feature="set-generate"]) .preview-card {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Outfit recommendations use the same single-surface preview lifecycle as clothes-on-model. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .preview-frame,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .preview-gallery,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .preview-compare,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .copy-result-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .task-recent-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] #preview-badge,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .shine-layer {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .detail-page-latest-panel {
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .preview-card {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

.wrinkle-latest-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 12px;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.wrinkle-latest-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 34px;
  padding: 8px 12px 2px;
}

.wrinkle-latest-toolbar span {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  color: #252b3c;
  font-size: 15px;
  font-weight: 560;
}

.wrinkle-latest-toolbar small {
  color: #8a91a3;
  font-size: 12px;
  font-weight: 500;
}

.wrinkle-latest-toolbar div {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.wrinkle-latest-toolbar button {
  min-height: 32px;
  padding: 0 14px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  color: #475569;
  background: #ffffff;
  box-shadow: none;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
}

.wrinkle-latest-toolbar button[data-feature-latest-more],
.wrinkle-latest-toolbar button[data-wrinkle-latest-more] {
  color: #334155;
  border-color: #cbd5e1;
  background: #f8fafc;
}

.wrinkle-latest-toolbar button[data-feature-latest-clear],
.wrinkle-latest-toolbar button[data-wrinkle-latest-clear] {
  color: #64748b;
  border-color: #e2e8f0;
  background: #ffffff;
}

.wrinkle-latest-toolbar button:hover {
  color: #111827;
  border-color: #94a3b8;
  background: #f8fafc;
}

.wrinkle-latest-toolbar button:disabled {
  cursor: default;
  opacity: 0.45;
}

.wrinkle-latest-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-template-rows: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.wrinkle-latest-card {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  padding: 6px;
  border: 1px solid rgba(226, 230, 242, 0.82);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  cursor: zoom-in;
}

.wrinkle-latest-card:hover {
  border-color: rgba(85, 114, 216, 0.34);
  box-shadow: 0 8px 18px rgba(38, 45, 74, 0.07);
}

.wrinkle-latest-card:disabled {
  cursor: not-allowed;
}

.wrinkle-latest-open {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: inherit;
  background: transparent;
  cursor: inherit;
}

.wrinkle-latest-delete {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 6;
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  color: #fff;
  background: rgba(30, 35, 52, 0.72);
  box-shadow: 0 8px 18px rgba(30, 35, 52, 0.18);
  cursor: pointer;
  opacity: 0;
  transform: translateY(-3px) scale(0.92);
  transition: opacity 160ms ease, transform 160ms ease, background 160ms ease;
}

.wrinkle-latest-delete .lucide {
  width: 15px;
  height: 15px;
  stroke-width: 2.4;
}

.wrinkle-latest-card:hover .wrinkle-latest-delete,
.wrinkle-latest-delete:focus-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.wrinkle-latest-delete:hover {
  background: #ef3f68;
}

.wrinkle-running-card {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto auto auto;
  gap: 10px;
  padding: 12px;
  color: #2f3748;
  background:
    radial-gradient(circle at 50% 22%, rgba(255, 255, 255, 0.95), transparent 30%),
    linear-gradient(145deg, #f7f8fc, #edf1f8 48%, #f9fafc);
  box-shadow: inset 0 0 0 1px rgba(222, 228, 240, 0.9), 0 10px 22px rgba(35, 43, 68, 0.08);
  cursor: default;
}

.wrinkle-running-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg, transparent 0%, rgba(255, 255, 255, 0.72) 43%, transparent 62%);
  background-size: 220% 100%;
  animation: wrinkleRunningShine 1.8s ease-in-out infinite;
  pointer-events: none;
}

.wrinkle-running-aura {
  position: absolute;
  left: 50%;
  top: 28%;
  width: 86px;
  height: 86px;
  border-radius: 999px;
  border: 1px solid rgba(121, 139, 176, 0.2);
  transform: translate(-50%, -50%);
  animation: wrinkleRunningPulse 1.9s ease-in-out infinite;
  pointer-events: none;
}

.wrinkle-running-core {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  min-height: 0;
  text-align: center;
}

.wrinkle-running-spinner {
  position: relative;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.74);
  box-shadow: 0 8px 20px rgba(77, 96, 128, 0.08);
}

.wrinkle-running-spinner i {
  display: block;
  width: 30px;
  height: 30px;
  border: 3px solid rgba(126, 148, 186, 0.22);
  border-top-color: #6f86bd;
  border-radius: 999px;
  animation: spin 0.9s linear infinite;
}

.wrinkle-running-core strong {
  font-size: 16px;
  font-weight: 620;
}

.wrinkle-running-core small {
  max-width: 220px;
  color: #667085;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
}

.wrinkle-running-info {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 5px;
  padding: 8px 9px;
  border-radius: 8px;
  border: 1px solid rgba(220, 226, 238, 0.92);
  background: rgba(255, 255, 255, 0.72);
}

.wrinkle-running-info span {
  overflow: hidden;
  color: #4f5a6e;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wrinkle-running-progress {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.wrinkle-running-progress span {
  display: block;
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(215, 223, 236, 0.95);
}

.wrinkle-running-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #7f95ca, #b5c5e8);
  transition: width 260ms ease;
}

.wrinkle-running-progress em {
  color: #526078;
  font-size: 11px;
  font-style: normal;
  font-weight: 620;
}

.work-running-card .wrinkle-running-progress {
  grid-template-columns: minmax(0, 1fr);
  gap: 3px;
  justify-items: stretch;
}

.work-running-card .wrinkle-running-progress span {
  width: 100%;
}

.work-running-card .wrinkle-running-progress em {
  justify-self: center;
  width: 100%;
  color: #667085;
  font-size: 10px;
  line-height: 1;
  text-align: center;
}

.wrinkle-compensation-badge {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 3px;
  padding: 7px 8px;
  border: 1px solid rgba(211, 219, 234, 0.95);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.66);
}

.work-running-card .work-compensation-badge {
  align-self: auto;
  gap: 2px;
  padding: 0 4px;
  border: 0;
  border-radius: 0;
  margin-top: 7px;
  background: transparent;
}

.wrinkle-compensation-badge b {
  color: #46546a;
  font-size: 11px;
  font-weight: 650;
}

.wrinkle-compensation-badge span {
  color: #667085;
  font-size: 10.5px;
  font-weight: 500;
  line-height: 1.35;
}

.wrinkle-latest-thumb {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  border-radius: 6px;
  background: #f5f7fb;
}

.wrinkle-latest-thumb img,
.wrinkle-latest-thumb .work-image-empty {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  border: 0;
  background: transparent;
}

.wrinkle-latest-state {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  color: #fff;
  text-align: center;
  background: rgba(27, 32, 49, 0.56);
}

.wrinkle-latest-state .lucide {
  width: 22px;
  height: 22px;
}

.wrinkle-latest-state.is-running .lucide {
  animation: spin 1s linear infinite;
}

.wrinkle-latest-state strong {
  font-size: 12px;
  font-weight: 560;
}

.wrinkle-latest-state small {
  display: -webkit-box;
  max-width: calc(100% - 16px);
  overflow: hidden;
  color: rgba(255, 255, 255, 0.86);
  font-size: 10.5px;
  font-weight: 500;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.wrinkle-latest-empty {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  min-height: 0;
  color: #8b92a5;
  text-align: center;
}

.wrinkle-latest-empty strong {
  color: #4b5368;
  font-size: 18px;
  font-weight: 560;
}

.wrinkle-latest-empty small {
  font-size: 13px;
  font-weight: 500;
}

.wrinkle-latest-showcase-empty {
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 8px 10px 14px;
  place-items: stretch;
  align-content: stretch;
}

.wrinkle-latest-showcase-empty .set-preview-board {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 10px;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 12px;
  border: 1px solid rgba(226, 230, 242, 0.92);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.74);
  box-shadow: 0 12px 28px rgba(42, 51, 82, 0.06);
}

.wrinkle-latest-showcase-empty .set-preview-board-head {
  display: grid;
  gap: 3px;
  min-width: 0;
  text-align: left;
}

.wrinkle-latest-showcase-empty .set-preview-board-head strong {
  overflow: hidden;
  color: #273044;
  font-size: 14px;
  font-weight: 620;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wrinkle-latest-showcase-empty .set-preview-board-head small {
  display: -webkit-box;
  overflow: hidden;
  color: #7c8497;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.wrinkle-latest-showcase-empty .set-preview-layout {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, 1fr);
  gap: 10px;
  min-width: 0;
  min-height: 0;
}

.wrinkle-latest-showcase-empty .set-preview-divider {
  position: absolute;
  left: calc(50% - 1px);
  top: 50%;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid rgba(209, 216, 232, 0.92);
  border-radius: 999px;
  color: #73809a;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 6px 14px rgba(42, 51, 82, 0.1);
  transform: translate(-50%, -50%);
}

.wrinkle-latest-showcase-empty .set-preview-divider .lucide {
  width: 14px;
  height: 14px;
  stroke-width: 2.5;
}

.wrinkle-latest-showcase-empty .set-preview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
  min-height: 0;
}

.wrinkle-latest-showcase-empty .set-preview-card {
  position: relative;
  overflow: hidden;
  min-width: 0;
  min-height: 0;
  border: 1px solid rgba(218, 224, 238, 0.95);
  border-radius: 9px;
  background: #f6f8fc;
}

.wrinkle-latest-showcase-empty .set-preview-card[data-showcase-image] {
  cursor: zoom-in;
}

.wrinkle-latest-showcase-empty .set-preview-card-main {
  width: 100%;
  height: 100%;
}

.wrinkle-latest-showcase-empty .set-preview-card img {
  display: block;
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
  object-position: center;
}

.wrinkle-latest-showcase-empty .set-preview-card span {
  position: absolute;
  left: 6px;
  top: 6px;
  z-index: 1;
  max-width: calc(100% - 12px);
  overflow: hidden;
  padding: 3px 6px;
  border-radius: 999px;
  color: #fff;
  background: rgba(20, 24, 34, 0.58);
  font-size: 10px;
  font-weight: 600;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
  backdrop-filter: blur(8px);
}

.wrinkle-latest-showcase-empty .set-preview-card.is-empty {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 6px;
  padding: 14px;
  color: #7c8497;
  text-align: center;
}

.wrinkle-latest-showcase-empty .set-preview-card.is-empty strong {
  color: #30384d;
  font-size: 13px;
  font-weight: 620;
}

.wrinkle-latest-showcase-empty .set-preview-card.is-empty small {
  max-width: 120px;
  font-size: 10px;
  line-height: 1.35;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-board .set-preview-board-head {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 52px;
  padding: 0 4px 10px;
  border-bottom: 1px solid rgba(128, 137, 160, 0.16);
}

.wrinkle-latest-showcase-empty .feature-image-showcase-logo {
  position: absolute;
  left: 2px;
  top: 50%;
  width: 92px;
  height: auto;
  min-width: 0;
  min-height: 0;
  max-width: 92px;
  max-height: 16px;
  object-fit: contain;
  object-position: left center;
  transform: translateY(-70%);
}

.wrinkle-latest-showcase-empty .feature-image-showcase-heading {
  display: grid;
  gap: 3px;
  min-width: 0;
  justify-items: center;
  text-align: center;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-heading strong {
  max-width: min(42vw, 420px);
  font-size: 16px;
  font-weight: 600;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-heading small {
  max-width: min(50vw, 560px);
  font-size: 10.5px;
  font-weight: 400;
  white-space: normal;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-layout,
.wrinkle-latest-showcase-empty .feature-image-showcase-layout.has-pair-dividers {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 44px;
  min-width: 0;
  min-height: 0;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-layout::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 4%;
  bottom: 4%;
  z-index: 2;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(113, 102, 222, 0.34), transparent);
  transform: translateX(-50%);
  pointer-events: none;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-layout.has-pair-dividers::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 3;
  width: 5px;
  height: 5px;
  border: 1.5px solid rgba(113, 102, 222, 0.34);
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(113, 102, 222, 0.06);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-group {
  position: relative;
  min-width: 0;
  min-height: 0;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-group-grid {
  display: grid;
  width: 100%;
  height: 100%;
  min-height: 0;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-group.is-single .feature-image-showcase-group-grid,
.wrinkle-latest-showcase-empty .feature-image-showcase-group.count-0 {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
}

.wrinkle-latest-showcase-empty .feature-image-showcase-group.is-single-large {
  align-self: stretch;
  width: 100%;
  height: 100%;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-group.is-single-large .feature-image-showcase-group-grid,
.wrinkle-latest-showcase-empty .feature-image-showcase-group.is-single-large .set-preview-card {
  width: 100%;
  height: 100%;
  min-height: 0;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-group.count-2 {
  align-self: start;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-group.count-2 .feature-image-showcase-group-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: auto;
  align-content: start;
  height: auto;
  gap: 10px;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-group.count-2 .set-preview-card {
  aspect-ratio: 3 / 4;
  height: auto;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-group.count-3 .feature-image-showcase-group-grid,
.wrinkle-latest-showcase-empty .feature-image-showcase-group.count-4 .feature-image-showcase-group-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-group .set-preview-card {
  width: 100%;
  height: 100%;
  border: 0;
}

.wrinkle-latest-showcase-empty .feature-image-pair-arrow {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 5;
  display: grid;
  place-items: center;
  width: 16px;
  height: 16px;
  border: 0;
  border-radius: 999px;
  color: #767d90;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 2px 6px rgba(36, 42, 62, 0.08);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.wrinkle-latest-showcase-empty .feature-image-pair-arrow .lucide {
  width: 9px;
  height: 9px;
  stroke-width: 2;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-layout.has-center-divider .feature-image-pair-arrow {
  display: none;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-group.count-3 .feature-image-pair-arrow.pair-1,
.wrinkle-latest-showcase-empty .feature-image-showcase-group.count-4 .feature-image-pair-arrow.pair-1 {
  top: 24.25%;
}

.wrinkle-latest-showcase-empty .feature-image-showcase-group.count-4 .feature-image-pair-arrow.pair-2 {
  top: 75.75%;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="pet-product-main-image"]) .detail-page-latest-panel {
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  position: relative;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="pet-product-main-image"]) .preview-column {
  position: relative;
  z-index: 6;
  overflow: visible !important;
}

.official-material-layer {
  position: absolute;
  inset: 0 0 0 -38px;
  z-index: 3;
  pointer-events: none;
  overflow: visible;
}

.official-material-layer::before {
  content: none;
}

.official-material-tab {
  position: absolute;
  left: 0;
  top: 50%;
  z-index: 3;
  display: grid;
  place-items: center;
  gap: 10px;
  width: 48px;
  min-height: 206px;
  padding: 18px 8px;
  border: 1px solid rgba(211, 216, 230, 0.98);
  border-radius: 18px;
  color: #4f586b;
  background: linear-gradient(90deg, #ffffff 0%, #f9fafc 100%);
  box-shadow: 0 8px 22px rgba(42, 51, 82, 0.08);
  cursor: pointer;
  overflow: visible;
  pointer-events: auto;
  transform: translateY(-50%);
  transition: color 180ms ease, background 180ms ease, box-shadow 180ms ease, transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.official-material-tab:hover,
.official-material-layer.is-open .official-material-tab {
  color: #4f46e5;
  border-color: rgba(113, 125, 232, 0.58);
  background: linear-gradient(90deg, #ffffff, #f6f7ff);
  box-shadow: 0 12px 28px rgba(82, 91, 150, 0.12);
  transform: translate(2px, -50%);
}

.official-material-tab .lucide {
  width: 18px;
  height: 18px;
  stroke-width: 2.2;
}

.official-material-tab span {
  display: block;
  writing-mode: vertical-rl;
  letter-spacing: 0;
  overflow: visible;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.18;
}

.official-material-drawer {
  position: fixed;
  left: var(--official-material-left, clamp(380px, 20vw, 520px));
  top: 84px;
  bottom: 42px;
  width: calc(100vw - var(--official-material-left, clamp(380px, 20vw, 520px)) - 32px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 14px;
  padding: 18px 20px 18px;
  border: 1px solid rgba(224, 229, 241, 0.96);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.985);
  box-shadow: 0 18px 42px rgba(42, 51, 82, 0.1), 0 4px 16px rgba(42, 51, 82, 0.06);
  opacity: 0;
  pointer-events: none;
  transform: translateX(-46px) scale(0.985);
  transform-origin: left center;
  transition:
    opacity 240ms ease,
    transform 420ms cubic-bezier(0.18, 0.82, 0.2, 1);
}

.official-material-layer.is-open .official-material-drawer {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(0) scale(1);
}

.official-material-head {
  display: grid;
  grid-template-columns: minmax(170px, auto) minmax(0, 1fr) 32px;
  align-items: center;
  gap: 12px;
}

.official-material-title {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.official-material-head strong {
  display: block;
  color: #1f2937;
  font-size: 17px;
  font-weight: 620;
}

.official-material-head small {
  display: block;
  margin-top: 5px;
  color: #7a8397;
  font-size: 12px;
  font-weight: 500;
}

.official-material-head button {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid #e5eaf3;
  border-radius: 999px;
  color: #667085;
  background: #fff;
  cursor: pointer;
}

.official-material-head button:hover {
  color: #111827;
  border-color: #cbd5e1;
  background: #f8fafc;
}

.official-material-head button .lucide {
  width: 16px;
  height: 16px;
}

.official-material-category-row {
  display: flex;
  align-items: center;
  justify-self: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  max-width: 100%;
  min-height: 32px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  scrollbar-width: none;
}

.official-material-category-row::-webkit-scrollbar {
  display: none;
}

.official-material-category-row button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: auto;
  min-width: 42px;
  height: 30px;
  padding: 0 11px;
  border: 1px solid #e6eaf2;
  border-radius: 999px;
  color: #6b7280;
  background: #fff;
  box-shadow: none;
  cursor: pointer;
  font-size: 13px;
  font-weight: 450;
  line-height: 1;
  white-space: nowrap;
  transition: color 160ms ease, border-color 160ms ease, background 160ms ease;
}

.official-material-category-row button:hover {
  color: #374151;
  border-color: #d8deeb;
  background: #f7f8fb;
}

.official-material-category-row button.selected {
  color: #31384a;
  border-color: #dfe4f3;
  background: #f2f5fb;
  box-shadow: none;
}

.official-material-grid {
  display: block;
  min-height: 0;
  overflow: auto;
  contain: layout paint;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding: 2px 2px 8px;
  scrollbar-width: thin;
  scrollbar-color: rgba(148, 163, 184, 0.72) rgba(241, 245, 249, 0.75);
}

.official-material-columns {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  align-items: start;
  gap: 10px;
}

.official-material-grid::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}

.official-material-grid::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(241, 245, 249, 0.72);
}

.official-material-grid::-webkit-scrollbar-thumb {
  border: 2px solid rgba(241, 245, 249, 0.72);
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.76);
}

.official-material-grid::-webkit-scrollbar-thumb:hover {
  background: rgba(100, 116, 139, 0.82);
}

.official-material-card {
  display: block;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  color: #374151;
  background: transparent;
  cursor: pointer;
  transition: opacity 160ms ease;
}

.official-material-card:hover {
  opacity: 0.88;
}

.official-material-card.selected {
  opacity: 0.68;
}

.official-material-card:focus-visible {
  outline: 2px solid rgba(79, 70, 229, 0.72);
  outline-offset: 2px;
}

.official-material-card img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 6px;
  background: transparent;
  object-fit: contain;
}

.official-material-card span {
  display: none;
  overflow: hidden;
  color: #475569;
  font-size: 12px;
  font-weight: 520;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.official-material-empty {
  grid-column: 1 / -1;
  display: grid;
  place-items: center;
  align-content: center;
  min-height: 260px;
  color: #8a92a4;
  text-align: center;
}

.official-material-empty strong {
  color: #4b5563;
  font-size: 16px;
  font-weight: 560;
}

.official-material-empty small {
  margin-top: 6px;
  font-size: 12px;
  font-weight: 500;
}

@keyframes wrinkleRunningShine {
  0% {
    background-position: 160% 0;
  }
  100% {
    background-position: -80% 0;
  }
}

@keyframes wrinkleRunningPulse {
  0%,
  100% {
    opacity: 0.42;
    transform: translate(-50%, -50%) scale(0.88);
  }
  50% {
    opacity: 0.86;
    transform: translate(-50%, -50%) scale(1.08);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}

/* Official material handle must sit on the original preview divider, above the preview surface. */
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .official-material-layer {
  inset: 0 auto 0 -38px !important;
  width: 0 !important;
  z-index: 12 !important;
  overflow: visible !important;
  pointer-events: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .preview-card {
  contain: none !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .official-material-layer.is-open {
  width: calc(100% + 38px) !important;
  pointer-events: auto !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .official-material-tab {
  left: 0 !important;
  z-index: 13 !important;
  width: 48px !important;
  min-height: 206px !important;
  border: 1px solid rgba(211, 216, 230, 0.98) !important;
  border-radius: 18px !important;
  color: #4f586b !important;
  background: linear-gradient(90deg, #ffffff 0%, #f9fafc 100%) !important;
  box-shadow: 0 8px 22px rgba(42, 51, 82, 0.08) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .official-material-tab .lucide,
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .official-material-tab span {
  color: #4f586b !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .official-material-drawer {
  z-index: 14 !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .official-material-layer.is-open .official-material-drawer {
  left: var(--official-material-left, clamp(380px, 20vw, 520px)) !important;
  top: 84px !important;
  bottom: 42px !important;
  width: calc(100vw - var(--official-material-left, clamp(380px, 20vw, 520px)) - 32px) !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .background-official-material-button {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) 14px;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 64px;
  margin-top: 10px;
  padding: 9px 14px 9px 11px;
  border: 1px solid rgba(45, 166, 139, 0.36) !important;
  border-radius: 16px;
  color: #176d5d !important;
  background: linear-gradient(135deg, #e7faf4 0%, #f3fcf8 58%, #eaf7ff 100%) !important;
  box-shadow: 0 10px 22px rgba(39, 139, 119, 0.12) !important;
  font-family: inherit;
  cursor: pointer;
  text-align: left;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .background-official-material-button:hover,
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .background-official-material-button.is-open {
  border-color: rgba(36, 151, 125, 0.54) !important;
  background: linear-gradient(135deg, #dcf7ee 0%, #effbf6 58%, #e2f4fc 100%) !important;
  box-shadow: 0 14px 28px rgba(39, 139, 119, 0.18) !important;
  transform: translateY(-1px);
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .background-official-material-button:focus-visible {
  outline: 3px solid rgba(45, 166, 139, 0.18);
  outline-offset: 2px;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .background-official-material-button.has-selection {
  border-color: rgba(36, 151, 125, 0.62) !important;
  box-shadow: 0 0 0 3px rgba(39, 169, 141, 0.1), 0 12px 24px rgba(39, 139, 119, 0.16) !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .background-official-material-icon {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 11px;
  color: #ffffff;
  background: linear-gradient(135deg, #27a98d 0%, #47bda5 100%);
  box-shadow: 0 6px 14px rgba(39, 169, 141, 0.22);
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .background-official-material-icon .lucide,
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .background-official-material-button > .lucide {
  width: 17px;
  height: 17px;
  stroke-width: 2.2;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .background-official-material-button > .lucide {
  color: #289b83;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .background-official-material-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .background-official-material-copy strong {
  overflow: hidden;
  color: #135f53;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="clothes-on-model"], [data-active-feature="free-match"], [data-active-feature="pet-product-main-image"]) .background-official-material-copy small {
  overflow: hidden;
  color: #50786f;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Keep wrinkle upload visually aligned with background and the unified upload card. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload,
body[data-active-feature="wrinkle"] #product-upload {
  min-height: 122px !important;
  padding: 14px 13px !important;
  gap: 10px !important;
  border: 1px dashed rgba(220, 213, 244, 0.78) !important;
  border-radius: 18px !important;
  color: var(--ink) !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload:focus-visible,
body[data-active-feature="wrinkle"] #product-upload:hover,
body[data-active-feature="wrinkle"] #product-upload:focus-visible {
  border-color: var(--line) !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload .upload-icon,
body[data-active-feature="wrinkle"] #product-upload .upload-icon {
  width: 42px !important;
  height: 42px !important;
  padding: 0 !important;
  border-radius: 12px !important;
  color: var(--purple) !important;
  background: var(--purple-soft) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload .upload-icon .lucide,
body[data-active-feature="wrinkle"] #product-upload .upload-icon .lucide {
  width: 25px !important;
  height: 25px !important;
  stroke-width: 2.25 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload .upload-copy,
body[data-active-feature="wrinkle"] #product-upload .upload-copy {
  gap: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload strong,
body[data-active-feature="wrinkle"] #product-upload strong {
  margin: 0 0 3px !important;
  color: var(--ink) !important;
  font-size: 15px !important;
  line-height: normal !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #product-upload small,
body[data-active-feature="wrinkle"] #product-upload small {
  max-width: none !important;
  color: var(--muted) !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
  font-weight: 400 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .upload-column:has(.single-upload-preview-strip:not([hidden])) #product-upload,
body[data-active-feature="wrinkle"] .upload-column:has(.single-upload-preview-strip:not([hidden])) #product-upload {
  grid-template-columns: auto minmax(0, 1fr) 82px !important;
  align-items: center !important;
  justify-items: stretch !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .single-upload-preview-strip,
body[data-active-feature="wrinkle"] .single-upload-preview-strip {
  display: grid !important;
  justify-content: end !important;
  width: 82px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .single-upload-preview-card,
body[data-active-feature="wrinkle"] .single-upload-preview-card {
  width: 82px !important;
  height: 82px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] #upload-stack:not(.image-upload-stack),
body[data-active-feature="wrinkle"] #upload-stack:not(.image-upload-stack) {
  display: none !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="white"],
  [data-active-feature="colors"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="outpaint"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="pattern-transfer"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="set-generate"],
  [data-active-feature="buyer-show"],
  [data-active-feature="buyer-try-on"]
) .upload-column:has(.single-upload-preview-strip:not([hidden])) #product-upload {
  grid-template-columns: auto minmax(0, 1fr) 82px !important;
  align-items: center !important;
  justify-items: stretch !important;
  text-align: left !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="background"],
  [data-active-feature="white"],
  [data-active-feature="colors"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="outpaint"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="pattern-transfer"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="set-generate"],
  [data-active-feature="buyer-show"],
  [data-active-feature="buyer-try-on"]
) #upload-stack:not(.image-upload-stack) {
  display: none !important;
}

.multi-upload-preview-card .upload-stack-delete {
  right: -8px !important;
  top: -8px !important;
  z-index: 4 !important;
  width: 22px !important;
  height: 22px !important;
  padding: 0 !important;
  border: 2px solid #fff !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: linear-gradient(135deg, #ff3158, #d71942) !important;
  background-image: linear-gradient(135deg, #ff3158, #d71942) !important;
  box-shadow: 0 8px 18px rgba(215, 25, 66, 0.28) !important;
  opacity: 0.96 !important;
  transform: none !important;
  backdrop-filter: none !important;
}

.multi-upload-preview-card {
  overflow: visible !important;
}

.multi-upload-preview-card img {
  border-radius: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode .multi-upload-preview-strip {
  overflow-y: visible !important;
  padding-top: 8px !important;
  padding-right: 8px !important;
}

.single-upload-preview-strip .single-upload-preview-card {
  overflow: hidden !important;
}

.single-upload-preview-card .upload-stack-delete {
  display: none !important;
}

/* Pet buyer-show mobile: a single uploaded image must still have a clear action. */
html[data-mobile-workbench="true"][data-industry="pet"] body[data-active-feature="buyer-show"]
  .single-upload-preview-card .upload-stack-delete {
  display: grid !important;
  place-items: center !important;
  width: 24px !important;
  height: 24px !important;
  opacity: 1 !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode .single-upload-preview-strip {
  overflow: hidden !important;
  padding-top: 0 !important;
  padding-right: 0 !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="buyer-try-on"]
) .upload-column:has(.multi-upload-preview-strip:not([hidden])) #product-upload,
body:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="buyer-try-on"]
) .upload-column:has(.multi-upload-preview-strip:not([hidden])) #product-upload {
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-content: start !important;
  align-items: center !important;
  justify-items: stretch !important;
  min-height: 214px !important;
  padding: 14px !important;
  gap: 12px !important;
  text-align: left !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="buyer-try-on"]
) .multi-upload-preview-strip,
body:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="buyer-try-on"]
) .multi-upload-preview-strip {
  display: flex !important;
  overflow-y: visible !important;
}

.single-upload-preview-card .upload-stack-delete .lucide,
.multi-upload-preview-card .upload-stack-delete .lucide {
  width: 12px !important;
  height: 12px !important;
  stroke-width: 2.8 !important;
}

.single-upload-preview-card:hover .upload-stack-delete,
.single-upload-preview-card .upload-stack-delete:focus-visible,
.multi-upload-preview-card:hover .upload-stack-delete,
.multi-upload-preview-card .upload-stack-delete:focus-visible {
  color: #fff !important;
  background: linear-gradient(135deg, #ff4f6d, #c9153b) !important;
  opacity: 1 !important;
  transform: translateY(-1px) scale(1.04) !important;
}

body.library-focus-mode .task-recent-panel,
body.library-focus-mode .task-recent-panel[hidden] {
  display: none !important;
}

body.library-focus-mode .feature-experience,
body.library-focus-mode .task-panel,
body.library-focus-mode .unified-material-groups,
body.library-focus-mode .unified-material-main {
  border: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}

body.library-focus-mode .unified-material-groups {
  border-right: 1px solid #edf0f7 !important;
}

body.library-focus-mode .material-library-shell {
  min-height: calc(100vh - 126px) !important;
}

body.library-focus-mode .unified-material-library {
  min-height: calc(100vh - 230px) !important;
  grid-template-columns: 248px minmax(0, 1fr) !important;
  gap: 0 28px !important;
}

body.library-focus-mode .material-library-tabs {
  display: flex !important;
  gap: 28px !important;
  align-items: flex-end !important;
  border-bottom: 1px solid #edf0f7 !important;
}

body.library-focus-mode .material-library-tabs button {
  position: relative !important;
  flex: 0 0 auto !important;
  min-height: 56px !important;
  padding: 0 2px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #637089 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.library-focus-mode .material-library-tabs button::after {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  bottom: -1px !important;
  left: 0 !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: transparent !important;
}

body.library-focus-mode .material-library-tabs button.selected {
  color: #1f3fb8 !important;
}

body.library-focus-mode .material-library-tabs button.selected::after {
  background: #3f63f3 !important;
}

body.library-focus-mode .material-library-tabs .lucide {
  width: 28px !important;
  height: 28px !important;
  padding: 6px !important;
  border-radius: 9px !important;
  color: #68748a !important;
  background: #f4f6fb !important;
}

body.library-focus-mode .material-library-tabs button.selected .lucide {
  color: #fff !important;
  background: #3f63f3 !important;
}

body.library-focus-mode .material-library-tabs strong {
  color: inherit !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

body.library-focus-mode .material-library-tabs small {
  color: #7c879a !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

body.library-focus-mode .unified-material-overview {
  align-items: flex-start !important;
  padding: 0 0 20px !important;
}

body.library-focus-mode .unified-material-title-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  gap: 10px !important;
}

body.library-focus-mode .unified-material-overview strong {
  color: #182033 !important;
  font-size: 26px !important;
  font-weight: 700 !important;
}

body.library-focus-mode .unified-material-overview span {
  color: #647084 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

body.library-focus-mode .unified-material-overview small {
  color: #667085 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}

body.library-focus-mode .material-overview-upload {
  min-height: 38px !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 9px !important;
  color: #fff !important;
  background: #3158e8 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  box-shadow: 0 10px 22px rgba(49, 88, 232, 0.16) !important;
}

body.library-focus-mode .unified-material-groups {
  padding: 22px 20px 0 0 !important;
  border-right: 1px solid #edf0f7 !important;
}

body.library-focus-mode .unified-material-section-head {
  padding-bottom: 14px !important;
  border-bottom: 1px solid #edf0f7 !important;
  align-items: flex-start !important;
}

body.library-focus-mode .material-group-add-button {
  display: inline-flex !important;
  min-height: 34px !important;
  padding: 0 12px !important;
  border: 1px solid #dfe5f2 !important;
  border-radius: 9px !important;
  color: #536075 !important;
  background: #fff !important;
  font-size: 12px !important;
  font-weight: 480 !important;
  box-shadow: none !important;
}

body.library-focus-mode .material-group-add-button:hover,
body.library-focus-mode .material-group-add-button:focus-visible {
  border-color: #cbd5e1 !important;
  background: #f8fafc !important;
}

body.library-focus-mode .unified-material-group-list {
  padding: 12px 0 0 !important;
  border-top: 0 !important;
}

body.library-focus-mode .unified-material-group-list button {
  min-height: 40px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  font-size: 14px !important;
  font-weight: 460 !important;
}

body.library-focus-mode .unified-material-group-list button:hover,
body.library-focus-mode .unified-material-group-list button.selected {
  color: #2b4fc7 !important;
  background: transparent !important;
}

body.library-focus-mode .unified-material-group-list button.selected span {
  font-weight: 480 !important;
}

body.library-focus-mode .unified-material-group-list button small {
  background: #f1f4fb !important;
}

body.library-focus-mode .unified-material-main {
  padding: 22px 0 0 !important;
}

body.library-focus-mode .unified-material-toolbar {
  padding-bottom: 14px !important;
  border-bottom: 1px solid #edf0f7 !important;
  align-items: flex-start !important;
}

body.library-focus-mode .unified-material-toolbar strong,
body.library-focus-mode .unified-material-section-head strong {
  color: #20283a !important;
  font-size: 15px !important;
  font-weight: 580 !important;
}

body.library-focus-mode .unified-material-toolbar small,
body.library-focus-mode .unified-material-section-head small {
  color: #7c879a !important;
  font-size: 12px !important;
}

body.library-focus-mode .unified-material-empty-inline {
  min-height: 430px !important;
  background: #fff !important;
  gap: 12px !important;
}

body.library-focus-mode .unified-material-empty-inline strong {
  color: #20283a !important;
  font-size: 16px !important;
  font-weight: 560 !important;
}

body.library-focus-mode .unified-material-empty-inline em {
  color: #8a95a8 !important;
  font-size: 13px !important;
  font-weight: 420 !important;
}

body.library-focus-mode .material-empty-upload-button {
  min-height: 36px !important;
  padding: 0 18px !important;
  border: 1px solid #d8e0ef !important;
  border-radius: 9px !important;
  color: #3359d4 !important;
  background: #fff !important;
  font-size: 13px !important;
  font-weight: 480 !important;
  box-shadow: 0 6px 16px rgba(32, 64, 154, 0.06) !important;
}

body.library-focus-mode .material-empty-upload-button:hover,
body.library-focus-mode .material-empty-upload-button:focus-visible {
  border-color: #bccbff !important;
  background: #f7f9ff !important;
}

body.library-focus-mode .unified-material-grid {
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
  gap: 20px !important;
}

body.library-focus-mode .unified-material-card strong {
  color: #4b5568 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

body.library-focus-mode .unified-material-card small {
  display: none !important;
}

body.library-focus-mode .unified-material-main.is-dragover {
  outline: 2px dashed #3f63f3 !important;
  outline-offset: 8px !important;
  background: #f8faff !important;
}

body.library-focus-mode .material-toolbar-button {
  display: inline-flex !important;
  min-height: 34px !important;
  padding: 0 12px !important;
  border: 1px solid #dfe5f2 !important;
  border-radius: 9px !important;
  color: #536075 !important;
  background: #fff !important;
  font-size: 12px !important;
  font-weight: 480 !important;
  box-shadow: none !important;
}

body.library-focus-mode .material-toolbar-button.primary {
  border-color: #cdd8ff !important;
  color: #2f55d4 !important;
  background: #f4f7ff !important;
  box-shadow: none !important;
}

body.library-focus-mode .material-toolbar-button.danger {
  border-color: #f3d8dc !important;
  color: #c24a55 !important;
  background: #fffafa !important;
}

body.library-focus-mode .material-toolbar-button:hover,
body.library-focus-mode .material-toolbar-button:focus-visible {
  border-color: #cbd5e1 !important;
  background: #f8fafc !important;
}

body.library-focus-mode .material-toolbar-button.primary:hover,
body.library-focus-mode .material-toolbar-button.primary:focus-visible {
  border-color: #b8c7ff !important;
  background: #eef3ff !important;
}

body.library-focus-mode .material-toolbar-button.danger:hover,
body.library-focus-mode .material-toolbar-button.danger:focus-visible {
  border-color: #efc8cf !important;
  background: #fff4f5 !important;
}

body.library-focus-mode .unified-material-card .small-icon-button {
  top: 8px !important;
  right: 8px !important;
  width: 28px !important;
  height: 28px !important;
  border: 1px solid rgba(255, 255, 255, 0.7) !important;
  color: #fff !important;
  background: rgba(17, 24, 39, 0.44) !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18) !important;
  opacity: 0 !important;
  transform: translateY(-2px) !important;
}

body.library-focus-mode .unified-material-card:hover .small-icon-button,
body.library-focus-mode .unified-material-card .small-icon-button:focus-visible {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

body.library-focus-mode .unified-material-card .small-icon-button:hover {
  background: rgba(205, 44, 61, 0.9) !important;
}

/* Final top action polish: compact, plain controls. */
.top-actions {
  gap: 4px !important;
  min-height: 38px !important;
  padding: 2px !important;
  border-radius: 12px !important;
  background: #f5f7fb !important;
}

.top-actions .free-generate-button,
.top-actions .points-button,
.top-actions .need-request-button,
.top-actions .checkin-entry-button,
.top-actions .notify-button,
.top-actions .shop-button {
  gap: 6px !important;
  min-height: 34px !important;
  height: 34px !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 10px !important;
  color: #5b6475 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

.top-actions .free-generate-button {
  color: #4f46e5 !important;
  background: #ffffff !important;
  font-weight: 600 !important;
}

.top-actions .points-button {
  color: #5b6475 !important;
}

.top-actions .points-button strong {
  color: #4f46e5 !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
}

.top-actions .need-request-button {
  color: #334155 !important;
}

.top-actions .checkin-entry-button {
  color: #334155 !important;
}

.top-actions .notify-button {
  width: 34px !important;
  min-width: 34px !important;
  padding: 0 !important;
  background: transparent !important;
}

.top-actions .shop-button {
  min-width: 104px !important;
  background: #ffffff !important;
}

.top-actions .free-generate-button > .lucide:first-child,
.top-actions .points-button > .lucide:first-child,
.top-actions .need-request-button > .lucide:first-child,
.top-actions .checkin-entry-button > .lucide:first-child,
.top-actions .account-entry-icon {
  width: 18px !important;
  height: 18px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  stroke-width: 2 !important;
}

.top-actions .free-generate-button > .lucide:first-child {
  color: #4f46e5 !important;
}

.top-actions .points-button > .lucide:first-child,
.top-actions .need-request-button > .lucide:first-child,
.top-actions .checkin-entry-button > .lucide:first-child,
.top-actions .notify-button .lucide,
.top-actions .account-entry-icon {
  color: #6b7280 !important;
}

.top-actions .notify-button .lucide {
  width: 17px !important;
  height: 17px !important;
}

.top-actions .shop-button span {
  font-size: 12px !important;
}

.top-actions .shop-button b {
  max-width: 88px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.top-actions .shop-button small {
  display: none !important;
}

.top-actions .shop-button > .lucide:last-child {
  width: 13px !important;
  height: 13px !important;
}

.top-actions .shop-button:hover,
.top-actions .points-button:hover,
.top-actions .need-request-button:hover,
.top-actions .checkin-entry-button:hover,
.top-actions .notify-button:hover,
.top-actions .free-generate-button:hover {
  background: #ffffff !important;
  box-shadow: none !important;
  filter: none !important;
}

.top-actions .free-generate-button:hover {
  background: #ffffff !important;
}

/* Profile and avatar controls. */
.top-actions .account-entry-avatar,
.account-entry-avatar,
.account-profile-avatar,
.profile-avatar-edit span {
  display: inline-grid !important;
  place-items: center !important;
  overflow: hidden !important;
  flex: 0 0 auto !important;
  color: #6b7280 !important;
  background: #eef2f7 !important;
}

.top-actions .account-entry-avatar {
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
}

.account-entry-avatar img,
.account-profile-avatar img,
.profile-avatar-edit img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.account-entry-avatar .lucide {
  width: 15px !important;
  height: 15px !important;
}

.account-profile-head {
  grid-template-columns: 46px minmax(0, 1fr) 28px !important;
}

.account-profile-avatar .lucide {
  width: 22px !important;
  height: 22px !important;
}

.profile-card {
  width: min(780px, calc(100vw - 28px));
  max-height: calc(100vh - 40px);
  overflow: auto;
  padding: 22px !important;
}

.profile-center-head {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  margin-bottom: 18px;
}

.profile-center-head > div {
  min-width: 0;
}

.profile-center-head > div > span {
  display: block;
  margin-bottom: 4px;
  color: #8a94a8;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
}

.profile-center-head h2 {
  margin: 0;
  color: #172033;
  font-size: 24px;
  line-height: 1.15;
}

.profile-center-head p {
  margin: 7px 0 0;
  color: #667085;
  font-size: 13px;
  line-height: 1.5;
}

.profile-avatar-edit {
  position: relative;
  display: grid !important;
  place-items: center !important;
  width: 82px !important;
  height: 82px !important;
  min-height: 82px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 24px !important;
  color: #4b5568 !important;
  background: #eef3f8 !important;
  cursor: pointer;
  overflow: hidden;
}

.profile-avatar-edit span {
  display: grid;
  place-items: center;
  width: 82px;
  height: 82px;
  border-radius: 24px;
  overflow: hidden;
}

.profile-avatar-edit em {
  position: absolute;
  right: 6px;
  bottom: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 22px;
  padding: 0 7px;
  border-radius: 999px;
  color: #fff;
  background: rgba(17, 24, 39, 0.68);
  font-size: 11px;
  font-style: normal;
  font-weight: 600;
}

.profile-avatar-edit .lucide {
  width: 30px;
  height: 30px;
}

.profile-center-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 12px;
}

.profile-panel {
  min-width: 0;
  padding: 14px;
  border-radius: 14px;
  background: #f7f9fc;
}

.profile-panel-main {
  grid-row: span 2;
}

.profile-panel-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.profile-panel-title strong {
  color: #172033;
  font-size: 14px;
  line-height: 1.35;
}

.profile-panel-title small {
  color: #7b8495;
  font-size: 12px;
  line-height: 1.35;
  text-align: right;
}

.profile-form {
  display: grid;
  gap: 12px;
}

.profile-form label {
  display: grid;
  gap: 7px;
  color: #667085;
  font-size: 12px;
  font-weight: 650;
}

.profile-form input {
  width: 100%;
  height: 42px;
  border: 0;
  border-radius: 10px;
  padding: 0 12px;
  color: #172033;
  background: #fff;
  outline: none;
}

.profile-form input[readonly] {
  color: #667085;
  background: #edf1f6;
}

.profile-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.profile-stat-grid article {
  min-width: 0;
  padding: 12px;
  border-radius: 12px;
  background: #fff;
}

.profile-stat-grid article span {
  display: block;
  color: #7b8495;
  font-size: 12px;
  line-height: 1.3;
}

.profile-stat-grid article strong {
  display: block;
  margin-top: 7px;
  color: #172033;
  font-size: 16px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.profile-invite-row,
.profile-inline-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
}

.profile-invite-row {
  margin-bottom: 8px;
}

.profile-invite-row label {
  display: grid;
  gap: 7px;
  color: #667085;
  font-size: 12px;
  font-weight: 650;
}

.profile-invite-row input,
.profile-inline-action input {
  width: 100%;
  height: 38px;
  border: 0;
  border-radius: 10px;
  padding: 0 11px;
  color: #172033;
  background: #fff;
  outline: none;
}

.profile-invite-row input[readonly] {
  color: #667085;
  background: #edf1f6;
}

.profile-inline-action {
  margin-top: 8px;
}

.profile-inline-action button,
.profile-invite-row button {
  min-height: 38px !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 10px !important;
  color: #172033 !important;
  background: #e9eef5 !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  box-shadow: none !important;
}

.profile-inline-action button:disabled {
  color: #8a94a8 !important;
  cursor: not-allowed;
}

.profile-action-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.profile-action-grid button {
  display: grid;
  place-items: center;
  min-height: 70px;
  padding: 10px 6px;
  border: 0;
  border-radius: 12px;
  color: #172033;
  background: #fff;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.2;
  cursor: pointer;
}

.profile-action-grid button:hover {
  background: #eef3f8;
}

.profile-action-grid .lucide {
  width: 18px;
  height: 18px;
  margin-bottom: 6px;
  color: #637083;
}

#profile-message {
  grid-column: 1 / -1;
  min-height: 18px;
  color: #667085;
  font-size: 12px;
  line-height: 1.45;
}

.profile-card .profile-actions {
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
}

.profile-card .profile-actions button {
  min-width: 76px;
  min-height: 34px;
  padding: 0 16px !important;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 650;
}

.profile-card .profile-actions .create-button {
  min-width: 82px;
}

.profile-card .profile-actions .outline-button {
  color: #4f5869;
  background: #eef2f7;
  box-shadow: none;
}

.profile-detail-card {
  width: min(680px, calc(100vw - 28px));
  max-height: calc(100vh - 44px);
  overflow: auto;
  padding: 22px !important;
}

.profile-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

.profile-detail-head h2 {
  margin: 0;
  color: #172033;
  font-size: 22px;
  line-height: 1.2;
}

.profile-detail-head p {
  margin: 6px 0 0;
  color: #667085;
  font-size: 13px;
  line-height: 1.5;
}

.profile-detail-body {
  display: grid;
  gap: 12px;
}

.profile-detail-list {
  display: grid;
  gap: 8px;
}

.profile-detail-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border-radius: 12px;
  background: #f7f9fc;
}

.profile-detail-row strong,
.profile-detail-row b {
  display: block;
  color: #172033;
  font-size: 14px;
  line-height: 1.35;
}

.profile-detail-row small {
  display: block;
  margin-top: 4px;
  color: #7b8495;
  font-size: 12px;
  line-height: 1.35;
}

.profile-detail-row > div:last-child {
  text-align: right;
  white-space: nowrap;
}

.profile-detail-empty {
  display: grid;
  place-items: center;
  gap: 8px;
  min-height: 120px;
  border-radius: 14px;
  color: #667085;
  background: #f7f9fc;
  font-size: 13px;
}

.profile-detail-empty .lucide {
  width: 22px;
  height: 22px;
}

.profile-detail-empty.is-error {
  color: #b42318;
  background: #fff3f2;
}

.profile-benefit-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.profile-benefit-summary article {
  min-width: 0;
  padding: 12px;
  border-radius: 12px;
  background: #f7f9fc;
}

.profile-benefit-summary span {
  color: #7b8495;
  font-size: 12px;
}

.profile-benefit-summary strong {
  display: block;
  margin-top: 7px;
  color: #172033;
  font-size: 16px;
  overflow-wrap: anywhere;
}

.profile-benefit-list {
  display: grid;
  gap: 8px;
}

.profile-benefit-list span {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 12px;
  color: #4f5869;
  background: #f7f9fc;
  font-size: 13px;
}

.profile-benefit-list .lucide {
  width: 16px;
  height: 16px;
  color: #2f7d4c;
}

.profile-detail-form {
  display: grid;
  gap: 10px;
  padding: 12px;
  border-radius: 14px;
  background: #f7f9fc;
}

.profile-detail-form label {
  display: grid;
  gap: 7px;
  color: #667085;
  font-size: 12px;
  font-weight: 650;
}

.profile-detail-form input {
  width: 100%;
  height: 40px;
  border: 0;
  border-radius: 10px;
  padding: 0 12px;
  color: #172033;
  background: #fff;
  outline: none;
}

.profile-password-input {
  position: relative;
}

.profile-password-input input {
  padding-right: 44px;
}

.profile-password-input button {
  position: absolute;
  top: 50%;
  right: 6px;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  color: #667085;
  background: transparent;
  transform: translateY(-50%);
  cursor: pointer;
}

.profile-password-input button:hover {
  color: #4f46e5;
  background: #eef2ff;
}

.profile-password-input button .lucide {
  width: 17px;
  height: 17px;
}

.profile-detail-form small,
.profile-sub-head small {
  min-height: 18px;
  color: #667085;
  font-size: 12px;
}

.profile-detail-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.profile-detail-actions button,
.profile-detail-row button {
  min-height: 34px !important;
  padding: 0 14px !important;
  border-radius: 9px !important;
  font-size: 13px !important;
}

.profile-sub-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  color: #4f5869;
  background: #eef2f7;
  font-size: 13px;
  font-weight: 650;
}

@media (max-width: 720px) {
  .profile-card {
    padding: 18px !important;
  }

  .profile-center-grid {
    grid-template-columns: 1fr;
  }

  .profile-panel-main {
    grid-row: auto;
  }

  .profile-stat-grid,
  .profile-action-grid {
    grid-template-columns: 1fr;
  }

  .profile-invite-row,
  .profile-inline-action {
    grid-template-columns: 1fr;
  }
}

html[data-theme="dark"] .profile-detail-head h2,
html[data-theme="dark"] .profile-detail-row strong,
html[data-theme="dark"] .profile-detail-row b,
html[data-theme="dark"] .profile-benefit-summary strong {
  color: #f8fafc !important;
}

html[data-theme="dark"] .profile-detail-head p,
html[data-theme="dark"] .profile-detail-row small,
html[data-theme="dark"] .profile-detail-empty,
html[data-theme="dark"] .profile-benefit-summary span,
html[data-theme="dark"] .profile-detail-form label,
html[data-theme="dark"] .profile-detail-form small,
html[data-theme="dark"] .profile-sub-head small {
  color: #94a3b8 !important;
}

html[data-theme="dark"] .profile-detail-row,
html[data-theme="dark"] .profile-detail-empty,
html[data-theme="dark"] .profile-benefit-summary article,
html[data-theme="dark"] .profile-benefit-list span,
html[data-theme="dark"] .profile-detail-form,
html[data-theme="dark"] .profile-sub-head {
  color: #dbe4ff !important;
  background: rgba(15, 23, 42, 0.72) !important;
}

html[data-theme="dark"] .profile-detail-form input {
  color: #e5e7eb !important;
  background: rgba(2, 6, 23, 0.5) !important;
}

html[data-theme="dark"] .profile-password-input button:hover {
  color: #a5b4fc;
  background: rgba(99, 102, 241, 0.16);
}

.image-viewer-foot .outline-button,
.image-viewer-foot .danger-button,
.image-viewer-foot #image-viewer-add-library,
.image-viewer-foot #image-viewer-appeal,
.image-viewer-foot #image-viewer-download,
.image-viewer-foot #image-viewer-send-to,
.image-viewer-foot #image-viewer-remix {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 86px !important;
  min-height: 36px !important;
  padding: 0 12px !important;
  border: 1px solid #e8ecf3 !important;
  border-radius: 10px !important;
  color: #4f5b6f !important;
  background: #ffffff !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 480 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

.image-viewer-foot [hidden] {
  display: none !important;
}

.image-viewer-foot .outline-button .lucide,
.image-viewer-foot .danger-button .lucide,
.image-viewer-foot #image-viewer-add-library .lucide,
.image-viewer-foot #image-viewer-appeal .lucide,
.image-viewer-foot #image-viewer-download .lucide,
.image-viewer-foot #image-viewer-send-to .lucide,
.image-viewer-foot #image-viewer-remix .lucide {
  width: 17px !important;
  height: 17px !important;
  padding: 0 !important;
  color: currentColor !important;
  stroke-width: 1.65 !important;
}

.image-viewer-foot #image-viewer-delete,
.image-viewer-foot #image-viewer-appeal {
  color: #687386 !important;
  border-color: #e8ecf3 !important;
  background: #ffffff !important;
}

.image-viewer-foot #image-viewer-add-library {
  color: #4f5b6f !important;
}

.image-viewer-foot #image-viewer-download {
  color: #4f5b6f !important;
}

.image-viewer-foot #image-viewer-send-to {
  color: #4f46c8 !important;
  border-color: #dfe2ee !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.image-viewer-foot .outline-button:hover:not(:disabled),
.image-viewer-foot .danger-button:hover:not(:disabled),
.image-viewer-foot #image-viewer-add-library:hover:not(:disabled),
.image-viewer-foot #image-viewer-appeal:hover:not(:disabled),
.image-viewer-foot #image-viewer-download:hover:not(:disabled),
.image-viewer-foot #image-viewer-send-to:hover:not(:disabled),
.image-viewer-foot #image-viewer-remix:hover:not(:disabled) {
  transform: none !important;
  border-color: #d8deea !important;
  color: #2f3a4d !important;
  background: #f8fafc !important;
  box-shadow: none !important;
}

.image-viewer-foot #image-viewer-send-to:hover:not(:disabled) {
  color: #4338b8 !important;
  border-color: #d8deea !important;
  background: #f8fafc !important;
  box-shadow: none !important;
}

.image-viewer-foot .outline-button[hidden],
.image-viewer-foot button[hidden],
.image-viewer-foot #image-viewer-remix[hidden] {
  display: none !important;
}

@media (min-width: 981px) {
  body:not(.library-focus-mode):not(.feature-focus-mode):not(.works-focus-mode) {
    height: 100vh !important;
    overflow: hidden !important;
  }

  body:not(.library-focus-mode):not(.feature-focus-mode):not(.works-focus-mode) .app-layout {
    height: 100vh !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body:not(.library-focus-mode):not(.feature-focus-mode):not(.works-focus-mode) .sidebar {
    position: sticky !important;
    top: 0 !important;
    height: 100vh !important;
  }

  body:not(.library-focus-mode):not(.feature-focus-mode):not(.works-focus-mode) .main-area {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    height: 100vh !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body:not(.library-focus-mode):not(.feature-focus-mode):not(.works-focus-mode) .content-grid {
    height: auto !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
}

/* Free generate uses the normal workstation layout so the right panel matches other tools. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-bottom-ratio-section {
  display: grid !important;
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .settings-bottom-area {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .generate-count-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .generate-action-row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .generate-count-box {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .generate-action-row {
  grid-column: 1 !important;
  grid-row: 2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .inline-model-section {
  grid-column: 1 !important;
  grid-row: 2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .generate-count-section {
  grid-column: 2 !important;
  grid-row: 2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .generation-resolution-section {
  grid-column: 3 !important;
  grid-row: 2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .create-button.full {
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .inline-model-section,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .generate-count-section,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .generation-resolution-section,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .print-compact-select {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .inline-model-section summary,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .print-compact-select summary {
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  grid-template-columns: 30px minmax(0, 1fr) 12px !important;
  gap: 2px 7px !important;
  padding: 8px 9px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .inline-model-section summary .lucide,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .print-compact-select summary .lucide {
  width: 24px !important;
  height: 24px !important;
  padding: 5px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .inline-model-section summary span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .inline-model-section summary strong,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .print-compact-select summary span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .print-compact-select summary strong {
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .preview-frame,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .preview-gallery,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .preview-compare,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .copy-result-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .task-recent-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] #preview-badge,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .shine-layer {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .detail-page-latest-panel {
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

/* Match the free-generate showcase frame to the shared feature showcase size. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"]
  #detail-page-latest-panel
  .feature-image-showcase-board {
  grid-template-rows: auto minmax(0, 700px) !important;
  width: min(1320px, calc(100% - 40px)) !important;
  height: 824px !important;
  padding: 22px !important;
  border-width: 0 !important;
  gap: 16px !important;
  justify-self: center !important;
  margin: auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .preview-card {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

.image-viewer.upload-mode #image-viewer-appeal,
.image-viewer.upload-mode #image-viewer-remix {
  display: none !important;
}

.secondary-reference-upload-row,
.secondary-reference-upload-card-wrap {
  width: 100%;
  min-width: 0;
}

.secondary-reference-upload-card-wrap {
  position: relative;
  overflow: visible !important;
}

.secondary-reference-upload {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) minmax(82px, 118px) !important;
  align-content: center !important;
  align-items: center !important;
  justify-items: stretch !important;
  width: 100% !important;
  min-height: 122px !important;
  padding: 13px !important;
  gap: 12px !important;
  text-align: left !important;
}

.secondary-reference-upload .upload-icon {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
}

.secondary-reference-upload .upload-copy {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

.secondary-reference-upload .upload-copy strong {
  overflow: hidden;
  color: #273043;
  font-size: 15px;
  font-weight: 540;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.secondary-reference-upload .upload-copy small {
  overflow: hidden;
  color: #7d8497;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.secondary-reference-preview-strip {
  grid-column: 3 !important;
  grid-row: 1 !important;
  display: grid !important;
  justify-content: end !important;
  width: min(118px, max-content) !important;
  min-width: 82px !important;
  max-width: 118px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

.secondary-reference-preview-strip[hidden] {
  display: none !important;
}

.secondary-reference-preview-strip .single-upload-preview-card {
  width: auto !important;
  height: 82px !important;
  max-width: 118px !important;
  aspect-ratio: var(--preview-aspect, 1 / 1) !important;
  min-height: 82px !important;
  cursor: zoom-in;
}

.secondary-reference-preview-strip .single-upload-preview-card img {
  width: 100% !important;
  height: 100% !important;
  border-radius: 14px !important;
  object-fit: contain !important;
}

.secondary-reference-preview-strip .is-uploading-preview-card,
.background-reference-preview-strip .is-uploading-preview-card,
.color-reference-preview-strip .is-uploading-preview-card {
  pointer-events: none !important;
}

.background-reference-preview-strip .is-uploading-preview-card,
.color-reference-preview-strip .is-uploading-preview-card {
  width: 82px !important;
  height: 82px !important;
}

.secondary-reference-clear-x {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  top: 9px !important;
  right: 6px !important;
  z-index: 80 !important;
}

.secondary-reference-clear-x,
.background-reference-clear-x,
.color-reference-clear-x {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  height: 24px !important;
  padding: 0 !important;
  border: 2px solid #fff !important;
  border-radius: 999px !important;
  line-height: 0 !important;
  background: #ef2f55 !important;
  box-shadow: 0 6px 16px rgba(239, 47, 85, 0.26) !important;
}

.secondary-reference-clear-x .lucide,
.background-reference-clear-x .lucide,
.color-reference-clear-x .lucide {
  display: block !important;
  width: 13px !important;
  height: 13px !important;
  margin: 0 !important;
  stroke-width: 2.8 !important;
}

.secondary-reference-clear-x[hidden] {
  display: none !important;
}

.secondary-reference-upload:disabled {
  cursor: not-allowed;
  opacity: 0.68;
}

/* Homepage-aligned soft lavender theme for the fashion workspace. */
body {
  background:
    radial-gradient(circle at 18% 10%, rgba(255, 221, 240, 0.58) 0%, transparent 32%),
    radial-gradient(circle at 72% 18%, rgba(210, 204, 255, 0.64) 0%, transparent 38%),
    radial-gradient(circle at 74% 86%, rgba(154, 169, 255, 0.26) 0%, transparent 44%),
    linear-gradient(180deg, #f5f0ff 0%, #fbf9ff 46%, #f7f9ff 100%);
}

.app-layout,
.workspace {
  background: transparent;
}

.sidebar {
  border-right: 1px solid rgba(255, 255, 255, 0.52);
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72), transparent 36%),
    linear-gradient(180deg, rgba(247, 242, 255, 0.9) 0%, rgba(255, 251, 255, 0.84) 46%, rgba(241, 243, 255, 0.88) 100%);
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.78), 12px 0 34px rgba(107, 91, 170, 0.07);
  backdrop-filter: blur(18px);
}

.nav-group,
.project-tabs,
.account-menu-panel,
.topbar,
.task-panel,
.works-panel,
.hero-card,
.advanced-board,
.library-panel,
.workspace-card,
.upload-card,
.upload-card.compact,
.preview-shell,
.preview-column,
.upload-column,
.settings-panel,
.model-directory-card,
.modal-card,
.workflow-card,
.mini-picker-panel,
.library-select-row,
.feature-card,
.capability-card,
.profile-card,
.account-overview-card,
.credit-log-card {
  border-color: rgba(222, 216, 246, 0.78);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(252, 249, 255, 0.88) 100%);
  box-shadow: 0 18px 46px rgba(105, 91, 164, 0.08);
}

.hero-card {
  background:
    radial-gradient(circle at 82% 28%, rgba(255, 255, 255, 0.68) 0%, transparent 28%),
    radial-gradient(circle at 16% 82%, rgba(255, 220, 237, 0.46) 0%, transparent 34%),
    linear-gradient(100deg, #f2ecff 0%, #f7f2ff 48%, #eef1ff 100%);
}

.side-nav .nav-primary[data-nav-target] .lucide,
.create-button > .lucide,
.points-button .lucide:first-child,
.modal-icon {
  color: #fff;
  background: linear-gradient(135deg, #9a84ff 0%, #c3b4ff 52%, #9fb4ff 100%);
  box-shadow: 0 10px 22px rgba(126, 102, 220, 0.16);
}

.side-nav a.active,
.side-nav a:hover,
.side-nav .nav-primary[data-nav-target].active,
.side-nav .nav-primary[data-nav-target]:hover {
  color: #5f4add;
  background: rgba(246, 240, 255, 0.9);
  box-shadow: inset 0 0 0 1px rgba(153, 132, 255, 0.14);
}

.nav-sublist a::before {
  background: rgba(156, 132, 255, 0.36);
}

.create-button,
.generate-button,
.primary-button,
.submit-button,
.confirm-button {
  color: #fff;
  background: linear-gradient(135deg, #111111 0%, #1d1930 100%);
  box-shadow: 0 18px 34px rgba(36, 27, 64, 0.18), 0 0 0 1px rgba(255, 255, 255, 0.28) inset;
}

.create-button:hover,
.generate-button:hover,
.primary-button:hover,
.submit-button:hover,
.confirm-button:hover {
  filter: brightness(1.05);
  box-shadow: 0 22px 42px rgba(42, 31, 76, 0.22), 0 0 0 1px rgba(255, 255, 255, 0.38) inset;
}

.outline-button,
.small-icon-button,
.batch-button,
.library-select-button,
.need-request-button,
.checkin-entry-button,
.mode-button,
.model-upload-link,
.experience-upload-button {
  border-color: rgba(207, 198, 240, 0.82);
  color: #4b4568;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 10px 22px rgba(102, 84, 164, 0.06);
}

.outline-button:hover,
.small-icon-button:hover,
.batch-button:hover,
.library-select-button:hover,
.need-request-button:hover,
.checkin-entry-button:hover,
.mode-button:hover,
.model-upload-link:hover,
.experience-upload-button:hover {
  border-color: rgba(154, 132, 255, 0.48);
  color: #5f4add;
  background: rgba(250, 247, 255, 0.96);
}

.outline-button > .lucide,
.batch-button > .lucide,
.library-select-button > .lucide,
.experience-upload-button > .lucide,
.model-upload-link > .lucide {
  color: #7a63f1;
  background: rgba(242, 236, 255, 0.92);
}

input,
textarea,
select,
.select-field,
.prompt-input,
.form-input {
  border-color: rgba(215, 209, 238, 0.86);
  background: rgba(255, 255, 255, 0.82);
}

input:focus,
textarea:focus,
select:focus,
.select-field:focus,
.prompt-input:focus,
.form-input:focus {
  border-color: rgba(139, 115, 255, 0.58);
  box-shadow: 0 0 0 4px rgba(139, 115, 255, 0.12);
  outline: none;
}

.upload-card,
.single-upload-card,
.drop-zone,
.preview-shell,
.result-panel,
.image-viewer-stage,
.library-grid article {
  border-color: rgba(221, 215, 244, 0.78);
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    rgba(255, 255, 255, 0.82);
}

.toast,
.platform-toast {
  background: #15131f;
}

/* Stronger theme lock because feature stylesheets load after the base theme. */
body {
  background:
    radial-gradient(circle at 18% 10%, rgba(255, 221, 240, 0.58) 0%, transparent 32%),
    radial-gradient(circle at 72% 18%, rgba(210, 204, 255, 0.64) 0%, transparent 38%),
    radial-gradient(circle at 74% 86%, rgba(154, 169, 255, 0.26) 0%, transparent 44%),
    linear-gradient(180deg, #f5f0ff 0%, #fbf9ff 46%, #f7f9ff 100%) !important;
}

.sidebar {
  border-right-color: rgba(255, 255, 255, 0.56) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72), transparent 36%),
    linear-gradient(180deg, rgba(247, 242, 255, 0.92) 0%, rgba(255, 251, 255, 0.86) 46%, rgba(241, 243, 255, 0.9) 100%) !important;
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.78), 12px 0 34px rgba(107, 91, 170, 0.07) !important;
}

.nav-group,
.topbar,
.hero-card,
.task-panel,
.works-panel,
.advanced-board,
.upload-card,
.preview-shell,
.modal-card,
.workflow-card,
.account-menu-panel,
.library-select-button {
  border-color: rgba(222, 216, 246, 0.78) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(252, 249, 255, 0.9) 100%) !important;
  box-shadow: 0 18px 46px rgba(105, 91, 164, 0.08) !important;
}

.hero-card {
  background:
    radial-gradient(circle at 82% 28%, rgba(255, 255, 255, 0.68) 0%, transparent 28%),
    radial-gradient(circle at 16% 82%, rgba(255, 220, 237, 0.46) 0%, transparent 34%),
    linear-gradient(100deg, #f2ecff 0%, #f7f2ff 48%, #eef1ff 100%) !important;
}

.side-nav .nav-primary[data-nav-target] .lucide,
.create-button > .lucide,
.points-button .lucide:first-child,
.modal-icon {
  background: linear-gradient(135deg, #9a84ff 0%, #c3b4ff 52%, #9fb4ff 100%) !important;
  box-shadow: 0 10px 22px rgba(126, 102, 220, 0.16) !important;
}

.side-nav a.active,
.side-nav a:hover,
.side-nav .nav-primary[data-nav-target].active,
.side-nav .nav-primary[data-nav-target]:hover {
  color: #5f4add !important;
  background: rgba(246, 240, 255, 0.92) !important;
  box-shadow: inset 0 0 0 1px rgba(153, 132, 255, 0.14) !important;
}

.create-button,
.generate-button,
.primary-button,
.submit-button,
.confirm-button {
  color: #fff !important;
  background: linear-gradient(135deg, #111111 0%, #1d1930 100%) !important;
  box-shadow: 0 18px 34px rgba(36, 27, 64, 0.18), 0 0 0 1px rgba(255, 255, 255, 0.28) inset !important;
}

.outline-button,
.small-icon-button,
.batch-button,
.library-select-button,
.need-request-button,
.checkin-entry-button,
.mode-button,
.model-upload-link,
.experience-upload-button {
  border-color: rgba(207, 198, 240, 0.82) !important;
  color: #4b4568 !important;
  background: rgba(255, 255, 255, 0.76) !important;
  box-shadow: 0 10px 22px rgba(102, 84, 164, 0.06) !important;
}

/* Refinement pass: reduce card whiteness and keep controls close to the homepage mood. */
.task-body,
.workspace,
.function-board,
.feature-grid,
.workstation-shell {
  background: transparent !important;
}

.feature-card,
.capability-card,
.section-card,
.tool-card,
.library-item,
.work-card,
.credit-panel,
.profile-panel,
.profile-card,
.account-overview-card,
.account-menu-section,
.settings-card,
.reference-card,
.result-card,
.preview-card,
.model-card,
.template-card,
.prompt-card,
.detail-page-module,
.detail-page-preview-board,
.detail-upload-slot,
.set-generate-upload-card {
  border-color: rgba(222, 216, 246, 0.72) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.66) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.86) 0%, rgba(250, 246, 255, 0.8) 100%) !important;
  box-shadow: 0 16px 38px rgba(105, 91, 164, 0.075) !important;
}

.feature-card:hover,
.capability-card:hover,
.tool-card:hover,
.library-item:hover,
.work-card:hover,
.model-card:hover,
.template-card:hover {
  border-color: rgba(156, 132, 255, 0.36) !important;
  box-shadow: 0 20px 46px rgba(105, 91, 164, 0.12) !important;
}

.upload-column,
.preview-column,
.upload-card,
.single-upload-card,
.upload-panel,
.preview-shell,
.preview-stage,
.preview-board,
.result-panel,
.image-preview-card,
.single-upload-preview-card,
.reference-preview-card,
.empty-state,
.drop-zone {
  border-color: rgba(223, 217, 246, 0.76) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.76) 0%, transparent 36%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.88) 0%, rgba(249, 246, 255, 0.76) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.07) !important;
}

.side-nav .nav-primary[data-nav-target] {
  color: #3e3854 !important;
  background: transparent !important;
}

.side-nav .nav-primary[data-nav-target].active,
.side-nav .nav-primary[data-nav-target]:hover,
.side-nav a.active,
.side-nav a:hover {
  color: #4d3ed2 !important;
  background:
    radial-gradient(circle at 18% 50%, rgba(255, 255, 255, 0.8) 0%, transparent 36%),
    rgba(245, 239, 255, 0.78) !important;
  box-shadow: inset 0 0 0 1px rgba(154, 132, 255, 0.16), 0 8px 18px rgba(105, 91, 164, 0.05) !important;
}

.nav-sublist a {
  color: #666176 !important;
}

.nav-sublist a.active,
.nav-sublist a:hover {
  color: #5a45d8 !important;
  background: rgba(246, 240, 255, 0.72) !important;
}

.side-nav .nav-primary[data-nav-target] .lucide,
.side-nav .lucide,
.industry-switch-button .lucide,
.function-card-icon,
.feature-card .lucide {
  color: #6c55e8 !important;
  background:
    linear-gradient(135deg, rgba(247, 243, 255, 0.96), rgba(235, 232, 255, 0.92)) !important;
  box-shadow: inset 0 0 0 1px rgba(154, 132, 255, 0.12), 0 8px 18px rgba(105, 91, 164, 0.08) !important;
}

.side-nav .nav-primary[data-nav-target].active .lucide,
.side-nav .nav-primary[data-nav-target]:hover .lucide {
  color: #fff !important;
  background: linear-gradient(135deg, #8b73ff 0%, #bcaeff 58%, #9aa9ff 100%) !important;
}

.tag,
.badge,
.pill,
.status-pill,
.tool-badge,
.feature-tag,
.model-tag,
.credit-badge,
.account-badge,
.scenario-chip {
  border-color: rgba(209, 199, 241, 0.7) !important;
  color: #6754d8 !important;
  background: rgba(245, 239, 255, 0.74) !important;
}

.create-button.full {
  border-radius: 999px !important;
  background: linear-gradient(135deg, #0f0f14 0%, #211a35 100%) !important;
  box-shadow: 0 18px 38px rgba(36, 27, 64, 0.22), 0 0 0 1px rgba(255, 255, 255, 0.24) inset !important;
}

.library-select-button,
.outline-button,
.small-icon-button,
.batch-button,
.mode-button,
.tab-button,
.segmented-button {
  border-radius: 999px !important;
}

.topbar {
  background: rgba(255, 255, 255, 0.62) !important;
  backdrop-filter: blur(18px);
}

.modal-backdrop,
.image-viewer {
  background: rgba(23, 19, 38, 0.42) !important;
  backdrop-filter: blur(12px);
}

.modal-card,
.auth-card,
.prompt-card {
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.78) 0%, transparent 36%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(250, 247, 255, 0.92)) !important;
  box-shadow: 0 30px 90px rgba(38, 29, 70, 0.22) !important;
}

input,
textarea,
select,
.auth-form input,
.profile-form input,
.prompt-card textarea {
  color: #201d2f !important;
  border-color: rgba(215, 208, 239, 0.88) !important;
  background: rgba(255, 255, 255, 0.78) !important;
}

input:focus,
textarea:focus,
select:focus,
.auth-form input:focus,
.profile-form input:focus,
.prompt-card textarea:focus {
  border-color: rgba(139, 115, 255, 0.6) !important;
  box-shadow: 0 0 0 4px rgba(139, 115, 255, 0.12) !important;
}

.create-button[disabled],
.outline-button[disabled],
button:disabled {
  filter: saturate(0.75) opacity(0.74);
}

@media (max-width: 980px) {
  .sidebar {
    overflow: hidden !important;
    padding: 14px 12px 12px !important;
  }

  .brand {
    min-height: 74px !important;
    margin-bottom: 10px !important;
  }

  .brand-logo {
    width: min(100%, 150px) !important;
    height: 34px !important;
  }

  .brand-tagline {
    max-width: 168px !important;
    font-size: 11px !important;
  }

  .side-nav {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 0 2px 8px !important;
    scroll-snap-type: x proximity;
  }

  .side-nav .nav-group {
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    scroll-snap-align: start;
  }

  .side-nav .nav-sublist {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .side-nav .nav-primary[data-nav-target],
  .side-nav .nav-primary,
  .nav-sublist a {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: max-content !important;
    min-height: 40px !important;
    padding: 0 12px !important;
    border: 1px solid rgba(213, 205, 242, 0.72) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.7) !important;
    box-shadow: 0 8px 18px rgba(105, 91, 164, 0.055) !important;
    white-space: nowrap !important;
  }

  .side-nav .nav-primary[data-nav-target].active,
  .side-nav .nav-primary[data-nav-target]:hover,
  .side-nav a.active,
  .side-nav a:hover {
    border-color: rgba(154, 132, 255, 0.28) !important;
    background: rgba(245, 239, 255, 0.88) !important;
  }

  .works-card {
    position: static !important;
    width: min(100%, 188px) !important;
    min-height: 58px !important;
    margin: 4px 0 0 !important;
    padding: 9px 10px !important;
    border-radius: 16px !important;
    transform: none !important;
  }
}

body.feature-focus-mode.workstation-feature-mode .task-panel {
  border-color: rgba(226, 219, 247, 0.76) !important;
  background: linear-gradient(180deg, rgba(248, 244, 255, 0.82) 0%, rgba(253, 252, 255, 0.78) 42%, rgba(255, 255, 255, 0.9) 100%) !important;
  box-shadow: 0 18px 42px rgba(105, 91, 164, 0.07) !important;
}

body.feature-focus-mode.workstation-feature-mode .task-heading,
body.feature-focus-mode.workstation-feature-mode .upload-column,
body.feature-focus-mode.workstation-feature-mode .settings-column {
  border-color: transparent !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode #product-upload,
body.feature-focus-mode.workstation-feature-mode .upload-card,
body.feature-focus-mode.workstation-feature-mode .single-upload-card,
body.feature-focus-mode.workstation-feature-mode .inline-model-section,
body.feature-focus-mode.workstation-feature-mode .generate-count-box,
body.feature-focus-mode.workstation-feature-mode .generation-resolution-section,
body.feature-focus-mode.workstation-feature-mode .preview-card,
body.feature-focus-mode.workstation-feature-mode .result-card,
body.feature-focus-mode.workstation-feature-mode .empty-state {
  border-color: rgba(220, 213, 244, 0.78) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature] button#product-upload.upload-card {
  border-color: rgba(220, 213, 244, 0.78) !important;
  background-color: rgba(255, 255, 255, 0.82) !important;
  background-image:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode .preview-column,
body.feature-focus-mode.workstation-feature-mode .preview-card,
body.feature-focus-mode.workstation-feature-mode .detail-page-latest-panel,
body.feature-focus-mode.workstation-feature-mode .wrinkle-latest-panel,
body.feature-focus-mode.workstation-feature-mode .wrinkle-latest-empty {
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-card {
  --fashion-hero-x: 50%;
  --fashion-hero-y: 50%;
  --fashion-hero-glow-opacity: 0;
  isolation: isolate;
  min-height: 158px;
  border: 0 !important;
  border-radius: 0 0 26px 26px;
  background:
    radial-gradient(circle at 50% 30%, rgba(255, 255, 255, 0.68) 0%, rgba(255, 255, 255, 0.32) 24%, transparent 46%),
    radial-gradient(circle at 10% 82%, rgba(255, 226, 244, 0.48) 0%, rgba(255, 226, 244, 0.14) 28%, transparent 52%),
    radial-gradient(circle at 72% 84%, rgba(179, 193, 255, 0.32) 0%, rgba(179, 193, 255, 0.12) 32%, transparent 62%),
    linear-gradient(180deg, #e8e1ff 0%, #f0e8ff 20%, #f2ecfb 50%, #e9eeff 100%) !important;
  background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100% !important;
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.82), 0 18px 48px rgba(105, 91, 164, 0.06) !important;
  animation: none;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-card::before,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-card::after {
  content: "";
  position: absolute;
  inset: -34%;
  width: auto !important;
  height: auto !important;
  z-index: 0;
  border-radius: 0;
  pointer-events: none;
  transform: none;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-card::before {
  inset: -18%;
  background:
    radial-gradient(ellipse 36% 68% at 12% 52%, rgba(255, 155, 218, 0.28) 0%, rgba(255, 191, 232, 0.16) 46%, transparent 72%),
    radial-gradient(ellipse 38% 70% at 50% 48%, rgba(178, 152, 255, 0.28) 0%, rgba(205, 187, 255, 0.16) 48%, transparent 76%),
    radial-gradient(ellipse 36% 72% at 88% 54%, rgba(129, 176, 255, 0.24) 0%, rgba(169, 203, 255, 0.14) 48%, transparent 76%);
  filter: saturate(1.02) blur(4px);
  opacity: 0.78 !important;
  animation: fashionHeroFlowWide 5.8s ease-in-out infinite alternate;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-card::after {
  inset: 0;
  background:
    linear-gradient(96deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 241, 251, 0.2) 17%, rgba(208, 188, 255, 0.18) 35%, rgba(164, 199, 255, 0.16) 52%, rgba(255, 255, 255, 0.34) 66%, rgba(255, 217, 239, 0.18) 82%, rgba(255, 255, 255, 0.24) 100%);
  background-size: 220% 100%;
  mix-blend-mode: normal;
  opacity: 0.62 !important;
  animation: fashionHeroSheen 2.6s linear infinite;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .fashion-hero-cursor-light {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  width: 190px;
  height: 190px;
  border-radius: 999px;
  background:
    radial-gradient(circle, rgba(255, 255, 255, 0.58) 0%, rgba(255, 255, 255, 0.28) 24%, rgba(255, 226, 246, 0.16) 48%, transparent 72%);
  opacity: var(--fashion-hero-glow-opacity);
  pointer-events: none;
  transform: translate3d(calc(var(--fashion-hero-x) - 95px), calc(var(--fashion-hero-y) - 95px), 0);
  transition: opacity 160ms ease;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .fashion-hero-sparkle {
  position: absolute;
  z-index: 1;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 0 14px rgba(255, 255, 255, 0.78), 0 0 22px rgba(176, 148, 255, 0.26);
  left: var(--spark-x);
  top: var(--spark-y);
  pointer-events: none;
  transform: translate(-50%, -50%) scale(0.72);
  animation: fashionHeroSparkle 760ms ease-out forwards;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-text {
  max-width: 760px;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .fashion-hero-logo {
  display: block;
  width: auto;
  height: 21px;
  margin: -18px 0 22px;
  opacity: 0.88;
  object-fit: contain;
  object-position: left center;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-text h1 {
  color: #202235;
  font-size: 38px;
  font-weight: 760;
  line-height: 1.08;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-text p {
  max-width: 620px;
  margin-top: 14px;
  color: #68657a;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.45;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-visual {
  z-index: 1;
  min-height: 195px;
  overflow: visible;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-visual .fashion-hero-art {
  position: absolute;
  display: block;
  object-fit: contain;
  object-position: center;
  border-radius: 0;
  pointer-events: none;
  user-select: none;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-visual .fashion-hero-art-ring {
  left: 30px;
  top: 20px;
  z-index: 3;
  width: clamp(112px, 11vw, 152px);
  height: auto;
  opacity: 0.74;
  filter: drop-shadow(0 20px 36px rgba(102, 82, 210, 0.16));
  animation: fashionHeroArtFloat 6.8s ease-in-out infinite;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-visual .fashion-hero-art-moon {
  right: 430px;
  bottom: 4px;
  z-index: 1;
  width: clamp(124px, 12.5vw, 176px);
  height: auto;
  opacity: 0.42;
  filter: saturate(1.04) drop-shadow(0 24px 42px rgba(104, 84, 216, 0.12));
  animation: fashionHeroArtFloat 8.4s ease-in-out infinite reverse;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-visual .fashion-hero-art-mascot {
  right: -58px;
  bottom: -44px;
  z-index: 2;
  width: clamp(286px, 27.5vw, 390px);
  height: auto;
  transform: scaleX(-1);
  transform-origin: center bottom;
  filter: drop-shadow(0 26px 46px rgba(91, 72, 194, 0.16));
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .function-board .section-head h2,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .section-head h2 {
  margin: 0;
  padding-left: 15px;
  color: #25283a;
  font-size: 22px;
  font-weight: 620;
  line-height: 1.18;
  letter-spacing: 0;
  text-shadow: none;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .function-board .section-head h2::before,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .section-head h2::before {
  top: 2px;
  bottom: 2px;
  width: 3px;
  border-radius: 999px;
  background: #7a6cff;
  box-shadow: none;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .section-head h2::after {
  display: none;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .feature-head {
  gap: 9px;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .feature-head strong {
  color: #303345;
  font-size: 15px;
  font-weight: 560;
  line-height: 1.2;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .feature-head small,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-chip {
  color: #6c63d9;
  font-size: 11px;
  font-weight: 540;
  letter-spacing: 0;
  background: rgba(244, 241, 255, 0.86) !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .feature-icon,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .feature-icon,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .feature-icon.purple,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .feature-icon.mint,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .feature-icon.blue,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .feature-icon.green,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .feature-icon.rainbow {
  width: 24px;
  height: 24px;
  border: 1px solid rgba(139, 125, 255, 0.18);
  border-radius: 7px;
  color: #6d62f2 !important;
  background: rgba(247, 245, 255, 0.88) !important;
  box-shadow: none !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .feature-icon::after,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .feature-icon::after {
  display: none;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .feature-icon .lucide,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .feature-icon .lucide,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-chip .lucide {
  width: 14px;
  height: 14px;
  stroke-width: 1.8;
  color: currentColor !important;
  background: transparent !important;
  box-shadow: none !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-chip {
  gap: 6px;
  border: 1px solid rgba(139, 125, 255, 0.14);
  box-shadow: none;
}

.brand,
.brand-logo {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

@keyframes fashionHeroArtFloat {
  0%,
  100% {
    transform: translate3d(0, 0, 0);
  }

  50% {
    transform: translate3d(0, -9px, 0);
  }
}

@keyframes fashionHeroFluid {
  0% {
    background-position: 0% 38%, 0% 50%;
  }

  50% {
    background-position: 70% 64%, 100% 40%;
  }

  100% {
    background-position: 100% 48%, 38% 92%;
  }
}

@keyframes fashionHeroBand {
  0% {
    background-position: 0 0, 0% 50%;
  }

  100% {
    background-position: 0 0, 100% 50%;
  }
}

@keyframes fashionHeroFlowWide {
  0% {
    transform: translate3d(-16%, -4%, 0) scale(1.08);
  }

  50% {
    transform: translate3d(1%, 4%, 0) scale(1.16);
  }

  100% {
    transform: translate3d(16%, 2%, 0) scale(1.08);
  }
}

@keyframes fashionHeroSheen {
  0% {
    background-position: 0% 50%;
  }

  100% {
    background-position: 100% 50%;
  }
}

@keyframes fashionHeroSparkle {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.45);
  }

  18% {
    opacity: 0.9;
  }

  100% {
    opacity: 0;
    transform: translate(-50%, -92%) scale(1.5);
  }
}

@media (prefers-reduced-motion: reduce) {
  body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-card,
  body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-card::before,
  body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .hero-card::after,
  body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .fashion-hero-sparkle {
    animation: none !important;
  }
}

/* Free-generate ratio menu: keep options readable instead of squeezing into one row. */
.free-page-ratio-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-ratio-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.free-page-ratio-grid button[data-free-page-ratio="auto"] {
  min-width: 0 !important;
  padding-inline: 8px !important;
}

#free-bottom-ratio-section .free-generate-option-grid {
  display: grid !important;
  grid-auto-flow: row !important;
  grid-auto-columns: initial !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: none !important;
  overflow: visible !important;
  padding-bottom: 0 !important;
  gap: 10px !important;
  scrollbar-width: auto;
}

#free-bottom-ratio-section .free-generate-option-grid button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  min-width: 0 !important;
  min-height: 50px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(151, 158, 178, 0.18) !important;
  border-radius: 12px !important;
  color: #42485a !important;
  background: #fafbfe !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

#free-bottom-ratio-section .free-generate-option-grid button::before {
  content: "" !important;
  display: block !important;
  flex: 0 0 auto !important;
  width: var(--free-ratio-preview-width, 22px) !important;
  height: var(--free-ratio-preview-height, 22px) !important;
  border: 1.5px solid #9aa4b6 !important;
  border-radius: 5px !important;
  background: linear-gradient(180deg, #eef2f8 0%, #d7dde8 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.52) !important;
}

#free-bottom-ratio-section .free-generate-option-grid button.selected {
  border-color: rgba(109, 85, 238, 0.58) !important;
  color: #6d55ee !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08) !important;
}

#free-bottom-ratio-section .free-generate-option-grid button.selected::before {
  border-color: #7a63f1 !important;
  background: linear-gradient(180deg, #f4f1ff 0%, #e5ddff 100%) !important;
}

#free-bottom-ratio-section .free-generate-option-grid button[data-free-ratio="auto"] {
  --free-ratio-preview-width: 24px;
  --free-ratio-preview-height: 18px;
}

#free-bottom-ratio-section .free-generate-option-grid button[data-free-ratio="auto"]::before {
  content: "A" !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 7px !important;
  color: currentColor !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

#free-bottom-ratio-section .free-generate-option-grid button[data-free-ratio="1:1"] {
  --free-ratio-preview-width: 20px;
  --free-ratio-preview-height: 20px;
}

#free-bottom-ratio-section .free-generate-option-grid button[data-free-ratio="3:4"] {
  --free-ratio-preview-width: 17px;
  --free-ratio-preview-height: 23px;
}

#free-bottom-ratio-section .free-generate-option-grid button[data-free-ratio="4:3"] {
  --free-ratio-preview-width: 25px;
  --free-ratio-preview-height: 19px;
}

#free-bottom-ratio-section .free-generate-option-grid button[data-free-ratio="9:16"] {
  --free-ratio-preview-width: 15px;
  --free-ratio-preview-height: 26px;
}

#free-bottom-ratio-section .free-generate-option-grid button[data-free-ratio="16:9"] {
  --free-ratio-preview-width: 28px;
  --free-ratio-preview-height: 16px;
}

#free-bottom-ratio-section .free-generate-option-grid button[data-free-ratio="2:3"] {
  --free-ratio-preview-width: 17px;
  --free-ratio-preview-height: 25px;
}

#free-bottom-ratio-section .free-generate-option-grid button[data-free-ratio="3:2"] {
  --free-ratio-preview-width: 27px;
  --free-ratio-preview-height: 18px;
}

#free-bottom-ratio-section .free-generate-option-grid button[data-free-ratio="4:5"] {
  --free-ratio-preview-width: 19px;
  --free-ratio-preview-height: 24px;
}

#free-bottom-ratio-section .free-generate-option-grid button span {
  min-width: 0 !important;
  text-align: center !important;
}

#free-bottom-ratio-section .free-ratio-heading small {
  color: #8b93a5 !important;
}

.print-extract-settings-panel {
  display: grid;
  gap: 12px;
}

.print-extract-setting-card {
  display: grid;
  gap: 12px;
  border: 1px solid rgba(218, 222, 236, 0.86);
  border-radius: 16px;
  padding: 12px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 249, 253, 0.88));
  box-shadow: 0 14px 32px rgba(60, 67, 98, 0.065);
}

.print-extract-section-head,
.print-extract-ratio-section .free-ratio-heading {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
}

.print-extract-section-head strong,
.print-extract-ratio-section .free-ratio-heading strong {
  color: #252b3f !important;
  font-size: 14px !important;
  font-weight: 760 !important;
  line-height: 1.2 !important;
}

.print-extract-section-head small,
.print-extract-ratio-section .free-ratio-heading small {
  color: #8b93a5 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

.print-extract-ratio-section {
  display: grid !important;
  gap: 12px !important;
  padding-top: 12px !important;
}

.print-extract-ratio-grid {
  display: grid !important;
  grid-auto-flow: row !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  overflow: visible !important;
  padding-bottom: 0 !important;
}

.print-extract-ratio-grid button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  min-height: 42px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(205, 211, 229, 0.78) !important;
  border-radius: 13px !important;
  color: #3f4659 !important;
  background: rgba(255, 255, 255, 0.76) !important;
  font-size: 13px !important;
  font-weight: 680 !important;
  box-shadow: none !important;
}

.print-extract-ratio-grid button i {
  content: "" !important;
  display: block !important;
  flex: 0 0 auto !important;
  width: var(--free-ratio-preview-width, 20px) !important;
  height: var(--free-ratio-preview-height, 20px) !important;
  border: 1.4px solid #9aa4b6 !important;
  border-radius: 6px !important;
  background: linear-gradient(180deg, #eef2f8 0%, #d7dde8 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.52) !important;
}

.print-extract-ratio-grid button:hover {
  border-color: rgba(123, 97, 255, 0.34) !important;
  background: #ffffff !important;
}

.print-extract-ratio-grid button.selected {
  border-color: rgba(109, 85, 238, 0.58) !important;
  color: #6d55ee !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08) !important;
}

.print-extract-ratio-grid button.selected i {
  border-color: #7a63f1 !important;
  background: linear-gradient(180deg, #f4f1ff 0%, #e5ddff 100%) !important;
}

.print-extract-ratio-grid button[data-print-extract-ratio="auto"],
.print-extract-ratio-grid button[data-flat-lay-ratio="auto"] {
  --free-ratio-preview-width: 24px;
  --free-ratio-preview-height: 18px;
}

.print-extract-ratio-grid button[data-print-extract-ratio="auto"] i,
.print-extract-ratio-grid button[data-flat-lay-ratio="auto"] i {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 7px !important;
  color: currentColor !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

.print-extract-ratio-grid button[data-print-extract-ratio="auto"] i::before,
.print-extract-ratio-grid button[data-flat-lay-ratio="auto"] i::before {
  content: "A";
}

.print-extract-ratio-grid button[data-print-extract-ratio="1:1"],
.print-extract-ratio-grid button[data-flat-lay-ratio="1:1"] {
  --free-ratio-preview-width: 20px;
  --free-ratio-preview-height: 20px;
}

.print-extract-ratio-grid button[data-print-extract-ratio="3:4"],
.print-extract-ratio-grid button[data-flat-lay-ratio="3:4"] {
  --free-ratio-preview-width: 17px;
  --free-ratio-preview-height: 23px;
}

.print-extract-ratio-grid button[data-print-extract-ratio="4:3"],
.print-extract-ratio-grid button[data-flat-lay-ratio="4:3"] {
  --free-ratio-preview-width: 25px;
  --free-ratio-preview-height: 19px;
}

.print-extract-ratio-grid button[data-print-extract-ratio="9:16"],
.print-extract-ratio-grid button[data-flat-lay-ratio="9:16"] {
  --free-ratio-preview-width: 15px;
  --free-ratio-preview-height: 26px;
}

.print-extract-ratio-grid button[data-print-extract-ratio="16:9"],
.print-extract-ratio-grid button[data-flat-lay-ratio="16:9"] {
  --free-ratio-preview-width: 28px;
  --free-ratio-preview-height: 16px;
}

.print-extract-ratio-grid button[data-print-extract-ratio="2:3"],
.print-extract-ratio-grid button[data-flat-lay-ratio="2:3"] {
  --free-ratio-preview-width: 17px;
  --free-ratio-preview-height: 25px;
}

.print-extract-ratio-grid button[data-print-extract-ratio="3:2"],
.print-extract-ratio-grid button[data-flat-lay-ratio="3:2"] {
  --free-ratio-preview-width: 27px;
  --free-ratio-preview-height: 18px;
}

.print-extract-ratio-grid button[data-print-extract-ratio="4:5"],
.print-extract-ratio-grid button[data-flat-lay-ratio="4:5"] {
  --free-ratio-preview-width: 19px;
  --free-ratio-preview-height: 24px;
}

.print-extract-ratio-grid button span {
  min-width: 0 !important;
  text-align: center !important;
}

.flat-lay-background-reference {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) 30px;
  align-items: center;
  gap: 10px;
  padding: 8px;
  border: 1px solid rgba(124, 99, 241, 0.22);
  border-radius: 13px;
  background: rgba(247, 245, 255, 0.78);
}

.flat-lay-background-reference img {
  width: 54px;
  height: 54px;
  object-fit: cover;
  border-radius: 10px;
}

.flat-lay-background-reference > span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.flat-lay-background-reference strong,
.flat-lay-background-reference small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.flat-lay-background-reference strong {
  color: #30364a;
  font-size: 13px;
}

.flat-lay-background-reference small {
  color: #858da0;
  font-size: 11px;
}

.flat-lay-background-reference > button {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 9px;
  color: #697085;
  background: rgba(255, 255, 255, 0.82);
}

.flat-lay-background-reference > button:hover {
  color: #5f47dc;
  background: #fff;
}

.flat-lay-background-reference .lucide {
  width: 15px;
  height: 15px;
}

.flat-lay-product-type-card {
  display: grid;
  gap: 12px;
  padding: 14px 15px 15px;
  border: 1px solid rgba(212, 207, 251, 0.92);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(250, 249, 255, 0.94));
  box-shadow: 0 10px 24px rgba(88, 70, 186, 0.045);
}

.flat-lay-product-type-card > strong {
  color: #5040d8;
  font-size: 15px;
  font-weight: 760;
  line-height: 1.25;
}

.flat-lay-product-type-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.flat-lay-product-type-grid button {
  min-width: 0;
  min-height: 44px;
  padding: 0 10px;
  border: 1px solid rgba(196, 202, 230, 0.92);
  border-radius: 999px;
  color: #3e465a;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 2px 5px rgba(65, 69, 104, 0.025);
  font-size: 14px;
  font-weight: 520;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.flat-lay-product-type-grid button:hover {
  border-color: rgba(104, 86, 241, 0.48);
  color: #5946e4;
  transform: translateY(-1px);
}

.flat-lay-product-type-grid button.selected {
  border-color: transparent;
  color: #fff;
  background: linear-gradient(135deg, #7054f4 0%, #6677f5 100%);
  box-shadow: 0 8px 18px rgba(102, 83, 238, 0.2);
}

.flat-lay-product-type-grid button:focus-visible {
  outline: 3px solid rgba(109, 85, 238, 0.2);
  outline-offset: 2px;
}

@media (max-width: 620px) {
  .flat-lay-product-type-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }
}

@media (min-width: 981px) {
  .task-panel .preview-column {
    position: relative !important;
    overflow: visible !important;
  }

  body.feature-focus-mode.workstation-feature-mode .task-panel .preview-column {
    overflow: visible !important;
  }

  .task-panel .preview-column::before {
    content: "" !important;
    position: absolute;
    left: -24px;
    top: 18px;
    bottom: 18px;
    z-index: 3;
    width: 1px;
    border-radius: 999px;
    background: linear-gradient(180deg, transparent 0%, rgba(166, 153, 220, 0.92) 18%, rgba(166, 153, 220, 0.62) 82%, transparent 100%);
    pointer-events: none;
  }
}

/* Free generate final upload preview override. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-upload-preview {
  width: 100% !important;
  min-height: 100% !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-reference-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  align-items: stretch !important;
  gap: 14px !important;
  width: 100% !important;
  min-height: 100% !important;
  overflow: visible !important;
  padding: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-reference-card {
  position: relative !important;
  display: grid !important;
  grid-template-rows: minmax(260px, 1fr) auto !important;
  gap: 10px !important;
  min-height: 340px !important;
  margin: 0 !important;
  padding: 10px !important;
  overflow: hidden !important;
  border: 1px solid #e5e7ef !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-reference-card img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 260px !important;
  aspect-ratio: 3 / 4 !important;
  object-fit: contain !important;
  border-radius: 12px !important;
  background: #f6f7fb !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-reference-card figcaption {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] .free-page-reference-card button {
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  display: grid !important;
  place-items: center !important;
  width: 30px !important;
  height: 30px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: rgba(17, 24, 39, 0.62) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"] #free-page-prompt {
  min-height: 296px !important;
  height: 296px !important;
}

/* Background feature visual alignment: keep upload areas dashed and setting areas solid. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .background-upload-button {
  border: 1px dashed rgba(220, 213, 244, 0.78) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .background-mode-tabs,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .material-picker,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .extra-prompt-box {
  border: 1px solid rgba(220, 213, 244, 0.78) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .background-mode-tabs,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .material-picker {
  border-radius: 18px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .background-mode-tabs {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] .model-bg-grid button {
  border-color: rgba(220, 213, 244, 0.78) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .settings-card {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .settings-head {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-upload {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) minmax(82px, 118px) !important;
  align-content: center !important;
  align-items: center !important;
  justify-items: stretch !important;
  gap: 10px !important;
  min-height: 122px !important;
  padding: 14px 13px !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-upload .upload-icon {
  display: grid !important;
  place-items: center !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-upload .upload-icon .lucide {
  width: 25px !important;
  height: 25px !important;
  stroke-width: 2.25 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-upload strong {
  margin-bottom: 3px !important;
  font-size: 15px !important;
  font-weight: 560 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-upload small {
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
}

body[data-active-feature="try-on"] .try-on-garment-upload {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) minmax(82px, 118px) !important;
  align-content: center !important;
  align-items: center !important;
  justify-items: stretch !important;
  gap: 10px !important;
  min-height: 122px !important;
  padding: 14px 13px !important;
  text-align: left !important;
}

body[data-active-feature="try-on"] .try-on-garment-upload .upload-icon {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  display: grid !important;
  place-items: center !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  border-radius: 12px !important;
}

body[data-active-feature="try-on"] .try-on-garment-upload .upload-copy {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-items: start !important;
  gap: 3px !important;
  text-align: left !important;
  min-width: 0 !important;
}

body[data-active-feature="try-on"] .try-on-garment-upload .upload-copy strong {
  font-size: 15px !important;
  font-weight: 560 !important;
  line-height: 1.2 !important;
  text-align: left !important;
}

body[data-active-feature="try-on"] .try-on-garment-upload .upload-copy small {
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  text-align: left !important;
}

body[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  align-content: center !important;
  justify-items: center !important;
  min-height: 152px !important;
  padding: 18px !important;
  gap: 10px !important;
  text-align: center !important;
}

body[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) .upload-icon {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: center !important;
  margin: 0 !important;
}

body[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) .upload-copy {
  grid-column: 1 !important;
  grid-row: 2 !important;
  justify-items: center !important;
  text-align: center !important;
}

body[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) .upload-copy strong,
body[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) .upload-copy small {
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled),
body[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 152px !important;
  padding: 18px !important;
  gap: 10px !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) .upload-icon,
body[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) .upload-icon {
  flex: 0 0 auto !important;
  align-self: center !important;
  justify-self: center !important;
  margin: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) .upload-copy,
body[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) .upload-copy {
  display: grid !important;
  justify-items: center !important;
  align-self: center !important;
  width: 100% !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) .upload-copy strong,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) .upload-copy small,
body[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) .upload-copy strong,
body[data-active-feature="try-on"] .try-on-garment-upload:not(.is-filled) .upload-copy small {
  width: 100% !important;
  text-align: center !important;
}

body[data-active-feature="try-on"] .secondary-reference-clear-x {
  top: 9px !important;
  right: 6px !important;
  z-index: 80 !important;
}

/* Colors feature visual alignment: keep reference upload dashed and setting areas solid. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .color-reference-upload {
  border: 1px dashed rgba(220, 213, 244, 0.78) !important;
  border-radius: 18px !important;
  color: var(--ink) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .color-reference-upload:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .color-reference-upload:focus-visible {
  border-color: var(--line) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .color-reference-upload .upload-icon {
  color: var(--purple) !important;
  background: var(--purple-soft) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .swatch-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .extra-prompt-box {
  border: 1px solid rgba(220, 213, 244, 0.78) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .swatch-grid {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .swatch-button {
  border-color: rgba(220, 213, 244, 0.78) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: none !important;
  font-size: 7px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .swatch-button.selected {
  border-color: rgba(109, 85, 238, 0.58) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .swatch-button:disabled,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .swatch-button[aria-disabled="true"],
body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .swatch-button.is-disabled {
  cursor: not-allowed !important;
  opacity: 0.42 !important;
  filter: grayscale(0.18) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .swatch-button:disabled:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .swatch-button[aria-disabled="true"]:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] .swatch-button.is-disabled:hover {
  border-color: rgba(220, 213, 244, 0.78) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Basic feature settings alignment: dashed upload areas, solid setting controls. */
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="live-sticker"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="outpaint"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"]
) #product-upload,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"]
) .try-on-garment-upload,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="pose-change"] .pose-upload-reference-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="pattern-transfer"] .pattern-upload-button {
  border: 1px dashed rgba(220, 213, 244, 0.78) !important;
  border-radius: 18px !important;
  color: var(--ink) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="live-sticker"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="outpaint"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"]
) #product-upload:hover,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="outpaint"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"]
) #product-upload:focus-visible,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"]
) .try-on-garment-upload:hover,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"]
) .try-on-garment-upload:focus-visible,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="pose-change"] .pose-upload-reference-button:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="pose-change"] .pose-upload-reference-button:focus-visible,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="pattern-transfer"] .pattern-upload-button:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="pattern-transfer"] .pattern-upload-button:focus-visible {
  border-color: var(--line) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="outpaint"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"]
) #product-upload .upload-icon,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"]
) .try-on-garment-upload .upload-icon,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="pose-change"] .pose-upload-reference-button .upload-icon,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="pattern-transfer"] .pattern-upload-button .upload-icon {
  color: var(--purple) !important;
  background: var(--purple-soft) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="outpaint"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"]
) .choice-grid,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="outpaint"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"]
) .extra-prompt-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .outpaint-preset-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-change-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="pattern-transfer"] .pattern-transfer-panel {
  border: 1px solid rgba(220, 213, 244, 0.78) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="flat-lay"] .extra-prompt-box {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="flat-lay"] .extra-prompt-box::before {
  content: none !important;
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="pose-change"] .pose-change-panel {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .buyer-gender-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .buyer-ethnicity-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .buyer-age-grid,
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-model-age-grid {
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .buyer-ethnicity-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .buyer-age-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body[data-active-feature="buyer-show"] .buyer-age-grid .choice-button {
  min-height: 42px !important;
  padding: 6px 8px !important;
  border-radius: 13px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.1 !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="outpaint"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="beauty-makeup-try-on"]
) .choice-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .outpaint-preset-grid .choice-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-subject-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-preset-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="pose-change"] .pose-type-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="pose-change"] .pose-reference-card {
  border-color: rgba(220, 213, 244, 0.78) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="outpaint"],
  [data-active-feature="view-change"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="beauty-makeup-try-on"]
) .choice-button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .outpaint-preset-grid .choice-button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-subject-button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-preset-button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="pose-change"] .pose-type-button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="pose-change"] .pose-reference-card.selected {
  border-color: rgba(109, 85, 238, 0.58) !important;
  color: var(--purple) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="print-extract"] .print-extract-mode-grid {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="print-extract"] .print-extract-mode-grid .choice-button {
  border-color: rgba(216, 221, 235, 0.92) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: 0 10px 22px rgba(64, 72, 104, 0.055) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="print-extract"] .print-extract-mode-grid .choice-button.selected {
  border-color: rgba(109, 85, 238, 0.48) !important;
  color: #5b45d6 !important;
  background: linear-gradient(135deg, #ffffff 0%, #f2efff 100%) !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08), 0 14px 28px rgba(83, 68, 179, 0.1) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .outpaint-preset-grid {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] #settings-card {
  gap: 12px !important;
  padding: 14px 15px 15px !important;
  border: 1px solid rgba(212, 207, 251, 0.92) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(250, 249, 255, 0.94)) !important;
  box-shadow: 0 10px 24px rgba(88, 70, 186, 0.045) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .outpaint-preset-grid .choice-button.selected .ratio-icon {
  color: #5b4be8 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .outpaint-preset-grid .choice-button.selected .outpaint-preset-text strong {
  color: #2d3448 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .outpaint-preset-grid .choice-button.selected .outpaint-preset-text small {
  color: #6f7488 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outpaint"] .outpaint-preset-grid .choice-button.selected .ratio-icon::before {
  background:
    linear-gradient(90deg, rgba(123, 97, 255, 0.12) 1px, transparent 1px),
    linear-gradient(180deg, rgba(123, 97, 255, 0.12) 1px, transparent 1px),
    rgba(255, 255, 255, 0.78) !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .buyer-gender-grid,
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-ethnicity-grid {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-change-panel {
  gap: 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-preset-grid {
  gap: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-preset-button {
  min-height: 56px !important;
  padding: 10px 12px !important;
  border-radius: 14px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-preset-button strong {
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.12 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-preset-button small {
  margin-top: 2px !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-orbit-card {
  grid-template-columns: 64px minmax(0, 1fr) !important;
  gap: 12px !important;
  padding: 10px 12px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #f8f9fc !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-orbit-sphere {
  width: 56px !important;
  height: 56px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-orbit-subject {
  width: 30px !important;
  height: 30px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-orbit-card small {
  font-size: 12px !important;
  line-height: 1.45 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-angle-controls {
  display: grid !important;
  gap: 10px !important;
  padding: 12px !important;
  border: 1px solid rgba(220, 213, 244, 0.78) !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-angle-row {
  grid-template-columns: 68px minmax(0, 1fr) 42px !important;
  gap: 10px !important;
  min-height: 28px !important;
  font-size: 13px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="view-change"] .view-reset-button {
  min-height: 40px !important;
  margin-top: -2px !important;
  border-radius: 13px !important;
}

body[data-active-feature="buyer-show"] .buyer-ethnicity-grid .choice-button,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .buyer-gender-grid .choice-button,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-ethnicity-grid .choice-button,
body[data-active-feature="beauty-makeup-try-on"] .beauty-makeup-option-grid .choice-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 46px !important;
  border: 1px solid rgba(220, 213, 244, 0.88) !important;
  border-radius: 14px !important;
  color: #34394b !important;
  background: rgba(255, 255, 255, 0.82) !important;
  box-shadow: none !important;
  text-align: center !important;
  font-size: 14px !important;
  font-weight: 520 !important;
  line-height: 1 !important;
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease !important;
}

body[data-active-feature="buyer-show"] .buyer-ethnicity-grid .choice-button::before,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .buyer-gender-grid .choice-button::before,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-ethnicity-grid .choice-button::before,
body[data-active-feature="beauty-makeup-try-on"] .beauty-makeup-option-grid .choice-button::before {
  width: 7px !important;
  height: 7px !important;
  border-radius: 999px !important;
  background: #c2c8d6 !important;
  content: "" !important;
}

body[data-active-feature="buyer-show"] .buyer-ethnicity-grid .choice-button:hover,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .buyer-gender-grid .choice-button:hover,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-ethnicity-grid .choice-button:hover,
body[data-active-feature="beauty-makeup-try-on"] .beauty-makeup-option-grid .choice-button:hover {
  border-color: rgba(171, 162, 222, 0.76) !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(87, 91, 120, 0.06) !important;
}

body[data-active-feature="buyer-show"] .buyer-ethnicity-grid .choice-button.selected,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .buyer-gender-grid .choice-button.selected,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-ethnicity-grid .choice-button.selected,
body[data-active-feature="beauty-makeup-try-on"] .beauty-makeup-option-grid .choice-button.selected {
  border-color: rgba(91, 75, 232, 0.52) !important;
  color: #5142d6 !important;
  background: #f5f3ff !important;
  box-shadow: 0 9px 20px rgba(91, 75, 232, 0.1) !important;
}

body[data-active-feature="buyer-show"] .buyer-ethnicity-grid .choice-button.selected::before,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .buyer-gender-grid .choice-button.selected::before,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-ethnicity-grid .choice-button.selected::before,
body[data-active-feature="beauty-makeup-try-on"] .beauty-makeup-option-grid .choice-button.selected::before {
  background: #5b4be8 !important;
}

body[data-active-feature="buyer-show"] .buyer-age-grid .choice-button,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-model-age-grid .choice-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 46px !important;
  border: 1px solid rgba(220, 213, 244, 0.88) !important;
  border-radius: 14px !important;
  color: #34394b !important;
  background: rgba(255, 255, 255, 0.82) !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 520 !important;
  line-height: 1 !important;
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease !important;
}

body[data-active-feature="buyer-show"] .buyer-age-grid .choice-button::before,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-model-age-grid .choice-button::before {
  width: 7px !important;
  height: 7px !important;
  border-radius: 999px !important;
  background: #c2c8d6 !important;
  content: "" !important;
}

body[data-active-feature="buyer-show"] .buyer-age-grid .choice-button:hover,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-model-age-grid .choice-button:hover {
  border-color: rgba(171, 162, 222, 0.76) !important;
  color: #5142d6 !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(87, 91, 120, 0.06) !important;
}

body[data-active-feature="buyer-show"] .buyer-age-grid .choice-button.selected,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-model-age-grid .choice-button.selected {
  border-color: rgba(91, 75, 232, 0.52) !important;
  color: #5142d6 !important;
  background: #f5f3ff !important;
  box-shadow: 0 9px 20px rgba(91, 75, 232, 0.1) !important;
}

body[data-active-feature="buyer-show"] .buyer-age-grid .choice-button.selected::before,
body:is([data-active-feature="clothes-on-model"], [data-active-feature="free-match"]) .clothes-model-age-grid .choice-button.selected::before {
  background: #5b4be8 !important;
}

/* Advanced feature settings alignment: keep each custom workflow visually consistent. */
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="video-generate"],
  [data-active-feature="buyer-try-on"],
  [data-active-feature="set-generate"]
) #product-upload,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-upload-card {
  border: 1px dashed rgba(220, 213, 244, 0.78) !important;
  border-radius: 18px !important;
  color: var(--ink) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="video-generate"],
  [data-active-feature="buyer-try-on"],
  [data-active-feature="set-generate"]
) #product-upload:hover,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="video-generate"],
  [data-active-feature="buyer-try-on"],
  [data-active-feature="set-generate"]
) #product-upload:focus-visible,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-upload-card:hover {
  border-color: var(--line) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="video-generate"],
  [data-active-feature="buyer-try-on"],
  [data-active-feature="set-generate"]
) #product-upload .upload-icon {
  color: var(--purple) !important;
  background: var(--purple-soft) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="video-generate"],
  [data-active-feature="buyer-try-on"],
  [data-active-feature="set-generate"]
) .settings-card,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="video-generate"],
  [data-active-feature="buyer-try-on"],
  [data-active-feature="set-generate"]
) .extra-prompt-box,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="video-generate"],
  [data-active-feature="buyer-try-on"],
  [data-active-feature="set-generate"]
) .inline-model-section,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="video-generate"],
  [data-active-feature="buyer-try-on"],
  [data-active-feature="set-generate"]
) .generate-count-box,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="video-generate"],
  [data-active-feature="buyer-try-on"],
  [data-active-feature="set-generate"]
) .generation-resolution-section,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="video-generate"],
  [data-active-feature="buyer-try-on"],
  [data-active-feature="set-generate"]
) .detail-page-resolution-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-basic-selects,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-basic-select-card,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-generate-settings,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-setting-block,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-settings,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-product-type-block,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-model-role-field,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-shot-picker {
  border: 1px solid rgba(220, 213, 244, 0.78) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.72) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(249, 246, 255, 0.72) 100%) !important;
  box-shadow: 0 14px 34px rgba(105, 91, 164, 0.065) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-basic-selects,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-basic-select-card,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-generate-settings,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-settings,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-product-type-block {
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-resolution-panel {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-basic-select-card {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .extra-prompt-box {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-upload-options,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-generate-settings,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-setting-block,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-select-field {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-generate-settings {
  display: grid !important;
  gap: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-setting-block {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-setting-block .experience-label {
  color: #2e3448 !important;
  font-size: 12.5px !important;
  font-weight: 720 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-select {
  position: relative !important;
  z-index: 40 !important;
  display: block !important;
  width: 100% !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-select summary {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) 34px !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 50px !important;
  padding: 6px 7px 6px 16px !important;
  border: 1px solid rgba(213, 208, 238, 0.92) !important;
  border-radius: 14px !important;
  color: #232942 !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfbff 100%) !important;
  box-shadow: 0 7px 18px rgba(77, 67, 145, 0.055) !important;
  cursor: pointer !important;
  list-style: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-select summary::-webkit-details-marker {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-select summary span {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-select summary strong {
  color: #232942 !important;
  font-size: 13px !important;
  font-weight: 720 !important;
  line-height: 1.15 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-select summary small {
  color: #8b91a6 !important;
  font-size: 11.5px !important;
  font-weight: 520 !important;
  line-height: 1.15 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-select summary .lucide {
  justify-self: center !important;
  width: 34px !important;
  height: 34px !important;
  padding: 8px !important;
  border-radius: 13px !important;
  color: #6b5bea !important;
  background: rgba(109, 85, 238, 0.09) !important;
  transition: transform 0.16s ease, background 0.16s ease !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-select summary:hover {
  border-color: rgba(109, 85, 238, 0.36) !important;
  box-shadow: 0 12px 26px rgba(77, 67, 145, 0.1) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-select[open] {
  z-index: 1600 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-select[open] summary {
  border-color: rgba(109, 85, 238, 0.55) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.1), 0 14px 28px rgba(77, 67, 145, 0.12) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-select[open] summary .lucide {
  background: rgba(109, 85, 238, 0.15) !important;
  transform: rotate(180deg) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-menu {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  right: 0 !important;
  left: 0 !important;
  z-index: 1700 !important;
  display: grid !important;
  gap: 6px !important;
  max-height: 286px !important;
  overflow-y: auto !important;
  padding: 8px !important;
  border: 1px solid rgba(226, 222, 244, 0.98) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 18px 40px rgba(42, 36, 81, 0.16) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-menu button {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 48px !important;
  padding: 8px 11px !important;
  border: 1px solid rgba(224, 226, 237, 0.9) !important;
  border-radius: 13px !important;
  color: #30364b !important;
  background: rgba(255, 255, 255, 0.9) !important;
  text-align: left !important;
  cursor: pointer !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-menu button span {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-menu button strong {
  color: #252c42 !important;
  font-size: 13px !important;
  font-weight: 720 !important;
  line-height: 1.15 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-menu button small {
  color: #8d94a8 !important;
  font-size: 11.5px !important;
  font-weight: 520 !important;
  line-height: 1.15 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-option-title {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-name,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-description {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-option-meta {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-description {
  flex: 0 1 auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-option-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  min-width: 70px !important;
  margin-left: auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-credit {
  flex: 0 0 auto !important;
  padding: 2px 7px !important;
  border: 1px solid rgba(177, 91, 105, 0.12) !important;
  border-radius: 999px !important;
  color: #ad5967 !important;
  background: rgba(177, 91, 105, 0.065) !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-logo {
  display: block !important;
  width: 34px !important;
  height: 34px !important;
  padding: 5px !important;
  border: 1px solid rgba(219, 216, 232, 0.82) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  object-fit: contain !important;
  box-shadow: 0 3px 8px rgba(50, 45, 78, 0.05) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-recommended-badge {
  flex: 0 0 auto !important;
  padding: 2px 6px !important;
  border-radius: 999px !important;
  color: #a96d2b !important;
  background: rgba(199, 139, 59, 0.1) !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 760 !important;
  line-height: 1.25 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-official-badge {
  flex: 0 0 auto !important;
  padding: 2px 7px !important;
  border: 1px solid rgba(87, 103, 228, 0.22) !important;
  border-radius: 999px !important;
  color: #5864d9 !important;
  background: rgba(87, 103, 228, 0.09) !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 760 !important;
  line-height: 1.35 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-menu-section-title {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  margin: 3px 4px 0 !important;
  color: #70778d !important;
  font-size: 10.5px !important;
  font-weight: 720 !important;
  line-height: 1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-menu-section-title::after {
  content: "" !important;
  flex: 1 1 auto !important;
  height: 1px !important;
  background: rgba(218, 214, 235, 0.9) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-menu button:hover {
  border-color: rgba(109, 85, 238, 0.18) !important;
  background: rgba(109, 85, 238, 0.06) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-menu button.selected {
  border-color: rgba(109, 85, 238, 0.32) !important;
  background: linear-gradient(180deg, rgba(109, 85, 238, 0.12), rgba(109, 85, 238, 0.07)) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-menu button.selected strong {
  color: #5e4be5 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-menu button:disabled {
  cursor: not-allowed !important;
  opacity: 0.52 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-select-field {
  position: relative !important;
  display: block !important;
  border-radius: 16px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-select-field::after {
  content: "";
  position: absolute;
  right: 16px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-right: 2px solid #6b5bea;
  border-bottom: 2px solid #6b5bea;
  pointer-events: none;
  transform: translateY(-65%) rotate(45deg);
  z-index: 2;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-select-field::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 8px;
  width: 30px;
  height: 30px;
  border-radius: 12px;
  background: rgba(109, 85, 238, 0.09);
  pointer-events: none;
  transform: translateY(-50%);
  z-index: 1;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-select-field select {
  width: 100% !important;
  min-height: 48px !important;
  padding: 0 50px 0 16px !important;
  border: 1px solid rgba(213, 208, 238, 0.92) !important;
  border-radius: 16px !important;
  color: #232942 !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfbff 100%) !important;
  box-shadow: 0 10px 24px rgba(77, 67, 145, 0.07) !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  outline: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-select-field select:hover {
  border-color: rgba(109, 85, 238, 0.36) !important;
  box-shadow: 0 12px 26px rgba(77, 67, 145, 0.1) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-select-field select:focus {
  border-color: rgba(109, 85, 238, 0.55) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.1), 0 14px 28px rgba(77, 67, 145, 0.12) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-setting-hint {
  color: #8a91a3 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel {
  display: grid !important;
  gap: 10px !important;
  padding: 12px !important;
  border: 1px solid rgba(224, 228, 240, 0.9) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.82) !important;
  box-shadow: 0 12px 28px rgba(40, 46, 72, 0.055) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-tabs {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
  padding: 4px !important;
  border-radius: 14px !important;
  background: #f4f6fb !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-tabs button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-height: 42px !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 11px !important;
  color: #667087 !important;
  background: transparent !important;
  font-size: 14px !important;
  font-weight: 780 !important;
  cursor: pointer !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-tabs button.selected {
  color: #ffffff !important;
  background: #5b4be8 !important;
  box-shadow: 0 10px 22px rgba(91, 75, 232, 0.18) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-tabs .lucide {
  width: 16px !important;
  height: 16px !important;
  stroke-width: 2.3 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-note {
  margin: -1px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #9aa1b4 !important;
  background: transparent !important;
  font-size: 11px !important;
  font-weight: 520 !important;
  line-height: 1.45 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-empty {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 9px 10px !important;
  border: 1px dashed rgba(178, 187, 208, 0.72) !important;
  border-radius: 12px !important;
  color: #8b93a8 !important;
  background: rgba(248, 250, 253, 0.82) !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-empty .lucide {
  width: 18px !important;
  height: 18px !important;
  color: #7b61ff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-type,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-shot-block,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-motion,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-control,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-materials {
  gap: 7px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-type > span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-shot-block > span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-motion > span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-control span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-materials-head span,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-image-count span {
  color: #343a4d !important;
  font-size: 12.5px !important;
  font-weight: 760 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-type div,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-motion div {
  gap: 7px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-type button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-motion button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-shot-options button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 34px !important;
  border: 1px solid #dfe4ef !important;
  border-radius: 10px !important;
  color: #596176 !important;
  background: #ffffff !important;
  font-size: 12.5px !important;
  font-weight: 720 !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-type button::before,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-motion button::before,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-shot-options button::before {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-type button:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-motion button:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-shot-options button:hover {
  border-color: rgba(91, 75, 232, 0.4) !important;
  color: #4f45bd !important;
  background: #ffffff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-type button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-motion button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-shot-options button.selected {
  border-color: rgba(91, 75, 232, 0.7) !important;
  color: #5b4be8 !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(91, 75, 232, 0.08), 0 7px 16px rgba(91, 75, 232, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-type button.selected::before,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-motion button.selected::before,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-shot-options button.selected::before {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-shot-options {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-material-row {
  grid-template-columns: 52px minmax(0, 1fr) !important;
  gap: 7px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-material-row > span {
  font-size: 12.5px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-material-row input,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-image-count select {
  height: 34px !important;
  border-radius: 10px !important;
  font-size: 12.5px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-panel .video-storyboard-control textarea {
  min-height: 82px !important;
  border-radius: 11px !important;
  font-size: 12.5px !important;
  line-height: 1.5 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(112px, auto) !important;
  align-items: end !important;
  gap: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-actions {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-actions .primary-button {
  min-height: 38px !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: 12px !important;
  color: #fff !important;
  background: #151324 !important;
  box-shadow: 0 12px 24px rgba(21, 19, 36, 0.18) !important;
  font-size: 13px !important;
  font-weight: 760 !important;
  cursor: pointer !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-actions .primary-button:disabled,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-assist-actions .primary-button[aria-disabled="true"] {
  color: rgba(255, 255, 255, 0.72) !important;
  background: #c4c7d4 !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-empty {
  padding: 10px 11px !important;
  border-radius: 12px !important;
  color: #8b93a8 !important;
  background: #f8f9fc !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-result-list {
  display: grid !important;
  gap: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 52px !important;
  gap: 8px !important;
  padding: 10px !important;
  border: 1px solid rgba(224, 228, 240, 0.95) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-card div {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-card strong {
  color: #2e3448 !important;
  font-size: 12.5px !important;
  font-weight: 760 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-card p {
  display: -webkit-box !important;
  overflow: hidden !important;
  margin: 0 !important;
  color: #667087 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 4 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-card button {
  align-self: center !important;
  min-height: 30px !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #5b4be8 !important;
  background: rgba(91, 75, 232, 0.1) !important;
  font-size: 12px !important;
  font-weight: 760 !important;
  cursor: pointer !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-latest-inline-empty {
  display: grid !important;
  place-content: center !important;
  gap: 5px !important;
  height: 100% !important;
  color: #8f97aa !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-latest-inline-empty strong {
  color: #697185 !important;
  font-size: 13px !important;
  font-weight: 720 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-latest-inline-empty small {
  font-size: 11px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-preview-panel {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 8px !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 10px 12px !important;
  overflow: hidden !important;
  border: 1px solid rgba(218, 222, 235, 0.88) !important;
  border-radius: 12px !important;
  background: rgba(250, 251, 254, 0.9) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-preview-head {
  display: flex !important;
  align-items: baseline !important;
  gap: 9px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-preview-head strong {
  color: #2f3548 !important;
  font-size: 13px !important;
  font-weight: 780 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-preview-head small {
  color: #9aa1b2 !important;
  font-size: 10.5px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-preview-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-preview-list .video-script-card {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  gap: 7px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 9px 10px !important;
  overflow: hidden !important;
  border-radius: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-preview-list .video-script-card.is-selected {
  border-color: rgba(91, 75, 232, 0.55) !important;
  background: rgba(247, 245, 255, 0.96) !important;
  box-shadow: inset 0 0 0 1px rgba(91, 75, 232, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-preview-list .video-script-card p {
  -webkit-line-clamp: 5 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-preview-list .video-script-card button {
  align-self: end !important;
  width: 100% !important;
  min-height: 27px !important;
  border-radius: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-preview-empty {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 0 !important;
  color: #9299aa !important;
  font-size: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-preview-empty .lucide {
  width: 17px !important;
  height: 17px !important;
  color: #7b61ff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-script-preview-empty.is-busy .lucide {
  animation: spin 0.9s linear infinite !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-product-type-grid .choice-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-mode-grid .choice-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-model-role-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-model-style-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-shot-option,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-resolution-options button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-compact-select summary {
  border-color: rgba(220, 213, 244, 0.78) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-product-type-grid .choice-button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-mode-grid .choice-button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-model-role-button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-model-style-button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-shot-option.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-resolution-options button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-compact-select[open] summary {
  border-color: rgba(109, 85, 238, 0.58) !important;
  color: var(--purple) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .video-bottom-options {
  gap: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .video-bottom-options .video-compact-select summary {
  display: grid !important;
  grid-template-columns: 30px minmax(0, 1fr) 16px !important;
  grid-template-areas:
    "icon label arrow"
    "icon value arrow" !important;
  align-items: center !important;
  column-gap: 8px !important;
  row-gap: 1px !important;
  min-height: 58px !important;
  padding: 7px 11px !important;
  border: 1px solid rgba(220, 213, 244, 0.9) !important;
  border-radius: 17px !important;
  color: #30364b !important;
  background: rgba(255, 255, 255, 0.86) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .video-bottom-options .video-compact-select summary > .lucide:first-child {
  grid-area: icon !important;
  align-self: center !important;
  justify-self: center !important;
  width: 28px !important;
  height: 28px !important;
  padding: 6px !important;
  border-radius: 10px !important;
  color: #6d55ee !important;
  background: rgba(109, 85, 238, 0.1) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .video-bottom-options .video-compact-select summary span {
  grid-area: label !important;
  align-self: end !important;
  color: #465066 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .video-bottom-options .video-compact-select summary strong {
  grid-area: value !important;
  justify-self: start !important;
  align-self: start !important;
  color: #6d55ee !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.15 !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .video-bottom-options .video-compact-select summary > .lucide:last-child {
  grid-area: arrow !important;
  justify-self: end !important;
  width: 16px !important;
  height: 16px !important;
  color: #9b8dff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .settings-column .video-bottom-options .video-compact-select[open] summary {
  border-color: rgba(109, 85, 238, 0.58) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options {
  gap: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options .video-compact-select summary {
  display: grid !important;
  grid-template-columns: 30px minmax(0, 1fr) 16px !important;
  grid-template-areas:
    "icon label arrow"
    "icon value arrow" !important;
  align-items: center !important;
  column-gap: 8px !important;
  row-gap: 1px !important;
  min-height: 58px !important;
  padding: 7px 11px !important;
  border: 1px solid rgba(220, 213, 244, 0.9) !important;
  border-radius: 17px !important;
  color: #30364b !important;
  background: rgba(255, 255, 255, 0.86) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options .video-compact-select summary > .lucide:first-child {
  grid-area: icon !important;
  align-self: center !important;
  justify-self: center !important;
  width: 28px !important;
  height: 28px !important;
  padding: 6px !important;
  border-radius: 10px !important;
  color: #6d55ee !important;
  background: rgba(109, 85, 238, 0.1) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options .video-compact-select summary span {
  grid-area: label !important;
  align-self: end !important;
  color: #465066 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options .video-compact-select summary strong {
  grid-area: value !important;
  justify-self: start !important;
  align-self: start !important;
  color: #6d55ee !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.15 !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options .video-compact-select summary > .lucide:last-child {
  grid-area: arrow !important;
  justify-self: end !important;
  width: 16px !important;
  height: 16px !important;
  color: #9b8dff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-bottom-options .video-compact-select[open] summary {
  border-color: rgba(109, 85, 238, 0.58) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08) !important;
}

/* Customer fitting room: keep the controls, remove only the outer settings frame. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] #settings-card,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] #settings-card:hover {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] #preview-title {
  display: none !important;
}

@media (min-width: 761px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .task-heading {
    display: none !important;
  }
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .buyer-tryon-settings {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  min-height: 100% !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .buyer-tryon-max-field {
  gap: 8px !important;
  padding: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .buyer-tryon-max-field > span {
  color: #2d3448 !important;
  font-size: 13px !important;
  font-weight: 525 !important;
  line-height: 1.25 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .buyer-tryon-max-options {
  gap: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .buyer-tryon-max-option {
  height: 42px !important;
  border: 1px solid rgba(220, 213, 244, 0.88) !important;
  border-radius: 13px !important;
  color: #34394b !important;
  background: rgba(255, 255, 255, 0.82) !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .buyer-tryon-max-option:hover {
  border-color: rgba(171, 162, 222, 0.76) !important;
  color: #31384c !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(87, 91, 120, 0.06) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .buyer-tryon-max-option.is-selected {
  border-color: rgba(91, 75, 232, 0.52) !important;
  color: #5142d6 !important;
  background: #f5f3ff !important;
  box-shadow: 0 9px 20px rgba(91, 75, 232, 0.1) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .buyer-tryon-fixed-note {
  min-height: 42px !important;
  border: 1px solid rgba(220, 213, 244, 0.78) !important;
  border-radius: 14px !important;
  color: #5f6478 !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(255, 255, 255, 0.78) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.86) 0%, rgba(249, 246, 255, 0.74) 100%) !important;
  box-shadow: none !important;
  font-size: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .buyer-tryon-fixed-note .lucide {
  color: var(--purple) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] #generate .generation-credit-cost,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] #mobile-generate .generation-credit-cost {
  display: none !important;
}

/* Detail page should not have an extra outer settings frame. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-column,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-card,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-basic-selects {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-heading,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-body:not([hidden]) .upload-column,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-column,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-bottom-area {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Set-generate bottom controls: ratio above, three options in one row, generate below. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .settings-bottom-area {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: auto auto auto !important;
  gap: 12px !important;
  align-items: stretch !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .generate-count-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .generate-action-row {
  display: contents !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-ratio-section:not([hidden]) {
  display: block !important;
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .inline-model-section {
  grid-column: 1 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .generate-count-section {
  grid-column: 2 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .generation-resolution-section {
  grid-column: 3 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .create-button.full {
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
  width: 100% !important;
}

/* Robust set-generate bottom order, independent of broad workstation rules. */
body[data-active-feature="set-generate"] .settings-bottom-area {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: auto auto auto !important;
  gap: 12px !important;
  align-items: stretch !important;
  overflow: visible !important;
}

body[data-active-feature="set-generate"] #generate-count-box,
body[data-active-feature="set-generate"] .generate-action-row {
  display: contents !important;
}

body[data-active-feature="set-generate"] #set-ratio-section:not([hidden]) {
  display: block !important;
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
}

body[data-active-feature="set-generate"] #inline-model-section {
  grid-column: 1 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
}

body[data-active-feature="set-generate"] #generate-count-box > .generate-count-section {
  grid-column: 2 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
}

body[data-active-feature="set-generate"] #generate-count-box > .generation-resolution-section {
  grid-column: 3 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
}

body[data-active-feature="set-generate"] #generate.create-button.full {
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
  width: 100% !important;
}

/* Set-generate inner settings should sit directly on the main settings surface. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-settings,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-product-type-block,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-shot-picker {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Fashion set generation: keep the model audience and shooting style as
   lightweight option groups instead of nesting two more cards. */
html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-model-role-field {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Fashion set generation: use plain section labels without decorative pills. */
html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-model-role-field .experience-label {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Pet set generation: match the same plain treatment for pet type and shooting style labels. */
html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-model-role-field .experience-label {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Set-generate type buttons are primary choices, keep their helper text visible. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-mode-block .set-mode-grid {
  gap: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-mode-block .set-mode-button {
  display: grid !important;
  align-content: center !important;
  justify-items: center !important;
  gap: 7px !important;
  min-height: 76px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(123, 97, 255, 0.28) !important;
  border-radius: 16px !important;
  color: #282f45 !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfaff 100%) !important;
  box-shadow: 0 10px 22px rgba(105, 91, 164, 0.07) !important;
  font-size: 16px !important;
  font-weight: 650 !important;
  line-height: 1.15 !important;
  text-align: center !important;
}

/* Keep the fashion set-type title stronger than the shared typography layer. */
html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .task-body .set-generate-mode-block .set-mode-button {
  font-weight: 650 !important;
}

/* Keep pet and product set titles equally prominent on the pet surface. */
html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .task-body .set-generate-mode-block .set-mode-button {
  font-weight: 650 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-mode-block .set-mode-button small {
  display: block !important;
  max-width: 18em !important;
  color: #7c7897 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-mode-block .set-mode-button.selected {
  border-color: rgba(91, 73, 230, 0.72) !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #5b4be8 0%, #7762ff 100%) !important;
  box-shadow: 0 13px 26px rgba(91, 73, 230, 0.2) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-generate-mode-block .set-mode-button.selected small {
  display: block !important;
  color: rgba(255, 255, 255, 0.84) !important;
}

/* Pet set generation: keep pet-type and shot choices calm and readable. */
html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] #settings-card {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-model-role-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-shot-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-model-role-field,
html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-shot-field {
  display: grid !important;
  gap: 11px !important;
}

html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-shot-field {
  padding: 12px !important;
  border: 1px solid rgba(123, 97, 255, 0.16) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, #fbfaff, #ffffff) !important;
}

html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-shot-actions {
  gap: 10px !important;
  padding: 10px !important;
  border: 1px solid rgba(91, 73, 230, 0.2) !important;
  border-radius: 15px !important;
  background: rgba(91, 73, 230, 0.055) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
}

html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-shot-grid {
  padding-top: 13px !important;
  border-top: 1px solid rgba(123, 97, 255, 0.13) !important;
}

html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-model-role-button {
  min-height: 50px !important;
  padding: 9px 12px !important;
  border-radius: 14px !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  white-space: normal !important;
}

html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .set-shot-option {
  min-height: 44px !important;
  padding: 9px 12px !important;
  border-radius: 13px !important;
  font-size: 13px !important;
  line-height: 1.3 !important;
}

/* On shorter desktop screens, let the pet set workflow use page scrolling so
   the viewpoint presets are not squeezed behind the fixed generation controls. */
@media (min-width: 981px) and (max-height: 820px) {
  html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] {
    height: auto !important;
    min-height: 100vh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .app-layout,
  html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .main-area,
  html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .content-grid,
  html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .workspace,
  html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .task-panel {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .app-layout,
  html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .main-area {
    min-height: 100vh !important;
  }

  html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .task-panel {
    grid-template-rows: auto auto auto auto !important;
  }

  html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .settings-column {
    grid-template-rows: auto auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  html:is([data-industry="pet"], [data-industry="beauty"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] .settings-scroll-area {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* Sidebar brand polish. */
.brand {
  min-height: 104px !important;
  padding: 24px 6px 14px !important;
  gap: 5px !important;
  isolation: isolate;
}

.brand::before {
  position: absolute;
  left: 50%;
  top: 54%;
  z-index: -1;
  display: block !important;
  width: 210px;
  height: 108px;
  border-radius: 999px;
  background:
    radial-gradient(ellipse at 50% 44%, rgba(196, 179, 255, 0.32) 0%, rgba(222, 211, 255, 0.18) 42%, transparent 72%),
    radial-gradient(ellipse at 42% 72%, rgba(255, 226, 244, 0.2) 0%, transparent 58%);
  content: "";
  filter: blur(2px);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.brand::after {
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 4px;
  height: 1px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(183, 170, 232, 0.46), transparent);
  content: "";
  pointer-events: none;
}

.brand-logo {
  width: min(100%, 146px) !important;
  height: 33px !important;
}

.brand-tagline {
  max-width: 176px !important;
  color: rgba(93, 96, 118, 0.74) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
}

/* Prompt-heavy features use the instruction box as the main control, keep it light and roomy. */
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="prompt-edit"], [data-active-feature="background"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="outpaint"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"]) .extra-prompt-box {
  gap: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="prompt-edit"], [data-active-feature="background"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="outpaint"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"]) .extra-prompt-box::before {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="prompt-edit"], [data-active-feature="background"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="outpaint"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"]) .extra-prompt-box span {
  min-height: auto !important;
  color: #30384d !important;
  font-size: 14px !important;
  font-weight: 560 !important;
  line-height: 1.25 !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="prompt-edit"], [data-active-feature="background"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="outpaint"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"]) .extra-prompt-box textarea {
  height: 280px !important;
  min-height: 280px !important;
  max-height: 280px !important;
  padding: 16px 17px 58px !important;
  border: 1px solid rgba(214, 210, 236, 0.96) !important;
  border-radius: 14px !important;
  color: #20263a !important;
  background: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 10px 22px rgba(105, 91, 164, 0.055) !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="prompt-edit"], [data-active-feature="background"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="outpaint"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"]) .extra-prompt-box textarea:focus {
  border-color: rgba(109, 85, 238, 0.55) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08), 0 12px 24px rgba(105, 91, 164, 0.08) !important;
}

.prompt-optimize-button {
  display: none;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="prompt-edit"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="outpaint"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"]) .prompt-optimize-button {
  position: absolute;
  right: 12px;
  bottom: 12px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(109, 85, 238, 0.24);
  border-radius: 999px;
  color: #5b4be8;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 10px 20px rgba(91, 73, 230, 0.12);
  font-size: 11px;
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="prompt-edit"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="outpaint"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"]) .prompt-optimize-button .lucide {
  width: 13px;
  height: 13px;
  stroke-width: 2.2;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="prompt-edit"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="outpaint"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"]) .prompt-optimize-button span {
  font-weight: 450 !important;
  -webkit-font-smoothing: antialiased;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="prompt-edit"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="outpaint"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"]) .prompt-optimize-button:hover:not(:disabled) {
  border-color: rgba(91, 73, 230, 0.5);
  color: #ffffff;
  background: #5b4be8;
  box-shadow: 0 12px 24px rgba(91, 73, 230, 0.2);
  transform: translateY(-1px);
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="prompt-edit"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="outpaint"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"]) .prompt-optimize-button:disabled {
  color: #aaa6be;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: none;
  cursor: not-allowed;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="prompt-edit"], [data-active-feature="background"], [data-active-feature="flat-lay"], [data-active-feature="colors"], [data-active-feature="try-on"], [data-active-feature="clothes-on-model"], [data-active-feature="outpaint"], [data-active-feature="watermark-remove"], [data-active-feature="background-remove"], [data-active-feature="poster-design"], [data-active-feature="live-sticker"], [data-active-feature="pose-change"]) .prompt-optimize-button.is-busy {
  color: #ffffff;
  background: #5b4be8;
  cursor: wait;
}

/* Wrinkle strength: quiet option cards. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .wrinkle-strength-box,
body[data-active-feature="wrinkle"] .wrinkle-strength-box {
  display: grid !important;
  gap: 10px !important;
  width: 100% !important;
  margin-top: 6px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .wrinkle-strength-title,
body[data-active-feature="wrinkle"] .wrinkle-strength-title {
  display: flex !important;
  align-items: center !important;
  min-height: 18px !important;
  margin: 0 !important;
  color: #374055 !important;
  font-size: 14px !important;
  font-weight: 520 !important;
  line-height: 1.25 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .wrinkle-strength-row,
body[data-active-feature="wrinkle"] .wrinkle-strength-row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .wrinkle-strength-button,
body[data-active-feature="wrinkle"] .wrinkle-strength-button {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 44px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(219, 216, 235, 0.96) !important;
  border-radius: 13px !important;
  color: #51596c !important;
  background: #ffffff !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 520 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .wrinkle-strength-button::before,
body[data-active-feature="wrinkle"] .wrinkle-strength-button::before {
  width: 6px !important;
  height: 6px !important;
  border-radius: 999px !important;
  background: #c2c8d6 !important;
  content: "" !important;
  transition: background 0.16s ease, transform 0.16s ease !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .wrinkle-strength-button:hover,
body[data-active-feature="wrinkle"] .wrinkle-strength-button:hover {
  border-color: rgba(171, 162, 222, 0.76) !important;
  color: #31384c !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(87, 91, 120, 0.06) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .wrinkle-strength-button.selected,
body[data-active-feature="wrinkle"] .wrinkle-strength-button.selected {
  border-color: rgba(91, 75, 232, 0.52) !important;
  color: #5142d6 !important;
  background: #f5f3ff !important;
  box-shadow: 0 9px 20px rgba(91, 75, 232, 0.1) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="wrinkle"] .wrinkle-strength-button.selected::before,
body[data-active-feature="wrinkle"] .wrinkle-strength-button.selected::before {
  background: #5b4be8 !important;
  transform: scale(1.12) !important;
}

@media (max-width: 760px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] {
    min-width: 0 !important;
    overflow-x: hidden !important;
    background: #f7f8fb !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .app-layout,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .main-area,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .content-grid,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .workspace,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .task-panel {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .sidebar {
    position: sticky !important;
    top: 0 !important;
    z-index: 80 !important;
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 8px 10px 7px !important;
    overflow: visible !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(222, 226, 239, 0.92) !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 8px 24px rgba(56, 61, 88, 0.08) !important;
    backdrop-filter: blur(14px) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .brand {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 0 8px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .brand-mark {
    width: 34px !important;
    height: 34px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .brand h1 {
    font-size: 15px !important;
    line-height: 1.12 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .brand p,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav p,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav .nav-tail {
    display: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 7px !important;
    padding: 0 0 2px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav::-webkit-scrollbar {
    display: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav a,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav .nav-primary {
    flex: 0 0 auto !important;
    min-height: 34px !important;
    padding: 0 10px !important;
    border-radius: 10px !important;
    font-size: 13px !important;
    white-space: nowrap !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav .lucide,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav .nav-primary[data-nav-target] .lucide {
    width: 15px !important;
    height: 15px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .topbar {
    position: static !important;
    display: grid !important;
    gap: 8px !important;
    min-height: 0 !important;
    padding: 9px 10px !important;
    border-bottom: 1px solid rgba(229, 232, 242, 0.9) !important;
    background: rgba(255, 255, 255, 0.88) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .top-actions {
    display: flex !important;
    gap: 8px !important;
    overflow-x: auto !important;
    padding-bottom: 2px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .top-actions > * {
    flex: 0 0 auto !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .content-grid {
    padding: 12px 10px calc(88px + env(safe-area-inset-bottom)) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .task-panel {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .task-heading {
    display: block !important;
    padding: 2px 2px 10px !important;
    border: 0 !important;
    background: transparent !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .task-heading-copy span {
    display: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .task-heading h2 {
    margin: 0 0 4px !important;
    font-size: 23px !important;
    line-height: 1.18 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .task-heading p {
    max-width: none !important;
    margin: 0 !important;
    color: #6f7586 !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .task-body {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: none !important;
    gap: 12px !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .upload-column,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .settings-column,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .preview-column {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .upload-column {
    order: 1 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .settings-column {
    order: 2 !important;
    display: grid !important;
    gap: 10px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .preview-column {
    order: 3 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .upload-primary-row,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .upload-card-wrap {
    display: block !important;
    width: 100% !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] #product-upload,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .upload-column:has(.multi-upload-preview-strip:not([hidden])) #product-upload,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .upload-column:has(.single-upload-preview-strip:not([hidden])) #product-upload {
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 11px !important;
    width: 100% !important;
    min-height: 128px !important;
    padding: 14px !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 28px rgba(61, 67, 94, 0.07) !important;
    text-align: left !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] #product-upload .upload-icon {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 42px !important;
    height: 42px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] #product-upload .upload-copy {
    grid-column: 2 !important;
    grid-row: 1 !important;
    gap: 4px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .multi-upload-preview-strip,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .single-upload-preview-strip {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    display: flex !important;
    gap: 8px !important;
    width: 100% !important;
    margin-top: 2px !important;
    padding: 8px 8px 4px 1px !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    scrollbar-width: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .multi-upload-preview-strip::-webkit-scrollbar,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .single-upload-preview-strip::-webkit-scrollbar {
    display: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .multi-upload-preview-card,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .single-upload-preview-card {
    flex: 0 0 68px !important;
    width: 68px !important;
    min-width: 68px !important;
    height: 88px !important;
    border-radius: 12px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .multi-upload-preview-card img,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .single-upload-preview-card img {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .background-reference-preview-strip .single-upload-preview-card,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .color-reference-preview-strip .single-upload-preview-card,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .secondary-reference-preview-strip .single-upload-preview-card {
    flex: 0 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: 82px !important;
    max-width: 118px !important;
    aspect-ratio: var(--preview-aspect, 1 / 1) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .background-reference-preview-strip .single-upload-preview-card img,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .color-reference-preview-strip .single-upload-preview-card img,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .secondary-reference-preview-strip .single-upload-preview-card img {
    object-fit: contain !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .settings-scroll-area {
    display: grid !important;
    gap: 10px !important;
    height: auto !important;
    max-height: none !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .wrinkle-strength-box,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .extra-prompt-box,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .settings-bottom-area {
    width: 100% !important;
    border: 1px solid rgba(224, 227, 238, 0.92) !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 28px rgba(61, 67, 94, 0.06) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .wrinkle-strength-box {
    padding: 14px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .wrinkle-strength-row {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .wrinkle-strength-button {
    min-height: 42px !important;
    padding: 0 8px !important;
    border-radius: 12px !important;
    font-size: 14px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .extra-prompt-box {
    padding: 14px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .extra-prompt-box textarea {
    min-height: 112px !important;
    padding-bottom: 42px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .prompt-optimize-button {
    right: 22px !important;
    bottom: 22px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .settings-bottom-area {
    position: static !important;
    display: grid !important;
    gap: 10px !important;
    padding: 14px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .generate-count-box,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .generate-action-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .inline-model-section,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .generate-count-section,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .generation-resolution-section {
    width: 100% !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] #generate {
    display: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] #mobile-generate {
    left: 12px !important;
    right: 12px !important;
    bottom: calc(12px + env(safe-area-inset-bottom)) !important;
    z-index: 120 !important;
    display: flex !important;
    justify-content: center !important;
    width: auto !important;
    min-height: 52px !important;
    border-radius: 16px !important;
    font-size: 15px !important;
    box-shadow: 0 14px 30px rgba(91, 75, 232, 0.22) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .works-card {
    display: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .preview-card {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .detail-page-latest-panel {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .wrinkle-latest-panel {
    display: grid !important;
    gap: 10px !important;
    height: auto !important;
    padding: 14px !important;
    border: 1px solid rgba(224, 227, 238, 0.92) !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 28px rgba(61, 67, 94, 0.06) !important;
    overflow: visible !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .wrinkle-latest-toolbar {
    min-height: 0 !important;
    gap: 8px !important;
    padding: 6px 6px 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .wrinkle-latest-toolbar > div {
    display: flex !important;
    gap: 8px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .wrinkle-latest-toolbar button {
    min-height: 32px !important;
    padding: 0 10px !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .wrinkle-latest-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    height: auto !important;
    overflow: visible !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .wrinkle-latest-card {
    min-height: 0 !important;
    border-radius: 12px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .wrinkle-latest-thumb {
    aspect-ratio: 3 / 4 !important;
    height: auto !important;
  }
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-row .try-on-garment-upload:not(.is-filled),
body[data-active-feature="try-on"] .try-on-garment-row .try-on-garment-upload:not(.is-filled) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 152px !important;
  padding: 18px !important;
  gap: 10px !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-row .try-on-garment-upload:not(.is-filled) .upload-icon,
body[data-active-feature="try-on"] .try-on-garment-row .try-on-garment-upload:not(.is-filled) .upload-icon {
  flex: 0 0 auto !important;
  align-self: center !important;
  justify-self: center !important;
  margin: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-row .try-on-garment-upload:not(.is-filled) .upload-copy,
body[data-active-feature="try-on"] .try-on-garment-row .try-on-garment-upload:not(.is-filled) .upload-copy {
  display: grid !important;
  justify-items: center !important;
  align-self: center !important;
  width: 100% !important;
  min-width: 0 !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-row .try-on-garment-upload:not(.is-filled) .upload-copy strong,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="try-on"] .try-on-garment-row .try-on-garment-upload:not(.is-filled) .upload-copy small,
body[data-active-feature="try-on"] .try-on-garment-row .try-on-garment-upload:not(.is-filled) .upload-copy strong,
body[data-active-feature="try-on"] .try-on-garment-row .try-on-garment-upload:not(.is-filled) .upload-copy small {
  width: 100% !important;
  text-align: center !important;
}

@keyframes uploadDragHalo {
  0%,
  100% {
    box-shadow:
      0 16px 34px rgba(123, 97, 255, 0.1),
      0 0 0 0 rgba(123, 97, 255, 0.12);
  }
  50% {
    box-shadow:
      0 18px 40px rgba(123, 97, 255, 0.16),
      0 0 0 6px rgba(123, 97, 255, 0.08);
  }
}

@keyframes uploadDragBorderFlow {
  from {
    background-position:
      0 0,
      12px 100%,
      0 12px,
      100% 0,
      center;
  }
  to {
    background-position:
      24px 0,
      -12px 100%,
      0 -12px,
      100% 24px,
      center;
  }
}

@keyframes uploadDragIconFloat {
  0%,
  100% {
    transform: translateY(0) scale(1);
  }
  50% {
    transform: translateY(-2px) scale(1.035);
  }
}

:is(
  .upload-card,
  .unified-upload-dropzone,
  .free-page-upload-zone,
  .need-request-dropzone,
  .unified-material-main,
  .detail-upload-slot,
  .detail-dialog-upload-slot,
  .detail-reference-button,
  .set-generate-upload-card,
  .buyer-tryon-public-upload-card,
  [data-public-buyer-upload],
  [data-free-page-upload-empty],
  .experience-upload-button,
  .material-empty-upload-button
).is-dragover {
  position: relative !important;
  isolation: isolate !important;
  border-color: rgba(91, 75, 232, 0.62) !important;
  outline: 0 !important;
  background:
    radial-gradient(circle at 50% 8%, rgba(123, 97, 255, 0.12), transparent 38%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(246, 244, 255, 0.88) 100%) !important;
  box-shadow:
    0 18px 40px rgba(123, 97, 255, 0.14),
    0 0 0 5px rgba(123, 97, 255, 0.08) !important;
  transform: translateY(-1px) scale(1.006) !important;
  animation: uploadDragHalo 1.2s ease-in-out infinite !important;
}

:is(
  .upload-card,
  .unified-upload-dropzone,
  .free-page-upload-zone,
  .need-request-dropzone,
  .unified-material-main,
  .detail-upload-slot,
  .detail-dialog-upload-slot,
  .detail-reference-button,
  .set-generate-upload-card,
  .buyer-tryon-public-upload-card,
  [data-public-buyer-upload],
  [data-free-page-upload-empty],
  .experience-upload-button,
  .material-empty-upload-button
).is-dragover::after {
  content: "" !important;
  position: absolute !important;
  inset: 7px !important;
  z-index: 3 !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(91, 75, 232, 0.58) 50%, transparent 0) 0 0 / 18px 1.5px repeat-x,
    linear-gradient(90deg, rgba(91, 75, 232, 0.4) 50%, transparent 0) 9px 100% / 18px 1.5px repeat-x,
    linear-gradient(0deg, rgba(91, 75, 232, 0.38) 50%, transparent 0) 0 9px / 1.5px 18px repeat-y,
    linear-gradient(0deg, rgba(91, 75, 232, 0.56) 50%, transparent 0) 100% 0 / 1.5px 18px repeat-y,
    radial-gradient(circle at 50% 50%, rgba(123, 97, 255, 0.08), transparent 58%);
  opacity: 0.95 !important;
  animation: uploadDragBorderFlow 1s linear infinite !important;
}

.detail-upload-slot.is-dragover::after,
.detail-dialog-upload-slot.is-dragover::after {
  inset: -5px !important;
  border-radius: 16px !important;
}

.unified-material-main.is-dragover::after,
.free-page-upload-zone.is-dragover::after {
  inset: 12px !important;
  border-radius: 18px !important;
}

:is(
  .upload-card,
  .unified-upload-dropzone,
  .free-page-upload-zone,
  .need-request-dropzone,
  .detail-upload-slot,
  .detail-dialog-upload-slot,
  .detail-reference-button,
  .set-generate-upload-card,
  .buyer-tryon-public-upload-card,
  [data-public-buyer-upload],
  [data-free-page-upload-empty],
  .experience-upload-button,
  .material-empty-upload-button
).is-dragover :is(.upload-icon, .unified-upload-icon),
:is(
  .need-request-dropzone,
  .detail-upload-slot,
  .detail-dialog-upload-slot,
  .detail-reference-button,
  .set-generate-upload-card,
  .buyer-tryon-public-upload-card,
  [data-public-buyer-upload],
  [data-free-page-upload-empty],
  .experience-upload-button,
  .material-empty-upload-button
).is-dragover > .lucide {
  color: #5b4be8 !important;
  animation: uploadDragIconFloat 900ms ease-in-out infinite !important;
}

.detail-upload-slot.is-dragover .detail-upload-slot-frame {
  border-color: rgba(91, 75, 232, 0.68) !important;
  background: #f4f1ff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-strip {
  grid-template-columns: repeat(3, 68px) !important;
  gap: 9px !important;
  align-items: end !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #product-upload {
  min-height: 148px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot {
  display: grid !important;
  grid-template-rows: auto 16px !important;
  justify-items: center !important;
  align-items: start !important;
  gap: 4px !important;
  width: 68px !important;
  min-height: 112px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot:hover {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot-frame {
  width: 64px !important;
  height: auto !important;
  aspect-ratio: 3 / 4 !important;
  border: 1px dashed rgba(195, 199, 217, 0.92) !important;
  border-radius: 13px !important;
  background: rgba(247, 248, 252, 0.96) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot.is-filled .detail-upload-slot-frame {
  border-style: solid !important;
  border-color: rgba(215, 219, 232, 0.95) !important;
  background: #fff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot small {
  width: 100% !important;
  height: 16px !important;
  font-size: 11px !important;
  line-height: 16px !important;
  font-weight: 500 !important;
  color: #697386 !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot .lucide {
  width: 21px !important;
  height: 21px !important;
  color: #394150 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot:hover .detail-upload-slot-frame {
  border-color: rgba(113, 91, 255, 0.72) !important;
  background: #f6f3ff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot.is-dragover {
  background: transparent !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot.is-dragover::after {
  inset: -5px 1px 14px !important;
  border-radius: 17px !important;
}

@media (prefers-reduced-motion: reduce) {
  :is(
    .upload-card,
    .unified-upload-dropzone,
    .free-page-upload-zone,
    .need-request-dropzone,
    .unified-material-main,
    .detail-upload-slot,
    .detail-dialog-upload-slot,
    .detail-reference-button,
    .set-generate-upload-card,
    .buyer-tryon-public-upload-card,
    [data-public-buyer-upload],
    [data-free-page-upload-empty],
    .experience-upload-button,
    .material-empty-upload-button
  ).is-dragover,
  :is(
    .upload-card,
    .unified-upload-dropzone,
    .free-page-upload-zone,
    .need-request-dropzone,
    .unified-material-main,
    .detail-upload-slot,
    .detail-dialog-upload-slot,
    .detail-reference-button,
    .set-generate-upload-card,
    .buyer-tryon-public-upload-card,
    [data-public-buyer-upload],
    [data-free-page-upload-empty],
    .experience-upload-button,
    .material-empty-upload-button
  ).is-dragover::after,
  :is(
    .upload-card,
    .unified-upload-dropzone,
    .free-page-upload-zone,
    .need-request-dropzone,
    .detail-upload-slot,
    .detail-dialog-upload-slot,
    .detail-reference-button,
    .set-generate-upload-card,
    .buyer-tryon-public-upload-card,
    [data-public-buyer-upload],
    [data-free-page-upload-empty],
    .experience-upload-button,
    .material-empty-upload-button
  ).is-dragover :is(.upload-icon, .unified-upload-icon),
  :is(
    .need-request-dropzone,
    .detail-upload-slot,
    .detail-dialog-upload-slot,
    .detail-reference-button,
    .set-generate-upload-card,
    .buyer-tryon-public-upload-card,
    [data-public-buyer-upload],
    [data-free-page-upload-empty],
    .experience-upload-button,
    .material-empty-upload-button
  ).is-dragover > .lucide {
    animation: none !important;
    transform: none !important;
  }
}


body.feature-focus-mode.workstation-feature-mode .extra-prompt-box.has-video-highlight textarea {
  color: transparent !important;
  caret-color: #20263a !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease !important;
}

body.feature-focus-mode.workstation-feature-mode .extra-prompt-box:not(.has-video-highlight) textarea {
  -webkit-text-fill-color: currentColor !important;
}

@media (min-width: 981px) {
  .side-nav .nav-group:first-child {
    padding: 8px !important;
    border: 1px solid rgba(222, 216, 246, 0.9) !important;
    border-radius: 16px !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(252, 249, 255, 0.9) 100%) !important;
    box-shadow: 0 18px 46px rgba(105, 91, 164, 0.08) !important;
  }

  .side-nav [data-home-link] {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 0 12px !important;
    color: #252238 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 15px !important;
    font-weight: 500 !important;
  }

  .side-nav [data-home-link].active,
  .side-nav [data-home-link]:hover {
    color: #252238 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .side-nav [data-home-link] .lucide {
    flex: 0 0 28px !important;
    width: 28px !important;
    height: 28px !important;
    color: #6d55e8 !important;
    background:
      linear-gradient(135deg, rgba(250, 247, 255, 0.98), rgba(235, 231, 255, 0.94)) !important;
    box-shadow: inset 0 0 0 1px rgba(154, 132, 255, 0.18), 0 8px 18px rgba(105, 91, 164, 0.08) !important;
  }

  .side-nav .nav-group:not(:first-child) {
    gap: 7px !important;
    padding: 9px 7px 10px !important;
  }

  .side-nav .nav-primary[data-nav-target] {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 0 10px !important;
    color: #252238 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 15px !important;
    font-weight: 760 !important;
  }

  .side-nav .nav-primary[data-nav-target]::after {
    content: "";
    flex: 1 1 auto;
    height: 1px;
    margin-left: 12px;
    background: linear-gradient(90deg, rgba(138, 112, 255, 0.26), transparent);
  }

  .side-nav .nav-primary[data-nav-target] .lucide {
    flex: 0 0 28px !important;
    width: 28px !important;
    height: 28px !important;
    color: #6c55e8 !important;
    background:
      linear-gradient(135deg, rgba(250, 247, 255, 0.98), rgba(235, 231, 255, 0.94)) !important;
    box-shadow: inset 0 0 0 1px rgba(154, 132, 255, 0.18), 0 8px 18px rgba(105, 91, 164, 0.08) !important;
  }

  .side-nav .nav-primary[data-nav-target].active,
  .side-nav .nav-primary[data-nav-target]:hover {
    color: #252238 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .side-nav .nav-primary[data-nav-target].active .lucide,
  .side-nav .nav-primary[data-nav-target]:hover .lucide {
    color: #6c55e8 !important;
    background:
      linear-gradient(135deg, rgba(250, 247, 255, 0.98), rgba(235, 231, 255, 0.94)) !important;
    box-shadow: inset 0 0 0 1px rgba(154, 132, 255, 0.18), 0 8px 18px rgba(105, 91, 164, 0.08) !important;
  }

  .nav-sublist {
    gap: 3px !important;
    padding: 0 2px 1px !important;
  }

  .nav-sublist a {
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    padding: 0 10px 0 11px !important;
    color: #706b7d !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
  }

  .nav-sublist a.active,
  .nav-sublist a:hover {
    color: #706b7d !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .nav-sublist .lucide {
    flex: 0 0 22px !important;
    width: 22px !important;
    height: 22px !important;
    color: #6c55e8 !important;
    background:
      linear-gradient(135deg, rgba(250, 247, 255, 0.98), rgba(235, 231, 255, 0.94)) !important;
    box-shadow: inset 0 0 0 1px rgba(154, 132, 255, 0.16), 0 6px 14px rgba(105, 91, 164, 0.06) !important;
    opacity: 0.86;
  }

  .nav-sublist a.active .lucide,
  .nav-sublist a:hover .lucide {
    color: #6c55e8 !important;
    background:
      linear-gradient(135deg, rgba(250, 247, 255, 0.98), rgba(235, 231, 255, 0.94)) !important;
    box-shadow: inset 0 0 0 1px rgba(154, 132, 255, 0.16), 0 6px 14px rgba(105, 91, 164, 0.06) !important;
  }

  .nav-sublist a.active::before,
  .nav-sublist a:hover::before {
    background: rgba(156, 132, 255, 0.36) !important;
    transform: none !important;
  }

  .side-nav a.active,
  .side-nav a:hover {
    background: transparent !important;
    box-shadow: none !important;
  }

  .side-nav a.active .lucide,
  .side-nav a:hover .lucide {
    color: #6c55e8 !important;
    background:
      linear-gradient(135deg, rgba(250, 247, 255, 0.98), rgba(235, 231, 255, 0.94)) !important;
    box-shadow: inset 0 0 0 1px rgba(154, 132, 255, 0.16), 0 6px 14px rgba(105, 91, 164, 0.06) !important;
  }

  .side-nav,
  .side-nav .nav-group,
  .side-nav a,
  .side-nav .lucide,
  .side-nav a::before,
  .side-nav .nav-primary[data-nav-target]::after {
    transition: none !important;
  }

  body.feature-focus-mode .side-nav {
    display: grid !important;
    gap: 14px !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
}

@media (min-width: 761px) and (max-width: 980px) {
  .app-layout,
  body.feature-focus-mode .app-layout,
  body.section-focus-mode .app-layout,
  body.workstation-feature-mode .app-layout {
    display: grid !important;
    grid-template-columns: 340px minmax(0, 1fr) !important;
    min-height: 100vh !important;
    overflow: hidden !important;
  }

  .sidebar,
  body.feature-focus-mode .sidebar,
  body.section-focus-mode .sidebar,
  body.workstation-feature-mode .sidebar {
    position: sticky !important;
    top: 0 !important;
    display: grid !important;
    grid-template-rows: auto 1fr auto !important;
    gap: 14px !important;
    width: 340px !important;
    min-width: 340px !important;
    max-width: 340px !important;
    height: 100vh !important;
    min-height: 100vh !important;
    padding: 18px 14px 16px !important;
    overflow: hidden !important;
    border-right: 1px solid rgba(255, 255, 255, 0.52) !important;
    border-bottom: 0 !important;
  }

  .side-nav,
  body.feature-focus-mode .side-nav,
  body.section-focus-mode .side-nav,
  body.workstation-feature-mode .side-nav {
    display: grid !important;
    grid-template-columns: none !important;
    gap: 14px !important;
    width: 100% !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  .side-nav .nav-group,
  body.feature-focus-mode .side-nav .nav-group,
  body.section-focus-mode .side-nav .nav-group,
  body.workstation-feature-mode .side-nav .nav-group {
    display: grid !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    border: 1px solid rgba(222, 216, 246, 0.9) !important;
    border-radius: 16px !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(252, 249, 255, 0.9) 100%) !important;
    box-shadow: 0 18px 46px rgba(105, 91, 164, 0.08) !important;
  }

  .side-nav .nav-group:first-child {
    padding: 8px !important;
  }

  .side-nav .nav-group:not(:first-child) {
    padding: 9px 7px 10px !important;
  }

  .side-nav .nav-sublist,
  body.feature-focus-mode .side-nav .nav-sublist,
  body.section-focus-mode .side-nav .nav-sublist,
  body.workstation-feature-mode .side-nav .nav-sublist {
    display: grid !important;
    gap: 3px !important;
    width: 100% !important;
    padding: 0 2px 1px !important;
  }

  .side-nav [data-home-link],
  .side-nav .nav-primary[data-nav-target],
  .side-nav .nav-sublist a,
  body.feature-focus-mode .side-nav [data-home-link],
  body.feature-focus-mode .side-nav .nav-primary[data-nav-target],
  body.feature-focus-mode .side-nav .nav-sublist a,
  body.section-focus-mode .side-nav [data-home-link],
  body.section-focus-mode .side-nav .nav-primary[data-nav-target],
  body.section-focus-mode .side-nav .nav-sublist a,
  body.workstation-feature-mode .side-nav [data-home-link],
  body.workstation-feature-mode .side-nav .nav-primary[data-nav-target],
  body.workstation-feature-mode .side-nav .nav-sublist a {
    display: flex !important;
    flex: none !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    border: 0 !important;
    border-radius: 10px !important;
    color: #706b7d !important;
    background: transparent !important;
    box-shadow: none !important;
    white-space: nowrap !important;
  }

  .side-nav [data-home-link],
  body.feature-focus-mode .side-nav [data-home-link],
  body.section-focus-mode .side-nav [data-home-link],
  body.workstation-feature-mode .side-nav [data-home-link],
  .side-nav .nav-primary[data-nav-target],
  body.feature-focus-mode .side-nav .nav-primary[data-nav-target],
  body.section-focus-mode .side-nav .nav-primary[data-nav-target],
  body.workstation-feature-mode .side-nav .nav-primary[data-nav-target] {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 0 10px !important;
    color: #252238 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 15px !important;
  }

  .side-nav .nav-sublist a,
  body.feature-focus-mode .side-nav .nav-sublist a,
  body.section-focus-mode .side-nav .nav-sublist a,
  body.workstation-feature-mode .side-nav .nav-sublist a {
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    padding: 0 10px 0 11px !important;
    color: #706b7d !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 13.5px !important;
  }

  .side-nav a[hidden],
  body.feature-focus-mode .side-nav a[hidden],
  body.section-focus-mode .side-nav a[hidden],
  body.workstation-feature-mode .side-nav a[hidden] {
    display: none !important;
  }

  .side-nav .lucide,
  .side-nav .nav-primary[data-nav-target] .lucide,
  .nav-sublist .lucide,
  body.feature-focus-mode .side-nav .lucide,
  body.section-focus-mode .side-nav .lucide,
  body.workstation-feature-mode .side-nav .lucide {
    color: #6c55e8 !important;
    background:
      linear-gradient(135deg, rgba(250, 247, 255, 0.98), rgba(235, 231, 255, 0.94)) !important;
    box-shadow: inset 0 0 0 1px rgba(154, 132, 255, 0.16), 0 6px 14px rgba(105, 91, 164, 0.06) !important;
  }
}

@media (max-width: 760px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .sidebar {
    position: relative !important;
    padding: 14px 12px 12px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .brand {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    margin: 0 0 10px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .brand-tagline {
    display: block !important;
    width: auto !important;
    max-width: 168px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav {
    gap: 8px !important;
    padding: 0 2px 8px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav a,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav .nav-primary {
    min-height: 40px !important;
    height: 40px !important;
    max-height: 40px !important;
    padding: 0 12px !important;
    font-size: 14px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav .nav-primary {
    font-size: 15px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav .lucide,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .side-nav .nav-primary[data-nav-target] .lucide {
    width: 20px !important;
    height: 20px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature] .works-card {
    display: grid !important;
    position: static !important;
    width: min(100%, 188px) !important;
    min-height: 58px !important;
    margin: 4px 0 0 !important;
    padding: 9px 10px !important;
  }
}

@media (min-width: 981px) {
  body.feature-focus-mode .side-nav,
  body.section-focus-mode .side-nav,
  body.workstation-feature-mode .side-nav,
  body:not(.feature-focus-mode):not(.section-focus-mode) .side-nav {
    gap: 10px !important;
    padding: 2px 3px 8px 0 !important;
  }

  body.feature-focus-mode .side-nav .nav-group:first-child,
  body.section-focus-mode .side-nav .nav-group:first-child,
  body.workstation-feature-mode .side-nav .nav-group:first-child,
  body:not(.feature-focus-mode):not(.section-focus-mode) .side-nav .nav-group:first-child {
    width: 100% !important;
  }

  body.feature-focus-mode .side-nav .nav-group:not(:first-child),
  body.section-focus-mode .side-nav .nav-group:not(:first-child),
  body.workstation-feature-mode .side-nav .nav-group:not(:first-child),
  body:not(.feature-focus-mode):not(.section-focus-mode) .side-nav .nav-group:not(:first-child) {
    width: 100% !important;
  }
}

.side-nav a,
.side-nav .lucide,
.side-nav a::before {
  transition:
    color 0.18s ease,
    background-color 0.18s ease,
    box-shadow 0.18s ease,
    opacity 0.18s ease !important;
}

.side-nav .nav-primary[data-nav-target].active,
.side-nav .nav-primary[data-nav-target]:hover {
  color: #4d3ed2 !important;
}

.side-nav .nav-primary[data-nav-target].active .lucide,
.side-nav .nav-primary[data-nav-target]:hover .lucide {
  color: #5b45e8 !important;
  box-shadow:
    inset 0 0 0 1px rgba(123, 97, 255, 0.22),
    0 8px 18px rgba(105, 91, 164, 0.12) !important;
}

.nav-sublist a.active,
.nav-sublist a:hover {
  color: #5a45d8 !important;
}

.nav-sublist a.active::before,
.nav-sublist a:hover::before {
  background: rgba(91, 75, 232, 0.78) !important;
}

.nav-sublist a.active .lucide,
.nav-sublist a:hover .lucide {
  color: #5b45e8 !important;
  box-shadow:
    inset 0 0 0 1px rgba(123, 97, 255, 0.22),
    0 6px 14px rgba(105, 91, 164, 0.12) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .task-recent-panel,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .detail-page-latest-panel {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
}

body.feature-showcase-mode.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] #preview-frame,
body.feature-showcase-mode.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] #preview-empty {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-showcase-mode.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] .set-preview-board {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

/* Poster design: compact settings surface aligned with mature basic tools. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .settings-card {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .settings-head {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] #dynamic-settings,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel {
  display: grid !important;
  gap: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-section {
  display: grid !important;
  gap: 8px !important;
  padding: 10px !important;
  border: 1px solid rgba(224, 226, 238, 0.92) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.82) !important;
  background-image: none !important;
  box-shadow: 0 8px 18px rgba(38, 45, 74, 0.045) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-section-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-section-head strong {
  color: #2d3448 !important;
  font-size: 14px !important;
  font-weight: 620 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-section-head small {
  color: #8a91a3 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-type-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-style-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-ratio-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 7px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-type-grid .choice-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-style-grid .choice-button {
  display: grid !important;
  align-content: center !important;
  justify-items: start !important;
  gap: 3px !important;
  min-height: 52px !important;
  padding: 9px 12px !important;
  border: 1px solid #e4e7f0 !important;
  border-radius: 12px !important;
  color: #30384d !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-ratio-grid .choice-button {
  display: grid !important;
  align-content: center !important;
  justify-items: center !important;
  gap: 3px !important;
  min-height: 46px !important;
  padding: 7px 5px !important;
  border: 1px solid #e4e7f0 !important;
  border-radius: 12px !important;
  color: #30384d !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel .choice-button strong {
  display: block !important;
  color: inherit !important;
  font-size: 12.5px !important;
  font-weight: 620 !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel .choice-button small {
  display: block !important;
  width: 100% !important;
  overflow: hidden !important;
  color: #7b8292 !important;
  font-size: 10.5px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel .choice-button:hover {
  border-color: rgba(123, 97, 255, 0.38) !important;
  color: #4f46e5 !important;
  background: #fbfbff !important;
  box-shadow: 0 8px 18px rgba(79, 70, 229, 0.055) !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel .choice-button.selected {
  border-color: rgba(79, 70, 229, 0.62) !important;
  color: #4f46e5 !important;
  background: #f5f3ff !important;
  background-image: none !important;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel .choice-button.selected small {
  color: #6d64c9 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-panel {
  padding-bottom: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-upload-row,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-upload-row .secondary-reference-upload-card-wrap {
  width: 100% !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) minmax(70px, 96px) !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 64px !important;
  padding: 9px 11px !important;
  border: 1px dashed rgba(195, 199, 218, 0.95) !important;
  border-radius: 13px !important;
  color: #30384d !important;
  background: #fbfcff !important;
  background-image: none !important;
  box-shadow: none !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button .upload-icon {
  grid-column: 1 !important;
  display: grid !important;
  place-items: center !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  border-radius: 11px !important;
  color: #4f46e5 !important;
  background: #eef2ff !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button .upload-copy {
  grid-column: 2 !important;
  display: grid !important;
  justify-items: start !important;
  gap: 3px !important;
  min-width: 0 !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button .upload-copy strong {
  color: #30384d !important;
  font-size: 13.5px !important;
  font-weight: 620 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button .upload-copy small {
  color: #7b8292 !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button:not(.is-filled) {
  grid-template-columns: 42px minmax(0, 1fr) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button .secondary-reference-preview-strip {
  grid-column: 3 !important;
  width: 84px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button:focus-visible {
  border-color: rgba(79, 70, 229, 0.42) !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(79, 70, 229, 0.055) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .extra-prompt-box {
  gap: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .extra-prompt-box span {
  color: #2d3448 !important;
  font-size: 14px !important;
  font-weight: 620 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .extra-prompt-box textarea {
  height: 132px !important;
  min-height: 132px !important;
  max-height: 160px !important;
  padding: 13px 15px 48px !important;
  border: 1px solid #dfe3ee !important;
  border-radius: 13px !important;
  color: #20263a !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: 0 8px 18px rgba(38, 45, 74, 0.045) !important;
  font-size: 13.5px !important;
  line-height: 1.55 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .prompt-optimize-button {
  right: 10px !important;
  bottom: 10px !important;
}

@media (max-width: 520px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-type-grid,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-style-grid {
    grid-template-columns: 1fr !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-ratio-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button {
    grid-template-columns: 38px minmax(0, 1fr) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button .secondary-reference-preview-strip {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }
}

/* Live sticker: reuse the compact basic-tool settings pattern. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .settings-card {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .settings-head {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] #dynamic-settings,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-panel {
  display: grid !important;
  gap: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-section {
  display: grid !important;
  gap: 9px !important;
  padding: 12px !important;
  border: 1px solid rgba(224, 226, 238, 0.92) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.82) !important;
  background-image: none !important;
  box-shadow: 0 8px 18px rgba(38, 45, 74, 0.045) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-section-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-section-head strong {
  color: #2d3448 !important;
  font-size: 14px !important;
  font-weight: 620 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-section-head small {
  color: #8a91a3 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-ratio-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-ratio-grid .choice-button {
  display: grid !important;
  align-content: center !important;
  justify-items: start !important;
  gap: 4px !important;
  min-height: 58px !important;
  padding: 10px 12px !important;
  border: 1px solid #e4e7f0 !important;
  border-radius: 12px !important;
  color: #30384d !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-panel .choice-button strong {
  display: block !important;
  color: inherit !important;
  font-size: 13.5px !important;
  font-weight: 620 !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-panel .choice-button small {
  display: block !important;
  width: 100% !important;
  overflow: hidden !important;
  color: #7b8292 !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-panel .choice-button:hover {
  border-color: rgba(123, 97, 255, 0.38) !important;
  color: #4f46e5 !important;
  background: #fbfbff !important;
  box-shadow: 0 8px 18px rgba(79, 70, 229, 0.055) !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-panel .choice-button.selected {
  border-color: rgba(79, 70, 229, 0.62) !important;
  color: #4f46e5 !important;
  background: #f5f3ff !important;
  background-image: none !important;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-panel .choice-button.selected small {
  color: #6d64c9 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-reference-upload-row,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-reference-upload-row .secondary-reference-upload-card-wrap {
  width: 100% !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-reference-button {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) minmax(70px, 96px) !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 76px !important;
  padding: 10px 12px !important;
  border: 1px dashed rgba(195, 199, 218, 0.95) !important;
  border-radius: 13px !important;
  color: #30384d !important;
  background: #fbfcff !important;
  background-image: none !important;
  box-shadow: none !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-reference-button .upload-icon {
  grid-column: 1 !important;
  display: grid !important;
  place-items: center !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  border-radius: 11px !important;
  color: #4f46e5 !important;
  background: #eef2ff !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-reference-button .upload-copy {
  grid-column: 2 !important;
  display: grid !important;
  justify-items: start !important;
  gap: 3px !important;
  min-width: 0 !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-reference-button .upload-copy strong {
  color: #30384d !important;
  font-size: 13.5px !important;
  font-weight: 620 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-reference-button .upload-copy small {
  color: #7b8292 !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-reference-button:not(.is-filled) {
  grid-template-columns: 42px minmax(0, 1fr) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-reference-button .secondary-reference-preview-strip {
  grid-column: 3 !important;
  width: 84px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-reference-button:hover,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-reference-button:focus-visible {
  border-color: rgba(79, 70, 229, 0.42) !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(79, 70, 229, 0.055) !important;
}

@media (max-width: 520px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-ratio-grid {
    grid-template-columns: 1fr !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-reference-button {
    grid-template-columns: 38px minmax(0, 1fr) !important;
  }

body.feature-focus-mode.workstation-feature-mode[data-active-feature="live-sticker"] .live-sticker-reference-button .secondary-reference-preview-strip {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }
}

/* Outfit recommend: cloned from the compact poster-design settings surface. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .settings-card {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .settings-head {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] #dynamic-settings,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel {
  display: grid !important;
  gap: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-section {
  display: grid !important;
  gap: 8px !important;
  padding: 10px !important;
  border: 1px solid rgba(224, 226, 238, 0.92) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.82) !important;
  background-image: none !important;
  box-shadow: 0 8px 18px rgba(38, 45, 74, 0.045) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-section-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-section-head strong {
  color: #2d3448 !important;
  font-size: 14px !important;
  font-weight: 620 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-section-head small {
  color: #8a91a3 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-element-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-style-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 7px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button {
  display: grid !important;
  align-content: center !important;
  justify-items: center !important;
  gap: 0 !important;
  min-height: 42px !important;
  padding: 8px 10px !important;
  border: 1px solid #e4e7f0 !important;
  border-radius: 12px !important;
  color: #30384d !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button strong {
  display: block !important;
  color: inherit !important;
  font-size: 13.5px !important;
  font-weight: 560 !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button small {
  display: block !important;
  width: 100% !important;
  overflow: hidden !important;
  color: #7b8292 !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button:hover {
  border-color: rgba(123, 97, 255, 0.38) !important;
  color: #4f46e5 !important;
  background: #fbfbff !important;
  box-shadow: 0 8px 18px rgba(79, 70, 229, 0.055) !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button.selected {
  border-color: rgba(79, 70, 229, 0.62) !important;
  color: #4f46e5 !important;
  background: #f5f3ff !important;
  background-image: none !important;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button.selected small {
  color: #6d64c9 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button:disabled,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button[aria-disabled="true"],
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-panel .choice-button.is-disabled {
  cursor: not-allowed !important;
  opacity: 0.42 !important;
  border-color: #e1e5ee !important;
  color: #9aa3b5 !important;
  background: #f4f6fa !important;
  box-shadow: none !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .detail-page-latest-panel {
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .task-recent-panel {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .preview-card,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .detail-page-latest-panel {
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-latest-panel {
  grid-template-rows: auto minmax(0, 1fr) !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-latest-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: minmax(118px, 1fr) !important;
  grid-template-rows: none !important;
  min-height: 0 !important;
  overflow: auto !important;
  overscroll-behavior: contain !important;
}

@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="wrinkle"],
    [data-active-feature="background"],
    [data-active-feature="colors"],
    [data-active-feature="try-on"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="prompt-edit"],
    [data-active-feature="hd-upscale"],
    [data-active-feature="watermark-remove"],
    [data-active-feature="background-remove"],
    [data-active-feature="poster-design"],
    [data-active-feature="live-sticker"],
    [data-active-feature="pose-change"],
    [data-active-feature="print-extract"],
    [data-active-feature="buyer-show"],
    [data-active-feature="set-generate"],
    [data-active-feature="outfit-recommend"]
  ) .preview-column {
    justify-self: end !important;
    width: min(430px, 100%) !important;
    max-width: 430px !important;
  }
}

@media (max-width: 520px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-element-grid,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-style-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .workspace,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .task-panel {
  min-width: 1280px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .task-panel {
  grid-template-columns: minmax(286px, 320px) minmax(300px, 360px) minmax(560px, 1fr) !important;
  gap: 0 22px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-column {
  display: contents !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-scroll-area {
  grid-column: 2 / 3 !important;
  grid-row: 1 / 5 !important;
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-scroll-area > .settings-card {
  align-self: stretch !important;
  height: 100% !important;
  max-height: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .preview-column {
  grid-column: 3 / 4 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-panel {
  align-content: stretch !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .task-recent-panel {
  grid-column: 3 / 4 !important;
  grid-row: 4 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .workspace,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .task-panel {
  min-width: 1044px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .task-panel {
  grid-template-columns: minmax(400px, 500px) minmax(560px, 1fr) !important;
  gap: 0 28px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-column {
  display: block !important;
  grid-column: 1 / 2 !important;
  grid-row: 3 / 5 !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 22px 22px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-scroll-area {
  grid-column: auto !important;
  grid-row: auto !important;
  display: grid !important;
  grid-template-rows: none !important;
  gap: 10px !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-scroll-area > .settings-card {
  align-self: auto !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  display: grid !important;
  grid-template-rows: auto auto !important;
  padding: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] #dynamic-settings,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-panel {
  height: auto !important;
  min-height: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .preview-column {
  grid-column: 2 / 3 !important;
  grid-row: 1 / 4 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .task-recent-panel {
  grid-column: 2 / 3 !important;
  grid-row: 4 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-bottom-area {
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: auto !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin-top: 8px !important;
  padding: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-bottom-area .generate-count-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-bottom-area .generate-action-row {
  display: contents !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-panel {
  align-content: start !important;
  grid-template-rows: auto auto auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-list {
  max-height: min(46vh, 520px) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 32px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-field {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 7px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-field span {
  font-size: 11px !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-field input {
  border-color: rgba(224, 220, 240, 0.72) !important;
  background: rgba(255, 255, 255, 0.62) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-field:not(.text-edit-field-source) input {
  border-color: rgba(225, 222, 238, 0.52) !important;
  background: rgba(255, 255, 255, 0.48) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-field input:focus {
  border-color: rgba(156, 130, 255, 0.58) !important;
  background: #fff !important;
  box-shadow: 0 0 0 2px rgba(123, 97, 255, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .workspace,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .task-panel {
  min-width: 1460px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .task-panel {
  grid-template-columns: minmax(760px, 860px) minmax(560px, 1fr) !important;
  gap: 0 30px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-column {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  align-content: stretch !important;
  gap: 12px !important;
  height: 100% !important;
  min-height: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-scroll-area {
  min-height: 0 !important;
  overflow: auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-bottom-area {
  align-self: end !important;
  margin-top: 0 !important;
  width: 100% !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .upload-column {
  display: grid !important;
  gap: 12px !important;
  align-content: start !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .upload-primary-row {
  min-height: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-column {
  grid-template-rows: minmax(0, 1fr) auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-scroll-area {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) !important;
  align-self: stretch !important;
  height: 100% !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .settings-scroll-area > .settings-card {
  height: 100% !important;
  min-height: 100% !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] #settings-card > .settings-head {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] #dynamic-settings,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-panel {
  min-height: 0 !important;
  height: 100% !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-panel {
  grid-template-rows: auto minmax(0, 1fr) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="text-edit"] .text-edit-list {
  max-height: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="outfit-recommend"], [data-active-feature="poster-design"]) :is(.outfit-recommend-section, .poster-design-section) {
  border: 1px solid rgba(220, 213, 244, 0.78) !important;
  border-radius: 18px !important;
  padding: 14px 12px 12px !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(126, 93, 255, 0.06), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(253, 252, 255, 0.88)) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="outfit-recommend"], [data-active-feature="poster-design"]) :is(.outfit-recommend-section-head, .poster-design-section-head) {
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  margin-bottom: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="outfit-recommend"], [data-active-feature="poster-design"]) :is(.outfit-recommend-section-head, .poster-design-section-head) strong {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 24px !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  background: rgba(109, 85, 238, 0.1) !important;
  color: #6554f3 !important;
  font-size: 13px !important;
  font-weight: 520 !important;
  line-height: 1 !important;
}

/* Fashion outfit recommendation: section titles should read as plain labels,
 * without the decorative pill background used by poster-design headings. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .outfit-recommend-section-head strong {
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="outfit-recommend"], [data-active-feature="poster-design"]) :is(.outfit-recommend-section-head, .poster-design-section-head) small {
  margin-left: auto !important;
  color: #8d91a4 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="outfit-recommend"], [data-active-feature="poster-design"]) :is(.outfit-recommend-element-grid, .poster-design-option-grid, .poster-design-ratio-grid) {
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  gap: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="outfit-recommend"], [data-active-feature="poster-design"]) :is(.outfit-recommend-panel, .poster-design-panel) .choice-button {
  min-height: 50px !important;
  border: 1px solid rgba(220, 213, 244, 0.95) !important;
  border-radius: 14px !important;
  padding: 8px 12px !important;
  background: rgba(255, 255, 255, 0.82) !important;
  color: #30364a !important;
  box-shadow: none !important;
  font-weight: 450 !important;
  transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="outfit-recommend"], [data-active-feature="poster-design"]) :is(.outfit-recommend-panel, .poster-design-panel) .choice-button:hover {
  border-color: rgba(109, 85, 238, 0.42) !important;
  background: rgba(255, 255, 255, 0.96) !important;
  color: #6251f4 !important;
  transform: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="outfit-recommend"], [data-active-feature="poster-design"]) :is(.outfit-recommend-panel, .poster-design-panel) .choice-button.selected,
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="outfit-recommend"], [data-active-feature="poster-design"]) :is(.outfit-recommend-panel, .poster-design-panel) .choice-button.is-selected {
  border-color: rgba(109, 85, 238, 0.58) !important;
  background: #ffffff !important;
  color: var(--purple) !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="outfit-recommend"], [data-active-feature="poster-design"]) :is(.outfit-recommend-panel, .poster-design-panel) .choice-button strong {
  color: inherit !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="outfit-recommend"], [data-active-feature="poster-design"]) :is(.outfit-recommend-panel, .poster-design-panel) .choice-button small {
  color: #8f94a8 !important;
  font-size: 11.5px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="outfit-recommend"], [data-active-feature="poster-design"]) :is(.outfit-recommend-panel, .poster-design-panel) .choice-button.selected small,
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="outfit-recommend"], [data-active-feature="poster-design"]) :is(.outfit-recommend-panel, .poster-design-panel) .choice-button.is-selected small {
  color: var(--purple) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-ratio-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-ratio-grid .choice-button {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  justify-items: stretch !important;
  gap: 10px !important;
  min-height: 50px !important;
  padding: 8px 12px 8px 14px !important;
  text-align: left !important;
  border-color: rgba(202, 193, 255, 0.62) !important;
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-ratio-grid .choice-button:hover {
  border-color: rgba(151, 133, 255, 0.46) !important;
  background: rgba(255, 255, 255, 0.9) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-ratio-grid .choice-button.selected {
  border-color: rgba(109, 85, 238, 0.42) !important;
  background: rgba(248, 247, 255, 0.82) !important;
  box-shadow: inset 0 0 0 1px rgba(109, 85, 238, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-ratio-label {
  min-width: 0 !important;
  color: inherit !important;
  font-size: 14px !important;
  font-weight: 560 !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-ratio-icon {
  justify-self: end !important;
  width: 34px !important;
  height: 26px !important;
  color: #a8aec4 !important;
  opacity: 0.82 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-ratio-icon::before {
  border-width: 1.5px !important;
  border-radius: 4px !important;
  background:
    linear-gradient(90deg, rgba(154, 160, 181, 0.16) 1px, transparent 1px),
    linear-gradient(180deg, rgba(154, 160, 181, 0.16) 1px, transparent 1px),
    rgba(255, 255, 255, 0.52) !important;
  background-size: 8px 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-ratio-icon.ratio-icon-auto::before {
  width: 22px !important;
  height: 1.5px !important;
  border: 0 !important;
  background: currentColor !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-ratio-icon.ratio-icon-auto::after {
  width: 1.5px !important;
  height: 22px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-ratio-grid .choice-button.selected .poster-ratio-icon {
  color: var(--purple) !important;
  opacity: 0.9 !important;
}

/* Poster design final polish: keep the whole settings area calm and consistent. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] #dynamic-settings,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel {
  gap: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-section,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .extra-prompt-box {
  gap: 10px !important;
  padding: 12px !important;
  border: 1px solid rgba(224, 228, 240, 0.95) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.84) !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-section-head,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .extra-prompt-box > span {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  min-height: 18px !important;
  margin: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-section-head strong,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .extra-prompt-box > span {
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #293044 !important;
  font-size: 13.5px !important;
  font-weight: 620 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-section-head small {
  margin-left: auto !important;
  color: #8f96a8 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-type-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-ratio-grid,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-style-grid {
  gap: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-type-grid .choice-button,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-style-grid .choice-button {
  min-height: 54px !important;
  padding: 9px 12px !important;
  border: 1px solid rgba(224, 228, 240, 0.95) !important;
  border-radius: 11px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: #30364a !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-type-grid .choice-button {
  grid-template-columns: 36px minmax(0, 1fr) !important;
  align-items: center !important;
  align-content: center !important;
  justify-items: stretch !important;
  column-gap: 10px !important;
  min-height: 64px !important;
  padding: 10px 12px !important;
  font-family: "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", system-ui, sans-serif !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-type-icon {
  display: grid !important;
  place-items: center !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 11px !important;
  color: #6f5ee8 !important;
  background: #f1efff !important;
  transition: color 160ms ease, background-color 160ms ease, box-shadow 160ms ease !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-type-icon svg {
  width: 18px !important;
  height: 18px !important;
  stroke-width: 2 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-type-copy {
  display: grid !important;
  min-width: 0 !important;
  gap: 3px !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel .poster-design-type-grid .choice-button strong {
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  letter-spacing: 0.01em !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel .poster-design-type-grid .choice-button small {
  font-size: 11.5px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-type-grid .choice-button:hover .poster-design-type-icon {
  color: #5846db !important;
  background: #ebe8ff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-type-grid .choice-button.selected .poster-design-type-icon,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-type-grid .choice-button.is-selected .poster-design-type-icon {
  color: #ffffff !important;
  background: linear-gradient(145deg, #7565f4, #5d4be4) !important;
  box-shadow: 0 5px 12px rgba(93, 75, 228, 0.2) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-ratio-grid .choice-button {
  min-height: 48px !important;
  padding: 8px 11px !important;
  border: 1px solid rgba(224, 228, 240, 0.95) !important;
  border-radius: 11px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: #30364a !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel .choice-button:hover {
  border-color: rgba(137, 119, 245, 0.42) !important;
  background: #ffffff !important;
  color: #4f46e5 !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel .choice-button.selected,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel .choice-button.is-selected {
  border-color: rgba(111, 91, 232, 0.5) !important;
  background: rgba(247, 246, 255, 0.92) !important;
  color: #4f46e5 !important;
  box-shadow: inset 0 0 0 1px rgba(111, 91, 232, 0.06) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel .choice-button strong {
  font-size: 13px !important;
  font-weight: 580 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-panel .choice-button small {
  color: #8991a3 !important;
  font-size: 11.5px !important;
  font-weight: 400 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-panel {
  padding-bottom: 12px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button {
  min-height: 58px !important;
  padding: 9px 11px !important;
  border-color: rgba(207, 213, 229, 0.95) !important;
  border-radius: 11px !important;
  background: rgba(250, 251, 255, 0.9) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .poster-design-reference-button .upload-icon {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  border-radius: 10px !important;
  background: rgba(239, 241, 255, 0.85) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="poster-design"] .extra-prompt-box textarea {
  height: 126px !important;
  min-height: 126px !important;
  border-color: rgba(224, 228, 240, 0.95) !important;
  border-radius: 11px !important;
  box-shadow: none !important;
}

/* Keep poster design and outfit recommendation aligned with the light prompt-box treatment. */
body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="poster-design"], [data-active-feature="outfit-recommend"]) .extra-prompt-box {
  gap: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="poster-design"], [data-active-feature="outfit-recommend"]) .extra-prompt-box::before {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="poster-design"], [data-active-feature="outfit-recommend"]) .extra-prompt-box > span {
  min-height: auto !important;
  color: #30384d !important;
  font-size: 14px !important;
  font-weight: 560 !important;
  line-height: 1.25 !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="poster-design"], [data-active-feature="outfit-recommend"]) .extra-prompt-box textarea {
  height: 280px !important;
  min-height: 280px !important;
  max-height: 280px !important;
  padding: 16px 17px 58px !important;
  border: 1px solid rgba(214, 210, 236, 0.96) !important;
  border-radius: 14px !important;
  color: #20263a !important;
  background: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 10px 22px rgba(105, 91, 164, 0.055) !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="poster-design"], [data-active-feature="outfit-recommend"]) .extra-prompt-box textarea:focus {
  border-color: rgba(109, 85, 238, 0.55) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08), 0 12px 24px rgba(105, 91, 164, 0.08) !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="poster-design"], [data-active-feature="outfit-recommend"]) .prompt-optimize-button {
  position: absolute !important;
  right: 10px !important;
  bottom: 10px !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  min-height: 30px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(109, 85, 238, 0.24) !important;
  border-radius: 999px !important;
  color: #5b4be8 !important;
  background: rgba(255, 255, 255, 0.94) !important;
  box-shadow: 0 10px 20px rgba(91, 73, 230, 0.12) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="poster-design"], [data-active-feature="outfit-recommend"]) .prompt-optimize-button .lucide {
  width: 13px !important;
  height: 13px !important;
  stroke-width: 2.2 !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="poster-design"], [data-active-feature="outfit-recommend"]) .prompt-optimize-button span {
  font-size: 11px !important;
  font-weight: 450 !important;
  -webkit-font-smoothing: antialiased;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="poster-design"], [data-active-feature="outfit-recommend"]) .prompt-optimize-button:hover:not(:disabled) {
  border-color: rgba(91, 73, 230, 0.5) !important;
  color: #ffffff !important;
  background: #5b4be8 !important;
  box-shadow: 0 12px 24px rgba(91, 73, 230, 0.2) !important;
  transform: translateY(-1px) !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="poster-design"], [data-active-feature="outfit-recommend"]) .prompt-optimize-button:disabled {
  color: #aaa6be !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="poster-design"], [data-active-feature="outfit-recommend"]) .prompt-optimize-button.is-busy {
  color: #ffffff !important;
  background: #5b4be8 !important;
  cursor: wait !important;
}

/* Homepage advanced tools: one shared four-column card system for every industry. */
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  grid-auto-rows: auto !important;
  gap: 14px !important;
}

/* Multi-row industries keep the same natural 16:9 card geometry as single-row industries. */
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-grid:has(> .advanced-card:nth-child(4)) {
  grid-auto-rows: auto !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(1),
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(2),
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(3),
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(4),
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(5),
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(6),
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(7) {
  grid-column: span 1 !important;
  grid-row: span 1 !important;
  display: grid !important;
  min-height: 288px !important;
  padding: 14px !important;
  overflow: hidden !important;
  border: 1px solid #ececf6 !important;
  border-radius: 17px !important;
  color: var(--ink) !important;
  text-align: left !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: 0 8px 24px rgba(70, 68, 110, 0.045) !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card::before {
  display: none !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:hover,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card.active,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card.selected {
  border-color: rgba(123, 97, 255, 0.34) !important;
  background: #ffffff !important;
  box-shadow: 0 12px 30px rgba(123, 97, 255, 0.11) !important;
  transform: translateY(-2px) !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-visual {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 12px 10px !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-chip {
  position: static !important;
  z-index: auto !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: start !important;
  justify-self: start !important;
  gap: 5px !important;
  min-height: 28px !important;
  max-width: 104px !important;
  padding: 0 9px !important;
  overflow: hidden !important;
  border: 1px solid #e5ddff !important;
  border-radius: 999px !important;
  color: #765cff !important;
  background: #f4f1ff !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 525 !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  backdrop-filter: none !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-chip .lucide {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 auto !important;
  color: currentColor !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-title {
  position: static !important;
  z-index: auto !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: grid !important;
  align-self: center !important;
  gap: 4px !important;
  min-width: 0 !important;
  color: var(--ink) !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-title strong,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(1) .advanced-title strong,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(2) .advanced-title strong,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(n + 3) .advanced-title strong {
  overflow: hidden !important;
  color: #25283a !important;
  font-size: 18px !important;
  font-weight: 560 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  text-shadow: none !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-title small,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(1) .advanced-title small,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(2) .advanced-title small,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(n + 3) .advanced-title small {
  display: block !important;
  max-width: none !important;
  overflow: hidden !important;
  color: #7c8194 !important;
  font-size: 12px !important;
  font-weight: 450 !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  -webkit-line-clamp: initial !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-main-img {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  overflow: hidden !important;
  border: 1px solid #ececf6 !important;
  border-radius: 12px !important;
  background: #f4f4fa !important;
  object-fit: cover !important;
  object-position: center top !important;
  filter: none !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .detail-visual .advanced-main-img {
  object-position: center 58% !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:hover .advanced-main-img {
  transform: none !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-mini-stack,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-item-strip,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .video-frame-stack,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-foot {
  display: none !important;
}

@media (max-width: 1320px) {
  body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 980px) {
  body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 640px) {
  body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-grid {
    grid-template-columns: 1fr !important;
  }
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-latest-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  grid-template-rows: none !important;
  grid-auto-rows: auto !important;
  align-content: start !important;
  justify-content: start !important;
  height: auto !important;
  max-height: 100% !important;
  overflow: auto !important;
  overscroll-behavior: contain !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-running-card {
  aspect-ratio: 3 / 4 !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  gap: 7px !important;
  padding: 6px !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) :is(.wrinkle-running-aura, .wrinkle-running-info, .wrinkle-compensation-badge) {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-running-core {
  align-self: center !important;
  display: grid !important;
  place-items: center !important;
  gap: 6px !important;
  min-height: 0 !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-running-spinner {
  width: 34px !important;
  height: 34px !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-running-spinner i {
  width: 22px !important;
  height: 22px !important;
  border-width: 2px !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-running-core strong {
  font-size: 13px !important;
  line-height: 1.15 !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-latest-card {
  aspect-ratio: 3 / 4 !important;
  height: auto !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="outfit-recommend"],
  [data-active-feature="poster-design"],
  [data-active-feature="pose-change"],
  [data-active-feature="buyer-show"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="print-extract"]
) .wrinkle-latest-card {
  padding: 0 !important;
  border: 1px solid rgba(179, 190, 255, 0.85) !important;
  border-radius: 12px !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="outfit-recommend"],
  [data-active-feature="poster-design"],
  [data-active-feature="pose-change"],
  [data-active-feature="buyer-show"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="print-extract"]
) .wrinkle-latest-open,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="outfit-recommend"],
  [data-active-feature="poster-design"],
  [data-active-feature="pose-change"],
  [data-active-feature="buyer-show"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="print-extract"]
) .wrinkle-latest-thumb {
  width: 100% !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: transparent !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="outfit-recommend"],
  [data-active-feature="poster-design"],
  [data-active-feature="pose-change"],
  [data-active-feature="buyer-show"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="print-extract"]
) .wrinkle-latest-thumb img,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="outfit-recommend"],
  [data-active-feature="poster-design"],
  [data-active-feature="pose-change"],
  [data-active-feature="buyer-show"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="print-extract"]
) .wrinkle-latest-thumb .work-image-empty {
  width: 100% !important;
  height: 100% !important;
  border-radius: inherit !important;
  object-fit: contain !important;
  background: transparent !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="outfit-recommend"],
  [data-active-feature="poster-design"],
  [data-active-feature="pose-change"],
  [data-active-feature="buyer-show"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="print-extract"]
) .wrinkle-latest-delete {
  top: 10px !important;
  right: 10px !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-running-core small {
  display: -webkit-box !important;
  max-width: calc(100% - 16px) !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

@media (min-width: 1440px) {
  body.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="wrinkle"],
    [data-active-feature="background"],
    [data-active-feature="colors"],
    [data-active-feature="try-on"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="prompt-edit"],
    [data-active-feature="hd-upscale"],
    [data-active-feature="watermark-remove"],
    [data-active-feature="background-remove"],
    [data-active-feature="poster-design"],
    [data-active-feature="live-sticker"],
    [data-active-feature="pose-change"],
    [data-active-feature="print-extract"],
    [data-active-feature="buyer-show"],
    [data-active-feature="set-generate"],
    [data-active-feature="outfit-recommend"]
  ) .preview-column {
    justify-self: stretch !important;
    width: 100% !important;
    max-width: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="wrinkle"],
    [data-active-feature="background"],
    [data-active-feature="colors"],
    [data-active-feature="try-on"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="prompt-edit"],
    [data-active-feature="hd-upscale"],
    [data-active-feature="watermark-remove"],
    [data-active-feature="background-remove"],
    [data-active-feature="poster-design"],
    [data-active-feature="live-sticker"],
    [data-active-feature="pose-change"],
    [data-active-feature="print-extract"],
    [data-active-feature="buyer-show"],
    [data-active-feature="set-generate"],
    [data-active-feature="outfit-recommend"]
  ) :is(.preview-card, .detail-page-latest-panel, .wrinkle-latest-panel) {
    width: 100% !important;
    max-width: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="wrinkle"],
    [data-active-feature="background"],
    [data-active-feature="colors"],
    [data-active-feature="try-on"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="prompt-edit"],
    [data-active-feature="hd-upscale"],
    [data-active-feature="watermark-remove"],
    [data-active-feature="background-remove"],
    [data-active-feature="poster-design"],
    [data-active-feature="live-sticker"],
    [data-active-feature="pose-change"],
    [data-active-feature="print-extract"],
    [data-active-feature="buyer-show"],
    [data-active-feature="set-generate"],
    [data-active-feature="outfit-recommend"]
  ) .wrinkle-latest-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    grid-template-rows: none !important;
    grid-auto-rows: auto !important;
    align-content: start !important;
    justify-content: start !important;
    height: auto !important;
    max-height: 100% !important;
  }
}

/* Detail pages: group the module cards with the same framed section treatment
 * used by the adjacent style-settings block. */
html body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-page-module-picker {
  padding: 12px !important;
  border: 1px solid rgba(112, 92, 246, 0.2) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, #fbfaff 0%, #f7f9ff 100%) !important;
  box-shadow: none !important;
}

html body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-page-module-picker::before {
  display: none !important;
  content: none !important;
}

html body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-page-module-picker .detail-page-module-head > span {
  color: #5c50d9 !important;
}

/* Fashion background replacement: the mode controls are self-explanatory, so
 * remove the redundant settings heading and its reserved row. */
html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"] #settings-card > .settings-head {
  display: none !important;
}

/* Fashion flat-lay generation: start directly with the product controls. */
html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="flat-lay"] #settings-card > .settings-head {
  display: none !important;
}

/* Fashion clothes-on-model: begin with the model attribute controls. */
html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="clothes-on-model"] #settings-card > .settings-head {
  display: none !important;
}

/* Fashion free-match: begin directly with the model and outfit controls. */
html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] #settings-card > .settings-head {
  display: none !important;
}

/* Fashion model pose change: start directly with the pose reference controls. */
html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pose-change"] #settings-card > .settings-head {
  display: none !important;
}

/* Fashion buyer-show generation: start directly with model attributes. */
html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] #settings-card > .settings-head {
  display: none !important;
}

/* Fashion guest fitting room: begin directly with shop and product controls. */
html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] #settings-card > .settings-head {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .wrinkle-latest-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  grid-auto-rows: auto !important;
  align-items: start !important;
  align-content: start !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .wrinkle-latest-card {
  position: relative !important;
  display: block !important;
  aspect-ratio: 3 / 4 !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .wrinkle-latest-card:not(.wrinkle-running-card) .wrinkle-latest-open,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .wrinkle-latest-card:not(.wrinkle-running-card) .wrinkle-latest-thumb {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .wrinkle-latest-card:not(.wrinkle-running-card) .wrinkle-latest-thumb img,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .wrinkle-latest-card:not(.wrinkle-running-card) .wrinkle-latest-thumb .work-image-empty,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .wrinkle-latest-card:not(.wrinkle-running-card) .wrinkle-latest-state {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .wrinkle-latest-card:not(.wrinkle-running-card) .wrinkle-latest-thumb img {
  object-fit: contain !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .wrinkle-latest-card.is-failed .wrinkle-latest-state {
  background: rgba(35, 38, 48, 0.58) !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .wrinkle-running-card {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden !important;
}

/* Keep shared latest-work cards inside their own grid tracks. */
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-latest-card:not(.wrinkle-running-card) {
  position: relative !important;
  display: block !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-latest-card:not(.wrinkle-running-card) .wrinkle-latest-open,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-latest-card:not(.wrinkle-running-card) .wrinkle-latest-thumb {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-latest-card:not(.wrinkle-running-card) .wrinkle-latest-thumb img,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-latest-card:not(.wrinkle-running-card) .wrinkle-latest-thumb .work-image-empty,
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="wrinkle"],
  [data-active-feature="background"],
  [data-active-feature="flat-lay"],
  [data-active-feature="colors"],
  [data-active-feature="try-on"],
  [data-active-feature="clothes-on-model"],
  [data-active-feature="free-match"],
  [data-active-feature="prompt-edit"],
  [data-active-feature="hd-upscale"],
  [data-active-feature="watermark-remove"],
  [data-active-feature="background-remove"],
  [data-active-feature="poster-design"],
  [data-active-feature="live-sticker"],
  [data-active-feature="pose-change"],
  [data-active-feature="print-extract"],
  [data-active-feature="buyer-show"],
  [data-active-feature="set-generate"],
  [data-active-feature="outfit-recommend"]
) .wrinkle-latest-card:not(.wrinkle-running-card) .wrinkle-latest-state {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

@media (min-width: 761px) {
  body.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="wrinkle"],
    [data-active-feature="background"],
    [data-active-feature="colors"],
    [data-active-feature="try-on"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="prompt-edit"],
    [data-active-feature="hd-upscale"],
    [data-active-feature="watermark-remove"],
    [data-active-feature="background-remove"],
    [data-active-feature="poster-design"],
    [data-active-feature="live-sticker"],
    [data-active-feature="pose-change"],
    [data-active-feature="print-extract"],
    [data-active-feature="buyer-show"],
    [data-active-feature="set-generate"],
    [data-active-feature="outfit-recommend"]
  ) .wrinkle-latest-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(3, minmax(0, 1fr)) !important;
    grid-auto-rows: 0 !important;
    align-content: stretch !important;
    height: 100% !important;
    max-height: none !important;
    overflow: hidden !important;
  }

  body.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="wrinkle"],
    [data-active-feature="background"],
    [data-active-feature="colors"],
    [data-active-feature="try-on"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="prompt-edit"],
    [data-active-feature="hd-upscale"],
    [data-active-feature="watermark-remove"],
    [data-active-feature="background-remove"],
    [data-active-feature="poster-design"],
    [data-active-feature="live-sticker"],
    [data-active-feature="pose-change"],
    [data-active-feature="print-extract"],
    [data-active-feature="buyer-show"],
    [data-active-feature="set-generate"],
    [data-active-feature="outfit-recommend"]
  ) .wrinkle-latest-card {
    align-self: stretch !important;
    aspect-ratio: auto !important;
    height: 100% !important;
    min-height: 0 !important;
  }
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="outfit-recommend"] .wrinkle-running-progress {
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature] .preview-card.generating::after {
  content: none !important;
  display: none !important;
  animation: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature] .preview-card.generating .shine-layer {
  display: none !important;
  opacity: 0 !important;
  animation: none !important;
  transform: none !important;
}

#image-viewer-image.is-loading-full,
#image-viewer-before.is-loading-full,
#image-viewer-after.is-loading-full {
  opacity: 0.98;
  filter: saturate(0.96);
  transition: opacity 0.18s ease, filter 0.18s ease;
}

/* Keep page-level dialogs above every workstation control and dropdown. */
body > .modal-backdrop {
  z-index: 120000 !important;
}

body > .modal-backdrop.appeal-modal {
  z-index: 120100 !important;
}

@media (max-height: 760px) and (min-width: 721px) {
  .credit-action-modal.is-plans .credit-action-dialog {
    height: calc(100vh - 12px);
    min-height: 0;
    gap: 8px;
    padding: 14px 22px;
  }

  .credit-action-modal.is-plans .credit-action-body {
    overflow: hidden;
    padding-right: 0;
    padding-bottom: 0;
  }

  .credit-action-modal.is-plans .credit-action-head h2 {
    margin-bottom: 0;
    font-size: 24px;
  }

  .credit-action-modal.is-plans .member-plan-switch {
    margin-bottom: 8px;
  }

  .credit-action-modal.is-plans .member-plan-switch button {
    min-height: 38px;
    padding: 0 18px;
    font-size: 16px;
  }

  .credit-action-modal.is-plans .credit-package-hero {
    gap: 12px;
    margin-bottom: 8px;
    padding: 10px 14px;
    border-radius: 14px;
  }

  .credit-action-modal.is-plans .credit-package-hero span {
    margin-bottom: 3px;
    font-size: 10px;
  }

  .credit-action-modal.is-plans .credit-package-hero strong {
    font-size: 20px;
  }

  .credit-action-modal.is-plans .credit-package-hero small {
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.35;
  }

  .credit-action-modal.is-plans .credit-package-hero ul {
    gap: 3px;
  }

  .credit-action-modal.is-plans .credit-package-hero li {
    min-height: 24px;
    font-size: 12px;
  }

  .credit-action-modal.is-plans .member-plan-board {
    padding-top: 4px;
  }

  .credit-action-modal.is-plans .member-plan-card {
    gap: 7px !important;
    min-height: 378px;
    padding: 14px 14px 12px !important;
    border-radius: 18px !important;
  }

  .credit-action-modal.is-plans .member-plan-head {
    min-height: 47px;
  }

  .credit-action-modal.is-plans .member-plan-head strong {
    font-size: 19px !important;
  }

  .credit-action-modal.is-plans .member-plan-price {
    gap: 3px;
    min-height: 58px;
  }

  .credit-action-modal.is-plans .member-plan-price strong {
    font-size: 30px;
  }

  .credit-action-modal.is-plans .member-plan-feature-list {
    gap: 5px;
    padding-top: 2px;
  }

  .credit-action-modal.is-plans .member-plan-feature-list li {
    gap: 6px;
    font-size: 11px !important;
    line-height: 1.35 !important;
  }

  .credit-action-modal.is-plans .member-plan-card button {
    min-height: 38px !important;
  }

  .credit-action-modal.is-plans .member-plan-pay-note {
    font-size: 10px;
  }

  .credit-action-modal.is-plans .member-plan-packages .credit-package-card {
    gap: 5px !important;
    padding: 14px !important;
  }

  .credit-action-modal.is-plans .member-plan-packages .credit-package-card p {
    min-height: 26px;
    line-height: 1.35;
  }

  .credit-action-modal.is-plans .member-plan-packages .credit-package-member-prices {
    gap: 2px;
    padding-top: 6px;
  }

  .credit-action-modal.is-plans .member-plan-packages .credit-package-member-row {
    min-height: 27px;
    padding: 2px 0;
  }

  .credit-action-modal.is-plans .member-plan-packages .credit-package-card button {
    min-height: 38px !important;
  }
}

@media (max-width: 720px) {
  .credit-action-modal.is-plans .credit-action-dialog {
    height: calc(100vh - 12px);
    min-height: 0;
  }

  .credit-action-modal.is-plans .credit-action-body {
    overflow: auto;
    padding-right: 4px;
  }
}

@media (max-width: 720px) {
  .member-plan-validity {
    grid-template-columns: 1fr;
  }

  .member-plan-validity span {
    justify-content: flex-start;
    border-right: 0;
    border-bottom: 1px solid #e3e8f0;
    text-align: left;
  }

  .member-plan-validity span:last-child {
    border-bottom: 0;
  }
}

/* Feedback dialog: compact hierarchy and a single, stable action row. */
#need-request-modal {
  padding: 18px !important;
  background: rgba(20, 22, 30, 0.34) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}

#need-request-modal .need-request-card {
  display: flex !important;
  flex-direction: column;
  align-items: stretch !important;
  gap: 0 !important;
  width: min(600px, calc(100vw - 32px)) !important;
  max-height: min(760px, calc(100vh - 36px));
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid #e4e7ee !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 24px 64px rgba(28, 31, 43, 0.16) !important;
}

#need-request-modal .need-request-head {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 20px 24px 18px;
  border-bottom: 1px solid #edf0f5;
}

#need-request-modal .need-request-head-icon {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  color: #6657e8;
  background: #f0eeff;
}

#need-request-modal .need-request-head-icon .lucide {
  width: 20px;
  height: 20px;
  stroke-width: 1.8;
}

#need-request-modal .need-request-head-copy {
  min-width: 0;
}

#need-request-modal .need-request-head-copy h2 {
  margin: 0 !important;
  color: #202536;
  font-size: 20px;
  font-weight: 680;
  line-height: 1.25;
}

#need-request-modal .need-request-head-copy p {
  margin: 3px 0 0 !important;
  color: #7b8395;
  font-size: 13px;
  line-height: 1.4;
}

#need-request-modal .need-request-reward {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  padding: 7px 9px;
  border-radius: 8px;
  color: #5a4fd1;
  background: #f4f2ff;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

#need-request-modal .need-request-reward .lucide {
  width: 14px;
  height: 14px;
  stroke-width: 1.8;
}

#need-request-modal .need-request-body {
  display: grid;
  gap: 18px;
  padding: 20px 24px;
  overflow: auto;
}

#need-request-modal .need-request-form {
  display: grid;
  gap: 8px;
  margin: 0;
}

#need-request-modal .need-request-form > span,
#need-request-modal .need-request-upload-label {
  color: #343a4b;
  font-size: 13px;
  font-weight: 640;
}

#need-request-modal .need-request-upload-label {
  display: flex;
  gap: 7px;
  align-items: baseline;
}

#need-request-modal .need-request-upload-label small {
  color: #9299a9;
  font-size: 11.5px;
  font-weight: 500;
}

#need-request-modal .need-request-form textarea {
  min-height: 150px !important;
  max-height: 260px;
  padding: 13px 14px !important;
  border: 1px solid #dfe3eb !important;
  border-radius: 10px !important;
  color: #252a38 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  font-size: 13.5px;
  line-height: 1.65;
}

#need-request-modal .need-request-form textarea::placeholder {
  color: #a1a7b5;
}

#need-request-modal .need-request-form textarea:focus {
  border-color: #8d82ec !important;
  box-shadow: 0 0 0 3px rgba(102, 87, 232, 0.1) !important;
}

#need-request-modal .need-request-form small#need-request-message {
  min-height: 0;
  color: #d14d5c;
  font-size: 12px;
}

#need-request-modal .need-request-form small#need-request-message:empty {
  display: none;
}

#need-request-modal .need-request-upload {
  display: grid;
  gap: 8px;
  justify-items: stretch;
  margin: 0 !important;
}

#need-request-modal .need-request-dropzone {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: flex-start;
  width: 100% !important;
  min-height: 76px !important;
  padding: 14px 16px !important;
  border: 1px dashed #cbd2df !important;
  border-radius: 10px !important;
  color: #60697b;
  background: #fafbfc !important;
  box-shadow: none !important;
  text-align: left;
}

#need-request-modal .need-request-dropzone:hover,
#need-request-modal .need-request-dropzone:focus-visible,
#need-request-modal .need-request-dropzone.is-dragover {
  border-color: #8d82ec !important;
  background: #f8f7ff !important;
  box-shadow: none !important;
  transform: none !important;
}

#need-request-modal .need-request-dropzone > .lucide {
  flex: 0 0 auto;
  width: 26px !important;
  height: 26px !important;
  color: #6657e8 !important;
  stroke-width: 1.7;
}

#need-request-modal .need-request-dropzone > span {
  display: grid;
  gap: 2px;
  justify-items: start;
}

#need-request-modal .need-request-dropzone strong {
  color: #303647;
  font-size: 13.5px;
  font-weight: 640;
}

#need-request-modal .need-request-dropzone small {
  color: #8c94a4;
  font-size: 12px;
  font-weight: 500;
}

#need-request-modal .need-request-image-list:not(:empty) {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-top: 2px;
}

#need-request-modal .need-request-image-item {
  border-radius: 8px;
}

#need-request-modal .need-request-history {
  border: 1px solid #e5e9f0;
  border-radius: 10px;
  background: #fbfcfe;
}

#need-request-modal .need-request-history summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 46px;
  padding: 0 13px;
  color: #3a4254;
  cursor: pointer;
  list-style: none;
}

#need-request-modal .need-request-history summary::-webkit-details-marker {
  display: none;
}

#need-request-modal .need-request-history summary > span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 650;
}

#need-request-modal .need-request-history summary .lucide {
  width: 15px;
  height: 15px;
  color: #6657e8;
}

#need-request-modal .need-request-history summary small {
  color: #8d95a5;
  font-size: 11.5px;
}

#need-request-modal .need-request-history-list {
  display: grid;
  gap: 7px;
  max-height: 220px;
  padding: 0 10px 10px;
  overflow: auto;
}

#need-request-modal .need-request-history-list > p {
  margin: 0;
  padding: 12px;
  color: #8d95a5;
  font-size: 12px;
  text-align: center;
}

#need-request-modal .need-request-history-item {
  display: grid;
  gap: 4px;
  padding: 9px 10px;
  border: 1px solid #e7ebf1;
  border-left: 3px solid #e0a13b;
  border-radius: 7px;
  background: #fff;
}

#need-request-modal .need-request-history-item.is-approved {
  border-left-color: #22a06b;
}

#need-request-modal .need-request-history-item.is-rejected {
  border-left-color: #d95764;
}

#need-request-modal .need-request-history-item > div {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: #7b8395;
  font-size: 11px;
}

#need-request-modal .need-request-history-item strong {
  color: #303647;
  font-size: 12.5px;
  font-weight: 630;
}

#need-request-modal .need-request-history-item > small {
  color: #6d7587;
  font-size: 11.5px;
}

#need-request-modal .need-request-footer {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  padding: 14px 24px;
  border-top: 1px solid #edf0f5;
  background: #fbfcfd;
}

#need-request-modal .need-request-support-button {
  min-height: 38px;
  margin: 0;
  padding: 0 4px;
  border: 0;
  border-radius: 0;
  color: #60697b;
  background: transparent;
  box-shadow: none;
  font-size: 13px;
  font-weight: 560;
}

#need-request-modal .need-request-support-button:hover,
#need-request-modal .need-request-support-button:focus-visible {
  color: #5a4fd1;
  background: transparent;
  box-shadow: none;
  transform: none;
}

#need-request-modal .modal-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin: 0;
}

#need-request-modal .modal-actions button {
  min-width: 92px;
  min-height: 40px;
  border-radius: 9px !important;
  font-size: 13.5px;
  font-weight: 620;
}

#need-request-modal .modal-actions .create-button {
  min-width: 116px;
  padding: 0 15px !important;
  background: #24213d !important;
  box-shadow: none !important;
}

#need-request-modal .modal-actions .outline-button {
  border-color: #dfe3eb !important;
  color: #626a7b !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

@media (max-width: 560px) {
  #need-request-modal {
    padding: 8px !important;
  }

  #need-request-modal .need-request-card {
    width: calc(100vw - 16px) !important;
    max-height: calc(100vh - 16px);
    border-radius: 13px !important;
  }

  #need-request-modal .need-request-head {
    grid-template-columns: 36px minmax(0, 1fr);
    padding: 16px;
  }

  #need-request-modal .need-request-head-icon {
    width: 36px;
    height: 36px;
  }

  #need-request-modal .need-request-reward {
    grid-column: 1 / -1;
    width: fit-content;
  }

  #need-request-modal .need-request-body {
    padding: 16px;
  }

  #need-request-modal .need-request-form textarea {
    min-height: 132px !important;
  }

  #need-request-modal .need-request-image-list:not(:empty) {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  #need-request-modal .need-request-footer {
    flex-wrap: wrap;
    padding: 12px 16px;
  }

  #need-request-modal .modal-actions {
    margin-left: auto;
  }
}

/* Public task cards intentionally expose only a neutral in-progress state. */
.public-running-only {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) !important;
  place-items: center !important;
  align-content: center !important;
  justify-items: center !important;
  gap: 0 !important;
  padding: 12px !important;
}

.public-running-only .wrinkle-running-core {
  width: 100%;
  height: auto !important;
  min-height: 72px;
  align-content: center;
  gap: 7px;
}

.public-running-only .wrinkle-running-core strong {
  font-size: 13px;
}

.public-running-only .wrinkle-running-aura {
  top: 50% !important;
}

.public-task-status-only {
  display: grid !important;
  place-content: center !important;
  justify-items: center !important;
  gap: 9px !important;
  min-height: 120px;
  text-align: center;
}

.public-task-status-only .video-status-copy {
  display: block;
  text-align: center;
}

/* Unified high-precision generation state for workbench previews and All Tasks. */
.public-task-status-only,
.public-running-only {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 38%, rgba(124, 92, 255, 0.16), transparent 27%),
    radial-gradient(circle at 18% 12%, rgba(73, 197, 255, 0.12), transparent 24%),
    linear-gradient(145deg, rgba(250, 249, 255, 0.98), rgba(243, 246, 255, 0.94)) !important;
}

.public-task-status-only::before,
.public-running-only::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -45%;
  background: conic-gradient(from 90deg, transparent, rgba(120, 91, 255, 0.1), transparent 24%, rgba(69, 203, 255, 0.09), transparent 48%);
  animation: generationBackdropRotate 9s linear infinite;
}

.public-task-status-only::after,
.public-running-only::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: 0.42;
  background-image: radial-gradient(circle, rgba(112, 89, 238, 0.22) 0 1px, transparent 1.4px);
  background-size: 24px 24px;
  mask-image: linear-gradient(to bottom, transparent, #000 28%, #000 70%, transparent);
  animation: generationParticleDrift 7s linear infinite;
}

.unified-generation-status {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 11px;
  width: min(100%, 330px);
  margin: auto;
  padding: 18px 16px;
  text-align: center;
}

.generation-wait-visual {
  position: relative;
  display: grid;
  place-items: center;
  width: 84px;
  height: 84px;
}

.generation-wait-halo {
  position: absolute;
  inset: 7px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.98) 0 22%, rgba(123, 97, 255, 0.22) 38%, rgba(74, 192, 255, 0.06) 66%, transparent 70%);
  filter: blur(1px);
  animation: generationHaloPulse 1.9s ease-in-out infinite;
}

.generation-wait-orbit {
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(119, 92, 244, 0.2);
}

.generation-wait-orbit i {
  position: absolute;
  top: -4px;
  left: 50%;
  width: 8px;
  height: 8px;
  margin-left: -4px;
  border-radius: 50%;
  background: #745cff;
  box-shadow: 0 0 13px rgba(116, 92, 255, 0.9);
}

.generation-wait-orbit-outer {
  inset: 2px;
  border-top-color: rgba(116, 92, 255, 0.92);
  border-right-color: rgba(78, 194, 255, 0.62);
  animation: generationOrbitSpin 1.8s linear infinite;
}

.generation-wait-orbit-inner {
  inset: 15px;
  border-bottom-color: rgba(116, 92, 255, 0.9);
  border-left-color: rgba(78, 194, 255, 0.65);
  animation: generationOrbitSpinReverse 1.15s linear infinite;
}

.generation-wait-orbit-inner i {
  top: auto;
  right: -3px;
  bottom: 12px;
  left: auto;
  width: 6px;
  height: 6px;
  background: #45c7ff;
  box-shadow: 0 0 11px rgba(69, 199, 255, 0.9);
}

.generation-wait-core {
  position: relative;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 12px;
  color: #fff;
  background: linear-gradient(145deg, #846bff, #5d4ce8 58%, #47bdf0);
  box-shadow: 0 9px 24px rgba(102, 76, 235, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.34);
  animation: generationCoreFloat 2.2s ease-in-out infinite;
}

.generation-wait-core .lucide {
  width: 18px;
  height: 18px;
  stroke-width: 2.2;
}

.generation-wait-copy {
  display: grid;
  justify-items: center;
  gap: 5px;
  max-width: 310px;
}

.generation-wait-copy strong {
  color: #20243a;
  font-size: 18px;
  font-weight: 760;
  letter-spacing: 0.04em;
}

.generation-wait-copy > span {
  color: #5c5f75;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.5;
}

.generation-wait-copy > .generation-wait-elapsed {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 26px;
  padding: 4px 10px;
  border: 1px solid rgba(116, 92, 255, 0.18);
  border-radius: 999px;
  color: #56506f;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 5px 14px rgba(86, 72, 165, 0.08);
  font-size: 11px;
  line-height: 1;
}

.generation-wait-elapsed .lucide {
  width: 13px;
  height: 13px;
  color: #7059ee;
  stroke-width: 2.2;
}

.generation-wait-elapsed b {
  color: #443b76;
  font-size: inherit;
  font-weight: 760;
}

.generation-wait-copy small {
  color: #85889a;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.55;
}

.generation-wait-progress {
  position: relative;
  width: min(190px, 76%);
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(111, 94, 196, 0.11);
}

.generation-wait-progress i {
  position: absolute;
  inset: 0 auto 0 -42%;
  width: 42%;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, #755cff 45%, #4fc7f7 82%, transparent);
  box-shadow: 0 0 12px rgba(112, 91, 243, 0.55);
  animation: generationProgressSweep 1.65s ease-in-out infinite;
}

.work-card .unified-generation-status {
  gap: 8px;
  padding: 12px 10px;
}

.work-generating-mask.public-running-only {
  position: absolute !important;
  inset: 0 !important;
}

body.works-focus-mode .work-card.is-running .work-generating-mask {
  z-index: 5;
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body.works-focus-mode .work-card.is-running .work-generating-mask > .unified-generation-status {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.work-card .generation-wait-visual {
  width: 68px;
  height: 68px;
}

.work-card .generation-wait-copy strong {
  font-size: 15px;
}

.work-card .generation-wait-copy > span {
  font-size: 10px;
}

.work-card .generation-wait-copy > .generation-wait-elapsed {
  min-height: 22px;
  padding: 3px 8px;
  font-size: 9px;
}

.work-card .generation-wait-copy small {
  font-size: 9px;
}

@keyframes generationOrbitSpin {
  to { transform: rotate(360deg); }
}

@keyframes generationOrbitSpinReverse {
  to { transform: rotate(-360deg); }
}

@keyframes generationHaloPulse {
  0%, 100% { opacity: 0.62; transform: scale(0.9); }
  50% { opacity: 1; transform: scale(1.08); }
}

@keyframes generationCoreFloat {
  0%, 100% { transform: translateY(2px) rotate(-3deg); }
  50% { transform: translateY(-3px) rotate(3deg); }
}

@keyframes generationProgressSweep {
  0% { left: -42%; }
  60%, 100% { left: 100%; }
}

@keyframes generationBackdropRotate {
  to { transform: rotate(360deg); }
}

@keyframes generationParticleDrift {
  from { background-position: 0 0; }
  to { background-position: 24px 48px; }
}

@media (prefers-reduced-motion: reduce) {
  .generation-wait-orbit,
  .generation-wait-halo,
  .generation-wait-core,
  .generation-wait-progress i,
  .public-task-status-only::before,
  .public-task-status-only::after,
  .public-running-only::before,
  .public-running-only::after {
    animation-duration: 8s !important;
  }
}

/* Compact personal center and affiliate commission workspace. */
#profile-modal .profile-card {
  width: min(900px, calc(100vw - 28px)) !important;
  max-height: calc(100vh - 28px) !important;
  padding: 20px !important;
  border-radius: 14px !important;
}

#profile-modal .profile-center-head {
  grid-template-columns: 56px minmax(0, 1fr) !important;
  gap: 12px !important;
  margin-bottom: 14px !important;
}

#profile-modal .profile-avatar-edit,
#profile-modal .profile-avatar-edit span {
  width: 56px !important;
  height: 56px !important;
  min-height: 56px !important;
  border-radius: 8px !important;
}

#profile-modal .profile-avatar-edit em {
  right: 3px;
  bottom: 3px;
  height: 18px;
  padding: 0 5px;
  font-size: 9px;
}

#profile-modal .profile-avatar-edit .lucide {
  width: 23px;
  height: 23px;
}

#profile-modal .profile-center-head > div > span {
  margin-bottom: 2px;
  color: #28766e;
}

#profile-modal .profile-center-head h2 {
  font-size: 22px;
}

#profile-modal .profile-center-head p {
  margin-top: 3px;
  font-size: 12px;
}

#profile-modal .profile-center-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 9px !important;
}

#profile-modal .profile-panel {
  padding: 12px !important;
  border: 1px solid #e7ebf1 !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
}

#profile-modal .profile-panel-title {
  align-items: center;
  margin-bottom: 9px;
}

#profile-modal .profile-panel-title strong {
  font-size: 13px;
}

#profile-modal .profile-panel-title small {
  font-size: 11px;
}

#profile-modal .profile-form-compact {
  grid-template-columns: 0.7fr 1fr 1.35fr;
  gap: 9px;
}

#profile-modal .profile-form-compact label {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 7px;
  align-items: center;
  min-width: 0;
  height: 38px;
  padding: 0 10px;
  border: 1px solid #e7ebf1;
  border-radius: 6px;
  color: #7b8495;
  background: #f8fafc;
}

#profile-modal .profile-form-compact label > span {
  white-space: nowrap;
}

#profile-modal .profile-form-compact input {
  height: 34px;
  min-width: 0;
  padding: 0;
  border: 0;
  color: #182235;
  background: transparent !important;
  font-weight: 750;
  text-align: right;
  box-shadow: none !important;
}

#profile-modal .profile-form-compact input:not([readonly]) {
  padding-right: 21px;
}

#profile-modal .profile-form-compact label:has(input:not([readonly]))::after {
  position: absolute;
  right: 9px;
  width: 14px;
  height: 14px;
  color: #4377d5;
  content: "✎";
  font-size: 13px;
  line-height: 14px;
}

#profile-modal .profile-stat-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

#profile-modal .profile-stat-grid article {
  display: flex;
  align-items: center;
  min-width: 0;
  min-height: 44px;
  padding: 0 12px !important;
  border: 1px solid transparent;
  border-radius: 7px !important;
  white-space: nowrap;
}

#profile-modal .profile-stat-grid article > .lucide {
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  margin-right: 7px;
}

#profile-modal .profile-stat-grid article span,
#profile-modal .profile-stat-grid article strong {
  display: inline !important;
  margin: 0 !important;
  overflow: hidden;
  font-size: 13px !important;
  line-height: 1 !important;
  text-overflow: ellipsis;
  overflow-wrap: normal !important;
}

#profile-modal .profile-stat-grid article span {
  flex: 0 0 auto;
  color: inherit !important;
  opacity: 0.72;
}

#profile-modal .profile-stat-grid article strong {
  min-width: 0;
  color: inherit !important;
}

#profile-modal .profile-stat-member {
  color: #684a0f;
  border-color: #f0dfb6 !important;
  background: #fff8e7 !important;
}

#profile-modal .profile-stat-credit {
  color: #145e54;
  border-color: #bfe8df !important;
  background: #edfbf7 !important;
}

#profile-modal .profile-stat-expire {
  color: #315b9f;
  border-color: #cbdaf5 !important;
  background: #f0f5ff !important;
}

#profile-modal .profile-promotion-entry {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  gap: 11px;
  align-items: center;
  border-color: #d6e2f7 !important;
  background: #f5f8ff !important;
}

#profile-modal .profile-promotion-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 7px;
  color: #fff;
  background: #376fd0;
}

#profile-modal .profile-promotion-icon .lucide {
  width: 20px;
  height: 20px;
}

#profile-modal .profile-promotion-entry > div:nth-child(2) {
  display: grid;
  gap: 3px;
  min-width: 0;
}

#profile-modal .profile-promotion-entry strong {
  color: #172033;
  font-size: 13px;
}

#profile-modal .profile-promotion-entry span {
  overflow: hidden;
  color: #64748b;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#profile-modal .profile-promotion-entry > button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 11px;
  border: 0;
  border-radius: 6px;
  color: #fff;
  background: #376fd0;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

#profile-modal .profile-promotion-entry > button .lucide {
  width: 15px;
  height: 15px;
}

#profile-modal .profile-compact-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

#profile-modal .profile-compact-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 10px;
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid #e7ebf1;
  border-radius: 8px;
  background: #fff;
}

#profile-modal .profile-compact-action > span {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  color: #263247;
  font-size: 13px;
  font-weight: 800;
}

#profile-modal .profile-compact-action > span .lucide {
  width: 16px;
  height: 16px;
}

#profile-modal .profile-compact-invite > span .lucide {
  color: #7a53c6;
}

#profile-modal .profile-compact-redeem > span .lucide {
  color: #b56722;
}

#profile-modal .profile-compact-action > small {
  color: #8a94a8;
  font-size: 11px;
  text-align: right;
}

#profile-modal .profile-compact-action .profile-inline-action {
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1fr) auto;
  margin-top: 7px;
}

#profile-modal .profile-compact-action .profile-inline-action input {
  height: 34px;
  border: 1px solid #e4e9f0;
  border-radius: 6px;
  background: #f8fafc;
}

#profile-modal .profile-compact-action .profile-inline-action button {
  min-height: 34px !important;
  border-radius: 6px !important;
}

#profile-modal .profile-service-panel {
  padding-bottom: 10px !important;
}

#profile-modal .profile-action-grid-wide {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 7px;
}

#profile-modal .profile-action-grid-wide button {
  display: flex;
  gap: 7px;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 8px;
  border: 1px solid #e9edf3;
  border-radius: 7px;
  background: #f8fafc;
}

#profile-modal .profile-action-grid-wide button .lucide {
  width: 18px;
  height: 18px;
  margin: 0;
}

#profile-modal .profile-action-orders .lucide { color: #476fb4; }
#profile-modal .profile-action-usage .lucide { color: #2f8c7c; }
#profile-modal .profile-action-benefits .lucide { color: #b2771d; }
#profile-modal .profile-action-phone .lucide { color: #8a5cc3; }
#profile-modal .profile-action-account .lucide { color: #c45b68; }

#profile-modal #profile-message {
  min-height: 0;
  margin: 0 2px;
}

#profile-modal #profile-message:empty {
  display: none;
}

#profile-modal .profile-actions {
  margin-top: 11px;
}

#affiliate-modal .affiliate-card {
  width: min(620px, calc(100vw - 28px));
  border: 1px solid #dfe5ed !important;
  background: #ffffff !important;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.18) !important;
}

#affiliate-modal .affiliate-rule-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-top: 18px;
}

#affiliate-modal .affiliate-rule-grid > div {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-width: 0;
  padding: 11px;
  border: 1px solid #dfe7f2;
  border-radius: 7px;
  background: #f8fafc;
}

#affiliate-modal .affiliate-rule-grid .lucide {
  width: 21px;
  height: 21px;
  color: #376fd0;
}

#affiliate-modal .affiliate-rule-grid span,
#affiliate-modal .affiliate-rule-grid small,
#affiliate-modal .affiliate-rule-grid strong {
  display: block;
  min-width: 0;
}

#affiliate-modal .affiliate-rule-grid small {
  color: #7c8798;
  font-size: 11px;
}

#affiliate-modal .affiliate-rule-grid strong {
  margin-top: 2px;
  overflow: hidden;
  color: #1e293b;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#affiliate-modal .affiliate-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 10px;
  overflow: hidden;
  border: 1px solid #e3e8ef;
  border-radius: 7px;
  background: #fff;
}

#affiliate-modal .affiliate-stats article {
  min-width: 0;
  padding: 11px 13px;
  border-right: 1px solid #e8ecf2;
}

#affiliate-modal .affiliate-stats article:last-child {
  border-right: 0;
}

#affiliate-modal .affiliate-stats span,
#affiliate-modal .affiliate-stats strong,
#affiliate-modal .affiliate-stats small {
  display: block;
}

#affiliate-modal .affiliate-stats span,
#affiliate-modal .affiliate-stats small {
  color: #7c8798;
  font-size: 11px;
}

#affiliate-modal .affiliate-stats strong {
  margin: 3px 0;
  overflow: hidden;
  color: #172033;
  font-size: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#affiliate-modal .affiliate-settlement-card {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  margin-top: 10px;
  padding: 12px;
  border: 1px solid #dfe7f2;
  border-radius: 8px;
  background: #f8faff;
}

#affiliate-modal .affiliate-settlement-card.is-eligible {
  border-color: #a9dcc6;
  background: #f4fcf8;
}

#affiliate-modal .affiliate-settlement-icon {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 9px;
  color: #376fd0;
  background: #eaf1ff;
}

#affiliate-modal .affiliate-settlement-card.is-eligible .affiliate-settlement-icon {
  color: #187154;
  background: #dff5ea;
}

#affiliate-modal .affiliate-settlement-icon .lucide {
  width: 18px;
  height: 18px;
}

#affiliate-modal .affiliate-settlement-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

#affiliate-modal .affiliate-settlement-copy span,
#affiliate-modal .affiliate-settlement-copy small {
  color: #7b8799;
  font-size: 10.5px;
  line-height: 1.45;
}

#affiliate-modal .affiliate-settlement-copy strong {
  color: #26334a;
  font-size: 13px;
}

#affiliate-modal #affiliate-settlement-support {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 11px;
  border: 0;
  border-radius: 7px;
  color: #fff;
  background: #176b4d;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

#affiliate-modal #affiliate-settlement-support:disabled {
  color: #8b94a3;
  background: #e8ecf2;
  cursor: not-allowed;
}

#affiliate-modal #affiliate-settlement-support .lucide {
  width: 14px;
  height: 14px;
}

@media (max-width: 720px) {
  #profile-modal .profile-card {
    width: calc(100vw - 16px) !important;
    padding: 15px !important;
  }

  #profile-modal .profile-form-compact,
  #profile-modal .profile-stat-grid,
  #profile-modal .profile-compact-actions {
    grid-template-columns: 1fr !important;
  }

  #profile-modal .profile-action-grid-wide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #profile-modal .profile-promotion-entry {
    grid-template-columns: 36px minmax(0, 1fr);
  }

  #profile-modal .profile-promotion-entry > button {
    grid-column: 1 / -1;
  }

  #profile-modal .profile-promotion-entry span {
    white-space: normal;
  }

  #affiliate-modal .affiliate-rule-grid {
    grid-template-columns: 1fr;
  }

  #affiliate-modal .affiliate-settlement-card {
    grid-template-columns: 36px minmax(0, 1fr);
  }

  #affiliate-modal #affiliate-settlement-support {
    grid-column: 1 / -1;
  }
}

html[data-theme="dark"] #profile-modal .profile-panel,
html[data-theme="dark"] #profile-modal .profile-compact-action,
html[data-theme="dark"] #affiliate-modal .affiliate-stats,
html[data-theme="dark"] #affiliate-modal .affiliate-settlement-card,
html[data-theme="dark"] #affiliate-modal .affiliate-rule-grid > div {
  border-color: rgba(148, 163, 184, 0.18) !important;
  color: #e5e7eb !important;
  background: rgba(15, 23, 42, 0.82) !important;
}

html[data-theme="dark"] #affiliate-modal .affiliate-card {
  border-color: rgba(148, 163, 184, 0.2) !important;
  background: #111827 !important;
}

/* Simplified profile center and redemption entry. */
.credit-action-head-tools {
  display: flex;
  gap: 8px;
  align-items: center;
}

.credit-redeem-entry {
  padding: 4px 2px;
  border: 0;
  color: #52647d;
  background: transparent;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.credit-redeem-entry:hover {
  color: #245fc4;
}

.credit-redeem-panel {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(220px, 1.2fr) auto;
  gap: 10px;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid #dfe7f1;
  border-radius: 7px;
  background: #f8fafc;
}

.credit-redeem-panel[hidden] {
  display: none !important;
}

.credit-redeem-panel > div {
  display: grid;
  gap: 2px;
}

.credit-redeem-panel strong {
  color: #1f2937;
  font-size: 13px;
}

.credit-redeem-panel small,
.credit-redeem-panel > span {
  color: #7b8798;
  font-size: 11px;
}

.credit-redeem-panel input {
  height: 36px;
  border: 1px solid #dce3ec;
  border-radius: 6px;
  background: #fff;
}

.credit-redeem-panel button {
  min-height: 36px !important;
  border-radius: 6px !important;
}

.credit-redeem-panel > span {
  grid-column: 2 / -1;
  min-height: 0;
}

#profile-modal .profile-form-compact {
  grid-template-columns: 0.72fr 1.25fr 1.35fr;
}

#profile-modal #profile-username[readonly] {
  color: #4b5870;
  cursor: default;
}

#profile-modal .profile-invite-combined {
  display: grid;
  gap: 10px;
  border-color: #dce5f2 !important;
  background: #fbfcfe !important;
}

#profile-modal .profile-invite-summary {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

#profile-modal .profile-invite-summary > div:nth-child(2) {
  display: grid;
  gap: 3px;
  min-width: 0;
}

#profile-modal .profile-invite-summary strong {
  color: #1b2638;
  font-size: 13px;
}

#profile-modal .profile-invite-summary span {
  overflow: hidden;
  color: #66758b;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#profile-modal .profile-invite-summary > button {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  min-height: 32px;
  padding: 0 9px;
  border: 1px solid #cbd9ee;
  border-radius: 6px;
  color: #315f9f;
  background: #fff;
  font-size: 12px;
  font-weight: 750;
  cursor: pointer;
}

#profile-modal .profile-invite-summary > button .lucide {
  width: 14px;
  height: 14px;
}

#profile-modal .profile-invite-binding {
  display: grid;
  grid-template-columns: auto auto minmax(220px, 1fr);
  gap: 10px;
  align-items: center;
  padding-top: 10px;
  border-top: 1px solid #e8edf4;
}

#profile-modal .profile-invite-binding > span {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  color: #334155;
  font-size: 12px;
  font-weight: 750;
}

#profile-modal .profile-invite-binding > span .lucide {
  width: 15px;
  height: 15px;
  color: #6d55b3;
}

#profile-modal .profile-invite-binding > small {
  color: #8a94a5;
  font-size: 11px;
}

#profile-modal .profile-invite-binding .profile-inline-action {
  grid-template-columns: minmax(0, 1fr) auto;
}

#profile-modal .profile-invite-binding input {
  height: 34px;
  border: 1px solid #e1e7ef;
  border-radius: 6px;
  background: #fff;
}

#profile-modal .profile-invite-binding button {
  min-height: 34px !important;
  border-radius: 6px !important;
}

#profile-modal .profile-action-grid-wide {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 720px) {
  .credit-redeem-panel {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .credit-redeem-panel > div,
  .credit-redeem-panel > span {
    grid-column: 1 / -1;
  }

  #profile-modal .profile-invite-summary {
    grid-template-columns: 34px minmax(0, 1fr) auto;
  }

  #profile-modal .profile-invite-summary span {
    white-space: normal;
  }

  #profile-modal .profile-invite-binding {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  #profile-modal .profile-invite-binding .profile-inline-action {
    grid-column: 1 / -1;
  }
}

html[data-theme="dark"] #profile-modal .profile-card,
html[data-theme="dark"] .credit-action-dialog {
  border-color: #2b3648 !important;
  background: #111827 !important;
}

html[data-theme="dark"] #profile-modal .profile-invite-combined,
html[data-theme="dark"] .credit-redeem-panel {
  border-color: #303c50 !important;
  background: #172033 !important;
}

html[data-theme="dark"] #profile-modal .profile-invite-summary strong,
html[data-theme="dark"] #profile-modal .profile-invite-binding > span,
html[data-theme="dark"] .credit-redeem-panel strong {
  color: #e5e7eb !important;
}

html[data-theme="dark"] #profile-modal .profile-invite-summary span,
html[data-theme="dark"] #profile-modal .profile-invite-binding > small,
html[data-theme="dark"] .credit-redeem-panel small,
html[data-theme="dark"] .credit-redeem-panel > span {
  color: #9aa7ba !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #upload-clear-x {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-delete {
  top: -6px !important;
  right: -4px !important;
  z-index: 5 !important;
  width: 19px !important;
  height: 19px !important;
  padding: 0 !important;
  border: 1.5px solid #fff !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: rgba(235, 52, 82, 0.96) !important;
  box-shadow: 0 7px 14px rgba(223, 63, 85, 0.2) !important;
  opacity: 0.92 !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-delete .lucide {
  width: 11px !important;
  height: 11px !important;
  stroke-width: 3 !important;
  color: currentColor !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-slot:hover .detail-upload-delete,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-upload-delete:focus-visible {
  opacity: 1 !important;
  transform: translateY(-1px) scale(1.04) !important;
  background: #df3f55 !important;
}

/* 自由搭配复用详情图的三槽上传形式，其余工作台布局继续与服装模特图一致。 */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] #product-upload {
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  justify-items: stretch !important;
  min-height: 148px !important;
  padding: 14px !important;
  gap: 12px !important;
  text-align: left !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] #product-upload > #upload-thumb {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] #product-upload .upload-icon {
  justify-self: start !important;
  width: 42px !important;
  height: 42px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] #product-upload .upload-copy {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] #product-upload .upload-copy strong {
  font-size: 15px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] #product-upload .upload-copy small {
  max-width: 210px !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] .detail-upload-strip {
  display: grid !important;
  grid-template-columns: repeat(3, 68px) !important;
  gap: 9px !important;
  align-items: end !important;
  justify-content: end !important;
  padding-right: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] .detail-upload-slot {
  display: grid !important;
  grid-template-rows: auto 16px !important;
  justify-items: center !important;
  align-items: start !important;
  gap: 4px !important;
  width: 68px !important;
  min-height: 112px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] .detail-upload-slot:hover {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] .detail-upload-slot-frame {
  width: 64px !important;
  height: auto !important;
  aspect-ratio: 3 / 4 !important;
  border: 1px dashed rgba(195, 199, 217, 0.92) !important;
  border-radius: 13px !important;
  background: rgba(247, 248, 252, 0.96) !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] .detail-upload-slot.is-filled .detail-upload-slot-frame {
  border-style: solid !important;
  border-color: rgba(215, 219, 232, 0.95) !important;
  background: #fff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] .detail-upload-slot small {
  width: 100% !important;
  height: 16px !important;
  font-size: 11px !important;
  line-height: 16px !important;
  font-weight: 500 !important;
  color: #697386 !important;
  text-align: center !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] .detail-upload-slot:hover .detail-upload-slot-frame {
  border-color: rgba(113, 91, 255, 0.72) !important;
  background: #f6f3ff !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] .detail-upload-delete {
  top: -6px !important;
  right: -4px !important;
  z-index: 5 !important;
  width: 19px !important;
  height: 19px !important;
  padding: 0 !important;
  border: 1.5px solid #fff !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: rgba(235, 52, 82, 0.96) !important;
  box-shadow: 0 7px 14px rgba(223, 63, 85, 0.2) !important;
  opacity: 0.92 !important;
  transform: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] .detail-upload-delete .lucide {
  width: 11px !important;
  height: 11px !important;
  stroke-width: 3 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] .detail-upload-slot:hover .detail-upload-delete,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] .detail-upload-delete:focus-visible {
  opacity: 1 !important;
  transform: translateY(-1px) scale(1.04) !important;
  background: #df3f55 !important;
}

@media (max-width: 760px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] #product-upload {
    grid-template-columns: 42px minmax(0, 1fr) !important;
    min-height: 196px !important;
    align-content: start !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-match"] .detail-upload-strip {
    grid-column: 1 / -1 !important;
    grid-template-columns: repeat(3, minmax(0, 68px)) !important;
    justify-content: center !important;
    width: 100% !important;
  }
}

/* Keep advanced-function generate buttons aligned with buyer try-on. */
@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-panel {
    grid-template-columns: 500px minmax(0, 1fr) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-column {
    border-left: 1px solid transparent !important;
    border-right: 1px solid transparent !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-action-row,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .generate-action-row {
    padding-bottom: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .generate-action-row > .generation-concurrency-notice,
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .generate-action-row > .generation-concurrency-notice {
    bottom: -22px !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-bottom-area {
    transform: translateY(6px) !important;
  }

  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #generate {
    min-height: 56px !important;
  }
}

.generation-credit-cost.is-readiness-message {
  display: inline-block !important;
  flex: 0 1 auto;
  min-width: 0;
  max-width: 62%;
  margin-left: 3px;
  overflow: hidden;
  color: inherit;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: 0.84;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] #generate .generation-credit-cost.is-readiness-message,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-try-on"] #mobile-generate .generation-credit-cost.is-readiness-message {
  display: inline-block !important;
}
html[data-industry="pet"] .pet-fashion-settings {
  display: grid;
  gap: 18px;
}

html[data-industry="pet"] .pet-fashion-setting-group {
  display: grid;
  gap: 10px;
}

html[data-industry="pet"] .pet-fashion-setting-label {
  color: var(--text-main, #22222d);
  font-size: 14px;
  font-weight: 700;
}

/* 商品主图：展示内容、背景风格和构图方式分别决策，避免把内容方式误当成图片风格。 */
/* 保留宠物端的独立选择器契约；实际样式由下方宠物/美妆共享选择器统一维护。 */
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-basic-selects {}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-fashion-settings ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-fashion-settings {
  gap: 14px;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .settings-column,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .settings-column,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .settings-column button,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .settings-column button,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .settings-column textarea,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .settings-column textarea,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .settings-column input,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .settings-column input,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .settings-column select,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .settings-column select,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .settings-column summary ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .settings-column summary {
  font-family: Inter, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif !important;
  font-synthesis: none;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] #settings-title ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] #settings-title {
  font-size: 17px;
  font-weight: 600;
  letter-spacing: 0;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] #settings-card ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] #settings-card {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] #settings-card::before,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] #settings-card::before,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] #settings-card::after,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] #settings-card::after,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] #settings-card > .settings-head ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] #settings-card > .settings-head {
  display: none !important;
}

/* The product-type summary sits at the very top of this clipped scroll area.
   Keep enough headroom for its hover lift and focus halo. */
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-scroll-area ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-scroll-area {
  padding-top: 6px !important;
  scroll-padding-top: 6px;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-fashion-setting-label ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-fashion-setting-label {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] {
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(103, 84, 218, 0.18);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(247, 246, 255, 0.96), rgba(255, 255, 255, 0.98));
  box-shadow: 0 8px 22px rgba(66, 52, 135, 0.05);
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .pet-fashion-setting-label ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .pet-fashion-setting-label {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #2f2a3e;
  font-size: 15px;
  font-weight: 600;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .pet-fashion-setting-label::after ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .pet-fashion-setting-label::after {
  content: "必选";
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(111, 89, 242, 0.1);
  color: #6652dc;
  font-size: 10px;
  font-weight: 500;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-grid ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button {
  min-height: 36px;
  padding: 7px 8px;
  border-color: transparent;
  border-radius: 10px;
  background: #f6f7fb;
  box-shadow: none;
  color: #6d6b7c;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.35;
  text-align: center;
  align-content: center;
  justify-items: center;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button:hover ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button:hover {
  border-color: rgba(112, 91, 239, 0.24);
  background: #f1efff;
  color: #5545c8;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button.selected ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button.selected {
  border-color: rgba(111, 89, 242, 0.46);
  background: #f0edff;
  box-shadow: inset 0 0 0 1px rgba(111, 89, 242, 0.06);
  color: #5947d2;
  font-weight: 500;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-main-product-type-row ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-main-product-type-row {
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  position: relative !important;
  z-index: auto !important;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="displayContent"] ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="displayContent"] {
  gap: 10px;
  padding: 13px;
  border: 1px solid rgba(104, 84, 224, 0.2);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(248, 247, 255, 0.96), rgba(255, 255, 255, 0.98));
  box-shadow: 0 10px 28px rgba(69, 53, 145, 0.06);
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="displayContent"] .pet-fashion-setting-label ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="displayContent"] .pet-fashion-setting-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  color: #292437;
  font-size: 15px;
  font-weight: 600;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="displayContent"] .choice-grid ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="displayContent"] .choice-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-main-type-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-main-type-button {
  position: relative;
  min-height: 42px;
  padding: 7px 22px;
  border-color: rgba(83, 74, 124, 0.16);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 3px 10px rgba(39, 31, 78, 0.035);
  color: #2d2938;
  text-align: center;
  align-content: center;
  justify-items: center;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-main-type-button strong ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-main-type-button strong {
  display: block;
  width: 100%;
  text-align: center;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-main-type-button:hover ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-main-type-button:hover {
  border-color: rgba(111, 89, 242, 0.42);
  transform: translateY(-1px);
  box-shadow: 0 7px 18px rgba(69, 53, 145, 0.08);
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-main-type-button.selected ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-main-type-button.selected {
  border-color: #7059f2;
  background: linear-gradient(145deg, #f0edff, #faf9ff);
  box-shadow: inset 0 0 0 1px rgba(112, 89, 242, 0.1), 0 7px 18px rgba(78, 59, 180, 0.1);
  color: #4934c7;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-main-type-button.selected::after ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-main-type-button.selected::after {
  content: "✓";
  position: absolute;
  top: 7px;
  right: 7px;
  display: grid;
  width: 16px;
  height: 16px;
  place-items: center;
  border-radius: 50%;
  background: #7059f2;
  color: #fff;
  font-size: 9px;
  font-weight: 800;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"],
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"],
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] {
  gap: 7px;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-grid,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-grid,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-grid ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-grid {
  gap: 4px;
  padding: 4px;
  border-radius: 13px;
  background: #f3f4f8;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-grid ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-grid ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-button,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-button,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-button {
  min-height: 36px;
  padding: 7px 9px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  box-shadow: none;
  color: #706d7b;
  font-size: 12.5px;
  font-weight: 500;
  text-align: center;
  align-content: center;
  justify-items: center;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-button.selected,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-button.selected,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-button.selected ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-button.selected {
  background: #fff;
  box-shadow: 0 3px 10px rgba(45, 37, 83, 0.1);
  color: #5b47d7;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] {
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid rgba(98, 87, 165, 0.1);
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] .choice-grid ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] .choice-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] .choice-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] .choice-button {
  min-height: 39px;
  padding: 7px 9px;
  border-radius: 11px;
  background: #fff;
  box-shadow: none;
  color: #615e6d;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.35;
  text-align: center;
  align-content: center;
  justify-items: center;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] .choice-button.selected ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] .choice-button.selected {
  border-color: #7059f2;
  background: #f1eeff;
  color: #513bd0;
  font-weight: 500;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .extra-prompt-box > span ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .extra-prompt-box > span {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] #extra-prompt ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] #extra-prompt {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] #extra-prompt::placeholder ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] #extra-prompt::placeholder {
  color: #91909a;
  font-weight: 400;
  opacity: 1;
}

html[data-theme="dark"][data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button,
html[data-theme="dark"]:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button,
html[data-theme="dark"][data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-grid,
html[data-theme="dark"]:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-grid,
html[data-theme="dark"][data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-grid ,
html[data-theme="dark"]:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-grid {
  background: rgba(255, 255, 255, 0.055);
}

html[data-theme="dark"][data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="displayContent"] ,
html[data-theme="dark"]:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="displayContent"] {
  background: linear-gradient(145deg, rgba(112, 89, 242, 0.1), rgba(255, 255, 255, 0.025));
}

/* The global visual theme intentionally paints every selected choice purple.
   Product main image needs a stricter hierarchy, so only the primary decision
   keeps that strong treatment; supporting controls use quiet selected states. */
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button {
  border-color: rgba(103, 92, 150, 0.13) !important;
  background-color: rgba(255, 255, 255, 0.86) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #6d6b7c !important;
  transform: none !important;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button:hover,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button:hover,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button.selected ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-button.selected {
  border-color: rgba(111, 89, 242, 0.62) !important;
  background-color: #eeeaff !important;
  box-shadow: inset 0 0 0 1px rgba(111, 89, 242, 0.08) !important;
  color: #5947d2 !important;
  transform: none !important;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-main-type-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-main-type-button {
  border-color: rgba(83, 74, 124, 0.16) !important;
  background-color: rgba(255, 255, 255, 0.94) !important;
  box-shadow: 0 3px 10px rgba(39, 31, 78, 0.035) !important;
  color: #2d2938 !important;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-main-type-button:hover ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-main-type-button:hover {
  border-color: rgba(111, 89, 242, 0.42) !important;
  box-shadow: 0 7px 18px rgba(69, 53, 145, 0.08) !important;
  transform: translateY(-1px) !important;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .pet-main-type-button.selected ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .pet-main-type-button.selected {
  border-color: #7059f2 !important;
  background-color: #7059f2 !important;
  background-image: linear-gradient(135deg, #7059f2, #5a43dd) !important;
  box-shadow: 0 8px 20px rgba(82, 61, 196, 0.2) !important;
  color: #fff !important;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-button,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-button,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-button {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #706d7b !important;
  transform: none !important;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-button:hover,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-button:hover,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-button:hover ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-button:hover {
  background-color: rgba(255, 255, 255, 0.66) !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-button.selected,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petPresence"] .choice-button.selected,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-button.selected ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSource"] .choice-button.selected {
  border-color: transparent !important;
  background-color: #fff !important;
  background-image: none !important;
  box-shadow: 0 3px 10px rgba(45, 37, 83, 0.1) !important;
  color: #5b47d7 !important;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] .choice-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] .choice-button {
  box-shadow: none !important;
  transform: none !important;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] .choice-button:hover,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] .choice-button:hover,
html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] .choice-button.selected ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="ratio"] .choice-button.selected {
  border-color: #7059f2 !important;
  background-color: #f1eeff !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #513bd0 !important;
  transform: none !important;
}

@media (max-width: 760px) {
  html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-grid ,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="category"] .choice-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-industry="food"] body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="displayContent"] .choice-grid ,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] [data-pet-setting-key="displayContent"] .choice-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] :is(
  [data-pet-setting-key="backgroundMode"],
  [data-pet-setting-key="layoutMode"]
) {
  gap: 8px;
  padding: 11px 12px;
  border: 1px solid rgba(103, 92, 150, 0.12);
  border-radius: 14px;
  background: rgba(249, 249, 252, 0.88);
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] :is(
  [data-pet-setting-key="backgroundMode"],
  [data-pet-setting-key="layoutMode"]
) .choice-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] :is(
  [data-pet-setting-key="backgroundMode"],
  [data-pet-setting-key="layoutMode"]
) .choice-button {
  min-height: 38px;
  padding: 7px 8px;
  border-color: rgba(103, 92, 150, 0.13) !important;
  border-radius: 10px;
  background: #fff !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #676473 !important;
  font-size: 12.5px;
  font-weight: 500;
  transform: none !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] :is(
  [data-pet-setting-key="backgroundMode"],
  [data-pet-setting-key="layoutMode"]
) .choice-button:hover,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] :is(
  [data-pet-setting-key="backgroundMode"],
  [data-pet-setting-key="layoutMode"]
) .choice-button.selected {
  border-color: rgba(111, 89, 242, 0.5) !important;
  background: #f1eeff !important;
  color: #513bd0 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .extra-prompt-box ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .extra-prompt-box {
  position: relative !important;
  gap: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .extra-prompt-box::before ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .extra-prompt-box::before {
  display: none !important;
}

.pet-product-main-copy-inline-actions {
  display: contents;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .extra-prompt-box > #extra-prompt-label ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .extra-prompt-box > #extra-prompt-label {
  min-height: 28px !important;
  padding-right: 0 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-inline-actions ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-inline-actions {
  position: absolute;
  right: 14px;
  bottom: 18px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  max-width: calc(100% - 28px);
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switches ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switches {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switches[hidden] ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switches[hidden] {
  display: none !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100px;
  height: 28px;
  min-height: 28px;
  flex: 0 0 100px;
  box-sizing: border-box;
  padding: 0 8px;
  border: 1px solid rgba(108, 93, 246, 0.24);
  border-radius: 999px;
  color: #6658e9;
  background: rgba(247, 245, 255, 0.96);
  box-shadow: 0 5px 12px rgba(108, 93, 246, 0.08);
  font: inherit;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: color 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch b ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch b {
  color: inherit;
  font: inherit;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch i ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch i {
  position: relative;
  width: 26px;
  height: 16px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: #c9cfe0;
  transition: background 0.18s ease;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch i::after ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch i::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(28, 35, 54, 0.22);
  transition: transform 0.18s ease;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch.selected ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch.selected {
  border-color: #6c5df6;
  color: #fff;
  background: #6c5df6;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch.selected i ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch.selected i {
  background: rgba(255, 255, 255, 0.32);
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch.selected i::after ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch.selected i::after {
  transform: translateX(10px);
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-no-text-switch ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-no-text-switch {
  color: #6658e9;
  background: rgba(247, 245, 255, 0.96);
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-no-text-switch.selected ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-no-text-switch.selected {
  border-color: #6c5df6;
  color: #fff;
  background: #6c5df6;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch:hover:not(:disabled) ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch:hover:not(:disabled) {
  border-color: #6c5df6;
  color: #fff;
  background: #6c5df6;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch:disabled ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-switch:disabled {
  opacity: 0.48;
  cursor: not-allowed;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #extra-prompt ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #extra-prompt {
  min-height: 112px !important;
  padding: 13px 14px 56px !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #extra-prompt:disabled ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #extra-prompt:disabled {
  color: #9295a4 !important;
  background: #f7f7fb !important;
  cursor: not-allowed !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .prompt-optimize-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .prompt-optimize-button {
  position: static !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  width: 100px !important;
  height: 28px !important;
  min-height: 28px !important;
  flex: 0 0 100px !important;
  box-sizing: border-box !important;
  padding: 0 8px !important;
  border: 1px solid rgba(108, 93, 246, 0.24) !important;
  border-radius: 999px !important;
  color: #6658e9 !important;
  background: rgba(247, 245, 255, 0.96) !important;
  box-shadow: 0 5px 12px rgba(108, 93, 246, 0.08) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .prompt-optimize-button .lucide ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .prompt-optimize-button .lucide {
  width: 12px !important;
  height: 12px !important;
  stroke-width: 2.2 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .prompt-optimize-button span ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .prompt-optimize-button span {
  color: inherit !important;
  font: inherit !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #task-panel #prompt-optimize-button > span ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #task-panel #prompt-optimize-button > span {
  display: block !important;
  align-items: initial !important;
  min-height: 0 !important;
  color: inherit !important;
  font-family: inherit !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html[data-industry="food"] body[data-active-feature="pet-product-main-image"] .detail-style-preset-panel ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] .detail-style-preset-panel {
  display: grid !important;
  gap: 7px !important;
  padding-top: 4px !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-style-preset-grid ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-style-preset-grid {
  gap: 7px !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-toggle ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-toggle {
  grid-column: 1 / -1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  gap: 5px;
  width: 138px;
  height: 30px;
  margin: 10px 0 2px;
  padding: 0 13px;
  border: 1px solid rgba(119, 99, 246, 0.26);
  border-radius: 999px;
  color: #6f58ee;
  background: rgba(248, 246, 255, 0.96);
  box-shadow: 0 5px 14px rgba(93, 72, 213, 0.09);
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-toggle:hover ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-toggle:hover {
  border-color: rgba(101, 79, 242, 0.48);
  color: #563de5;
  background: #fff;
  box-shadow: 0 7px 17px rgba(93, 72, 213, 0.14);
  transform: translateY(-1px);
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-toggle:focus-visible ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-toggle:focus-visible {
  outline: 3px solid rgba(111, 88, 238, 0.2);
  outline-offset: 3px;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-toggle > .lucide ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-toggle > .lucide {
  width: 14px;
  height: 14px;
  stroke-width: 2.35;
  transition: transform 0.2s ease;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-toggle[aria-expanded="true"] > .lucide ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-toggle[aria-expanded="true"] > .lucide {
  transform: rotate(180deg);
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-options ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-options {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 10px;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-options[hidden] ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-style-preset-options[hidden] {
  display: none !important;
}

/* Pet product main: mirror the compact reference layout used by the detail
   style picker. This is presentation-only; preset ids and click handlers stay
   unchanged. */
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .detail-style-preset-grid ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .detail-style-preset-grid {
  grid-template-columns: minmax(0, 1fr);
  gap: 10px !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .detail-style-official-library-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .detail-style-official-library-button {
  grid-column: 1 / -1;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) 14px;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: 64px;
  min-height: 64px;
  margin: 0 !important;
  padding: 9px 14px 9px 11px;
  border-radius: 16px;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .detail-style-official-library-button .background-official-material-icon ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .detail-style-official-library-button .background-official-material-icon {
  width: 32px;
  height: 32px;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always {
  grid-column: 1 / -1;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin: 0;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-button {
  width: 100%;
  height: 68px;
  min-height: 68px;
  padding: 8px 10px;
}

/* The compact product-main cards already expose their guidance as visible
   subtitles. Suppress the legacy detail-page tooltip here so it cannot spill
   outside the two-column preset panel or cover neighboring choices. */
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-button[data-detail-style-tip]::before,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-button[data-detail-style-tip]::before,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-button[data-detail-style-tip]::after ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-button[data-detail-style-tip]::after {
  display: none !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-auto ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-auto {
  grid-column: auto !important;
  grid-template-columns: 36px minmax(0, 1fr) 36px !important;
  column-gap: 6px !important;
  row-gap: 3px !important;
  text-align: center;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .prompt-optimize-button:hover:not(:disabled) ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .prompt-optimize-button:hover:not(:disabled) {
  border-color: #6c5df6 !important;
  color: #fff !important;
  background: #6c5df6 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .prompt-optimize-button:disabled ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .prompt-optimize-button:disabled {
  opacity: 0.72 !important;
  cursor: wait !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .prompt-optimize-button.is-busy .lucide ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .prompt-optimize-button.is-busy .lucide {
  animation: detail-preview-spin 1.1s linear infinite !important;
}

@media (max-width: 520px) {
  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-auto ,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-auto {
    grid-template-columns: 30px minmax(0, 1fr) 30px !important;
    column-gap: 3px !important;
    padding: 8px 6px !important;
  }

  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-auto .detail-style-recommend-badge ,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-auto .detail-style-recommend-badge {
    min-width: 28px !important;
    height: 18px !important;
    padding: 0 4px !important;
    font-size: 9px !important;
  }

  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-auto > span ,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .pet-product-main-style-preset-options-always .detail-style-preset-auto > span {
    font-size: 11.5px !important;
  }

  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .extra-prompt-box > #extra-prompt-label ,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .extra-prompt-box > #extra-prompt-label {
    padding-right: 0 !important;
  }

  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-inline-actions ,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-inline-actions {
    right: 10px;
    bottom: 12px;
    gap: 3px;
    max-width: calc(100% - 20px);
  }

  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] :is(
    .pet-product-main-copy-switch,
    .prompt-optimize-button
  ) {
    width: 88px !important;
    flex-basis: 88px !important;
  }

  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body[data-active-feature="pet-product-main-image"] :is(
    [data-pet-setting-key="backgroundMode"],
    [data-pet-setting-key="layoutMode"]
  ) .choice-grid {
    grid-template-columns: 1fr;
  }
}

/* Pet and beauty detail labels are longer than the fashion equivalents. Keep every option
   readable inside the 500px detail workbench instead of clipping or overflowing. */
:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-basic-select-card {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  position: relative !important;
  z-index: 300 !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-basic-select-card [data-detail-select="age"],
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-basic-select-card [data-detail-select="age"] {
  display: none !important;
}

/* 宠物详情页与商品主图：人工商品名称只校正商品身份，上传图片继续控制外观事实。 */
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .upload-card-wrap,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .upload-card-wrap ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .upload-card-wrap {
  grid-template-rows: auto auto !important;
  gap: 0 !important;
  height: auto !important;
  border: 1px dashed rgba(123, 99, 244, 0.24) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: 0 8px 22px rgba(75, 59, 143, 0.045) !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .upload-card-wrap > #product-upload,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .upload-card-wrap > #product-upload ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .upload-card-wrap > #product-upload {
  height: auto !important;
  border: 0 !important;
  border-radius: 17px 17px 0 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-field,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .pet-detail-product-name-field ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-field {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  width: 100%;
  margin-top: 0;
  padding: 8px 12px 12px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* Pet and Beauty detail pages: use one compact vertical rhythm between every direct
 * workbench section instead of stacking the column gap and local margins. */
:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-column {
  row-gap: 0 !important;
  align-content: start !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] :is(
  .detail-page-basic-selects,
  .detail-page-module-picker,
  .detail-reference-materials
) {
  margin-top: 12px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-picker {
  position: relative !important;
  margin-top: 12px !important;
  padding-top: 16px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-picker::before {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  content: "";
  height: 1px;
  background: rgba(145, 149, 162, 0.24);
  pointer-events: none;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading > strong,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading > strong ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading > strong {
  flex: 0 0 auto;
  color: #252b3d;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading > small,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading > small ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading > small {
  flex: 0 0 auto;
  padding: 2px 5px;
  border-radius: 999px;
  color: #7665d8;
  background: rgba(123, 99, 244, 0.09);
  font-size: 9px;
  font-weight: 500;
  line-height: 1.2;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-control,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-control ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-control {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 0 9px;
  border: 1px solid rgba(207, 211, 229, 0.94);
  border-radius: 10px;
  background: #fff;
  transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-control:focus-within,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-control:focus-within ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-control:focus-within {
  border-color: #7b63f4;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(123, 99, 244, 0.11);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-control > .lucide,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-control > .lucide ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-control > .lucide {
  width: 15px;
  height: 15px;
  color: #775df0;
  stroke-width: 1.8;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) #pet-detail-product-name-input,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) #pet-detail-product-name-input ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) #pet-detail-product-name-input {
  width: 100%;
  min-width: 0;
  height: 34px;
  padding: 0;
  border: 0;
  outline: 0;
  color: #2e3346;
  background: transparent;
  font: inherit;
  font-size: 12.5px;
  font-weight: 450;
  line-height: 1.4;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) #pet-detail-product-name-input::placeholder,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) #pet-detail-product-name-input::placeholder ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) #pet-detail-product-name-input::placeholder {
  color: #a4a8b7;
  font-weight: 400;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) #pet-detail-product-name-count,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) #pet-detail-product-name-count ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) #pet-detail-product-name-count {
  color: #9a9fb0;
  font-size: 10px;
  font-weight: 500;
  line-height: 1;
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-control,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-control ,
html[data-theme="dark"]:is([data-industry="beauty"], [data-industry="home"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-control {
  border-color: rgba(142, 119, 255, 0.34);
  background: rgba(28, 30, 45, 0.94);
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .upload-card-wrap,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .upload-card-wrap ,
html[data-theme="dark"]:is([data-industry="beauty"], [data-industry="home"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .upload-card-wrap {
  border-color: rgba(142, 119, 255, 0.3) !important;
  background: rgba(24, 26, 40, 0.78) !important;
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading > strong,
html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) #pet-detail-product-name-input,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading > strong,
html[data-theme="dark"]:is([data-industry="beauty"], [data-industry="home"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading > strong,
html[data-theme="dark"][data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) #pet-detail-product-name-input ,
html[data-theme="dark"]:is([data-industry="beauty"], [data-industry="home"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) #pet-detail-product-name-input {
  color: #f4f3fb;
}

@media (max-width: 760px) {
  html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-field,
  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .pet-detail-product-name-field ,
  html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-field {
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
  }

  html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading,
  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading ,
  html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-name-heading {
    display: inline-flex;
  }
}

/* 商品主图复用宠物详情页的三项紧凑选择栏，位置同样位于上传区下方。 */
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) #pet-main-basic-selects {
  display: none !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] [data-pet-setting-key="language"],
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] [data-pet-setting-key="language"],
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petType"],
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petType"],
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSize"] ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] [data-pet-setting-key="petSize"] {
  display: none !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-basic-selects ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-basic-selects {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 9px !important;
  margin-top: 14px !important;
  position: relative !important;
  z-index: 320 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-basic-selects .detail-basic-select-card ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-basic-selects .detail-basic-select-card {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 9px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  position: relative !important;
  z-index: 320 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-basic-selects .detail-page-select-menu ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-basic-selects .detail-page-select-menu {
  max-height: min(320px, calc(100vh - 150px)) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-basic-selects [data-pet-main-select="petSize"] .detail-page-select-menu ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-basic-selects [data-pet-main-select="petSize"] .detail-page-select-menu {
  right: 0 !important;
  left: auto !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .upload-column:has(#pet-main-basic-selects [data-pet-main-select][open]) ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .upload-column:has(#pet-main-basic-selects [data-pet-main-select][open]) {
  z-index: 30 !important;
  overflow: visible !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-options,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-options {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-row,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-row {
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  position: relative !important;
  z-index: auto !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select {
  width: 100% !important;
  position: relative !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto auto !important;
  align-items: center !important;
  gap: 11px !important;
  min-height: 54px !important;
  padding: 7px 14px 7px 10px !important;
  border: 1px solid transparent !important;
  border-radius: 14px !important;
  color: #30384d !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(249, 247, 255, 0.98)) padding-box,
    linear-gradient(120deg, rgba(121, 94, 255, 0.32), rgba(157, 136, 255, 0.1), rgba(121, 94, 255, 0.28)) border-box !important;
  box-shadow: 0 7px 18px rgba(75, 59, 143, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
  cursor: pointer !important;
  list-style: none !important;
  position: relative !important;
  overflow: hidden !important;
  transform: translateY(0) !important;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary::-webkit-details-marker,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary::-webkit-details-marker ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary::-webkit-details-marker {
  display: none !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary:hover,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary:hover,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary:hover,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary:focus-visible,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary:focus-visible,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary:focus-visible,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > summary,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > summary ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > summary {
  outline: none !important;
  background:
    linear-gradient(180deg, #ffffff, #f5f1ff) padding-box,
    linear-gradient(120deg, #775dff, #a88cff, #6f59f4) border-box !important;
  box-shadow: 0 11px 26px rgba(91, 68, 190, 0.17), 0 0 0 3px rgba(116, 91, 244, 0.07) !important;
  transform: translateY(-2px) !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > summary,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > summary ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > summary {
  box-shadow: 0 7px 18px rgba(75, 59, 143, 0.11), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
  transform: translateY(0) !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-icon,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-icon ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-icon {
  display: grid !important;
  place-items: center !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 11px !important;
  color: #6548e8 !important;
  background: linear-gradient(145deg, #eee9ff, #f8f5ff) !important;
  box-shadow: inset 0 0 0 1px rgba(112, 83, 239, 0.1), 0 4px 10px rgba(91, 65, 184, 0.08) !important;
  animation: pet-detail-select-pulse 2.8s ease-in-out infinite !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-icon .lucide,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-icon .lucide ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-icon .lucide {
  width: 17px !important;
  height: 17px !important;
  stroke-width: 2 !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-copy,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-copy ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-copy {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-copy > small,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-copy > small ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-copy > small {
  color: #7c748e !important;
  font-size: 10.5px !important;
  font-weight: 500 !important;
  line-height: 1.1 !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-copy > strong,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-copy > strong ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-copy > strong {
  min-width: 0 !important;
  overflow: hidden !important;
  color: #2f2944 !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-hint,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-hint ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-hint {
  padding: 4px 8px !important;
  border: 1px solid rgba(111, 80, 233, 0.12) !important;
  border-radius: 999px !important;
  color: #6a4fe5 !important;
  background: rgba(237, 232, 255, 0.82) !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  transition: color 180ms ease, background 180ms ease !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary:hover .pet-detail-product-type-hint,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary:hover .pet-detail-product-type-hint,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary:hover .pet-detail-product-type-hint,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > summary .pet-detail-product-type-hint,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > summary .pet-detail-product-type-hint ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > summary .pet-detail-product-type-hint {
  color: #ffffff !important;
  background: linear-gradient(135deg, #7558f3, #8b6cff) !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary::after,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary::after ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select > summary::after {
  content: "" !important;
  width: 7px !important;
  height: 7px !important;
  margin-top: -4px !important;
  border-right: 1.5px solid #766b98 !important;
  border-bottom: 1.5px solid #766b98 !important;
  transform: rotate(45deg) !important;
  transition: transform 160ms ease !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > summary::after,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > summary::after ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > summary::after {
  margin-top: 4px !important;
  transform: rotate(225deg) !important;
}

@keyframes pet-detail-select-pulse {
  0%, 100% { box-shadow: inset 0 0 0 1px rgba(112, 83, 239, 0.1), 0 4px 10px rgba(91, 65, 184, 0.08); }
  50% { box-shadow: inset 0 0 0 1px rgba(112, 83, 239, 0.18), 0 5px 15px rgba(91, 65, 184, 0.18); }
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu {
  display: none !important;
  grid-template-columns: repeat(var(--pet-product-menu-columns, 2), minmax(0, 1fr)) !important;
  gap: 8px !important;
  position: fixed !important;
  top: var(--pet-product-menu-top, 0) !important;
  left: var(--pet-product-menu-left, 0) !important;
  right: auto !important;
  width: var(--pet-product-menu-width, 440px) !important;
  max-height: var(--pet-product-menu-max-height, 284px) !important;
  margin: 0 !important;
  z-index: 1800 !important;
  padding: 10px !important;
  border: 1px solid rgba(199, 205, 230, 0.95) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.99) !important;
  box-shadow: 0 14px 32px rgba(58, 47, 112, 0.15) !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
}

html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu {
  --pet-product-menu-columns: 3;
  max-height: none !important;
  overflow: visible !important;
  overscroll-behavior: auto !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select:not(.selection-committed):hover > .pet-detail-product-type-menu,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select:not(.selection-committed):hover > .pet-detail-product-type-menu,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select:not(.selection-committed):hover > .pet-detail-product-type-menu,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select:not(.selection-committed):focus-within > .pet-detail-product-type-menu,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select:not(.selection-committed):focus-within > .pet-detail-product-type-menu,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select:not(.selection-committed):focus-within > .pet-detail-product-type-menu,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > .pet-detail-product-type-menu,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > .pet-detail-product-type-menu ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-select[open] > .pet-detail-product-type-menu {
  display: grid !important;
  animation: pet-detail-product-menu-in 150ms ease-out both !important;
}

@keyframes pet-detail-product-menu-in {
  from { opacity: 0; transform: translateY(-4px) scale(0.99); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-icon,
  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-icon,
  html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-icon,
  html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu,
  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu ,
  html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu {
    animation: none !important;
  }
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-select-field summary,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .detail-page-select-field summary,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .detail-page-select-field summary,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-select-field summary strong,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .detail-page-select-field summary strong,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .detail-page-select-field summary strong,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-options button,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .detail-product-type-options button ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .detail-product-type-options button {
  min-width: 0 !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-select-field summary strong,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .detail-page-select-field summary strong ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .detail-page-select-field summary strong {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-product-type-options button,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .detail-product-type-options button ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .detail-product-type-options button {
  min-height: 38px !important;
  padding: 6px 9px !important;
  overflow-wrap: anywhere !important;
  line-height: 1.3 !important;
  white-space: normal !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 9px !important;
  min-height: 46px !important;
  padding: 8px 10px 8px 12px !important;
  border: 1px solid rgba(218, 212, 238, 0.95) !important;
  border-radius: 11px !important;
  color: #4c465b !important;
  background: linear-gradient(180deg, #ffffff, #fbfaff) !important;
  box-shadow: 0 3px 9px rgba(55, 46, 91, 0.045) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  text-align: left !important;
  transform: translateY(0) !important;
  transition: border-color 160ms ease, color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button::after,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button::after ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button::after {
  content: "" !important;
  flex: 0 0 auto !important;
  width: 15px !important;
  height: 15px !important;
  margin-left: auto !important;
  border: 1.5px solid #d4cde9 !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  box-shadow: inset 0 0 0 3px #ffffff !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button:hover,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button:hover,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button:hover,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button:focus-visible,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button:focus-visible ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button:focus-visible {
  outline: none !important;
  border-color: rgba(117, 88, 243, 0.5) !important;
  color: #5d42d5 !important;
  background: linear-gradient(180deg, #ffffff, #f5f1ff) !important;
  box-shadow: 0 7px 16px rgba(94, 69, 188, 0.11) !important;
  transform: translateY(-1px) !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button:hover::after,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button:hover::after,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button:hover::after,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button:focus-visible::after,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button:focus-visible::after ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button:focus-visible::after {
  border-color: #8a70ef !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button.selected,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button.selected ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button.selected {
  border-color: transparent !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #7056e8, #8b70f6) !important;
  box-shadow: 0 8px 18px rgba(104, 77, 214, 0.22) !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button.selected::after,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button.selected::after ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu > button.selected::after {
  content: "✓" !important;
  display: grid !important;
  place-items: center !important;
  border-color: rgba(255, 255, 255, 0.82) !important;
  color: #6d53df !important;
  background: #ffffff !important;
  box-shadow: none !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

@media (max-width: 760px) {
  html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu,
  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu ,
  html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"]) .pet-detail-product-type-menu {
    grid-template-columns: repeat(var(--pet-product-menu-columns, 2), minmax(0, 1fr)) !important;
  }
}

/* 商品主图复用详情图的三槽位上传结构：正面、背面、细节。 */
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) #product-upload ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #product-upload {
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  justify-items: stretch !important;
  min-height: 148px !important;
  padding: 14px !important;
  gap: 12px !important;
  text-align: left !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) #product-upload > #upload-thumb,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #product-upload > #upload-thumb,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) #upload-clear-x ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #upload-clear-x {
  display: none !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) #product-upload .upload-icon ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #product-upload .upload-icon {
  justify-self: start !important;
  width: 42px !important;
  height: 42px !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) #product-upload .upload-copy ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #product-upload .upload-copy {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) #product-upload .upload-copy strong ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #product-upload .upload-copy strong {
  font-size: 15px !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) #product-upload .upload-copy small ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #product-upload .upload-copy small {
  max-width: 190px !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .detail-upload-strip ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-upload-strip {
  display: grid !important;
  grid-template-columns: repeat(3, 68px) !important;
  gap: 9px !important;
  align-items: end !important;
  justify-content: end !important;
  padding-right: 0 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .detail-upload-slot ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-upload-slot {
  display: grid !important;
  grid-template-rows: auto 16px !important;
  justify-items: center !important;
  align-items: start !important;
  gap: 4px !important;
  width: 68px !important;
  min-height: 112px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .detail-upload-slot:hover ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-upload-slot:hover {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .detail-upload-slot-frame ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-upload-slot-frame {
  width: 64px !important;
  height: auto !important;
  aspect-ratio: 3 / 4 !important;
  border: 1px dashed rgba(195, 199, 217, 0.92) !important;
  border-radius: 13px !important;
  background: rgba(247, 248, 252, 0.96) !important;
  box-shadow: none !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .detail-upload-slot.is-filled .detail-upload-slot-frame ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-upload-slot.is-filled .detail-upload-slot-frame {
  border-style: solid !important;
  border-color: rgba(215, 219, 232, 0.95) !important;
  background: #fff !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .detail-upload-slot small ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-upload-slot small {
  width: 100% !important;
  height: 16px !important;
  font-size: 11px !important;
  line-height: 16px !important;
  font-weight: 500 !important;
  color: #697386 !important;
  text-align: center !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .detail-upload-slot:hover .detail-upload-slot-frame ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-upload-slot:hover .detail-upload-slot-frame {
  border-color: rgba(113, 91, 255, 0.72) !important;
  background: #f6f3ff !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .detail-upload-slot.is-dragover ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-upload-slot.is-dragover {
  background: transparent !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .detail-upload-slot.is-dragover::after ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-upload-slot.is-dragover::after {
  inset: -5px 1px 14px !important;
  border-radius: 17px !important;
}

/* 三槽位上传的删除入口必须始终可见；同时覆盖宠物详情图和商品主图。 */
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="pet-product-main-image"]
) .detail-upload-delete,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .detail-upload-delete ,
html:is([data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-upload-delete {
  top: -6px !important;
  right: -4px !important;
  z-index: 8 !important;
  display: grid !important;
  place-items: center !important;
  width: 20px !important;
  height: 20px !important;
  padding: 0 !important;
  border: 1.5px solid #fff !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: rgba(235, 52, 82, 0.96) !important;
  box-shadow: 0 7px 14px rgba(223, 63, 85, 0.24) !important;
  opacity: 1 !important;
  transform: none !important;
  pointer-events: auto !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="pet-product-main-image"]
) .detail-upload-delete .lucide,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .detail-upload-delete .lucide ,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-upload-delete .lucide {
  width: 11px !important;
  height: 11px !important;
  color: #fff !important;
  stroke-width: 3 !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="pet-product-main-image"]
) .detail-upload-slot:hover .detail-upload-delete,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="detail-page"],
  [data-active-feature="pet-product-main-image"]
) .detail-upload-delete:focus-visible,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .detail-upload-slot:hover .detail-upload-delete,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-upload-slot:hover .detail-upload-delete,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .detail-upload-delete:focus-visible ,
html[data-industry="beauty"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-upload-delete:focus-visible {
  background: #df3f55 !important;
  transform: translateY(-1px) scale(1.04) !important;
}

/* 宠物商品主图：比例独立为第一行，三项与下方三列控制等宽。 */
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .settings-bottom-area ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: auto auto auto !important;
  gap: 10px !important;
  padding: 0 !important;
  overflow: visible !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] {
  display: grid !important;
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  gap: 7px !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-grid ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button {
  width: 100% !important;
  min-height: 42px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  font-size: 0 !important;
  line-height: 1 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button::before ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button::before {
  color: #504b62;
  font-family: Inter, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.02em;
  line-height: 16px;
  flex: 0 0 auto;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button::after ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button::after {
  content: "";
  display: block;
  box-sizing: border-box;
  border: 1.5px solid #a7a2b5;
  border-radius: 3px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(237, 234, 247, 0.7));
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.62);
  flex: 0 0 auto;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button[data-pet-option-value="1:1"]::before ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button[data-pet-option-value="1:1"]::before {
  content: "1:1";
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button[data-pet-option-value="3:4"]::before ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button[data-pet-option-value="3:4"]::before {
  content: "3:4";
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button[data-pet-option-value="9:16"]::before ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button[data-pet-option-value="9:16"]::before {
  content: "9:16";
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button[data-pet-option-value="1:1"]::after ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button[data-pet-option-value="1:1"]::after {
  width: 21px;
  height: 21px;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button[data-pet-option-value="3:4"]::after ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button[data-pet-option-value="3:4"]::after {
  width: 17px;
  height: 23px;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button[data-pet-option-value="9:16"]::after ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button[data-pet-option-value="9:16"]::after {
  width: 13px;
  height: 23px;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button.selected::before ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button.selected::before {
  color: #5d43dc;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button.selected::after ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"] .choice-button.selected::after {
  border-color: #6b51e6;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(235, 229, 255, 0.92));
  box-shadow: 0 2px 5px rgba(96, 70, 220, 0.13), inset 0 0 0 1px rgba(255, 255, 255, 0.8);
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > .generate-count-box,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > .generate-count-box,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > .generate-action-row ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > .generate-action-row {
  display: contents !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area #inline-model-section ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area #inline-model-section {
  grid-column: 1 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area .generate-count-section ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area .generate-count-section {
  grid-column: 2 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area .generation-resolution-section ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area .generation-resolution-section {
  grid-column: 3 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area .generate-action-row > :is(.detail-bottom-options, .video-bottom-options, .generation-concurrency-notice) ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area .generate-action-row > :is(.detail-bottom-options, .video-bottom-options, .generation-concurrency-notice) {
  display: none !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area #generate ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area #generate {
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
  width: 100% !important;
}

@media (max-width: 760px) {
  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area ,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: none !important;
  }

  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"],
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area > [data-pet-setting-key="ratio"],
  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area #inline-model-section,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area #inline-model-section,
  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area .generate-count-section,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area .generate-count-section,
  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area .generation-resolution-section,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area .generation-resolution-section,
  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area #generate ,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area #generate {
    grid-column: 1 !important;
    grid-row: auto !important;
  }
}

/* Pet, beauty, and food detail pages share the same desktop workstation geometry as the other core generators. */
@media (min-width: 981px) {
  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .content-grid {
    height: calc(100vh - 64px) !important;
    max-height: calc(100vh - 64px) !important;
    padding-top: 32px !important;
  }

  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-panel {
    grid-template-columns: 500px minmax(0, 1fr) !important;
    column-gap: 28px !important;
    overflow: hidden !important;
  }

  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-body:not([hidden]) .upload-column,
  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-column {
    border-left: 1px solid transparent !important;
    border-right: 1px solid transparent !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    overflow-x: hidden !important;
  }

  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-column::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
  }
}

/* Prevent a moved main-image ratio control from flashing on sibling feature pages. */
html[data-industry="pet"] body:not([data-active-feature="pet-product-main-image"]) .settings-bottom-area > [data-pet-main-image-ratio-section] {
  display: none !important;
}

/* Homepage cards: remove the nested media frame and let imagery meet the card edges. */
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card {
  grid-template-rows: auto minmax(0, 1fr);
  gap: 10px;
  min-height: 238px;
  padding: 14px 0 0;
  overflow: hidden;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card .feature-head {
  margin: 0 14px;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card .card-media {
  width: 100%;
  height: 100%;
  min-height: 178px;
  aspect-ratio: auto;
  border: 0 !important;
  border-radius: 0 !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card .card-media img {
  display: block;
  width: 100%;
  height: 100%;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(1),
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(2),
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(3),
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(4),
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(5),
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(6),
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-card:nth-child(7) {
  grid-template-rows: auto !important;
  gap: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-visual {
  height: auto !important;
  padding-top: 14px;
  overflow: hidden !important;
  border-radius: inherit !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-chip {
  margin-left: 14px;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-title {
  margin-right: 14px;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-main-img {
  align-self: auto;
  height: auto !important;
  min-height: 0;
  aspect-ratio: 16 / 9 !important;
  border: 0 !important;
  border-radius: 0 !important;
}

/* Homepage cards stay visually blank until their configured image has decoded.
   Static HTML images are structural fallbacks only and must never flash first. */
.function-card[data-feature] .card-media img,
.advanced-card[data-feature] .advanced-main-img {
  opacity: 0 !important;
}

.function-card[data-feature] .card-media img[data-feature-card-image-state="ready"],
.advanced-card[data-feature] .advanced-main-img[data-feature-card-image-state="ready"] {
  opacity: 1 !important;
}

/* Fashion homepage cards: polish the title row only; keep the imagery untouched. */
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card {
  gap: 0;
  padding-top: 0;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card .feature-head {
  position: relative;
  width: 100%;
  min-height: 48px;
  margin: 0;
  padding: 10px 14px;
  background:
    radial-gradient(circle at 8% 0%, rgba(145, 116, 255, 0.18), transparent 34%),
    linear-gradient(100deg, rgba(245, 240, 255, 0.98) 0%, rgba(250, 247, 255, 0.96) 42%, rgba(245, 249, 255, 0.96) 100%);
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card .feature-head::before {
  display: none;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card .feature-icon,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card .feature-icon.purple,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card .feature-icon.mint,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card .feature-icon.blue,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card .feature-icon.green,
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card .feature-icon.rainbow {
  border-color: rgba(131, 108, 242, 0.2) !important;
  color: #705ee2 !important;
  background: rgba(244, 241, 255, 0.94) !important;
  box-shadow: 0 5px 12px rgba(101, 79, 202, 0.09) !important;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card .feature-head strong {
  color: #292c3e;
  font-weight: 650;
  letter-spacing: 0.01em;
}

body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .basic-board .function-card .feature-head small {
  min-height: 22px;
  padding: 0 8px;
  border: 1px solid rgba(134, 112, 238, 0.12);
  color: #6757cf !important;
  background: rgba(243, 239, 255, 0.82) !important;
}

/* Keep the advanced-card heading area consistent with the full-width gradient above. */
body:not(.feature-focus-mode):not(.library-focus-mode):not(.works-focus-mode) .advanced-board .advanced-visual {
  background:
    radial-gradient(circle at 8% 0%, rgba(145, 116, 255, 0.18), transparent 34%),
    linear-gradient(100deg, rgba(245, 240, 255, 0.98) 0%, rgba(250, 247, 255, 0.96) 42%, rgba(245, 249, 255, 0.96) 100%) !important;
}

/* Keep the workbench brand mark identical across every feature and empty state. */
body.feature-showcase-mode.feature-focus-mode.workstation-feature-mode[data-active-feature]
  .preview-frame
  .feature-image-showcase-board
  .set-preview-board-head
  > .feature-image-showcase-logo,
.feature-image-showcase-board .set-preview-board-head > .feature-image-showcase-logo {
  width: 124px !important;
  height: 20px !important;
  min-width: 124px !important;
  min-height: 20px !important;
  max-width: 124px !important;
  max-height: 20px !important;
  object-fit: contain !important;
  object-position: left center !important;
  transform: translateY(-50%) !important;
}

/* Official materials are a modal surface on phones because the desktop preview column is hidden. */
@media (max-width: 760px) {
  body.official-material-drawer-open {
    overflow: hidden !important;
  }

  body.official-material-drawer-open .mobile-bottom-nav {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="background"],
    [data-active-feature="flat-lay"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="pet-product-main-image"]
  ) .preview-column {
    position: fixed !important;
    inset: 0 !important;
    z-index: 240 !important;
    display: block !important;
    width: 100vw !important;
    height: 100dvh !important;
    min-height: 0 !important;
    overflow: visible !important;
    pointer-events: none !important;
    transform: none !important;
  }

  body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="background"],
    [data-active-feature="flat-lay"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="pet-product-main-image"]
  ) .preview-card,
  body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="background"],
    [data-active-feature="flat-lay"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="pet-product-main-image"]
  ) .detail-page-latest-panel {
    position: static !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: visible !important;
    pointer-events: none !important;
    contain: none !important;
    transform: none !important;
  }

  body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="background"],
    [data-active-feature="flat-lay"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="pet-product-main-image"]
  ) .wrinkle-latest-panel {
    display: none !important;
  }

  body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="background"],
    [data-active-feature="flat-lay"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="pet-product-main-image"]
  ) .official-material-layer,
  body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="background"],
    [data-active-feature="flat-lay"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="pet-product-main-image"]
  ) .official-material-layer.is-open {
    position: fixed !important;
    inset: 0 !important;
    z-index: 241 !important;
    display: block !important;
    width: 100vw !important;
    height: 100dvh !important;
    overflow: hidden !important;
    background: rgba(31, 35, 52, 0.18);
    pointer-events: auto !important;
  }

  body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="background"],
    [data-active-feature="flat-lay"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="pet-product-main-image"]
  ) .official-material-drawer,
  body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="background"],
    [data-active-feature="flat-lay"],
    [data-active-feature="clothes-on-model"],
    [data-active-feature="free-match"],
    [data-active-feature="pet-product-main-image"]
  ) .official-material-layer.is-open .official-material-drawer {
    position: fixed !important;
    left: 12px !important;
    top: max(12px, env(safe-area-inset-top)) !important;
    bottom: max(12px, env(safe-area-inset-bottom)) !important;
    z-index: 242 !important;
    width: calc(100vw - 24px) !important;
    max-width: none !important;
    padding: 16px 14px !important;
    border-radius: 18px !important;
    transform: none !important;
  }

  body.official-material-drawer-open .official-material-head {
    grid-template-columns: minmax(0, 1fr) 32px;
    gap: 10px;
  }

  body.official-material-drawer-open .official-material-title {
    grid-column: 1;
    grid-row: 1;
  }

  body.official-material-drawer-open .official-material-head > button {
    grid-column: 2;
    grid-row: 1;
    position: relative !important;
    z-index: 2 !important;
    border-color: #d7ddea !important;
    color: #465066 !important;
    background: #f8faff !important;
    box-shadow: 0 4px 12px rgba(42, 51, 82, 0.08) !important;
  }

  body.official-material-drawer-open .official-material-category-row {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: stretch;
    justify-content: flex-start;
  }

  body.official-material-drawer-open .official-material-columns {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  html[data-mobile-workbench="true"]
    body.official-material-drawer-open.feature-showcase-mode.feature-focus-mode.workstation-feature-mode[data-active-feature]
    #task-panel
    .preview-column:has(#preview-image[data-preview-kind="empty"][hidden]) {
    display: block !important;
  }

  html[data-mobile-workbench="true"]
    body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode[data-active-feature]
    #task-panel
    .detail-page-latest-panel {
    display: block !important;
  }
}

/* 反推提示词：结果回填到左侧，右侧展示图固定，生成参数由识图服务端固定。 */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="reverse-prompt"] .extra-prompt-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="reverse-prompt"] #generate-count-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="reverse-prompt"] #inline-model-section {
  display: none !important;
}

body.feature-showcase-mode[data-active-feature="reverse-prompt"] .feature-image-showcase-logo {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="reverse-prompt"] #settings-card {
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="reverse-prompt"] #settings-card .settings-head {
  display: none !important;
}

/* Image generation controls: the model is configured in admin and is not user-selectable. */
body:not([data-active-feature="video-generate"]) #inline-model-section,
body:not([data-active-feature="video-generate"]) .model-selector-wrap,
.free-page-model-setting-row[hidden] {
  display: none !important;
}

/* A single ratio control is shared by every image feature that supports ratios. */
body.has-image-ratio-control #dynamic-settings :is(
  [data-pet-setting-key="ratio"],
  [data-print-extract-ratio-section],
  [data-flat-lay-ratio-section],
  .poster-design-ratio-section,
  .live-sticker-ratio-section,
  .outpaint-preset-grid
),
body.has-image-ratio-control[data-active-feature="detail-page"] .detail-ratio-select,
body.has-image-ratio-control[data-active-feature="outpaint"] #mobile-outpaint-ratio-section {
  display: none !important;
}

body.has-image-ratio-control:not([data-active-feature="free-generate"]) #set-ratio-section:not([hidden]) {
  display: block !important;
}

body.has-image-ratio-control #set-ratio-section .set-ratio-menu {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

@media (min-width: 761px) {
  body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control:not([data-active-feature="video-generate"]):not([data-active-feature="free-generate"]) .settings-bottom-area {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-rows: auto auto !important;
    gap: 12px !important;
    overflow: visible !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control:not([data-active-feature="video-generate"]):not([data-active-feature="free-generate"]) :is(#generate-count-box, .generate-action-row) {
    display: contents !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control:not([data-active-feature="video-generate"]):not([data-active-feature="free-generate"]) #set-ratio-section {
    grid-column: 1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control:not([data-active-feature="video-generate"]):not([data-active-feature="free-generate"]) #generate-count-box > .generate-count-section {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control:not([data-active-feature="video-generate"]):not([data-active-feature="free-generate"]) #generate-count-box > .generation-resolution-section {
    grid-column: 3 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control:not([data-active-feature="video-generate"]):not([data-active-feature="free-generate"]) #generate-count-box.hide-generate-count-section > .generation-resolution-section,
  body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control[data-active-feature="detail-page"] #generate-count-box > .generation-resolution-section {
    grid-column: 2 / -1 !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control[data-active-feature="detail-page"] #generate-count-box > .generate-count-section {
    display: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control[data-active-feature="detail-page"] .detail-bottom-options {
    display: none !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control:not([data-active-feature="video-generate"]):not([data-active-feature="free-generate"]) #generate.create-button.full {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-no-image-ratio-control:not([data-active-feature="video-generate"]) .settings-bottom-area {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: auto auto !important;
    gap: 12px !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-no-image-ratio-control:not([data-active-feature="video-generate"]) :is(#generate-count-box, .generate-action-row) {
    display: contents !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-no-image-ratio-control:not([data-active-feature="video-generate"]) #generate-count-box > .generate-count-section {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-no-image-ratio-control:not([data-active-feature="video-generate"]) #generate-count-box > .generation-resolution-section {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-no-image-ratio-control:not([data-active-feature="video-generate"]) #generate.create-button.full {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
  }
}

@media (max-width: 760px) {
  body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control:not([data-active-feature="video-generate"]) .settings-bottom-area,
  body.feature-focus-mode.workstation-feature-mode.has-no-image-ratio-control:not([data-active-feature="video-generate"]) .settings-bottom-area {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control:not([data-active-feature="video-generate"]) :is(#set-ratio-section, #generate-count-box, .generate-action-row),
  body.feature-focus-mode.workstation-feature-mode.has-no-image-ratio-control:not([data-active-feature="video-generate"]) :is(#generate-count-box, .generate-action-row) {
    grid-column: 1 !important;
    grid-row: auto !important;
    width: 100% !important;
  }
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="reverse-prompt"] #dynamic-settings {
  min-height: 0;
  padding: 0 !important;
  background: transparent !important;
}

/* Reverse prompt is text-only: keep every image output parameter out of its footer. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="reverse-prompt"] #generate-count-box,
body.feature-focus-mode.workstation-feature-mode[data-active-feature="reverse-prompt"] #generate-count-box > .generation-resolution-section {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="reverse-prompt"] .settings-bottom-area {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="reverse-prompt"] #generate.create-button.full {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

.reverse-prompt-result-field {
  position: relative;
  display: block;
  width: 100%;
  min-height: 780px;
}

.reverse-prompt-result-field textarea {
  display: block;
  width: 100%;
  height: 780px;
  min-height: 780px;
  padding: 18px 18px 74px;
  resize: none;
  border: 1px solid rgba(111, 91, 232, 0.22);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.9);
  color: #20223a;
  font: inherit;
  line-height: 1.75;
  outline: none;
  box-sizing: border-box;
}

.reverse-prompt-result-field textarea:focus {
  border-color: rgba(109, 85, 238, 0.58);
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.09);
}

.reverse-prompt-copy-button {
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 80px;
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid rgba(109, 85, 238, 0.28);
  border-radius: 10px;
  background: rgba(247, 245, 255, 0.96);
  color: #6048d8;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

.reverse-prompt-copy-button .lucide {
  width: 15px;
  height: 15px;
}

.reverse-prompt-copy-button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.reverse-prompt-result-card [data-copy-value="body"] {
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.85;
}

@media (max-width: 760px) {
  .reverse-prompt-result-field {
    min-height: 540px;
  }

  .reverse-prompt-result-field textarea {
    height: 540px;
    min-height: 540px;
    padding: 14px 14px 68px;
  }
}

/* 宠物 / 美妆买家秀：共用同一套紧凑设置语言与显示格式。 */
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] #settings-card {
  gap: 13px !important;
  padding: 15px !important;
  border: 1px solid rgba(224, 226, 236, 0.94) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  background-image: none !important;
  box-shadow: 0 10px 28px rgba(42, 44, 63, 0.055) !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] #settings-card > .settings-head {
  min-height: 22px !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] #settings-card > .settings-head strong {
  color: #303441 !important;
  font-size: 17px !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-settings {
  display: grid !important;
  gap: 16px !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-settings .pet-fashion-setting-group {
  gap: 8px !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-settings .pet-fashion-setting-label {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #333746 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.35;
  letter-spacing: 0 !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-settings [data-pet-setting-key="category"] > .pet-fashion-setting-label::after {
  content: "必选";
  padding: 2px 6px;
  border-radius: 999px;
  color: #6b57dc;
  background: #f1efff;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.3;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-settings .choice-grid {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-option-button {
  position: relative;
  display: grid !important;
  grid-template-columns: 30px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 9px !important;
  min-width: 0;
  min-height: 56px !important;
  padding: 8px 10px !important;
  border: 1px solid #e5e6ed !important;
  border-radius: 13px !important;
  color: #333746 !important;
  background: #ffffff !important;
  background-image: none !important;
  text-align: left !important;
  box-shadow: 0 2px 7px rgba(40, 42, 58, 0.025) !important;
  transform: none !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-option-button:hover {
  border-color: #d7d5e8 !important;
  color: #292d3a !important;
  background: #fbfbfe !important;
  box-shadow: 0 5px 14px rgba(58, 52, 92, 0.055) !important;
  transform: none !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-option-button:focus-visible {
  outline: 2px solid rgba(109, 85, 238, 0.34) !important;
  outline-offset: 2px !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-option-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  color: #6b57dc;
  background: #f2f0ff;
  transition: color 160ms ease, background-color 160ms ease;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-option-icon .lucide,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-option-icon > svg {
  width: 15px;
  height: 15px;
  stroke-width: 1.9;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-option-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-option-copy strong {
  overflow: hidden;
  color: inherit !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-option-copy small {
  overflow: hidden;
  color: #858998 !important;
  font-size: 10.5px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-mode-grid .pet-buyer-show-option-copy {
  align-content: center;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-mode-grid .pet-buyer-show-option-copy strong,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-mode-grid .pet-buyer-show-option-copy small {
  overflow-wrap: anywhere;
  text-overflow: clip;
  white-space: normal;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-button.selected,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-button[aria-pressed="true"] {
  border-color: rgba(109, 85, 238, 0.46) !important;
  color: #5540c7 !important;
  background: #f7f5ff !important;
  box-shadow: inset 0 0 0 1px rgba(109, 85, 238, 0.08), 0 4px 12px rgba(86, 69, 181, 0.07) !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-button.selected .pet-buyer-show-option-icon,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-button[aria-pressed="true"] .pet-buyer-show-option-icon {
  color: #ffffff !important;
  background: #6d55ee !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-settings .pet-buyer-show-mode-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 4px !important;
  padding: 4px !important;
  border: 1px solid #e7e8ee !important;
  border-radius: 15px !important;
  background: #f5f5f8 !important;
}


html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-mode-button {
  min-height: 58px !important;
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-mode-button:hover {
  border-color: transparent !important;
  background: rgba(255, 255, 255, 0.58) !important;
  box-shadow: none !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-mode-button.selected,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-mode-button[aria-pressed="true"] {
  border-color: rgba(220, 221, 230, 0.88) !important;
  color: #38324e !important;
  background: #ffffff !important;
  box-shadow: 0 3px 10px rgba(42, 43, 58, 0.09) !important;
}

/* Buyer-show primary mode first; Pet keeps its conditional pet type, Beauty follows with product type. */
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-settings [data-pet-setting-key="showMode"] {
  order: 1;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-settings [data-pet-setting-key="petType"] {
  order: 2;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-pet-type-label {
  justify-content: center;
  min-height: 18px;
  color: #5c5578 !important;
  font-size: 13px !important;
  font-weight: 525 !important;
  line-height: 1.2;
  text-align: center;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-disclosure {
  order: 3;
  min-width: 0;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-pet-type-grid {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 8px !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-pet-type-button {
  flex: 0 1 calc((100% - 24px) / 4);
  display: inline-flex !important;
  height: 38px !important;
  min-width: 0;
  min-height: 38px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 8px !important;
  border: 1px solid #e7e3fb !important;
  border-radius: 10px !important;
  color: #4d5368 !important;
  background: #ffffff !important;
  background-image: none !important;
  font-size: 13px !important;
  font-weight: 525 !important;
  line-height: 1 !important;
  text-align: center !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-pet-type-button:hover {
  border-color: rgba(109, 85, 238, 0.34) !important;
  color: #5c48d2 !important;
  background: #fbfaff !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-pet-type-button:focus-visible {
  outline: 2px solid rgba(109, 85, 238, 0.34) !important;
  outline-offset: 2px !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-pet-type-button.selected,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-pet-type-button[aria-pressed="true"] {
  border-color: rgba(123, 97, 255, 0.7) !important;
  color: var(--purple) !important;
  background: #f7f4ff !important;
  box-shadow: inset 0 0 0 1px rgba(123, 97, 255, 0.14) !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select {
  display: block;
  position: relative;
  width: 100%;
  min-width: 0;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select > summary {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 68px;
  padding: 12px 16px;
  border: 1px solid #dfddec;
  border-radius: 16px;
  color: #302d42;
  background: #ffffff;
  box-shadow: 0 5px 16px rgba(63, 52, 118, 0.055);
  box-sizing: border-box;
  cursor: pointer;
  list-style: none;
  transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select > summary::-webkit-details-marker {
  display: none;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select > summary:hover,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select[open] > summary {
  border-color: rgba(109, 85, 238, 0.38);
  background: #fdfcff;
  box-shadow: 0 7px 18px rgba(63, 52, 118, 0.085);
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select > summary:focus-visible {
  outline: 2px solid rgba(109, 85, 238, 0.34);
  outline-offset: 3px;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-summary-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  color: #654be0;
  background: #f0edff;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-summary-icon .lucide,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-summary-icon > svg {
  width: 19px;
  height: 19px;
  stroke-width: 2;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-summary-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-summary-copy strong {
  color: #302d42;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-summary-copy small {
  overflow: hidden;
  color: #898597;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-summary-chevron {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #8d82b6;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-summary-chevron .lucide,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-summary-chevron > svg {
  width: 18px;
  height: 18px;
  transition: transform 160ms ease;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select[open] .pet-buyer-show-category-summary-chevron .lucide,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select[open] .pet-buyer-show-category-summary-chevron > svg {
  transform: rotate(180deg);
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select > .pet-buyer-show-category-menu {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2200;
  display: none;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  width: 0;
  margin: 0;
  padding: 12px;
  overflow-x: hidden;
  overflow-y: auto;
  visibility: hidden;
  pointer-events: none;
  border: 1px solid rgba(207, 201, 232, 0.96);
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.99);
  box-shadow: 0 16px 36px rgba(58, 47, 112, 0.17);
  box-sizing: border-box;
  overscroll-behavior: contain;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select[open] > .pet-buyer-show-category-menu {
  display: grid;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select[open] > .pet-buyer-show-category-menu[data-positioned="true"] {
  visibility: visible;
  pointer-events: auto;
  animation: pet-detail-product-menu-in 150ms ease-out both;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-choice {
  display: flex;
  min-width: 0;
  min-height: 48px;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  padding: 8px 10px 8px 12px;
  border: 1px solid rgba(218, 212, 238, 0.95);
  border-radius: 11px;
  color: #4c465b;
  background: #ffffff;
  box-shadow: 0 3px 9px rgba(55, 46, 91, 0.045);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.3;
  text-align: left;
  transition: border-color 160ms ease, color 160ms ease, background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-choice::after {
  content: "";
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  margin-left: auto;
  border: 1.5px solid #d4cde9;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: inset 0 0 0 3px #ffffff;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-choice:hover,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-choice:focus-visible {
  outline: none;
  border-color: rgba(117, 88, 243, 0.5);
  color: #5d42d5;
  background: #f7f4ff;
  box-shadow: 0 7px 16px rgba(94, 69, 188, 0.11);
  transform: translateY(-1px);
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-choice.selected,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-choice[aria-checked="true"] {
  border-color: #7659ee;
  color: #ffffff;
  background: #7659ee;
  box-shadow: 0 8px 18px rgba(104, 77, 214, 0.22);
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-choice.selected::after,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-choice[aria-checked="true"]::after {
  content: "✓";
  display: grid;
  place-items: center;
  border-color: rgba(255, 255, 255, 0.82);
  color: #6d53df;
  background: #ffffff;
  box-shadow: none;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
}

@media (max-width: 560px) {
  html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-pet-type-grid {
    display: flex !important;
  }

  html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-pet-type-button {
    flex-basis: calc((100% - 8px) / 2);
  }

  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select > summary {
    grid-template-columns: 36px minmax(0, 1fr) 18px;
    gap: 10px;
    min-height: 62px;
    padding: 10px 12px;
  }

  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-summary-icon {
    width: 36px;
    height: 36px;
  }

  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select > .pet-buyer-show-category-menu {
    gap: 7px;
    padding: 10px;
  }

  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-choice {
    min-height: 46px;
    padding: 8px 9px;
    font-size: 12px;
  }
}

html:is([data-industry="food"], [data-industry="home"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-setting {
  order: 4;
  min-width: 0;
}

/* Jewelry and accessories reveal person controls immediately after buyer-show type. */
html:is([data-industry="jewelry"], [data-industry="accessories"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-setting {
  order: 2;
  min-width: 0;
}

html:is([data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-setting > .pet-fashion-setting-label {
  display: flex;
  align-items: center;
  gap: 6px;
}

html:is([data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-setting > .pet-fashion-setting-label small {
  color: #9290a0;
  font-size: 10.5px;
  font-weight: 400;
}

html:is([data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}

html:is([data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-grid > * {
  min-width: 0;
}

html:is([data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-reference {
  min-height: 68px;
  border-color: #dfddec;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 5px 16px rgba(63, 52, 118, 0.055);
}

html:is([data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-reference .detail-reference-button {
  min-height: 66px;
  padding: 10px 12px;
}

html:is([data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-reference .detail-reference-button > span:last-child {
  min-width: 0;
}

html:is([data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-reference .detail-reference-button strong,
html:is([data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-reference .detail-reference-button small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html:is([data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-type-select.is-locked > summary {
  cursor: default;
  background: #f8f7fb;
}

html:is([data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-type-select.is-locked .pet-buyer-show-category-summary-chevron {
  opacity: 0.35;
}

@media (max-width: 560px) {
  html:is([data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-summary-chevron .lucide,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-summary-chevron > svg,
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-select[open] > .pet-buyer-show-category-menu[data-positioned="true"] {
    transition: none;
    animation: none;
  }
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .extra-prompt-box {
  gap: 9px !important;
  padding: 14px !important;
  border: 1px solid rgba(224, 226, 236, 0.94) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  background-image: none !important;
  box-shadow: 0 10px 28px rgba(42, 44, 63, 0.045) !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .extra-prompt-box::before {
  display: none !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .extra-prompt-box > span {
  min-height: 20px !important;
  color: #333746 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .extra-prompt-box textarea {
  height: 108px !important;
  min-height: 108px !important;
  max-height: 108px !important;
  padding: 13px 14px !important;
  border: 1px solid #e3e4eb !important;
  border-radius: 12px !important;
  color: #343846 !important;
  background: #fafafd !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  box-shadow: none !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .extra-prompt-box textarea::placeholder {
  color: #9295a2 !important;
}

html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .extra-prompt-box textarea:focus {
  border-color: rgba(109, 85, 238, 0.52) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(109, 85, 238, 0.08) !important;
}

@media (max-width: 560px) {
  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-category-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-option-button {
    grid-template-columns: 28px minmax(0, 1fr) !important;
    gap: 7px !important;
    padding-inline: 8px !important;
  }

  html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .pet-buyer-show-option-icon {
    width: 28px;
    height: 28px;
  }
}

/* Detail page has no global quantity card. Keep its two remaining bottom
 * controls on a real two-column grid instead of leaving the old middle slot. */
html body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control[data-active-feature="detail-page"][data-active-feature="detail-page"] .settings-bottom-area {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  column-gap: 12px !important;
}

html body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control[data-active-feature="detail-page"][data-active-feature="detail-page"] #free-bottom-ratio-section {
  grid-column: 1 / 2 !important;
  width: 100% !important;
  min-width: 0 !important;
  justify-self: stretch !important;
}

html body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control[data-active-feature="detail-page"][data-active-feature="detail-page"] #generate-count-box > .generation-resolution-section {
  grid-column: 2 / 3 !important;
  width: 100% !important;
  min-width: 0 !important;
  justify-self: stretch !important;
}

html body.feature-focus-mode.workstation-feature-mode.has-image-ratio-control[data-active-feature="detail-page"][data-active-feature="detail-page"] :is(
  #free-bottom-ratio-section > .mobile-free-ratio-toggle,
  #generate-count-box > .generation-resolution-section > details
) {
  width: 100% !important;
  max-width: none !important;
}

/* Pet, Beauty, and Food detail pages: keep the scrollable form and the bottom action footer in
 * separate grid tracks so expanded style presets can never slide underneath
 * the ratio/resolution controls. */
@media (min-width: 981px) {
  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-panel {
    grid-template-rows: auto minmax(0, 1fr) auto !important;
  }

  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-body:not([hidden]) .upload-column,
  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-column {
    grid-row: 2 / 3 !important;
    padding-bottom: 24px !important;
    scroll-padding-bottom: 24px;
  }

  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-column {
    grid-row: 3 / 4 !important;
    position: relative !important;
    z-index: 130 !important;
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .settings-bottom-area {
    position: relative !important;
    z-index: 131 !important;
    inset: auto !important;
    margin: 0 !important;
    overflow: visible !important;
    transform: none !important;
  }

  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] :is(
    #free-bottom-ratio-section.is-open,
    .generation-resolution-section:has(.print-compact-select[open])
  ) {
    z-index: 132 !important;
  }

  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .preview-column {
    grid-row: 1 / 4 !important;
  }
}

/* The preset disclosure is part of the recommended card, not a floating pill. */
:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-grid {
  row-gap: 0 !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-auto {
  border-bottom-color: rgba(255, 255, 255, 0.18) !important;
  border-radius: 16px 16px 0 0 !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle {
  grid-column: 1 / -1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: stretch;
  gap: 6px;
  width: 100%;
  height: 34px;
  margin: 0;
  padding: 0 16px;
  border: 0;
  border-radius: 0 0 16px 16px;
  color: rgba(255, 255, 255, 0.96);
  background: linear-gradient(90deg, #6650ed, #755cf4);
  box-shadow: 0 10px 20px rgba(91, 70, 218, 0.14);
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: color 0.16s ease, filter 0.16s ease, box-shadow 0.16s ease;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle:hover {
  border-color: transparent;
  color: #fff;
  background: linear-gradient(90deg, #6048e8, #6e54ef);
  box-shadow: 0 11px 22px rgba(91, 70, 218, 0.19);
  transform: none;
  filter: saturate(1.04);
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle:focus-visible {
  outline: 3px solid rgba(111, 88, 238, 0.2);
  outline-offset: 3px;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle > .lucide {
  width: 15px;
  height: 15px;
  stroke-width: 2.35;
  transition: transform 0.2s ease;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-options {
  margin-top: 10px;
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle,
html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle:hover {
  color: #fff;
  background: linear-gradient(90deg, #6650ed, #755cf4);
}

/* Pet detail preset disclosure: retain the original compact pill treatment,
 * with a visible action label instead of an icon-only control. */
:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-auto {
  border-bottom-color: rgba(119, 99, 246, 0.2) !important;
  border-radius: 16px !important;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle {
  justify-self: center;
  gap: 5px;
  width: 138px;
  height: 30px;
  margin: 10px 0 2px;
  padding: 0 13px;
  border: 1px solid rgba(119, 99, 246, 0.26);
  border-radius: 999px;
  color: #6f58ee;
  background: rgba(248, 246, 255, 0.96);
  box-shadow: 0 5px 14px rgba(93, 72, 213, 0.09);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle:hover {
  border-color: rgba(101, 79, 242, 0.48);
  color: #563de5;
  background: #fff;
  box-shadow: 0 7px 17px rgba(93, 72, 213, 0.14);
  transform: translateY(-1px);
  filter: none;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle > .lucide {
  width: 14px;
  height: 14px;
  stroke-width: 2.35;
}

html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle,
html[data-theme="dark"][data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle:hover {
  border-color: rgba(153, 136, 255, 0.38);
  color: #c5b9ff;
  background: rgba(112, 92, 246, 0.15);
}

/* Fashion detail page: flatten the four basic selects and tighten the
 * section rhythm without changing the product-type card itself. */
html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-basic-selects {
  row-gap: 8px !important;
  margin-top: 6px !important;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-basic-select-card {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] :is(
  .detail-page-module-picker,
  .detail-reference-materials
) {
  margin-top: 6px !important;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-picker {
  position: relative !important;
  padding-top: 16px !important;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-picker::before {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  content: "";
  height: 1px;
  background: rgba(145, 149, 162, 0.24);
  pointer-events: none;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-main-basic-selects {
  display: none !important;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-body:not([hidden]) .upload-column,
html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .upload-column {
  padding-bottom: 24px !important;
  scroll-padding-bottom: 24px;
}

/* Fashion detail page: reuse the pet style-preset disclosure, but start open. */
html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-grid {
  row-gap: 0 !important;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-auto {
  border-bottom-color: rgba(119, 99, 246, 0.2) !important;
  border-radius: 16px !important;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle {
  grid-column: 1 / -1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  gap: 5px;
  width: 138px;
  height: 30px;
  margin: 10px 0 2px;
  padding: 0 13px;
  border: 1px solid rgba(119, 99, 246, 0.26);
  border-radius: 999px;
  color: #6f58ee;
  background: rgba(248, 246, 255, 0.96);
  box-shadow: 0 5px 14px rgba(93, 72, 213, 0.09);
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle:hover {
  border-color: rgba(101, 79, 242, 0.48);
  color: #563de5;
  background: #fff;
  box-shadow: 0 7px 17px rgba(93, 72, 213, 0.14);
  transform: translateY(-1px);
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle:focus-visible {
  outline: 3px solid rgba(111, 88, 238, 0.16);
  outline-offset: 2px;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle > .lucide {
  width: 14px;
  height: 14px;
  stroke-width: 2.35;
  transition: transform 0.2s ease;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle[aria-expanded="true"] > .lucide {
  transform: rotate(180deg);
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-options {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 10px;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-options[hidden] {
  display: none !important;
}

html[data-theme="dark"]:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle,
html[data-theme="dark"]:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-toggle:hover {
  border-color: rgba(153, 136, 255, 0.38);
  color: #c5b9ff;
  background: rgba(112, 92, 246, 0.15);
}

/* Fashion, Pet, Beauty, and Food detail pages: keep the official library as the single
   full-width entry, then show every remaining preset in one visible grid. */
:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-preset-auto {
  grid-column: auto !important;
  grid-template-columns: 44px minmax(0, 1fr) 24px !important;
  column-gap: 6px !important;
  width: 100% !important;
  height: 68px !important;
  min-height: 68px !important;
  padding: 8px 10px !important;
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-recommend-badge {
  box-sizing: border-box !important;
  width: 42px !important;
  min-width: 42px !important;
  padding: 0 6px !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-official-library-button {
  grid-column: 1 / -1;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) 14px;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: 64px;
  min-height: 64px;
  margin: 0;
  padding: 9px 14px 9px 11px;
  border: 1px solid rgba(45, 166, 139, 0.36) !important;
  border-radius: 16px;
  color: #176d5d !important;
  background: linear-gradient(135deg, #e7faf4 0%, #f3fcf8 58%, #eaf7ff 100%) !important;
  box-shadow: 0 10px 22px rgba(39, 139, 119, 0.12) !important;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-official-library-button:hover,
:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-official-library-button.is-open {
  border-color: rgba(36, 151, 125, 0.54) !important;
  background: linear-gradient(135deg, #dcf7ee 0%, #effbf6 58%, #e2f4fc 100%) !important;
  box-shadow: 0 14px 28px rgba(39, 139, 119, 0.18) !important;
  transform: translateY(-1px);
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-official-library-button:focus-visible {
  outline: 3px solid rgba(45, 166, 139, 0.18);
  outline-offset: 2px;
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-official-library-button.has-selection {
  border-color: rgba(36, 151, 125, 0.62) !important;
  box-shadow: 0 0 0 3px rgba(39, 169, 141, 0.1), 0 12px 24px rgba(39, 139, 119, 0.16) !important;
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-official-library-button .background-official-material-icon {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 11px;
  color: #fff;
  background: linear-gradient(135deg, #27a98d 0%, #47bda5 100%);
  box-shadow: 0 6px 14px rgba(39, 169, 141, 0.22);
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-official-library-button .background-official-material-icon .lucide,
:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-official-library-button > .lucide {
  width: 17px;
  height: 17px;
  stroke-width: 2.2;
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-official-library-button > .lucide {
  color: #289b83;
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-official-library-button .background-official-material-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-official-library-button .background-official-material-copy strong {
  overflow: hidden;
  color: #135f53;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-style-official-library-button .background-official-material-copy small {
  overflow: hidden;
  color: #50786f;
  font-size: 10.5px;
  font-weight: 500;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .fashion-detail-style-preset-options {
  grid-column: 1 / -1;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 10px;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-options-always {
  grid-column: 1 / -1;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 10px;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-style-preset-options-always[hidden] {
  display: grid !important;
}

:is(html[data-industry="beauty"], html[data-industry="food"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .beauty-detail-style-preset-options-always {
  grid-column: 1 / -1;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 10px;
}

:is(html[data-industry="beauty"], html[data-industry="food"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .beauty-detail-style-preset-options-always[hidden] {
  display: grid !important;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .fashion-detail-style-preset-options[hidden] {
  display: grid !important;
}

/* Product-main and detail-page presentation only: keep every configured preset
   and prompt available to existing logic, while exposing only the two approved
   customer-facing cards. */
body:is([data-active-feature="detail-page"], [data-active-feature="pet-product-main-image"])
  .detail-style-preset-button[data-detail-style-preset]:not([data-detail-style-preset=""]):not([data-detail-style-preset="minimal-premium"]) {
  display: none !important;
}
:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode .detail-style-preset-button.is-cross-border-preset {
  height: 68px;
  min-height: 68px;
  gap: 3px;
  padding: 8px 10px !important;
  border-color: rgba(45, 166, 139, 0.3);
  background: linear-gradient(180deg, rgba(239, 251, 247, 0.94), rgba(255, 255, 255, 0.92));
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode .detail-style-preset-button.is-cross-border-preset:hover {
  border-color: rgba(36, 151, 125, 0.48);
  box-shadow: 0 8px 18px rgba(39, 139, 119, 0.11);
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode .detail-style-preset-button.is-cross-border-preset.selected {
  border-color: rgba(112, 92, 246, 0.72);
  background: linear-gradient(135deg, #705cf6, #8d74ff);
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode .detail-style-cross-border-badge {
  position: absolute;
  top: 7px;
  right: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 18px;
  padding: 0 8px;
  border-radius: 999px;
  color: #197460;
  background: rgba(214, 247, 237, 0.95);
  font-size: 9.5px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

:is(html:not([data-industry]), html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode .detail-style-preset-button.is-cross-border-preset.selected .detail-style-cross-border-badge {
  color: #6650e9;
  background: rgba(255, 255, 255, 0.92);
}

/* The Fashion, Pet, Beauty, and Food detail-page official-library drawer lives in the preview
   surface. Detail previews normally clip overflow, so release it while open. */
:is(html:not([data-industry]), html[data-industry="pet"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-panel,
:is(html[data-industry="beauty"], html[data-industry="food"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-latest-panel {
  position: relative !important;
}

:is(html:not([data-industry]), html[data-industry="pet"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-layer,
:is(html[data-industry="beauty"], html[data-industry="food"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-layer {
  inset: 0 auto 0 -38px !important;
  width: 0 !important;
  z-index: 12 !important;
  overflow: visible !important;
  pointer-events: none !important;
}

:is(html:not([data-industry]), html[data-industry="pet"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-layer.is-open,
:is(html[data-industry="beauty"], html[data-industry="food"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-layer.is-open {
  width: calc(100% + 38px) !important;
  pointer-events: auto !important;
}

:is(html:not([data-industry]), html[data-industry="pet"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-drawer,
:is(html[data-industry="beauty"], html[data-industry="food"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-drawer {
  z-index: 14 !important;
}

:is(html:not([data-industry]), html[data-industry="pet"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-layer.is-open .official-material-drawer,
:is(html[data-industry="beauty"], html[data-industry="food"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-layer.is-open .official-material-drawer {
  left: var(--official-material-left, clamp(380px, 20vw, 520px)) !important;
  top: 84px !important;
  bottom: 42px !important;
  width: calc(100vw - var(--official-material-left, clamp(380px, 20vw, 520px)) - 32px) !important;
}

:is(html:not([data-industry]), html[data-industry="pet"]) body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] :is(.preview-column, .preview-card, .detail-page-latest-panel),
:is(html[data-industry="beauty"], html[data-industry="food"]) body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] :is(.preview-column, .preview-card, .detail-page-latest-panel) {
  contain: none !important;
  overflow: visible !important;
}

@media (max-width: 760px) {
  :is(html:not([data-industry]), html[data-industry="pet"]) body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .preview-column,
  :is(html[data-industry="beauty"], html[data-industry="food"]) body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .preview-column {
    position: fixed !important;
    inset: 0 !important;
    z-index: 240 !important;
    display: block !important;
    width: 100vw !important;
    height: 100dvh !important;
    pointer-events: none !important;
  }

  :is(html:not([data-industry]), html[data-industry="pet"]) body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-layer,
  :is(html:not([data-industry]), html[data-industry="pet"]) body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-layer.is-open,
  :is(html[data-industry="beauty"], html[data-industry="food"]) body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-layer,
  :is(html[data-industry="beauty"], html[data-industry="food"]) body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-layer.is-open {
    position: fixed !important;
    inset: 0 !important;
    z-index: 241 !important;
    display: block !important;
    width: 100vw !important;
    height: 100dvh !important;
    overflow: hidden !important;
    background: rgba(31, 35, 52, 0.18);
    pointer-events: auto !important;
  }

  :is(html:not([data-industry]), html[data-industry="pet"]) body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-drawer,
  :is(html:not([data-industry]), html[data-industry="pet"]) body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-layer.is-open .official-material-drawer,
  :is(html[data-industry="beauty"], html[data-industry="food"]) body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-drawer,
  :is(html[data-industry="beauty"], html[data-industry="food"]) body.official-material-drawer-open.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .official-material-layer.is-open .official-material-drawer {
    position: fixed !important;
    left: 12px !important;
    top: max(12px, env(safe-area-inset-top)) !important;
    bottom: max(12px, env(safe-area-inset-bottom)) !important;
    z-index: 242 !important;
    width: calc(100vw - 24px) !important;
    max-width: none !important;
    padding: 16px 14px !important;
    border-radius: 18px !important;
    transform: none !important;
  }
}

/* Product main and usage-scene workbenches: use the same full-height right recent-works surface as buyer show. */
body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="pet-product-main-image"],
  [data-active-feature="pet-product-scene"],
  [data-active-feature="beauty-product-scene"],
  [data-active-feature="food-product-scene"],
  [data-active-feature="home-product-scene"]
) :is(.preview-frame, .preview-gallery, .preview-compare, .copy-result-panel, .task-recent-panel, #preview-badge, .shine-layer) {
  display: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="pet-product-main-image"],
  [data-active-feature="pet-product-scene"],
  [data-active-feature="beauty-product-scene"],
  [data-active-feature="food-product-scene"],
  [data-active-feature="home-product-scene"]
) :is(.preview-card, .detail-page-latest-panel, .wrinkle-latest-panel) {
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="pet-product-main-image"],
  [data-active-feature="pet-product-scene"],
  [data-active-feature="beauty-product-scene"],
  [data-active-feature="food-product-scene"],
  [data-active-feature="home-product-scene"]
) .preview-card {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="pet-product-main-image"],
  [data-active-feature="pet-product-scene"],
  [data-active-feature="beauty-product-scene"],
  [data-active-feature="food-product-scene"],
  [data-active-feature="home-product-scene"]
) .detail-page-latest-panel {
  display: grid !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="pet-product-main-image"],
  [data-active-feature="pet-product-scene"],
  [data-active-feature="beauty-product-scene"],
  [data-active-feature="food-product-scene"],
  [data-active-feature="home-product-scene"]
) .wrinkle-latest-panel {
  grid-template-rows: auto minmax(0, 1fr) !important;
  padding: 0 !important;
  overflow: hidden !important;
}

body.feature-focus-mode.workstation-feature-mode:is(
  [data-active-feature="pet-product-main-image"],
  [data-active-feature="pet-product-scene"],
  [data-active-feature="beauty-product-scene"],
  [data-active-feature="food-product-scene"],
  [data-active-feature="home-product-scene"]
) .wrinkle-latest-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  grid-template-rows: none !important;
  grid-auto-rows: auto !important;
  align-content: start !important;
  justify-content: start !important;
  height: auto !important;
  max-height: 100% !important;
  overflow: auto !important;
  overscroll-behavior: contain !important;
}

@media (min-width: 981px) {
  body.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="pet-product-main-image"],
    [data-active-feature="pet-product-scene"],
    [data-active-feature="beauty-product-scene"],
    [data-active-feature="food-product-scene"],
    [data-active-feature="home-product-scene"]
  ) .preview-column {
    justify-self: end !important;
    width: min(430px, 100%) !important;
    max-width: 430px !important;
  }
}

@media (min-width: 1440px) {
  body.feature-focus-mode.workstation-feature-mode:is(
    [data-active-feature="pet-product-main-image"],
    [data-active-feature="pet-product-scene"],
    [data-active-feature="beauty-product-scene"],
    [data-active-feature="food-product-scene"],
    [data-active-feature="home-product-scene"]
  ) .preview-column {
    justify-self: stretch !important;
    width: 100% !important;
    max-width: none !important;
  }
}

/* Pet product main: keep every top-level tool on one compact 12px rhythm.
   Inner control gaps remain unchanged so buttons and upload slots stay usable. */
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] {
  --pet-main-tool-gap: 12px;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .upload-column ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .upload-column {
  padding-bottom: 6px !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-basic-selects ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-basic-selects {
  margin-top: 6px !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-column ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-column {
  gap: var(--pet-main-tool-gap) !important;
  padding-top: 0 !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-scroll-area ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-scroll-area {
  gap: var(--pet-main-tool-gap) !important;
  padding-top: 6px !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-fashion-settings ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-fashion-settings {
  display: grid !important;
  gap: var(--pet-main-tool-gap) !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-fashion-setting-group ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-fashion-setting-group {
  display: grid !important;
  gap: 10px !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-main-reference-materials,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-main-reference-materials,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .background-official-material-button ,
html:is([data-industry="pet"], [data-industry="beauty"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .background-official-material-button {
  margin-top: 0 !important;
}

/* Commerce usage-scene empty showcase: keep the Pet 1+4 structure, but prevent
   a single landscape source image from expanding across the full works area. */
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
body.feature-showcase-mode.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"]
.wrinkle-latest-showcase-empty .feature-image-showcase-board {
  justify-self: center !important;
  align-self: start !important;
  width: min(1040px, calc(100% - 32px)) !important;
  max-width: 1040px !important;
  height: min(620px, 100%) !important;
  max-height: 620px !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  overflow: hidden !important;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
body.feature-showcase-mode.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"]
.wrinkle-latest-showcase-empty .feature-image-showcase-group[data-showcase-group="source"] .set-preview-card img {
  object-fit: contain !important;
}

/* Per-feature draft reset: keep the action beside the visible feature title. */
.task-title-row,
.free-title-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  min-width: 0;
}

.task-title-row > h2,
.free-title-row > h1 {
  min-width: 0;
  margin: 0;
}

/* The workbench focuses the heading after navigation for screen-reader context. */
.task-heading h2[tabindex="-1"]:focus {
  outline: none;
}

.feature-clear-settings-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 28px;
  padding: 4px 10px;
  border: 1px solid rgba(125, 116, 164, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.76);
  color: #6f6a80;
  font: inherit;
  font-size: 12px;
  font-weight: 520;
  line-height: 1;
  letter-spacing: 0;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: 0 3px 10px rgba(72, 61, 117, 0.04);
  transition:
    border-color 160ms ease,
    background-color 160ms ease,
    color 160ms ease,
    transform 160ms ease,
    box-shadow 160ms ease;
}

.feature-clear-settings-button .lucide {
  width: 13px;
  height: 13px;
  stroke-width: 1.9;
}

.task-heading .feature-clear-settings-button span,
.free-page-head .feature-clear-settings-button span {
  color: inherit;
  font: inherit;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
}

.feature-clear-settings-button:hover:not(:disabled) {
  border-color: rgba(105, 86, 255, 0.42);
  background: rgba(244, 241, 255, 0.96);
  color: #6250e8;
  box-shadow: 0 5px 14px rgba(90, 72, 190, 0.1);
  transform: translateY(-1px);
}

.feature-clear-settings-button:focus-visible {
  outline: 2px solid rgba(103, 84, 255, 0.34);
  outline-offset: 2px;
}

.feature-clear-settings-button:disabled {
  cursor: wait;
  opacity: 0.58;
  transform: none;
}

.feature-clear-settings-button.is-clearing .lucide {
  animation: feature-clear-settings-spin 720ms linear infinite;
}

@keyframes feature-clear-settings-spin {
  to {
    transform: rotate(-360deg);
  }
}

html[data-theme="dark"] .feature-clear-settings-button {
  border-color: rgba(193, 186, 229, 0.2);
  background: rgba(36, 33, 50, 0.8);
  color: #c9c3dc;
}

html[data-theme="dark"] .feature-clear-settings-button:hover:not(:disabled) {
  border-color: rgba(158, 143, 255, 0.48);
  background: rgba(89, 74, 174, 0.24);
  color: #ddd7ff;
}

/* These nodes exist in the shared desktop markup. Keep them hidden until the
 * route-scoped mobile stylesheets are enabled by the entry document. */
.mobile-home-intro,
.mobile-bottom-nav,
.mobile-merchant-shortcuts,
.mobile-merchant-edition,
.mobile-outpaint-ratio-section,
.mobile-feature-back {
  display: none;
}

@media (max-width: 760px) {
  .task-title-row,
  .free-title-row {
    gap: 8px;
  }

  .feature-clear-settings-button {
    min-height: 26px;
    padding: 4px 8px;
    font-size: 11px;
  }
}


/* Food product main: the upload column is narrow even on desktop, so keep the
 * optional product name on two clear rows instead of squeezing label and input. */
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="pet-product-main-image"], [data-active-feature="buyer-show"]) .pet-detail-product-name-field {
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: stretch !important;
  gap: 6px !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-product-name-heading {
  display: inline-flex !important;
  width: fit-content;
  max-width: 100%;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-product-name-control {
  grid-template-columns: 15px minmax(0, 1fr) auto !important;
  width: 100% !important;
  min-width: 0 !important;
}

/* Keep the Food settings surface independent from stale generic card rules. */
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #settings-card {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #settings-card > .settings-head {
  display: none !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-fashion-settings,
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-fashion-setting-group {
  display: grid !important;
}

/* Food mirrors Beauty here: language, person participation and scene. */
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-basic-selects .detail-basic-select-card {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}


html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-product-type-select > summary {
  list-style: none !important;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-detail-product-type-select > summary::-webkit-details-marker {
  display: none !important;
}

/* Food product main keeps the established fixed cross-border minimal card
 * immediately after Smart Recommendation. */
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-style-preset-button.is-cross-border-preset {
  height: 68px;
  min-height: 68px;
  gap: 3px;
  padding: 8px 10px !important;
  border-color: rgba(45, 166, 139, 0.3);
  background: linear-gradient(180deg, rgba(239, 251, 247, 0.94), rgba(255, 255, 255, 0.92));
}


/* Shared horizontal recent-task strip only. Other latest-task layouts keep
 * their independent detail, video and feature-panel presentation. */
.task-recent-panel {
  grid-template-columns: 66px minmax(0, 1fr) 66px;
  gap: 8px;
}

.task-recent-gallery {
  grid-auto-columns: max-content;
}

.task-recent-head {
  align-self: stretch;
  display: flex;
  padding: 0 8px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border-radius: 0;
  border-right: 1px solid var(--line, #eceaf7);
  background: transparent;
  color: var(--muted, #777386);
}

.task-recent-head-icon {
  width: 15px;
  height: 15px;
  color: inherit;
  stroke-width: 1.7;
}

.task-recent-head strong {
  display: flex;
  grid-template-columns: repeat(2, auto);
  align-items: center;
  justify-content: center;
  gap: 0;
  color: inherit;
  font-size: 10px;
  font-weight: 450;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
}

.task-recent-head strong > span {
  font-size: 10px;
  font-weight: 450;
  letter-spacing: 0;
  line-height: 1;
}

.task-recent-item {
  position: relative;
  width: max-content;
  height: 120px;
  min-width: 72px;
}

.task-recent-item .task-recent-card {
  width: max-content;
  min-width: 72px;
  height: 120px;
  border-radius: 8px;
  box-shadow: none;
}

.task-recent-item .task-recent-card:hover {
  box-shadow: none;
}

.task-recent-item .task-recent-thumb {
  border-radius: 8px;
  width: max-content;
  min-width: 72px;
  height: 100%;
  aspect-ratio: auto;
}

.task-recent-item .task-recent-thumb img {
  width: auto;
  max-width: none;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.task-recent-pending {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, rgba(68, 72, 91, 0.12), rgba(68, 72, 91, 0.42));
}

.task-recent-pending .lucide {
  width: 28px;
  height: 28px;
  color: #fff;
  stroke-width: 1.7;
  filter: drop-shadow(0 2px 5px rgba(25, 28, 40, 0.2));
}

.task-recent-card.is-pending .copy-thumb > small {
  display: none;
}

.task-recent-card.is-pending .task-recent-thumb em {
  background: rgba(68, 72, 91, 0.82);
}

.task-recent-item .task-recent-thumb > em {
  right: auto;
  left: 50%;
  max-width: calc(100% - 10px);
  overflow: hidden;
  transform: translateX(-50%);
  white-space: nowrap;
  text-overflow: ellipsis;
}

.task-recent-card:is(.is-running, .is-failed) .copy-thumb > small {
  right: auto;
  left: 50%;
  max-width: calc(100% - 10px);
  overflow: hidden;
  transform: translateX(-50%);
  white-space: nowrap;
  text-overflow: ellipsis;
}

.task-recent-item .task-recent-thumb > .task-recent-elapsed {
  top: 12px;
}

.task-recent-item .task-recent-thumb > em:not(.task-recent-elapsed) {
  bottom: 12px;
}

.task-recent-card:is(.is-running, .is-failed) .copy-thumb > small {
  bottom: 12px;
}

.task-recent-delete {
  position: absolute;
  top: 5px;
  right: 5px;
  z-index: 8;
  display: grid;
  width: 23px;
  height: 23px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.78);
  border-radius: 999px;
  color: #fff;
  background: rgba(27, 30, 42, 0.7);
  box-shadow: 0 4px 12px rgba(15, 18, 30, 0.18);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-3px) scale(0.92);
  transition: opacity 140ms ease, transform 140ms ease, background-color 140ms ease;
}

.task-recent-delete .lucide {
  width: 13px;
  height: 13px;
  stroke-width: 2;
}

.task-recent-item:hover .task-recent-delete,
.task-recent-item:focus-within .task-recent-delete {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

.task-recent-delete:hover,
.task-recent-delete:focus-visible {
  outline: none;
  background: rgba(207, 57, 76, 0.94);
  box-shadow: 0 0 0 3px rgba(207, 57, 76, 0.14), 0 4px 12px rgba(15, 18, 30, 0.18);
}

.task-recent-clear {
  align-self: stretch;
  display: flex;
  min-width: 66px;
  padding: 0 8px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 0;
  border-left: 1px solid var(--line, #eceaf7);
  border-radius: 0;
  color: var(--muted, #777386);
  background: transparent;
  font-size: 10px;
  font-weight: 450;
  line-height: 1;
  white-space: nowrap;
  transition: color 140ms ease, background-color 140ms ease;
}

.task-recent-clear .lucide {
  width: 15px;
  height: 15px;
  stroke-width: 1.7;
}

.task-recent-clear:hover:not(:disabled),
.task-recent-clear:focus-visible:not(:disabled) {
  outline: none;
  color: #c53e51;
  background: rgba(197, 62, 81, 0.055);
}

.task-recent-clear:disabled {
  cursor: default;
  opacity: 0.35;
}

@media (hover: none) {
  .task-recent-delete {
    opacity: 1;
    pointer-events: auto;
    transform: none;
  }
}
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-style-preset-button.is-cross-border-preset:hover {
  border-color: rgba(36, 151, 125, 0.48);
  box-shadow: 0 8px 18px rgba(39, 139, 119, 0.11);
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-style-preset-button.is-cross-border-preset.selected {
  border-color: rgba(112, 92, 246, 0.72);
  background: linear-gradient(135deg, #705cf6, #8d74ff);
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-style-cross-border-badge {
  position: absolute;
  top: 7px;
  right: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 18px;
  padding: 0 8px;
  border-radius: 999px;
  color: #197460;
  background: rgba(214, 247, 237, 0.95);
  font-size: 9.5px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .detail-style-preset-button.is-cross-border-preset.selected .detail-style-cross-border-badge {
  color: #6650e9;
  background: rgba(255, 255, 255, 0.92);
}

/* 食品饮品买家秀：手机端将说明与三图槽位拆成两行，避免横向挤压和槽位越界。 */
@media (max-width: 760px) {
  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] #product-upload {
    grid-template-columns: 42px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    align-items: center !important;
    min-height: 0 !important;
    row-gap: 12px !important;
  }

  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] #product-upload .upload-icon {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] #product-upload .upload-copy {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }

  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] #product-upload .upload-copy small {
    max-width: none !important;
  }

  html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .detail-upload-strip {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    grid-template-columns: repeat(3, 68px) !important;
    justify-content: center !important;
  }
}

/* Food scene preview: keep the shared brand and heading in separate columns. */
html[data-industry="food"] body.feature-showcase-mode.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .feature-image-showcase-board .set-preview-board-head {
  grid-template-columns: 108px minmax(0, 1fr);
  gap: 14px;
  place-items: center stretch;
  min-height: 74px;
}

html[data-industry="food"] body.feature-showcase-mode.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .feature-image-showcase-board .set-preview-board-head > .feature-image-showcase-logo {
  position: static;
  width: 108px !important;
  min-width: 108px !important;
  max-width: 108px !important;
  transform: none;
}

html[data-industry="food"] body.feature-showcase-mode.feature-focus-mode.workstation-feature-mode[data-active-feature="food-product-scene"] .feature-image-showcase-heading {
  min-width: 0;
  justify-items: start;
  text-align: left;
}

/* Detail-page product-type card: screenshot-matched display shell only. */
html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .detail-product-type-row {
  display: block !important;
  position: relative !important;
  z-index: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-select {
  position: relative !important;
  width: 100% !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-select > summary {
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) 8px !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 78px !important;
  padding: 10px 16px 10px 12px !important;
  border: 1px solid #ded9f4 !important;
  border-radius: 15px !important;
  color: #252b3b !important;
  background: #ffffff !important;
  box-shadow: 0 5px 15px rgba(67, 55, 122, 0.055) !important;
  cursor: pointer !important;
  list-style: none !important;
  overflow: hidden !important;
  transform: none !important;
  transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-select > summary::-webkit-details-marker {
  display: none !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-select > summary:hover,
html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-select > summary:focus-visible,
html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-select[open] > summary {
  outline: none !important;
  border-color: #b9adf5 !important;
  background: #ffffff !important;
  box-shadow: 0 7px 18px rgba(94, 73, 179, 0.1), 0 0 0 3px rgba(112, 84, 232, 0.055) !important;
  transform: none !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-icon {
  display: grid !important;
  place-items: center !important;
  width: 46px !important;
  height: 46px !important;
  border-radius: 13px !important;
  color: #6b50ec !important;
  background: #f1edff !important;
  box-shadow: none !important;
  animation: none !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-icon .lucide {
  width: 21px !important;
  height: 21px !important;
  stroke-width: 1.9 !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-copy {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-copy > small {
  overflow: hidden !important;
  color: #262b3a !important;
  font-size: 15.5px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-copy > strong {
  min-width: 0 !important;
  overflow: hidden !important;
  color: #777488 !important;
  font-size: 12.5px !important;
  font-weight: 450 !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-hint {
  display: none !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-select > summary::after {
  content: "" !important;
  width: 7px !important;
  height: 7px !important;
  margin: -4px 0 0 !important;
  border-right: 1.5px solid #756b98 !important;
  border-bottom: 1.5px solid #756b98 !important;
  transform: rotate(45deg) !important;
  transition: transform 160ms ease, margin 160ms ease !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-select[open] > summary::after {
  margin-top: 4px !important;
  transform: rotate(225deg) !important;
}

html:is(:not([data-industry]), [data-industry="fashion"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-menu {
  display: none !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: auto !important;
  width: min(380px, calc(100vw - 24px)) !important;
  max-height: none !important;
  margin: 0 !important;
  z-index: 1800 !important;
  padding: 10px !important;
  border: 1px solid rgba(199, 205, 230, 0.95) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.99) !important;
  box-shadow: 0 14px 32px rgba(58, 47, 112, 0.15) !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

html:is(:not([data-industry]), [data-industry="fashion"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-select[open] > .pet-detail-product-type-menu {
  display: grid !important;
  animation: pet-detail-product-menu-in 150ms ease-out both !important;
}

html[data-industry="pet"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-menu,
html[data-industry="food"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-menu {
  width: min(440px, calc(100vw - 24px)) !important;
}

html[data-industry="beauty"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-menu {
  width: min(540px, calc(100vw - 24px)) !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-menu > button {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 9px !important;
  min-width: 0 !important;
  min-height: 46px !important;
  padding: 8px 10px 8px 12px !important;
  border: 1px solid rgba(218, 212, 238, 0.95) !important;
  border-radius: 11px !important;
  color: #4c465b !important;
  background: linear-gradient(180deg, #ffffff, #fbfaff) !important;
  box-shadow: 0 3px 9px rgba(55, 46, 91, 0.045) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  overflow-wrap: break-word !important;
  text-align: left !important;
  white-space: normal !important;
  word-break: keep-all !important;
  transform: none !important;
  transition: border-color 160ms ease, color 160ms ease, background 160ms ease, box-shadow 160ms ease !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-menu > button::after {
  content: "" !important;
  flex: 0 0 auto !important;
  width: 15px !important;
  height: 15px !important;
  margin-left: auto !important;
  border: 1.5px solid #d4cde9 !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  box-shadow: inset 0 0 0 3px #ffffff !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-menu > button:hover,
html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-menu > button:focus-visible {
  outline: none !important;
  border-color: rgba(117, 88, 243, 0.5) !important;
  color: #5d42d5 !important;
  background: linear-gradient(180deg, #ffffff, #f5f1ff) !important;
  box-shadow: 0 7px 16px rgba(94, 69, 188, 0.11) !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-menu > button:hover::after,
html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-menu > button:focus-visible::after {
  border-color: #8a70ef !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-menu > button.selected {
  border-color: transparent !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #7056e8, #8b70f6) !important;
  box-shadow: 0 8px 18px rgba(104, 77, 214, 0.22) !important;
}

html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-menu > button.selected::after {
  content: "✓" !important;
  display: grid !important;
  place-items: center !important;
  border-color: rgba(255, 255, 255, 0.82) !important;
  color: #6d53df !important;
  background: #ffffff !important;
  box-shadow: none !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

html[data-theme="dark"]:is([data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-select > summary {
  border-color: #4b4763 !important;
  color: #f0eef9 !important;
  background: #242230 !important;
  box-shadow: none !important;
}

html[data-theme="dark"]:is([data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-copy > small {
  color: #f1eff9 !important;
}

html[data-theme="dark"]:is([data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-copy > strong {
  color: #b5b0c6 !important;
}

@media (max-width: 760px) {
  html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
    body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
    .pet-detail-product-type-select > summary {
    grid-template-columns: 42px minmax(0, 1fr) 8px !important;
    min-height: 72px !important;
    padding: 9px 13px 9px 10px !important;
  }

  html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
    body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
    .pet-detail-product-type-icon {
    width: 42px !important;
    height: 42px !important;
  }

  html:is(:not([data-industry]), [data-industry="fashion"], [data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
    body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
    .pet-detail-product-type-menu {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    left: 12px !important;
    width: calc(100vw - 24px) !important;
    max-height: min(320px, calc(100vh - 24px)) !important;
    overflow-y: auto !important;
  }
}
/* Fashion keeps its existing auto value; translate it visually without changing JavaScript or option data. */
html:is(:not([data-industry]), [data-industry="fashion"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-select:has([data-detail-product-type="auto"].selected)
  [data-pet-detail-product-type-value] {
  font-size: 0 !important;
}

html:is(:not([data-industry]), [data-industry="fashion"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"]
  .pet-detail-product-type-select:has([data-detail-product-type="auto"].selected)
  [data-pet-detail-product-type-value]::after {
  content: "自动匹配";
  color: #777488;
  font-size: 12.5px;
  font-weight: 450;
  line-height: 1.2;
}
/* Shared Fashion, Pet, Beauty, and Food detail-page presentation; industry data and generation logic stay isolated. */
html[data-industry="food"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #pet-main-basic-selects {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-page-basic-selects.pet-detail-content-settings {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 12px !important;
  margin-top: 14px !important;
  padding: 12px 14px 14px !important;
  border: 1px solid rgba(123, 99, 244, 0.24) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.56) !important;
  box-shadow: 0 8px 24px rgba(75, 59, 143, 0.04) !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-head {
  color: #5f4bea;
  font-size: 16px;
  font-weight: 750;
  line-height: 1.25;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-page-basic-selects.pet-detail-content-settings .detail-basic-select-card {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  padding: 0 !important;
}

html:not([data-industry]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-page-basic-selects.pet-detail-content-settings .detail-basic-select-card {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-page-basic-selects.pet-detail-content-settings .detail-page-select-field > summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  align-content: center !important;
  align-items: start !important;
  gap: 4px !important;
  min-height: 52px !important;
  padding: 7px 30px 7px 12px !important;
  border-radius: 13px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-actions > :is(.detail-product-type-row, .detail-reference-card) {
  min-width: 0;
  grid-column: auto !important;
  margin: 0 !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-actions .pet-detail-product-type-select > summary,
:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-actions .detail-reference-button {
  width: 100% !important;
  min-height: 68px !important;
  height: 68px !important;
  box-sizing: border-box !important;
  border: 1px solid #ded9f4 !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  box-shadow: 0 6px 18px rgba(67, 55, 122, 0.05) !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-actions .pet-detail-product-type-select > summary {
  grid-template-columns: 40px minmax(0, 1fr) 8px !important;
  padding: 8px 14px 8px 10px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-actions .detail-reference-card {
  position: relative;
  border: 0 !important;
  border-radius: 16px !important;
  background: transparent !important;
  box-shadow: none !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-actions .detail-reference-button {
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 8px 28px 8px 10px !important;
  color: #252b3b !important;
  text-align: left !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-actions .detail-reference-button > :is(.lucide, img) {
  width: 40px !important;
  height: 40px !important;
  padding: 9px !important;
  border-radius: 12px !important;
  color: #6b50ec !important;
  background: #f1edff !important;
  box-sizing: border-box !important;
  object-fit: cover !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-actions .detail-reference-button > span {
  min-width: 0;
}

html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-actions .detail-reference-button strong,
html[data-industry="pet"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-actions .detail-reference-button small {
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
}

/* Pin explicit grid areas so restored DOM order cannot place the copy in the
 * fixed 40px media column. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-page-basic-selects[data-detail-layout-industry="fashion"] .detail-content-settings-actions [data-detail-model-reference] .detail-reference-button > :is(.lucide, img) {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-page-basic-selects[data-detail-layout-industry="fashion"] .detail-content-settings-actions [data-detail-model-reference] .detail-reference-button > span {
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 100%;
  min-width: 0;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-page-basic-selects[data-detail-layout-industry="fashion"] .detail-content-settings-actions [data-detail-model-reference] .detail-reference-button strong {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-page-module-picker {
  margin-top: 14px !important;
  padding: 14px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-page-module-picker::before {
  display: none !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] :is(
  .pet-detail-content-settings-head,
  .detail-page-module-head > span,
  .detail-reference-head > span
) {
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .task-heading h2[tabindex="-1"]:focus {
  outline: none !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-actions .pet-detail-product-type-icon {
  width: 40px !important;
  height: 40px !important;
  border-radius: 12px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-reference-materials .detail-reference-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-reference-materials .detail-reference-grid > :is(.detail-style-reference, .detail-style-official-library-button) {
  grid-column: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 68px !important;
  height: 68px !important;
  margin: 0 !important;
  border-radius: 16px !important;
  box-sizing: border-box !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-reference-materials .detail-reference-grid .detail-reference-button {
  min-height: 68px !important;
  height: 68px !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  border-radius: 16px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-reference-materials .detail-reference-grid .detail-style-official-library-button {
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) 14px !important;
  gap: 10px !important;
  padding: 8px 12px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-reference-materials .detail-style-preset-panel {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

@media (max-width: 760px) {
  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .pet-detail-content-settings-actions,
  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]), html:not([data-industry])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] #detail-reference-materials .detail-reference-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Product main content/style layout sync */
:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #settings-card.product-main-settings-layout-active {
  overflow: visible !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .task-heading h2[tabindex="-1"]:focus {
  outline: none !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #settings-card.product-main-settings-layout-active #dynamic-settings {
  overflow: visible !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-settings-layout {
  display: grid !important;
  gap: 14px !important;
  width: 100%;
  min-width: 0;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] :is(
  .pet-product-main-content-settings,
  #pet-main-reference-materials
) {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 14px !important;
  border: 1px solid rgba(123, 99, 244, 0.24) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.56) !important;
  background-image: none !important;
  box-shadow: none !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-content-settings {
  display: grid;
  gap: 12px;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] :is(
  .pet-product-main-section-head,
  #pet-main-reference-materials > .detail-reference-head > span
) {
  color: #5f4ee8 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-basic-select-host {
  min-width: 0;
  position: relative;
  z-index: 40;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-basic-select-host #pet-main-basic-selects {
  display: grid !important;
  width: 100%;
  margin: 0 !important;
  gap: 8px !important;
  position: relative !important;
  z-index: 40 !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-basic-select-host #pet-main-basic-selects .detail-basic-select-card {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-basic-select-host .detail-page-select-field > summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 14px !important;
  grid-template-rows: auto auto !important;
  align-content: center !important;
  column-gap: 6px !important;
  row-gap: 2px !important;
  min-height: 52px !important;
  height: 52px !important;
  padding: 7px 10px !important;
  border-radius: 14px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-basic-select-host .detail-page-select-field > summary > span {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  color: #6957ed;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.1 !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-basic-select-host .detail-page-select-field > summary > strong {
  grid-column: 1;
  grid-row: 2;
  min-width: 0;
  overflow: hidden;
  color: #303344;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-basic-select-host .detail-page-select-field > summary::after {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  justify-self: end;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-content-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-content-actions > :is(
  .pet-main-product-type-row,
  .pet-product-main-subject-reference-host
) {
  min-width: 0;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-content-actions .pet-detail-product-type-select > summary,
:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-subject-reference-host > .detail-reference-card,
:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-subject-reference-host .detail-reference-button {
  width: 100% !important;
  min-width: 0 !important;
  height: 68px !important;
  min-height: 68px !important;
  box-sizing: border-box !important;
  border-radius: 16px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-content-actions .pet-detail-product-type-select > summary {
  padding: 8px 12px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-content-actions .pet-detail-product-type-icon {
  width: 40px !important;
  height: 40px !important;
  border-radius: 12px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-content-actions .pet-detail-product-type-hint {
  display: none !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-subject-reference-host .detail-reference-button {
  padding: 8px 12px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-content-options {
  display: grid;
  gap: 10px;
  min-width: 0;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-content-options > .pet-fashion-setting-group {
  margin: 0 !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-host {
  min-width: 0;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .pet-product-main-copy-host > .extra-prompt-box {
  width: 100%;
  min-width: 0;
  margin: 0 !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials {
  display: grid !important;
  gap: 12px !important;
  margin: 0 !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials > .detail-reference-head {
  min-width: 0;
  margin: 0 !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials > .detail-reference-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  min-width: 0;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials > .detail-reference-grid > :is(
  .detail-style-reference,
  .detail-style-official-library-button
) {
  grid-column: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 68px !important;
  min-height: 68px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  border-radius: 16px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials > .detail-reference-grid .detail-reference-button {
  height: 68px !important;
  min-height: 68px !important;
  padding: 8px 12px !important;
  border-radius: 16px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials > .detail-reference-grid .detail-style-official-library-button {
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) 14px !important;
  gap: 10px !important;
  padding: 8px 12px !important;
}

:is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] #pet-main-reference-materials .detail-style-preset-panel {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

html[data-theme="dark"]:is([data-industry="pet"], [data-industry="beauty"], [data-industry="food"], [data-industry="home"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] :is(
  .pet-product-main-content-settings,
  #pet-main-reference-materials
) {
  border-color: rgba(151, 132, 255, 0.28) !important;
  background: rgba(28, 30, 45, 0.72) !important;
}

@media (max-width: 760px) {
  :is(html[data-industry="pet"], html[data-industry="beauty"], html[data-industry="food"], html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])) body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] :is(
    .pet-product-main-content-actions,
    #pet-main-reference-materials > .detail-reference-grid
  ) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])[data-mobile-workbench="true"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-main-image"] .settings-bottom-area #generate {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }
}

/* Workbench layout compatibility belongs to the presentation layer, not the typography contract. */
html body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] #task-panel .swatch-grid > .swatch-button {
  min-height: 57px !important;
}

html[data-mobile-workbench="true"] body.feature-focus-mode.workstation-feature-mode[data-active-feature="colors"] #task-panel .swatch-grid > .swatch-button {
  min-height: 54px !important;
}

/* Shared prompt-box actions: compact, flat, and consistent across industries. */
html body.feature-focus-mode.workstation-feature-mode[data-active-feature] :is(
  #task-panel .prompt-optimize-button,
  #task-panel .video-material-mention-button,
  #free-generate-page .free-prompt-optimize-button,
  #free-generate-page .free-material-picker-button,
  .xhs-requirement-wrap .xhs-prompt-optimize-button
) {
  min-height: 28px !important;
  height: 28px !important;
  gap: 4px !important;
  padding-inline: 10px !important;
  border: 1px solid rgba(91, 73, 230, 0.26) !important;
  border-radius: 999px !important;
  color: #5b4be8 !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: none !important;
  font-size: 11px !important;
  font-weight: var(--aotu-type-medium) !important;
  line-height: 1 !important;
  transform: none !important;
  transition: border-color 0.16s ease, color 0.16s ease, background-color 0.16s ease !important;
  white-space: nowrap !important;
}

html body.feature-focus-mode.workstation-feature-mode[data-active-feature] :is(
  #task-panel .prompt-optimize-button,
  #task-panel .video-material-mention-button,
  #free-generate-page .free-prompt-optimize-button,
  #free-generate-page .free-material-picker-button,
  .xhs-requirement-wrap .xhs-prompt-optimize-button
):hover:not(:disabled) {
  border-color: rgba(91, 73, 230, 0.48) !important;
  color: #5142d8 !important;
  background: rgba(91, 73, 230, 0.07) !important;
  box-shadow: none !important;
  transform: none !important;
}

html body.feature-focus-mode.workstation-feature-mode[data-active-feature] :is(
  #task-panel .prompt-optimize-button,
  #task-panel .video-material-mention-button,
  #free-generate-page .free-prompt-optimize-button,
  #free-generate-page .free-material-picker-button,
  .xhs-requirement-wrap .xhs-prompt-optimize-button
):active:not(:disabled) {
  background: rgba(91, 73, 230, 0.12) !important;
  box-shadow: none !important;
  transform: none !important;
}

html body.feature-focus-mode.workstation-feature-mode[data-active-feature] :is(
  #task-panel .prompt-optimize-button,
  #task-panel .video-material-mention-button,
  #free-generate-page .free-prompt-optimize-button,
  #free-generate-page .free-material-picker-button,
  .xhs-requirement-wrap .xhs-prompt-optimize-button
):focus-visible {
  outline: 2px solid rgba(91, 73, 230, 0.58) !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}

html body.feature-focus-mode.workstation-feature-mode[data-active-feature] :is(
  #task-panel .prompt-optimize-button,
  #task-panel .video-material-mention-button,
  #free-generate-page .free-prompt-optimize-button,
  #free-generate-page .free-material-picker-button,
  .xhs-requirement-wrap .xhs-prompt-optimize-button
):disabled {
  border-color: rgba(109, 85, 238, 0.16) !important;
  color: #aaa6be !important;
  background: rgba(255, 255, 255, 0.82) !important;
  box-shadow: none !important;
  opacity: 0.68 !important;
  transform: none !important;
}

html body.feature-focus-mode.workstation-feature-mode[data-active-feature] :is(
  #task-panel .prompt-optimize-button,
  #free-generate-page .free-prompt-optimize-button,
  .xhs-requirement-wrap .xhs-prompt-optimize-button
).is-busy {
  border-color: #5b4be8 !important;
  color: #ffffff !important;
  background: #5b4be8 !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

html body.feature-focus-mode.workstation-feature-mode[data-active-feature] :is(
  #task-panel .prompt-optimize-button,
  #free-generate-page .free-prompt-optimize-button,
  .xhs-requirement-wrap .xhs-prompt-optimize-button
) .lucide {
  width: 14px !important;
  height: 14px !important;
  color: currentColor !important;
  stroke-width: 2.2 !important;
}

html body.feature-focus-mode.workstation-feature-mode[data-active-feature] :is(
  #task-panel .prompt-optimize-button,
  #free-generate-page .free-prompt-optimize-button,
  .xhs-requirement-wrap .xhs-prompt-optimize-button
) > span {
  color: inherit !important;
  font: inherit !important;
  font-size: 11px !important;
  font-weight: var(--aotu-type-medium) !important;
  line-height: 1 !important;
}

html[data-theme="dark"] body.feature-focus-mode.workstation-feature-mode[data-active-feature] :is(
  #task-panel .prompt-optimize-button,
  #task-panel .video-material-mention-button,
  #free-generate-page .free-prompt-optimize-button,
  #free-generate-page .free-material-picker-button,
  .xhs-requirement-wrap .xhs-prompt-optimize-button
) {
  border-color: rgba(186, 173, 255, 0.24) !important;
  color: #c8bcff !important;
  background: rgba(32, 36, 45, 0.96) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body.feature-focus-mode.workstation-feature-mode[data-active-feature] :is(
  #task-panel .prompt-optimize-button,
  #task-panel .video-material-mention-button,
  #free-generate-page .free-prompt-optimize-button,
  #free-generate-page .free-material-picker-button,
  .xhs-requirement-wrap .xhs-prompt-optimize-button
):hover:not(:disabled) {
  border-color: rgba(186, 173, 255, 0.44) !important;
  color: #eeeaff !important;
  background: rgba(144, 125, 255, 0.12) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body.feature-focus-mode.workstation-feature-mode[data-active-feature] :is(
  #task-panel .prompt-optimize-button,
  #task-panel .video-material-mention-button,
  #free-generate-page .free-prompt-optimize-button,
  #free-generate-page .free-material-picker-button,
  .xhs-requirement-wrap .xhs-prompt-optimize-button
):disabled {
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #7f8493 !important;
  background: rgba(32, 35, 41, 0.92) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body.feature-focus-mode.workstation-feature-mode[data-active-feature] :is(
  #task-panel .prompt-optimize-button,
  #free-generate-page .free-prompt-optimize-button,
  .xhs-requirement-wrap .xhs-prompt-optimize-button
).is-busy {
  border-color: #5f77ad !important;
  color: #ffffff !important;
  background: #5f77ad !important;
  box-shadow: none !important;
}

@media (max-width: 760px) {
  html[data-mobile-workbench="true"] body.feature-focus-mode.workstation-feature-mode[data-active-feature] :is(
    #task-panel .prompt-optimize-button,
    #task-panel .video-material-mention-button,
    #free-generate-page .free-prompt-optimize-button,
    #free-generate-page .free-material-picker-button,
    .xhs-requirement-wrap .xhs-prompt-optimize-button
  ) {
    min-height: 32px !important;
    height: 32px !important;
    padding-inline: 10px !important;
  }
}

/* Existing ID-based type rules are more specific than the shared class selectors. */
html body.feature-focus-mode.workstation-feature-mode[data-active-feature] #task-panel #prompt-optimize-button,
html body.feature-focus-mode.workstation-feature-mode[data-active-feature] #task-panel #video-material-mention-button {
  font-size: 11px !important;
  font-weight: var(--aotu-type-medium) !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

html body.feature-focus-mode.workstation-feature-mode[data-active-feature] #task-panel #prompt-optimize-button > span {
  color: inherit !important;
  font: inherit !important;
  font-size: 11px !important;
  font-weight: var(--aotu-type-medium) !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

html body.feature-focus-mode.workstation-feature-mode[data-active-feature] #task-panel #prompt-optimize-button .lucide {
  width: 14px !important;
  height: 14px !important;
  color: currentColor !important;
}

/* Pair prompt actions only when the material action is actually available. */
html:not([data-mobile-workbench="true"])
  body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="free-generate"], [data-active-feature="video-generate"])
  .extra-prompt-box:has(> #video-material-mention:not([hidden])) {
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  column-gap: 8px !important;
}

html:not([data-mobile-workbench="true"])
  body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="free-generate"], [data-active-feature="video-generate"])
  .extra-prompt-box:has(> #video-material-mention:not([hidden])) > #extra-prompt {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
}

html:not([data-mobile-workbench="true"])
  body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="free-generate"], [data-active-feature="video-generate"])
  .extra-prompt-box:has(> #video-material-mention:not([hidden])) > #video-material-mention {
  grid-column: 2 !important;
  grid-row: 2 !important;
  position: relative !important;
  inset: auto !important;
  align-self: end !important;
  justify-self: end !important;
  margin: 0 0 12px !important;
  z-index: 4 !important;
}

html:not([data-mobile-workbench="true"])
  body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="free-generate"], [data-active-feature="video-generate"])
  .extra-prompt-box:has(> #video-material-mention:not([hidden])) > .pet-product-main-copy-inline-actions {
  display: contents !important;
}

html:not([data-mobile-workbench="true"])
  body.feature-focus-mode.workstation-feature-mode:is([data-active-feature="free-generate"], [data-active-feature="video-generate"])
  .extra-prompt-box:has(> #video-material-mention:not([hidden])) #prompt-optimize-button {
  grid-column: 3 !important;
  grid-row: 2 !important;
  position: relative !important;
  inset: auto !important;
  align-self: end !important;
  justify-self: end !important;
  margin: 0 12px 12px 0 !important;
  z-index: 4 !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"]
  .free-page-prompt:has(.free-material-picker-button) .free-page-toolbar {
  justify-content: flex-end !important;
  gap: 8px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"]
  .free-page-prompt:has(.free-material-picker-button) .free-page-toolbar-left {
  flex: 0 0 auto !important;
}

html[data-mobile-workbench="true"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature]:not([data-active-feature="free-generate"])
  .mobile-merchant-prompt-template:has(> #video-material-mention:not([hidden])) {
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  column-gap: 8px !important;
}

html[data-mobile-workbench="true"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature]:not([data-active-feature="free-generate"])
  .mobile-merchant-prompt-template:has(> #video-material-mention:not([hidden])) > #extra-prompt {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
}

html[data-mobile-workbench="true"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature]:not([data-active-feature="free-generate"])
  .mobile-merchant-prompt-template:has(> #video-material-mention:not([hidden])) > #video-material-mention {
  grid-column: 2 !important;
  grid-row: 2 !important;
  position: relative !important;
  inset: auto !important;
  align-self: end !important;
  justify-self: end !important;
  margin: 0 0 10px !important;
  z-index: 4 !important;
}

html[data-mobile-workbench="true"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature]:not([data-active-feature="free-generate"])
  .mobile-merchant-prompt-template:has(> #video-material-mention:not([hidden])) > .pet-product-main-copy-inline-actions {
  display: contents !important;
}

html[data-mobile-workbench="true"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature]:not([data-active-feature="free-generate"])
  .mobile-merchant-prompt-template:has(> #video-material-mention:not([hidden])) #prompt-optimize-button {
  grid-column: 3 !important;
  grid-row: 2 !important;
  position: relative !important;
  inset: auto !important;
  align-self: end !important;
  justify-self: end !important;
  margin: 0 10px 10px 0 !important;
  z-index: 4 !important;
}

html[data-mobile-workbench="true"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"]
  .extra-prompt-box:has(> #video-material-mention:not([hidden])) > #video-material-mention {
  grid-column: 1 !important;
  grid-row: 4 !important;
  justify-self: end !important;
  margin: 0 !important;
}

html[data-mobile-workbench="true"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="free-generate"]
  .extra-prompt-box:has(> #video-material-mention:not([hidden])) #prompt-optimize-button {
  grid-column: 2 !important;
  grid-row: 4 !important;
  justify-self: end !important;
  margin: 0 !important;
}

/* Shared usage-scene layout: retain inner controls while removing redundant outer cards. */
html[data-industry="pet"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"]
  #task-panel :is(#settings-card, .extra-prompt-box),
html[data-industry="pet"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"]
  #task-panel :is(#settings-card, .extra-prompt-box):hover,
html[data-industry="beauty"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"]
  #task-panel :is(#settings-card, .extra-prompt-box),
html[data-industry="beauty"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"]
  #task-panel :is(#settings-card, .extra-prompt-box):hover,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"]
  #task-panel :is(#settings-card, .extra-prompt-box),
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"]
  #task-panel :is(#settings-card, .extra-prompt-box):hover {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-industry="pet"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"]
  #task-panel :is(#settings-card, .extra-prompt-box)::before,
html[data-industry="pet"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="pet-product-scene"]
  #task-panel :is(#settings-card, .extra-prompt-box)::after,
html[data-industry="beauty"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"]
  #task-panel :is(#settings-card, .extra-prompt-box)::before,
html[data-industry="beauty"]
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="beauty-product-scene"]
  #task-panel :is(#settings-card, .extra-prompt-box)::after,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"]
  #task-panel :is(#settings-card, .extra-prompt-box)::before,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="home-product-scene"]
  #task-panel :is(#settings-card, .extra-prompt-box)::after {
  content: none !important;
  display: none !important;
}

/* Fashion background replacement: keep the inner control groups while removing
   the redundant desktop-only outer settings card. */
html:not([data-industry]):not([data-mobile-workbench="true"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"]
  #task-panel #settings-card,
html:not([data-industry]):not([data-mobile-workbench="true"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"]
  #task-panel #settings-card:hover {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html:not([data-industry]):not([data-mobile-workbench="true"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"]
  #task-panel #settings-card::before,
html:not([data-industry]):not([data-mobile-workbench="true"])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="background"]
  #task-panel #settings-card::after {
  content: none !important;
  display: none !important;
}

/* Fashion flat-lay: the product type and background controls already provide
   their own visual grouping, so remove the redundant outer settings card. */
html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="flat-lay"]
  #task-panel #settings-card,
html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="flat-lay"]
  #task-panel #settings-card:hover {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="flat-lay"]
  #task-panel #settings-card::before,
html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="flat-lay"]
  #task-panel #settings-card::after {
  content: none !important;
  display: none !important;
}

/* Fashion buyer-show: choose whether a person appears before showing person attributes. */
html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-appearance-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 4px !important;
  padding: 4px !important;
  border: 1px solid rgba(225, 226, 235, 0.96) !important;
  border-radius: 16px !important;
  background: #f5f5f8 !important;
  background-image: none !important;
  box-shadow: none !important;
}

html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-appearance-button {
  display: grid !important;
  grid-template-columns: 32px minmax(0, 1fr) !important;
  align-items: center !important;
  justify-items: stretch !important;
  gap: 10px !important;
  min-width: 0 !important;
  min-height: 62px !important;
  padding: 9px 12px !important;
  border: 1px solid transparent !important;
  border-radius: 13px !important;
  color: #333746 !important;
  background: transparent !important;
  background-image: none !important;
  text-align: left !important;
  box-shadow: none !important;
  transform: none !important;
}

html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-appearance-button::before,
html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-appearance-button::after {
  content: none !important;
  display: none !important;
}

html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-appearance-button:hover {
  border-color: transparent !important;
  color: #292d3a !important;
  background: rgba(255, 255, 255, 0.62) !important;
  box-shadow: none !important;
  transform: none !important;
}

html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-appearance-button.selected,
html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-appearance-button[aria-pressed="true"] {
  border-color: rgba(220, 221, 230, 0.92) !important;
  color: #38324e !important;
  background: #ffffff !important;
  box-shadow: 0 3px 10px rgba(42, 43, 58, 0.09) !important;
}

html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-appearance-button:focus-visible {
  outline: 2px solid rgba(109, 85, 238, 0.34) !important;
  outline-offset: 2px !important;
}

html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-appearance-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  color: #6550df;
  background: #f0edff;
}

html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-appearance-icon :is(.lucide, svg) {
  width: 16px !important;
  height: 16px !important;
  stroke-width: 1.9 !important;
}

html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-appearance-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-appearance-copy strong {
  color: inherit !important;
  font-size: 13px !important;
  font-weight: 520 !important;
  line-height: 1.25 !important;
}

html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-appearance-copy small {
  overflow: visible;
  color: #858998 !important;
  font-size: 10.5px !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
  text-overflow: clip;
  white-space: normal;
}

html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-person-settings {
  display: grid;
  gap: 12px;
  margin-top: 12px;
}

html:not([data-industry])
  body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
  .fashion-buyer-show-person-settings > .buyer-filter-block + .buyer-filter-block {
  margin-top: 0;
}

@media (max-width: 520px) {
  html:not([data-industry])
    body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
    .fashion-buyer-show-appearance-button {
    grid-template-columns: 28px minmax(0, 1fr) !important;
    gap: 8px !important;
    min-height: 60px !important;
    padding: 8px 9px !important;
  }

  html:not([data-industry])
    body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"]
    .fashion-buyer-show-appearance-icon {
    width: 28px;
    height: 28px;
    border-radius: 9px;
  }

}

/* Beauty-style single-upload set generation. These industry routes intentionally
   expose no set type or inner settings card; the model derives everything from
   the one reference image and the shared Beauty prompt pipeline. */
html:is(
    [data-industry="beauty"],
    [data-industry="food"],
    [data-industry="home"],
    [data-industry="jewelry"],
    [data-industry="accessories"],
    [data-industry="digital"]
  ) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] #set-generate-mode-block,
html:is(
    [data-industry="beauty"],
    [data-industry="food"],
    [data-industry="home"],
    [data-industry="jewelry"],
    [data-industry="accessories"],
    [data-industry="digital"]
  ) body.feature-focus-mode.workstation-feature-mode[data-active-feature="set-generate"] #settings-card {
  display: none !important;
}
/* Home buyer-show: keep the mature Food buyer-show density while adding the
   category + filtered product-type row required by furniture workflows. */
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) .home-buyer-show-settings {
  display: grid;
  gap: 16px;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) .home-buyer-show-product-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) .home-buyer-show-product-grid .pet-buyer-show-category-select,
html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) .home-buyer-show-settings .food-buyer-show-person-type-select {
  display: block;
  position: relative;
  min-width: 0;
  width: 100%;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-select > summary {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 68px;
  padding: 12px 16px;
  border: 1px solid #dfddec;
  border-radius: 16px;
  color: #302d42;
  background: #fff;
  box-shadow: 0 5px 16px rgba(63, 52, 118, 0.055);
  box-sizing: border-box;
  cursor: pointer;
  list-style: none;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-select > summary::-webkit-details-marker {
  display: none;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-summary-icon {
  display: inline-flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  color: #654be0;
  background: #f0edff;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-summary-icon svg {
  width: 19px;
  height: 19px;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-summary-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-summary-copy strong {
  color: #302d42;
  font-size: 15px;
  font-weight: 600;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-summary-copy small {
  overflow: hidden;
  color: #898597;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-summary-chevron {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #8d82b6;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-select > .pet-buyer-show-category-menu {
  position: fixed;
  z-index: 2200;
  display: none;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  width: 0;
  margin: 0;
  padding: 12px;
  overflow: auto;
  visibility: hidden;
  pointer-events: none;
  border: 1px solid rgba(207, 201, 232, 0.96);
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.99);
  box-shadow: 0 16px 36px rgba(58, 47, 112, 0.17);
  box-sizing: border-box;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-select[open] > .pet-buyer-show-category-menu {
  display: grid;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-select[open] > .pet-buyer-show-category-menu[data-positioned="true"] {
  visibility: visible;
  pointer-events: auto;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-choice {
  display: flex;
  min-height: 48px;
  align-items: center;
  gap: 9px;
  padding: 8px 10px 8px 12px;
  border: 1px solid rgba(218, 212, 238, 0.95);
  border-radius: 11px;
  color: #4c465b;
  background: #fff;
  font-size: 12.5px;
  text-align: left;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-choice::after {
  content: "";
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  margin-left: auto;
  border: 1.5px solid #d4cde9;
  border-radius: 50%;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-choice.selected {
  border-color: #7659ee;
  color: #fff;
  background: #7659ee;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .home-buyer-show-settings .pet-buyer-show-category-choice.selected::after {
  content: "✓";
  display: grid;
  place-items: center;
  color: #6d53df;
  background: #fff;
  font-size: 10px;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-reference {
  min-height: 68px;
  border-color: #dfddec;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 5px 16px rgba(63, 52, 118, 0.055);
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .food-buyer-show-person-reference .detail-reference-button {
  min-height: 66px;
  padding: 10px 12px;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) body.feature-focus-mode.workstation-feature-mode[data-active-feature="buyer-show"] .extra-prompt-box {
  display: grid;
  gap: 9px !important;
  padding: 14px !important;
  border: 1px solid rgba(224, 226, 236, 0.94) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.96) !important;
}

html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) .home-buyer-show-settings .pet-buyer-show-category-menu {
  max-height: 288px;
  overflow-y: auto;
}

@media (max-width: 720px) {
  html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) .home-buyer-show-product-grid,
  html:is([data-industry="home"], [data-industry="jewelry"], [data-industry="accessories"], [data-industry="digital"]) .home-buyer-show-settings .food-buyer-show-person-grid {
    grid-template-columns: 1fr;
  }
}

/* Shared tooltip portal: keep explanations outside clipped cards and scrollers. */
html.aotu-tooltip-portal-ready .detail-style-preset-button[data-detail-style-tip]::before,
html.aotu-tooltip-portal-ready .detail-style-preset-button[data-detail-style-tip]::after,
html.aotu-tooltip-portal-ready .outpaint-preset-grid .choice-button[data-detail-style-tip]::before,
html.aotu-tooltip-portal-ready .outpaint-preset-grid .choice-button[data-detail-style-tip]::after,
html.aotu-tooltip-portal-ready .print-extract-mode-grid .choice-button[data-detail-style-tip]::before,
html.aotu-tooltip-portal-ready .print-extract-mode-grid .choice-button[data-detail-style-tip]::after,
html.aotu-tooltip-portal-ready .detail-card-text-switch[data-detail-style-tip]::before,
html.aotu-tooltip-portal-ready .detail-card-text-switch[data-detail-style-tip]::after,
html.aotu-tooltip-portal-ready body.feature-focus-mode.workstation-feature-mode[data-active-feature="detail-page"] .detail-page-module-card::before {
  display: none !important;
  content: none !important;
}

html.aotu-tooltip-portal-ready body.feature-focus-mode.workstation-feature-mode .inline-model-section > summary > small,
html.aotu-tooltip-portal-ready body.feature-focus-mode.workstation-feature-mode .print-compact-select > summary > small {
  display: none !important;
}

.detail-style-tooltip-portal {
  --detail-tooltip-arrow-x: 50%;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 3000;
  width: max-content;
  max-width: min(260px, calc(100vw - 24px));
  padding: 8px 10px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 10px;
  color: #fff;
  background: #252a38;
  box-shadow: none !important;
  box-sizing: border-box;
  font-size: 11.5px;
  font-weight: 525;
  line-height: 1.4;
  overflow-wrap: anywhere;
  text-align: left;
  white-space: normal;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(4px);
  transition: opacity 0.14s ease, transform 0.14s ease, visibility 0.14s ease;
}

.detail-style-tooltip-portal[hidden] {
  display: none !important;
}

.detail-style-tooltip-portal[data-placement="bottom"] {
  transform: translateY(-4px);
}

.detail-style-tooltip-portal.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.detail-style-tooltip-portal::after {
  position: absolute;
  left: var(--detail-tooltip-arrow-x);
  content: "";
  width: 8px;
  height: 8px;
  background: #252a38;
  box-shadow: none !important;
  pointer-events: none;
}

.detail-style-tooltip-portal[data-placement="top"]::after {
  top: calc(100% - 4px);
  border-right: 1px solid rgba(255, 255, 255, 0.16);
  border-bottom: 1px solid rgba(255, 255, 255, 0.16);
  transform: translateX(-50%) rotate(45deg);
}

.detail-style-tooltip-portal[data-placement="bottom"]::after {
  bottom: calc(100% - 4px);
  border-left: 1px solid rgba(255, 255, 255, 0.16);
  border-top: 1px solid rgba(255, 255, 255, 0.16);
  transform: translateX(-50%) rotate(45deg);
}

@media (prefers-reduced-motion: reduce) {
  .detail-style-tooltip-portal {
    transition: none;
  }
}

/* Keep video model text in the content column when a model has no logo asset. */
body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-select summary.video-profile-no-logo {
  grid-template-columns: minmax(0, 1fr) 34px !important;
}

body.feature-focus-mode.workstation-feature-mode[data-active-feature="video-generate"] .video-profile-menu button.video-profile-no-logo {
  grid-template-columns: minmax(0, 1fr) auto !important;
}

/* Official material library: larger filters and account favorites. */
.official-material-category-row {
  gap: 10px;
  min-height: 44px;
  padding: 2px 0;
}

.official-material-category-row button {
  min-width: 60px;
  height: 40px;
  padding: 0 17px;
  border-color: #d9deec;
  color: #50596d;
  background: #ffffff;
  font-size: 14px;
  font-weight: 650;
  letter-spacing: 0.01em;
}

.official-material-category-row button.official-material-preference-category {
  color: #5b4dcc;
  border-color: #d8d2fb;
  background: #f7f5ff;
}

.official-material-category-row button:hover {
  color: #5546d9;
  border-color: #c9c1ff;
  background: #f5f3ff;
}

.official-material-category-row button.official-material-preference-category:hover {
  color: #4e3fc5;
  border-color: #bbb2f4;
  background: #f0edff;
}

.official-material-category-row button.selected {
  color: #ffffff;
  border-color: #6254e8;
  background: #6254e8;
}

.official-material-category-row button:focus-visible {
  outline: 2px solid #6254e8;
  outline-offset: 2px;
}

.official-material-grid {
  container-name: official-material-grid;
  container-type: inline-size;
  overflow-anchor: none;
}

.official-material-card {
  position: relative;
  display: block;
  opacity: 1;
  cursor: default;
}

.official-material-card:hover,
.official-material-card.selected {
  opacity: 1;
}

.official-material-select {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 6px;
  color: inherit;
  background: transparent;
  cursor: pointer;
}

.official-material-select img {
  transition: opacity 160ms ease;
}

.official-material-select:hover img {
  opacity: 0.88;
}

.official-material-card.selected .official-material-select img {
  opacity: 0.7;
}

.official-material-select:focus-visible,
.official-material-favorite:focus-visible {
  outline: 2px solid #6254e8;
  outline-offset: 2px;
}

.official-material-favorite {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(208, 213, 228, 0.96);
  border-radius: 50%;
  color: #596174;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: none;
  opacity: 0;
  pointer-events: none;
  transform: translateY(4px);
  cursor: pointer;
  transition: color 150ms ease, border-color 150ms ease, background 150ms ease, opacity 150ms ease, transform 150ms ease;
}

.official-material-favorite .lucide {
  width: 19px;
  height: 19px;
  stroke-width: 2;
}

.official-material-card:hover .official-material-favorite,
.official-material-card:focus-within .official-material-favorite,
.official-material-favorite.is-favorite {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.official-material-favorite:hover {
  color: #5b4be8;
  border-color: #bdb4ff;
  background: #f5f3ff;
}

.official-material-favorite.is-favorite {
  color: #5b4be8;
  border-color: #bdb4ff;
  background: #f2efff;
}

.official-material-favorite.is-favorite .lucide {
  fill: currentColor;
}

.official-material-favorite:disabled {
  opacity: 0.56;
  cursor: wait;
}

.official-material-empty {
  gap: 7px;
}

.official-material-empty small {
  display: block;
  max-width: 320px;
  line-height: 1.55;
}

html[data-theme="dark"] .official-material-category-row button {
  color: #cbd3e1;
  border-color: rgba(203, 213, 225, 0.18);
  background: #242b3a;
}

html[data-theme="dark"] .official-material-category-row button.official-material-preference-category {
  color: #d8d2ff;
  border-color: rgba(173, 162, 255, 0.4);
  background: #2c2942;
}

html[data-theme="dark"] .official-material-category-row button:hover {
  color: #ddd8ff;
  border-color: rgba(173, 162, 255, 0.58);
  background: #302b4b;
}

html[data-theme="dark"] .official-material-category-row button.official-material-preference-category:hover {
  color: #ebe8ff;
  border-color: rgba(184, 174, 255, 0.72);
  background: #373151;
}

html[data-theme="dark"] .official-material-category-row button.selected {
  color: #ffffff;
  border-color: #7768ef;
  background: #6657e8;
}

html[data-theme="dark"] .official-material-favorite {
  color: #d8deea;
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(27, 33, 46, 0.94);
}

html[data-theme="dark"] .official-material-favorite:hover,
html[data-theme="dark"] .official-material-favorite.is-favorite {
  color: #d7d1ff;
  border-color: rgba(173, 162, 255, 0.62);
  background: #342e50;
}

@container official-material-grid (width <= 900px) {
  .official-material-columns {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 720px), (hover: none) {
  .official-material-category-row button {
    min-width: 64px;
    height: 44px;
    padding: 0 16px;
  }

  .official-material-favorite {
    width: 44px;
    height: 44px;
    opacity: 1;
    pointer-events: auto;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .official-material-select img,
  .official-material-favorite {
    transition: none;
  }
}

.unified-upload-dialog {
  overscroll-behavior: contain;
}

.unified-upload-dialog .unified-upload-card {
  width: min(1080px, 96vw);
  max-height: min(92dvh, 900px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.unified-upload-dialog .unified-upload-head {
  position: sticky;
  top: -20px;
  z-index: 4;
  margin: -20px -20px 0;
  padding: 20px;
  border-bottom: 1px solid #ece9f5;
  background: #fff;
}

.unified-upload-dialog .unified-upload-actions {
  position: sticky;
  bottom: -20px;
  z-index: 4;
  margin: 0 -20px -20px;
  padding: 12px 20px calc(20px + env(safe-area-inset-bottom));
  border-top: 1px solid #ece9f5;
  background: #fff;
}

.unified-upload-file-rules {
  margin: -6px 0 0;
  color: #747a8d;
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
}

.unified-upload-notice {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid #d9d5f4;
  border-radius: 12px;
  color: #494066;
  background: #f8f6ff;
}

.unified-upload-notice[hidden] {
  display: none;
}

.unified-upload-notice > .lucide {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  color: #6254e8;
}

.unified-upload-notice > span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.unified-upload-notice strong,
.unified-upload-notice small {
  line-height: 1.4;
}

.unified-upload-notice small {
  color: #747a8d;
}

.unified-upload-notice.is-warn,
.unified-upload-notice.is-error {
  border-color: #efcbd0;
  color: #9d3545;
  background: #fff7f8;
}

.unified-upload-notice.is-busy > .lucide {
  animation: unified-upload-spinner 800ms linear infinite;
}

@keyframes unified-upload-spinner {
  to {
    transform: rotate(360deg);
  }
}

.unified-upload-card.is-upload-busy {
  cursor: progress;
}

html[data-theme="dark"] .unified-upload-dialog .unified-upload-head,
html[data-theme="dark"] .unified-upload-dialog .unified-upload-actions,
html[data-theme="dark"] .unified-upload-dialog .unified-upload-card,
html[data-theme="dark"] .detail-dialog-upload-slot {
  border-color: #3b4052;
  color: #edf0f7;
  background: #202431;
}

html[data-theme="dark"] .unified-upload-dropzone,
html[data-theme="dark"] .detail-dialog-upload-zone,
html[data-theme="dark"] .detail-dialog-upload-thumb {
  border-color: #485063;
  color: #edf0f7;
  background: #252a38;
}

html[data-theme="dark"] .unified-upload-section-head strong,
html[data-theme="dark"] .detail-dialog-upload-slot strong {
  color: #edf0f7;
}

html[data-theme="dark"] .unified-upload-file-rules,
html[data-theme="dark"] .unified-upload-notice small {
  color: #aeb5c6;
}

@media (max-width: 720px) {
  .unified-upload-dialog {
    padding: 10px;
  }

  .unified-upload-dialog .unified-upload-card {
    width: 100%;
    max-height: calc(100dvh - 20px);
    padding: 16px;
  }

  .unified-upload-dialog .unified-upload-head {
    top: -16px;
    margin: -16px -16px 0;
    padding: 16px;
  }

  .unified-upload-dialog .unified-upload-actions {
    bottom: -16px;
    margin: 0 -16px -16px;
    padding: 10px 16px calc(16px + env(safe-area-inset-bottom));
  }

  .unified-upload-dialog .unified-upload-actions .create-button {
    width: 100%;
    min-height: 48px;
  }

  .unified-upload-dialog .detail-dialog-upload-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .unified-upload-dialog .detail-dialog-upload-slot {
    padding: 8px 6px;
  }

  .unified-upload-dialog .detail-dialog-upload-thumb {
    height: auto;
    min-height: 88px;
    aspect-ratio: 3 / 4;
  }
}

@media (prefers-reduced-motion: reduce) {
  .unified-upload-notice.is-busy > .lucide {
    animation: none;
  }
}
/* Auxiliary upload targets use the same visible drag affordance as the primary uploader. */
:is(
  .detail-dialog-upload-zone,
  .secondary-reference-upload,
  .background-upload-button,
  .color-reference-upload,
  .pattern-upload-button,
  .pose-upload-reference-button
).is-dragover {
  outline: 2px solid #6254e8 !important;
  outline-offset: 2px !important;
  border-color: #7a68ea !important;
  background-color: #f6f3ff !important;
  box-shadow: none !important;
}


/* Keep destructive upload actions large enough to distinguish and tap reliably. */
body .upload-stack-delete {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
}

body #upload-clear-x {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
}

@media (max-width: 720px), (hover: none) {
  body :is(.upload-stack-delete, #upload-clear-x) {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
  }
}
/* Official material first-load recovery */
.official-material-empty [data-official-material-retry] {
  min-height: 36px;
  margin-top: 4px;
  padding: 0 18px;
  border: 1px solid #d9d3ff;
  border-radius: 999px;
  color: #5b4be8;
  background: #fff;
  font-size: 13px;
  font-weight: 650;
  cursor: pointer;
}

.official-material-empty [data-official-material-retry]:hover {
  border-color: #8d7cff;
  background: #f7f5ff;
}

html[data-theme="dark"] .official-material-empty [data-official-material-retry] {
  color: #c7bfff;
  border-color: rgba(173, 162, 255, 0.45);
  background: #242b3a;
}