/**
 * PromXAI Theme 1.4.15.20
 * Clean modal visual system.
 *
 * Light mode is the structural source of truth. The embedded document always
 * keeps the light layout cascade; dark mode is a palette class only.
 */

/* -------------------------------------------------------------------------
   Parent page: one modal, one real page behind it, one backdrop.
   ------------------------------------------------------------------------- */
.px-prompt-modal[hidden] { display: none !important; }

.px-prompt-modal {
  position: fixed;
  z-index: 2147482000;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  inset: 0;
  display: block;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  isolation: isolate;
  transition: opacity 140ms ease, visibility 140ms ease;
}

.px-prompt-modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.px-prompt-modal__backdrop {
  position: absolute;
  z-index: 0;
  inset: 0;
  /* test385 — stronger blur while keeping the browse-through glass.
     The restored transparent backdrop is correct, but the underlying archive
     still reads brighter than desired. Increase optical blur and gently lower
     backdrop brightness so the page behind stays visible as a softer silhouette
     instead of a readable bright layer. */
  background:
    radial-gradient(circle at 18% 18%, rgba(255,255,255,.08), transparent 34%),
    radial-gradient(circle at 82% 22%, rgba(124,154,255,.05), transparent 32%),
    rgba(14, 22, 38, .065);
  -webkit-backdrop-filter: blur(18px) saturate(112%) brightness(.955) contrast(1.02);
  backdrop-filter: blur(18px) saturate(112%) brightness(.955) contrast(1.02);
}

html[data-theme="dark"] .px-prompt-modal__backdrop {
  background:
    radial-gradient(circle at 18% 18%, rgba(74,128,255,.08), transparent 34%),
    radial-gradient(circle at 82% 20%, rgba(170,103,255,.06), transparent 32%),
    rgba(5, 10, 22, .22);
  -webkit-backdrop-filter: blur(18px) saturate(116%) brightness(.88) contrast(1.03);
  backdrop-filter: blur(18px) saturate(116%) brightness(.88) contrast(1.03);
}

html[data-theme="dark"] .px-prompt-modal__frame {
  color-scheme: dark;
}

.px-prompt-modal__frame {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  outline: 0;
  background: transparent !important;
  opacity: 0;
  color-scheme: light;
  transition: opacity 120ms ease;
}

.px-prompt-modal.is-loaded .px-prompt-modal__frame { opacity: 1; }

.px-prompt-modal__loader {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  width: 34px;
  height: 34px;
  transform: translate(-50%, -50%);
  pointer-events: none;
  transition: opacity 100ms ease;
}

.px-prompt-modal.is-loaded .px-prompt-modal__loader { opacity: 0; }

.px-prompt-modal__loader span {
  display: block;
  width: 100%;
  height: 100%;
  border: 3px solid rgba(120, 130, 160, .20);
  border-top-color: #7b3ff2;
  border-radius: 50%;
  animation: px-prompt-modal-spin .72s linear infinite;
}

@keyframes px-prompt-modal-spin { to { transform: rotate(360deg); } }

