/* GENERATED by scripts/build-wp-flyer-plugin.js from flyer.html - do not edit here; change flyer.html and re-run the script. */
/* Everything between the FFC:CSS markers is copied into the WordPress plugin (scripts/build-wp-flyer-plugin.js),
     so it may only style the modal / cart / fab classes: no :root, html, body or bare element selectors.
     The tokens and base type below are scoped to the three roots (the plugin cannot rely on this page's :root/body).
     Look = the approved "Flyer Cart Restyle" mock (2026-10-16): cream sheet, Food Fare red, Playfair title, Inter text.
     The logo is a background image on .ffm-head::before; the build script points it at the plugin's own copy. */

  /* Theme reset (keep this the FIRST rule; the build refuses it anywhere else): a WordPress theme styles bare tags
     (button { margin:5px 0; text-transform:uppercase; letter-spacing:.5px ... }, h2, p, a ...). :where() adds no
     specificity, so this is (0,1,0): it beats a theme's bare-tag rules, and every class rule below that sets one of
     these properties (kicker caps, brand caps, tracked labels, the margins we choose) comes later at the same
     specificity and still wins. */
  .ffm-backdrop :where(button,a,h2,h3,p,img,small,output,b,span), .ffl-fab, .ffm-toast { margin:0; text-transform:none;
    letter-spacing:normal; text-shadow:none; min-width:0; float:none; }
  /* foodfare.com's theme ships a bare `path { display:none }` that blanks every inline SVG icon (close, remove, in-cart
     check, cart). (0,1,1) beats it; inline is the SVG shapes' own default. Found in the live-theme check, 2026-10-16. */
  .ffm-backdrop svg :where(path,circle,rect,line,polyline,polygon,ellipse,g),
  .ffl-fab svg :where(path,circle,rect,line,polyline,polygon,ellipse,g) { display:inline; }

  .ffm-backdrop, .ffl-fab, .ffm-toast { --red:#E31E24; --red-text:#C8161D; --ink:#1A1A1A; --sheet:#FBF4E8; --card:#FFFFFF;
    --tile:#F6F1E8; --line:#E8DFD0; --muted:#6B6560; --grab:#D9CFBF; --green:#1F7A3A; --backdrop:rgba(26,26,26,.55);
    font-family:Inter,-apple-system,"Segoe UI",Roboto,sans-serif; font-size:16px; font-weight:400; line-height:normal;
    letter-spacing:normal; text-transform:none; text-align:left; color:var(--ink); }
  .ffm-backdrop *, .ffm-backdrop *::before, .ffm-backdrop *::after, .ffl-fab, .ffl-fab *, .ffm-toast { box-sizing:border-box; }
  .ffm-backdrop :focus-visible, .ffl-fab:focus-visible { outline:3px solid var(--red); outline-offset:2px; }

  /* ── Sheet / card ───────────────────────────────────────────────────── */
  .ffm-backdrop { position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center;
    padding:24px; background:var(--backdrop); animation:ffm-fade .22s ease-out both; }
  .ffm-backdrop[hidden] { display:none; }
  .ffm-backdrop.ffm-out { animation:ffm-fade .18s ease-in reverse both; }
  .ffm-card { position:relative; display:flex; flex-direction:column; width:min(880px,100%);
    max-height:min(688px,calc(100vh - 48px)); background:var(--sheet); color:var(--ink); border-radius:24px; overflow:hidden;
    box-shadow:0 24px 64px rgba(26,26,26,.28); animation:ffm-pop .46s cubic-bezier(.2,1,.32,1) both; }
  .ffm-out .ffm-card { animation:ffm-drop .18s ease-in both; }
  .ffm-close { position:absolute; top:28px; right:32px; z-index:2; width:44px; height:44px; padding:0;
    display:grid; place-items:center; border:1.5px solid var(--ink); border-radius:50%; background:var(--card); color:var(--ink);
    cursor:pointer; transition:background .15s, color .15s; }
  .ffm-close svg, .ffl-rm svg, .ffm-tag svg, .ffl-fab svg { display:block; flex:none; pointer-events:none; }
  .ffm-close:hover { background:var(--ink); color:var(--card); }

  /* ── Head: logo, red rule, kicker, title, sub, store chip ───────────── */
  .ffm-head { padding:28px 32px 0; }
  .ffm-head::before { content:''; display:block; height:22px; margin-bottom:18px;
    background:url(foodfare-logo.png) left center / auto 22px no-repeat; }
  .ffm-kicker { display:block; font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--red-text); }
  .ffm-kicker::before { content:''; display:block; width:32px; height:3px; margin-bottom:8px; background:var(--red); }
  .ffm-title { margin:8px 0 0; font-family:'Playfair Display',Georgia,serif; font-size:34px; line-height:1.1; font-weight:700;
    letter-spacing:normal; text-transform:none; color:var(--ink); }
  .ffm-sub { margin:8px 0 0; color:var(--muted); font-size:15px; line-height:1.4; }
  .ffm-chip { align-self:flex-start; display:inline-flex; align-items:center; gap:8px; margin:12px 32px 0; padding:10px 16px;
    background:var(--card); border-radius:999px; box-shadow:0 1px 4px rgba(26,26,26,.08); font-size:13px; color:var(--muted); }
  .ffm-chip[hidden] { display:none; }
  .ffm-chip b { font-weight:600; color:var(--ink); }
  .ffm-chip button { position:relative; border:0; background:none; padding:0; color:var(--red-text); font:inherit; font-weight:600;
    cursor:pointer; text-decoration:underline; text-underline-offset:2px; }
  .ffm-chip button::after { content:''; position:absolute; inset:-14px -8px; }
  .ffm-chip button:hover { color:var(--ink); }
  .ffm-body { flex:1 1 auto; overflow:auto; padding:24px 32px 24px; overscroll-behavior:contain;
    -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 12px); mask-image:linear-gradient(to bottom, transparent 0, #000 12px); }
  .ffm-foot { border-top:1px solid var(--line); padding:16px 32px; display:flex; align-items:center; justify-content:space-between;
    gap:4px 16px; flex-wrap:wrap; font-size:13px; color:var(--muted); background:var(--sheet); }
  .ffm-foot a { display:inline-block; padding:14px 0; margin:-14px 0; color:var(--red-text); font-size:14px; font-weight:600;
    text-decoration:underline; text-underline-offset:2px; }
  .ffm-foot a:hover { color:var(--ink); }
  .ffm-short { display:none; }   /* "Full flyer →" replaces the long link text on a phone */

  /* ── Product cards ──────────────────────────────────────────────────── */
  .ffm-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:16px; }
  .ffm-item { position:relative; display:flex; flex-direction:column; gap:6px; padding:12px; background:var(--card);
    border-radius:16px; box-shadow:0 2px 12px rgba(26,26,26,.08); transition:box-shadow .2s;
    animation:ffm-rise .5s cubic-bezier(.2,1,.32,1) both; animation-delay:calc(var(--i,0) * 45ms); }
  .ffm-item:hover { box-shadow:0 4px 18px rgba(26,26,26,.14); }
  .ffm-img { height:132px; display:block; padding:6px; border-radius:12px; background:var(--tile); }
  .ffm-img img { display:block; width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }   /* photos have white backgrounds: multiply melts them into the tile */
  .ffm-brand { font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; line-height:1.2; color:var(--red-text); }
  .ffm-name { font-size:15px; font-weight:600; line-height:1.25; }
  .ffm-meta { color:var(--muted); font-size:12px; }
  .ffm-pricerow { display:flex; align-items:baseline; gap:6px; flex-wrap:wrap; margin-top:2px; }
  .ffm-price { font-size:22px; font-weight:700; line-height:1.1; color:var(--red-text); }
  .ffm-price small { font-size:13px; font-weight:600; }
  .ffm-price small:first-of-type { font-size:inherit; font-weight:inherit; }   /* the cents are part of the price; only the unit (/lb) is small */
  .ffm-multi { margin-right:5px; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; vertical-align:middle; }
  .ffm-each { font-size:12px; font-weight:600; }
  .ffm-was { color:var(--muted); font-size:12px; text-decoration:line-through; }
  .ffm-kg { color:var(--red-text); font-size:13px; font-weight:600; }
  .ffm-save { position:absolute; top:12px; left:12px; z-index:2; padding:4px 10px; border-radius:999px; background:var(--red);
    color:#fff; font-size:11px; font-weight:700; line-height:1.3; }
  .ffm-note { margin:14px 0 0; font-size:13px; color:var(--muted); }

  /* ── Buttons: Add to cart, stepper, Continue to checkout ────────────── */
  .ffm-actions { margin-top:auto; display:flex; flex-direction:column; gap:6px; }
  .ffm-actions .ffm-btn { margin-top:6px; }
  .ffm-btn { margin-top:auto; display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:44px;
    padding:0 16px; border:0; border-radius:999px; background:var(--ink); color:#fff; font:inherit; font-size:14px; font-weight:600;
    letter-spacing:normal; text-transform:none; text-decoration:none; cursor:pointer; transition:background .15s, box-shadow .15s; }
  .ffm-btn:hover, .ffm-btn:focus-visible { background:var(--red); color:#fff; }
  .ffm-listctl { margin-top:auto; align-self:stretch; }
  .ffm-stepper { display:flex; align-items:center; justify-content:space-between; height:44px; padding:0 4px;
    border:1.5px solid var(--ink); border-radius:999px; }
  .ffm-stepper button { position:relative; flex:0 0 36px; width:36px; height:36px; padding:0; border:0; border-radius:50%;
    background:var(--tile); color:var(--ink); font:inherit; font-size:18px; font-weight:700; line-height:1; cursor:pointer;
    transition:background .15s; }
  .ffm-stepper button::after { content:''; position:absolute; inset:-4px; }   /* 36 px circle, 44 px touch target */
  .ffm-stepper button:last-child { background:var(--ink); color:#fff; }
  .ffm-stepper button:first-child:hover:not(:disabled) { background:var(--line); }
  .ffm-stepper button:last-child:hover:not(:disabled) { background:var(--red); }
  .ffm-stepper button:disabled { opacity:.35; cursor:default; }
  .ffm-stepper output { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
    padding:0 4px; text-align:center; line-height:1.05; }
  .ffm-stepper output b { font-size:15px; font-weight:700; }
  .ffm-stepper output small { font-size:10px; font-weight:400; color:var(--muted); }
  .ffm-stepper[data-ctx="card"] { position:relative; margin-top:16px; }   /* room for the "In cart" label above the pill */
  .ffm-tag { position:absolute; top:-16px; left:0; right:0; display:flex; align-items:center; justify-content:center; gap:4px;
    font-size:11px; font-weight:700; line-height:12px; letter-spacing:normal; text-transform:none; color:var(--green); }
  .ffm-stepper output b, .ffm-tag { white-space:nowrap; }

  /* ── Store picker ───────────────────────────────────────────────────── */
  .ffm-stores { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:12px; }
  .ffm-store { display:flex; flex-direction:column; align-items:flex-start; gap:4px; min-height:44px; padding:16px; border:0;
    border-radius:16px; background:var(--card); box-shadow:0 2px 12px rgba(26,26,26,.08); text-align:left; font:inherit; color:var(--ink);
    text-decoration:none; cursor:pointer; transition:box-shadow .2s; animation:ffm-rise .45s cubic-bezier(.2,1,.32,1) both;
    animation-delay:calc(var(--i,0) * 40ms); }
  .ffm-store:hover { box-shadow:0 4px 18px rgba(26,26,26,.14); }
  .ffm-store-name { font-size:16px; font-weight:700; }
  .ffm-store-addr { color:var(--muted); font-size:13px; }
  .ffm-store-go { margin-top:8px; color:var(--red-text); font-size:13px; font-weight:600; }
  .ffm-store-usual { align-self:flex-start; margin-bottom:4px; padding:3px 9px; border-radius:999px; background:var(--tile);
    color:var(--red-text); font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
  .ffm-back { display:inline-flex; align-items:center; min-height:44px; padding:0; border:0; background:none; color:var(--red-text);
    font:inherit; font-weight:600; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
  .ffm-back:hover { color:var(--ink); }

  /* ── Empty / error / loading ────────────────────────────────────────── */
  .ffm-empty { text-align:center; padding:28px 12px 18px; }
  .ffm-empty .ffm-title { margin:0; font-size:22px; }
  .ffm-empty p { margin:8px 0 0; color:var(--muted); }
  .ffm-skel { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:16px; }
  .ffm-skel div { height:270px; border-radius:16px; background:linear-gradient(100deg,var(--tile) 30%,var(--sheet) 50%,var(--tile) 70%);
    background-size:200% 100%; animation:ffm-shimmer 1.2s linear infinite; }
  .ffm-toast { position:fixed; left:50%; bottom:calc(28px + env(safe-area-inset-bottom, 0px)); transform:translateX(-50%); z-index:1100;
    max-width:calc(100vw - 32px); padding:12px 20px; border-radius:999px; background:var(--ink); color:#fff; font-size:14px;
    font-weight:600; text-align:center; box-shadow:0 6px 20px rgba(26,26,26,.3); animation:ffm-toast-in .35s cubic-bezier(.2,1,.32,1) both; }

  /* ── Flyer cart: floating Cart · N and the cart view ────────────────── */
  .ffl-fab { position:fixed; right:32px; bottom:calc(24px + env(safe-area-inset-bottom, 0px)); z-index:900; display:flex;
    align-items:center; height:52px; padding:0 22px; border:0; border-radius:999px; background:var(--red); color:#fff;
    font:inherit; font-size:15px; font-weight:700; cursor:pointer; box-shadow:0 6px 20px rgba(26,26,26,.3);
    transition:transform .2s cubic-bezier(.2,1,.32,1), background .15s; }
  .ffl-fab[hidden] { display:none; }
  .ffl-fab:hover { background:var(--red-text); transform:translateY(-1px); }
  .ffl-fab svg { margin-right:10px; }
  .ffl-fab b { margin-left:.3em; font-weight:700; }
  .ffl-rows { display:flex; flex-direction:column; gap:10px; }
  .ffl-row { display:grid; grid-template-columns:56px minmax(0,1fr) 44px; grid-template-rows:auto auto; gap:6px 12px; align-items:center;
    padding:10px 12px; background:var(--card); border-radius:16px; box-shadow:0 2px 12px rgba(26,26,26,.08); }
  .ffl-thumb { grid-row:1 / span 2; width:56px; height:56px; padding:3px; border-radius:12px; background:var(--tile); }
  .ffl-thumb img { display:block; width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
  .ffl-info { grid-column:2; grid-row:1; min-width:0; }
  .ffl-info { display:flex; flex-direction:column; gap:2px; }
  .ffl-toprow { display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
  .ffl-row .ffm-name { min-width:0; font-size:14px; }
  .ffl-price { flex:none; font-size:13px; font-weight:700; color:var(--red-text); white-space:nowrap; }
  .ffl-row .ffm-stepper { grid-column:2; grid-row:2; justify-self:start; gap:10px; height:40px; padding:0 3px; }
  .ffl-row .ffm-stepper button { flex-basis:32px; width:32px; height:32px; font-size:17px; }
  .ffl-row .ffm-stepper button::after { inset:-6px; }
  .ffl-row .ffm-stepper output b { font-size:14px; }
  .ffl-rm { grid-column:3; grid-row:1 / span 2; justify-self:center; display:grid; place-items:center; width:44px; height:44px; padding:0;
    border:0; background:none; color:var(--muted); cursor:pointer; }
  .ffl-rm:hover { color:var(--red-text); }
  /* Sticks to the card's real bottom edge: .ffm-body has 24px bottom padding (16px on phones), so a plain bottom:0 left a
     gap under the bar that rows scrolled through. The top 16px fade over the cream hides rows scrolling under it. */
  /* 16px wider than the rows on each side so the soft shadow of a row scrolling underneath can't peek out at its edges. */
  .ffl-buildbar { position:sticky; bottom:-24px; z-index:1; margin:2px -16px 0; padding:16px 16px 24px;
    background:linear-gradient(to bottom, rgba(251,244,232,0), var(--sheet) 16px); }
  .ffm-btn.ffl-build { min-height:52px; margin-top:0; background:var(--red); font-size:16px; font-weight:700;
    box-shadow:0 4px 14px rgba(227,30,36,.3); }
  .ffm-btn.ffl-build:hover, .ffm-btn.ffl-build:focus-visible { background:var(--red-text); }
  .ffl-clear { display:block; min-height:44px; margin:6px auto 0; padding:0 12px; border:0; background:none; color:var(--muted); font:inherit;
    font-size:13px; font-weight:600; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
  .ffl-clear:hover { color:var(--ink); }
  .ffl-clear.armed { color:var(--red-text); }

  @keyframes ffm-fade { from { opacity:0 } to { opacity:1 } }
  @keyframes ffm-pop { from { opacity:0; transform:translateY(34px) scale(.96) } to { opacity:1; transform:none } }
  @keyframes ffm-drop { to { opacity:0; transform:translateY(18px) scale(.98) } }
  @keyframes ffm-rise { from { opacity:0; transform:translateY(16px) } to { opacity:1; transform:none } }
  @keyframes ffm-toast-in { from { opacity:0; transform:translate(-50%,16px) } to { opacity:1; transform:translate(-50%,0) } }
  @keyframes ffm-shimmer { from { background-position:200% 0 } to { background-position:-200% 0 } }
  @keyframes ffm-up { from { transform:translateY(100%) } to { transform:none } }

  /* Tablet and narrower: the store chip drops under the sub instead of sitting beside the close button. */
  @media (min-width:901px) {
    .ffm-chip { position:absolute; top:30px; right:88px; margin:0; }
  }

  /* Phone: bottom sheet with a grabber. */
  @media (max-width:640px) {
    .ffm-backdrop { padding:0; align-items:flex-end; }
    .ffm-card { width:100%; max-height:92vh; max-height:calc(100dvh - 24px); border-radius:24px 24px 0 0;
      box-shadow:0 -8px 32px rgba(26,26,26,.18); animation:ffm-up .4s cubic-bezier(.2,1,.32,1) both; }
    .ffm-card::before { content:''; display:block; flex:none; width:40px; height:4px; margin:8px auto 0; border-radius:2px; background:var(--grab); }
    .ffm-close { top:20px; right:20px; }
    .ffm-head { padding:8px 20px 0; }
    .ffm-head::before { height:44px; margin-bottom:12px; background-size:auto 18px; }
    .ffm-kicker::before { width:28px; margin-bottom:6px; }
    .ffm-title { margin-top:6px; font-size:28px; line-height:1.15; }
    .ffm-sub { margin-top:6px; font-size:14px; }
    .ffm-chip { margin:12px 20px 0; padding:8px 14px; }
    .ffm-body { padding:14px 16px 16px; }
    .ffl-buildbar { bottom:-16px; padding-bottom:16px; }
    .ffm-foot { padding:12px 20px calc(18px + env(safe-area-inset-bottom, 0px)); font-size:12px; }
    .ffm-foot a { font-size:13px; white-space:nowrap; }
    .ffm-long { display:none; }
    .ffm-short { display:inline; }
    .ffm-grid, .ffm-skel { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
    .ffm-item { padding:10px; }
    .ffm-img { height:92px; }
    .ffm-save { top:10px; left:10px; padding:4px 9px; }
    .ffm-name { font-size:14px; }
    .ffm-price { font-size:20px; }
    .ffm-price small { font-size:12px; }
    .ffm-kg { font-size:12px; }
    .ffm-listctl .ffm-stepper output { padding:0 2px; }
    .ffl-fab { right:16px; bottom:calc(18px + env(safe-area-inset-bottom, 0px)); }
  }
  @media (max-width:360px) {
    .ffm-listctl .ffm-stepper button { flex-basis:32px; width:32px; height:32px; }
    .ffm-listctl .ffm-stepper button::after { inset:-6px; }
  }
  /* ── Desktop (>= 1024px): the same pop-up docked as a side panel next to the flyer ───────────────────────────────
     JS (matchMedia, same query) moves #ffm into .ffc-side and adds .ffm-docked; below 1024px nothing here applies and the
     pop-up / bottom sheet / Cart fab are exactly as above. Mock: PanelEmpty / PanelItem / PanelCart (2026-10-16). */
  .ffc-layout { box-sizing:border-box; width:100%; }
  .ffc-side { display:none; }
  .ffm-nav { position:relative; display:flex; align-items:center; gap:6px; min-height:32px; padding:0; border:0; background:none;
    color:var(--red-text); font:inherit; font-size:13px; font-weight:600; cursor:pointer; }
  .ffm-nav[hidden] { display:none; }
  .ffm-nav::after { content:''; position:absolute; inset:-6px -8px; }
  .ffm-nav:hover { color:var(--ink); }
  .ffm-nav svg { display:block; flex:none; }
  .ffm-dock { display:none; }
  .ffm-dock-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
  .ffm-dock-title { font-size:14px; font-weight:600; }
  .ffm-dock-link { position:relative; padding:0; border:0; background:none; color:var(--red-text); font:inherit; font-size:13px; font-weight:600;
    cursor:pointer; text-decoration:underline; text-underline-offset:2px; }
  .ffm-dock-link::after { content:''; position:absolute; inset:-14px -8px; }
  .ffm-dock-link:hover { color:var(--ink); }
  .ffm-dock-empty { font-size:14px; font-weight:600; color:var(--muted); }
  .ffm-dock-note { font-size:12px; text-align:center; color:var(--muted); }
  .ffm-prompt { display:flex; flex-direction:column; align-items:center; gap:14px; padding:32px 24px; border:2px dashed var(--grab);
    border-radius:16px; text-align:center; }
  .ffm-prompt-icon { display:grid; place-items:center; width:64px; height:64px; border-radius:50%; background:var(--card);
    box-shadow:0 2px 12px rgba(26,26,26,.08); color:var(--red); }
  .ffm-prompt-title { font-size:17px; font-weight:700; }
  .ffm-prompt-text { font-size:14px; line-height:1.45; color:var(--muted); }
  @media (min-width:1024px) {
    .ffc-layout { display:flex; align-items:flex-start; gap:32px; max-width:1280px; margin:0 auto; padding:0 24px; }
    .ffc-layout > #red-pepper-catalog { flex:1 1 auto; min-width:0; }
    .ffc-side { display:block; flex:none; width:380px; position:sticky; top:var(--ffc-top,24px);
      height:calc(100vh - var(--ffc-top,24px) - 24px); max-height:860px; }
  }
  .ffm-backdrop.ffm-docked { position:static; inset:auto; z-index:auto; display:block; height:100%; padding:0; background:none; animation:none; }
  .ffm-docked .ffm-card { width:100%; height:100%; max-height:none; border-radius:24px; box-shadow:0 8px 28px rgba(26,26,26,.12); animation:none; }
  .ffm-docked .ffm-close, .ffm-docked .ffm-foot, .ffm-docked .ffm-head::before { display:none; }
  .ffm-docked .ffm-head { padding:24px 24px 0; }
  .ffm-docked[data-nav="1"] .ffm-head { padding-top:20px; }
  .ffm-docked[data-nav="1"] .ffm-kicker { margin-top:10px; }
  .ffm-docked .ffm-kicker::before { width:28px; margin-bottom:6px; }
  .ffm-docked .ffm-title { margin-top:6px; font-size:26px; line-height:1.15; }
  .ffm-docked[data-view="home"] .ffm-title { font-size:28px; }
  .ffm-docked .ffm-sub { margin-top:6px; font-size:14px; }
  .ffm-docked .ffm-sub:empty { display:none; }
  .ffm-docked .ffm-chip { position:static; align-self:flex-start; margin:8px 24px 0; padding:7px 14px; }
  .ffm-docked .ffm-body { padding:16px 24px; }
  .ffm-docked[data-view="home"] .ffm-body { display:flex; flex-direction:column; justify-content:center; padding:20px 24px; }
  .ffm-docked .ffm-dock { display:flex; flex:none; flex-direction:column; gap:12px; padding:16px 24px 20px; background:var(--card);
    border-top:1px solid var(--line); }
  .ffm-docked .ffm-dock:empty { display:none; }
  .ffm-docked[data-view="list"] .ffm-dock { gap:6px; padding:16px 24px 14px; }
  .ffm-docked .ffm-dock .ffl-clear { margin:0 auto; }
  .ffm-docked .ffm-grid { display:flex; flex-direction:column; gap:12px; }
  .ffm-docked .ffm-item { gap:4px; min-height:120px; padding:12px 12px 12px 120px; }
  .ffm-docked .ffm-img { position:absolute; top:12px; left:12px; width:96px; height:96px; }
  .ffm-docked .ffm-save { position:static; align-self:flex-start; padding:3px 9px; }
  .ffm-docked .ffm-name { font-size:15px; }
  .ffm-docked .ffm-price { font-size:20px; }
  .ffm-docked .ffm-price small { font-size:12px; }
  .ffm-docked .ffm-kg { font-size:12px; }
  .ffm-docked .ffm-actions { margin-top:0; }
  .ffm-docked .ffm-actions .ffm-btn { margin-top:4px; }
  .ffm-docked .ffm-stepper[data-ctx="card"] { width:calc(100% - 66px); margin-top:4px; }   /* the "In cart" label sits to the right of the pill, as in the mock */
  .ffm-docked .ffm-tag { top:50%; right:auto; left:calc(100% + 10px); width:auto; justify-content:flex-start; gap:3px; transform:translateY(-50%); }
  .ffm-docked .ffm-skel { grid-template-columns:1fr; gap:12px; }
  .ffm-docked .ffm-skel div { height:120px; }
  .ffm-docked .ffl-row { padding:10px 8px 10px 12px; }
  .ffm-docked .ffm-stores { grid-template-columns:1fr; gap:10px; }
  @media (prefers-reduced-motion:reduce) {
    .ffm-backdrop, .ffm-card, .ffm-item, .ffm-store, .ffm-toast, .ffm-skel div { animation:none !important; }
    .ffm-item, .ffm-store, .ffm-close, .ffm-btn, .ffl-fab { transition:none !important; }
  }

/* ── Plugin only (added by the build script, not in flyer.html) ── */
.ffc-flyer { display:block; width:100%; }
.ffc-flyer #red-pepper-catalog { min-height:70vh; }
.ffc-flyer #red-pepper-catalog iframe#digital-catalogue-iframe { position:static !important; top:auto !important; left:auto !important; width:100% !important; height:100% !important; }
.ffc-flyer .ffc-loading { text-align:center; color:#777; padding:60px 0 0; font-size:14.4px; margin:0; }
.ffm-backdrop { z-index:100000; }
.ffl-fab { z-index:99990; }
.ffm-toast { z-index:100010; }