/* Saved-video Scenes only. Decorative layers never intercept controls or media. */
.project-scenes-header-art { display: none; }
body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) .topbar {
  align-items: center; box-sizing: border-box; gap: 24px; isolation: isolate; min-height: 132px;
  padding: 12px 0 20px; position: relative;
}
body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) .topbar .title-row {
  flex: 1 1 auto; gap: 24px; min-width: 0; position: relative;
}
body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) .topbar .title-icon {
  background: radial-gradient(ellipse at 0 0, color-mix(in srgb,var(--sia-sidebar-accent) 22%,transparent),transparent 65%), var(--sia-surface-soft) !important;
  border: 1px solid var(--sia-sidebar-active-line); border-radius: 22px;
  box-shadow: inset 0 1px 0 color-mix(in srgb,var(--sia-sidebar-accent) 16%,transparent), 0 0 20px color-mix(in srgb,var(--sia-teal) 8%,transparent);
  flex: 0 0 80px; height: 80px; width: 80px;
}
body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) .topbar .title-icon svg { height: 38px; width: 38px; stroke-width: 1.7; }
body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) #pageTitle { font-size: clamp(36px,3.2vw,48px); line-height: 1.1; letter-spacing: -.025em; }
body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) #pageLead { font-size: 15px; line-height: 1.55; margin-top: 8px; }
body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) .project-scenes-header-art {
  color: var(--sia-sidebar-accent); display: block; height: 100%; inset: 0 0 auto auto;
  mask-image: linear-gradient(90deg,transparent,transparent 32%,#000 72%,transparent),linear-gradient(0deg,transparent,#000 24%,#000 78%,transparent);
  mask-composite: intersect; max-width: 760px; overflow: hidden; pointer-events: none; position: absolute; width: 65%; z-index: -1;
}
.project-scenes-header-art svg { display: block; height: 100%; width: 100%; }
#projectScenesWorkspace .scene-storyboard-art { color: var(--sia-sidebar-accent); display: block; flex: none; height: 96px; max-width: 100%; pointer-events: none; width: 200px; }
.scene-storyboard-art svg { display: block; height: 100%; overflow: visible; width: 100%; }
.scene-storyboard-art .scene-art-shadow { fill: currentColor; opacity: .055; }
.scene-storyboard-art .scene-art-orbit { fill: none; opacity: .2; stroke: currentColor; stroke-dasharray: 2 5; stroke-width: 1; }
.scene-storyboard-art .scene-art-back { opacity: .6; }
.scene-storyboard-art .scene-art-card { fill: var(--sia-surface); stroke: color-mix(in srgb,var(--sia-sidebar-accent) 35%,var(--sia-line)); stroke-width: 1.2; }
.scene-storyboard-art .scene-art-front { stroke: color-mix(in srgb,var(--sia-sidebar-accent) 70%,var(--sia-line)); }
.scene-storyboard-art .scene-art-window { fill: color-mix(in srgb,var(--sia-sidebar-accent) 8%,var(--sia-surface)); }
.scene-storyboard-art .scene-art-line { fill: none; opacity: .6; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5; }
.scene-storyboard-art .scene-art-landscape { fill: color-mix(in srgb,var(--sia-sidebar-accent) 13%,var(--sia-surface)); stroke: currentColor; stroke-linejoin: round; stroke-opacity: .5; stroke-width: 1.2; }
.scene-storyboard-art .scene-art-sun { fill: currentColor; opacity: .6; }
.scene-storyboard-art .scene-art-spark { fill: none; opacity: .65; stroke: currentColor; stroke-linecap: round; stroke-width: 1.5; }
#projectScenesWorkspace .scene-workflow-head { gap: 8px; }
@media (max-width: 1200px) {
  body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) .project-scenes-header-art { opacity: .18; }
}
@media (max-width: 600px) {
  body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) .topbar { align-items: stretch; flex-direction: column; gap: 20px; min-height: 0; padding: 12px 0 24px; }
  body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) .topbar .title-row { align-items: flex-start; flex: none; gap: 16px; width: 100%; }
  body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) .topbar .title-icon { border-radius: 18px; flex-basis: 64px; height: 64px; width: 64px; }
  body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) .topbar .title-icon svg { height: 32px; width: 32px; }
  body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) #pageTitle { font-size: 32px; }
  body:has(#detailView:not([hidden]) #projectScenesWorkspace:not([hidden])) .project-scenes-header-art { width: 100%; }
  #projectScenesWorkspace .scene-storyboard-art { height: 84px; width: 176px; }
}