/* Woops! story extras. Wrapper must carry class="ns-page ns-woops"; everything else comes from story.css. */
.ns-page.ns-woops .ns-hero-logo { height: 30px; width: auto; margin-right: .75rem; }

/* Source bullet lists inside the text column */
.ns-page.ns-woops .ns-sec > ul { margin-top: 1rem; padding-left: 1.25rem; list-style: disc; display: grid; gap: .4rem; max-width: 64ch; font-size: 1.125rem; line-height: 1.6; color: var(--ink-2); }
.ns-page.ns-woops .ns-sec > ul li::marker { color: var(--orange); }

/* Brand photography and product screenshot */
.ns-page.ns-woops .ns-photo-frame { border-radius: var(--radius); overflow: hidden; aspect-ratio: 2 / 1; background: var(--bg-soft); box-shadow: var(--shadow-1); }
.ns-page.ns-woops .ns-photo-frame img { width: 100%; height: 100%; object-fit: cover; }
.ns-page.ns-woops .ns-shot-frame { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: .5rem; box-shadow: var(--shadow-2); }
.ns-page.ns-woops .ns-shot-frame img { width: 100%; height: auto; aspect-ratio: 1512 / 828; border-radius: 10px; }

/* Three-step review path */
.ns-page.ns-woops .ns-path-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

@media (max-width: 640px) {
  
  .ns-page.ns-woops .ns-photo-frame { aspect-ratio: 4 / 3; }
  .ns-page.ns-woops .ns-sec > ul { font-size: 1.0625rem; }
  .ns-page.ns-woops .ns-path-3 { grid-template-columns: minmax(0, 1fr); }
}

.ns-page.ns-woops .ns-glance-logo { filter: brightness(0); width: 150px; height: auto; }
.ns-page.ns-woops .ns-badge.ns-step { background: var(--bg-soft); color: var(--ink); }