Give the header scrolled colours and equal card heights in 1.11.1

Cards, quotes and call-to-action bands side by side in a row are equal in
height again: the stacking margin meant for a column no longer applies inside
a row. The header can carry a second set of colours for the scrolled page,
the Flatsome transparent header: a "scrolled" state next to "hover", limited
to colours, shadow and opacity, marked by a small script only where it is
used, plus a setting that lets the header float over the first section.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

public/assets/editor.js

@@ -877,6 +877,11 @@ async function updatePreview() {
       });
       doc.addEventListener('mousedown', event => { if (event.button === 0) closeContextMenu(); });
       doc.addEventListener('keydown', onKey);
+      // The preview runs no script, so the scrolled state of the header is marked from here -
+      // the same rule scrolled.js applies on the public page.
+      const markScrolled = () => doc.documentElement.classList.toggle('is-scrolled', (doc.defaultView?.scrollY ?? 0) > 40);
+      doc.defaultView?.addEventListener('scroll', markScrolled, { passive: true });
+      markScrolled();
       doc.addEventListener('submit', event => event.preventDefault());
       // The head may arrive before the blocks. Decorate only once the complete DOM exists.
       const finish = () => {
@@ -947,6 +952,7 @@ async function loadDesignSchema() {
       onDevice: setViewport,
       getSelection: () => selected,
       getHistory: () => history,
+      getAreaKind: () => root.dataset.kind,
     });
   } catch {
     // The editor stays usable without it; the panel says so.