html.px-prompt-modal-open,
body.px-prompt-modal-open {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

body.px-prompt-modal-open > .px-header,
body.px-prompt-modal-open > .px-mobile-nav,
body.px-prompt-modal-open > .px-toast,
body.px-prompt-modal-open > .px-drawer-backdrop {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* -------------------------------------------------------------------------
   Embedded prompt document: transparent canvas, no duplicate chrome.
   ------------------------------------------------------------------------- */
html.promxai-modal-document,
html.promxai-modal-document body.promxai-modal-embed {
  min-height: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  color-scheme: light !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html.promxai-modal-document body.promxai-modal-embed::before,
html.promxai-modal-document body.promxai-modal-embed::after {
  content: none !important;
  display: none !important;
}

body.promxai-modal-embed #wpadminbar,
body.promxai-modal-embed .px-skip-link,
body.promxai-modal-embed .px-toast,
body.promxai-modal-embed .px-mobile-nav,
body.promxai-modal-embed .px-prompt-tabs,
body.promxai-modal-embed .px-prompt-tabs > button,
body.promxai-modal-embed .px-prompt-panel {
  animation: none !important;
}

body.promxai-modal-embed.px-prompt-language-switching :where(
  .px-prompt-tabs,
  .px-prompt-tabs > button,
  .px-prompt-panel,
  .px-prompt-text
) {
  transition: none !important;
  animation: none !important;
}

body.promxai-modal-embed .px-prompt-panel[hidden] { display: none !important; }

@media (min-width: 761px) {
  /* Every ancestor on the visual side remains truly transparent. */
  html.promxai-modal-document body.promxai-modal-embed :where(
    .px-main,
    .px-prompt-detail-v2,
    .px-prompt-detail-140,
    .px-detail-v2-grid,
    .px-detail-136-grid,
    .px-detail-139-grid,
    .px-media35,
    .px-media35-shell,
    .px-media35-layout,
    .px-media35-stage,
    .px-media35-side
  ) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
  }

  html.promxai-modal-document body.promxai-modal-embed :where(
    .px-prompt-detail-140,
    .px-detail-136-grid,
    .px-detail-139-grid,
    .px-media35,
    .px-media35-shell,
    .px-media35-layout,
    .px-media35-stage,
    .px-media35-side
  ) {
    box-shadow: none !important;
    filter: none !important;
  }

  body.promxai-modal-embed .px-prompt-detail-140 {
    box-sizing: border-box !important;
    width: min(100%, 1660px) !important;
    max-width: 1660px !important;
    height: 100svh !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 12px clamp(18px, 2.2vw, 38px) !important;
  }

  /* The toolbar is moved by JS to this grid before the iframe is revealed.
     Therefore X, toolbar and panel share one actual grid row. */
  body.promxai-modal-embed .px-detail-136-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.94fr) minmax(350px, .90fr) !important;
    grid-template-rows: 42px minmax(0, 1fr) !important;
    column-gap: clamp(22px, 2.4vw, 40px) !important;
    row-gap: 14px !important;
    box-sizing: border-box !important;
    height: calc(100svh - 24px) !important;
    min-height: 0 !important;
    max-height: calc(100svh - 24px) !important;
    padding: 0 !important;
    overflow: hidden !important;
    align-items: stretch !important;
    direction: ltr !important;
  }

  body.promxai-modal-embed .px-media117-topbar {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: start !important;
    width: 100% !important;
    min-height: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 2px !important;
    transform: none !important;
  }

  body.promxai-modal-embed .px-media35 {
    grid-column: 1 !important;
    grid-row: 2 !important;
    align-self: stretch !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body.promxai-modal-embed .px-media35-shell,
  body.promxai-modal-embed .px-media35-layout {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border-color: transparent !important;
    transform: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  /* Keep the complete visual side aligned identically in light and dark.
     X, toolbar, main media, arrows and thumbnails move as one unit. */
  body.promxai-modal-embed {
    --px-modal-visual-drop: 10px;
  }

  body.promxai-modal-embed .px-media117-topbar {
    transform: translateY(var(--px-modal-visual-drop)) !important;
  }

  body.promxai-modal-embed .px-media35 {
    height: calc(100% - var(--px-modal-visual-drop)) !important;
    max-height: calc(100% - var(--px-modal-visual-drop)) !important;
    transform: translateY(var(--px-modal-visual-drop)) !important;
  }

  body.promxai-modal-embed .px-right-panel {
    grid-column: 2 !important;
    grid-row: 1 / 3 !important;
    align-self: stretch !important;
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    transform: none !important;
  }

  body.promxai-modal-embed .px-right-panel::before,
  body.promxai-modal-embed .px-right-panel::after {
    content: none !important;
    display: none !important;
  }

  body.promxai-modal-embed .px-right-panel__scroll {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border: 1px solid transparent !important;
    border-radius: 34px !important;
    background:
      linear-gradient(158deg, rgba(255,255,255,.90), rgba(246,249,253,.86)) padding-box,
      linear-gradient(145deg, rgba(40,111,213,.24), rgba(105,69,202,.19) 58%, rgba(188,67,190,.10)) border-box !important;
    box-shadow:
      0 24px 58px rgba(51,69,106,.13),
      0 9px 22px rgba(68,84,122,.075),
      inset 0 1px 0 rgba(255,255,255,.92) !important;
    -webkit-backdrop-filter: blur(18px) saturate(108%) !important;
    backdrop-filter: blur(18px) saturate(108%) !important;
  }

  /* X remains one compact control. */
  body.promxai-modal-embed .px-media61-close-anchor {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    gap: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    cursor: pointer !important;
  }

  body.promxai-modal-embed .px-media61-close-anchor::before,
  body.promxai-modal-embed .px-media61-close-anchor::after {
    content: none !important;
    display: none !important;
  }

  body.promxai-modal-embed .px-media61-close-anchor__glyph {
    display: block !important;
    font-family: Arial, sans-serif !important;
    font-size: 30px !important;
    font-weight: 300 !important;
    line-height: 1 !important;
    transform: translateY(-1px) !important;
  }

  /* Circular gallery navigation is always available. */
  body.promxai-modal-embed .px-media35-arrow,
  body.promxai-modal-embed .px-media35-arrow:disabled {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    transition: transform 170ms cubic-bezier(.22,1,.36,1), color 150ms ease, border-color 150ms ease, background 150ms ease, box-shadow 170ms ease !important;
  }

  body.promxai-modal-embed .px-media35-arrow--prev svg {
    transform: rotate(180deg) !important;
    transform-origin: center !important;
  }

  body.promxai-modal-embed .px-media35-arrow--next svg {
    transform: rotate(0deg) !important;
    transform-origin: center !important;
  }

  body.promxai-modal-embed .px-media35-arrow:hover,
  body.promxai-modal-embed .px-media35-arrow:focus-visible {
    color: #fff !important;
    border-color: rgba(35,49,77,.42) !important;
    background: linear-gradient(180deg, rgba(58,72,101,.96), rgba(34,46,72,.94)) !important;
    box-shadow: 0 14px 28px rgba(40,54,82,.20), inset 0 1px 0 rgba(255,255,255,.16) !important;
    transform: translateY(-3px) scale(1.045) !important;
    outline: none !important;
  }

  body.promxai-modal-embed .px-media35-arrow:active {
    transform: translateY(-1px) scale(.975) !important;
    transition-duration: 70ms !important;
  }


  /* -----------------------------------------------------------------------
     Dark modal palette — the approved light geometry remains untouched.
     These selectors intentionally exceed the specificity of historical
     html[data-theme="light"] prompt rules so dark colours always win.
     ----------------------------------------------------------------------- */
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark {
    color-scheme: dark !important;
    --px-text-primary: #f5f7ff;
    --px-text-secondary: #b9c4d8;
    --px-text-control: #edf3ff;
    --px-line: rgba(156, 174, 212, .16);
    --px-control-surface: rgba(18, 27, 44, .72);
    color: #f5f7ff !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 :where(
    .px-detail-136-grid,
    .px-detail-139-grid,
    .px-media35,
    .px-media35-shell,
    .px-media35-stage,
    .px-media35-layout,
    .px-media35-visual,
    .px-media35-side,
    .px-media35-thumbs
  ) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140::before,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140::after,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-detail-136-grid::before,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-detail-136-grid::after,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-shell::before,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-shell::after,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-stage::before,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-stage::after {
    content: none !important;
    display: none !important;
    background: transparent !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-right-panel::before,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-right-panel::after {
    content: none !important;
    display: none !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-right-panel__scroll {
    color: #f5f7ff !important;
    border-color: rgba(132, 151, 195, .17) !important;
    background:
      linear-gradient(158deg, rgba(17, 25, 41, .91), rgba(8, 14, 26, .88)) padding-box,
      linear-gradient(145deg, rgba(47, 140, 255, .34), rgba(123, 63, 242, .28) 58%, rgba(255, 46, 209, .14)) border-box !important;
    box-shadow:
      0 26px 62px rgba(1, 5, 16, .29),
      0 10px 25px rgba(2, 8, 24, .16),
      inset 0 1px 0 rgba(255, 255, 255, .055) !important;
    -webkit-backdrop-filter: blur(20px) saturate(114%) !important;
    backdrop-filter: blur(20px) saturate(114%) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-right-panel__scroll > :where(.px-prompt-head, .px-prompt-copy-card, .px-related-inline) {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 :where(
    .px-prompt-head h1,
    .px-prompt-head h2,
    .px-prompt-head h3,
    .px-prompt-scene-label,
    .px-prompt-tabs > button,
    .px-related-inline__head h2,
    .px-related-view-all
  ) {
    color: #f5f7ff !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 :where(.px-project-summary, .px-prompt-text p) {
    color: #c1cada !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 :where(
    .px-explain-button,
    .px-prompt-scene-switcher,
    .px-prompt-scene-button,
    .px-prompt-tabs > button,
    .px-prompt-text,
    .px-related-view-all
  ) {
    color: #edf3ff !important;
    border-color: rgba(150, 167, 205, .17) !important;
    background: rgba(255, 255, 255, .038) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .048) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-prompt-scene-button:is(.is-active, [aria-current="true"]),
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-prompt-tabs > button.is-active {
    color: #ffffff !important;
    border-color: rgba(116, 99, 224, .44) !important;
    background: linear-gradient(135deg, rgba(47, 140, 255, .14), rgba(123, 63, 242, .15)) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 0 0 1px rgba(123, 63, 242, .06) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 :where(.px-copy-button, .px-primary-button) {
    color: #ffffff !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-related-mini {
    border-color: rgba(150, 167, 205, .14) !important;
    background: rgba(11, 18, 31, .72) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .20) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-right-scroll-indicator__thumb {
    background: linear-gradient(180deg, #2f8cff, #7b3ff2 62%, #ff2ed1) !important;
    box-shadow: 0 0 8px rgba(123, 63, 242, .18) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 :where(.px-media61-close-anchor, .px-media117-tool-group) {
    color: #edf3ff !important;
    border-color: rgba(255, 255, 255, .12) !important;
    background: linear-gradient(180deg, rgba(24, 34, 54, .78), rgba(11, 18, 32, .68)) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .19), inset 0 1px 0 rgba(255, 255, 255, .06) !important;
    -webkit-backdrop-filter: blur(17px) saturate(132%) !important;
    backdrop-filter: blur(17px) saturate(132%) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 :where(.px-media35-ratio-badge, .px-media35-counter, .px-media35-tool) {
    color: #edf3ff !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-ratio-badge::after {
    background: rgba(255, 255, 255, .12) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-tool:hover,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-tool:focus-visible {
    color: #ffffff !important;
    background: rgba(255, 255, 255, .09) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-detail-theme-toggle .px-theme-icon {
    display: none !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-detail-theme-toggle .px-theme-icon--moon {
    display: inline-grid !important;
    place-items: center !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-detail-theme-toggle .px-theme-icon--sun {
    display: none !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media117-frame {
    border-color: rgba(119, 143, 193, .22) !important;
    background: rgba(5, 9, 17, .44) !important;
    box-shadow: 0 22px 50px rgba(0, 0, 0, .25), 0 0 0 1px rgba(255, 255, 255, .035), 0 0 22px rgba(123, 63, 242, .10) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media117-frame::before {
    content: none !important;
    display: none !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media117-frame::after {
    border-color: rgba(255, 255, 255, .08) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10), inset 0 0 0 1px rgba(0, 0, 0, .04) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-thumb {
    border-color: rgba(137, 156, 198, .13) !important;
    background: rgba(8, 14, 25, .58) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .16) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-thumb:not(.is-active):not([aria-current="true"]) {
    opacity: .62 !important;
    filter: saturate(.76) brightness(.78) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-thumb:is(.is-active, [aria-current="true"]) {
    opacity: 1 !important;
    filter: none !important;
    border-color: rgba(105, 136, 255, .68) !important;
    box-shadow: 0 0 0 1px rgba(123, 63, 242, .16), 0 0 20px rgba(75, 94, 239, .20) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-arrow,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-arrow:disabled {
    color: #edf3ff !important;
    border-color: rgba(255, 255, 255, .14) !important;
    background: rgba(13, 21, 36, .70) !important;
    box-shadow: 0 12px 26px rgba(0, 0, 0, .20), inset 0 1px 0 rgba(255, 255, 255, .06) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-arrow:hover,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-arrow:focus-visible {
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, .29) !important;
    background: linear-gradient(180deg, rgba(58, 72, 101, .93), rgba(31, 42, 66, .88)) !important;
    box-shadow: 0 14px 28px rgba(0, 0, 0, .23), 0 0 18px rgba(123, 63, 242, .16), inset 0 1px 0 rgba(255, 255, 255, .12) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 :where(.px-media-lightbox__panel, .px-media-lightbox__tools) {
    color: #f5f7ff !important;
    border-color: rgba(255, 255, 255, .12) !important;
    background: rgba(8, 13, 24, .90) !important;
  }
}

@media (min-width: 761px) and (max-width: 1180px) {
  body.promxai-modal-embed .px-detail-136-grid {
    grid-template-columns: minmax(0, 1.55fr) minmax(330px, .95fr) !important;
    column-gap: 18px !important;
  }
}

@media (max-width: 760px) {
  .px-prompt-modal { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .px-prompt-modal,
  .px-prompt-modal__frame,
  .px-prompt-modal__loader {
    transition: none !important;
    animation: none !important;
  }
}


/* ========================================================================
   PromXAI Theme 1.4.15.23 — matched gallery controls and favorite state
   - Same navigation-circle geometry in light and dark.
   - Saved heart is unmistakable in both palettes.
   ======================================================================== */
@media (min-width: 761px) {
  body.promxai-modal-embed .px-media35-arrow,
  body.promxai-modal-embed .px-media35-arrow:disabled {
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    border-radius: 50% !important;
    border: 1px solid rgba(68, 86, 120, .20) !important;
    color: #32415f !important;
    background: rgba(255, 255, 255, .76) !important;
    box-shadow: 0 10px 24px rgba(64, 82, 116, .13), inset 0 1px 0 rgba(255,255,255,.94) !important;
    -webkit-backdrop-filter: blur(12px) saturate(110%) !important;
    backdrop-filter: blur(12px) saturate(110%) !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-arrow,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-arrow:disabled {
    border-color: rgba(116, 151, 219, .34) !important;
    color: #eef5ff !important;
    background: linear-gradient(180deg, rgba(34, 49, 76, .88), rgba(18, 29, 49, .84)) !important;
    box-shadow: 0 12px 28px rgba(0,0,0,.25), 0 0 18px rgba(65,132,255,.12), inset 0 1px 0 rgba(255,255,255,.10) !important;
  }

  body.promxai-modal-embed .px-media35-tool[data-favorite-id].is-saved,
  body.promxai-modal-embed .px-media35-tool[data-favorite-id][aria-pressed="true"] {
    color: #fff !important;
    border-color: rgba(255,255,255,.28) !important;
    background: linear-gradient(135deg, #3b82f6 0%, #7c3aed 52%, #d946ef 100%) !important;
    box-shadow: 0 0 0 1px rgba(98,126,255,.18), 0 0 20px rgba(168,85,247,.30), 0 9px 20px rgba(31,41,76,.18), inset 0 1px 0 rgba(255,255,255,.24) !important;
    transform: translateY(-1px) scale(1.035) !important;
  }

  body.promxai-modal-embed .px-media35-tool[data-favorite-id].is-saved .px-icon path,
  body.promxai-modal-embed .px-media35-tool[data-favorite-id][aria-pressed="true"] .px-icon path {
    fill: currentColor !important;
    stroke: currentColor !important;
  }

  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-tool[data-favorite-id].is-saved,
  html[data-theme="light"].promxai-modal-document.px-modal-theme-dark-root body.promxai-modal-embed.promxai-prompt-focus.px-modal-theme-dark .px-prompt-detail-140 .px-media35-tool[data-favorite-id][aria-pressed="true"] {
    border-color: rgba(163, 196, 255, .42) !important;
    box-shadow: 0 0 0 1px rgba(99,145,255,.22), 0 0 24px rgba(167,89,255,.38), 0 10px 24px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.28) !important;
  }
}

/* ========================================================================
   test479 — Desktop video parent-motion freeze (no visual redesign)
   test360 predates the canonical global ambient planes; test459 renders those
   oversized fixed animations continuously behind the transparent Prompt iframe.
   While a Desktop/Laptop VIDEO prompt is open, freeze that parent-only motion
   in place so the decoder/compositor owns the frame budget. The current glass,
   transparency, blur, colors, geometry and iframe remain unchanged. Phone and
   image prompts never receive this state.
   ======================================================================== */
@media (min-width:761px) {
  html.px-prompt-modal-video-open:not(.promxai-modal-document)::before,
  html.px-prompt-modal-video-open:not(.promxai-modal-document)::after {
    animation-play-state:paused!important;
    will-change:auto!important;
  }

  body.px-prompt-modal-video-open > :not(.px-prompt-modal),
  body.px-prompt-modal-video-open > :not(.px-prompt-modal) *,
  body.px-prompt-modal-video-open > :not(.px-prompt-modal)::before,
  body.px-prompt-modal-video-open > :not(.px-prompt-modal)::after,
  body.px-prompt-modal-video-open > :not(.px-prompt-modal) *::before,
  body.px-prompt-modal-video-open > :not(.px-prompt-modal) *::after {
    animation-play-state:paused!important;
  }
}


/* ========================================================================
   PromXAI Theme 2.0.21-test503 — Canonical Desktop Prompt Jump Scroll Ownership
   Desktop/Laptop Prompt Detail modal only.

   Root cause verified from test492 runtime:
   `.px-prompt-copy-card` inherited `overflow:hidden !important` between the
   sticky jump controls and the real `.px-right-panel__scroll` owner. That
   made the copy card the sticky containment ancestor, so ↑/↓ scrolled out
   with the card instead of remaining pinned inside the prompt viewport.

   The modal's final owner removes only that false containment boundary and
   restores immediate scrolling on the existing right-panel owner. No new
   scroller, listener, timer, overlay, transform, fixed layer, portal, or
   duplicate navigation owner is introduced. Phone remains untouched.
   ======================================================================== */
@media (min-width: 981px) {
  body.promxai-modal-embed.single-promxai_prompt .px-prompt-detail-140 .px-right-panel__scroll {
    scroll-behavior: auto !important;
  }

  body.promxai-modal-embed.single-promxai_prompt .px-prompt-detail-140 .px-right-panel__scroll > .px-prompt-copy-card {
    overflow: visible !important;
  }
}